/*
Theme Name: RIDGE
Theme URI: https://ridge-mountaingear.com/
Author: Dive Inc. / Ueda
Description: RIDGE MOUNTAIN GEAR ブランドサイト用オリジナルテーマ（静的プロトタイプからの移植）
Version: 1.22.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: ridge
*/

/* RIDGE brand site — design tokens (wanderout原則適用版)
   縦は贅沢に、横は詰める / 線を引かない / 見出しは小さく写真は大きく / セリフ1系統 */
:root {
  --paper: #f2f2f0;
  --ink: #1a1a1a;
  --muted: #5c5c58;
  --line: #dcdcd8;
  --surface: #ececea;
  --mist: #e6e6e3;
  --smoke: #d8d8d4;
  --radius: 0px;
  --margin: 48px;
  --maxw: 1560px;
  --gap: 6px;
  --serif-en: "Cormorant Garamond", "EB Garamond", serif;
  --serif-jp: "Shippori Mincho", "Noto Serif JP", serif;
  --lh: 28px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Noto Serif JP", "Shippori Mincho", serif;
  font-size: 15px;
  line-height: 2;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
/* width/height 属性付きの画像が縦に伸びないように（個別の height 指定はこれより優先される） */
:where(img) { height: auto; }
button { border: 0; color: inherit; background: transparent; font: inherit; cursor: pointer; }
::selection { color: #fff; background: var(--ink); }

.site-header {
  height: 60px;
  padding: 0 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--paper);
}
.logo { display: inline-flex; align-items: center; line-height: 1; }
.logo img { width: auto; height: 20px; }
body.is-locked { overflow: hidden; }
.menu-toggle {
  width: 36px;
  height: 36px;
  position: relative;
}
.menu-toggle::before,
.menu-toggle::after {
  content: "";
  width: 22px;
  height: 1.5px;
  position: absolute;
  left: 7px;
  background: currentColor;
}
.menu-toggle::before { top: 14px; }
.menu-toggle::after { top: 21px; }
.menu-toggle:hover { opacity: .55; }

.menu {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: flex;
  flex-direction: column;
  background: var(--paper);
  opacity: 0;
  visibility: hidden;
  transition: opacity .35s ease, visibility .35s ease;
}
.menu.is-open { opacity: 1; visibility: visible; }
.menu__bar {
  height: 60px;
  padding: 0 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: none;
}
.menu__close {
  width: 36px;
  height: 36px;
  position: relative;
}
.menu__close::before,
.menu__close::after {
  content: "";
  width: 22px;
  height: 1.5px;
  position: absolute;
  top: 17px;
  left: 7px;
  background: currentColor;
}
.menu__close::before { transform: rotate(45deg); }
.menu__close::after { transform: rotate(-45deg); }
.menu__close:hover { opacity: .55; }
.menu__list {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(26px, 6vh, 62px);
  margin: 0;
  padding: 0 0 4vh;
  list-style: none;
}
.menu__link {
  font-family: var(--serif-en);
  font-size: 24px;
  letter-spacing: .16em;
  color: var(--ink);
  transition: opacity .2s ease;
}
.menu__link--jp { font-family: var(--serif-jp); font-size: 20px; }
.menu__link:hover { opacity: .5; }
.menu__link.is-current { opacity: .45; }
.menu__social {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  padding: 0 0 9vh;
}
.menu__social a { display: inline-flex; opacity: .82; transition: opacity .2s ease; }
.menu__social a:hover { opacity: .45; }
.menu__social svg { width: 18px; height: 18px; fill: var(--ink); }
.menu__social a[aria-label="YouTube"] svg { width: 22px; height: 22px; }

.main { min-height: 70vh; }

/* ---------- 一覧ページ ヒーロー ---------- */
.page-hero {
  width: calc(100% - (var(--margin) * 2));
  max-width: calc(var(--maxw) - 60px);
  margin: clamp(28px, 4vw, 56px) auto 0;
  display: grid;
  grid-template-columns: minmax(0, .52fr) minmax(300px, .48fr);
  gap: clamp(32px, 5vw, 80px);
  align-items: center;
}
.page-hero--quiet { grid-template-columns: 1fr; }
.page-hero__image { overflow: hidden; background: var(--mist); order: 2; }
.page-hero__image img { aspect-ratio: 5 / 6; height: 100%; object-fit: cover; }
.page-hero__body {
  order: 1;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(18px, 3vh, 36px);
  background: transparent;
}
.page-hero__body--dark { color: var(--ink); background: transparent; }
.eyebrow {
  display: block;
  margin: 0 0 16px;
  color: var(--ink);
  font-family: var(--serif-en);
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.page-title {
  margin: 0;
  font-family: var(--serif-jp);
  font-size: clamp(26px, 2.6vw, 38px);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: .1em;
}
.page-title--jp, .page-title--long { font-size: clamp(24px, 2.4vw, 36px); letter-spacing: .1em; line-height: 1.65; }
.page-lead {
  max-width: 560px;
  margin: 0;
  font-family: var(--serif-jp);
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 2.2;
  letter-spacing: .04em;
}
.page-summary {
  margin: 18px 0 0;
  max-width: 520px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 2.2;
}

/* ---------- セクション ---------- */
.shell {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: clamp(90px, 12vw, 190px) var(--margin) 0;
}
.shell:last-of-type { padding-bottom: clamp(90px, 12vw, 160px); }
.shell--tight { max-width: 1200px; }
.section-head {
  display: grid;
  grid-template-columns: minmax(160px, .34fr) minmax(0, .66fr);
  gap: clamp(22px, 3vw, 44px);
  align-items: end;
  margin-bottom: clamp(30px, 4vw, 56px);
}
.section-title {
  margin: 0;
  font-family: var(--serif-en);
  font-size: clamp(22px, 2vw, 28px);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.section-head--stack { grid-template-columns: 1fr; align-items: start; gap: 14px; }
.principles-stack { margin-top: clamp(28px, 4vw, 48px); }
.principles-stack .numbered-item { padding: 0 0 clamp(30px, 4vw, 46px); border-top: 0; }
.principles-stack .numbered-item:last-child { padding-bottom: 0; }
.principles-stack .numbered-item h3 { margin: 0 0 10px; }
.principles-stack .numbered-item p { margin: 0; }
.section-copy {
  max-width: 680px;
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 2.2;
}
.text-link {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 8px;
  margin-top: 22px;
  font-family: var(--serif-jp);
  font-size: 12.5px;
  letter-spacing: .06em;
}
.text-link::after { content: "→"; transform: translateY(-1px); }
.text-link:hover { opacity: .5; }

.filter-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 22px;
  margin: -14px 0 clamp(30px, 4vw, 56px);
}
.chip {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0;
  border: 0;
  color: var(--muted);
  font-family: var(--serif-en);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.chip:hover { color: var(--ink); }
.chip.is-current { color: var(--ink); border-bottom: 1px solid var(--ink); }

/* ---------- カードグリッド（横は詰める） ---------- */
.cards {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 44px var(--gap);
}
.article-card {
  grid-column: span 4;
  display: flex;
  min-height: 100%;
  flex-direction: column;
  border: 0;
}
.article-card--wide { grid-column: span 4; }
.article-card--half { grid-column: span 6; }
.article-card__image {
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: var(--mist);
}
.article-card--wide .article-card__image { aspect-ratio: 2 / 3; }
.article-card__image img { height: 100%; object-fit: cover; transition: transform .9s ease, opacity .4s ease; }
a.article-card:hover .article-card__image img { transform: scale(1.015); }
.article-card__body {
  padding: 14px 2px 0;
  display: grid;
  gap: 7px;
}
.article-card__meta {
  color: var(--muted);
  font-family: var(--serif-en);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.article-card__title {
  margin: 0;
  font-family: var(--serif-jp);
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: .05em;
}
.article-card__text {
  margin: 0;
  max-width: 560px;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 2;
}

/* ---------- ストーリー（分割セクション） ---------- */
.story-grid {
  display: grid;
  grid-template-columns: minmax(0, .42fr) minmax(0, .58fr);
  gap: clamp(32px, 6vw, 96px);
  align-items: start;
}
.story-grid__image { position: sticky; top: 40px; overflow: hidden; background: var(--mist); }
.story-grid__image img { aspect-ratio: 4 / 5; height: 100%; object-fit: cover; }
.story-copy { max-width: 640px; padding-top: clamp(4px, 1vw, 16px); }
.story-copy p {
  margin: 0 0 26px;
  color: var(--ink);
  font-size: 14px;
  line-height: 2.4;
  letter-spacing: .03em;
}
.numbered-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 clamp(28px, 4vw, 64px);
}
.numbered-item {
  min-height: 0;
  padding: 26px 0 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
}
.numbered-item__num { color: var(--muted); font-family: var(--serif-en); font-size: 12px; letter-spacing: .16em; }
.numbered-item h3 { margin: 22px 0 12px; font-family: var(--serif-jp); font-size: clamp(16px, 1.4vw, 19px); font-weight: 500; line-height: 1.7; letter-spacing: .08em; }
.numbered-item p { margin: 0; color: var(--muted); font-size: 12px; line-height: 2.1; }

/* 引用: 帯ではなく余白で見せる */
.quote-band {
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(100px, 14vw, 220px) var(--margin) 0;
  border-radius: 0;
  color: var(--ink);
  background: transparent;
}
.quote-band p {
  max-width: 880px;
  margin: 0;
  font-family: var(--serif-jp);
  font-size: clamp(20px, 2.4vw, 32px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: .1em;
}
.media-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--gap);
}
.media-grid img { height: 100%; min-height: 360px; object-fit: cover; background: var(--mist); }
.media-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.media-grid--three img { min-height: 0; aspect-ratio: 4 / 5; }

/* ---------- 詳細ページ ---------- */
.detail-hero {
  width: calc(100% - (var(--margin) * 2));
  max-width: calc(var(--maxw) - 60px);
  margin: clamp(28px, 4vw, 56px) auto 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  overflow: hidden;
  background: var(--mist);
}
.detail-hero__image { max-height: 720px; overflow: hidden; }
.detail-hero__image img { height: 100%; max-height: 720px; object-fit: cover; }
.detail-head { max-width: 1200px; margin: 0 auto; padding: clamp(70px, 9vw, 130px) var(--margin) clamp(40px, 5vw, 70px); }
.detail-title {
  max-width: 900px;
  margin: 26px 0 0;
  font-family: var(--serif-jp);
  font-size: clamp(26px, 3vw, 42px);
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: .1em;
}
.detail-name {
  margin: clamp(24px, 3vw, 40px) 0 0;
  font-family: var(--serif-jp);
  font-size: 13px;
  letter-spacing: .08em;
}
.detail-name span { margin-left: 14px; color: var(--muted); font-size: 11.5px; }
.detail-lead {
  max-width: 640px;
  margin: clamp(28px, 4vw, 52px) 0 0 auto;
  color: var(--ink);
  font-size: 14.5px;
  line-height: 2.3;
  letter-spacing: .03em;
}
.article-body { max-width: 760px; margin: 0 auto; padding: 0 var(--margin) clamp(80px, 10vw, 150px); }
.article-body h2 { margin: clamp(60px, 8vw, 100px) 0 22px; font-family: var(--serif-jp); font-size: clamp(18px, 1.8vw, 23px); font-weight: 500; line-height: 1.8; letter-spacing: .1em; }
.article-body p { margin: 0 0 26px; color: var(--ink); font-size: 14px; line-height: 2.4; letter-spacing: .03em; }
.article-body blockquote { margin: clamp(56px, 7vw, 90px) 0; padding: 0 0 0 28px; border-left: 1px solid var(--ink); background: transparent; }
.article-body blockquote p { margin: 0; color: var(--ink); font-family: var(--serif-jp); font-size: clamp(17px, 1.8vw, 22px); line-height: 2.1; letter-spacing: .08em; }

.episodes { display: grid; gap: 0; background: transparent; border: 0; border-top: 1px solid var(--line); }
.episode { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; gap: 22px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--line); background: transparent; }
.episode__num { color: var(--muted); font-family: var(--serif-en); font-size: 12px; letter-spacing: .14em; }
.episode h3 { margin: 0; font-family: var(--serif-jp); font-size: clamp(15px, 1.4vw, 18px); font-weight: 500; line-height: 1.7; letter-spacing: .06em; }
.episode p { margin: 6px 0 0; color: var(--muted); font-size: 11.5px; line-height: 2; }
.episode__arrow { color: var(--muted); }

.cta-panel {
  margin-top: clamp(70px, 9vw, 130px);
  padding: clamp(34px, 4vw, 52px) 0 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  border-top: 1px solid var(--ink);
  border-radius: 0;
  background: transparent;
}
.cta-panel h2 { margin: 0; font-family: var(--serif-en); font-size: clamp(20px, 2vw, 26px); font-weight: 400; line-height: 1.4; letter-spacing: .14em; text-transform: uppercase; }
.cta-panel p { max-width: 560px; margin: 14px 0 0; color: var(--muted); font-size: 12.5px; line-height: 2.1; }

.not-found { min-height: calc(100svh - 64px); display: grid; place-items: center; padding: var(--margin); text-align: center; }
.not-found h1 { margin: 0; font-family: var(--serif-en); font-size: clamp(80px, 18vw, 220px); font-weight: 400; line-height: .9; letter-spacing: .04em; }
.not-found p { max-width: 520px; margin: 36px auto 0; color: var(--muted); line-height: 2.1; font-size: 13px; }

.footer {
  max-width: var(--maxw);
  margin: clamp(100px, 13vw, 200px) auto 0;
  padding: 0 var(--margin) 44px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  border-top: 0;
  text-align: center;
}
.footer__brand { display: inline-flex; align-items: center; line-height: 1; }
.footer__brand img { width: auto; height: 15px; }
.footer__meta { color: var(--muted); font-family: var(--serif-en); font-size: 11px; letter-spacing: .12em; text-align: center; text-transform: uppercase; display: grid; gap: 4px; }

/* ---------- Collaborator detail additions ---------- */
.facts-shell { padding-top: 0; }
.facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 64px);
  padding: clamp(34px, 4vw, 52px) 0 0;
  border: 0;
  border-top: 1px solid var(--ink);
  border-radius: 0;
  background: transparent;
}
.facts__list { margin: 0; }
.facts__row { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.facts__row:last-child { border-bottom: 0; }
.facts__row dt { color: var(--muted); font-size: 11px; line-height: 2; letter-spacing: .06em; }
.facts__row dd { margin: 0; font-size: 12px; line-height: 2; overflow-wrap: anywhere; }
.facts__products { margin: 0; padding: 0; list-style: none; }
.facts__products li { padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.facts__products li:last-child { border-bottom: 0; }
.facts__products a { display: inline-flex; align-items: center; gap: 8px; }
.facts__products a::after { content: "→"; color: var(--muted); }
.facts__products a:hover { opacity: .5; }
.facts__note { margin: 14px 0 0; color: var(--muted); font-size: 11px; }

@media (max-width: 980px) {
  :root { --margin: 20px; }
  .site-header, .menu__bar { padding: 0 var(--margin); }
  .page-hero { width: calc(100% - (var(--margin) * 2)); grid-template-columns: 1fr; gap: 28px; margin-top: 20px; }
  .page-hero__image { order: 1; }
  .page-hero__body { order: 2; gap: 28px; }
  .section-head { grid-template-columns: 1fr; align-items: start; }
  .cards { gap: 40px var(--gap); }
  .article-card, .article-card--wide, .article-card--half { grid-column: span 12; }
  .story-grid { grid-template-columns: 1fr; }
  .story-grid__image { position: static; }
  .numbered-grid { grid-template-columns: 1fr; gap: 34px 0; }
  .media-grid, .media-grid--three { grid-template-columns: 1fr; }
  .detail-hero { width: calc(100% - (var(--margin) * 2)); }
  .detail-head { padding-left: var(--margin); padding-right: var(--margin); }
  .detail-lead { margin-left: 0; }
  .article-body { padding-left: var(--margin); padding-right: var(--margin); }
  .episode { grid-template-columns: 1fr; align-items: start; gap: 8px; }
  .episode__arrow { display: none; }
  .cta-panel { grid-template-columns: 1fr; }
  .facts { grid-template-columns: 1fr; }
}

/* collaborator intro */
.collab-intro { padding-top: clamp(70px, 9vw, 140px); padding-left: 0; padding-right: 0; } /* 内側の .article-body が余白を持つので二重にしない */
.collab-intro__body { padding-bottom: 0; }
.collab-intro__body h2 { margin-top: clamp(50px, 6vw, 80px); }
.collab-quote { max-width: 760px; margin: 0 auto; padding: clamp(24px, 3vw, 40px) var(--margin) 0; }
.collab-quote p { max-width: none; font-family: "Noto Serif JP", serif; font-size: 14px; font-weight: 400; line-height: 2.4; letter-spacing: .03em; color: var(--ink); }
.collab-quote p.collab-quote__close { margin-top: 26px; font-size: 14px; line-height: 2.4; letter-spacing: .03em; }

/* category tiles */
.cat-tiles-shell { padding-top: clamp(80px, 10vw, 160px); }
.cat-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.cat-tile { position: relative; display: block; overflow: hidden; background: var(--mist); }
.cat-tile img { aspect-ratio: 4 / 5; height: 100%; object-fit: cover; transition: transform .9s ease; }
.cat-tile:hover img { transform: scale(1.015); }
.cat-tile__label { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-family: var(--serif-en); font-size: clamp(20px, 2vw, 28px); font-weight: 400; letter-spacing: .16em; text-shadow: 0 0 24px rgba(0,0,0,.25); }
@media (max-width: 860px) { .cat-tiles { grid-template-columns: 1fr; } .cat-tile img { aspect-ratio: 4 / 3; } }

/* hero category shortcuts */
.hero-cats { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 30px; }
.hero-cats a { display: inline-flex; align-items: baseline; gap: 7px; padding-bottom: 3px; border-bottom: 1px solid var(--ink); font-family: var(--serif-en); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; transition: opacity .2s ease; }
.hero-cats a span { color: var(--muted); font-size: 11px; letter-spacing: .08em; }
.hero-cats a:hover { opacity: .5; }

/* diary */
.article-card--diary .article-card__image { aspect-ratio: 3 / 2; }
.diary-plain { display: flex; align-items: center; justify-content: center; background: var(--mist); padding: 20px; }
.diary-plain span { font-family: var(--serif-jp); font-size: 15px; line-height: 2; letter-spacing: .12em; color: var(--muted); text-align: center; }
.essay-fig { margin: clamp(40px, 5vw, 64px) 0; padding: 0; }
.essay-fig img { width: 100%; height: auto; display: block; }
.article-body p.essay-sign { margin-top: 56px; margin-bottom: 0; text-align: right; letter-spacing: .08em; }
.article-body p.essay-note { margin-top: 40px; margin-bottom: 0; color: var(--muted); font-size: 11.5px; line-height: 2.2; }

/* sense */
.article-card--sense .article-card__image { aspect-ratio: 3 / 2; }
.essay-video { margin: clamp(40px, 5vw, 64px) 0; padding: 0; }
.essay-video iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; background: var(--mist); }
.essay-video--tall { max-width: 400px; margin-left: auto; margin-right: auto; }
.essay-video--tall iframe { aspect-ratio: 9 / 16; }

/* collaborator detail: PC layout fixes */
.detail-hero--fixed .detail-hero__image { aspect-ratio: 21 / 10; max-height: 720px; }
.detail-hero--fixed .detail-hero__image img { width: 100%; height: 100%; object-fit: cover; }
.detail-head--split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 440px); gap: 28px 90px; align-items: end; }
.detail-head--split .detail-head__main { min-width: 0; }
.detail-head--split .detail-lead { margin: 0; max-width: none; }
@media (max-width: 900px) {
  .detail-head--split { grid-template-columns: 1fr; align-items: start; }
}

/* ---- EC store link (article footer) ---- */
.ec-box { margin: clamp(48px, 6vw, 72px) auto 0; padding: 30px 0 0; border-top: 1px solid #d9d9d5; }
.ec-box .eyebrow { display: block; margin-bottom: 20px; }
.ec-items { display: grid; gap: 6px; }
.ec-item { display: flex; align-items: center; gap: 22px; background: #fff; padding: 14px 24px 14px 14px; text-decoration: none; color: inherit; transition: opacity .25s ease; }
.ec-item:hover { opacity: .7; }
.ec-item__thumb { width: 86px; height: 86px; flex: none; overflow: hidden; background: #eee; }
.ec-item__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ec-item__body { flex: 1; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.ec-item__name { font-family: var(--serif-jp); font-size: 15px; letter-spacing: .06em; line-height: 1.5; }
.ec-item__link { font-size: 11px; letter-spacing: .16em; color: #8a8a85; }
.ec-item__arrow { flex: none; font-size: 14px; color: #8a8a85; }
@media (max-width: 560px) {
  .ec-item { gap: 14px; padding: 10px 16px 10px 10px; }
  .ec-item__thumb { width: 68px; height: 68px; }
}

/* ---- Collaborator information split (logo + info) ---- */
.info-split { max-width: 760px; margin: 0 auto; padding: 0 var(--margin) clamp(80px, 10vw, 150px); }
.info-split__rule { border-top: 1px solid #d9d9d5; padding-top: 30px; }
.info-split__rule > .eyebrow { display: block; margin-bottom: 24px; }
.info-split__box { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
.info-split__logo { background: #fff; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; padding: 26px; }
.info-split__logo img { max-width: 100%; max-height: 62%; object-fit: contain; display: block; }
.info-split__logo-text { font-family: var(--serif-jp); font-size: 13px; letter-spacing: .18em; line-height: 2.1; color: var(--ink); text-align: center; }
@media (max-width: 640px) {
  .info-split__box { grid-template-columns: 1fr; }
  .info-split__logo { max-width: 220px; }
}

/* ---- Our Story v2 (timeline) ---- */
.story-head { text-align: center; padding: clamp(36px, 5vw, 64px) var(--margin) clamp(24px, 3vw, 40px); }
.story-head h1 { margin: 0; font-family: var(--serif-en); font-size: clamp(26px, 2.8vw, 38px); font-weight: 400; letter-spacing: .14em; }
.story-hero img { width: 100%; aspect-ratio: 5 / 2; object-fit: cover; }
.story-about { max-width: 760px; margin: 0 auto; padding: clamp(64px, 9vw, 120px) var(--margin) clamp(30px, 4vw, 50px); }
.story-about h2 { margin: 0 0 28px; font-family: var(--serif-jp); font-size: clamp(19px, 2vw, 24px); font-weight: 500; letter-spacing: .08em; }
.story-about p { margin: 0; font-size: 15px; line-height: 2.5; letter-spacing: .04em; }
.story-timeline { max-width: 1020px; margin: 0 auto; padding: clamp(70px, 10vw, 130px) var(--margin) 0; }
.story-era { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: clamp(22px, 4vw, 56px); border-top: 1px solid var(--line); margin-top: clamp(44px, 6vw, 72px); padding-top: clamp(44px, 6vw, 72px); }
.story-era:first-of-type { margin-top: clamp(30px, 4vw, 48px); }
.story-era__year { margin: 0; font-family: var(--serif-en); font-size: clamp(20px, 2vw, 26px); font-weight: 400; letter-spacing: .08em; line-height: 1.4; position: sticky; top: 28px; align-self: start; }
.story-era__body p { margin: 0 0 24px; font-size: 14px; line-height: 2.4; letter-spacing: .03em; }
.story-era__body figure { margin: clamp(30px, 4vw, 48px) 0 8px; }
.story-era__body img { width: 100%; display: block; }
.story-era__pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); margin: clamp(14px, 2vw, 20px) 0 8px; }
.story-close { max-width: 760px; margin: 0 auto; padding: clamp(80px, 10vw, 140px) var(--margin) clamp(100px, 13vw, 170px); text-align: center; }
.story-close p { margin: 0; font-family: var(--serif-jp); font-size: clamp(15px, 1.6vw, 19px); line-height: 2.6; letter-spacing: .08em; }
@media (max-width: 720px) {
  .story-era { grid-template-columns: 1fr; gap: 18px; }
  .story-era__year { position: static; }
}

/* ---- menu About us group ---- */
.menu__label { color: var(--muted); font-family: var(--serif-en); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; margin-bottom: clamp(-18px, -3vh, -40px); }
.page-hero__body--tight { gap: clamp(18px, 3vh, 36px); }
/* ---------- ページ個別の追加ルール（静的版で各ページに埋め込まれていたもの） ---------- */
.quote-band p span { display: inline-block; }
.page-lead span { display: inline-block; }
body.page-about .page-lead, body.page-philosophy .page-lead, body.page-collaborator .page-lead { max-width: 640px; }
.story-close p span { display: inline-block; }

/* ---------- トップページ（静的版 index.html 固有スタイル） ---------- */
body.home { --ink: #333333; color: var(--ink); font-family: "Noto Sans JP", "Helvetica Neue", Arial, sans-serif; line-height: 1.8; }
body.home .menu__link { letter-spacing: .18em; }
@media (max-width: 980px) { .menu__link { font-size: 18px; } .menu__link--jp { font-size: 16px; } .menu__list { gap: clamp(16px, 3.2vh, 30px); } }
.tiles { max-width: 1560px; margin: 10px auto 0; padding: 0 var(--margin); display: grid; gap: var(--gap); }
.tile { position: relative; display: block; overflow: hidden; background: #eceee8; }
.tile img { height: 100%; object-fit: cover; transition: transform .8s ease; }
.tile:hover img { transform: scale(1.02); }
.tile__label { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; color: #fff; font-family: var(--serif-en); font-weight: 400; font-size: clamp(12px, 1.9vw, 26px); letter-spacing: .18em; text-indent: .18em; text-shadow: 0 0 24px rgba(0,0,0,.22); }
.tile__label--jp { font-family: var(--serif-jp); letter-spacing: .14em; text-indent: .14em; }
.tile-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--gap); }
.tile-row--mirror { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.tile-col { display: grid; grid-template-rows: 1fr 1fr; gap: var(--gap); }
.tile--main { aspect-ratio: 1005 / 952; }
.tile-row--mirror .tile--main { aspect-ratio: 992 / 992; }
.tile-col .tile { min-height: 0; }
.tile-col .tile img { position: absolute; inset: 0; height: 100%; }
/* NEWSパネル: 写真なし・薄いグレーの面に黒文字 */
.tile--panel { background: #ededed; transition: background .3s ease; }
.tile--panel .tile__label { color: var(--ink); text-shadow: none; }
.tile--panel:hover { background: #e4e4e2; }
/* 下段: 同じ大きさの4枚を2×2（スマホも2×2）。上段（ほぼ正方形）に合わせて正方形 */
.tile-row--quad { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tile-row--quad .tile { aspect-ratio: 1 / 1; }
/* 下段が3枚のとき: 上段の小タイルと同じ大きさ・同じ列位置で3列 */
.tile-row--trio { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tile-row--trio .tile { aspect-ratio: 486 / 460; }
/* 上段も3等分グリッドにして、下段3枚と列の線をピクセル単位で揃える */
.tiles:has(.tile-row--trio) > .tile-row:first-child { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tiles:has(.tile-row--trio) > .tile-row:first-child > .tile--main { grid-column: span 2; }
.tile-row--trio .tile img { position: absolute; inset: 0; height: 100%; }
.tile-row--quad .tile img { position: absolute; inset: 0; height: 100%; }
body.home .footer__meta { color: #5c5c58; }
/* トップページはタイル直下にフッターを寄せる */
body.home .footer { margin-top: 32px; padding-bottom: 32px; }
@media (max-width: 860px) {
  .tiles { margin-top: 4px; }
  /* スマホではタイルの文字を大きく・影を強めて読みやすく */
  .tile__label { font-size: 17px; letter-spacing: .12em; text-indent: .12em; text-shadow: 0 1px 3px rgba(0,0,0,.45), 0 0 20px rgba(0,0,0,.35); }
  .tile__label { text-align: center; padding: 0 10px; line-height: 1.6; }
  .tile-col .tile__label { font-size: 14px; letter-spacing: .08em; text-indent: .08em; }
  /* スマホでは7枚のタイルを1画面（ヘッダー除く）に敷き詰める */
  /* フッター（©表示）も含めて1画面に収める: ヘッダー + 4px + タイル + フッター(14+20+14=48px) */
  body.home .footer { margin-top: 14px; padding-bottom: 14px; }
  body.home .footer__meta { line-height: 20px; }
  .tiles { height: calc(100svh - var(--header-h) - 4px - 48px); grid-template-rows: 1fr 1fr; }
  .admin-bar .tiles { height: calc(100svh - var(--header-h) - 4px - 48px - 46px); }
  .tile-row { min-height: 0; }
  .tile--main, .tile-row--mirror .tile--main { aspect-ratio: auto; min-height: 0; height: 100%; }
  .tile--main img { position: absolute; inset: 0; height: 100%; }
  /* 下段の4枚はスマホでは2×2 */
  .tile-row--quad { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 1fr 1fr; }
  .tile-row--quad .tile { aspect-ratio: auto; min-height: 0; height: 100%; }
  .tile-row--quad .tile__label { font-size: 14px; letter-spacing: .08em; text-indent: .08em; }
  /* 下段3枚はスマホでも3列（上段の小タイルと同じ幅）。上段:下段 = 2:1 の高さで1画面に */
  .tiles:has(.tile-row--trio) { grid-template-rows: 2fr 1fr; }
  .tile-row--trio .tile { aspect-ratio: auto; min-height: 0; height: 100%; }
  .tile-row--trio .tile__label { font-size: 13px; letter-spacing: .06em; text-indent: .06em; }
}

/* ---------- WordPress 由来の要素を無効化 ---------- */
.admin-bar .menu { top: 32px; }
@media (max-width: 782px) { .admin-bar .menu { top: 46px; } }

/* トップページは静的版 index.html の余白設定を優先 */
body.home { --margin: 48px; --gap: 6px; }
body.home .site-header { padding: 0 30px; }
@media (max-width: 860px) { body.home { --margin: 12px; --gap: 4px; } body.home .site-header, body.home .menu__bar { padding: 0 var(--margin); } }

/* Information 内のリンク */
.facts__row dd a { border-bottom: 1px solid var(--line); transition: opacity .2s ease; }
.facts__row dd a:hover { opacity: .5; }

/* ---------- ブロックエディタで追加した画像・動画も静的版と同じ幅に（essay-fig クラス不要） ---------- */
.article-body figure { margin: clamp(40px, 5vw, 64px) 0; padding: 0; }
.article-body figure img { width: 100%; height: auto; display: block; }
.article-body figure figcaption { margin-top: 10px; color: var(--muted); font-size: 11.5px; line-height: 2; letter-spacing: .04em; text-align: left; }
.article-body .wp-block-embed iframe, .article-body .wp-block-embed__wrapper iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; background: var(--mist); }
.article-body .wp-block-gallery { margin: clamp(40px, 5vw, 64px) 0; }
.article-body .wp-block-gallery figure { margin: 0; }
.article-body ul, .article-body ol { margin: 0 0 26px; padding-left: 1.4em; font-size: 14px; line-height: 2.4; letter-spacing: .03em; }
.article-body a { border-bottom: 1px solid var(--line); }

/* ---------- ヒーロー（page-hero / detail-hero）の左右をセクション幅（.shell）に揃える ---------- */
.page-hero, .detail-hero { width: 100%; max-width: var(--maxw); padding-left: var(--margin); padding-right: var(--margin); }
.detail-hero { background: transparent; }
.detail-hero__image { background: var(--mist); }

/* ---------- 一覧の「もっと見る」 ---------- */
.cards__more { display: none; }
.load-more { display: flex; justify-content: center; margin-top: clamp(48px, 6vw, 80px); }
.load-more__btn { min-height: 40px; padding: 0 4px; border-bottom: 1px solid var(--line); color: var(--ink); font-size: 13px; letter-spacing: .2em; text-transform: none; cursor: pointer; }
.load-more__btn:hover { opacity: .5; }
.load-more__count { margin-left: 8px; color: var(--muted); font-size: 11px; letter-spacing: .08em; }

/* ---------- ヘッダーのサイズ（ロゴ・メニューボタン・高さ） ---------- */
:root { --header-h: 80px; --logo-h: 24px; --toggle-w: 26px; }
@media (max-width: 980px) { :root { --header-h: 68px; --logo-h: 19px; --toggle-w: 22px; } }
.site-header, .menu__bar { height: var(--header-h); }
.logo img { height: var(--logo-h); }
.menu-toggle { width: 44px; height: 44px; }
.menu-toggle::before, .menu-toggle::after { width: var(--toggle-w); left: calc((44px - var(--toggle-w)) / 2); }
.menu-toggle::before { top: 17px; }
.menu-toggle::after { top: 26px; }
.menu__close { width: 44px; height: 44px; }
.menu__close::before, .menu__close::after { width: var(--toggle-w); left: calc((44px - var(--toggle-w)) / 2); top: 21px; }

/* ---------- ヘッダー（ロゴ・メニューボタン）をコンテンツ幅に揃える ---------- */
@media (min-width: 981px) {
  .site-header, .menu__bar { width: 100%; max-width: var(--maxw); margin-left: auto; margin-right: auto; padding-left: var(--margin); padding-right: var(--margin); }
  body.home .site-header, body.home .menu__bar { padding-left: var(--margin); padding-right: var(--margin); }
}

/* 本文中のリンク用注記（原稿の「〇〇公式サイト」など。リンク先URL確定までは文字のみ） */
.article-body .ref-note { display: inline-block; margin-top: 4px; font-size: 12px; line-height: 1.8; color: var(--muted); letter-spacing: .04em; }

/* Collaborator 一覧カード: 工場名を大きく、説明は2行まで */
.article-card--collab .article-card__body { padding-top: clamp(16px, 1.6vw, 24px); gap: clamp(10px, 1vw, 16px); }
.article-card--collab .collab-card__name { font-family: var(--serif-jp); font-size: clamp(15px, 1.15vw, 18px); font-weight: 400; line-height: 1.6; letter-spacing: .06em; color: var(--ink); }
.article-card--collab .collab-card__cat { font-family: var(--serif-en); letter-spacing: .1em; }
.article-card--collab .collab-card__sep { font-family: var(--serif-en); }
.article-card--collab .article-card__text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 12px; }

/* Collaborator 記事: リード文がないときは、見出しを本文と同じ列（760px）に揃え、本文へ自然につなぐ */
.detail-head--column { max-width: 760px; padding-bottom: 0; }
.detail-head--column .detail-title { font-size: clamp(24px, 2.6vw, 34px); line-height: 1.75; }
.detail-head--column .detail-name { margin-top: clamp(20px, 2.4vw, 30px); }
.detail-head--column::after { content: ""; display: block; width: 40px; height: 1px; margin: clamp(36px, 4.5vw, 56px) 0 clamp(36px, 4.5vw, 56px); background: var(--ink); opacity: .5; }

/* Point of view / News 記事: 見出しを本文と同じ列に。リード文は日付の下に続ける */
.detail-head--column .detail-lead { max-width: none; margin: clamp(24px, 3vw, 36px) 0 0; }

/* About us 配下（Philosophy / Our Story）: 横長の写真＋本文列のレイアウト */
.article-body p.catch { margin: 0 0 22px; font-family: var(--serif-jp); font-size: clamp(15px, 1.4vw, 17px); line-height: 2.2; letter-spacing: .08em; }
.article-body h2 + p.catch { margin-top: 0; }
.article-body a.text-link { border-bottom: 0; margin-top: 8px; }
.article-body .page-lead { margin: 0 0 26px; }
/* Our Story: 見出しを年表（1020px）の左端に揃える */
.detail-head--story { max-width: 1020px; padding-bottom: 0; }
.detail-head--story .detail-title { font-size: clamp(24px, 2.6vw, 34px); line-height: 1.75; }
.detail-head--story .detail-lead { max-width: 640px; margin: clamp(24px, 3vw, 36px) 0 0; }
.detail-head--story + .story-timeline { padding-top: 0; }

/* =====================================================================
   v1.12 クオリティアップ: タイポグラフィ・動き・操作感・アクセシビリティ
   ===================================================================== */
:root {
  --ease-out: cubic-bezier(.16, .84, .3, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
}

/* --- 和文組版: 見出しは約物を詰め（palt）、文節で改行（auto-phrase）、行長を揃える --- */
.page-title, .detail-title, .article-card__title, .collab-card__name, .quote-band p,
.article-body h2, .article-body p.catch, .story-about h2, .cta-panel h2, .post-nav__title, .menu__link--jp {
  font-feature-settings: "palt" 1;
  word-break: auto-phrase;
  text-wrap: balance;
}
.page-lead, .detail-lead, .article-body p, .story-era__body p, .article-card__text, .page-summary {
  text-wrap: pretty;
  line-break: strict;
  hanging-punctuation: allow-end;
}

/* --- 画像: 読み込み完了で静かにフェードイン（JSが有効なときだけ） --- */
.js .article-card__image img, .js .detail-hero__image img, .js .page-hero__image img,
.js .cat-tile img, .js .article-body figure img, .js .story-era__body img, .js .ec-item__thumb img {
  opacity: 0;
  transition: opacity .9s var(--ease-soft), transform 1.2s var(--ease-out);
}
.js img.is-loaded { opacity: 1 !important; }
/* ヒーローは少し引いた位置から落ち着く */
.js .detail-hero__image img, .js .page-hero__image img { transform: scale(1.035); transition: opacity 1.2s var(--ease-soft), transform 2.4s var(--ease-out); }
.js .detail-hero__image img.is-loaded, .js .page-hero__image img.is-loaded { transform: none; }

/* --- スクロールで静かに現れる --- */
.js .rv { opacity: 0; transform: translate3d(0, 22px, 0); transition: opacity 1.1s var(--ease-soft), transform 1.3s var(--ease-out); transition-delay: var(--rv-delay, 0s); }
.js .rv.is-in { opacity: 1; transform: none; }

/* --- ページの入り --- */
@keyframes ridge-enter { from { opacity: 0; } to { opacity: 1; } }
.js body:not(.home) .main { animation: ridge-enter .7s var(--ease-soft) both; }

/* --- カードのホバー: 写真はゆっくり寄り、タイトルに細い下線が伸びる --- */
.article-card__image img { transition: opacity .9s var(--ease-soft), transform 1.4s var(--ease-out); }
a.article-card:hover .article-card__image img { transform: scale(1.035); }
.article-card__title span, .post-nav__title {
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 1px;
  transition: background-size .6s var(--ease-out);
}
a.article-card:hover .article-card__title span, .post-nav__item:hover .post-nav__title { background-size: 100% 1px; }
.cat-tile img { transition: opacity .9s var(--ease-soft), transform 1.4s var(--ease-out); }
.cat-tile:hover img { transform: scale(1.035); }

/* --- テキストリンク: 矢印が少し進む --- */
.text-link::after { transition: transform .4s var(--ease-out); }
.text-link:hover { opacity: 1; }
.text-link:hover::after { transform: translate(5px, -1px); }
.text-link { transition: opacity .3s ease; }
.ec-item { transition: background-color .4s var(--ease-soft); }
.ec-item:hover { opacity: 1; background: #fafaf8; }
.ec-item__arrow { transition: transform .4s var(--ease-out); }
.ec-item:hover .ec-item__arrow { transform: translateX(5px); }
.chip { transition: color .3s ease; }
.article-body a:not(.text-link) { transition: border-color .3s ease; }
.article-body a:not(.text-link):hover { border-bottom-color: var(--ink); }

/* --- ヘッダー: 下へ読むと隠れ、戻ると現れる（トップページ以外） --- */
body:not(.home) .site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  transition: transform .5s var(--ease-out), background-color .4s ease;
}
.admin-bar:not(.home) .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar:not(.home) .site-header { top: 0; } }
body.is-scrolled:not(.home) .site-header { background: rgba(242, 242, 240, .92); -webkit-backdrop-filter: saturate(1.2) blur(10px); backdrop-filter: saturate(1.2) blur(10px); }
body.is-header-hidden:not(.home) .site-header { transform: translate3d(0, -110%, 0); }
@media (min-width: 981px) {
  body:not(.home) .site-header { max-width: none; padding-left: max(var(--margin), calc((100% - var(--maxw)) / 2 + var(--margin))); padding-right: max(var(--margin), calc((100% - var(--maxw)) / 2 + var(--margin))); }
}

/* --- メニュー: 項目が順に現れる --- */
.menu__list li, .menu__social { opacity: 0; transform: translate3d(0, 12px, 0); transition: opacity .6s var(--ease-soft), transform .8s var(--ease-out); }
.menu.is-open .menu__list li, .menu.is-open .menu__social { opacity: 1; transform: none; }
.menu.is-open .menu__list li:nth-child(1) { transition-delay: .08s; }
.menu.is-open .menu__list li:nth-child(2) { transition-delay: .14s; }
.menu.is-open .menu__list li:nth-child(3) { transition-delay: .2s; }
.menu.is-open .menu__list li:nth-child(4) { transition-delay: .26s; }
.menu.is-open .menu__list li:nth-child(5) { transition-delay: .32s; }
.menu.is-open .menu__list li:nth-child(6) { transition-delay: .38s; }
.menu.is-open .menu__list li:nth-child(7) { transition-delay: .44s; }
.menu.is-open .menu__list li:nth-child(8) { transition-delay: .5s; }
.menu.is-open .menu__social { transition-delay: .5s; }

/* --- 前後の記事 --- */
.post-nav {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--margin);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
}
.post-nav__item { display: flex; flex-direction: column; gap: 12px; padding: clamp(28px, 3vw, 40px) 0 0; border-top: 1px solid var(--line); min-width: 0; }
.post-nav__item--older { text-align: right; align-items: flex-end; }
.post-nav__label { color: var(--muted); font-family: var(--serif-en); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; }
.post-nav__item--newer .post-nav__label::before { content: "← "; }
.post-nav__item--older .post-nav__label::after { content: " →"; }
.post-nav__title { font-family: var(--serif-jp); font-size: clamp(14px, 1.2vw, 16px); line-height: 1.9; letter-spacing: .06em; width: fit-content; max-width: 100%; }
.post-nav + .shell { padding-top: clamp(70px, 9vw, 120px); }
.post-nav + .shell .cta-panel { margin-top: 0; }
@media (max-width: 640px) {
  .post-nav { grid-template-columns: 1fr; gap: 0; }
  .post-nav__item--older { text-align: left; align-items: flex-start; }
}

/* --- フォーカス表示（キーボード操作） --- */
:focus-visible { outline: 1px solid var(--ink); outline-offset: 4px; }
a:focus:not(:focus-visible), button:focus:not(:focus-visible) { outline: none; }

/* --- 本文の細部 --- */
.article-body figure img, .story-era__body img { background: var(--mist); }
.single-sense .detail-name { color: var(--muted); letter-spacing: .14em; }

/* 動きを減らす設定のときは、動きを止める */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
  .js .rv, .js img { opacity: 1 !important; transform: none !important; }
}

/* v1.12.1: 余白・スマホのヒーロー */
body:not(.home) .footer { margin-top: clamp(64px, 8vw, 120px); }
.js .rv { transition-duration: .9s, 1.1s; }
@media (max-width: 760px) {
  .detail-hero--fixed .detail-hero__image { aspect-ratio: 4 / 3; }
  .detail-hero__image, .detail-hero__image img { max-height: 72svh; }
}
/* 本文列のページでは、引用帯も本文と同じ列に */
.article-body + .quote-band { max-width: 760px; padding-top: clamp(20px, 3vw, 40px); }
.article-body + .quote-band p { font-size: clamp(19px, 2vw, 26px); }
/* カテゴリタイル: 文字は写真の上ではなく下に置く（どんな写真でも読める） */
.cat-tile { background: transparent; overflow: visible; }
.cat-tile img { display: block; }
.cat-tile .cat-tile__img { display: block; overflow: hidden; background: var(--mist); }
.cat-tile__label { position: static; inset: auto; display: flex; justify-content: flex-start; align-items: baseline; gap: 12px; padding: 16px 2px 0; color: var(--ink); font-size: clamp(17px, 1.5vw, 21px); letter-spacing: .14em; text-shadow: none; }
.cat-tile__label::after { content: "→"; font-size: 13px; color: var(--muted); transition: transform .4s var(--ease-out); }
.cat-tile:hover .cat-tile__label::after { transform: translateX(5px); }

/* 正方形・縦長のヒーロー（ポスターや縦位置の写真）は切り抜かずに全体を見せる */
.detail-hero--contain .detail-hero__image { display: flex; justify-content: center; max-height: none; background: transparent; }
.detail-hero--contain .detail-hero__image img { width: auto; max-width: 100%; height: min(720px, 78svh); max-height: none; object-fit: contain; }
@media (max-width: 760px) {
  .detail-hero--contain .detail-hero__image img { width: 100%; height: auto; max-height: 80svh; }
}

/* =====================================================================
   Watch（映像一覧）
   ===================================================================== */
.watch-shell { padding-top: clamp(70px, 9vw, 130px); }
.watch-filter { margin-top: 0; }
.watch-filter .chip { cursor: pointer; }
.watch-card { min-width: 0; }
.watch-card[hidden] { display: none; }
.watch-card__play { display: block; width: 100%; padding: 0; text-align: left; cursor: pointer; }
.watch-card__image { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--mist); }
.watch-card__image img { width: 100%; height: 100%; object-fit: cover; transition: opacity .9s var(--ease-soft), transform 1.4s var(--ease-out); }
.watch-card__play:hover .watch-card__image img { transform: scale(1.035); }
/* 再生マーク: 細い円と三角 */
.watch-card__icon { position: absolute; left: 16px; bottom: 16px; width: 46px; height: 46px; margin: 0; border: 1px solid rgba(255,255,255,.9); border-radius: 50%; background: rgba(20,20,18,.18); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); transition: transform .6s var(--ease-out), background-color .4s ease; }
.watch-card__icon::after { content: ""; position: absolute; left: 50%; top: 50%; margin: -6px 0 0 -3px; border-style: solid; border-width: 6px 0 6px 10px; border-color: transparent transparent transparent #fff; }
.watch-card__play:hover .watch-card__icon { transform: scale(1.08); background: rgba(20,20,18,.32); }
.watch-card--featured .watch-card__icon { left: clamp(18px, 2vw, 28px); bottom: clamp(18px, 2vw, 28px); width: 64px; height: 64px; }
.watch-card__body { display: grid; gap: 7px; padding: 14px 2px 0; }
.watch-card__meta { color: var(--muted); font-family: var(--serif-en); font-size: 11px; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; }
.watch-card__title { margin: 0; font-family: var(--serif-jp); font-size: 14.5px; font-weight: 500; line-height: 1.8; letter-spacing: .05em; font-feature-settings: "palt" 1; word-break: auto-phrase; text-wrap: balance; }
.watch-card__note { margin: 0; color: var(--muted); font-size: 11.5px; line-height: 2; }
.watch-card--featured { margin-bottom: clamp(56px, 7vw, 96px); }
.watch-card--featured .watch-card__body { padding-top: clamp(18px, 2vw, 26px); }
.watch-card--featured .watch-card__title { font-size: clamp(18px, 1.8vw, 24px); font-weight: 400; letter-spacing: .08em; }
.watch-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px var(--gap); }
@media (max-width: 1100px) { .watch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .watch-grid { grid-template-columns: 1fr; gap: 40px; } .watch-card__icon { left: 12px; bottom: 12px; width: 40px; height: 40px; } }
.watch-empty { margin: 0; color: var(--muted); font-size: 13px; }
.watch-channel { margin: clamp(56px, 7vw, 96px) 0 0; display: flex; justify-content: center; }
.js .watch-card__image img { opacity: 0; }

/* 再生画面 */
.watch-modal { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; padding: clamp(16px, 4vw, 64px); }
.watch-modal[hidden] { display: none; }
.watch-modal__backdrop { position: absolute; inset: 0; background: rgba(18, 18, 16, .92); opacity: 0; transition: opacity .5s var(--ease-soft); }
.watch-modal__inner { position: relative; width: min(1280px, 100%, calc((100svh - 180px) * 16 / 9)); opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity .6s var(--ease-soft), transform .8s var(--ease-out); }
.watch-modal.is-open .watch-modal__backdrop { opacity: 1; }
.watch-modal.is-open .watch-modal__inner { opacity: 1; transform: none; }
.watch-modal__frame { aspect-ratio: 16 / 9; background: #000; }
.watch-modal__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.watch-modal__caption { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 10px 24px; padding-top: 18px; color: #f2f2f0; }
.watch-modal__title { margin: 0; font-family: var(--serif-jp); font-size: 14px; letter-spacing: .06em; line-height: 1.8; }
.watch-modal__link { margin-top: 0; color: #f2f2f0; }
.watch-modal__close { position: absolute; right: -6px; top: -52px; width: 44px; height: 44px; color: #f2f2f0; }
.watch-modal__close::before, .watch-modal__close::after { content: ""; position: absolute; left: 11px; top: 21px; width: 22px; height: 1.5px; background: currentColor; }
.watch-modal__close::before { transform: rotate(45deg); }
.watch-modal__close::after { transform: rotate(-45deg); }
.watch-modal__close:hover { opacity: .6; }

/* Watch: 分類ごとのセクション */
.watch-section { margin-top: clamp(80px, 10vw, 150px); }
.watch-section[hidden], .watch-card--featured[hidden] { display: none; }
.watch-card--featured[hidden] + .watch-section, .watch-filter + .watch-section { margin-top: 0; }
.watch-section__head { display: grid; grid-template-columns: minmax(180px, .34fr) minmax(0, .66fr); gap: 14px clamp(22px, 3vw, 44px); align-items: baseline; margin-bottom: clamp(26px, 3vw, 44px); padding-top: clamp(22px, 2.4vw, 32px); border-top: 1px solid var(--line); }
.watch-section__title { margin: 0; font-family: var(--serif-en); font-size: clamp(20px, 1.9vw, 26px); font-weight: 400; letter-spacing: .14em; text-transform: uppercase; }
.watch-section__text { margin: 0; max-width: 640px; color: var(--muted); font-size: 12.5px; line-height: 2.2; }
@media (max-width: 760px) { .watch-section__head { grid-template-columns: 1fr; } }
/* 縦型（RIDGE MEETS）: 16:9 のサムネイルから中央の縦長部分だけを見せる */
.watch-grid--tall { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 40px var(--gap); }
.watch-card--tall .watch-card__image { aspect-ratio: 9 / 16; }
.watch-card--tall .watch-card__image img { object-position: 50% 50%; }
.watch-card--tall .watch-card__title { font-size: 13px; }
@media (max-width: 1100px) { .watch-grid--tall { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) { .watch-grid--tall { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px var(--gap); } }
.watch-card--featured.watch-card--tall .watch-card__image { aspect-ratio: 16 / 9; }
/* 縦型の再生画面 */
.watch-modal.is-tall .watch-modal__inner { width: min(420px, 100%, calc((100svh - 180px) * 9 / 16)); }
.watch-modal.is-tall .watch-modal__frame { aspect-ratio: 9 / 16; }

/* Watch v2: 1つの一覧に新しい順。縦型（RIDGE MEETS）は横長の枠の中で、ぼかした背景＋中央に縦の映像 */
.watch-filter { margin-bottom: clamp(30px, 4vw, 56px); }
.watch-card--tall .watch-card__image { aspect-ratio: 16 / 9; }
.watch-card__bg { position: absolute; inset: 0; overflow: hidden; }
.watch-card__bg img { width: 100%; height: 100%; object-fit: cover; transform: scale(3.4); filter: blur(22px) brightness(.82) saturate(1.1); opacity: 1 !important; }
.watch-card__fg { position: absolute; top: 0; bottom: 0; left: 50%; height: 100%; aspect-ratio: 9 / 16; transform: translateX(-50%); overflow: hidden; }
.watch-card__fg img { position: absolute; top: 0; left: 50%; width: auto !important; height: 100%; aspect-ratio: 16 / 9; max-width: none; object-fit: cover; transform: translateX(-50%); }
.watch-card__play:hover .watch-card__fg img { transform: translateX(-50%) scale(1.035); }
.watch-card--tall .watch-card__title { font-size: 14.5px; }


/* アイキャッチがない記事: 薄い面の中央に RIDGE のマークを小さくグレーで */
:root { --ridge-mark: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20134.8%20105%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M0%20105%20L48.4%200%20L67.4%2040.6%20L86.4%200%20L134.8%20105%20Z%20M48.4%2027.2%20L61%2054%20L42.4%2095%20L17.6%2095%20Z%20M67.4%2068.6%20L79.3%2095%20L55.5%2095%20Z%20M86.4%2027.2%20L117.2%2095%20L92.4%2095%20L73.8%2054%20Z%22/%3E%3C/svg%3E"); }
.article-card__image--blank { display: flex; align-items: center; justify-content: center; background: var(--mist); }
.blank-mark { display: block; width: clamp(34px, 3.2vw, 46px); aspect-ratio: 134.8 / 105; background: #c4c4bf; -webkit-mask: var(--ridge-mark) center / contain no-repeat; mask: var(--ridge-mark) center / contain no-repeat; transition: transform 1.4s var(--ease-out); }
a.article-card:hover .blank-mark { transform: scale(1.06); }

/* Point of view: 最新の記事を大きく */
.feature-card { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 72px); align-items: end; margin-bottom: clamp(80px, 9vw, 140px); }
.feature-card__image { aspect-ratio: 3 / 2; overflow: hidden; background: var(--mist); display: flex; align-items: center; justify-content: center; }
.feature-card__image img { width: 100%; height: 100%; object-fit: cover; transition: opacity .9s var(--ease-soft), transform 1.4s var(--ease-out); }
.feature-card:hover .feature-card__image img { transform: scale(1.03); }
.feature-card__body { display: grid; gap: 14px; padding-bottom: 6px; }
.feature-card__label { font-family: var(--serif-en); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); }
.feature-card__title { margin: 6px 0 0; font-family: var(--serif-jp); font-size: clamp(20px, 2vw, 28px); font-weight: 400; line-height: 1.75; letter-spacing: .08em; font-feature-settings: "palt" 1; word-break: auto-phrase; text-wrap: balance; }
.feature-card__title span { background-image: linear-gradient(currentColor, currentColor); background-repeat: no-repeat; background-position: 0 100%; background-size: 0 1px; transition: background-size .6s var(--ease-out); }
.feature-card:hover .feature-card__title span { background-size: 100% 1px; }
.feature-card__text { margin: 0; color: var(--muted); font-size: 12.5px; line-height: 2.2; text-wrap: pretty; }
.feature-card .text-link { margin-top: 8px; }
.feature-card:hover .text-link::after { transform: translate(5px, -1px); }
.js .feature-card__image img { opacity: 0; }
@media (max-width: 980px) {
  .feature-card { grid-template-columns: 1fr; gap: 22px; margin-bottom: 72px; }
}
/* Point of view: 最新の記事を横幅いっぱいに（写真の下に見出し） */
.feature-card { display: block; margin: 0 0 clamp(64px, 8vw, 120px); }
.feature-card__image { aspect-ratio: 21 / 9; }
.feature-card__body { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px clamp(32px, 5vw, 96px); align-items: end; padding: clamp(18px, 2vw, 28px) 2px 0; }
.feature-card__head { display: grid; gap: 10px; }
.feature-card__title { margin: 0; }
.feature-card__side { display: grid; gap: 10px; justify-items: start; }
.feature-card .text-link { margin-top: 0; }
@media (max-width: 980px) {
  .feature-card__image { aspect-ratio: 3 / 2; }
  .feature-card__body { grid-template-columns: 1fr; }
}

/* 最新の記事: 一覧のカードと同じ組み方で、少しだけ大きく（説明文と「読む」は出さない） */
.feature-card__body { display: grid; grid-template-columns: 1fr; gap: 8px; padding: 14px 2px 0; }
.feature-card__head { gap: 8px; }
.feature-card__title { font-size: clamp(16px, 1.35vw, 19px); font-weight: 500; line-height: 1.8; letter-spacing: .06em; text-wrap: wrap; }
.feature-card__side { display: none; }
.feature-card { margin-bottom: clamp(48px, 5vw, 72px); }

/* =====================================================================
   ページ冒頭（見出しまわり）の高さを詰める。余白は 8px 単位のリズムで整える
   見出し上 40–64 / 小見出し→見出し 12 / 見出し→リード 24 / リード→本文 56–88
   ===================================================================== */
.page-hero { margin-top: clamp(32px, 4vw, 64px); }
.page-hero__body, .page-hero__body--tight { gap: 24px; }
.page-hero .eyebrow { margin-bottom: 12px; }
.page-hero .page-title { line-height: 1.55; }
.page-hero .page-title--jp { font-size: clamp(24px, 2.3vw, 34px); }
.page-hero .page-lead { font-size: clamp(13.5px, 1vw, 15px); line-height: 2.1; }
.page-hero .page-summary { margin-top: 0; }
/* 冒頭の直後のセクションは間を詰める */
.page-hero + .shell, .page-hero + .watch-shell { padding-top: clamp(56px, 6vw, 88px); }
.page-hero + .shell .filter-nav { margin-top: 0; }
/* 写真つきの冒頭（Collaborator など）は写真を横長にして高さを抑える */
.page-hero__image img { aspect-ratio: 4 / 3; }
/* 記事ページの見出しまわりも同じリズムで */
.detail-head { padding-top: clamp(48px, 6vw, 88px); }
.detail-head--column::after { margin: clamp(32px, 3.6vw, 48px) 0; }
@media (max-width: 980px) {
  .page-hero { margin-top: 24px; }
  .page-hero__body { gap: 20px; }
  .page-hero + .shell, .page-hero + .watch-shell { padding-top: 48px; }
  .page-hero__image img { aspect-ratio: 3 / 2; }
}

/* Watch: いちばん新しい映像を大きく（Point of view の大きな記事と同じ見せ方） */
.watch .watch-card--featured { margin: 0 0 clamp(48px, 5vw, 72px); }
.watch .watch-card--featured .watch-card__image { aspect-ratio: 21 / 9; }
.watch .watch-card--featured .watch-card__body { gap: 8px; padding: 14px 2px 0; }
.watch .watch-card--featured .watch-card__title { font-size: clamp(16px, 1.35vw, 19px); font-weight: 500; line-height: 1.8; letter-spacing: .06em; text-wrap: wrap; }
.watch .watch-card--featured .watch-card__note { display: none; }
.watch .watch-card--featured[hidden], .watch .watch-card--dup[hidden] { display: none; }
@media (max-width: 760px) { .watch .watch-card--featured .watch-card__image { aspect-ratio: 3 / 2; } }

/* INTRODUCTION: 一覧のサムネイルは商品写真（白背景）で揃え、商品全体が見えるように */
.article-card--product .article-card__image { background: #fff; }
.article-card--product .article-card__image img { object-fit: contain; padding: 6% 12%; box-sizing: border-box; }

/* ===== Collaborator トップ v3: 本文1段 → 分類3つ → 一覧（名前と所在地）。要素を絞って静かに ===== */
.collab-top .collab-essay { max-width: calc(640px + var(--margin) * 2); padding-top: clamp(96px, 10vw, 160px); }
.collab-essay__opening { margin: 0 0 clamp(36px, 3.6vw, 52px); font-family: var(--serif-jp); font-size: clamp(18px, 1.55vw, 22px); font-weight: 400; line-height: 2.1; letter-spacing: .08em; font-feature-settings: "palt" 1; word-break: auto-phrase; }
.collab-essay p:not(.collab-essay__opening) { margin: 0 0 1.9em; font-size: 14px; line-height: 2.35; letter-spacing: .04em; text-wrap: pretty; }
.collab-essay p:last-child { margin-bottom: 0; }

.collab-top .collab-cats { padding-top: clamp(110px, 11vw, 180px); }
.collab-cats .cat-tiles { gap: clamp(14px, 1.6vw, 24px); }
.collab-cats .cat-tile img { aspect-ratio: 4 / 5; }

.collab-top .collab-index { max-width: 760px; padding-top: clamp(110px, 11vw, 180px); }
.collab-index__title { margin: 0 0 clamp(24px, 2.4vw, 36px); font-family: var(--serif-en); font-size: 13px; font-weight: 400; letter-spacing: .18em; text-transform: uppercase; }
.collab-index__list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.collab-row { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--line); transition: opacity .3s ease; }
.collab-row__name { font-family: var(--serif-jp); font-size: 15px; line-height: 1.7; letter-spacing: .06em; }
.collab-row__place { flex-shrink: 0; color: var(--muted); font-size: 12px; letter-spacing: .06em; }
.collab-row:hover { opacity: .5; }
@media (max-width: 860px) {
  .collab-cats .cat-tiles { gap: 40px; }
  .collab-cats .cat-tile img { aspect-ratio: 3 / 2; }
  .collab-row { padding: 16px 0; }
  .collab-row__name { font-size: 14px; }
  .collab-row__place { font-size: 11px; }
}
.page-hero__body > div:not(:has(*)) { display: none; }
.collab-top .collab-body + .collab-cats { padding-top: 0; }
/* Collaborator: MV は写真だけを、ヘッダーの下から画面の下端まで・左右いっぱいに */
.collab-top .detail-hero { width: 100%; max-width: none; margin: 0; padding: 0; }
.collab-top .detail-hero__image { height: calc(100svh - var(--header-h)); max-height: none; aspect-ratio: auto; }
.admin-bar .collab-top .detail-hero__image { height: calc(100svh - var(--header-h) - 32px); }
.collab-top .detail-hero__image img { width: 100%; height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; }
@media (max-width: 980px) { .collab-top .detail-hero__image { height: calc(100svh - var(--header-h)); min-height: 420px; } }
/* Collaborator MV: 画面の高さの約85%（下に見出しが少しのぞく）。上限 900px・下限 480px（PC） */
.collab-top .detail-hero__image, .admin-bar .collab-top .detail-hero__image { height: clamp(480px, calc((100svh - var(--header-h)) * .85), 900px); }
@media (max-width: 980px) { .collab-top .detail-hero__image, .admin-bar .collab-top .detail-hero__image { height: calc(100svh - var(--header-h)); min-height: 420px; } }
/* Collaborator MV: 抑えめに。画面の高さの約70%、上限 760px・下限 420px（PC） */
.collab-top .detail-hero__image, .admin-bar .collab-top .detail-hero__image { height: clamp(420px, calc((100svh - var(--header-h)) * .7), 760px); }
@media (max-width: 980px) { .collab-top .detail-hero__image, .admin-bar .collab-top .detail-hero__image { height: calc(100svh - var(--header-h)); min-height: 420px; } }
/* ブランドの各ページ（Philosophy / Our Story）も Collaborator と同じ MV に: 左右いっぱい、画面の高さの約70%（上限 760px・下限 420px） */
body.page-philosophy .detail-hero, body.page-story .detail-hero { width: 100%; max-width: none; margin: 0; padding: 0; }
body.page-philosophy .detail-hero__image, body.page-story .detail-hero__image { height: clamp(420px, calc((100svh - var(--header-h)) * .7), 760px); max-height: none; aspect-ratio: auto; }
body.page-philosophy .detail-hero__image img, body.page-story .detail-hero__image img { width: 100%; height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; }
@media (max-width: 980px) { body.page-philosophy .detail-hero__image, body.page-story .detail-hero__image { height: calc(100svh - var(--header-h)); min-height: 420px; } }
/* Collaborator の記事ページも同じ MV に（縦長・正方形の写真＝--contain は対象外） */
body.single-collaborator .detail-hero:not(.detail-hero--contain) { width: 100%; max-width: none; margin: 0; padding: 0; }
body.single-collaborator .detail-hero:not(.detail-hero--contain) .detail-hero__image { height: clamp(420px, calc((100svh - var(--header-h)) * .7), 760px); max-height: none; aspect-ratio: auto; }
body.single-collaborator .detail-hero:not(.detail-hero--contain) .detail-hero__image img { width: 100%; height: 100%; max-height: none; aspect-ratio: auto; object-fit: cover; }
@media (max-width: 980px) { body.single-collaborator .detail-hero:not(.detail-hero--contain) .detail-hero__image { height: calc(100svh - var(--header-h)); min-height: 420px; } }
/* 見出し下の説明文は全ページ同じ見た目に（Our Story のリード文も Point of view などの説明文に合わせる） */
.detail-head--story .detail-lead { font-family: var(--serif-jp); font-size: clamp(13.5px, 1vw, 15px); line-height: 2.1; letter-spacing: .04em; color: var(--ink); }

/* Our Story: Philosophy と同じ中央1列（760px）。各時代は「区切り線 → 年号 → 最初の一文を少し大きく → 本文 → 写真を列いっぱい」 */
.detail-head--story { max-width: 760px; }
.detail-head--story .detail-lead { max-width: none; }
.detail-head--story::after { content: none; }
.story-timeline { max-width: 760px; padding-left: var(--margin); padding-right: var(--margin); }
.story-era { display: block; margin-top: clamp(64px, 8vw, 112px); padding-top: clamp(28px, 3vw, 40px); border-top: 1px solid var(--line); }
.story-era:first-of-type { margin-top: clamp(48px, 6vw, 80px); }
.story-era__year { position: static; margin: 0 0 clamp(24px, 2.6vw, 36px); font-family: var(--serif-en); font-size: clamp(26px, 2.6vw, 36px); font-weight: 400; line-height: 1.3; letter-spacing: .08em; }
.story-era__body > p:first-child { margin-bottom: 28px; font-family: var(--serif-jp); font-size: clamp(16px, 1.4vw, 19px); line-height: 2; letter-spacing: .06em; }
.story-era__body p { font-size: 14px; line-height: 2.4; letter-spacing: .03em; }
.story-era__body figure { margin: clamp(36px, 4vw, 56px) 0; }
.story-era__body figure:last-child, .story-era__body .story-era__pair:last-child { margin-bottom: 0; }
.story-era__body img { width: 100%; height: auto; }
.story-era__pair { margin: clamp(36px, 4vw, 56px) 0; }
/* Our Story の年号: 数字と「年」の大きさを揃えるため、和文の明朝で統一（欧文のオールドスタイル数字だと数字だけ小さく見える） */
.story-era__year { font-family: var(--serif-jp); font-size: clamp(22px, 2.1vw, 30px); font-variant-numeric: lining-nums proportional-nums; letter-spacing: .06em; font-feature-settings: "palt" 1; }
/* Our Story 仕上げ: 年号は「2011 ———」の小さな目印（数字＋細い線）。各時代の書き出しの一文が見出しの役目 */
.story-era { border-top: 0; padding-top: 0; }
.story-era__year { display: flex; align-items: center; gap: 20px; margin: 0 0 clamp(22px, 2.4vw, 32px); font-family: var(--serif-en); font-size: 15px; font-weight: 400; line-height: 1; letter-spacing: .2em; color: var(--ink); font-variant-numeric: lining-nums; }
.story-era__year::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.story-era__body > p:first-child { margin-bottom: clamp(28px, 3vw, 40px); font-size: clamp(18px, 1.6vw, 22px); line-height: 1.9; letter-spacing: .08em; }
.story-era { margin-top: clamp(80px, 10vw, 140px); }
.story-era:first-of-type { margin-top: clamp(56px, 7vw, 96px); }
.story-era__body figure, .story-era__pair { margin: clamp(40px, 4.4vw, 64px) 0 0; }
.story-era__body figure + p, .story-era__pair + p { margin-top: clamp(40px, 4.4vw, 64px); }
/* 年号が唯一の年の表示になったので、目印を少しだけ大きく */
.story-era__year { font-size: clamp(17px, 1.5vw, 21px); letter-spacing: .16em; }
/* 年号の目印「2011年」: 数字と「年」の大きさを揃えるため和文の明朝で */
.story-era__year { font-family: var(--serif-jp); font-size: clamp(16px, 1.3vw, 18px); letter-spacing: .1em; font-variant-numeric: lining-nums proportional-nums; font-feature-settings: "palt" 1; }
/* 年号の横の線はなし。時代の区切りは余白で */
.story-era__year { display: block; }
.story-era__year::after { content: none; }
.story-era { margin-top: clamp(96px, 11vw, 160px); }
/* 年号の上に短い線（Philosophy や記事の見出し下と同じ 40px の線）で時代を区切る */
.story-era__year::before { content: ""; display: block; width: 40px; height: 1px; margin: 0 0 clamp(24px, 2.6vw, 34px); background: var(--ink); opacity: .5; }

/* ---------- 1.19.0 SEO: 画面には出さない見出し / メニューの nav ---------- */
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.menu__nav { display: contents; }

/* ---------- 1.19.2 縦長・正方形の上部写真: 切り抜かずに、本文の列と同じ幅で出す（左右の端を見出し・本文・本文中の写真に揃える） ---------- */
.detail-hero--contain .detail-hero__image { display: block; width: 100%; max-width: calc(760px - (var(--margin) * 2)); max-height: none; margin-inline: auto; background: transparent; overflow: visible; }
.detail-hero--contain .detail-hero__image img { display: block; width: 100%; height: auto; max-width: none; max-height: none; object-fit: initial; }

/* ---------- 1.19.4 リンク先がないときは「→」も出さない（.text-link の display が hidden 属性に勝っていた） ---------- */
.text-link[hidden] { display: none !important; }

/* ---------- 1.19.5 ページ冒頭の説明文: 日本語を言葉の切れ目で折り返す（「こ／れまで」のような途中の改行を防ぐ） ---------- */
.page-lead, .detail-lead { word-break: auto-phrase; }

/* ---------- 1.19.6 ページ冒頭の説明文の幅を広げる（About us の2行目が1行に収まる幅） ---------- */
.page-lead, body.page-about .page-lead, body.page-philosophy .page-lead, body.page-collaborator .page-lead { max-width: 880px; }

/* =====================================================================
   トップページのタイル（v3: 並びはそのまま、ラベルを左下＋日本語の一行説明）
   ===================================================================== */
/* 文字は中央の影付きから、左下の落ち着いた位置へ。写真の下側だけ薄く暗くして読みやすく */
.tiles--v3 .tile::after { content: ""; position: absolute; inset: auto 0 0 0; height: 55%; background: linear-gradient(to top, rgba(18, 18, 16, .42), rgba(18, 18, 16, 0)); pointer-events: none; transition: opacity .6s ease; }
.tiles--v3 .tile--panel::after { content: none; }
.tiles--v3 .tile__label { position: static; inset: auto; display: block; color: inherit; font-size: clamp(20px, 1.9vw, 30px); line-height: 1.2; letter-spacing: .04em; text-indent: 0; text-shadow: none; }
.tiles--v3 .tile--main .tile__label { font-size: clamp(28px, 2.9vw, 46px); }
.tiles--v3 .tile__cap { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; display: grid; gap: 8px; padding: clamp(18px, 2vw, 32px); color: #fff; }
.tiles--v3 .tile__note { font-family: var(--serif-jp); font-size: 13px; line-height: 1.7; letter-spacing: .08em; }
/* 動きは今のトップと同じ（カーソルを当てると写真がゆっくり寄るだけ） */
.tiles--v3 .tile:focus-visible { outline: 1px solid var(--ink); outline-offset: 3px; }
/* News: 写真の代わりに最新のお知らせ3件 */
.tiles--v3 .tile--panel { background: #e9e9e6; }
.tiles--v3 .tile--panel:hover { background: #e2e2df; }
.tiles--v3 .tile--panel .tile__cap { color: var(--ink); }
.tiles--v3 .tile__news { position: absolute; z-index: 1; top: clamp(18px, 2vw, 32px); left: clamp(18px, 2vw, 32px); right: clamp(18px, 2vw, 32px); display: grid; gap: 0; border-top: 1px solid rgba(26, 26, 26, .14); }
.tiles--v3 .tile__news-item { display: grid; grid-template-columns: 6.6em minmax(0, 1fr); gap: 12px; padding: 11px 0; border-bottom: 1px solid rgba(26, 26, 26, .14); font-family: var(--serif-jp); font-size: 12.5px; line-height: 1.7; letter-spacing: .04em; }
.tiles--v3 .tile__news-date { font-family: var(--serif-en); font-size: 14px; letter-spacing: .04em; color: var(--muted); font-variant-numeric: lining-nums; }
.tiles--v3 .tile__news-title { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
@media (max-width: 860px) {
  .tiles--v3 .tile__cap { padding: 12px; gap: 4px; }
  .tiles--v3 .tile__label, .tiles--v3 .tile-col .tile__label, .tiles--v3 .tile-row--quad .tile__label, .tiles--v3 .tile-row--trio .tile__label { font-size: 16px; letter-spacing: .03em; text-indent: 0; text-align: left; padding: 0; line-height: 1.25; text-shadow: none; }
  .tiles--v3 .tile--main .tile__label { font-size: 24px; }
  .tiles--v3 .tile__note { display: none; }
  .tiles--v3 .tile--main .tile__note { display: block; font-size: 11.5px; }
  .tiles--v3 .tile__news { display: none; }
}