/* BritBuilder public website — design system "Refined C" (owner-approved direction, 10 Oct 2026).
   Cinematic graphite heroes, warm-white and stone editorial sections, brass used sparingly, serif editorial headlines,
   sans interface type. Every colour, radius, motion curve and type stack maps 1:1 to the app's Ashlar tokens
   (construction-platform app/tokens.css, CCR-ARCH-17); the website adds only larger editorial sizes and layout scale.
   System fonts only. No webfonts, no third parties. */
:root{
  --ink:#17191c;--ink-raised:#22262b;--night:#0b0d0f;--graphite:#0f1113;--graphite-2:#181b1e;--graphite-3:#1f2327;
  --line-dark:#2b3035;--on-ink:#f3f1ec;--on-ink-muted:#b9b6ae;
  --warm-white:#f5f3ee;--stone:#ece8df;--stone-2:#ece9e2;--line:#dedad1;--text-muted:#595b5f;
  --brass:#a47a3b;--brass-light:#c9a064;--brass-text:#7a5620;--focus:#8e6428;
  --ok:#2e6b45;--pilot:#7a5620;--test:#2c5f8a;--dev:#5b4b8a;--plan:#55565a;
  --r-sm:6px;--r-md:10px;--r-lg:14px;--r-pill:999px;
  --quick:140ms;--base:220ms;--deliberate:320ms;--signature:560ms;
  --lay:cubic-bezier(.2,0,0,1);--lift:cubic-bezier(.4,0,1,1);--line-ease:cubic-bezier(.65,0,.35,1);
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --display:ui-serif,"New York","Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --hero:clamp(2.7rem,7vw,6.2rem);--h2:clamp(1.9rem,4vw,3.4rem);--h3:clamp(1.15rem,1.5vw,1.4rem);--lede:clamp(1.06rem,1.3vw,1.28rem);
  --gutter:clamp(16px,4vw,56px);--max:84rem;--measure:62ch;--section:clamp(64px,10vw,152px);--section-sm:clamp(44px,6vw,88px);
  /* page surfaces (light editorial by default) */
  --bg:var(--warm-white);--surface:#fff;--text:var(--ink);--muted:var(--text-muted);--border:var(--line);--accent:var(--ink);--on-accent:var(--warm-white);
}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.55 var(--sans)}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
p{margin:0 0 14px;max-width:var(--measure)}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.02em;line-height:1.05}
h1,h2{font-family:var(--display)}
h1{font-size:var(--hero);max-width:12ch}h2{font-size:var(--h2);max-width:18ch}h3{font-size:var(--h3);font-family:var(--sans);letter-spacing:-.01em;line-height:1.25}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:46rem}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;z-index:60;background:var(--brass-light);color:var(--ink);padding:10px 14px;border-radius:0 0 var(--r-sm) 0}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--brass-light);outline-offset:3px}
.preview-band{background:#3a2f1c;color:#f6ecd9;text-align:center;font-size:.8rem;padding:6px 12px;position:relative;z-index:40}
.kicker{font:600 .76rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--brass-text);margin:0 0 20px}
.on-dark .kicker,.theme-dark .kicker{color:var(--brass-light)}
.lede{font-size:var(--lede);color:var(--muted);max-width:44ch;margin:20px 0 0;line-height:1.5}
.setout{display:block;width:72px;height:12px;margin:0 0 24px;border-top:1.5px solid var(--brass);position:relative}
.setout::before,.setout::after{content:"";position:absolute;top:-6px;width:1.5px;height:12px;background:var(--brass)}
.setout::before{left:0}.setout::after{right:0}
.on-dark .setout{border-color:var(--brass-light)}.on-dark .setout::before,.on-dark .setout::after{background:var(--brass-light)}
/* ---------- buttons ---------- */
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:var(--r-md);font:600 .95rem/1.2 var(--sans);
  text-decoration:none;border:1px solid transparent;cursor:pointer;background:var(--ink);color:var(--warm-white);
  transition:background-color var(--quick) var(--lay),border-color var(--quick) var(--lay),color var(--quick) var(--lay)}
.button:hover{background:var(--ink-raised)}
.button.secondary{background:transparent;color:var(--text);border-color:var(--border)}.button.secondary:hover{border-color:var(--text)}
.on-dark .button{background:var(--brass-light);color:var(--ink)}.on-dark .button:hover{background:#d8b47a}
.on-dark .button.secondary{background:transparent;color:var(--on-ink);border-color:rgba(243,241,236,.4)}.on-dark .button.secondary:hover{border-color:var(--on-ink)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.textlink{font-weight:600;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;color:var(--brass-text)}
.on-dark .textlink{color:var(--brass-light)}
/* ---------- status labels: quiet text, never badges ---------- */
.status{display:inline-flex;align-items:center;gap:6px;font:600 .72rem/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;vertical-align:middle;margin-left:8px}
.status::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.s-available{color:var(--ok)}.s-closed-pilot{color:var(--pilot)}.s-in-testing{color:var(--test)}.s-in-development{color:var(--dev)}.s-planned{color:var(--plan)}
.on-dark .s-closed-pilot{color:var(--brass-light)}.on-dark .s-in-testing{color:#9cc6ec}.on-dark .s-in-development{color:#c3b5ef}.on-dark .s-planned,.on-dark .status{color:var(--on-ink-muted)}
.on-dark .s-closed-pilot{color:var(--brass-light)}
/* ---------- header / navigation ---------- */
header.top{position:relative;z-index:30;background:var(--surface);border-bottom:1px solid var(--border)}
.theme-dark header.top{position:absolute;left:0;right:0;background:transparent;border-bottom:0;color:var(--on-ink)}
.top-row{display:flex;align-items:center;gap:12px 28px;min-height:72px}
.mark{display:inline-flex;align-items:center;gap:10px;font-weight:650;font-size:1.08rem;letter-spacing:-.01em;text-decoration:none;min-height:44px}
.mark svg{width:26px;height:26px;flex:none}
nav.primary ul{list-style:none;margin:0;padding:0;display:flex;gap:4px 24px}
nav.primary a{text-decoration:none;font-size:.95rem;min-height:44px;display:inline-flex;align-items:center;opacity:.82;border-bottom:1.5px solid transparent;padding-top:1.5px}
nav.primary a:hover{opacity:1}nav.primary a[aria-current=page]{opacity:1;border-bottom-color:var(--brass)}
.theme-dark nav.primary a[aria-current=page]{border-bottom-color:var(--brass-light)}
.top-end{margin-left:auto;display:flex;align-items:center;gap:12px}
nav.region{position:relative}
nav.region summary{list-style:none;cursor:pointer;min-height:44px;display:inline-flex;align-items:center;gap:6px;padding:0 12px;border-radius:var(--r-md);font-size:.86rem;font-weight:600;border:1px solid currentColor;opacity:.8}
nav.region summary::-webkit-details-marker{display:none}
nav.region summary::after{content:"▾";font-size:.75em}
nav.region ul{position:absolute;right:0;top:calc(100% + 8px);list-style:none;margin:0;padding:6px;min-width:13rem;border-radius:var(--r-md);background:var(--graphite-2);color:var(--on-ink);box-shadow:0 18px 40px rgba(0,0,0,.35);z-index:35}
nav.region li a{display:flex;align-items:center;min-height:44px;padding:0 12px;border-radius:var(--r-sm);text-decoration:none}
nav.region li a[aria-current=true]{background:var(--graphite-3);font-weight:600}
.nav-cta{min-height:44px;padding:0 18px}
details.menu{display:none}
details.menu summary{list-style:none;cursor:pointer;min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 10px;border-radius:var(--r-md);font-size:.9rem;font-weight:600;border:1px solid currentColor;opacity:.85}
details.menu summary::-webkit-details-marker{display:none}
details.menu .menu-panel{position:absolute;left:0;right:0;top:100%;background:var(--graphite);color:var(--on-ink);padding:12px var(--gutter) 28px;border-top:1px solid var(--line-dark);box-shadow:0 30px 60px rgba(0,0,0,.4)}
details.menu .menu-panel ul{list-style:none;margin:0;padding:0}
details.menu .menu-panel li a{display:flex;align-items:center;min-height:52px;font-family:var(--display);font-size:1.5rem;text-decoration:none;border-bottom:1px solid var(--line-dark)}
details.menu .menu-panel li a[aria-current=page]{color:var(--brass-light)}
details.menu .menu-panel .menu-foot{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:18px}
details.menu .menu-panel .menu-foot .button{background:var(--brass-light);color:var(--ink)}
details.menu .menu-panel .menu-regions{display:flex;gap:4px 16px;flex-wrap:wrap;font-size:.9rem;color:var(--on-ink-muted);margin-top:14px}
details.menu .menu-panel .menu-regions a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
details.menu .menu-panel .menu-regions a[aria-current=true]{color:var(--on-ink);font-weight:600}
@media (max-width:900px){nav.primary,nav.region,.nav-cta{display:none}details.menu{display:block}.top-row{min-height:64px}}
/* ---------- heroes ---------- */
.hero{position:relative}
.hero .wrap{position:relative;z-index:2}
.hero-cinematic{min-height:100svh;display:grid;align-items:end;overflow:hidden;padding:140px 0 100px;color:var(--on-ink);background:var(--graphite)}
.hero-cinematic.short{min-height:min(78svh,760px);padding-bottom:72px}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover;animation:settle 18s var(--lay) both}
@keyframes settle{from{transform:scale(1.05) translateY(8px)}to{transform:none}}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,17,19,.62) 0%,rgba(15,17,19,.38) 38%,rgba(15,17,19,0) 66%),linear-gradient(180deg,rgba(15,17,19,.5) 0%,rgba(15,17,19,.1) 34%,rgba(15,17,19,.55) 62%,rgba(15,17,19,.94) 100%)}
@media (max-width:700px),(orientation:portrait) and (max-width:1100px){.hero-shade{background:linear-gradient(180deg,rgba(15,17,19,.5) 0%,rgba(15,17,19,.12) 26%,rgba(15,17,19,.62) 50%,rgba(15,17,19,.9) 68%,rgba(15,17,19,.96) 100%)}}
.hero-cinematic .lede{color:var(--on-ink-muted)}
.avail{margin:36px 0 0;font-size:.84rem;color:var(--on-ink-muted);max-width:none}
.hero-editorial{background:var(--surface);padding:calc(var(--section-sm) + 20px) 0 var(--section-sm);border-bottom:1px solid var(--border)}
.hero-editorial.graphite{background:var(--graphite);color:var(--on-ink);border-bottom:0}
.hero-editorial.graphite .lede{color:var(--on-ink-muted)}
.hero-editorial .split{display:grid;gap:40px;align-items:end}
@media (min-width:960px){.hero-editorial .split{grid-template-columns:1.1fr .9fr}}
.hero-editorial .framed{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:var(--r-sm)}
.hero-editorial .framed img{width:100%;height:100%;object-fit:cover}
.hero-plain{background:var(--surface);padding:calc(var(--section-sm) + 8px) 0 var(--section-sm);border-bottom:1px solid var(--border)}
.hero-plain h1{font-size:clamp(2.2rem,4.6vw,3.8rem)}
/* ---------- sections ---------- */
main section.sec{padding:var(--section) 0}
main section.sec-sm{padding:var(--section-sm) 0}
.sec-dark{background:var(--graphite);color:var(--on-ink)}.sec-night{background:var(--night);color:var(--on-ink)}
.sec-stone{background:var(--stone)}.sec-white{background:var(--surface)}
.sec-dark p,.sec-night p{color:var(--on-ink-muted)}.sec-dark h2,.sec-dark h3,.sec-night h2,.sec-night h3,.sec-dark strong,.sec-night strong{color:var(--on-ink)}
.section-head{margin-bottom:clamp(32px,5vw,60px)}
.section-head .lede{margin-top:18px}
.intro{color:var(--muted);font-size:1.08rem;max-width:56ch}
main section.sec h2+.intro,main section.sec-sm h2+.intro{margin-top:14px}
.statement{font-family:var(--display);font-size:clamp(1.5rem,2.8vw,2.4rem);line-height:1.25;letter-spacing:-.015em;max-width:30ch;margin:0}
.statement + p{margin-top:22px}
ul.plain{padding-left:1.1rem;max-width:var(--measure);margin:0}ul.plain li{margin:0 0 10px}
ol.numbered{list-style:none;counter-reset:n;padding:0;margin:0;display:grid;gap:0;max-width:52rem}
ol.numbered li{counter-increment:n;display:grid;grid-template-columns:3.2rem 1fr;gap:12px 18px;padding:22px 0;border-top:1px solid var(--border)}
ol.numbered li::before{content:counter(n,decimal-leading-zero);font:500 .8rem/1.6 var(--mono);color:var(--brass-text);letter-spacing:.08em}
.sec-dark ol.numbered li{border-top-color:var(--line-dark)}.sec-dark ol.numbered li::before{color:var(--brass-light)}
ol.numbered strong{display:block;font-size:1.05rem;margin-bottom:4px}
ol.numbered p{margin:0;color:var(--muted);font-size:.98rem}
.step-head{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}.step-head .status{margin-left:0}
/* pillars */
.pillars{display:grid;gap:32px 40px}
@media (min-width:760px){.pillars{grid-template-columns:repeat(3,1fr)}}
.pillar{border-top:1px solid var(--border);padding-top:22px}
.sec-dark .pillar{border-top-color:var(--line-dark)}
.pillar .n{font:500 .74rem/1 var(--mono);letter-spacing:.1em;color:var(--brass-text);display:block;margin-bottom:14px}
.sec-dark .pillar .n{color:var(--brass-light)}
.pillar h3{font-family:var(--display);font-size:1.45rem;font-weight:600;letter-spacing:-.015em;line-height:1.15}
.pillar p{margin:12px 0 0;font-size:.98rem;color:var(--muted)}
.pillar a{text-decoration:none}.pillar a:hover{text-decoration:underline}
/* editorial feature: image + copy */
.feature{display:grid;gap:36px;align-items:center}
@media (min-width:900px){.feature{grid-template-columns:1fr 1fr;gap:72px}.feature.flip>.feature-copy{order:2}}
.feature-img{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:var(--r-sm)}
.feature-img img{width:100%;height:100%;object-fit:cover}
.feature-copy h2{max-width:16ch}.feature-copy p{margin-top:18px}
/* image-led mosaic (industries) */
.mosaic{display:grid;gap:12px;grid-template-columns:1fr}
.m{position:relative;display:block;overflow:hidden;text-decoration:none;color:var(--on-ink);border-radius:var(--r-sm);min-height:220px;background:var(--graphite-3)}
.m picture,.m>img{position:absolute;inset:0;width:100%;height:100%}.m img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--lay);filter:saturate(.88)}
.m:hover img{transform:scale(1.04)}
.m::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,17,19,0) 42%,rgba(15,17,19,.86))}
.m-label{position:absolute;left:20px;right:20px;bottom:18px;z-index:2;font-family:var(--display);font-size:clamp(1.15rem,1.6vw,1.5rem);font-weight:600;letter-spacing:-.01em}
.m-label small{display:block;font:500 .72rem/1.4 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--on-ink-muted);margin-top:6px}
@media (min-width:760px){.mosaic{grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(190px,17vw,260px)}
 .m0{grid-column:1/3;grid-row:1/3}.m1{grid-column:3/5}.m2{grid-column:3/4}.m3{grid-column:4/5}.m4{grid-column:1/3}.m5{grid-column:3/5}}
@media (max-width:759px){.mosaic .m{min-height:150px;aspect-ratio:16/9}.m0{aspect-ratio:4/3}}
/* region panels */
.panels{display:grid;gap:12px}
@media (min-width:760px){.panels{grid-template-columns:repeat(3,1fr)}}
.panel{position:relative;display:grid;align-items:end;min-height:clamp(300px,40vw,540px);overflow:hidden;text-decoration:none;border-radius:var(--r-sm);color:var(--on-ink);background:var(--graphite-3)}
.panel picture{position:absolute;inset:0}.panel img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--lay)}
.panel:hover img{transform:scale(1.04)}
.panel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,17,19,.05) 40%,rgba(15,17,19,.88))}
.p-copy{position:relative;z-index:2;display:grid;gap:6px;padding:24px}
.p-name{font-family:var(--display);font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:600;letter-spacing:-.015em}
.p-state{font-size:.86rem;color:var(--brass-light)}
.p-copy p{color:var(--on-ink-muted);font-size:.92rem;margin:4px 0 0}
@media (max-width:759px){.panel{min-height:220px;aspect-ratio:16/10;width:100%}}
/* device showcase */
.showcase{display:grid;gap:18px;justify-items:center}
.showcase-grid{display:grid;gap:48px;align-items:center}
@media (min-width:960px){.showcase-grid{grid-template-columns:1fr 1fr}}
.tabs{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:4px;padding:4px;border-radius:var(--r-pill);border:1px solid var(--border)}
.sec-dark .tabs,.on-dark .tabs{border-color:rgba(243,241,236,.25)}
.tabs button{font:600 .9rem/1 var(--sans);min-height:44px;padding:0 16px;border-radius:var(--r-pill);border:0;background:transparent;color:inherit;cursor:pointer;opacity:.75}
.tabs button[aria-selected=true]{background:var(--ink);color:var(--warm-white);opacity:1}
.sec-dark .tabs button[aria-selected=true],.on-dark .tabs button[aria-selected=true]{background:var(--brass-light);color:var(--ink)}
.shots figure{margin:0;display:grid;justify-items:center;gap:14px}.shots figure[hidden]{display:none}
.shots figcaption{font-size:1rem;text-align:center;max-width:32ch}
.device{width:min(300px,78vw);aspect-ratio:390/844;border-radius:44px;padding:11px;background:#0b0d0f;box-shadow:0 0 0 1px #2b3035,0 40px 80px -30px rgba(0,0,0,.6)}
.device img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:34px}
.disclose{font-size:.78rem;opacity:.72;margin:0;text-align:center;max-width:none}
/* demo player (featured, device-framed; keeps the text-alternative markup) */
.demo-player{display:grid;gap:22px;justify-items:center}
.demo-label{font:600 .72rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--brass-text);margin:0}
.on-dark .demo-label,.sec-dark .demo-label{color:var(--brass-light)}
ol.demo-steps{list-style:none;padding:0;margin:0;display:grid;gap:22px;width:100%;justify-items:center}
.demo-step figure{margin:0;display:grid;gap:14px;justify-items:center}
.demo-step img{width:min(300px,78vw);aspect-ratio:390/844;object-fit:cover;object-position:top;border-radius:34px;box-shadow:0 0 0 11px #0b0d0f,0 0 0 12px #2b3035,0 40px 80px -30px rgba(0,0,0,.6);margin:12px}
.demo-step figcaption{font-size:1rem;text-align:center;max-width:34ch;margin-top:10px}
.step-no{display:block;font:600 .72rem/1.6 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.sec-dark .step-no{color:var(--on-ink-muted)}
.js .demo-player.ready ol.demo-steps{display:block}
.js .demo-player.ready .demo-step{display:none}.js .demo-player.ready .demo-step.current{display:block}
.demo-controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center}
.demo-controls button{min-height:44px;min-width:44px;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--border);background:transparent;color:inherit;font:600 .9rem var(--sans);cursor:pointer}
.sec-dark .demo-controls button{border-color:rgba(243,241,236,.3)}
.demo-controls button[aria-pressed=true]{background:var(--ink);color:var(--warm-white);border-color:var(--ink)}
.sec-dark .demo-controls button[aria-pressed=true]{background:var(--brass-light);color:var(--ink);border-color:var(--brass-light)}
.demo-progress{font-size:.9rem;color:var(--muted);min-width:7ch}.sec-dark .demo-progress{color:var(--on-ink-muted)}
.demo-source{font-size:.9rem;color:var(--muted);max-width:60ch;margin:14px auto 0}.sec-dark .demo-source{color:var(--on-ink-muted)}
.demo-source summary{cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:center}
@media (prefers-reduced-motion:no-preference){.js .demo-player.ready .demo-step.current{animation:bbfade .25s ease-out}}
@keyframes bbfade{from{opacity:.4}to{opacity:1}}
/* demo switcher */
.switcher{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 28px}
.switcher a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--border);font-size:.9rem;font-weight:600}
.switcher a[aria-current=page]{background:var(--ink);color:var(--warm-white);border-color:var(--ink)}
.sec-dark .switcher a{border-color:rgba(243,241,236,.3)}.sec-dark .switcher a[aria-current=page]{background:var(--brass-light);color:var(--ink);border-color:var(--brass-light)}
/* quiet status list (secondary pages) */
dl.quiet{margin:0;display:grid;gap:0;max-width:52rem}
dl.quiet>div{display:grid;grid-template-columns:1fr auto;gap:6px 24px;padding:16px 0;border-top:1px solid var(--border);align-items:baseline}
dl.quiet dt{font-weight:600}dl.quiet dd{margin:0;grid-column:1/3;color:var(--muted);font-size:.95rem}dl.quiet .status{margin:0;grid-column:2;grid-row:1}
/* link list (replaces card walls) */
ul.linklist{list-style:none;padding:0;margin:0;max-width:52rem}
ul.linklist li{border-top:1px solid var(--border);padding:18px 0;display:grid;grid-template-columns:1fr auto;gap:4px 20px;align-items:baseline}
.sec-dark ul.linklist li{border-top-color:var(--line-dark)}
ul.linklist li:last-child{border-bottom:1px solid var(--border)}
ul.linklist h3{font-family:var(--display);font-size:1.3rem;font-weight:600;letter-spacing:-.01em}
ul.linklist h3 a{text-decoration:none}ul.linklist h3 a:hover{text-decoration:underline}
ul.linklist p{grid-column:1/3;margin:0;color:var(--muted);font-size:.96rem}
ul.linklist .status{margin:0;grid-column:2;grid-row:1}
/* notes: a single rule, no boxes */
.note-box{border-left:2px solid var(--brass);padding:4px 0 4px 20px;max-width:var(--measure)}
.note-box p:last-child{margin-bottom:0}.note-box p{color:var(--muted)}
.tone-status{border-left-color:var(--brass)}
.note{font-size:.9rem;color:var(--muted);margin-top:12px}
/* closing statement */
.closing{position:relative;min-height:min(80svh,760px);display:grid;align-items:center;overflow:hidden;color:var(--on-ink);background:var(--graphite)}
.closing .wrap{display:grid;gap:28px;justify-items:start;position:relative;z-index:2}
.closing h2{max-width:14ch}
.closing .fine{color:var(--on-ink-muted)}
/* pricing */
.prices{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:0 0 24px;max-width:52rem}
.price{border-top:1px solid var(--border);padding:22px 0 0}
.price h3{margin:0 0 10px;font-family:var(--display);font-size:1.4rem}
.amount{font-size:2.4rem;font-weight:600;margin:0 0 8px;font-variant-numeric:tabular-nums;font-family:var(--display);letter-spacing:-.02em}.amount span{font-size:1rem;font-weight:500;color:var(--muted);font-family:var(--sans);margin-left:6px}
.draft-band{border-left:2px solid var(--brass);padding:4px 0 4px 20px;margin:0 0 24px;font-size:.92rem;color:var(--muted);max-width:var(--measure)}
/* figures */
figure.shot{margin:0;max-width:420px}figure.shot img{border-radius:var(--r-md);border:1px solid var(--border)}
.figures{display:flex;flex-wrap:wrap;gap:24px}
figcaption{font-size:.88rem;color:var(--muted);margin-top:10px}
.example{display:inline-block;color:var(--brass-text);font:600 .72rem/1.6 var(--sans);letter-spacing:.06em;text-transform:uppercase;margin-right:6px}
/* forms */
form.interest{max-width:40rem}
.field{margin:0 0 18px}.field label{display:block;font-weight:600;margin-bottom:6px}
.opt{font-weight:400;color:var(--muted);font-size:.9rem}
.field input[type=text],.field input[type=email],.field select,.field textarea{width:100%;min-height:48px;padding:10px 12px;font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-sm)}
.field.check{display:flex;gap:10px;align-items:flex-start}.field.check input{width:22px;height:22px;margin-top:3px;flex:none}.field.check label{font-weight:400}
.hint{font-size:.88rem;color:var(--muted);margin:-2px 0 6px}
.error{color:#b3261e;font-size:.9rem;margin:6px 0 0;font-weight:600}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#b3261e;border-width:2px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{margin-top:12px;font-weight:600}.form-status.ok{color:var(--ok)}.form-status.fail{color:#b3261e}
/* tables (kept for legal and the few material status tables) */
.table-wrap{overflow-x:auto;max-width:52rem}
table.status-table{border-collapse:collapse;width:100%;font-size:.95rem}
.status-table th,.status-table td{text-align:left;padding:12px 14px 12px 0;border-bottom:1px solid var(--border);vertical-align:top}
.status-table thead th{font:600 .72rem/1.4 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.status-table .status{margin:0}
/* legal */
article.legal{max-width:72ch}article.legal h2{font-size:1.6rem;margin:36px 0 12px}article.legal h3{margin:24px 0 8px}
article.legal table{border-collapse:collapse;width:100%;font-size:.92rem;display:block;overflow-x:auto}
article.legal th,article.legal td{border:1px solid var(--border);padding:6px 8px;text-align:left;vertical-align:top}
mark.check{background:var(--stone);color:#8a5f00;font-weight:700;padding:0 3px}
code{font-family:var(--mono);font-size:.9em;word-break:break-all}
/* footer */
.site-footer{background:var(--night);color:var(--on-ink-muted);padding:64px 0 72px;font-size:.9rem}
.footer-grid{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr))}
.footer-brand{font-weight:650;color:var(--on-ink);display:flex;align-items:center;gap:10px;font-size:1rem}
.footer-brand svg{width:22px;height:22px}
.footer-h{font:600 .72rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--on-ink);margin:0 0 12px}
ul.footer-links{list-style:none;padding:0;margin:0 0 12px}ul.footer-links li a{display:inline-flex;min-height:36px;align-items:center;color:var(--on-ink);text-decoration:none;opacity:.85}
ul.footer-links li a:hover{opacity:1;text-decoration:underline}ul.footer-links a[aria-current=true]{font-weight:600;opacity:1}
.site-footer p{max-width:none}.site-footer a{color:var(--on-ink)}
.fine{font-size:.8rem;opacity:.8}
.footer-status{border-top:1px solid var(--line-dark);margin-top:36px;padding-top:24px}
/* reveal on scroll (opt-in by script; content is visible without it) */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity var(--signature) var(--lay),transform var(--signature) var(--lay)}
.js .reveal.in{opacity:1;transform:none}
@media (max-width:640px){
  .hero-cinematic{padding:120px 0 72px}.hero-cinematic.short{min-height:min(72svh,640px)}
  .cta-row{margin-top:24px}.cta-row .button{width:100%}
  .lede{margin-top:16px}
  .showcase-grid{gap:32px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.js .reveal{opacity:1;transform:none}}
/* overlay header needs room on graphite editorial heroes; inline status labels inside tiles/panels */
.theme-dark .hero-editorial.graphite{padding-top:calc(var(--section-sm) + 96px)}
.status.inline{margin-left:0;text-transform:none;letter-spacing:0;font-size:.8rem;font-weight:500;color:var(--brass-light)}
.p-state .status.inline::before{background:var(--brass-light)}
/* secondary menu row (Demos · Pricing · Regions) */
details.menu .menu-panel ul.menu-secondary{display:flex;flex-wrap:wrap;gap:0 20px;margin-top:10px}
details.menu .menu-panel ul.menu-secondary li a{font:600 .95rem var(--sans);min-height:44px;border-bottom:0;opacity:.85}
.footer-grid{grid-template-columns:repeat(auto-fit,minmax(13rem,1fr))}
