/* ─────────────────────────────────────────────────────────
   Concept House — Editorial Grid v2
   ───────────────────────────────────────────────────────── */
:root{
  --bg:        #F1ECE2;
  --bg-2:      #E6DFCF;
  --bg-3:      #DDD4BF;
  --paper:     #FBF8F1;
  --ink:       #0E0E0C;
  --ink-2:     #2A2A26;
  --ink-3:     #6E6B62;
  --ink-4:     #9B978B;
  --moss:      #2A3520;
  --moss-2:    #485536;
  --moss-3:    #8A9469;
  --line:      rgba(14,14,12,0.12);
  --line-2:    rgba(14,14,12,0.22);

  --jp: "Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --en: "Archivo","Inter",system-ui,sans-serif;
  --en-d: "Archivo Black","Archivo","Noto Sans JP",sans-serif;

  --pad-x: clamp(20px, 5vw, 96px);
  --pad-y: clamp(120px, 18vw, 240px);   /* much larger vertical breathing */
  --max:   1640px;
  --gutter: clamp(16px, 2.2vw, 32px);

  --ease: cubic-bezier(0.2,0.8,0.2,1);
  --dur:  420ms;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--jp);font-weight:400;
  color:var(--ink);background:var(--bg);
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"palt";
  letter-spacing:.02em;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
ul,ol,dl{margin:0;padding:0;list-style:none}
dt,dd{margin:0}
.sp-only{display:none}

/* photo helper */
.ph{
  position:absolute;inset:0;
  background-color:var(--bg-3);
  background-size:cover;background-position:center;background-repeat:no-repeat;
  filter:saturate(.92) contrast(1.02);
}
.cn__a .ph,
.cn__b .ph,
.pcard__media .ph,
.work__media .ph,
.mh__media .ph{
  inset:-10% 0;
  will-change:translate;
}

/* ─────────────────────────────────────────────────────────
   EDITORIAL GRID
   The page-level 12-col grid every section drops into.
   ───────────────────────────────────────────────────────── */
.sec{
  padding:var(--pad-y) 0;
  position:relative;
  overflow-x:clip;
}
.sec--concept,
.sec--feats,
.sec--prod,
.sec--works,
.sec--voice{
  background:var(--bg);
}
.sec--works{padding-top:0}
.sec--mani{background:var(--paper)}

.grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  column-gap:var(--gutter);
  row-gap:0;
  max-width:var(--max);
  margin:0 auto;
  padding:0 var(--pad-x);
  position:relative;
}
@media (max-width:880px){
  .grid{grid-template-columns:repeat(6,1fr);column-gap:16px}
  .sp-only{display:initial}
}

/* section header chrome — sticks at top of section while you scroll */
.g-num{
  grid-column:1 / span 1;
  grid-row:1;
  position:sticky;top:96px;
  font-family:var(--en-d);
  font-size:clamp(32px,3.6vw,56px);
  line-height:1;letter-spacing:-.02em;
  color:var(--ink);
  align-self:start;
  margin-bottom:clamp(60px,8vw,120px);
  z-index:2;
}
.g-num--light{color:var(--ink-4)}
.g-label{
  grid-column:2 / span 4;
  grid-row:1;
  position:sticky;top:108px;
  align-self:start;
  font-family:var(--en);font-weight:700;
  font-size:12px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--ink-3);
  margin-top:14px;
  margin-bottom:clamp(60px,8vw,120px);
  z-index:2;
}
.g-label--light{color:var(--ink-4)}
.g-rule{
  grid-column:6 / span 7;
  grid-row:1;
  position:sticky;top:118px;
  align-self:start;
  height:1px;background:var(--line);
  margin-top:14px;
  margin-bottom:clamp(60px,8vw,120px);
  z-index:2;
}
.g-rule--light{background:var(--line)}

@media (max-width:880px){
  .g-num{grid-column:1 / span 1;margin-bottom:0;position:static}
  .g-label{grid-column:2 / -1;margin-bottom:18px;margin-top:0;position:static}
  .g-rule{display:none}
}

/* shared "highlight" mark */
.hl{position:relative;display:inline-block;padding:0 .1em}
.hl::before{
  content:"";position:absolute;left:-.04em;right:-.04em;bottom:.08em;height:.34em;
  background:rgba(138,148,105,.5);z-index:-1;border-radius:2px;
}

/* ─────────────────────────────────────────────────────────
   HEADER
   ───────────────────────────────────────────────────────── */
.page-top .hd{transition:opacity .5s var(--ease)}
.page-top .hd:not(.is-scrolled){opacity:0;pointer-events:none}

.hd{
  position:fixed;inset:0 0 auto 0;z-index:50;
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  align-items:center;gap:32px;
  padding:20px var(--pad-x);
  color:#fff;
  mix-blend-mode:difference;
}
.hd::before{content:"";position:absolute;inset:0;background:rgba(14,14,12,0);transition:background var(--dur) var(--ease);pointer-events:none}
.hd.is-scrolled{mix-blend-mode:normal;color:var(--ink)}
.hd.is-scrolled::before{background:rgba(241,236,226,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}

.hd__brand{position:relative;z-index:2;display:grid;grid-template-columns:auto auto;align-items:center;gap:14px;line-height:1}
.hd__brand-en{font-family:var(--en-d);font-size:14px;letter-spacing:.04em;line-height:.95}
.hd__brand-jp{font-family:var(--jp);font-weight:700;font-size:11px;letter-spacing:.18em;padding-left:14px;border-left:1px solid currentColor;opacity:.92}

.hd__nav{position:relative;z-index:2;justify-self:center}
.hd__nav-ctas{display:none}
.hd__nav ul{display:flex;gap:clamp(12px,1.6vw,24px);align-items:center}
.hd__nav a{
  display:grid;justify-items:center;gap:2px;
  font-family:var(--en);font-weight:700;font-size:12.5px;letter-spacing:.08em;
  padding:8px 2px;position:relative;
}
.hd__nav a em{font-style:normal;display:block}
.hd__nav a span{font-family:var(--jp);font-weight:500;font-size:9.5px;letter-spacing:.16em;opacity:.7}
.hd__nav a::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:1px;background:currentColor;transition:width var(--dur) var(--ease),left var(--dur) var(--ease)}
.hd__nav a:hover::after{width:100%;left:0}

.hd__ctas{position:relative;z-index:2;display:inline-flex;align-items:center;gap:12px}

.hd__cta{
  display:inline-flex;align-items:center;gap:10px;
  padding:11px 18px;border:1px solid currentColor;
  font-family:var(--jp);font-weight:700;font-size:11.5px;letter-spacing:.16em;
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.hd__cta:hover{background:currentColor}
.hd__cta:hover span,.hd__cta:hover svg{color:var(--bg);mix-blend-mode:difference}

.hd__cta--line{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--jp);font-weight:700;font-size:11px;letter-spacing:.14em;
  padding:4px 0;border-bottom:1px solid currentColor;
  opacity:.78;
  transition:opacity var(--dur) var(--ease),gap var(--dur) var(--ease);
}
.hd__cta--line:hover{opacity:1;gap:12px}

.hd__menu{display:none;position:relative;z-index:2;width:30px;height:22px;flex-direction:column;justify-content:space-between}
.hd__menu span{display:block;height:1.5px;background:currentColor;width:100%}

@media (max-width:960px){
  .hd__nav,.hd__ctas{display:none}
  .hd__menu{display:flex;grid-column:3;justify-self:end}
  .hd{grid-template-columns:auto 1fr auto}

  /* hamburger → × */
  .hd__menu span{transition:transform .3s var(--ease),opacity .3s var(--ease)}
  .hd__menu.is-open span:nth-child(1){transform:translateY(10px) rotate(45deg)}
  .hd__menu.is-open span:nth-child(2){opacity:0}
  .hd__menu.is-open span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}

  /* open state */
  .hd.is-open{mix-blend-mode:normal;color:var(--ink)}
  .hd.is-open::before{background:rgba(241,236,226,.98);border-bottom:1px solid var(--line)}

  /* nav overlay */
  .hd.is-open .hd__nav{
    display:flex;flex-direction:column;
    position:fixed;inset:0;width:100%;
    background:var(--bg);z-index:1;
    padding:80px var(--pad-x) 60px;
    overflow-y:auto;gap:40px;
    justify-self:unset;
  }
  .hd.is-open .hd__nav ul{flex-direction:column;align-items:flex-start;gap:0;width:100%}
  .hd.is-open .hd__nav li{width:100%;border-bottom:1px solid var(--line)}
  .hd.is-open .hd__nav li:first-child{border-top:1px solid var(--line)}
  .hd.is-open .hd__nav a{
    display:flex;justify-content:space-between;align-items:center;
    padding:20px 0;width:100%;gap:8px;
  }
  .hd.is-open .hd__nav a em{font-family:var(--en);font-weight:700;font-size:18px;letter-spacing:.04em;font-style:normal}
  .hd.is-open .hd__nav a span{font-size:11px;opacity:.55;letter-spacing:.12em}
  .hd.is-open .hd__nav a::after{display:none}

  /* LINE + 見学予約 inside overlay */
  .hd.is-open .hd__nav .hd__nav-ctas{
    display:flex;flex-direction:column;gap:16px;padding-top:8px;
  }
  .hd.is-open .hd__nav .hd__nav-ctas .hd__cta--line{
    font-size:13px;padding:0;border-bottom:none;opacity:1;
  }
  .hd.is-open .hd__nav .hd__nav-ctas .hd__cta{
    display:inline-flex;color:var(--ink);border-color:var(--ink);font-size:12px;padding:14px 20px;
  }
}

/* ─────────────────────────────────────────────────────────
   HERO
   ───────────────────────────────────────────────────────── */
.hero{position:relative;height:calc(100svh - 52px);min-height:560px;color:#fff;overflow:hidden;isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:0}
.hero__slide{position:absolute;inset:0;background-size:cover;background-position:center;background-color:#181814;opacity:0;transition:opacity 1.2s var(--ease);transform:scale(1.04)}
.hero__slide.is-on{opacity:1;transform:scale(1)}
.hero__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,8,.45) 0%,rgba(10,10,8,.12) 35%,rgba(10,10,8,.20) 60%,rgba(10,10,8,.78) 100%),linear-gradient(90deg,rgba(10,10,8,.4) 0%,rgba(10,10,8,0) 60%)}
.hero__grain{position:absolute;inset:0;pointer-events:none;opacity:.10;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/></svg>")}

.hero__corner{position:absolute;z-index:3;display:flex;flex-direction:column;gap:6px;font-family:var(--en);font-size:10px;letter-spacing:.22em;text-transform:uppercase;opacity:.78}
.hero__corner--tl{top:96px;left:var(--pad-x)}
.hero__corner--tr{top:96px;right:var(--pad-x);text-align:right;align-items:flex-end}
.hero__corner .tick{padding-left:14px;position:relative}
.hero__corner .tick::before{content:"";position:absolute;left:0;top:50%;width:8px;height:1px;background:currentColor}
.hero__corner--tr .tick{padding-left:0;padding-right:14px}
.hero__corner--tr .tick::before{left:auto;right:0}

.hero__inner{
  position:relative;z-index:2;
  display:flex;flex-direction:column;justify-content:flex-end;
  min-height:calc(100svh - 52px);
  padding:100px var(--pad-x) 200px;
  max-width:var(--max);margin:0 auto;
}
.hero__eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:var(--en);font-weight:700;font-size:12px;letter-spacing:.22em;text-transform:uppercase;margin-bottom:32px;opacity:.95}
.hero__eyebrow .dot{width:6px;height:6px;background:#C9D86A;border-radius:50%;display:inline-block}
.hero__eyebrow span:last-child{font-family:var(--jp);font-weight:500;letter-spacing:.14em;font-size:11.5px}

.hero__h{
  font-family:var(--jp);font-weight:900;
  font-size:clamp(48px, 9vw, 130px);
  line-height:.92;letter-spacing:-.01em;
  margin:0 0 24px;
  text-shadow:0 1px 1px rgba(0,0,0,.18);
}
.hero__h-line{display:block;padding-block:4px}
.hero__h-line+.hero__h-line{margin-top:.18em}
.hero__h-line>span{display:inline-block}

.hero__sub{font-size:clamp(13px,1.1vw,16px);font-weight:500;line-height:1.85;max-width:560px;margin:0;letter-spacing:.04em}
.hero__ctas{display:flex;gap:14px;flex-wrap:wrap}

.hero__foot{position:absolute;left:var(--pad-x);right:var(--pad-x);bottom:36px;z-index:3;display:flex;align-items:flex-end;justify-content:space-between;font-family:var(--en);font-size:11px;letter-spacing:.22em;text-transform:uppercase}
.hero__scroll{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.hero__scroll-line{display:block;width:1px;height:54px;background:currentColor;animation:scrollLine 1.8s var(--ease) infinite;transform-origin:top}
@keyframes scrollLine{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.hero__pager{display:flex;align-items:center;gap:14px}
.hero__pager button{width:24px;height:1px;background:rgba(255,255,255,.4);transition:background var(--dur) var(--ease),width var(--dur) var(--ease)}
.hero__pager button.is-on{background:#fff;width:44px}

/* ─────────────────────────────────────────────────────────
   BUTTONS
   ───────────────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:14px;padding:18px 30px;
  font-family:var(--jp);font-weight:700;font-size:14px;letter-spacing:.12em;
  transition:transform var(--dur) var(--ease),background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.btn svg{transition:transform var(--dur) var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn:active{transform:scale(.98)}
.btn--solid{background:var(--ink);color:var(--bg)}
.btn--solid:hover{background:var(--moss)}
.btn--ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.7)}
.btn--ghost:hover{background:rgba(255,255,255,.92);color:var(--ink)}
.btn--white{background:#fff;color:var(--ink)}
.btn--white:hover{background:var(--moss);color:#fff}

/* link-more */
.link-more{
  display:inline-flex;align-items:center;gap:14px;
  font-family:var(--en);font-weight:700;font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  padding:14px 0;border-bottom:1px solid currentColor;
  transition:gap var(--dur) var(--ease),color var(--dur) var(--ease);
}
.link-more__jp{font-family:var(--jp);font-weight:500;font-size:11.5px;letter-spacing:.14em;color:var(--ink-3);text-transform:none}
.link-more:hover{gap:22px;color:var(--moss)}
.link-more--lg{font-size:15px;padding:18px 0}
.link-more--lg .link-more__jp{font-size:12.5px}

/* ─────────────────────────────────────────────────────────
   NEWS TICKER
   ───────────────────────────────────────────────────────── */
.news{
  display:grid;grid-template-columns:auto 1fr;align-items:center;gap:24px;
  padding:16px var(--pad-x);
  background:var(--ink);color:var(--bg);
  font-size:12.5px;letter-spacing:.04em;overflow:hidden;
}
.news__label{display:inline-flex;align-items:center;gap:10px;font-family:var(--en);font-weight:800;font-size:11px;letter-spacing:.24em;text-transform:uppercase}
.news__label em{font-style:normal;color:#C9D86A}
.news__label i{font-family:var(--jp);font-style:normal;font-weight:700;letter-spacing:.16em;font-size:10.5px;opacity:.6}
.news__track{display:flex;align-items:center;gap:18px;white-space:nowrap;overflow:hidden}
.news__item{display:inline-flex;align-items:center;gap:14px;opacity:.92;transition:opacity var(--dur) var(--ease)}
.news__item:hover{opacity:1}
.news__date{font-family:var(--en);font-weight:600;font-size:11px;letter-spacing:.18em;opacity:.55}
.news__sep{opacity:.25}

/* ═════════════════════════════════════════════════ CONCEPT ═══
   Editorial grid placement:
   - kicker:  cols 2-5
   - heading: cols 2-7 (under kicker, large breath)
   - photo A: cols 7-12, top right, tall
   - body:    cols 2-5 (offset down from heading)
   - photo B: cols 4-8, offset lower, smaller
   - more:    cols 2-5
   ─────────────────────────────────────────────────────────── */
.cn__kicker{
  grid-column:2 / span 5;
  font-family:var(--en);font-weight:700;font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--moss);
  margin:0 0 36px;
  display:inline-flex;align-items:center;gap:14px;
}
.cn__kicker::before{content:"";width:36px;height:1px;background:var(--moss)}

.cn__h{
  grid-column:2 / span 5;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(36px,4.6vw,68px);
  line-height:1.28;letter-spacing:-.005em;
  margin:0 0 clamp(60px,8vw,100px);
}

.cn__a{
  grid-column:8 / span 5;
  grid-row:4 / span 3;
  margin:0;position:relative;
  aspect-ratio:4/5;
  background:var(--bg-3);overflow:hidden;
  align-self:start;
}
.cn__kicker{grid-row:2}
.cn__h{grid-row:3}
.cn__body{grid-row:4}
.cn__b{grid-row:5}
.cn__more{grid-row:6}
.cn__a figcaption,
.cn__b figcaption{
  position:absolute;left:14px;bottom:12px;
  font-family:var(--en);font-size:10px;letter-spacing:.18em;color:#fff;text-transform:uppercase;
  background:rgba(14,14,12,.6);padding:6px 12px;backdrop-filter:blur(4px);
  display:flex;align-items:center;gap:10px;
}
.cn__a figcaption .cap-jp,
.cn__b figcaption .cap-jp{font-family:var(--jp);letter-spacing:.12em;font-size:10px;text-transform:none;font-weight:500}

.cn__body{
  grid-column:2 / span 5;
  font-size:15.5px;line-height:2;color:var(--ink-2);
  margin:0 0 56px;
}
.cn__body p{margin:0 0 20px}
.cn__body strong{font-weight:700;color:var(--ink)}

.cn__b{
  grid-column:3 / span 5;
  margin:clamp(160px,14vw,270px) 0 0;
  position:relative;
  aspect-ratio:5/4;
  background:var(--bg-3);overflow:hidden;
}

.cn__more{
  grid-column:2 / span 5;
  align-self:center;
  margin-top:clamp(40px,6vw,80px);
}

@media (max-width:880px){
  .cn__kicker,.cn__h,.cn__body,.cn__more{grid-column:1 / -1}
  .cn__h{font-size:clamp(30px,7vw,52px);margin-bottom:48px}
  .cn__a,.cn__b{grid-column:1 / -1;grid-row:auto;margin:24px 0 32px}
}

/* ═════════════════════════════════════════════════ MANIFESTO ═══ */
.sec--mani{
  background:var(--paper);
  border-block:1px solid var(--line);
}
.mani__lead{
  grid-column:2 / span 8;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(32px,4.4vw,68px);
  line-height:1.35;letter-spacing:.01em;
  margin:0 0 clamp(60px,8vw,100px);
}
.mani__text{
  grid-column:6 / span 8;
  font-family:var(--jp);font-weight:500;
  font-size:clamp(17px,1.6vw,22px);line-height:2.2;color:var(--ink-2);
  display:flex;flex-direction:column;gap:8px;
}
.mani__text p{margin:0}
.mani__close{
  margin-top:32px !important;font-weight:400;font-size:.85em;color:var(--ink-3);
  border-top:1px solid var(--line);padding-top:24px;
}
.mani__mark{
  grid-column:1 / span 2;grid-row:5;
  font-family:var(--en-d);
  font-size:clamp(120px,18vw,240px);
  line-height:.6;color:var(--moss-3);opacity:.45;
  align-self:start;margin-top:-24px;
}
@media (max-width:880px){
  .mani__lead,.mani__text{grid-column:1 / -1}
  .mani__mark{display:none}
}

/* ═════════════════════════════════════════════════ FEATURES ═══ */
.sec--feats{background:var(--ink);color:var(--bg)}
.sec--feats .g-num{color:var(--bg)}
.sec--feats .g-label{color:rgba(241,236,226,.55)}
.sec--feats .g-rule{background:rgba(255,255,255,.18)}

.feats__h{
  grid-column:1 / span 6;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(48px,7.5vw,120px);
  line-height:.95;letter-spacing:-.005em;
  margin:0 0 clamp(48px,7vw,96px);
}
.feats__h em{
  font-style:normal;font-family:var(--en-d);
  font-size:.7em;letter-spacing:-.01em;
  color:var(--moss-3);display:inline-block;margin-bottom:.2em;
}

.feats__list{
  grid-column:1 / -1;
  display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--gutter);row-gap:80px;
}
/* feature placement — staggered down the page */
.feats__list .feat:nth-child(1){grid-column:1 / span 4;margin-top:0}
.feats__list .feat:nth-child(2){grid-column:5 / span 4;margin-top:100px}
.feats__list .feat:nth-child(3){grid-column:9 / span 4;margin-top:220px}

.feat{
  padding-top:36px;border-top:1px solid rgba(255,255,255,.18);
  display:grid;grid-template-columns:56px 1fr;column-gap:20px;
  grid-template-rows:auto auto auto;
}
.feat__no{
  font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.24em;color:rgba(241,236,226,.55);
  grid-column:1 / -1;
}
.feat__icon{margin:28px 0 0;color:var(--moss-3);grid-column:1;grid-row:2;align-self:center}
.feat__icon svg{width:56px;height:56px}
.feat__h{
  font-family:var(--jp);font-weight:900;
  font-size:clamp(22px,2vw,30px);line-height:1.4;
  margin:28px 0 0;grid-column:2;grid-row:2;align-self:center;
}
.feat__h em{display:block;font-style:normal;font-family:var(--en-d);font-size:.65em;letter-spacing:.02em;color:var(--moss-3);margin-bottom:10px}
.feat__p{font-size:14.5px;line-height:1.95;color:rgba(241,236,226,.78);margin:24px 0 0;grid-column:1 / -1;grid-row:3}

@media (max-width:880px){
  .feats__h{grid-column:1 / -1}
  .feats__list .feat{grid-column:1 / -1 !important;margin-top:0 !important}
  .feats__list{row-gap:48px}
}

/* ═════════════════════════════════════════════════ PRODUCTS ═══
   Three product cards on the 12-col grid, placed at varied
   widths and vertical offsets so they read like a magazine spread.
   ─────────────────────────────────────────────────────────── */
.prod__h{
  grid-column:1 / span 11;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(40px,5.8vw,92px);line-height:1.08;letter-spacing:-.005em;
  margin:0 0 clamp(140px,16vw,240px);
}
.prod__h em{font-style:normal;font-family:var(--en-d);font-size:.85em;letter-spacing:-.01em;color:var(--moss);display:inline-block;margin-bottom:.2em}

.pcard{position:relative;display:block}
.pcard__media{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--bg-3);margin-bottom:28px}
.pcard__media .ph{transition:scale .9s var(--ease)}
.pcard:hover .pcard__media .ph{scale:1.04}

.pcard__cap{display:flex;flex-direction:column;gap:10px}
.pcard__no{font-family:var(--en);font-weight:700;font-size:11.5px;letter-spacing:.22em;color:var(--ink-4)}
.pcard__t{
  font-family:var(--jp);font-weight:900;
  font-size:clamp(22px,2.4vw,32px);line-height:1.25;
  margin:6px 0 10px;
  display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;
}
.pcard__t em{font-style:normal;font-family:var(--en-d);font-size:.95em;letter-spacing:-.005em;color:var(--ink)}
.pcard__cap p{font-size:14.5px;line-height:1.95;color:var(--ink-3);margin:0 0 12px}
.pcard__a{font-family:var(--en);font-weight:700;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--moss)}

/* asymmetric placement */
/* products: distribute across full width so no quadrant is empty */
.pcard--a{grid-column:2 / span 4;margin-top:0}
.pcard--b{grid-column:8 / span 4;margin-top:clamp(180px,20vw,320px)}
.pcard--c{grid-column:3 / span 4;margin-top:80px}
.pcard--c .pcard__media{aspect-ratio:4/5}
.pcard--b .pcard__media{aspect-ratio:3/4}
.pcard--a .pcard__media{aspect-ratio:5/6}

/* ── Section side-rail: vertical English label that runs down
   the right edge of major sections. Genuine wayfinding
   element that fills otherwise-dead right-half viewport stops.
   ─────────────────────────────────────────────────────── */
.sec--concept .grid::after,
.sec--feats .grid::after,
.sec--prod .grid::after,
.sec--works .grid::after,
.sec--voice .grid::after{
  position:absolute;
  top:clamp(160px,20vw,280px);
  right:calc(-1 * var(--pad-x) + 24px);
  font-family:var(--en-d);
  font-size:clamp(11px,1vw,13px);letter-spacing:.4em;
  color:var(--ink-3);
  text-transform:uppercase;
  writing-mode:vertical-rl;
  pointer-events:none;
  z-index:1;
}
.sec--concept .grid::after{content:"— 01 / CONCEPT — GARDEN-FIRST"}
.sec--feats   .grid::after{content:"— 03 / FEATURES — THREE PILLARS";color:rgba(241,236,226,.55)}
.sec--prod    .grid::after{content:"— 04 / PRODUCTS — HIRAYA · EXTERIOR · TRAILER"}
.sec--works   .grid::after{content:"— 05 / WORKS — NARA / 2024–26"}
.sec--voice   .grid::after{content:"— 07 / VOICE — STORIES OF LIVING"}

/* remove the duplicate single-section rail (now handled above) */
.sec--prod .grid::after{top:clamp(160px,20vw,280px)}

@media (max-width:880px){
  .sec--concept .grid::after,
  .sec--feats .grid::after,
  .sec--prod .grid::after,
  .sec--works .grid::after,
  .sec--voice .grid::after{display:none}
}

@media (max-width:880px){
  .prod__h{grid-column:1 / -1;margin-bottom:48px}
  .pcard--a,.pcard--b,.pcard--c{grid-column:1 / -1;margin-top:0;margin-bottom:48px}
}
/* ═════════════════════════════════════════════════ WORKS ═══
   Magazine-style asymmetric placement.
   ─────────────────────────────────────────────────────────────────────── */
.works__h{
  grid-column:1 / span 7;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(48px,7vw,108px);line-height:1.02;letter-spacing:-.005em;
  margin:0 0 32px;
}
.works__h em{font-style:normal;font-family:var(--en-d);font-size:.95em;letter-spacing:-.01em;display:inline-block;margin-bottom:.18em}
.works__lead{
  grid-column:9 / span 4;align-self:end;
  font-size:14.5px;line-height:1.95;color:var(--ink-2);
  margin:0 0 32px;
  padding-bottom:8px;
}

.work{display:block;position:relative}
.work__media{position:relative;overflow:hidden;background:var(--bg-3)}
.work__media .ph{transition:scale .9s var(--ease)}
.work:hover .work__media .ph{scale:1.04}
.work__caption{padding:24px 0 0;display:flex;flex-direction:column;gap:10px}
.work__meta{
  display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-3);
}
.work__t{font-family:var(--jp);font-weight:900;font-size:clamp(18px,1.7vw,24px);line-height:1.45;margin:6px 0 0;letter-spacing:.01em}
.work__sub{font-size:13px;color:var(--ink-3);margin:6px 0 0}
.work__tags{display:flex;gap:8px;margin-top:10px}
.work__tags span{font-family:var(--en);font-weight:700;font-size:10px;letter-spacing:.18em;text-transform:uppercase;padding:4px 10px;background:var(--ink);color:var(--bg)}

/* placements:
   work 01 — big lead image, cols 1-8
   work 02 — cols 9-12, offset DOWN ~280px
   work 03 — cols 3-8, offset down further
   work 04 — cols 9-12, offset
*/
.work--01{grid-column:1 / span 6;margin-top:clamp(60px,8vw,120px)}
.work--01 .work__media{aspect-ratio:4/3}
.work--01 .work__t{font-size:clamp(20px,2vw,28px);max-width:480px}

.work--02{grid-column:8 / span 5;margin-top:clamp(160px,18vw,280px)}
.work--02 .work__media{aspect-ratio:4/5}

.work--03{grid-column:2 / span 5;margin-top:-30px}
.work--03 .work__media{aspect-ratio:5/4}

.work--04{grid-column:8 / span 4;margin-top:260px}
.work--04 .work__media{aspect-ratio:3/4}

.works__foot{grid-column:1 / -1;display:flex;justify-content:center;margin-top:clamp(80px,12vw,140px)}
.works__line-cta{display:flex;flex-direction:column;align-items:center;gap:24px;text-align:center}
.works__line-note{font-family:var(--en);font-size:11px;letter-spacing:.18em;color:var(--ink-3);text-transform:uppercase}
.works__line-btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--jp);font-weight:700;font-size:13.5px;letter-spacing:.06em;
  padding:16px 36px;border:1px solid var(--ink);
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.works__line-btn:hover{background:var(--ink);color:var(--bg)}

@media (max-width:880px){
  .works__h,.works__lead{grid-column:1 / -1;margin-bottom:24px}
  .work--01,.work--02,.work--03,.work--04{grid-column:1 / -1;margin-top:0;margin-bottom:48px}
}

/* ═════════════════════════════════════════════════ MODEL HOUSE ═══ */
.mh{position:relative;min-height:90vh;color:#fff;display:grid;align-items:center;isolation:isolate}
.mh__media{position:absolute;inset:0;z-index:0;overflow:hidden}
.mh__veil{position:absolute;inset:0;background:linear-gradient(110deg,rgba(14,14,12,.78) 0%,rgba(14,14,12,.55) 50%,rgba(14,14,12,.25) 100%)}
.mh__inner{position:relative;z-index:2;max-width:var(--max);margin:0 auto;padding:var(--pad-y) var(--pad-x);display:grid;grid-template-columns:minmax(0,640px);gap:0}
.mh__eyebrow{font-family:var(--en);font-weight:700;font-size:12px;letter-spacing:.22em;text-transform:uppercase;display:inline-flex;align-items:center;margin-bottom:40px;color:#fff;opacity:.92}
.mh__h{font-family:var(--jp);font-weight:900;font-size:clamp(48px,7vw,108px);line-height:1.05;margin:0 0 40px;letter-spacing:-.005em;text-align:center}
.mh__p{font-size:15px;line-height:1.95;margin:0 0 40px;max-width:480px;opacity:.92}
.mh__info{display:flex;flex-direction:column;gap:8px;margin:0 0 48px;border-top:1px solid rgba(255,255,255,.22);padding-top:28px;max-width:480px}
.mh__info li{display:grid;grid-template-columns:88px 1fr;gap:20px;font-size:13.5px;line-height:1.7;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.mh__info-k{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.6);align-self:center}
.mh__info-v{color:#fff}
.mh__note{font-size:12px;line-height:1.7;color:rgba(255,255,255,.65);margin:20px 0 0}

/* ═════════════════════════════════════════════════ VOICES ═══ */
.voice__h{
  grid-column:1 / span 6;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(48px,7vw,108px);line-height:1.02;letter-spacing:-.005em;
  margin:0 0 clamp(48px,7vw,96px);
}
.voice__h em{font-style:normal;font-family:var(--en-d);font-size:.95em;letter-spacing:-.01em;display:inline-block;margin-bottom:.18em}

.vcard{
  position:relative;
  background:var(--paper);
  border:1px solid var(--line);
  padding:48px 36px 36px;
  display:flex;flex-direction:column;
}
.vcard__no{
  font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.22em;color:var(--ink-3);
  margin-bottom:24px;
}
.vcard__body{
  font-size:15px;line-height:2.05;color:var(--ink);margin:0 0 32px;flex-grow:1;letter-spacing:.02em;
}
.vcard__meta{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:16px;padding-top:22px;border-top:1px solid var(--line)}
.vcard__ph{position:relative;width:48px;height:48px;border-radius:50%;overflow:hidden;background:var(--bg-3)}
.vcard__id{display:flex;flex-direction:column;gap:2px;line-height:1.3}
.vcard__name{font-family:var(--jp);font-weight:700;font-size:13.5px}
.vcard__attr{font-family:var(--en);font-weight:500;font-size:11px;color:var(--ink-3);letter-spacing:.04em}

/* staggered placement */
.vcard--a{grid-column:1 / span 4;margin-top:0}
.vcard--b{grid-column:5 / span 4;margin-top:0}
.vcard--c{grid-column:9 / span 4;margin-top:0}

@media (max-width:880px){
  .voice__h{grid-column:1 / -1}
  .vcard--a,.vcard--b,.vcard--c{grid-column:1 / -1;margin-top:0;margin-bottom:24px}
}

/* ═════════════════════════════════════════════════ FOOTER CTA ═══ */
.fcta{
  position:relative;padding:var(--pad-y) 0;
  background:var(--ink);color:var(--bg);
  overflow:hidden;isolation:isolate;
}
.fcta__bg{
  position:absolute;left:-2vw;right:-2vw;top:50%;transform:translateY(-50%);
  z-index:0;pointer-events:none;
  display:grid;
  font-family:var(--en-d);
  font-size:clamp(140px,22vw,320px);line-height:.85;letter-spacing:-.02em;
  color:rgba(255,255,255,.04);white-space:nowrap;text-align:center;
}
.fcta__inner{position:relative;z-index:2;max-width:var(--max);margin:0 auto;padding:0 var(--pad-x);text-align:center}
.fcta__eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:var(--en);font-weight:700;font-size:12px;letter-spacing:.22em;text-transform:uppercase;margin-bottom:36px}
.fcta__h{font-family:var(--jp);font-weight:900;font-size:clamp(32px,7vw,108px);line-height:1.1;margin:0 0 32px;letter-spacing:-.005em}
.fcta__p{font-size:15px;line-height:1.95;max-width:520px;margin:0 auto 64px;color:rgba(241,236,226,.78)}

.fcta__btns{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:880px;margin:0 auto 36px}
.ftile{position:relative;display:grid;padding:32px 24px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.15);transition:background var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease);text-align:left}
.ftile:hover{background:rgba(255,255,255,.10);transform:translateY(-3px);border-color:rgba(255,255,255,.35)}
.ftile__no{position:absolute;top:14px;right:18px;font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;color:rgba(255,255,255,.4)}
.ftile__icn{color:#fff;margin-bottom:28px;display:inline-flex}
.ftile--line .ftile__icn{color:#C9D86A}
.ftile__label em{display:block;font-style:normal;font-family:var(--en-d);font-size:18px;letter-spacing:.01em;color:#fff;margin-bottom:6px}
.ftile__label span{display:block;font-family:var(--jp);font-weight:700;font-size:14px;letter-spacing:.06em;color:rgba(241,236,226,.85)}
.ftile__arr{position:absolute;bottom:18px;right:22px;font-family:var(--en);font-size:18px;color:#fff;transition:transform var(--dur) var(--ease)}
.ftile:hover .ftile__arr{transform:translateX(4px)}
.fcta__note{font-size:12.5px;color:rgba(241,236,226,.55);margin:0;letter-spacing:.04em}

@media (max-width:880px){.fcta__btns{grid-template-columns:1fr}}

/* ═════════════════════════════════════════════════ FOOTER ═══ */
.ft{background:#0A0A09;color:rgba(241,236,226,.78);padding:96px var(--pad-x) 32px;border-top:1px solid rgba(255,255,255,.06)}
.ft__top{display:grid;grid-template-columns:1.2fr 3fr;gap:64px;max-width:var(--max);margin:0 auto 64px}
.ft__brand{display:flex;flex-direction:column;gap:20px}
.ft__logo{font-family:var(--en-d);font-size:36px;line-height:.95;color:#fff;letter-spacing:-.005em}
.ft__tag{font-family:var(--jp);font-weight:700;font-size:14px;letter-spacing:.08em;color:rgba(241,236,226,.88)}
.ft__loc{font-family:var(--en);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:rgba(241,236,226,.45);margin-top:6px}
.ft__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.ft__col dt{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#fff;margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.12)}
.ft__col dd{font-size:13px;line-height:2}
.ft__col dd a:hover{color:#fff}
.ft__bot{display:flex;justify-content:space-between;align-items:center;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);font-family:var(--en);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(241,236,226,.45);max-width:var(--max);margin:0 auto}
.ft__top-link{color:#fff}

@media (max-width:880px){
  .ft__top{grid-template-columns:1fr;gap:40px}
  .ft__cols{grid-template-columns:repeat(2,1fr)}
  .ft__bot{flex-direction:column;gap:14px;align-items:flex-start}
}

/* ═════════════════════════════════════════════════ WORKS PAGE ═══ */
.wf{
  grid-column:1 / -1;
  display:flex;align-items:center;
  margin-bottom:clamp(48px,7vw,96px);
  border-bottom:1px solid var(--line);
}
.wf__btn{
  font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);background:none;border:none;cursor:pointer;
  padding:16px 24px;position:relative;
  transition:color var(--dur) var(--ease);
}
.wf__btn::after{
  content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;
  background:var(--ink);transform:scaleX(0);
  transition:transform var(--dur) var(--ease);
}
.wf__btn.is-on{color:var(--ink)}
.wf__btn.is-on::after{transform:scaleX(1)}
.wf__btn:hover{color:var(--ink)}

.wk--a{grid-column:1 / span 7;margin-top:0}
.wk--a .work__media{aspect-ratio:16/10}
.wk--b{grid-column:9 / span 4;margin-top:clamp(100px,12vw,180px)}
.wk--b .work__media{aspect-ratio:4/5}
.wk--c{grid-column:2 / span 5;margin-top:clamp(60px,8vw,120px)}
.wk--c .work__media{aspect-ratio:4/3}
.wk--d{grid-column:8 / span 5;margin-top:clamp(40px,5vw,80px)}
.wk--d .work__media{aspect-ratio:5/4}
.wk--e{grid-column:1 / span 5;margin-top:clamp(80px,10vw,140px)}
.wk--e .work__media{aspect-ratio:3/4}
.wk--f{grid-column:7 / span 6;margin-top:clamp(60px,8vw,100px)}
.wk--f .work__media{aspect-ratio:16/10}

.wk--a .work__t{font-size:clamp(20px,2vw,28px);max-width:480px}

/* works inner page */
#works.sec{padding-top:clamp(60px,8vw,100px)}

/* works inner page — 3-col list */
.works-pg{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  column-gap:var(--gutter);
  row-gap:clamp(48px,6vw,80px);
}
.works-pg .work__media{aspect-ratio:4/3}

[data-hidden="true"]{display:none!important}

@media(max-width:880px){
  .wf{overflow-x:auto;-webkit-overflow-scrolling:touch;gap:0}
  .wf__btn{padding:14px 16px;white-space:nowrap}
  .wk--a,.wk--b,.wk--c,.wk--d,.wk--e,.wk--f{grid-column:1 / -1;margin-top:0;margin-bottom:48px}
  .works-pg{grid-template-columns:1fr;row-gap:40px}
}

/* ═════════════════════════════════════════════════ TRAILERHOUSE PAGE ═══ */
@media(max-width:880px){
  .page-trailerhouse .pg-hero__h br{display:none}
}
.th-price{grid-column:2 / span 8;display:flex;flex-direction:column;align-items:flex-start;gap:28px}
.th-price__label{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3)}
.th-price__num{font-family:var(--jp);font-size:clamp(16px,1.6vw,20px);color:var(--ink);line-height:1.4}
.th-price__num strong{font-family:var(--en-d);font-size:clamp(48px,6vw,80px);font-weight:800;letter-spacing:-.02em;display:block;color:var(--ink);margin-bottom:.1em}
.th-price__num span{font-size:14px;color:var(--ink-3);font-family:var(--jp);font-weight:400}
.th-price__note{font-size:14px;line-height:1.9;color:var(--ink-2);max-width:560px}
.th-price__btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--jp);font-weight:700;font-size:13.5px;letter-spacing:.06em;padding:16px 36px;border:1px solid var(--ink);transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}
.th-price__btn:hover{background:var(--ink);color:var(--bg)}
@media(max-width:880px){.th-price{grid-column:1/-1}}

/* ═════════════════════════════════════════════════ PAGE HERO ═══ */
.pg-hero{
  padding:clamp(80px,12vw,160px) 0 clamp(80px,10vw,140px);
  border-bottom:1px solid var(--line);
}
.pg-hero__crumb{
  grid-column:1 / -1;
  font-family:var(--en);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);
  display:flex;align-items:center;gap:12px;
  margin-bottom:clamp(48px,7vw,96px);
}
.pg-hero__crumb a{color:inherit;text-decoration:none}
.pg-hero__h{
  grid-column:1 / span 10;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(40px,6.5vw,100px);
  line-height:1.12;letter-spacing:-.01em;
  margin:0 0 clamp(24px,3vw,40px);
}
.page-hiraya .pg-hero__h{grid-column:1 / span 12}
.pg-hero__h em{
  display:block;font-style:normal;
  font-family:var(--en-d);font-size:.58em;
  letter-spacing:-.01em;color:var(--moss);margin-bottom:.3em;
}
.pg-hero__sub{
  grid-column:1 / span 6;
  font-family:var(--en);font-weight:700;font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);margin:0;
}
@media(max-width:880px){
  .pg-hero__h,.pg-hero__sub{grid-column:1 / -1}
}

/* ─────────────────────────────────────────────────────────
   STRENGTHS — inner page, calm 3-col layout (light bg)
   ─────────────────────────────────────────────────────── */
.strg__list{
  grid-column:1 / -1;
  display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--gutter);
}
.strg__item{
  grid-column:span 4;
  padding-top:32px;
  border-top:1px solid var(--line);
}
.strg__no{
  font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.24em;
  color:var(--ink-4);display:block;margin-bottom:28px;
}
.strg__h{
  font-family:var(--jp);font-weight:900;
  font-size:clamp(18px,1.6vw,22px);line-height:1.45;
  margin:0 0 16px;
}
.strg__h em{display:block;font-style:normal;font-family:var(--en-d);font-size:.85em;letter-spacing:.01em;color:var(--moss);margin-bottom:8px}
.strg__p{font-size:14px;line-height:2;color:var(--ink-3);margin:0}
@media(max-width:880px){
  .strg__item{grid-column:1 / -1;margin-bottom:40px}
  .strg__item:last-child{margin-bottom:0}
}

.sec--pt-sm{padding-top:clamp(40px,5vw,80px)}

.cn__h--origin{grid-column:2 / span 6}
@media(max-width:880px){
  .cn__h--origin{grid-column:1 / span 6}
}

/* dark section overrides for cn__ elements */
.sec--feats .cn__kicker{color:var(--moss-3)}
.sec--feats .cn__body{color:rgba(241,236,226,.78)}
.sec--feats .cn__body strong{color:var(--bg)}
.sec--feats .link-more{color:var(--bg)}
.sec--feats .link-more__jp{color:rgba(241,236,226,.7)}

/* ═════════════════════════════════════════════════ HIRAYA PAGE ═══ */

/* 5-item merit grid — center items 4 & 5 in second row */
.strg__list--5 .strg__item:nth-child(4){grid-column:3 / span 4}
.strg__list--5 .strg__item:nth-child(5){grid-column:7 / span 4}
.strg__list--5{row-gap:clamp(40px,6vw,80px)}

/* hiraya section headings (secondary, calmer than pg-hero) */
.hiraya-sec__h{
  grid-column:1 / -1;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(32px,4vw,60px);line-height:1.25;letter-spacing:-.005em;
  margin:0 0 clamp(56px,8vw,100px);
}
.hiraya-sec__h em{
  display:block;font-style:normal;
  font-family:var(--en-d);font-size:.65em;letter-spacing:.01em;
  color:var(--moss);margin-bottom:.3em;
}

/* blockquote pull-quote */
.hr-quote{
  font-family:var(--jp);font-weight:900;
  font-size:clamp(17px,1.7vw,24px);line-height:1.6;
  padding:24px 0 24px 28px;
  border-left:3px solid var(--moss);
  color:var(--moss);
  margin:0 0 32px;
  font-style:normal;
}

/* FAQ accordion (details/summary) */
.hiraya-faq{grid-column:2 / span 8}
.hiraya-faq__item{border-top:1px solid var(--line)}
.hiraya-faq__item:last-child{border-bottom:1px solid var(--line)}
.hiraya-faq__btn{
  display:flex;align-items:flex-start;justify-content:space-between;
  padding:28px 0;
  font-family:var(--jp);font-weight:700;font-size:15.5px;line-height:1.7;
  cursor:pointer;list-style:none;gap:20px;
  width:100%;
}
.hiraya-faq__btn::marker,.hiraya-faq__btn::-webkit-details-marker{display:none}
.hiraya-faq__q{flex:1}
.hiraya-faq__icon{
  font-family:var(--en);font-weight:700;font-size:22px;line-height:1;
  color:var(--moss);flex-shrink:0;margin-top:4px;
  transition:transform var(--dur) var(--ease);
  display:inline-block;
}
.hiraya-faq__item[open] .hiraya-faq__icon{transform:rotate(45deg)}
.hiraya-faq__ans{padding:0 0 28px;font-size:14.5px;line-height:2;color:var(--ink-2);max-width:640px}
.hiraya-faq__ans p{margin:0}
.hiraya-faq__h{
  grid-column:2 / span 8;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(28px,3.5vw,48px);
  line-height:1.3;margin:0 0 clamp(48px,7vw,80px);
}

@media(max-width:880px){
  .hiraya-faq{grid-column:1 / -1}
  .hiraya-faq__h{grid-column:1 / -1}
  .hiraya-sec__h{margin-bottom:40px}
  .strg__list--5 .strg__item:nth-child(4),
  .strg__list--5 .strg__item:nth-child(5){grid-column:1 / -1}
}

/* ═════════════════════════════════════════════════ SHARED INNER PAGE HEADING ═══ */
.pg-h{
  grid-column:1 / -1;
  font-family:var(--jp);font-weight:900;
  font-size:clamp(32px,4vw,60px);line-height:1.25;letter-spacing:-.005em;
  margin:0 0 clamp(48px,7vw,96px);
}
.pg-h em{display:block;font-style:normal;font-family:var(--en-d);font-size:.65em;letter-spacing:.01em;color:var(--moss);margin-bottom:.3em}

/* ═════════════════════════════════════════════════ FORM ═══ */
.pg-form{grid-column:2 / span 8}
.pg-form__group{margin-bottom:28px}
.pg-form__label{
  display:flex;align-items:center;gap:8px;
  font-family:var(--jp);font-weight:700;font-size:13.5px;letter-spacing:.04em;
  margin-bottom:10px;color:var(--ink);
}
.pg-form__required{font-family:var(--en);font-weight:700;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--bg);background:var(--moss);padding:2px 8px}
.pg-form__optional{font-family:var(--en);font-weight:500;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4)}
.pg-form__input,.pg-form__textarea{
  width:100%;background:var(--paper);border:1px solid var(--line-2);padding:14px 16px;
  font-family:var(--jp);font-size:14.5px;color:var(--ink);
  transition:border-color var(--dur) var(--ease);
  -webkit-appearance:none;appearance:none;
}
.pg-form__input:focus,.pg-form__textarea:focus{outline:none;border-color:var(--moss)}
.pg-form__textarea{resize:vertical;min-height:120px;line-height:1.8}
.pg-form__checks,.pg-form__radios{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:4px}
.pg-form__check-label,.pg-form__radio-label{display:flex;align-items:center;gap:8px;font-size:13.5px;cursor:pointer;line-height:1.4}
.pg-form__check-label input,.pg-form__radio-label input{accent-color:var(--moss);width:15px;height:15px;flex-shrink:0}
.pg-form__note{font-size:12px;color:var(--ink-3);line-height:1.8;margin:8px 0 0}
.pg-form__policy{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;cursor:pointer;line-height:1.6}
.pg-form__policy input{accent-color:var(--moss);width:15px;height:15px;flex-shrink:0;margin-top:3px}
.pg-form__submit{margin-top:40px}
.pg-form__btn{
  display:flex;align-items:center;justify-content:center;gap:12px;
  width:100%;padding:22px;background:var(--ink);color:var(--bg);
  font-family:var(--jp);font-weight:700;font-size:15px;letter-spacing:.12em;
  border:none;cursor:pointer;transition:background var(--dur) var(--ease);
}
.pg-form__btn:hover{background:var(--moss)}
@media(max-width:880px){.pg-form{grid-column:1/-1}}

/* ═════════════════════════════════════════════════ COLUMN PAGE ═══ */
.col-grid{
  grid-column:1 / -1;
  display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--gutter);
  row-gap:clamp(48px,7vw,80px);
}
.col-card{position:relative;display:block}
.col-card:nth-child(3n+1){grid-column:1 / span 4}
.col-card:nth-child(3n+2){grid-column:5 / span 4}
.col-card:nth-child(3n+3){grid-column:9 / span 4}
.col-card__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--bg-3);margin-bottom:20px}
.col-card__media .ph{transition:scale .9s var(--ease)}
.col-card:hover .col-card__media .ph{scale:1.04}
.col-card__tag{font-family:var(--en);font-weight:700;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--moss);display:block;margin-bottom:10px}
.col-card__t{font-family:var(--jp);font-weight:700;font-size:15px;line-height:1.6;margin:0 0 8px;color:var(--ink);transition:color var(--dur) var(--ease)}
.col-card:hover .col-card__t{color:var(--moss)}
.col-card__date{font-family:var(--en);font-size:11px;letter-spacing:.16em;color:var(--ink-4)}
.col-pager{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:6px;margin-top:clamp(48px,7vw,80px)}
.col-pager__btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border:1px solid var(--line-2);
  font-family:var(--en);font-size:14px;color:var(--ink-3);
  transition:all var(--dur) var(--ease);
}
.col-pager__btn.is-on,.col-pager__btn:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
@media(max-width:880px){
  .col-card:nth-child(3n+1),.col-card:nth-child(3n+2),.col-card:nth-child(3n+3){grid-column:1/-1}
}

/* ═════════════════════════════════════════════════ VOICE STORIES ═══ */
.sec--voice-list{padding-top:clamp(60px,8vw,100px)}
.sec--col-list{padding-top:clamp(60px,8vw,100px)}
@media(max-width:880px){
  .page-column .pg-hero__h br{display:none}
}
.voice-pg{grid-column:2 / span 8}
.voice-story{padding:clamp(48px,7vw,72px) 0;border-bottom:1px solid var(--line)}
.voice-story:first-child{border-top:1px solid var(--line)}
.voice-story__head{display:flex;align-items:flex-start;gap:20px;margin-bottom:28px}
.voice-story__avt{width:52px;height:52px;border-radius:50%;background:var(--bg-3);flex-shrink:0;border:1px solid var(--line-2)}
.voice-story__info{display:flex;flex-direction:column;gap:4px}
.voice-story__label{font-family:var(--en);font-weight:700;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--moss)}
.voice-story__profile{font-family:var(--jp);font-weight:700;font-size:14px;color:var(--ink);margin-top:2px}
.voice-story__context{font-size:12.5px;color:var(--ink-3)}
.voice-story__quote{
  font-family:var(--jp);font-weight:900;font-size:clamp(17px,1.9vw,24px);
  line-height:1.55;border-left:3px solid var(--moss);padding-left:24px;
  color:var(--ink);margin:0 0 32px;font-style:normal;
}
.voice-story__item{margin-bottom:24px;padding-left:20px;border-left:1px solid var(--line)}
.voice-story__item:last-child{margin-bottom:0}
.voice-story__q{font-family:var(--en);font-weight:700;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);margin-bottom:8px}
.voice-story__a{font-size:14.5px;line-height:2;color:var(--ink-2);margin:0}
@media(max-width:880px){.voice-pg{grid-column:1/-1}}

/* ═════════════════════════════════════════════════ MODELHOUSE STEPS + TABLE ═══ */
.mh-steps{grid-column:2 / span 8}
.mh-step{
  display:grid;grid-template-columns:60px 1fr;column-gap:28px;
  padding:32px 0;border-top:1px solid var(--line);align-items:start;
}
.mh-step:last-child{border-bottom:1px solid var(--line)}
.mh-step__no{font-family:var(--en-d);font-size:clamp(36px,4vw,52px);line-height:1;color:var(--moss-3);letter-spacing:-.02em}
.mh-step__body{padding-top:6px}
.mh-step__t{font-family:var(--jp);font-weight:700;font-size:17px;line-height:1.5;margin:0 0 10px}
.mh-step__p{font-size:14px;line-height:1.95;color:var(--ink-2);margin:0 0 8px}
.mh-step__time{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--moss)}
.mh-info-table{grid-column:2 / span 8;border-collapse:collapse;width:100%}
.mh-info-table th,.mh-info-table td{padding:18px 0;border-bottom:1px solid var(--line);vertical-align:top;font-size:14.5px;line-height:1.85}
.mh-info-table th{width:140px;font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);padding-right:24px;white-space:nowrap}
.mh-info-table td{color:var(--ink-2)}
.mh-point-no{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--moss-3);display:block;margin-bottom:12px}
@media(max-width:880px){
  .mh-steps,.mh-info-table{grid-column:1/-1}
  .mh-info-table th{width:100px;font-size:10px}
}
.mh-access{grid-column:2 / span 8;display:flex;flex-direction:column;gap:32px}
.mh-access__map{height:360px;background:var(--bg-3);display:flex;align-items:center;justify-content:center;font-family:var(--en);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4)}
.mh-access__table{border-collapse:collapse;width:100%}
.mh-access__table th,.mh-access__table td{padding:18px 0;border-bottom:1px solid var(--line);vertical-align:top;font-size:14.5px;line-height:1.85}
.mh-access__table th{width:140px;font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);padding-right:24px;white-space:nowrap}
.mh-access__table td{color:var(--ink-2)}
.mh-access__table a{color:var(--ink);text-decoration:underline}
@media(max-width:880px){.mh-access{grid-column:1/-1}}

/* ═════════════════════════════════════════════════ ABOUT PAGE ═══ */
.about-table{grid-column:2 / span 8;border-collapse:collapse;width:100%}
.about-table th,.about-table td{padding:18px 0;border-bottom:1px solid var(--line);vertical-align:top;font-size:14.5px;line-height:1.85}
.about-table th{width:140px;font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);padding-right:24px;white-space:nowrap}
.about-table td{color:var(--ink-2)}
.about-msg-img{grid-column:2 / span 4;grid-row:4;position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--bg-3);align-self:start}
.about-msg-img .ph{inset:-10% 0;will-change:translate}
.about-msg-text{grid-column:7 / span 6;grid-row:4;align-self:start}
.about-msg-text p{font-size:15px;line-height:2;color:var(--ink-2);margin:0 0 20px}
.about-msg-text p:last-of-type{margin-bottom:0}
.about-sig{font-family:var(--jp);font-weight:700;font-size:14px;color:var(--ink);margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}
.about-staff{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);column-gap:var(--gutter);row-gap:clamp(40px,6vw,64px)}
.about-staff-card{padding-top:32px;border-top:1px solid var(--line)}
.about-staff-card__role{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--moss);margin-bottom:14px;display:block}
.about-staff-card__name{font-family:var(--jp);font-weight:900;font-size:18px;margin:0 0 4px}
.about-staff-card__spec{font-size:12px;color:var(--ink-3);margin-bottom:20px;font-family:var(--en);letter-spacing:.04em;display:block}
.about-staff-card__p{font-size:14px;line-height:2;color:var(--ink-2);margin:0}
@media(max-width:880px){
  .about-table{grid-column:1/-1}
  .about-table th{width:90px;font-size:10px}
  .about-msg-img,.about-msg-text{grid-column:1/-1;grid-row:auto}
  .about-msg-img{margin-bottom:32px}
  .about-staff{grid-template-columns:1fr}
}

/* ═════════════════════════════════════════════════ CONTACT PAGE ═══ */
.contact-methods{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);column-gap:var(--gutter)}
.contact-tile{
  padding:clamp(28px,3.5vw,44px);border:1px solid var(--line);background:var(--paper);
  display:flex;flex-direction:column;gap:14px;
  transition:border-color var(--dur) var(--ease);
}
.contact-tile:hover{border-color:var(--ink)}
.contact-tile__no{font-family:var(--en);font-weight:700;font-size:11px;letter-spacing:.2em;color:var(--ink-4)}
.contact-tile__en{font-family:var(--en-d);font-size:clamp(22px,2.5vw,32px);letter-spacing:-.01em;color:var(--moss);line-height:1}
.contact-tile__t{font-family:var(--jp);font-weight:700;font-size:16px;line-height:1.3;margin:2px 0 0}
.contact-tile__p{font-size:13.5px;line-height:1.95;color:var(--ink-3);margin:0;flex:1}
.contact-tile__btn{
  display:inline-flex;align-items:center;gap:10px;align-self:flex-start;
  font-family:var(--jp);font-weight:700;font-size:12.5px;letter-spacing:.1em;
  padding:13px 20px;border:1px solid var(--ink);color:var(--ink);
  transition:background var(--dur) var(--ease),color var(--dur) var(--ease);
}
.contact-tile__btn:hover{background:var(--ink);color:var(--bg)}
.contact-tile--line .contact-tile__btn{background:var(--ink);color:var(--bg)}
.contact-tile--line .contact-tile__en{color:#C9D86A}
@media(max-width:880px){.contact-methods{grid-template-columns:1fr;row-gap:16px}}
