@font-face{font-family:"Newsreader";font-style:normal;font-display:swap;font-weight:200 800;src:url(../assets/fonts/newsreader-opsz.woff2) format("woff2-variations"),url(../assets/fonts/newsreader-opsz.woff2) format("woff2")}
/* Meridia v6 — direction "Photographs at uneven sizes" (seed 1630141929)
   Newsreader · warm black & gold · 12-col grid · square corners */
:root{
  --bg:#0c0a08; --surface:#181512; --surface-2:#221e1a; --ink:#ffffff; --muted:#a39d96; --accent:#c9a45a; --accent-strong:#dcb874; --accent-ink:#0c0a08;
  --step-small:clamp(0.8125rem,0.79rem + 0.1vw,0.875rem);
  --step-body:clamp(1.0625rem,1.02rem + 0.25vw,1.25rem);
  --step-lead:clamp(1.25rem,1.1rem + 0.7vw,1.625rem);
  --step-head:clamp(2rem,1.3rem + 3.2vw,4rem);
  --m:5vw; --gap:16px; --sec:clamp(120px,14vw,220px);
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-in-out:cubic-bezier(.65,0,.35,1); --ease-soft:cubic-bezier(.25,.8,.25,1);
  --t-press:140ms; --t-hover:220ms;
  --font:"Newsreader",Georgia,"Times New Roman",serif;

}
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:136px}
body{background:var(--bg);color:var(--ink);font:400 var(--step-body)/1.6 var(--font);font-optical-sizing:auto;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
h1,h2,h3{font-weight:300;letter-spacing:-0.02em;line-height:1.02;text-wrap:balance}
p{text-wrap:pretty}
::selection{background:var(--accent);color:var(--accent-ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:var(--m);top:12px;z-index:200;background:var(--accent);color:var(--accent-ink);padding:10px 16px;transform:translateY(-200%)}.skip:focus{transform:none}

/* grid */
.wrap{padding-inline:var(--m)}
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.sec{padding-top:var(--sec)}
.h2{font-size:var(--step-head);font-weight:300;letter-spacing:-0.035em;line-height:.98}
.lead{font-size:var(--step-lead);line-height:1.4}
.small{font-size:var(--step-small);color:var(--muted);line-height:1.5}
.cap{font-size:var(--step-small);color:var(--muted);margin-top:12px;line-height:1.45}
.ph{background:var(--surface);overflow:hidden}
.ph img{width:100%;height:100%;object-fit:cover}

/* buttons & links — square corners, flat */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;background:var(--accent);color:var(--accent-ink);font-size:var(--step-body);font-weight:500;line-height:1;transition:transform var(--t-press) var(--ease-out),background-color var(--t-hover) ease}
.btn:active{transform:scale(.97)}
.btn-quiet{background:var(--surface-2);color:var(--ink)}
.btn svg{width:18px;height:18px;flex:none}
.link{text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 45%,transparent);text-underline-offset:.22em;text-decoration-thickness:.06em;transition:text-decoration-color var(--t-hover) ease,color var(--t-hover) ease}
@media (hover:hover) and (pointer:fine){
  .btn:hover{background:var(--accent-strong)}
  .btn-quiet:hover{background:#2e2924}
  .link:hover{text-decoration-color:currentColor}
}
.acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:32px}
.acts .link{display:inline-flex;align-items:center;gap:8px}
.acts .link svg{width:18px;height:18px}

/* ============ HEADER ============ */
.hdr{position:fixed;inset:0 0 auto;z-index:60;background:var(--bg);transition:transform .45s var(--ease-out)}
.hdr.is-hidden{transform:translateY(-100%)}
.hdr-in{height:72px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-inline:var(--m)}
.logo{justify-self:start;display:inline-flex;align-items:center;gap:12px;font-size:1.375rem;font-weight:400;letter-spacing:-0.01em}
.logo svg{width:26px;height:26px;color:var(--accent)}
.hnav{display:flex;gap:32px;font-size:var(--step-body)}
.hnav a,.hnav button{position:relative;padding:6px 0;line-height:1}
.hnav a[aria-current],.hnav button.is-active{color:var(--accent)}
.hact{justify-self:end;display:flex;align-items:center;gap:24px}
.hact .btn{min-height:44px;padding:0 20px}
.h-wa{display:inline-flex;align-items:center;gap:8px}
.h-wa svg{width:18px;height:18px}
.burger{display:none;width:44px;height:44px;position:relative}
.burger span{position:absolute;left:10px;right:10px;height:2px;background:currentColor;transition:transform .3s var(--ease-out),top .3s var(--ease-out)}
.burger span:nth-child(1){top:17px}.burger span:nth-child(2){top:25px}
.burger[aria-expanded="true"] span:nth-child(1){top:21px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){top:21px;transform:rotate(-45deg)}
/* services menu: a floating panel, the one thing allowed a shadow */ /* taste-skill-ignore: floating menu */
.menu{position:absolute;top:72px;left:0;right:0;background:var(--surface);box-shadow:0 30px 60px -30px rgba(0,0,0,.8);display:none} /* taste-skill-ignore */
.hdr.menu-on .menu{display:block}
.menu-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:40px var(--m) 48px}
.menu-col{grid-column:span 3}
.menu-col p{color:var(--muted);font-size:var(--step-small);margin-bottom:12px}
.menu-col a{display:block;padding:7px 0;font-size:var(--step-lead);line-height:1.2}
.menu-pic{grid-column:8 / span 5}
.menu-pic .ph{aspect-ratio:16/10}
@media (hover:hover){.menu-col a:hover{color:var(--accent)}}
/* phone sheet */
.msheet{position:fixed;inset:72px 0 0;z-index:55;background:var(--bg);overflow-y:auto;padding:16px var(--m) 120px;display:none}
.msheet.is-open{display:block}
.msheet p{color:var(--muted);font-size:var(--step-small);margin:24px 0 6px}
.msheet a{display:block;padding:9px 0;font-size:1.5rem;line-height:1.2}

/* ============ HERO — three prints, one line ============ */
.hero{padding-top:72px}
.rail{position:relative;margin-top:calc(18vh - 72px);align-items:start;grid-template-rows:auto 1fr}
.p-small{grid-column:1 / span 2}
.p-small .ph{aspect-ratio:1/1}
.p-tall{grid-column:4 / span 6}
.p-tall .ph{aspect-ratio:4/5;max-height:calc(100vh - 150px)}
.p-wide{grid-column:10 / span 3;margin-right:calc(var(--m) * -1)}
.p-wide .ph{aspect-ratio:16/10}
.hero-txt{grid-column:1 / span 3;grid-row:2;margin-top:28px;align-self:start}
.p-small{grid-row:1}
.p-tall,.p-wide{grid-row:1 / span 2}
.hero h1{font-size:clamp(1.875rem,2.8vw,2.75rem);font-weight:300;letter-spacing:-0.025em;line-height:1.02}
.hero-s{margin-top:24px;color:var(--muted);max-width:30ch;font-size:var(--step-body);line-height:1.5}
.hero .acts{margin-top:28px;flex-direction:column;align-items:flex-start;gap:16px}
.hero-proof{display:flex;flex-wrap:wrap;gap:20px 28px;margin-top:56px;padding-right:var(--m)}
.hero-proof li{font-size:var(--step-small);color:var(--muted);line-height:1.35}
.hero-proof b{display:block;color:var(--ink);font-size:var(--step-lead);font-weight:400}

/* logos */
.logos{padding-top:clamp(80px,9vw,140px)}
.logos-l{padding-inline:var(--m);color:var(--muted);font-size:var(--step-small);margin-bottom:28px}
.logos-vp{overflow:hidden;padding-left:var(--m)}
.logos-track{display:flex;width:max-content}
.logos-row{display:flex;align-items:center;gap:clamp(56px,7vw,104px);padding-right:clamp(56px,7vw,104px);flex:none}
.logos-row img{height:var(--h);width:auto;filter:invert(1);opacity:.82}
.logos-track{animation:marq 48s linear infinite}
.logos-vp:hover .logos-track{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.logos-track{animation-duration:90s}}
@keyframes marq{to{transform:translateX(-50%)}}

/* ============ BAND of unequal panels (+ finish switch) ============ */
.band-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;padding-left:calc((100vw - 2*var(--m)) * 2/12 + var(--m));padding-right:var(--m);margin-bottom:56px}
.switch{display:flex;gap:6px}
.switch button{min-height:44px;padding:0 20px;background:var(--surface-2);font-size:var(--step-body);transition:background-color var(--t-hover) ease,color var(--t-hover) ease,transform var(--t-press) var(--ease-out)}
.switch button:active{transform:scale(.97)}
.switch button[aria-pressed="true"]{background:var(--ink);color:var(--accent-ink)}
.band{display:flex;height:68svh;min-height:420px}
.band .pn{position:relative;overflow:hidden;flex:var(--fg) 1 0;transition:flex-grow .5s var(--ease-out)}
.band .pn img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .45s ease}
.band .pn img.b{opacity:0}
.band.is-alt .pn img.a{opacity:0}.band.is-alt .pn img.b{opacity:1}
.pn-t{position:absolute;left:0;top:0;z-index:1;padding:24px 28px 40px 24px;font-size:var(--step-lead);line-height:1.15;background:radial-gradient(120% 120% at 0 0,rgba(0,0,0,.55),rgba(0,0,0,0) 70%)} /* taste-skill-ignore: scrim over photo */
@media (hover:hover) and (pointer:fine){.band .pn:hover{flex-grow:6}}
.band-cap{padding-inline:var(--m);margin-top:16px;color:var(--muted);font-size:var(--step-body);max-width:80ch}

/* ============ DIAGONAL stages ============ */
.diag{row-gap:0}
.diag-h{grid-column:7 / span 6;grid-row:1}
.st{display:contents}
.st1 .ph{grid-column:1 / span 4;grid-row:1 / span 2;aspect-ratio:3/4}
.st1 .st-t{grid-column:5 / span 3;grid-row:2;align-self:start;margin-top:40px}
.st2 .ph{grid-column:6 / span 3;grid-row:3;aspect-ratio:1/1;margin-top:-120px}
.st2 .st-t{grid-column:9 / span 4;grid-row:3;align-self:start;margin-top:-120px}
.st3 .ph{grid-column:8 / span 5;grid-row:4;aspect-ratio:16/10;margin-top:120px}
.st3 .st-t{grid-column:3 / span 4;grid-row:4;align-self:start;margin-top:120px}
.st-t{max-width:36ch}
.st-t b{font-weight:500}
.diag-note{grid-column:1 / span 6;grid-row:5;margin-top:56px;color:var(--muted);max-width:52ch}

/* ============ STAGGERED work tiles ============ */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gap);row-gap:72px;align-items:start}
.tile .ph{aspect-ratio:4/5}
.tile.w{grid-column-end:span 2}.tile.w .ph{aspect-ratio:3/2}
.tile-c{display:flex;justify-content:space-between;gap:16px;margin-top:14px;font-size:var(--step-small);line-height:1.4}
.tile-c b{font-weight:500;color:var(--ink);font-size:var(--step-body)}
.tile-c span{color:var(--muted);text-align:right}
.tiles-h{align-self:center}
.c1{grid-column-start:1}.c2{grid-column-start:2}.c3{grid-column-start:3}.c4{grid-column-start:4}
.tile .ph img{transition:transform 1s var(--ease-out)}
@media (hover:hover){a.tile:hover .ph img{transform:scale(1.03)}}

/* ============ TABLE pushed right ============ */
.tbl-h{grid-column:1 / span 12;padding-left:3vw;max-width:22ch}
.tbl-h span{display:block;margin-left:-3vw}
.tbl-name{grid-column:7;font-size:var(--step-small);color:var(--muted);padding-top:4px}
.tbl{grid-column:8 / span 5}
.tbl-g{margin-top:96px}
.tbl li{display:grid;grid-template-columns:30% 1fr auto;gap:16px;align-items:baseline;padding:13px 0}
.tbl li.gap{margin-top:30px}
.tbl .k{color:var(--muted)}
.tbl .v{text-align:right}
.tbl a{display:contents}
.tbl a .p{text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);text-underline-offset:.22em}
@media (hover:hover){.tbl a:hover .p{color:var(--accent)}}
.tbl-pic{grid-column:1 / span 4;align-self:end}
.tbl-pic .ph{aspect-ratio:4/5}

/* ============ NAMES in columns ============ */
.names-h{grid-column:1 / span 4}
.names{grid-column:5 / span 8;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 32px}
.names li{font-size:clamp(1.0625rem,1rem + .35vw,1.3125rem);line-height:1.5}
.names .k{color:var(--muted);font-size:clamp(1.0625rem,1rem + .35vw,1.3125rem);line-height:1.5}

/* ============ FAQ beside tall photograph ============ */
.faqs{background:var(--surface);margin-top:var(--sec);padding-bottom:80px}
.faqs .g12{align-items:start}
.faq-l{grid-column:1 / span 5;padding-top:clamp(80px,9vw,140px)}
.facts{margin-top:28px}
.facts li{font-size:var(--step-body);line-height:1.5;padding:2px 0}
.qa{margin-top:40px}
.qa details{padding:14px 0}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:var(--step-lead);line-height:1.25;min-height:44px}
.qa summary::-webkit-details-marker{display:none}
.chev{position:relative;flex:none;width:14px;height:14px;transition:transform .3s var(--ease-out)}
.chev::before,.chev::after{content:"";position:absolute;top:6px;width:9px;height:2px;background:currentColor}
.chev::before{left:0;transform:rotate(45deg)}.chev::after{right:0;transform:rotate(-45deg)}
details[open] .chev{transform:rotate(180deg)}
.qa p{margin-top:10px;color:var(--muted);max-width:56ch}
.faq-r{grid-column:7 / span 6;position:relative;margin-top:calc(var(--sec) * -.5)}
.faq-r .tall{aspect-ratio:3/4}
.faq-r .sq{position:absolute;left:-40px;bottom:-40px;width:34%;aspect-ratio:1/1;outline:12px solid var(--surface)}

/* ============ CONTACT ============ */
.contact{padding-top:160px;padding-bottom:120px;align-items:start}
.ct-l{grid-column:1 / span 5}
.ct-s{font-size:clamp(1.5rem,1rem + 1.6vw,2.25rem);line-height:1.15;font-weight:300;letter-spacing:-0.02em}
.ct-note{margin-top:24px;max-width:44ch;color:var(--muted)}
.ct-pic{grid-column:7 / span 2}
.ct-pic .ph{aspect-ratio:1/1}
.ct-f{grid-column:9 / span 4}
.ct-q{font-size:var(--step-lead);font-weight:500;line-height:1.25}
form.lead{display:grid;gap:22px;margin-top:22px}
fieldset{border:0;min-width:0}
legend,.fl{display:block;font-size:var(--step-small);color:var(--muted);margin-bottom:10px;padding:0}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:var(--surface-2);font-size:var(--step-small);cursor:pointer;transition:background-color var(--t-hover) ease,color var(--t-hover) ease}
.chip input:checked+span{background:var(--ink);color:var(--accent-ink)}
.chip input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.chips.bad span,.fld.bad .chip span{outline:1px solid #d77a6a}
input[type=tel],input[type=text]{width:100%;min-height:52px;padding:0 16px;background:var(--surface-2);border:1px solid transparent;font-size:16px;color:var(--ink);border-radius:0}
input::placeholder{color:#8a847d}
input:focus{outline:none;border-color:var(--accent)}
.fld.bad input{border-color:#d77a6a}
.err{display:none;color:#e89a8b;font-size:var(--step-small)}.err.show{display:block}
.ok{display:none;background:var(--surface-2);padding:16px;font-size:var(--step-body)}
.ok a{text-decoration:underline}
.ok b{display:block;font-weight:500;margin-bottom:6px;font-size:var(--step-lead)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fnote{font-size:var(--step-small);color:var(--muted)}
.fintro{font-size:var(--step-body);line-height:1.45;max-width:46ch}
.fstep{display:grid;gap:22px}
.fstep[hidden]{display:none}
.fback{font-size:var(--step-small);color:var(--muted)}
.fback .link{font-size:var(--step-small);color:var(--ink)}
form.lead{position:relative}
form.lead.is-sending button[type=submit]{opacity:.6;pointer-events:none}
.ct-links{margin-top:22px;display:flex;flex-direction:column;gap:6px}

/* ============ FOOTER — name across the last photograph ============ */
.ftr{position:relative;height:100svh;min-height:640px;overflow:hidden;color:#fff;isolation:isolate}
.ftr>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.62);z-index:-1}
.ftr-top{position:absolute;top:32px;left:var(--m);right:var(--m);display:flex;justify-content:space-between;gap:32px;font-size:var(--step-body)}
.ftr-top ul{display:grid;grid-template-columns:repeat(2,auto);column-gap:40px;row-gap:2px}
.ftr-top .ct{text-align:right;display:flex;flex-direction:column;gap:2px}
.ftr-bot{position:absolute;left:var(--m);right:var(--m);bottom:24px}
.ftr-name{display:block;font-size:29.2vw;font-weight:300;letter-spacing:-0.05em;line-height:.8;white-space:nowrap;margin-left:-.04em}
.ftr-legal{margin-top:20px;display:flex;flex-wrap:wrap;gap:6px 28px;font-size:1rem;color:rgba(255,255,255,.82)}
.ftr-legal a{text-decoration:underline}

/* phone action bar: flat, docked */
.mbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:50;grid-template-columns:1fr 1fr;background:var(--bg);padding:10px var(--m) calc(10px + env(safe-area-inset-bottom));gap:8px;transform:translateY(110%);transition:transform .4s var(--ease-out)}
.mbar.is-on{transform:none}
.mbar.one{grid-template-columns:1fr}
.mbar .btn{min-height:48px;padding:0 12px;font-size:1rem}

/* ============ SERVICE-PAGE BLOCKS ============ */
/* split: list beside a picture */
.split{align-items:start}
.split .sp-t{grid-column:1 / span 5}
.split .sp-p{grid-column:7 / span 6}
.split.flip .sp-t{grid-column:8 / span 5;grid-row:1}
.split.flip .sp-p{grid-column:1 / span 6;grid-row:1}
.sp-p .ph{aspect-ratio:4/5}
.sp-p.land .ph{aspect-ratio:16/10}
.plist{margin-top:40px}
.plist li{padding:14px 0}
.plist b{display:block;font-weight:500;font-size:var(--step-body)}
.plist span{display:block;color:var(--muted)}
.plist.two{columns:2;column-gap:40px}.plist.two li{break-inside:avoid}

/* statement band on a surface field */
.field{background:var(--surface);margin-top:var(--sec);padding-block:clamp(80px,9vw,140px)}
.field:has(.figs){margin-top:clamp(72px,8vw,120px);padding-block:clamp(56px,6vw,96px)}
.stmt{grid-column:1 / span 7}
.stmt .h2{max-width:20ch}
.stmt p{margin-top:24px;max-width:52ch}
.stmt-side{grid-column:9 / span 4;align-self:end}

/* big figures */
.figs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.figs b{display:block;font-size:clamp(2.5rem,1.6rem + 3.6vw,5.5rem);font-weight:300;letter-spacing:-0.04em;line-height:1}
.figs span{display:block;margin-top:14px;color:var(--muted);font-size:var(--step-body);max-width:24ch}

/* checker (plot check) */
.chk-f{display:grid;gap:22px}
.chk-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* gantt */
.gantt{grid-column:1 / span 12;margin-top:64px}
.gt-row{display:grid;grid-template-columns:minmax(220px,3fr) 9fr;column-gap:var(--gap);align-items:center;padding:14px 0}
.gt-row b{display:block;font-weight:500}
.gt-row span{color:var(--muted);font-size:var(--step-small)}
.gt-tr{position:relative;height:28px;background:var(--surface)}
.gt-tr i{position:absolute;top:0;bottom:0;left:calc(var(--s)*100%);right:calc((1 - var(--e))*100%);background:var(--accent)}
.gt-sc{display:grid;grid-template-columns:minmax(220px,3fr) 9fr;column-gap:var(--gap);color:var(--muted);font-size:var(--step-small);padding-bottom:8px}
.gt-sc div{display:flex;justify-content:space-between}
@media (prefers-reduced-motion:no-preference){.js .gt-row .gt-tr i{transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease-out) .1s}.js .gt-row.is-in .gt-tr i{transform:none}}

/* tabs */
.tablist{display:flex;flex-wrap:wrap;gap:6px;margin:40px 0 32px}
.tab{min-height:44px;padding:0 18px;background:var(--surface-2);font-size:var(--step-body);transition:background-color var(--t-hover) ease,color var(--t-hover) ease}
.tab[aria-selected="true"]{background:var(--ink);color:var(--accent-ink)}
.tpanel{align-items:start}
.tpanel[hidden]{display:none}
.tp-p{grid-column:1 / span 6}.tp-p .ph{aspect-ratio:4/3}
.tp-t{grid-column:8 / span 5}
.tp-t h3{font-size:clamp(1.75rem,1.2rem + 1.6vw,2.5rem)}
.tp-t>p{margin-top:16px}
.tp-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:28px 0}
.tp-cols p{color:var(--muted);font-size:var(--step-small);margin-bottom:8px}
.tp-cols li{padding:3px 0}

/* simple data table (real table: lines allowed) */
.dt{grid-column:1 / span 12;margin-top:56px;overflow-x:auto}
.dt table{width:100%;border-collapse:collapse;min-width:640px}
.dt th,.dt td{text-align:left;padding:16px 16px 16px 0;vertical-align:top;font-size:var(--step-body);border-bottom:1px solid #2c2722}
.dt thead th{color:var(--muted);font-size:var(--step-small);font-weight:400;padding-bottom:12px}
.dt tbody th{font-weight:500}
.dt td.me{color:var(--accent)}
.dt td.no{color:var(--muted)}

/* mixed-use stack */
.stk{grid-column:8 / span 5;display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--surface);padding:32px}
.stk div{display:flex;align-items:center;justify-content:center;font-size:var(--step-small)}
.stk .s0{width:56%;height:56px;background:var(--accent);color:var(--accent-ink)}
.stk .s1{width:70%;height:140px;background:#efe9e0;color:#0c0a08}
.stk .s2{width:70%;height:100px;background:#6f665c}
.stk .s3{width:100%;height:84px;background:#9a7a46;color:var(--accent-ink)}
.stk .s4{width:100%;height:56px;background:#2a2621}

/* report mock */
.report{grid-column:7 / span 6;background:var(--ink);color:#0c0a08;padding:clamp(28px,3vw,48px)}
.report-top{display:flex;align-items:center;gap:14px;padding-bottom:20px}
.report-top svg{width:34px;height:34px;color:#9a7a46}
.report-top b{font-size:var(--step-lead);font-weight:400}
.report-top span{display:block;font-size:var(--step-small);color:#5d564f}
.report li{padding:12px 0}
.report li b{display:block;font-weight:500}
.report li span{color:#4e4842}

/* cases */
.case{align-items:center;margin-top:96px}
.case:first-of-type{margin-top:56px}
.case .ph{grid-column:1 / span 7;aspect-ratio:16/10}
.case .cs{grid-column:9 / span 4}
.case.flip .ph{grid-column:6 / span 7;grid-row:1}
.case.flip .cs{grid-column:1 / span 4;grid-row:1}
.case h3{font-size:clamp(1.75rem,1.2rem + 1.6vw,2.5rem)}
.case p{margin-top:14px}
.case .cs-pl{margin-top:6px}
.specs{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:8px 36px;margin-top:24px}
.specs dt{font-size:var(--step-small);color:var(--muted)}
.specs dd{font-size:var(--step-lead)}

/* filters */
.fbar{display:flex;flex-wrap:wrap;gap:6px;margin:40px 0 56px}
.fchip{min-height:44px;padding:0 18px;background:var(--surface-2);font-size:var(--step-body);transition:background-color var(--t-hover) ease,color var(--t-hover) ease}
.fchip[aria-pressed="true"]{background:var(--ink);color:var(--accent-ink)}
.tile[hidden]{display:none}
.tiles.is-filtered .tile{grid-column-start:auto}
.credit{margin-top:72px;color:var(--muted);font-size:var(--step-small);max-width:80ch}

/* prose */
.prose{grid-column:3 / span 7}
.prose h2{font-size:var(--step-lead);font-weight:500;margin:40px 0 8px;letter-spacing:0}
.prose p{margin-top:8px}
.prose a{text-decoration:underline}


/* ============ SECTION NAVIGATOR ============ */
.subnav{position:sticky;top:72px;z-index:40;background:var(--bg);margin-top:clamp(48px,6vw,80px);transition:top .45s var(--ease-out)}
html.hdr-off .subnav{top:0}
.subnav-in{display:flex;gap:30px;padding:14px var(--m);overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.subnav-in::-webkit-scrollbar{display:none}
.subnav a{flex:none;color:var(--muted);font-size:var(--step-body);line-height:1;padding:8px 0;transition:color var(--t-hover) ease}
.subnav a.is-on{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:.4em;text-decoration-thickness:2px}
@media (hover:hover){.subnav a:hover{color:var(--ink)}}

/* ============ QUICK FORM BAND ============ */
.quick{background:var(--surface);margin-top:var(--sec);padding-block:clamp(72px,8vw,120px)}
.quick .g12{align-items:start}
.qk-t{grid-column:1 / span 5}
.qk-t .lead{margin-top:20px;max-width:36ch}
.qk-pic{margin-top:40px;width:62%}
.qk-pic .ph{aspect-ratio:4/5}
.qk-f{grid-column:7 / span 6}
.quick .chip span,.quick input[type=tel],.quick input[type=text]{background:#26211c}
.quick .ok{background:#26211c}

/* ============ MOTION ============ */
@media (prefers-reduced-motion:no-preference){
  .js .shutter{clip-path:inset(0 0 100% 0);transition:clip-path 1100ms var(--ease-in-out)}
  .js .shutter img{transform:scale(1.12);transition:transform 1500ms var(--ease-soft)}
  .js .shutter.is-in{clip-path:inset(0)}
  .js .shutter.is-in img{transform:none}
  .hi{animation:hi .7s var(--ease-out) both;animation-delay:calc(var(--i,0) * 90ms)}
  .settle img{animation:settle 1.6s var(--ease-soft) both}
  .js .rv{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);transition-delay:calc(var(--i,0) * 75ms)}
  .js .rv.is-in{opacity:1;transform:none}
  .drift img{animation:drift 22s var(--ease-in-out) infinite alternate}
}
@keyframes hi{from{opacity:0;transform:translateY(16px)}}
@keyframes settle{from{transform:scale(1.08)}}
@keyframes drift{from{transform:scale(1.02) translateX(0)}to{transform:scale(1.08) translateX(-1.5%)}}

/* ============ RESPONSIVE ============ */
@media (max-width:1100px){
  .hnav{gap:22px}
  .menu-pic{display:none}.menu-col{grid-column:span 4}
}
@media (max-width:900px){
  :root{--m:20px;--gap:12px;--sec:96px}
  .hnav,.hact .btn,.h-wa span{display:none}
  .burger{display:block}
  .hdr-in{grid-template-columns:1fr auto;height:64px}
  .msheet{inset:64px 0 0}
  .subnav{top:64px}
  .qk-t,.qk-f{grid-column:1 / -1}.qk-f{margin-top:32px}.qk-pic{display:none}
  .hero{padding-top:64px}
  .rail{margin-top:28px;grid-template-rows:none}
  .p-tall{grid-column:1 / span 9;grid-row:1}
  .p-tall .ph{max-height:none}
  .p-small{grid-column:10 / span 3;grid-row:1;align-self:end;margin-bottom:64px}
  .hero-txt{grid-column:1 / -1;grid-row:2;margin-top:48px}
  .g12>[style*="grid-column"]{grid-column:1 / -1!important}
  .hero h1{font-size:clamp(1.875rem,8vw,2.5rem)}
  .p-wide{grid-column:1 / -1;grid-row:3;margin-inline:calc(var(--m) * -1);margin-top:40px}
  .hero-proof{gap:20px;margin-top:28px;padding-inline:var(--m)}
  .p-wide .cap{padding-inline:var(--m)}
  .p-tall .cap{display:none}
  .band-head{padding-left:var(--m)}
  .band{height:84svh;flex-wrap:wrap}
  .band .pn{height:50%}
  .band .pn:nth-child(1){flex:0 0 64%}.band .pn:nth-child(2){flex:0 0 36%}.band .pn:nth-child(3){flex:0 0 36%}.band .pn:nth-child(4){flex:0 0 64%}
  .diag-h{grid-column:1 / -1;grid-row:auto;margin-bottom:32px}
  .st{display:block;grid-column:1 / -1;margin-bottom:56px}
  .st .ph{margin-top:0!important}
  .st2 .ph{width:62%;margin-left:auto}
  .st3 .ph{width:78%}
  .st-t{margin-top:20px!important}
  .st2 .st-t{margin-left:38%}
  .diag-note{grid-column:1 / -1;grid-row:auto;margin-top:0}
  .tiles{grid-template-columns:1fr 1fr;row-gap:48px;grid-auto-flow:row dense}
  .tiles-h{order:-1}
  .tile{grid-column:auto!important}
  .tile.w{grid-column:1 / -1!important}
  .tile.r{grid-column:2!important}
  .tiles-h{grid-column:1 / -1!important}
  .tile-c{flex-direction:column;gap:2px}.tile-c span{text-align:left}
  .tbl-h{padding-left:0}.tbl-h span{margin-left:0}
  .tbl-name{display:none}
  .tbl{grid-column:1 / -1}
  .tbl li{grid-template-columns:1fr auto;row-gap:2px}
  .tbl li .k{grid-column:1 / -1}
  .tbl-pic{grid-column:6 / -1;margin-top:40px;order:2}
  .names-h{grid-column:1 / -1;margin-bottom:28px}
  .names{grid-column:1 / -1;grid-template-columns:1fr 1fr;gap:36px 20px}
  .faq-l{grid-column:1 / -1;grid-row:2;padding-top:56px}
  .faq-r{grid-column:1 / -1;grid-row:1;margin-top:0}
  .faq-r .tall{aspect-ratio:4/5}
  .faq-r .sq{left:auto;right:0;bottom:-28px;width:38%}
  .faqs .btn{width:100%}
  .contact{padding-top:96px;padding-bottom:96px;row-gap:28px}
  .ct-l{grid-column:1 / -1}
  .ct-pic{grid-column:1 / span 4}
  .ct-f{grid-column:1 / -1}
  .ftr{height:88svh;min-height:560px}
  .ftr-top{flex-direction:column;gap:20px}
  .ftr-top .ct{text-align:left}
  .ftr-bot{bottom:calc(88px + env(safe-area-inset-bottom))}
  .mbar{display:grid}
  .split .sp-t,.split .sp-p,.split.flip .sp-t,.split.flip .sp-p{grid-column:1 / -1;grid-row:auto}
  .split .sp-p{margin-top:40px}
  .plist.two{columns:1}
  .stmt,.stmt-side{grid-column:1 / -1}.stmt-side{margin-top:32px}
  .figs{grid-template-columns:1fr 1fr;row-gap:40px}
  .chk-row{grid-template-columns:1fr}
  .gt-row,.gt-sc{grid-template-columns:1fr}.gt-sc>span{display:none}.gt-row{row-gap:8px}
  .tp-p,.tp-t{grid-column:1 / -1}.tp-t{margin-top:28px}
  .tp-cols{grid-template-columns:1fr}
  .dt table{min-width:0}.dt thead{display:none}
  .dt tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;padding:16px 0;border-bottom:1px solid #2c2722}
  .dt th,.dt td{border:0;padding:0}
  .dt tbody th,.dt td:only-of-type{grid-column:1 / -1}
  .dt td::before{content:attr(data-l);display:block;color:var(--muted);font-size:var(--step-small)}
  .stk{grid-column:1 / -1;margin-top:40px}
  .report{grid-column:1 / -1;margin-top:40px}
  .case .ph,.case .cs,.case.flip .ph,.case.flip .cs{grid-column:1 / -1;grid-row:auto}
  .case .cs{margin-top:24px}
  .specs{gap:6px 20px}
  .prose{grid-column:1 / -1}
}
@media (max-width:520px){

  .hero-proof{flex-wrap:wrap}
}