/* ==========================================================================
   GRF, Version B "Editorial"
   A warm paper page, set like a magazine: a strict 12-column grid, hairline
   rules, numbered sections, large type at regular/medium weight, and one
   serif voice (Instrument Serif) for statements, quotes and numerals.
   Gold is an accent only: the logo's dot, the active marker, a progress line.
   ========================================================================== */

:root{
  --paper:#F7F4EE;          /* page */
  --paper-2:#EFEAE0;        /* panel beige */
  --paper-3:#E6E0D3;
  --card:#FCFBF8;           /* raised paper */
  --ink:#1F1F1F;            /* charcoal */
  --ink-2:#51524B;          /* body */
  --ink-3:#66675F;          /* secondary, AA on paper and beige */
  --ink-4:#85827A;          /* large text only */
  --rule:rgba(31,31,31,.13);
  --rule-2:rgba(31,31,31,.24);
  --gold:#C8A870;           /* accent (rules, bars), never small text on paper */
  --dot:#D5B992;            /* the logo's dot */
  --gold-ink:#7D6233;       /* gold for text on paper (5.2:1) */
  --yellow:#F5CD79;         /* filled buttons */
  --yellow-2:#F8DA9A;
  --night:#1A1917;          /* statement bands, footer */
  --night-2:#262420;
  --on-night:#F3EFE7;
  --on-night-2:#B9B4A8;
  --rule-night:rgba(243,239,231,.14);
  --live:#2E6B45;
  --sans:'Google Sans Flex','Helvetica Neue',Arial,sans-serif;
  --serif:'Instrument Serif',Georgia,'Times New Roman',serif;
  --gut:clamp(24px,5.4vw,96px);
  --cg:clamp(16px,1.7vw,28px);
  --maxw:1520px;
  --ease:cubic-bezier(.2,.7,.1,1);
  --r:4px;                  /* the only corner radius on panels */
}

/* ---------- base ---------- */
html,body{margin:0;background:var(--paper)}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:12px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{color:var(--ink-2);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
img{max-width:100%}
/* Medium is the heaviest text weight; Bold-ish weight is kept for buttons. */
h1,h2,h3,h4,strong,b{font-weight:500}
/* Raw component markup, waiting for the dc runtime to render it. */
x-dc{display:none}
::selection{background:var(--yellow);color:var(--ink)}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold-ink);outline-offset:3px}
.on-night :focus-visible,.foot :focus-visible,.menu :focus-visible{outline-color:var(--on-night)}
button{font:inherit;color:inherit}
p{margin:0}

[data-canvas]{min-height:100vh;display:flex;flex-direction:column;box-sizing:border-box;background:var(--paper);color:var(--ink-2);font-family:var(--sans);counter-reset:sec;overflow-x:clip}
[data-canvas] *,[data-canvas] *::before,[data-canvas] *::after{box-sizing:border-box}
[data-canvas]>*{flex-shrink:0}
.wrap{width:100%;max-width:calc(var(--maxw) + 2 * var(--gut));margin:0 auto;padding:0 var(--gut)}

/* ---------- type ---------- */
.eyebrow{font-size:12px;line-height:1.35;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.eyebrow.dot::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--dot);margin-right:12px;vertical-align:2px}
.on-night .eyebrow{color:var(--on-night-2)}
.h1{margin:0;font-size:clamp(54px,6.9vw,120px);line-height:.96;letter-spacing:-.045em;font-weight:430;color:var(--ink)}
.h2{margin:0;font-size:clamp(38px,3.9vw,70px);line-height:1;letter-spacing:-.038em;font-weight:430;color:var(--ink)}
.h3{margin:0;font-size:clamp(26px,2.15vw,38px);line-height:1.1;letter-spacing:-.025em;font-weight:450;color:var(--ink)}
.lead{font-size:clamp(18px,1.38vw,22px);line-height:1.52;letter-spacing:-.006em;color:var(--ink-2)}
.body{font-size:17px;line-height:1.62;color:var(--ink-2)}
.small{font-size:14px;line-height:1.5;color:var(--ink-3)}
.num{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0;color:var(--ink-3)}
.on-night .h1,.on-night .h2,.on-night .h3{color:var(--on-night)}
/* Even line lengths for headings and pull statements. */
.r-line>span,.h3,.ww-desc,.cnext-q,.ask-t,.cmp-title,.case-head,.cs-name,.feat-h,.cover-h,.post-title,.more-t,.cnext-head,.art-h1,.art-h2,.art-big,.art-q,.proof-st,.qt blockquote,.line blockquote,.tm-name{text-wrap:balance}
.lead,.body,.cpara,.art-p,.cs-out,.trait-c,.tri-c,.cmp-copy,.step-copy,.tm-line,.tm-fact,.fst-l,.cst-l,.post-ex,.more-ex,.rise-c,.qa-a,.fq-a p,.psec p,.svc-del,.lx-copy,.case-sub,.cstep-c{text-wrap:pretty}
.on-night .lead,.on-night .body{color:var(--on-night-2)}

/* ---------- buttons and links ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 30px;border:0;border-radius:999px;font:inherit;font-size:16px;font-weight:600;letter-spacing:-.005em;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer;transition:background-color .3s var(--ease),color .3s var(--ease),box-shadow .3s var(--ease)}
.btn-fill{background:var(--yellow);color:var(--ink)}
.btn-fill:hover{background:var(--yellow-2);color:var(--ink)}
.btn-sm{min-height:42px;padding:0 20px;font-size:14px}
.btn-line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.btn-line:hover{background:var(--ink);color:var(--paper)}
.lnk{display:inline-block;padding:4px 0 6px;font-size:16px;font-weight:500;line-height:1.3;color:var(--ink);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size .5s var(--ease)}
.lnk:hover{background-size:0 1px;background-position:100% 100%}
.on-night .lnk{color:var(--on-night)}

/* ---------- masthead (desktop) ---------- */
.mast{position:relative;z-index:20;border-bottom:1px solid var(--rule)}
.mast-in{height:80px;display:flex;align-items:center;justify-content:space-between}
.mast-logo{display:flex;align-items:center;width:70px;height:24px}
.mast-logo img{width:70px;height:24px;display:block}
.mast-nav{display:flex;align-items:center;gap:clamp(22px,2.6vw,44px)}
.mast-nav a:not(.btn){position:relative;padding:8px 0;font-size:14.5px;font-weight:500;letter-spacing:-.003em;color:var(--ink-2);text-decoration:none;transition:color .25s}
.mast-nav a:not(.btn):hover{color:var(--ink)}
.mast-nav a[aria-current]{color:var(--ink)}
.mast-nav a[aria-current]::after{content:"";position:absolute;left:50%;bottom:-3px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--dot)}

/* ---------- mobile header ---------- */
.mh{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 var(--gut);border-bottom:1px solid var(--rule)}
.mh a:first-child{display:flex;align-items:center}
.mh img{width:62px;height:21px;display:block}
.mh-menu{width:44px;height:44px;margin-right:-10px;display:flex;align-items:center;justify-content:center}

/* ---------- sections ---------- */
.sec{position:relative;padding:clamp(96px,9.5vw,168px) 0}
.sec-t0{padding-top:0}
.band-2{background:var(--paper-2)}
.band-night{background:var(--night);color:var(--on-night-2)}
.sh{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);align-items:start;padding-top:26px}
.sh::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--rule-2);transform-origin:0 50%}
.on-night .sh::before{background:var(--rule-night)}
.sh-label{grid-column:1/4;display:flex;align-items:baseline;gap:14px;padding-top:6px}
.sh-label::before{counter-increment:sec;content:counter(sec,decimal-leading-zero);content:counter(sec,decimal-leading-zero) / "";font-family:var(--serif);font-style:italic;font-size:20px;line-height:1;color:var(--ink)}
.on-night .sh-label::before{color:var(--on-night)}
.sh-title{grid-column:4/12}
.sh-aside{grid-column:4/10;margin-top:30px}
.sh--split .sh-title{grid-column:4/9}
.sh--split .sh-aside{grid-column:9/13;margin-top:0;align-self:end}

/* Visitors who ask for less motion get state changes without movement. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
}

/* ---------- reveals (only with JS, only when motion is welcome) ---------- */
.r-line{display:block}
@media (prefers-reduced-motion:no-preference){
  .js #dc-root .r-line{overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
  .js #dc-root .r-line>span{display:block;transform:translate3d(0,108%,0);transition:transform 1.15s var(--ease);transition-delay:calc(var(--d,0) * 110ms + 40ms)}
  .js #dc-root .r-line.is-in>span{transform:none}
  .js #dc-root .r-fade{opacity:0;transform:translate3d(0,22px,0);transition:opacity 1s var(--ease),transform 1.2s var(--ease);transition-delay:calc(var(--d,0) * 110ms + 120ms)}
  .js #dc-root .r-fade.is-in{opacity:1;transform:none}
  .js #dc-root .r-rule::before{transform:scaleX(0);transition:transform 1.5s var(--ease);transition-delay:calc(var(--d,0) * 110ms)}
  .js #dc-root .r-rule.is-in::before{transform:none}
  /* The pre-rendered copy waits for the live page (which plays the intro), and shows itself
     after 2.5s in case the live page never arrives. */
  .js #prerender .r-line{overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
  .js #prerender .r-line>span{display:block;transform:translate3d(0,108%,0);animation:grf-show 0s linear 2.5s forwards}
  .js #prerender .r-fade{opacity:0;animation:grf-show 0s linear 2.5s forwards}
  @keyframes grf-show{to{opacity:1;transform:none}}
  @supports (animation-timeline:view()){
    .js #dc-root .par{animation:grf-par linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
    @keyframes grf-par{from{transform:translate3d(0,var(--par,48px),0)}to{transform:translate3d(0,calc(var(--par,48px) * -1),0)}}
  }
}

/* ==========================================================================
   HOME
   ========================================================================== */
/* hero: a full first screen, capped so tall screens don't float the content */
.hero-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);grid-template-rows:auto 1fr auto;min-height:clamp(600px,calc(100svh - 80px),860px);padding-top:clamp(36px,5vh,64px);padding-bottom:clamp(40px,6vh,72px)}
.hero-meta{grid-column:1/-1;grid-row:1}
.hero-h1{grid-column:1/10;grid-row:2;align-self:center;margin:clamp(36px,6vh,72px) 0 clamp(36px,5.5vh,64px)}
.hero-h1 .ind{padding-left:calc((100% + var(--cg)) / 9 * 1)}
.hero-copy{grid-column:1/6;grid-row:3;align-self:end;display:flex;flex-direction:column;gap:34px}
.hero-copy .lead{max-width:30ch}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 30px}
.cta-row .btn,.cta-row .lnk{white-space:nowrap}
.hero .sys{grid-column:9/13;grid-row:2/4;align-self:end}

/* the live system panel */
.sys{background:var(--card);border:1px solid var(--rule);border-radius:var(--r);box-shadow:0 40px 80px -48px rgba(70,52,20,.28);overflow:hidden}
.sys-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;border-bottom:1px solid var(--rule)}
.sys-title{font-size:14px;font-weight:500;letter-spacing:-.005em;color:var(--ink)}
.sys-live{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--live)}
.sys-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--live);box-shadow:0 0 0 0 rgba(46,107,69,.45);animation:grf-pulse 2.2s ease-out infinite}
@keyframes grf-pulse{0%{box-shadow:0 0 0 0 rgba(46,107,69,.45)}70%{box-shadow:0 0 0 7px rgba(46,107,69,0)}100%{box-shadow:0 0 0 0 rgba(46,107,69,0)}}
@media (prefers-reduced-motion:reduce){.sys-live::before{animation:none}}
.sys-row{position:relative;display:grid;grid-template-columns:18px minmax(0,1fr) auto;column-gap:14px;align-items:start;padding:15px 20px 16px;border-top:1px solid var(--rule);transition:opacity .6s var(--ease)}
.sys-row:first-of-type{border-top:0}
.sys-row svg{margin-top:3px;stroke:var(--ink-3)}
.sys-row.is-off{opacity:.45}
.sys-row.is-now::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--gold);transform-origin:0 50%;animation:grf-grow 1.1s var(--ease) both}
@keyframes grf-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.sys-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.sys-t{font-size:15px;font-weight:500;line-height:1.35;letter-spacing:-.006em;color:var(--ink)}
.sys-s{font-size:13px;line-height:1.45;color:var(--ink-3)}
.sys-tag{font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding-top:3px;white-space:nowrap}

/* four layers: a numbered index with a figure plate */
.lx{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);margin-top:clamp(56px,6vw,96px);align-items:start}
.lx-list{grid-column:1/6;display:flex;flex-direction:column;border-bottom:1px solid var(--rule)}
.lx-row{appearance:none;display:block;width:100%;margin:0;padding:22px 0 24px;border:0;border-top:1px solid var(--rule);background:none;text-align:left;cursor:pointer;color:var(--ink)}
.lx-head{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:baseline;column-gap:12px}
.lx-row .num{font-size:20px}
.lx-name{font-size:clamp(28px,2.5vw,42px);line-height:1.05;letter-spacing:-.03em;font-weight:430;color:var(--ink-3);transition:color .35s var(--ease)}
.lx-tag{font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.lx-row:hover .lx-name{color:var(--ink-2)}
.lx-row.is-on .lx-name{color:var(--ink)}
.lx-row.is-on .num{color:var(--gold-ink)}
.lx-copy{display:block;margin:14px 0 0 56px;max-width:36ch;font-size:16px;line-height:1.55;color:var(--ink-2);animation:grf-in .6s var(--ease) both}
.lx-bar{display:block;margin:18px 0 0 56px;height:1px;background:var(--rule)}
.lx-bar>span{display:block;height:1px;background:var(--gold);transition:width 1.1s linear}
@keyframes grf-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.lx-copy{animation:none}}
.lx-plate{grid-column:7/13;display:flex;flex-direction:column;gap:28px}
.plate{margin:0;height:300px;display:flex;flex-direction:column;justify-content:center;padding:36px 40px;background:var(--paper-2);border-radius:var(--r);overflow:hidden}
.svc{display:flex;flex-direction:column;border-bottom:1px solid var(--rule)}
.svc-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--cg);padding:15px 0;border-top:1px solid var(--rule)}
.svc-name{font-size:16px;font-weight:500;color:var(--ink)}
.svc-del{font-size:15px;line-height:1.5;color:var(--ink-2)}
.lx-note{display:flex;justify-content:space-between;align-items:center;gap:32px;margin-top:clamp(48px,5vw,80px);padding-top:24px;border-top:1px solid var(--rule)}
.lx-note p{font-size:16px;color:var(--ink-2)}

/* demo figures inside the plate */
.demo{display:flex;flex-direction:column;gap:22px;animation:grf-in .6s var(--ease) both}
@media (prefers-reduced-motion:reduce){.demo{animation:none}}
.q4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule-2)}
.q{display:flex;flex-direction:column;gap:8px;padding:16px 14px 4px 0;border-top:2px solid transparent;margin-top:-1px;transition:border-color .4s}
.q.is-on{border-top-color:var(--ink)}
.q-label{font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.q-title{font-size:16px;font-weight:500;line-height:1.3;color:var(--ink)}
.q-bar{display:block;height:2px;margin-top:6px;background:rgba(31,31,31,.1);overflow:hidden}
.q-bar>span{display:block;height:2px;background:var(--ink);transition:width .6s var(--ease)}
.demo-b{display:grid;grid-template-columns:168px minmax(0,1fr);column-gap:36px;align-items:center}
.b-swatch{width:168px;height:168px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;transition:background-color .6s}
.b-spec{display:flex;flex-direction:column;gap:14px}
.b-type{display:flex;align-items:center;gap:18px}
.b-aa{font-family:var(--serif);font-size:64px;line-height:.9;color:var(--ink)}
.b-lines{display:flex;flex-direction:column;gap:2px}
.b-h{font-size:17px;font-weight:500;color:var(--ink)}
.b-p{font-size:14px;color:var(--ink-2)}
.b-sw{display:flex;gap:10px}
.sw{width:30px;height:30px;border-radius:50%;box-shadow:0 0 0 3px var(--paper-2),0 0 0 4px transparent;transition:box-shadow .3s}
.sw.is-on{box-shadow:0 0 0 3px var(--paper-2),0 0 0 4px var(--ink)}
.demo-p{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:40px;align-items:center}
.p-kpi{display:flex;flex-direction:column;gap:6px}
.p-num{font-family:var(--serif);font-size:96px;line-height:.9;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.p-ch{display:flex;flex-direction:column;gap:16px}
.ch{display:flex;flex-direction:column;gap:7px}
.ch-top{display:flex;justify-content:space-between;font-size:15px;font-weight:500;color:var(--ink)}
.ch-top span+span{color:var(--ink-3);font-variant-numeric:tabular-nums}
.ch-bar{height:6px;background:rgba(31,31,31,.08)}
.ch-bar>div{height:6px;transition:width 1s var(--ease)}
.flow{display:flex;align-items:stretch;gap:8px}
.fl{flex:1;display:flex;flex-direction:column;justify-content:center;gap:3px;padding:16px 10px;text-align:center;border:1px solid var(--rule-2);border-radius:var(--r);transition:background-color .4s,color .4s,border-color .4s}
.fl.is-done{background:var(--card)}
.fl.is-on{background:var(--ink);border-color:var(--ink)}
.fl-n{font-size:14px;font-weight:500;color:var(--ink)}
.fl-t{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.fl.is-on .fl-n{color:var(--on-night)}
.fl.is-on .fl-t{color:var(--dot)}
.fl-arw{align-self:center;font-size:15px;color:var(--ink-4)}

/* ways of work: three typographic tabs */
.ww{margin-top:clamp(56px,6vw,96px)}
.ww-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg)}
.ww-tab{appearance:none;position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:0;padding:22px 0 26px;border:0;border-top:1px solid var(--rule-2);background:none;text-align:left;cursor:pointer}
.ww-tab::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform .6s var(--ease)}
.ww-tab.is-on::before{transform:scaleX(1)}
.ww-name{font-size:clamp(26px,2.3vw,38px);line-height:1.05;letter-spacing:-.03em;font-weight:430;color:var(--ink-3);transition:color .35s}
.ww-mode{font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.ww-tab:hover .ww-name{color:var(--ink-2)}
.ww-tab.is-on .ww-name{color:var(--ink)}
.ww-panel{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:40px;margin-top:clamp(40px,4vw,64px)}
.ww-how{grid-column:1/8;display:flex;flex-direction:column;gap:18px}
.ww-desc{font-size:clamp(26px,2.3vw,38px);line-height:1.18;letter-spacing:-.025em;font-weight:430;color:var(--ink);max-width:22ch;animation:grf-in .6s var(--ease) both}
.ww-terms{font-size:15px;font-weight:500;color:var(--ink-2)}
.ww-best{grid-column:9/13;display:flex;flex-direction:column;gap:18px}
.ww-best .body{animation:grf-in .6s var(--ease) both}
.ww-foot{grid-column:1/-1;padding-top:24px;border-top:1px solid var(--rule)}
@media (prefers-reduced-motion:reduce){.ww-desc,.ww-best .body{animation:none}}

/* the black statement band */
.statement{position:relative;padding:clamp(128px,14vw,236px) 0;overflow:hidden}
.st-label{display:flex;align-items:center;gap:14px;margin-bottom:clamp(32px,3.4vw,56px);color:var(--dot)}
.st-label::before{content:"";width:40px;height:1px;background:var(--dot)}
.st-text{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(64px,8.6vw,150px);line-height:.98;letter-spacing:-.018em;color:var(--on-night)}
.st-text .it{font-style:italic;padding-left:calc((100% + var(--cg)) / 12 * 3)}

/* service vs. system: a hairline 2 x 2 */
.cmp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-bottom:1px solid var(--rule)}
.cmp-cell{display:flex;flex-direction:column;gap:16px;padding:44px clamp(24px,3vw,56px) 48px 0;border-top:1px solid var(--rule)}
.cmp-cell:nth-child(2n){padding-left:clamp(24px,3vw,56px);padding-right:0;border-left:1px solid var(--rule)}
.cmp-k{font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.cmp-k .num{font-size:20px;letter-spacing:0;text-transform:none;color:var(--gold-ink);margin-right:2px}
.cmp-title{margin:0;font-size:clamp(28px,2.6vw,44px);line-height:1.06;letter-spacing:-.032em;font-weight:430;color:var(--ink)}
.cmp-copy{max-width:44ch;font-size:17px;line-height:1.6;color:var(--ink-2)}
.cmp-not{display:flex;align-items:flex-start;gap:12px;margin-top:auto;padding-top:18px;font-size:14px;line-height:1.5;color:var(--ink-3)}
.cmp-not svg{flex-shrink:0;margin-top:4px;stroke:var(--ink-4)}
.cmp-not-k{font-weight:500;color:var(--ink-2)}

/* ==========================================================================
   CONTACT (partial)
   ========================================================================== */
.ct{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:48px;align-items:start}
.ct-intro{grid-column:1/6;display:flex;flex-direction:column;gap:28px}
.ct-intro .sh-label{padding-top:0}
.ct-title{margin:6px 0 0;font-size:clamp(64px,8vw,148px);line-height:.92;letter-spacing:-.05em;font-weight:430;color:var(--ink)}
.ct-intro .lead{max-width:40ch}
.ct-list{display:flex;flex-direction:column;margin-top:8px;border-bottom:1px solid var(--rule-2)}
.ct-item{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--rule-2);font-size:16px;color:var(--ink)}
.ct-item svg{flex-shrink:0;stroke:var(--ink-3)}
.ct-item a{color:var(--ink);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .4s var(--ease)}
.ct-item a:hover{background-size:100% 1px}
.ct-form{grid-column:7/13;margin:0;display:flex;flex-direction:column;gap:30px;padding:clamp(28px,3vw,48px);background:var(--card);border-radius:var(--r);box-shadow:0 1px 0 rgba(31,31,31,.04)}
.f-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px var(--cg)}
.f{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.f input,.f textarea{width:100%;height:48px;margin:0;padding:0 0 2px;border:0;border-bottom:1px solid var(--rule-2);border-radius:0;background:transparent;font:inherit;font-size:17px;font-weight:400;letter-spacing:-.005em;text-transform:none;color:var(--ink);transition:border-color .3s}
.f textarea{height:112px;padding-top:12px;resize:vertical;line-height:1.5}
.f input::placeholder,.f textarea::placeholder{color:#77746B;opacity:1}
.f input:hover,.f textarea:hover{border-bottom-color:var(--ink-3)}
.f input:focus,.f textarea:focus{outline:none;border-bottom-color:var(--ink)}
form[data-contact] .f input:focus-visible,form[data-contact] .f textarea:focus-visible{outline:2px solid var(--gold-ink);outline-offset:4px}
.f-q{font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.f-set{display:flex;flex-direction:column;gap:12px}
.f-check{display:flex;align-items:center;gap:12px;min-height:44px;font-size:15px;color:var(--ink-2);cursor:pointer}
.f-check input{width:18px;height:18px;margin:0;accent-color:var(--ink)}
.f-honey{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.f-send{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:24px;border-top:1px solid var(--rule)}
.f-note{font-size:14px;color:var(--ink-3)}
.f-status{font-size:15px;line-height:1.5;color:#8F4A2E}
/* radio choices drawn as chips */
[data-pills]{display:flex;flex-wrap:wrap;gap:8px}
[data-pill]{position:relative;display:flex;cursor:pointer}
[data-pill] input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
[data-pill] span{flex:1;display:flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule-2);background:transparent;color:var(--ink);font-size:14.5px;font-weight:500;text-align:center;transition:background-color .2s,box-shadow .2s,color .2s}
[data-pill] input:hover+span{box-shadow:inset 0 0 0 1px var(--ink)}
[data-pill] input:checked+span{background:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);color:var(--paper)}
[data-pill] input:focus-visible+span{outline:2px solid var(--gold-ink);outline-offset:2px}
form[data-contact] button:disabled{opacity:.6;cursor:progress}
form[data-contact] [data-contact-status]:empty{display:none}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.foot{flex-grow:1;background:var(--night);color:var(--on-night-2);padding-top:clamp(72px,7vw,112px)}
.foot-top{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:48px;padding-bottom:clamp(56px,6vw,96px)}
.foot-brand{grid-column:1/6;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.foot-tag{width:118px;height:82px;display:block}
.foot-brand p{max-width:36ch;font-size:16px;line-height:1.6;color:var(--on-night-2)}
.foot .eyebrow{color:var(--on-night-2);opacity:.85}
.foot-brand .eyebrow{padding-top:8px}
.foot-soc{display:flex;gap:10px}
.foot-soc a{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:inset 0 0 0 1px var(--rule-night);transition:background-color .25s,box-shadow .25s}
.foot-soc a:hover{background:var(--night-2);box-shadow:inset 0 0 0 1px rgba(243,239,231,.4)}
.foot-col{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.foot-col .eyebrow{padding-bottom:8px}
.foot-links{grid-column:7/10}
.foot-contact{grid-column:10/13}
.foot-col a,.foot-col div:not(.eyebrow){font-size:16px;line-height:1.4;color:var(--on-night);text-decoration:none}
.foot-col div:not(.eyebrow){color:var(--on-night-2)}
.foot-col a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .4s var(--ease)}
.foot-col a:hover{background-size:100% 1px}
.foot-legal{display:flex;justify-content:space-between;align-items:center;gap:16px 28px;flex-wrap:wrap;padding:26px 0 34px;border-top:1px solid var(--rule-night);font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.foot-legal-l{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px}
.foot-legal span,.foot-legal a{color:#A29D92;text-decoration:none}
.foot-legal a:hover{color:var(--on-night)}
.foot-legal .foot-motto{color:var(--dot)}

/* ==========================================================================
   INNER PAGES: shared page hero
   ========================================================================== */
.phero-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);padding-top:clamp(56px,7vw,116px);padding-bottom:clamp(72px,7.5vw,128px)}
.phero-meta{grid-column:1/-1;margin-bottom:clamp(28px,3vw,52px)}
.phero-h1{grid-column:1/13;font-size:clamp(48px,5.4vw,98px);line-height:.98}
.phero-h1 .ind{padding-left:calc((100% + var(--cg)) / 12 * 2)}
.phero-lead{grid-column:7/12;margin-top:clamp(40px,4.2vw,72px)}
.phero-lead+.phero-lead{margin-top:20px}

/* ==========================================================================
   WHAT WE DO
   ========================================================================== */
.jump{position:sticky;top:0;z-index:15;background:rgba(247,244,238,.94);-webkit-backdrop-filter:saturate(1.3) blur(12px);backdrop-filter:saturate(1.3) blur(12px);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.jump-in{display:flex;align-items:center;gap:clamp(22px,2.8vw,48px);height:60px}
.jump-k{font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.jump-a{display:inline-flex;align-items:baseline;gap:8px;padding:8px 0;font-size:15px;font-weight:500;color:var(--ink-2);text-decoration:none;white-space:nowrap;transition:color .25s}
.jump-a .num{font-size:17px}
.jump-a:hover,.jump-a[aria-current]{color:var(--ink)}
.jump-a[aria-current] .num{color:var(--gold-ink)}
.jump-cta{margin-left:auto;font-size:15px}

.chap{position:relative;padding:clamp(104px,10vw,176px) 0 clamp(80px,7vw,120px);scroll-margin-top:60px}
.chap+.chap::before{content:"";position:absolute;left:var(--gut);right:var(--gut);top:0;max-width:var(--maxw);margin:0 auto;height:1px;background:var(--rule-2)}
.chap-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);align-items:start}
.chap-num{--par:22px;grid-column:1/4;grid-row:1/3;margin-top:-.02em;font-family:var(--serif);font-style:italic;font-size:clamp(96px,9.4vw,172px);line-height:.8;letter-spacing:-.03em;color:var(--ink)}
.chap-tag{grid-column:4/13;grid-row:1;margin-bottom:18px}
.chap-name{grid-column:4/13;grid-row:2;margin:0;font-size:clamp(64px,8.2vw,148px);line-height:.92;letter-spacing:-.05em;font-weight:420;color:var(--ink)}
.chap-copy{grid-column:7/12;grid-row:3;display:flex;flex-direction:column;align-items:flex-start;gap:26px;margin-top:clamp(40px,4vw,64px)}
.chap-svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);row-gap:48px;margin-top:clamp(64px,6.4vw,112px)}
.cs{display:flex;flex-direction:column;gap:12px;padding-top:22px;border-top:1px solid var(--ink)}
.cs-name{font-size:clamp(22px,1.75vw,28px);line-height:1.15;letter-spacing:-.022em;font-weight:450;color:var(--ink)}
.cs-out{max-width:32ch;font-size:16px;line-height:1.55;color:var(--ink-2)}
.cs-k{margin-top:14px;font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.cs-dels{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.cs-dels li{display:flex;align-items:baseline;gap:12px;padding:11px 0;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.45;color:var(--ink)}
.cs-dels li::before{content:"";flex-shrink:0;width:9px;height:1px;background:var(--ink-3);transform:translateY(-4px)}
.chap-foot{margin-top:clamp(40px,4vw,64px)}

.vs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:clamp(56px,6vw,104px);border-top:1px solid var(--rule-night);border-bottom:1px solid var(--rule-night)}
.vs-col{display:flex;flex-direction:column;gap:18px;padding:40px clamp(24px,3.4vw,64px) 48px 0}
.vs-one{padding-left:clamp(24px,3.4vw,64px);padding-right:0;border-left:1px solid var(--rule-night)}
.vs-big{max-width:20ch;font-size:clamp(28px,2.6vw,46px);line-height:1.12;letter-spacing:-.028em;font-weight:430}
.vs-pieces .vs-big{color:#8F8A80}
.vs-one .vs-big{color:var(--on-night)}
.vs-one .eyebrow{color:var(--dot)}
.vs-sub{font-size:15px;line-height:1.6;color:var(--on-night-2)}

.steps{list-style:none;position:relative;margin:clamp(64px,6.4vw,112px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--cg)}
.step{position:relative;display:flex;flex-direction:column;gap:12px;padding-top:40px}
.step::before,.step::after{content:"";position:absolute;left:0;top:6px;height:1px}
.step::before{right:calc(var(--cg) * -1);background:var(--rule-2)}
.step::after{width:0;background:var(--ink);transition:width 1.1s linear}
.step.is-done::after{width:calc(100% + var(--cg))}
.step:last-child::before{right:0}
.step-mark{position:absolute;z-index:1;left:0;top:0;width:13px;height:13px;border-radius:50%;background:var(--paper-2);box-shadow:inset 0 0 0 1px var(--ink-3);transition:background-color .4s,box-shadow .4s}
.step.is-done .step-mark{background:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.step.is-on .step-mark{background:var(--dot);box-shadow:inset 0 0 0 1px var(--dot),0 0 0 6px rgba(213,185,146,.28)}
.step .num{font-size:22px;line-height:1}
.step.is-on .num{color:var(--gold-ink)}
.step-name{font-size:clamp(28px,2.4vw,40px);line-height:1.05;letter-spacing:-.032em;font-weight:430;color:var(--ink)}
.step-copy{max-width:28ch;font-size:16px;line-height:1.55;color:var(--ink-2)}

.qa{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:40px;align-items:start}
.qa-intro{grid-column:1/5;position:sticky;top:40px;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.qa-intro .sh-label{padding-top:0}
.qa-title{max-width:14ch}
.qa-list{grid-column:6/13;border-bottom:1px solid var(--rule)}
.qa-item{border-top:1px solid var(--rule)}
.qa-q{appearance:none;width:100%;min-height:80px;margin:0;padding:24px 0;display:flex;align-items:center;justify-content:space-between;gap:24px;border:0;background:none;text-align:left;cursor:pointer;font-size:clamp(19px,1.5vw,23px);line-height:1.3;font-weight:450;letter-spacing:-.014em;color:var(--ink)}
.qa-sign{flex-shrink:0;width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:inset 0 0 0 1px var(--rule-2);font-size:19px;font-weight:400;line-height:1;transition:background-color .3s,color .3s,box-shadow .3s}
.qa-q:hover .qa-sign{box-shadow:inset 0 0 0 1px var(--ink)}
.qa-item.is-open .qa-sign{background:var(--ink);color:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}
.qa-a{max-width:62ch;padding:0 64px 30px 0;font-size:17px;line-height:1.65;color:var(--ink-2);animation:grf-in .5s var(--ease) both}
@media (prefers-reduced-motion:reduce){.qa-a{animation:none}}

/* ==========================================================================
   RESULTS
   ========================================================================== */
.feat{padding:clamp(88px,8.5vw,152px) 0}
.feat-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:64px;align-items:start}
.feat-main{grid-column:1/8;display:flex;flex-direction:column;align-items:flex-start;gap:26px}
.feat-tags{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--on-night-2)}
.feat-tags>span+span{padding-left:22px;border-left:1px solid var(--rule-night)}
.feat-flag{display:inline-flex;align-items:center;gap:10px;color:var(--dot)}
.feat-flag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--dot)}
.feat-client{font-size:15px;color:var(--on-night-2)}
.feat-h{margin:0;max-width:16ch;font-size:clamp(44px,4.6vw,82px);line-height:1;letter-spacing:-.04em;font-weight:430;color:var(--on-night)}
.feat-p{max-width:52ch}
.feat-built{list-style:none;margin:6px 0 4px;padding:0;width:100%;max-width:640px;border-top:1px solid var(--rule-night)}
.feat-built li{display:flex;gap:14px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--rule-night);font-size:16px;line-height:1.5;color:var(--on-night)}
.feat-built li::before{content:"";flex-shrink:0;width:6px;height:6px;border-radius:50%;background:var(--dot);transform:translateY(-2px)}
.feat-side{grid-column:9/13;display:flex;flex-direction:column;gap:56px}
.feat-stats{display:flex;flex-direction:column}
.fst{display:flex;flex-direction:column;gap:8px;padding:22px 0 24px;border-top:1px solid var(--rule-night)}
.fst-n{font-family:var(--serif);font-size:clamp(64px,5.6vw,104px);line-height:.9;letter-spacing:-.02em;color:var(--on-night);font-variant-numeric:lining-nums}
.fst-l{max-width:30ch;font-size:15px;line-height:1.5;color:var(--on-night-2)}
.feat-q{margin:0;display:flex;flex-direction:column;gap:22px;padding-top:28px;border-top:1px solid var(--rule-night)}
.feat-q blockquote{margin:0;font-family:var(--serif);font-size:22px;line-height:1.35;color:var(--on-night)}
.who{display:flex;align-items:center;gap:14px}
.who-img{width:44px;height:44px;border-radius:50%;object-fit:cover;display:block;flex-shrink:0;filter:grayscale(.15)}
.who-init{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--ink);color:var(--dot);font-size:14px;font-weight:500}
.who-txt{display:flex;flex-direction:column;min-width:0}
.who-n{font-size:15px;font-weight:500;color:var(--ink)}
.who-r{font-size:13.5px;line-height:1.4;color:var(--ink-3)}
.on-night .who-n{color:var(--on-night)}
.on-night .who-r{color:var(--on-night-2)}
.who-li{display:flex;flex-shrink:0;margin-left:auto;padding:8px;color:var(--ink-3)}
.on-night .who-li{color:var(--on-night-2)}

.filters{display:flex;flex-wrap:wrap;gap:8px}
.sh .sh-aside.filters{grid-column:4/13;margin-top:36px}
.chip{appearance:none;margin:0;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:transparent;box-shadow:inset 0 0 0 1px var(--rule-2);font-size:14px;font-weight:500;color:var(--ink);cursor:pointer;transition:background-color .25s,color .25s,box-shadow .25s}
.chip:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.chip.is-on{background:var(--ink);color:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);row-gap:40px;margin-top:clamp(56px,5.6vw,96px)}
.case{position:relative;display:flex;flex-direction:column;gap:10px;min-height:440px;padding:22px 0 0;border-top:1px solid var(--ink);color:var(--ink);text-decoration:none}
.case::after{content:"";position:absolute;left:0;top:-1px;height:3px;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform .6s var(--ease)}
.case:hover::after{transform:scaleX(1)}
.case-meta{display:flex;justify-content:space-between;gap:12px;font-size:11.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.case-client{margin-top:34px;font-size:18px;font-weight:500;color:var(--ink)}
.case-ind{font-size:14px;color:var(--ink-3)}
.case-head{margin-top:14px;max-width:16ch;font-size:clamp(28px,2.4vw,40px);line-height:1.06;letter-spacing:-.03em;font-weight:430;color:var(--ink)}
.case-sub{font-size:16px;line-height:1.5;color:var(--ink-2)}
.case-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-top:28px}
.case-tags{display:flex;flex-wrap:wrap;gap:6px}
.case-tags>span{font-size:12px;font-weight:500;padding:4px 10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule-2);color:var(--ink-2)}
.case-arw{flex-shrink:0;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:inset 0 0 0 1px var(--rule-2);font-size:17px;transition:background-color .3s,color .3s,box-shadow .3s}
.case:hover .case-arw{background:var(--ink);color:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}

.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);row-gap:48px;margin-top:clamp(56px,5.6vw,96px)}
.qt{margin:0;display:flex;flex-direction:column;gap:18px;padding-top:24px;border-top:1px solid var(--rule-2)}
.qt.is-feature{border-top-color:var(--ink)}
.qt-mark{height:44px;font-family:var(--serif);font-size:96px;line-height:.9;color:var(--ink)}
.qt blockquote{margin:0;font-family:var(--serif);font-size:clamp(21px,1.6vw,25px);line-height:1.34;letter-spacing:-.003em;color:var(--ink)}
.qt .who{margin-top:auto;padding-top:22px;border-top:1px solid var(--rule)}

.clients{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:40px;align-items:start}
.clients-intro{grid-column:1/5;position:sticky;top:40px;display:flex;flex-direction:column;gap:22px}
.clients-intro .sh-label{padding-top:0}
.clients-intro .h3{max-width:13ch}
.ctable{grid-column:5/13;border-bottom:1px solid var(--rule)}
.crow{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,2.4fr);column-gap:var(--cg);align-items:baseline;padding:19px 0;border-top:1px solid var(--rule);text-decoration:none}
.crow-n{font-size:clamp(19px,1.5vw,22px);font-weight:450;letter-spacing:-.015em;color:var(--ink)}
.crow-s{font-size:14.5px;line-height:1.45;color:var(--ink-3)}
.crow-m{justify-self:end;font-size:11.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap}
.crow:not(.crow-next):hover .crow-n{color:var(--gold-ink)}
.crow-next{border-top:1px solid var(--ink)}
.crow-next .crow-n{font-family:var(--serif);font-style:italic;font-size:clamp(24px,1.9vw,30px);letter-spacing:0;font-weight:400}
.crow-next .crow-m{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;background:var(--ink);color:var(--paper);letter-spacing:.08em;transition:background-color .25s}
.crow-next:hover .crow-m{background:var(--gold-ink)}

.proof{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:56px;padding-top:clamp(56px,5vw,88px)}
.proof::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--rule-2);transform-origin:0 50%}
.proof-st{grid-column:1/11;font-family:var(--serif);font-size:clamp(44px,4.6vw,84px);line-height:1.02;letter-spacing:-.015em;color:var(--ink)}
.proof-cols{grid-column:1/13;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg)}
.proof-cols>div{display:flex;flex-direction:column;gap:8px;padding-top:18px;border-top:1px solid var(--rule)}
.proof-cols>div>span:first-child{font-size:17px;font-weight:500;color:var(--ink)}
.proof-cols>div>span+span{max-width:34ch;font-size:15.5px;line-height:1.55;color:var(--ink-2)}

/* ==========================================================================
   ABOUT
   ========================================================================== */
.gname{display:flex;align-items:center;justify-content:center;height:clamp(240px,22vw,400px);margin-top:clamp(48px,5vw,88px);border-top:1px solid var(--rule-night);border-bottom:1px solid var(--rule-night);overflow:hidden}
.gname-word{display:flex;align-items:baseline;font-size:clamp(150px,16.5vw,300px);line-height:1;letter-spacing:-.05em;font-weight:420}
.gname-l{display:inline-block;overflow:hidden;transition:max-width .9s var(--ease),opacity .6s ease,color .6s ease}
.gname-dot{display:inline-block;flex-shrink:0;width:.19em;height:.19em;margin-left:.06em;border-radius:50%;background:var(--dot);transition:opacity .6s ease,transform .6s var(--ease)}
@media (prefers-reduced-motion:reduce){.gname-l,.gname-dot{transition:none}}
.tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);row-gap:36px;margin-top:clamp(56px,5vw,88px)}
.tri>div{display:flex;flex-direction:column;gap:12px;padding-top:20px;border-top:1px solid var(--rule-night)}
.tri .num{font-size:22px;color:var(--dot)}
.tri-t{font-size:clamp(22px,1.8vw,28px);line-height:1.15;letter-spacing:-.02em;font-weight:450;color:var(--on-night)}
.tri-c{max-width:34ch;font-size:16px;line-height:1.6;color:var(--on-night-2)}
.tri--paper>div{border-top-color:var(--ink)}
.tri--paper .num{color:var(--gold-ink)}
.tri--paper .tri-t{color:var(--ink)}
.tri--paper .tri-c{color:var(--ink-2)}

.traits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);row-gap:40px;margin-top:clamp(56px,5.6vw,96px)}
.trait{position:relative;display:flex;flex-direction:column;gap:14px;padding-top:28px;border-top:1px solid var(--rule-2)}
.trait::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform .9s var(--ease)}
.trait[data-on=true]::before{transform:scaleX(1)}
.trait svg{stroke:var(--ink);margin-bottom:12px}
.trait-t{font-size:clamp(26px,2.2vw,36px);line-height:1.08;letter-spacing:-.03em;font-weight:430;color:var(--ink)}
.trait-c{max-width:34ch;font-size:16px;line-height:1.6;color:var(--ink-2)}

.believe{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);align-items:end}
.believe-head{grid-column:1/9;display:flex;flex-direction:column;gap:26px}
.believe-head .sh-label{padding-top:0}
.believe-head .lead{max-width:44ch}
.believe-tag{grid-column:10/13;justify-self:end;width:min(240px,100%);height:auto;display:block}
.rise{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);align-items:start;margin-top:clamp(64px,6vw,104px)}
.rise-col{display:flex;flex-direction:column;gap:14px;padding:28px 28px 36px;background:var(--card);border-radius:var(--r);transition:background-color .6s var(--ease),color .6s}
.rise-top{display:flex;justify-content:space-between;align-items:center}
.rise-top .num{font-size:22px}
.rise-top svg{stroke:var(--ink-3);transition:stroke .6s}
.rise-t{font-size:clamp(24px,2vw,32px);line-height:1.1;letter-spacing:-.025em;font-weight:430;color:var(--ink);transition:color .6s}
.rise-c{font-size:16px;line-height:1.6;color:var(--ink-2);transition:color .6s}
.rise-col.is-on{background:var(--night)}
.rise-col.is-on .num{color:var(--dot)}
.rise-col.is-on svg{stroke:var(--dot)}
.rise-col.is-on .rise-t{color:var(--on-night)}
.rise-col.is-on .rise-c{color:var(--on-night-2)}

.founder{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:48px;align-items:start}
.founder-l{grid-column:1/6;position:sticky;top:40px;display:flex;flex-direction:column;gap:26px}
.founder-l .sh-label{padding-top:0}
.founder-r{grid-column:7/13;display:flex;flex-direction:column;align-items:flex-start;gap:26px}
.figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);width:100%;margin:16px 0 8px;border-top:1px solid var(--ink)}
.figs>div{display:flex;flex-direction:column;gap:6px;padding-top:18px}
.figs-n{font-family:var(--serif);font-size:clamp(52px,4.4vw,80px);line-height:.95;color:var(--ink)}
.figs-l{max-width:20ch;font-size:14px;line-height:1.45;color:var(--ink-3)}
.pull{display:flex;gap:14px;align-items:flex-start;padding:28px 0 6px;border-top:1px solid var(--rule)}
.pull-m{font-family:var(--serif);font-size:64px;line-height:.8;color:var(--ink)}
.pull-t{font-family:var(--serif);font-style:italic;font-size:clamp(26px,2.2vw,36px);line-height:1.18;color:var(--ink)}

.team{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--cg);row-gap:56px;margin-top:clamp(56px,5.6vw,96px)}
.tm{display:flex;flex-direction:column;gap:6px}
.tm-photo{position:relative;aspect-ratio:4/5;margin-bottom:18px;overflow:hidden;border-radius:var(--r);background:var(--paper-3)}
.tm-photo>img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block;transform:scale(1.02);transition:transform 1.2s var(--ease)}
.tm:hover .tm-photo>img{transform:scale(1.06)}
.tm-init{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:48px;color:var(--gold-ink)}
.tm-li{position:absolute;right:12px;bottom:12px;width:32px;height:32px;display:block;border-radius:6px;opacity:.92;transition:opacity .25s}
.tm-li:hover{opacity:1}
.tm-li img{display:block;width:32px;height:32px}
.tm-layer{display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.tm-layer::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--rule-2);transition:background-color .5s}
.tm[data-on=true] .tm-layer::before{background:var(--dot)}
.tm-name{margin-top:8px;font-size:clamp(22px,1.75vw,28px);line-height:1.1;letter-spacing:-.022em;font-weight:450;color:var(--ink)}
.tm-role{font-size:14.5px;font-weight:500;color:var(--gold-ink)}
.tm-line{margin-top:8px;font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.tm-fact{margin-top:10px;padding-top:14px;border-top:1px solid var(--rule-2);font-size:14px;line-height:1.5;color:var(--ink-3)}

/* ==========================================================================
   CASE STUDY (case-template.html)
   ========================================================================== */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:14px;color:var(--ink-3)}
.crumbs a{color:var(--ink-3);text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:2px}
.crumbs a:hover{color:var(--ink)}
.crumbs span:last-child{color:var(--ink);font-weight:500}
.case-kicker{grid-column:1/-1;margin-bottom:22px}
.case-h1{grid-column:1/12;font-size:clamp(48px,5.6vw,100px)}
.cmeta{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--cg);margin-top:clamp(48px,5vw,88px);border-top:1px solid var(--ink)}
.cmeta>div{display:flex;flex-direction:column;gap:6px;padding-top:16px}
.cmeta>div>span:first-child{font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.cmeta>div>span+span{font-size:17px;font-weight:500;line-height:1.35;color:var(--ink)}
.cstats{padding:clamp(72px,7vw,120px) 0}
.cstats-in{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg)}
.cst{display:flex;flex-direction:column;gap:14px;padding-top:22px;border-top:1px solid var(--rule-night)}
.cst-n{font-family:var(--serif);font-size:clamp(72px,7.4vw,136px);line-height:.88;letter-spacing:-.02em;color:var(--on-night)}
.cst-n.is-long{font-size:clamp(44px,4.4vw,80px);line-height:.95}
.cst-l{max-width:28ch;font-size:16px;line-height:1.5;color:var(--on-night-2)}
.cblock{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);padding:clamp(48px,4.4vw,80px) 0;border-top:1px solid var(--rule-2)}
.cblock:first-child{padding-top:clamp(32px,3vw,48px)}
.cblock .sh-label{grid-column:1/4;padding-top:10px}
.cblock-main{grid-column:4/11;display:flex;flex-direction:column;gap:22px}
.cblock-main .h3{max-width:22ch;margin-bottom:8px;font-size:clamp(30px,2.8vw,48px);line-height:1.06;letter-spacing:-.032em}
.cpara{max-width:62ch;font-size:19px;line-height:1.68;color:var(--ink-2)}
.cpara:last-child:not(:first-of-type){color:var(--ink)}
.csteps{grid-column:4/13;gap:0;border-bottom:1px solid var(--rule)}
.cstep{display:grid;grid-template-columns:72px minmax(0,1fr) auto;column-gap:var(--cg);align-items:start;padding:28px 0;border-top:1px solid var(--rule)}
.cstep:first-child{border-top:0;padding-top:4px}
.cstep .num{font-size:30px;line-height:1;color:var(--ink)}
.cstep-b{display:flex;flex-direction:column;gap:10px}
.cstep-t{font-size:clamp(22px,1.8vw,28px);line-height:1.15;letter-spacing:-.022em;font-weight:450;color:var(--ink)}
.cstep-c{max-width:60ch;font-size:17px;line-height:1.62;color:var(--ink-2)}
.cstep-l{font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);padding-top:8px;white-space:nowrap}
.cquote{position:relative;margin:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:34px;padding-top:clamp(56px,5vw,88px)}
.cquote::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--rule-2);transform-origin:0 50%}
.cquote-m{grid-column:1/3;font-family:var(--serif);font-size:clamp(120px,11vw,200px);line-height:.7;color:var(--ink)}
.cquote blockquote{grid-column:3/12;margin:0;font-family:var(--serif);font-size:clamp(32px,3.1vw,56px);line-height:1.16;letter-spacing:-.012em;color:var(--ink)}
.cquote .who{grid-column:3/12}
.who-li--near{margin-left:6px}
.cnext{padding:clamp(80px,7vw,128px) 0}
.cnext-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:24px;align-items:stretch}
.cnext-case{grid-column:1/8;display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:30px 0 0;border-top:1px solid var(--ink);color:var(--ink);text-decoration:none}
.cnext-client{margin-top:18px;font-size:18px;font-weight:500;color:var(--ink)}
.cnext-head{max-width:18ch;font-size:clamp(36px,3.6vw,64px);line-height:1.02;letter-spacing:-.04em;font-weight:430;color:var(--ink);transition:color .3s}
.cnext-case:hover .cnext-head{color:var(--gold-ink)}
.cnext-go{margin-top:auto}
.cnext-cta{grid-column:9/13;display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:32px;background:var(--night);border-radius:var(--r)}
.cnext-cta .eyebrow{color:var(--dot)}
.cnext-q{font-size:clamp(24px,2vw,32px);line-height:1.18;letter-spacing:-.022em;font-weight:430;color:var(--on-night);margin-bottom:12px}
.cnext-cta .btn{margin-top:auto}

/* ==========================================================================
   PERSPECTIVES + ARTICLE
   ========================================================================== */
.journal-h1{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(72px,8.4vw,152px);line-height:.9;letter-spacing:-.025em;color:var(--ink)}
.cover{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:40px;padding:clamp(40px,4vw,64px) 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule-2);color:var(--ink);text-decoration:none}
.cover-main{grid-column:1/8;display:flex;flex-direction:column;align-items:flex-start;gap:26px}
.cover-meta{display:flex;align-items:center;gap:18px;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.cover-cat{display:inline-flex;align-items:center;gap:10px;color:var(--ink)}
.cover-cat::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--dot)}
.cover-h{margin:0;max-width:17ch;font-size:clamp(44px,4.6vw,82px);line-height:1;letter-spacing:-.04em;font-weight:430;color:var(--ink);transition:color .3s}
.cover:hover .cover-h{color:#3A3A35}
.cover-main .lead{max-width:46ch}
.cover-by{display:flex;align-items:center;gap:14px;width:100%;margin-top:10px;padding-top:24px;border-top:1px solid var(--rule)}
.cover-by .who-img{width:52px;height:52px}
.cover-go{margin-left:auto}
.cover-side{grid-column:9/13;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;padding:36px;background:var(--paper-2);border-radius:var(--r)}
.cover-mark{height:56px;font-family:var(--serif);font-size:120px;line-height:.85;color:var(--ink)}
.cover-q{font-family:var(--serif);font-style:italic;font-size:clamp(28px,2.4vw,40px);line-height:1.15;color:var(--ink)}
.posts{margin-top:clamp(48px,5vw,88px);border-bottom:1px solid var(--rule-2)}
.post{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:20px;align-items:start;padding:34px 0 38px;border-top:1px solid var(--rule-2);color:var(--ink);text-decoration:none}
.post-meta{grid-column:1/4;display:flex;flex-direction:column;gap:6px;padding-top:8px;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.post-cat{color:var(--ink)}
.post-main{grid-column:4/10;display:flex;flex-direction:column;gap:14px}
.post-title{max-width:22ch;font-size:clamp(28px,2.5vw,42px);line-height:1.06;letter-spacing:-.032em;font-weight:430;color:var(--ink);transition:color .3s}
.post:hover .post-title{color:var(--gold-ink)}
.post-ex{max-width:54ch;font-size:16px;line-height:1.6;color:var(--ink-2)}
.post-q{max-width:46ch;font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.3;color:var(--ink)}
.post-by{grid-column:10/13;display:flex;align-items:center;gap:12px;padding-top:8px}
.post-arw{flex-shrink:0;width:44px;height:44px;margin-left:auto;display:flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:inset 0 0 0 1px var(--rule-2);font-size:17px;transition:background-color .3s,color .3s,box-shadow .3s}
.post:hover .post-arw{background:var(--ink);color:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}
.lines{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--cg);row-gap:40px;margin-top:clamp(48px,5vw,88px)}
.line{position:relative;margin:0;display:flex;flex-direction:column;gap:26px;padding-top:28px;border-top:1px solid var(--rule-2)}
.line::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.2s var(--ease)}
.line.is-on::before{transform:scaleX(1)}
.line blockquote{margin:0;font-family:var(--serif);font-size:clamp(26px,2.2vw,36px);line-height:1.16;color:var(--ink)}
.line figcaption{margin-top:auto;font-size:13px;font-weight:500;letter-spacing:.04em;color:var(--ink-3)}
.line.is-on figcaption{color:var(--gold-ink)}
.news{padding:clamp(96px,9vw,160px) 0}
.news-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:48px;align-items:end}
.news-l{grid-column:1/8;display:flex;flex-direction:column;gap:22px}
.news-l .st-label{margin-bottom:6px}
.news-h{margin:0;max-width:18ch;font-family:var(--serif);font-weight:400;font-size:clamp(48px,5vw,92px);line-height:1;letter-spacing:-.015em;color:var(--on-night)}
.news-r{grid-column:9/13}
.news-form{display:flex;flex-direction:column;gap:22px}
.f--night{color:var(--on-night-2)}
.f--night input{border-bottom-color:rgba(243,239,231,.3);color:var(--on-night)}
.f--night input::placeholder{color:#8F8A80}
.f--night input:focus{border-bottom-color:var(--on-night)}
.f--night input:focus-visible{outline:2px solid var(--on-night);outline-offset:4px}
.news-ok{display:flex;align-items:center;gap:14px;font-size:20px;font-weight:450;color:var(--on-night)}
.news-tick{width:42px;height:42px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--dot)}

.art-head{padding-top:clamp(56px,6vw,104px);padding-bottom:clamp(48px,5vw,80px);display:flex;flex-direction:column;align-items:flex-start;gap:26px}
.art-h1{margin:12px 0 0;max-width:18ch;font-size:clamp(48px,5.4vw,96px);line-height:.98;letter-spacing:-.045em;font-weight:430;color:var(--ink)}
.art-sub{max-width:36ch;font-family:var(--serif);font-style:italic;font-size:clamp(26px,2.2vw,36px);line-height:1.2;color:var(--ink-2)}
.art-by{display:flex;align-items:center;gap:14px;margin-top:8px;padding-top:22px;border-top:1px solid var(--rule-2);min-width:min(420px,100%)}
.art-by .who-img{width:52px;height:52px}
.art-body{padding-bottom:clamp(88px,8vw,144px)}
.art-col{max-width:720px;margin-left:calc((100% + var(--cg)) / 12 * 3);display:flex;flex-direction:column;gap:26px;padding-top:clamp(40px,4vw,64px);border-top:1px solid var(--ink)}
.art-p{font-size:20px;line-height:1.72;color:#3E3F39}
.art-p .em{font-weight:500;color:var(--ink)}
.art-h2{margin:30px 0 0;font-size:clamp(28px,2.4vw,38px);line-height:1.12;letter-spacing:-.028em;font-weight:450;color:var(--ink)}
.art-big{margin:10px 0;font-family:var(--serif);font-size:clamp(30px,2.6vw,42px);line-height:1.16;letter-spacing:-.008em;color:var(--ink)}
.art-q{margin:28px 0 28px calc(-1 * min(15vw, 220px));padding:34px 0 30px;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule-2);font-family:var(--serif);font-style:italic;font-size:clamp(34px,3.4vw,56px);line-height:1.1;color:var(--ink)}
.art-sign{display:flex;align-items:center;gap:16px;margin-top:40px;padding-top:30px;border-top:1px solid var(--rule-2)}
.art-sign-img{width:64px;height:64px;border-radius:50%;object-fit:cover;display:block}
.art-li{margin-left:auto}
.more-head{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:32px;padding-top:26px}
.more-head::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--rule-2);transform-origin:0 50%}
.more-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--cg);row-gap:32px;margin-top:clamp(40px,4vw,64px)}
.more-card{display:flex;flex-direction:column;gap:14px;padding:28px 0 8px;border-top:1px solid var(--ink);color:var(--ink);text-decoration:none}
.more-k{font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.more-t{max-width:20ch;font-size:clamp(26px,2.3vw,38px);line-height:1.08;letter-spacing:-.03em;font-weight:430;color:var(--ink);transition:color .3s}
.more-card:hover .more-t{color:var(--gold-ink)}
.more-ex{max-width:50ch;font-size:16px;line-height:1.6;color:var(--ink-2)}

/* ==========================================================================
   FAQ + PRIVACY (document pages), THANK YOU, 404, MENU
   ========================================================================== */
.doc{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:40px;align-items:start}
.toc{grid-column:1/4;position:sticky;top:32px;display:flex;flex-direction:column;align-items:flex-start;padding-top:18px;border-top:1px solid var(--ink)}
.toc-k{margin-bottom:10px;font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.toc a{padding:7px 0;font-size:15px;font-weight:500;color:var(--ink-2);text-decoration:none;transition:color .25s}
.toc a:hover{color:var(--ink)}
.doc-main{grid-column:5/13;display:flex;flex-direction:column;gap:clamp(56px,5vw,88px);max-width:860px}
.fgroup{display:flex;flex-direction:column;scroll-margin-top:24px}
.fgroup-h{margin:0 0 18px;font-family:var(--serif);font-weight:400;font-size:clamp(36px,3.2vw,54px);line-height:1;letter-spacing:-.01em;color:var(--ink)}
.fq{border-top:1px solid var(--rule)}
.fq:last-child{border-bottom:1px solid var(--rule)}
.fq-s{min-height:78px;padding:22px 0;display:flex;align-items:center;justify-content:space-between;gap:24px;cursor:pointer;font-size:clamp(19px,1.45vw,22px);line-height:1.32;font-weight:450;letter-spacing:-.012em;color:var(--ink)}
.fq-s:hover .qa-sign{box-shadow:inset 0 0 0 1px var(--ink)}
details[data-faq][open] .qa-sign{background:var(--ink);color:var(--paper);box-shadow:inset 0 0 0 1px var(--ink)}
.fq-s:focus-visible{outline:2px solid var(--gold-ink);outline-offset:4px;border-radius:2px}
.fq-a{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:0 64px 28px 0}
.fq-a p{max-width:64ch;font-size:17px;line-height:1.65;color:var(--ink-2)}
.ask{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:clamp(32px,3vw,48px);background:var(--night);border-radius:var(--r)}
.ask .eyebrow{color:var(--dot)}
.ask-t{max-width:20ch;margin-bottom:10px;font-family:var(--serif);font-size:clamp(34px,3vw,52px);line-height:1.04;color:var(--on-night)}
.legal{gap:0;border-bottom:1px solid var(--rule)}
.psec{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,5fr);column-gap:var(--cg);padding:30px 0 34px;border-top:1px solid var(--rule);scroll-margin-top:24px}
.psec h2{margin:0;font-size:20px;line-height:1.3;font-weight:500;letter-spacing:-.01em;color:var(--ink)}
.psec p{font-size:17px;line-height:1.7;color:#3E3F39}

.ty-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:56px;align-items:center;min-height:clamp(560px,calc(100svh - 80px),820px);padding-top:clamp(56px,6vw,96px);padding-bottom:clamp(56px,6vw,96px)}
.ty-main{grid-column:1/7;display:flex;flex-direction:column;align-items:flex-start;gap:28px}
.ty-tick{width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--night)}
.ty-h1{font-size:clamp(52px,5.8vw,104px)}
.ty-main .lead{max-width:38ch}
.ty-next{grid-column:8/13;display:flex;flex-direction:column;padding-top:20px;border-top:1px solid var(--ink)}
.ty-next .eyebrow{margin-bottom:14px}
.ty-step{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:16px;padding:20px 0;border-top:1px solid var(--rule)}
.ty-step .num{font-size:24px;line-height:1.1;color:var(--ink)}
.ty-step>div{display:flex;flex-direction:column;gap:4px}
.ty-step>div>span:first-child{font-size:18px;font-weight:500;line-height:1.35;color:var(--ink)}
.ty-step>div>span+span{font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.more-card .lnk{align-self:flex-start;margin-top:4px}

.nf-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cg);row-gap:32px;align-items:end;min-height:clamp(520px,calc(100svh - 80px),780px);padding-top:clamp(48px,5vw,80px);padding-bottom:clamp(56px,6vw,96px)}
.nf-num{grid-column:1/-1;font-family:var(--serif);font-size:clamp(160px,19vw,320px);line-height:.8;letter-spacing:-.04em;color:var(--ink)}
.nf-dot{color:var(--gold-ink)}
.nf-copy{grid-column:5/12;display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.nf-links{display:flex;flex-wrap:wrap;gap:10px;padding-top:8px}

.menu{padding:0 var(--gut) 32px;background:var(--night);color:var(--on-night-2)}
.menu>*{width:100%;max-width:640px;margin-left:auto;margin-right:auto}
.menu-top{height:64px;display:flex;align-items:center;justify-content:space-between}
.menu-top img{width:62px;height:21px;display:block}
.menu-x{width:44px;height:44px;margin-right:-10px;display:flex;align-items:center;justify-content:center}
.menu-nav{display:flex;flex-direction:column;padding-top:clamp(28px,6vh,56px);counter-reset:mi}
.menu-nav a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:18px 0 16px;border-bottom:1px solid var(--rule-night);font-size:clamp(34px,9.6vw,48px);line-height:1.05;letter-spacing:-.035em;font-weight:430;color:var(--on-night);text-decoration:none}
.menu-nav a::before{counter-increment:mi;content:counter(mi,decimal-leading-zero);content:counter(mi,decimal-leading-zero) / "";order:-1;min-width:2em;font-family:var(--serif);font-style:italic;font-size:18px;letter-spacing:0;color:var(--on-night-2)}
.menu-nav a span{margin-left:auto;font-size:20px;color:var(--dot)}
.menu-cta{margin-top:32px}
.menu-foot{margin-top:auto;padding-top:40px;display:flex;flex-direction:column;gap:8px;font-size:15px;color:var(--on-night-2)}
.menu-foot a{color:var(--on-night);text-decoration:none}
.menu-foot span{padding-top:12px;font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--dot)}

/* ==========================================================================
   MOBILE CANVAS (below 1100px)
   ========================================================================== */
[data-canvas=mobile]{--gut:clamp(22px,6vw,56px);--cg:16px}
[data-canvas=mobile] .h1{font-size:clamp(44px,12.4vw,84px);line-height:.98;letter-spacing:-.045em}
[data-canvas=mobile] .h2{font-size:clamp(34px,9.4vw,60px);line-height:1.02;letter-spacing:-.036em}
[data-canvas=mobile] .h3{font-size:clamp(24px,6.4vw,34px)}
[data-canvas=mobile] .lead{font-size:clamp(17px,4.6vw,21px)}
[data-canvas=mobile] .sec{padding:clamp(72px,18vw,112px) 0}
[data-canvas=mobile] .sec-t0{padding-top:0}
[data-canvas=mobile] .sh{display:flex;flex-direction:column;gap:22px;padding-top:20px}
[data-canvas=mobile] .sh-label{padding-top:0}
[data-canvas=mobile] .sh-aside{margin-top:0}
[data-canvas=mobile] p,[data-canvas=mobile] .lead,[data-canvas=mobile] .body{max-width:660px}

/* home, mobile */
.mhero{display:flex;flex-direction:column;justify-content:space-between;gap:40px;min-height:clamp(560px,calc(100svh - 64px),780px);padding-top:clamp(28px,6vh,48px);padding-bottom:clamp(32px,6vh,48px)}
.mhero .h1 .ind{padding-left:.9em}
.mhero-copy{display:flex;flex-direction:column;gap:26px}
.mcta{display:flex;flex-direction:column;align-items:stretch;gap:6px;max-width:440px}
.mcta .lnk{align-self:center;margin-top:6px}
.macc{margin-top:40px;border-bottom:1px solid var(--rule)}
.macc-item{border-top:1px solid var(--rule)}
.macc-btn{appearance:none;width:100%;margin:0;padding:20px 0;display:grid;grid-template-columns:36px minmax(0,1fr) 24px;align-items:center;column-gap:10px;border:0;background:none;text-align:left;cursor:pointer;min-height:72px}
.macc-btn .num{font-size:18px}
.macc-name{display:flex;flex-direction:column;gap:3px}
.macc-name>span:first-child{font-size:clamp(26px,7vw,34px);line-height:1.05;letter-spacing:-.03em;font-weight:430;color:var(--ink)}
.macc-name>span+span{font-size:11.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.macc-btn svg{stroke:var(--ink);transition:transform .35s var(--ease)}
.macc-item.is-on .macc-btn svg{transform:rotate(45deg)}
.macc-item.is-on .num{color:var(--gold-ink)}
.macc-body{padding:0 0 24px 46px;display:flex;flex-direction:column;gap:16px;animation:grf-in .5s var(--ease) both}
.macc-body p{font-size:16px;line-height:1.55;color:var(--ink-2)}
.macc-svc{display:flex;flex-direction:column}
.macc-svc>div{display:flex;flex-direction:column;gap:3px;padding:12px 0;border-top:1px solid var(--rule)}
.macc-svc>div>div:first-child{font-size:15px;font-weight:500;color:var(--ink)}
.macc-svc>div>div+div{font-size:14px;line-height:1.5;color:var(--ink-3)}
.mnote{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-top:32px}
.mnote p{font-size:15px;line-height:1.55;color:var(--ink-2)}
.mtabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:36px;border-top:1px solid var(--rule-2)}
.mtab{appearance:none;position:relative;margin:0;padding:16px 8px 16px 0;min-height:76px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:6px;border:0;background:none;text-align:left;cursor:pointer}
.mtab::before{content:"";position:absolute;left:0;right:8px;top:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform .5s var(--ease)}
.mtab.is-on::before{transform:scaleX(1)}
.mtab>span:first-child{font-size:15.5px;font-weight:500;line-height:1.2;color:var(--ink-3)}
.mtab.is-on>span:first-child{color:var(--ink)}
.mtab>span+span{font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.mpanel{display:flex;flex-direction:column;gap:12px;padding:26px 0 28px;border-top:1px solid var(--rule)}
.mpanel .ww-desc{font-size:clamp(22px,6vw,30px);max-width:none}
.mpanel .ww-terms{font-size:14px}
.mpanel .eyebrow+div{margin-top:-2px}
.mpanel .eyebrow:not(:first-child){margin-top:14px;padding-top:18px;border-top:1px solid var(--rule)}
[data-canvas=mobile] .statement{padding:clamp(104px,26vw,160px) 0}
[data-canvas=mobile] .st-text{font-size:clamp(46px,12.6vw,88px);line-height:1}
[data-canvas=mobile] .st-text .it{padding-left:0}
[data-canvas=mobile] .cmp{grid-template-columns:minmax(0,1fr)}
[data-canvas=mobile] .cmp-cell,[data-canvas=mobile] .cmp-cell:nth-child(2n){padding:32px 0 36px;border-left:0}
[data-canvas=mobile] .cmp-title{font-size:clamp(26px,7vw,36px)}
[data-canvas=mobile] .cmp-copy{font-size:16px}

/* contact, mobile */
[data-canvas=mobile] .ct{display:flex;flex-direction:column;gap:40px}
[data-canvas=mobile] .ct-title{font-size:clamp(58px,17vw,110px)}
[data-canvas=mobile] .ct-intro .lead{font-size:17px;line-height:1.6}
[data-canvas=mobile] .ct-form{padding:24px 20px 26px;gap:26px}
[data-canvas=mobile] .f-grid{grid-template-columns:minmax(0,1fr);gap:22px}
[data-canvas=mobile] [data-pills]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
[data-canvas=mobile] [data-pill] span{padding:10px 8px;font-size:14px}
[data-canvas=mobile] .f-send{flex-direction:column-reverse;align-items:stretch;gap:14px}

/* inner pages, mobile */
[data-canvas=mobile] .phero-in{display:flex;flex-direction:column;gap:26px;padding-top:clamp(40px,10vw,72px);padding-bottom:clamp(56px,14vw,88px)}
[data-canvas=mobile] .phero-in .h1{font-size:clamp(40px,10.6vw,72px)}
[data-canvas=mobile] .jump-in{height:56px;padding:0 var(--gut);overflow-x:auto;scrollbar-width:none;gap:26px}
[data-canvas=mobile] .jump-in::-webkit-scrollbar{display:none}
[data-canvas=mobile] .chap{padding:clamp(72px,18vw,104px) 0 clamp(56px,14vw,80px)}
[data-canvas=mobile] .chap-head{display:flex;flex-direction:column;gap:14px}
.chap-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
[data-canvas=mobile] .chap-num{font-size:clamp(88px,26vw,150px)}
[data-canvas=mobile] .chap-tag{margin-bottom:10px}
[data-canvas=mobile] .chap-name{font-size:clamp(50px,14vw,96px)}
[data-canvas=mobile] .chap-copy{margin-top:14px;gap:20px}
[data-canvas=mobile] .chap-svc{grid-template-columns:minmax(0,1fr);row-gap:40px;margin-top:48px}
[data-canvas=mobile] .vs{grid-template-columns:minmax(0,1fr);margin-top:44px}
[data-canvas=mobile] .vs-col,[data-canvas=mobile] .vs-one{padding:30px 0 34px;border-left:0}
[data-canvas=mobile] .vs-one{border-top:1px solid var(--rule-night)}
[data-canvas=mobile] .vs-big{font-size:clamp(25px,6.8vw,36px)}
[data-canvas=mobile] .steps{grid-template-columns:minmax(0,1fr);row-gap:34px;margin-top:44px;padding-left:34px}
[data-canvas=mobile] .step{padding-top:0}
[data-canvas=mobile] .step::before{left:-28px;right:auto;top:8px;bottom:-40px;width:1px;height:auto}
[data-canvas=mobile] .step::after{left:-28px;top:8px;width:1px;height:0;transition:height 1.1s linear}
[data-canvas=mobile] .step.is-done::after{width:1px;height:calc(100% + 34px)}
[data-canvas=mobile] .step:last-child::before{bottom:auto;height:0}
[data-canvas=mobile] .step-mark{left:-34px;top:2px}
[data-canvas=mobile] .step-name{font-size:clamp(26px,7vw,34px)}
[data-canvas=mobile] .qa{display:flex;flex-direction:column;gap:36px}
[data-canvas=mobile] .qa-intro{position:static}
[data-canvas=mobile] .qa-q{font-size:18px;padding:20px 0;min-height:72px}
[data-canvas=mobile] .qa-a{padding:0 0 24px;font-size:16px}
[data-canvas=mobile] .feat{padding:72px 0}
[data-canvas=mobile] .feat-in{display:flex;flex-direction:column;gap:48px}
[data-canvas=mobile] .feat-main{gap:22px}
[data-canvas=mobile] .feat-tags{gap:8px 14px;font-size:11px}
[data-canvas=mobile] .feat-tags>span+span{padding-left:14px}
[data-canvas=mobile] .feat-tags>span:last-child{padding-left:0;border-left:0;flex-basis:100%}
[data-canvas=mobile] .feat-h{font-size:clamp(36px,9.6vw,60px)}
[data-canvas=mobile] .feat-side{gap:40px}
[data-canvas=mobile] .fst-n{font-size:clamp(60px,17vw,96px)}
[data-canvas=mobile] .feat-q blockquote{font-size:21px}
[data-canvas=mobile] .filters{margin-top:6px}
[data-canvas=mobile] .cases,[data-canvas=mobile] .quotes{grid-template-columns:minmax(0,1fr);row-gap:48px;margin-top:44px}
[data-canvas=mobile] .case{min-height:0}
[data-canvas=mobile] .case-client{margin-top:22px}
[data-canvas=mobile] .case-head{font-size:clamp(28px,7.6vw,38px)}
[data-canvas=mobile] .clients{display:flex;flex-direction:column;gap:36px}
[data-canvas=mobile] .clients-intro{position:static}
[data-canvas=mobile] .crow{grid-template-columns:minmax(0,1fr) auto;row-gap:4px;padding:16px 0}
[data-canvas=mobile] .crow-s{grid-column:1;grid-row:2}
[data-canvas=mobile] .crow-m{grid-column:2;grid-row:1}
[data-canvas=mobile] .proof{display:flex;flex-direction:column;gap:36px;padding-top:44px}
[data-canvas=mobile] .proof-st{font-size:clamp(36px,9.6vw,60px)}
[data-canvas=mobile] .proof-cols{grid-template-columns:minmax(0,1fr);row-gap:26px}
[data-canvas=mobile] .gname{height:clamp(150px,40vw,260px);margin-top:44px}
[data-canvas=mobile] .gname-word{font-size:clamp(64px,19vw,150px)}
[data-canvas=mobile] .tri,[data-canvas=mobile] .traits,[data-canvas=mobile] .rise{grid-template-columns:minmax(0,1fr);row-gap:32px;margin-top:44px}
[data-canvas=mobile] .rise{row-gap:12px}
[data-canvas=mobile] .rise-col{padding:22px 22px 26px}
[data-canvas=mobile] .believe{display:flex;flex-direction:column;align-items:flex-start;gap:36px}
[data-canvas=mobile] .believe-tag{justify-self:auto;width:180px}
[data-canvas=mobile] .founder{display:flex;flex-direction:column;gap:30px}
[data-canvas=mobile] .founder-l{position:static}
[data-canvas=mobile] .figs{grid-template-columns:minmax(0,1fr);row-gap:0}
[data-canvas=mobile] .figs>div{flex-direction:row;align-items:baseline;gap:18px;padding:14px 0;border-bottom:1px solid var(--rule)}
[data-canvas=mobile] .figs-n{min-width:2.4em;font-size:48px}
[data-canvas=mobile] .team{grid-template-columns:minmax(0,1fr);row-gap:48px;margin-top:44px}
[data-canvas=mobile] .tm-photo{aspect-ratio:1/1}
[data-canvas=mobile] .cmeta{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px;margin-top:12px}
[data-canvas=mobile] .cstats{padding:64px 0}
[data-canvas=mobile] .cstats-in{grid-template-columns:minmax(0,1fr);row-gap:32px}
[data-canvas=mobile] .cst-n{font-size:clamp(64px,19vw,110px)}
[data-canvas=mobile] .cst-n.is-long{font-size:clamp(40px,11vw,64px)}
[data-canvas=mobile] .cblock{display:flex;flex-direction:column;gap:22px;padding:44px 0}
[data-canvas=mobile] .cblock .sh-label{padding-top:0}
[data-canvas=mobile] .cblock-main .h3{font-size:clamp(28px,7.6vw,40px)}
[data-canvas=mobile] .cpara{font-size:18px}
[data-canvas=mobile] .cstep{grid-template-columns:44px minmax(0,1fr);column-gap:12px;padding:24px 0}
[data-canvas=mobile] .cstep .num{font-size:24px}
[data-canvas=mobile] .cstep-l{padding-top:4px}
[data-canvas=mobile] .cquote{display:flex;flex-direction:column;gap:22px;padding-top:48px}
[data-canvas=mobile] .cquote-m{font-size:110px;height:60px}
[data-canvas=mobile] .cquote blockquote{font-size:clamp(25px,6.8vw,38px)}
[data-canvas=mobile] .cnext{padding:64px 0}
[data-canvas=mobile] .cnext-in{display:flex;flex-direction:column;gap:40px}
[data-canvas=mobile] .cnext-head{font-size:clamp(32px,8.6vw,48px)}
[data-canvas=mobile] .cnext-cta{padding:26px 22px}
[data-canvas=mobile] .journal-h1{font-size:clamp(64px,19vw,140px)}
[data-canvas=mobile] .cover{display:flex;flex-direction:column;gap:32px;padding:32px 0 36px}
[data-canvas=mobile] .cover-h{font-size:clamp(34px,9vw,56px)}
[data-canvas=mobile] .cover-side{padding:26px 22px}
[data-canvas=mobile] .cover-q{font-size:clamp(25px,6.6vw,34px)}
[data-canvas=mobile] .cover-by{flex-wrap:wrap}
[data-canvas=mobile] .posts{margin-top:40px}
[data-canvas=mobile] .post{display:flex;flex-direction:column;gap:18px;padding:28px 0 30px}
[data-canvas=mobile] .post-meta{flex-direction:row;gap:14px;padding-top:0}
[data-canvas=mobile] .post-title{font-size:clamp(26px,7vw,36px)}
[data-canvas=mobile] .post-by{width:100%;padding-top:0}
[data-canvas=mobile] .lines{grid-template-columns:minmax(0,1fr);row-gap:32px;margin-top:40px}
[data-canvas=mobile] .line blockquote{font-size:clamp(25px,6.8vw,34px)}
[data-canvas=mobile] .news{padding:80px 0}
[data-canvas=mobile] .news-in{display:flex;flex-direction:column;align-items:stretch;gap:36px}
[data-canvas=mobile] .news-h{font-size:clamp(40px,11vw,64px)}
[data-canvas=mobile] .art-head{padding-top:40px;padding-bottom:36px;gap:20px}
[data-canvas=mobile] .art-h1{font-size:clamp(38px,10.4vw,64px)}
[data-canvas=mobile] .art-sub{font-size:clamp(23px,6.2vw,30px)}
[data-canvas=mobile] .art-by{min-width:0;width:100%}
[data-canvas=mobile] .art-col{margin:0 auto;gap:22px;padding-top:36px}
[data-canvas=mobile] .art-p{font-size:18.5px;line-height:1.7}
[data-canvas=mobile] .art-h2{font-size:clamp(25px,6.8vw,32px);margin-top:20px}
[data-canvas=mobile] .art-big{font-size:clamp(27px,7.4vw,36px)}
[data-canvas=mobile] .art-q{margin:18px 0;font-size:clamp(30px,8.4vw,44px)}
[data-canvas=mobile] .art-sign{flex-wrap:wrap}
[data-canvas=mobile] .art-li{margin-left:0;flex-basis:auto}
[data-canvas=mobile] .more-head{flex-direction:column;align-items:flex-start;gap:16px}
[data-canvas=mobile] .more-grid{grid-template-columns:minmax(0,1fr);margin-top:36px}
[data-canvas=mobile] .doc{display:flex;flex-direction:column;gap:36px}
[data-canvas=mobile] .toc{position:static;width:100%}
[data-canvas=mobile] .doc-main{gap:56px}
[data-canvas=mobile] .fgroup-h{font-size:clamp(32px,8.6vw,44px)}
[data-canvas=mobile] .fq-s{font-size:18px;min-height:72px;padding:20px 0}
[data-canvas=mobile] .fq-a{padding:0 0 24px}
[data-canvas=mobile] .fq-a p{font-size:16.5px}
[data-canvas=mobile] .ask{padding:28px 22px}
[data-canvas=mobile] .psec{grid-template-columns:minmax(0,1fr);row-gap:12px;padding:26px 0 28px}
[data-canvas=mobile] .ty-in{display:flex;flex-direction:column;align-items:stretch;gap:48px;min-height:0;padding-top:48px;padding-bottom:64px}
[data-canvas=mobile] .ty-main{gap:22px}
[data-canvas=mobile] .ty-h1{font-size:clamp(44px,12vw,72px)}
[data-canvas=mobile] .nf-in{display:flex;flex-direction:column;align-items:flex-start;gap:28px;min-height:calc(100svh - 64px);justify-content:center;padding-top:40px;padding-bottom:56px}
[data-canvas=mobile] .nf-num{font-size:clamp(150px,44vw,280px)}
@media (min-width:720px){
  [data-canvas=mobile] .lines,[data-canvas=mobile] .more-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
  [data-canvas=mobile] .cstats-in{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}
  [data-canvas=mobile] .cmeta{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:20px}
  [data-canvas=mobile] .team{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
  [data-canvas=mobile] .tri,[data-canvas=mobile] .traits{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}
  [data-canvas=mobile] .chap-svc{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
  [data-canvas=mobile] .cases,[data-canvas=mobile] .quotes{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
  [data-canvas=mobile] .proof-cols{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}
}

/* footer, mobile */
[data-canvas=mobile] .foot{padding-top:64px}
[data-canvas=mobile] .foot-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px;row-gap:44px;padding-bottom:48px}
[data-canvas=mobile] .foot-brand{grid-column:1/-1}
[data-canvas=mobile] .foot-links,[data-canvas=mobile] .foot-contact{grid-column:auto}
[data-canvas=mobile] .foot-legal{flex-direction:column;align-items:flex-start;gap:12px;font-size:11px;letter-spacing:.12em}
[data-canvas=mobile] .foot-legal-l{gap:10px 20px}

@media (min-width:720px){
  [data-canvas=mobile] .cmp{grid-template-columns:repeat(2,minmax(0,1fr))}
  [data-canvas=mobile] .cmp-cell:nth-child(2n){padding-left:28px;border-left:1px solid var(--rule)}
  [data-canvas=mobile] .cmp-cell:nth-child(2n+1){padding-right:28px}
  [data-canvas=mobile] .foot-top{grid-template-columns:2fr 1fr 1fr}
  [data-canvas=mobile] .foot-brand{grid-column:auto}
}

/* ==========================================================================
   DESKTOP CANVAS, narrower than its design (1100-1360px) and the no-JS fallback
   ========================================================================== */
@media (max-width:1279.98px){
  [data-canvas=desktop] .hero .sys{grid-column:7/13;grid-row:3}
  [data-canvas=desktop] .hero-h1{grid-column:1/-1}
  [data-canvas=desktop] .plate{padding:30px 30px}
}
/* The pre-rendered desktop page is what no-JS visitors get at any width: let it stack. */
@media (max-width:1099.98px){
  .js #prerender{display:none}
  [data-canvas=desktop] .sh,[data-canvas=desktop] .hero-in,[data-canvas=desktop] .lx,[data-canvas=desktop] .ww-panel,[data-canvas=desktop] .ct,[data-canvas=desktop] .foot-top{display:flex;flex-direction:column;gap:28px}
  [data-canvas=desktop] .mast-in{height:auto;flex-wrap:wrap;gap:12px;padding-top:16px;padding-bottom:16px}
  [data-canvas=desktop] .mast-nav{flex-wrap:wrap;gap:8px 20px}
  [data-canvas=desktop] .cmp,[data-canvas=desktop] .ww-tabs,[data-canvas=desktop] .q4,[data-canvas=desktop] .f-grid{grid-template-columns:minmax(0,1fr)}
  [data-canvas=desktop] .demo-b,[data-canvas=desktop] .demo-p,[data-canvas=desktop] .svc-row{grid-template-columns:minmax(0,1fr)}
  [data-canvas=desktop] .plate{height:auto}
  [data-canvas=desktop] .flow,[data-canvas=desktop] .lx-note,[data-canvas=desktop] .f-send{flex-direction:column;align-items:flex-start}
  [data-canvas=desktop] .cmp-cell:nth-child(2n){padding-left:0;border-left:0}
}

/* ==========================================================================
   COOKIE CONSENT (consent.js)
   ========================================================================== */
.grf-cc{position:fixed;z-index:2147483000;left:24px;bottom:24px;box-sizing:border-box;width:min(420px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto;
  padding:26px 26px 22px;border-radius:var(--r);background:var(--night);color:var(--on-night-2);box-shadow:0 24px 60px -20px rgba(0,0,0,.45);
  font:15px/1.55 var(--sans);border-top:2px solid var(--dot)}
@media (prefers-reduced-motion:no-preference){.grf-cc{animation:grf-cc-in .7s var(--ease) both}@keyframes grf-cc-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}}
.grf-cc__title{margin:0 0 8px;font-family:var(--serif);font-size:28px;line-height:1.05;font-weight:400;color:var(--on-night)}
.grf-cc__text{margin:0;font-size:14.5px}
.grf-cc__text a{color:var(--on-night);font-weight:500;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.grf-cc__choices{display:flex;flex-direction:column;gap:12px;margin-top:18px;padding-top:16px;border-top:1px solid var(--rule-night)}
.grf-cc__choices[hidden],.grf-cc [hidden]{display:none}
.grf-cc__choice{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.grf-cc__choice input{width:18px;height:18px;margin:2px 0 0;flex-shrink:0;accent-color:var(--dot)}
.grf-cc__choice input:disabled{opacity:.6}
.grf-cc__choice span{display:flex;flex-direction:column;font-size:14px}
.grf-cc__choice strong{font-size:15px;font-weight:500;color:var(--on-night)}
.grf-cc__actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:20px}
/* Reject all and Accept all are equal choices (same weight, same style). */
.grf-cc__btn{flex:1 1 0;min-width:120px;min-height:46px;padding:12px 18px;border:0;border-radius:999px;background:transparent;color:var(--on-night);
  box-shadow:inset 0 0 0 1px rgba(243,239,231,.5);font:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:background-color .25s,color .25s}
.grf-cc__btn:hover{background:var(--on-night);color:var(--ink)}
.grf-cc__btn--save{flex-basis:100%;background:var(--yellow);color:var(--ink);box-shadow:none}
.grf-cc__btn--save:hover{background:var(--yellow-2);color:var(--ink)}
.grf-cc__link{min-height:44px;padding:0 4px;border:0;background:none;color:var(--on-night);font:inherit;font-size:15px;font-weight:500;cursor:pointer;
  text-decoration:underline;text-decoration-color:rgba(243,239,231,.5);text-underline-offset:4px}
.grf-cc__btn:focus-visible,.grf-cc__link:focus-visible,.grf-cc__choice input:focus-visible,.grf-cc__text a:focus-visible{outline:2px solid var(--on-night);outline-offset:3px}
@media (max-width:600px){.grf-cc{left:12px;right:12px;bottom:12px;width:auto;padding:22px 20px 18px}}

/* ==========================================================================
   SHARED SMALL PIECES
   ========================================================================== */
/* LinkedIn links next to quoted clients: present, but quiet until pointed at. */
a[data-li]{opacity:.6;border-radius:6px;transition:opacity .2s}
a[data-li]:hover,a[data-li]:focus-visible{opacity:1}
/* FAQ: native <details> so every answer is in the HTML for search engines. */
details[data-faq]>summary::-webkit-details-marker{display:none}
details[data-faq]>summary{list-style:none}
[data-faq-sign]::before{content:"+"}
details[data-faq][open] [data-faq-sign]::before{content:"\2212"}

/* Hero photo (after Vladimir's mockups): the sunlit concrete fills the right of the homepage's
   first section and meets the paper on a diagonal. On desktop the live system card floats over it. */
.hero,.mhero{position:relative;isolation:isolate}
.hero{overflow:hidden}
.hero-photo{position:absolute;z-index:-1;top:0;bottom:0;right:0;pointer-events:none;
  background:#E7DFD2 url(/assets/hero/wall.jpg) 100% 50%/cover no-repeat}
/* Desktop: the edge runs from 66% at the top to 59.5% at the bottom, clear of the headline. */
.hero .hero-photo{left:59.5%;clip-path:polygon(16% 0,100% 0,100% 100%,0 100%)}
@media (max-width:1279.98px){.hero .hero-photo{left:61.5%;clip-path:polygon(17% 0,100% 0,100% 100%,0 100%)}}
.hero .sys{background:rgba(255,253,249,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
/* Phone: text keeps the left, the photo takes the right (78% to 62%), framed on the lit concrete. */
.mhero .hero-photo{left:62%;clip-path:polygon(42% 0,100% 0,100% 100%,0 100%);background-position:66% 50%}
.mhero>.eyebrow{max-width:72%}
.mhero>.h1{font-size:clamp(34px,10.4vw,44px)!important;max-width:76%}
.mhero .lead{font-size:16px!important;max-width:60%}
.mhero .mcta{align-items:flex-start}
.mhero .mcta .btn{width:auto;align-self:flex-start;font-size:15px;padding-left:22px;padding-right:22px}
.mhero .mcta .lnk{align-self:flex-start;text-align:left}

/* No decorative numbering: ordinals (01, 02…) on sections, layers, steps, chapters and the
   menu read as template filler, so they are gone. Real figures are untouched. */
.num,.chap-num{display:none!important}
.sh-label::before,.menu-nav a::before{content:none!important;display:none!important}
/* Layer rows without their number: name and tag share the row; copy aligns with the name. */
.lx-head{grid-template-columns:minmax(0,1fr) auto}
.lx-copy,.lx-bar{margin-left:0}
/* Grids that kept a column for the number now start with the content. */
.macc-btn{grid-template-columns:minmax(0,1fr) 24px}
.macc-body{padding-left:0}
.cstep{grid-template-columns:minmax(0,1fr) auto}
[data-canvas=mobile] .cstep{grid-template-columns:minmax(0,1fr)}
.ty-step{grid-template-columns:minmax(0,1fr)}