/* Generated by import_wireframe.py from ozette-website-wireframe-v22.html — do not edit; see site-extra.css */
:root{color-scheme: light;
  --font: "Roboto", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --paper:#ffffff;      
  --mist:#f0f4f7;       
  --panel:#ffffff;      
  --ink:#0b1117;        
  --ink-2:#3f4a58;      
  --ink-3:#5d6a7a;      
  --line:#e3e8ee;       
  --line-2:#cdd5de;     
  --on-accent:#ffffff;  
  --video-bg:#0b1117;
  --shadow:0 1px 2px rgba(11,17,23,.05), 0 14px 34px -14px rgba(11,17,23,.24);
  --shadow-s:0 1px 2px rgba(11,17,23,.06), 0 4px 12px -6px rgba(11,17,23,.16);

  
  --btn2-bg:#dfe5eb; --btn2-ink:#4b5768; --btn2-hover:#d2dae3;
  
  --platform-head:#0b1117; --platform-crumb:#f0f4f7; --platform-btn:#dfe5eb; --platform-btn-ink:#5d6a7a; --platform-avatar:#a74072;

  
  --brand:#0b1117;   --brand-strong:#27303b;   --brand-tint:#f0f4f7;
  --resolve:#0b1117; --resolve-strong:#27303b; --resolve-tint:#f0f4f7;

  
  --d1:#4c6a92; --d2:#a74072; --d3:#0f8b80; --d4:#c27c0e; --d5:#b4532a; --d6:#5b8c3a;
  --gold:#b8860b; --green:#2e8b57; --burgundy:#8a1c3c;
  --tl-green:#2f9e52; --tl-yellow:#e6b400; --tl-red:#d63b3b;
  --lab:#09478b;     --lab-strong:#07376c;     --lab-tint:#e6edf3;
  --consult:#a65a00; --consult-strong:#834600; --consult-tint:#fbefdf;

  
  --note-bg:#fff4b5; --note-ink:#4b3e00; --note-line:#e6cf5e;

  --max:1200px;
  --gutter:28px;}
@media (prefers-color-scheme: dark){
:root:not([data-theme="light"]){color-scheme: dark;
    --paper:#0b1117; --mist:#111822; --panel:#151c26;
    --ink:#f0f4f7; --ink-2:#b9c3ce; --ink-3:#8c98a6;
    --line:#222b37; --line-2:#344050;
    --on-accent:#0b1117; --video-bg:#05080c;
    --shadow:0 1px 2px rgba(0,0,0,.35), 0 18px 40px -16px rgba(0,0,0,.7);
    --shadow-s:0 1px 2px rgba(0,0,0,.3), 0 6px 16px -8px rgba(0,0,0,.6);
    --btn2-bg:#222b37; --btn2-ink:#d5dde6; --btn2-hover:#2c3746;
    --platform-head:#05080c; --platform-crumb:#18202b; --platform-btn:#263040; --platform-btn-ink:#c3ccd6; --platform-avatar:#c25a8c;
    --brand:#e9eef3;   --brand-strong:#ffffff;   --brand-tint:rgba(240,244,247,.08);
    --resolve:#e9eef3; --resolve-strong:#ffffff; --resolve-tint:rgba(240,244,247,.08);
    --d1:#7f9cc4; --d2:#d0709f; --d3:#3fbcae; --d4:#e0a43a; --d5:#e07a50; --d6:#8fbf63;
    --gold:#e0b23c; --green:#4fbf80; --burgundy:#d2557a;
    --tl-green:#4cc77a; --tl-yellow:#f2c94c; --tl-red:#f06a6a;
    --lab:#84a3c5;     --lab-strong:#b5c8dc;     --lab-tint:rgba(132,163,197,.14);
    --consult:#f2a64e; --consult-strong:#f8c07c; --consult-tint:rgba(242,166,78,.14);
    --note-bg:#3a3209; --note-ink:#ffe892; --note-line:#6e5f14;}
}
:root[data-theme="dark"]{color-scheme: dark;
  --paper:#0b1117; --mist:#111822; --panel:#151c26;
    --ink:#f0f4f7; --ink-2:#b9c3ce; --ink-3:#8c98a6;
    --line:#222b37; --line-2:#344050;
    --on-accent:#0b1117; --video-bg:#05080c;
    --shadow:0 1px 2px rgba(0,0,0,.35), 0 18px 40px -16px rgba(0,0,0,.7);
    --shadow-s:0 1px 2px rgba(0,0,0,.3), 0 6px 16px -8px rgba(0,0,0,.6);
    --btn2-bg:#222b37; --btn2-ink:#d5dde6; --btn2-hover:#2c3746;
    --platform-head:#05080c; --platform-crumb:#18202b; --platform-btn:#263040; --platform-btn-ink:#c3ccd6; --platform-avatar:#c25a8c;
    --brand:#e9eef3;   --brand-strong:#ffffff;   --brand-tint:rgba(240,244,247,.08);
    --resolve:#e9eef3; --resolve-strong:#ffffff; --resolve-tint:rgba(240,244,247,.08);
    --d1:#7f9cc4; --d2:#d0709f; --d3:#3fbcae; --d4:#e0a43a; --d5:#e07a50; --d6:#8fbf63;
    --gold:#e0b23c; --green:#4fbf80; --burgundy:#d2557a;
    --tl-green:#4cc77a; --tl-yellow:#f2c94c; --tl-red:#f06a6a;
  --lab:#84a3c5;     --lab-strong:#b5c8dc;     --lab-tint:rgba(132,163,197,.14);
  --consult:#f2a64e; --consult-strong:#f8c07c; --consult-tint:rgba(242,166,78,.14);
  --note-bg:#3a3209; --note-ink:#ffe892; --note-line:#6e5f14;}
body{--accent:var(--brand); --accent-strong:var(--brand-strong); --accent-tint:var(--brand-tint);}
body[data-page="resolve"]{--accent:var(--resolve); --accent-strong:var(--resolve-strong); --accent-tint:var(--resolve-tint);}
body[data-page="lab"]{--accent:var(--lab); --accent-strong:var(--lab-strong); --accent-tint:var(--lab-tint);}
body[data-page="consulting"]{--accent:var(--consult); --accent-strong:var(--consult-strong); --accent-tint:var(--consult-tint);}
body.mono{--resolve:var(--brand); --resolve-strong:var(--brand-strong); --resolve-tint:var(--brand-tint);
  --lab:var(--brand); --lab-strong:var(--brand-strong); --lab-tint:var(--brand-tint);
  --consult:var(--brand); --consult-strong:var(--brand-strong); --consult-tint:var(--brand-tint);}
.p-resolve{--pc:var(--resolve); --pc-strong:var(--resolve-strong); --pc-tint:var(--resolve-tint);}
.p-lab{--pc:var(--lab); --pc-strong:var(--lab-strong); --pc-tint:var(--lab-tint);}
.p-consult{--pc:var(--consult); --pc-strong:var(--consult-strong); --pc-tint:var(--consult-tint);}
*, *::before, *::after{box-sizing:border-box;}
[hidden]{display:none !important;}
html{scroll-padding-top:96px; -webkit-text-size-adjust:100%;}
body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--font); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; font-kerning:normal;}
body.lock{overflow:hidden;}
img, svg, video, iframe{display:block; max-width:100%;}
a{color:inherit; text-decoration-thickness:1px; text-underline-offset:3px;}
button{font:inherit; color:inherit;}
h1, h2, h3, h4{margin:0; color:var(--ink); font-weight:600;}
h1{font-size:clamp(2.5rem, 1.55rem + 3.4vw, 4.4rem); line-height:1.03; letter-spacing:-.034em;}
h2{font-size:clamp(1.95rem, 1.45rem + 1.7vw, 2.9rem); line-height:1.08; letter-spacing:-.027em;}
h3{font-size:1.22rem; line-height:1.3; letter-spacing:-.012em;}
p{margin:0;}
ul, ol{margin:0; padding:0;}
:focus-visible{outline:2.5px solid var(--accent); outline-offset:3px; border-radius:6px;}
[tabindex="-1"]:focus{outline:none;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 var(--gutter);}
.band{padding:clamp(72px, 9vw, 112px) 0;}
.band.mist{background:var(--mist);}
.band.ruled{border-top:1px solid var(--line);}
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:.95rem; font-weight:600; color:var(--accent); margin:0 0 16px;}
.lede{font-size:1.18rem; line-height:1.6; color:var(--ink-2); max-width:58ch;}
.body-copy{color:var(--ink-2); max-width:64ch;}
.body-copy + .body-copy{margin-top:16px;}
.sec-head{max-width:780px; margin-bottom:clamp(36px, 4vw, 52px);}
.sec-head h2 + p{margin-top:18px;}
.h-sub{font-size:clamp(1.45rem, 1.2rem + .9vw, 1.95rem); letter-spacing:-.02em; line-height:1.15;}
.nowrap{white-space:nowrap;}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
.skip{position:absolute; left:16px; top:-60px; z-index:100; background:var(--ink); color:var(--paper); padding:10px 14px; border-radius:8px; text-decoration:none; font-weight:600;}
.skip:focus{top:12px;}
.two-col{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px, 5vw, 80px); align-items:center;}
.panel-box{background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:clamp(20px, 3vw, 30px);}
@media (max-width:900px){
.two-col{grid-template-columns:minmax(0,1fr);}
}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:14px 22px; border-radius:999px; border:1.5px solid transparent; font-weight:600; font-size:1rem; line-height:1.1; text-decoration:none; cursor:pointer; white-space:nowrap; transition:background-color .15s ease, border-color .15s ease, color .15s ease;}
.btn-primary{background:var(--accent); color:var(--on-accent);}
.btn-primary:hover{background:var(--accent-strong);}
.btn-secondary{background:var(--btn2-bg); color:var(--btn2-ink); border-color:transparent;}
.btn-secondary:hover{background:var(--btn2-hover); color:var(--ink);}
.btn-xl{font-size:1.2rem; padding:21px 46px;}
.btn-s{padding:10px 17px; font-size:.94rem;}
.btn svg{width:18px; height:18px; flex:none;}
.btn-row{display:flex; flex-wrap:wrap; gap:12px; align-items:center;}
.site-header{position:sticky; top:0; z-index:40; background:var(--paper); background:color-mix(in srgb, var(--paper) 90%, transparent); -webkit-backdrop-filter:saturate(1.5) blur(14px); backdrop-filter:saturate(1.5) blur(14px); border-bottom:1px solid var(--line);}
.nav{display:flex; align-items:center; gap:16px; height:68px;}
.logo{display:inline-flex; align-items:center; font-size:1.4rem; font-weight:700; letter-spacing:-.04em; text-decoration:none; color:var(--ink);}
.nav-links{display:flex; align-items:center; gap:2px; margin-left:14px;}
.nav-link{display:inline-flex; align-items:center; gap:6px; padding:8px 11px; border-radius:9px; border:0; background:none; color:var(--ink-2); font-size:.95rem; font-weight:500; text-decoration:none; cursor:pointer; white-space:nowrap;}
.nav-link:hover, .dd.open > .nav-link{color:var(--ink); background:var(--mist);}
.nav-link[aria-current="page"], .dd.is-current > .nav-link{color:var(--ink); font-weight:600;}
.nav-link .chev{width:12px; height:12px; transition:transform .15s;}
.dd.open > .nav-link .chev{transform:rotate(180deg);}
.nav-actions{margin-left:auto; display:flex; align-items:center; gap:6px;}
.dd{position:relative;}
.dd-menu{position:absolute; top:calc(100% + 10px); left:-8px; min-width:300px; padding:8px; background:var(--panel); border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); display:none;}
.dd-menu.wide{min-width:340px;}
.dd.open .dd-menu{display:block;}
.dd-menu::before{content:""; position:absolute; left:0; right:0; top:-14px; height:14px;}
.dd-item{display:flex; gap:14px; align-items:flex-start; padding:11px 12px; border-radius:11px; text-decoration:none; color:var(--ink);}
.dd-item:hover, .dd-item:focus-visible{background:var(--mist);}
.dd-item[aria-current="page"]{background:var(--mist);}
.dd-item b{display:block; font-weight:600; font-size:.97rem; line-height:1.3;}
.dd-item small{display:block; color:var(--ink-3); font-size:.86rem; line-height:1.35; margin-top:2px;}
.dd-dot{flex:none; width:32px; height:32px; border-radius:9px; background:var(--pc-tint); color:var(--pc); display:grid; place-items:center;}
.dd-dot svg{width:18px; height:18px;}
.burger{display:none; margin-left:auto; width:44px; height:44px; border-radius:11px; border:1px solid var(--line); background:var(--panel); cursor:pointer; align-items:center; justify-content:center; color:var(--ink);}
.mobile-nav{display:none;}
@media (max-width:1180px){
.nav-links, .nav-actions{display:none;}
.burger{display:inline-flex;}
.mobile-nav.open{display:block; position:fixed; top:69px; left:0; right:0; bottom:0; background:var(--paper); overflow:auto; z-index:39; padding:8px var(--gutter) 96px;}
}
.m-group{padding:14px 0; border-bottom:1px solid var(--line);}
.m-group h2{font-size:.86rem; color:var(--ink-3); font-weight:600; margin-bottom:4px; letter-spacing:0;}
.m-link{display:block; padding:9px 0; text-decoration:none; font-weight:600; color:var(--ink);}
.m-link small{display:block; color:var(--ink-3); font-weight:400; font-size:.88rem;}
.m-actions{display:flex; gap:10px; padding-top:18px; flex-wrap:wrap;}
.crumbs{display:flex; gap:10px; font-size:.9rem; color:var(--ink-3); margin-bottom:28px;}
.p-hero{padding:clamp(40px, 5vw, 64px) 0 clamp(64px, 8vw, 104px);}
.p-hero.slim{padding-bottom:clamp(36px, 4vw, 56px);}
.p-hero-grid{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(32px, 5vw, 72px); align-items:center;}
.p-hero h1{font-size:clamp(2.3rem, 1.45rem + 2.5vw, 3.5rem); line-height:1.05; letter-spacing:-.03em; text-wrap:balance;}
.p-hero .lede{margin-top:22px;}
.p-hero .btn-row{margin-top:34px;}
@media (max-width:900px){
.p-hero-grid{grid-template-columns:minmax(0,1fr);}
}
.home-hero{position:relative; overflow:hidden; padding:clamp(40px, 5vw, 72px) 0 clamp(72px, 8vw, 108px);}
.home-hero h1{text-align:center; max-width:none; margin:0 auto; white-space:nowrap; font-size:min(4.2rem, calc((100vw - 64px) / 19.5)); letter-spacing:-.04em; line-height:1.04;}
@media (max-width:720px){
.home-hero h1{white-space:normal; text-wrap:balance; font-size:clamp(2.2rem, 9vw, 2.9rem);}
}
.stage{position:relative; max-width:960px; margin:clamp(28px, 3.5vw, 44px) auto 0;}
.video-wrap{position:relative;}
.spectra-bg{position:absolute; left:50%; bottom:-18px; width:min(1720px, 166%); max-width:none; height:auto; transform:translateX(-50%); z-index:0; pointer-events:none;}
.sp{stroke-width:2; stroke-linejoin:round;}
.sp-r{stroke:var(--resolve); fill:var(--resolve);}
.sp-l{stroke:var(--lab); fill:var(--lab);}
.sp-c{stroke:var(--consult); fill:var(--consult);}
.sp-n{stroke:var(--line-2); fill:var(--line-2);}
.sp-fill{fill-opacity:.07; stroke:none;}
.sp-line{fill:none; stroke-opacity:.55;}
.sp-tick{stroke:var(--line-2); stroke-width:1.2;}
.video{position:relative; z-index:1; aspect-ratio:16 / 9; border-radius:20px; overflow:hidden; background:var(--video-bg); box-shadow:var(--shadow);}
.video img, .video video, .video iframe{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border:0;}
.video video{object-fit:contain; background:#000;}
.video-facade{position:absolute; inset:0; width:100%; padding:0; border:0; background:none; cursor:pointer; display:block;}
.video-facade::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(5,8,18,0) 45%, rgba(5,8,18,.55));}
.play{position:absolute; left:50%; top:50%; width:92px; height:92px; margin:-46px 0 0 -46px; border-radius:50%; background:var(--brand); color:#fff; display:grid; place-items:center; z-index:1; box-shadow:0 12px 34px -8px rgba(0,0,0,.55); transition:transform .15s ease;}
:root[data-theme="dark"] .play{color:#0b1117;}
@media (prefers-color-scheme: dark){
:root:not([data-theme="light"]) .play{color:#0b1117;}
}
.video-facade:hover .play{transform:scale(1.06);}
.play svg{width:32px; height:32px; margin-left:5px;}
.video-label{position:absolute; left:24px; bottom:20px; z-index:1; color:#fff; font-weight:600; font-size:1rem;}
.video-meta{position:relative; z-index:1; display:flex; justify-content:flex-end; margin-top:10px; font-size:.86rem; line-height:1.3;}
.video-meta a{color:var(--ink-3); text-decoration:none; display:inline-flex; gap:6px; align-items:center;}
.video-meta a:hover{color:var(--ink); text-decoration:underline;}
.video-meta svg{width:14px; height:14px;}
.hero-cta{position:relative; z-index:1; display:flex; justify-content:center; margin-top:18px;}
.callouts{position:relative; z-index:1; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px; max-width:1040px; margin:clamp(56px, 6vw, 84px) auto 0;}
.callout{display:flex; flex-direction:column; gap:18px; padding:26px 28px 24px; background:var(--panel); border:1px solid var(--line); border-top:3px solid var(--pc); border-radius:16px; text-decoration:none; color:var(--ink); transition:border-color .15s ease, box-shadow .15s ease;}
.callout:hover{border-color:var(--pc); box-shadow:var(--shadow-s);}
.callout-icon{width:44px; height:44px; border-radius:12px; display:grid; place-items:center; background:var(--pc-tint); color:var(--pc);}
.callout-icon svg{width:22px; height:22px;}
.callout-q{font-size:clamp(1.15rem, 1.05rem + .4vw, 1.34rem); line-height:1.38; letter-spacing:-.014em; font-weight:500;}
.callout-go{margin-top:auto; display:inline-flex; align-items:center; gap:8px; font-weight:600; color:var(--pc);}
.callout-go svg{width:18px; height:18px; transition:transform .15s ease;}
.callout:hover .callout-go svg{transform:translateX(3px);}
@media (max-width:760px){
.callouts{grid-template-columns:minmax(0,1fr);}
}
.about{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2.2fr); gap:40px; align-items:start;}
.about h2{font-size:1.2rem; letter-spacing:-.01em; padding-top:6px;}
.about-copy{font-size:clamp(1.12rem, 1rem + .4vw, 1.36rem); line-height:1.55; letter-spacing:-.01em; color:var(--ink); max-width:56ch;}
@media (max-width:760px){
.about{grid-template-columns:minmax(0,1fr); gap:14px;}
}
.p-hero h1.rot-h1{font-size:clamp(2.6rem, 1rem + 4.6vw, 5rem); line-height:1.02; letter-spacing:-.035em;}
.rot{display:flex; flex-direction:column;}
.rot-slot{display:grid; clip-path:inset(0 -100vw); padding-bottom:.04em;}
.rot-w{grid-area:1 / 1; font-weight:700; opacity:0; transform:translateY(.5em); transition:opacity .45s ease, transform .6s cubic-bezier(.2,.7,.2,1);}
.rot-w.is-on{opacity:1; transform:none;}
.rot-w.is-out{opacity:0; transform:translateY(-.5em);}
.rot-fixed{font-weight:400;}
.cartoon{margin:0; position:relative; background:var(--accent-tint); border-radius:26px; padding:clamp(10px, 2vw, 22px); cursor:pointer;}
.cartoon svg{width:100%; height:auto;}
.replay{position:absolute; top:14px; right:14px; display:inline-flex; align-items:center; gap:6px; padding:6px 11px; border-radius:999px; border:1px solid var(--line); background:var(--panel); font-size:.8rem; font-weight:600; color:var(--ink-2); cursor:pointer;}
.replay svg{width:14px; height:14px;}
.replay:hover{color:var(--ink); border-color:var(--line-2);}
.cz-card{fill:var(--panel); stroke:var(--ink); stroke-width:2;}
.cz-card.back{opacity:.7;}
.cz-axis{stroke:var(--ink-3); stroke-width:1.5; fill:none;}
.cz-dot{fill:var(--c, var(--accent));}
.cz-dot.n{opacity:.8;}
.cz-t{font:600 13px var(--font); fill:var(--ink);}
.cz-t2{font:600 12px var(--font); fill:var(--ink);}
.cz-cap{font:600 14px var(--font); fill:var(--ink-2);}
.cz-link{fill:none; stroke:var(--ink); stroke-width:2; stroke-dasharray:5 6; stroke-linecap:round;}
.cz-btn-base{fill:var(--ink-3); stroke:var(--ink); stroke-width:2;}
.cz-btn-top{fill:var(--accent); stroke:var(--ink); stroke-width:2;}
.cz-btn-t{font:700 25px var(--font); fill:var(--on-accent); letter-spacing:-.02em;}
.cz-ripple{fill:none; stroke:var(--accent); stroke-width:3; opacity:0; transform-box:fill-box; transform-origin:center;}
.cz-spark{stroke:var(--gold); stroke-width:2.5; stroke-linecap:round; fill:none;}
.cz-node{fill:var(--panel); fill:color-mix(in srgb, var(--c, var(--accent)) 24%, var(--panel)); stroke:var(--c, var(--accent)); stroke-width:1.5;}
.cz-node.root{fill:var(--mist); stroke:var(--ink-3);}
.cz-edge{stroke:var(--ink-3); stroke-width:1.5; fill:none;}
.cz-bar{fill:var(--ink-3); opacity:.4;}
.cz-bar.pos{fill:var(--accent); opacity:1;}
.cz-thr{stroke:var(--ink); stroke-width:1.5; stroke-dasharray:3 3;}
.cz-row{fill:var(--line-2);}
.cz-rowbar{fill:var(--c, var(--accent));}
.cz-cursor{transform-box:fill-box; transform-origin:0 0;}
.cz-cursor path{fill:#fff; stroke:#0b1117; stroke-width:2; stroke-linejoin:round;}
.cz-btn, .cz-out{transform-box:fill-box;}
.cartoon.is-playing .cz-cursor{animation:czCursor 1.5s cubic-bezier(.3,.7,.2,1) both;}
.cartoon.is-playing .cz-btn{animation:czPress 1.5s ease both;}
.cartoon.is-playing .cz-ripple{animation:czRipple .9s ease-out 1.02s both;}
.cartoon.is-playing .cz-spark{animation:czFade .3s ease 1.1s both;}
.cartoon.is-playing .cz-link.out{animation:czFade .35s ease 1.15s both;}
.cartoon.is-playing .cz-o1{animation:czPop .5s cubic-bezier(.2,.8,.2,1.15) 1.28s both;}
.cartoon.is-playing .cz-o2{animation:czPop .5s cubic-bezier(.2,.8,.2,1.15) 1.44s both;}
.cartoon.is-playing .cz-o3{animation:czPop .5s cubic-bezier(.2,.8,.2,1.15) 1.6s both;}
@keyframes czCursor{ 0%{ transform:translate(90px,110px); opacity:0; } 18%{ opacity:1; } 60%{ transform:translate(0,0); } 68%{ transform:translate(0,0) scale(.86); } 80%,100%{ transform:translate(0,0) scale(1); opacity:1; } }
@keyframes czPress{ 0%,62%{ transform:translateY(0); } 70%{ transform:translateY(6px); } 84%,100%{ transform:translateY(0); } }
@keyframes czRipple{ 0%{ opacity:.7; transform:scale(.55); } 100%{ opacity:0; transform:scale(1.7); } }
@keyframes czFade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes czPop{ from{ opacity:0; transform:translateX(-14px); } to{ opacity:1; transform:none; } }
.split-head{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(20px, 4vw, 64px); align-items:end; margin-bottom:clamp(40px, 5vw, 64px);}
.split-head h2{max-width:17ch;}
@media (max-width:900px){
.split-head{grid-template-columns:minmax(0,1fr);}
}
.pf{margin:0;}
.pf-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); column-gap:40px; row-gap:16px;}
.pf-bracket{grid-column:2 / 4; grid-row:1; position:relative; height:28px; margin:0 18px; border:2px solid var(--accent); border-bottom:0; border-radius:12px 12px 0 0;}
.pf-bracket span, .pf-chip-m{background:var(--accent); color:var(--on-accent); font-weight:700; font-size:.92rem; padding:5px 15px; border-radius:999px; white-space:nowrap;}
.pf-bracket span{position:absolute; left:50%; top:-16px; transform:translateX(-50%);}
.pf-chip-m{display:none; width:fit-content; margin-bottom:12px;}
.pf-panel{grid-row:2; position:relative; background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:18px 18px 12px;}
.pf-arrow{position:absolute; left:-33px; top:50%; width:26px; height:26px; margin-top:-13px; color:var(--ink-3);}
.pf-cap b{display:block; font-weight:600;}
.pf-cap span{display:block; color:var(--ink-3); font-size:.88rem; line-height:1.4; margin-top:2px;}
.pf-panel svg[id]{width:100%; height:auto; margin-top:10px;}
.pf-axis{fill:none; stroke:var(--ink-3); stroke-width:1.2;}
.pf-pt{fill:var(--c, var(--ink-3)); opacity:.62;}
.pf-pt.pos{fill:var(--accent); opacity:.75;}
.pf-ax{font:600 12px var(--font); fill:var(--ink-2);}
.pf-tick{font:500 11px var(--font); fill:var(--ink-3);}
.pf-bar{fill:var(--ink-3); opacity:.35;}
.pf-bar.pos{fill:var(--accent); opacity:.92;}
.pf-thr{stroke:var(--ink); stroke-width:1.4; stroke-dasharray:4 4;}
.pf-tag{font:600 11px var(--font); fill:var(--accent);}
.pf-tag.n{fill:var(--ink-3);}
.pt-edge{fill:none; stroke:var(--line-2); stroke-width:1.6;}
.pt-node rect{fill:var(--panel); fill:color-mix(in srgb, var(--c, var(--accent)) 16%, var(--panel)); stroke:var(--c, var(--accent)); stroke-width:1.4;}
.pt-node.root rect{fill:var(--mist); stroke:var(--line-2);}
.pt-l{font:600 12px var(--font); fill:var(--ink);}
.pt-p{font:500 11px var(--font); fill:var(--ink-2);}
@media (max-width:900px){
.pf-grid{grid-template-columns:minmax(0,1fr);}
.pf-bracket, .pf-arrow{display:none;}
.pf-panel{grid-row:auto;}
.pf-chip-m{display:block;}
}
.flow5{list-style:none; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:22px;}
.fstep{position:relative;}
.fstep:not(:last-child)::after{content:""; position:absolute; top:23px; left:60px; right:-16px; height:2px; background:var(--line-2);}
.fnum{position:relative; z-index:1; width:48px; height:48px; border-radius:50%; display:grid; place-items:center; background:var(--panel); border:2px solid var(--line-2); font-weight:700; font-size:1.05rem; color:var(--ink);}
.ficon{display:block; width:44px; height:44px; margin:24px 0 14px; color:var(--ink-2);}
.fstep h3{font-size:1.12rem;}
.fstep p{color:var(--ink-2); margin-top:8px; font-size:.98rem;}
.fstep.final .ficon{color:var(--accent);}
@media (max-width:960px){
.flow5{grid-template-columns:minmax(0,1fr); gap:30px;}
.fstep{display:grid; grid-template-columns:48px minmax(0,1fr); column-gap:18px;}
.fstep .fnum{grid-row:1 / span 2;}
.fstep .ficon{display:none;}
.fstep h3{padding-top:10px;}
.fstep:not(:last-child)::after{top:54px; bottom:-26px; left:23px; right:auto; width:2px; height:auto;}
}
.agent{background:var(--panel); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); overflow:hidden;}
.agent-head{display:flex; align-items:center; gap:10px; padding:14px 18px; border-bottom:1px solid var(--line); font-weight:600; font-size:.92rem;}
.agent-head .status{margin-left:auto; font-weight:500; color:var(--ink-3); display:inline-flex; align-items:center; gap:7px;}
.agent-head .status::before{content:""; width:8px; height:8px; border-radius:50%; background:#22a05b;}
.agent-body{padding:18px; display:flex; flex-direction:column; gap:12px;}
.msg{max-width:90%; padding:12px 14px; border-radius:14px; font-size:.95rem; line-height:1.5;}
.msg .who{display:block; font-size:.78rem; font-weight:700; margin-bottom:3px; opacity:.85;}
.msg.user{align-self:flex-end; background:var(--accent); color:var(--on-accent); border-bottom-right-radius:4px;}
.msg.bot{align-self:flex-start; background:var(--mist); color:var(--ink); border-bottom-left-radius:4px;}
.ad{border:1px solid var(--line); border-radius:12px; overflow:hidden; font-size:.88rem;}
.ad-row{display:grid; grid-template-columns:1.1fr .8fr .7fr 1.1fr; gap:10px; padding:8px 12px; align-items:center; border-top:1px solid var(--line); font-variant-numeric:tabular-nums; color:var(--ink-2);}
.ad-row b{color:var(--ink); font-weight:600;}
.ad-row.head{border-top:0; color:var(--ink-3); font-weight:600; font-size:.78rem; background:var(--mist);}
.ad-row svg{width:100%; height:20px;}
.spark{fill:none; stroke:var(--c, var(--accent)); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
.ad-more{padding:8px 12px; border-top:1px solid var(--line); color:var(--ink-3);}
.table-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:18px; background:var(--panel);}
.ptable{width:100%; min-width:720px; border-collapse:separate; border-spacing:0; font-variant-numeric:tabular-nums;}
.ptable th, .ptable td{padding:18px 22px; text-align:left; vertical-align:middle; border-top:1px solid var(--line);}
.ptable thead th{border-top:0; vertical-align:bottom; padding-top:24px;}
.ptable thead b{display:block; font-size:1.2rem; letter-spacing:-.01em; color:var(--ink);}
.ptable thead small{display:block; color:var(--ink-3); font-size:.88rem; font-weight:500; margin-top:4px;}
.ptable tbody th{font-weight:600; color:var(--ink); width:28%;}
.ptable td{color:var(--ink-2);}
.ptable .ent{background:var(--accent-tint);}
.ent-cell{display:flex; flex-direction:column; align-items:flex-start; gap:12px;}
.ent-cell p{color:var(--ink-2); font-size:.95rem; max-width:24ch;}
.tbd{display:inline-block; padding:3px 10px; border:1.5px dashed var(--line-2); border-radius:7px; color:var(--ink-3); font-weight:600; font-size:.92rem; white-space:nowrap;}
.table-foot{display:flex; flex-wrap:wrap; gap:16px 24px; align-items:center; justify-content:space-between; margin-top:24px;}
.table-foot p{color:var(--ink-3); font-size:.92rem; max-width:62ch;}
.ring-fig{margin:0; display:flex; flex-direction:column; align-items:center; gap:18px;}
.ring-fig svg{width:min(100%, 440px); height:auto;}
.ring-fig figcaption{text-align:center;}
.ring-fig figcaption b{display:block; font-weight:600;}
.ring-fig figcaption span{display:block; color:var(--ink-3); font-size:.9rem;}
.ring-seg path{fill:var(--accent-tint); stroke:var(--accent); stroke-opacity:.35; stroke-width:1; transition:fill .15s ease;}
.ring-seg .ring-t{font:600 13px var(--font); fill:var(--accent-strong); transition:fill .15s ease;}
.ring-seg.hl path{fill:var(--accent);}
.ring-seg.hl .ring-t{fill:var(--on-accent);}
.ring-core{fill:var(--accent);}
.ring-core-t{font:600 14px var(--font); fill:var(--on-accent);}
.ring-core-big{font:700 34px var(--font); fill:var(--on-accent); letter-spacing:-.03em;}
.modules-unit{margin-top:clamp(56px, 7vw, 88px);}
.mu-head{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(20px, 4vw, 64px); align-items:end; margin-bottom:28px;}
.modules{list-style:none; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:14px;}
.module{background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:18px; transition:border-color .15s ease, background-color .15s ease;}
.module.hl{border-color:var(--accent); background:var(--accent-tint);}
.module h3{display:flex; align-items:center; gap:9px; font-size:1.04rem;}
.module h3 svg{width:18px; height:18px; color:var(--accent); flex:none;}
.chips{list-style:none; display:flex; flex-wrap:wrap; gap:6px; margin-top:12px;}
.chips li{font-size:.82rem; padding:3px 9px; border-radius:999px; background:var(--mist); color:var(--ink-2);}
.your-panel{margin-top:14px; display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; padding:16px 16px 16px 24px; border:1.5px solid var(--accent); border-radius:18px; background:var(--panel);}
.yp-label{font-weight:700;}
.yp-formula{display:flex; flex-wrap:wrap; gap:6px; flex:1;}
.yp-part{padding:7px 14px; border-radius:999px; background:var(--accent-tint); color:var(--ink); font-weight:600; font-size:.95rem;}
@media (max-width:1100px){
.modules{grid-template-columns:repeat(3, minmax(0,1fr));}
}
@media (max-width:760px){
.modules{grid-template-columns:repeat(2, minmax(0,1fr));}
.mu-head{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:480px){
.modules{grid-template-columns:minmax(0,1fr);}
}
.subsec{margin-top:36px; padding-top:28px; border-top:1px solid var(--line);}
.subsec h3{font-size:1.3rem; margin-bottom:10px;}
.transfer{list-style:none;}
.tr-step{display:grid; grid-template-columns:56px minmax(0,1fr); gap:18px; position:relative; padding-bottom:30px;}
.tr-step:last-child{padding-bottom:0;}
.tr-step:not(:last-child)::after{content:""; position:absolute; left:27px; top:62px; bottom:6px; width:2px; background:var(--line-2);}
.tr-icon{width:56px; height:56px; border-radius:16px; display:grid; place-items:center; background:var(--accent-tint); color:var(--accent);}
.tr-icon svg{width:26px; height:26px;}
.tr-step h3{font-size:1.06rem; margin-top:3px;}
.tr-step p{color:var(--ink-2); font-size:.96rem; margin-top:4px;}
.tr-tag{display:inline-flex; margin-top:10px; padding:4px 12px; border-radius:999px; border:1px solid var(--line-2); font-size:.84rem; font-weight:600; color:var(--ink-2);}
.features{list-style:none; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:40px 44px;}
.feature{padding-top:22px; border-top:1px solid var(--line-2);}
.feature .ico{width:28px; height:28px; color:var(--accent); margin-bottom:16px;}
.feature p{color:var(--ink-2); margin-top:8px; font-size:.98rem;}
@media (max-width:900px){
.features{grid-template-columns:repeat(2, minmax(0,1fr));}
}
@media (max-width:600px){
.features{grid-template-columns:minmax(0,1fr);}
}
.sits{display:grid; grid-template-columns:minmax(0,1fr) 48px minmax(0,1.3fr); align-items:stretch; gap:16px;}
.sits-box{border:1px solid var(--line); border-radius:18px; padding:26px; background:var(--panel);}
.sits-box.here{border:1.5px solid var(--accent);}
.sits-box h3{font-size:1.3rem;}
.sits-box p{color:var(--ink-2); margin-top:6px;}
.here-tag{display:inline-block; font-size:.82rem; font-weight:700; color:var(--accent); margin-bottom:10px;}
.sits-arrow{display:grid; place-items:center; color:var(--ink-3);}
.sits-arrow svg{width:28px; height:28px;}
.sits-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px;}
.sits-chips span{padding:6px 13px; border-radius:999px; border:1px solid var(--line-2); font-weight:600; font-size:.9rem; color:var(--ink-2);}
@media (max-width:760px){
.sits{grid-template-columns:minmax(0,1fr);}
.sits-arrow{transform:rotate(90deg); height:36px;}
}
.qstats{list-style:none; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); border-top:1px solid var(--line-2);}
.qstats li{padding:26px 24px 0 0;}
.qstats b{display:block; font-size:clamp(1.6rem, 1.2rem + 1vw, 2.1rem); letter-spacing:-.025em; font-weight:600; color:var(--ink);}
.qstats span{color:var(--ink-2); display:block; margin-top:6px;}
@media (max-width:760px){
.qstats{grid-template-columns:repeat(2, minmax(0,1fr));}
}
.cta-band{background:var(--accent-tint);}
.cta-inner{display:grid; grid-template-columns:minmax(0,1.4fr) auto; gap:32px; align-items:end;}
.cta-inner .body-copy{margin-top:16px;}
@media (max-width:760px){
.cta-inner{grid-template-columns:minmax(0,1fr);}
}
.preview{background:var(--panel); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); overflow:hidden;}
.pv-top{padding:12px 18px; border-bottom:1px solid var(--line); font-size:.85rem; color:var(--ink-3); font-weight:500;}
.pv-tabs{display:flex; gap:4px; padding:6px 12px 0; border-bottom:1px solid var(--line);}
.pv-tabs [role="tab"]{border:0; background:none; padding:11px 14px; font-weight:600; font-size:.95rem; color:var(--ink-3); cursor:pointer; border-bottom:2.5px solid transparent; margin-bottom:-1px; border-radius:0;}
.pv-tabs [role="tab"][aria-selected="true"]{color:var(--ink); border-bottom-color:var(--accent);}
.pv-panel{padding:14px 18px 20px;}
.pv-sub{font-size:.84rem; color:var(--ink-3); margin-bottom:6px;}
.ep-table{width:100%; border-collapse:collapse; font-size:.9rem; font-variant-numeric:tabular-nums;}
.ep-table th, .ep-table td{padding:9px 6px; text-align:right; border-top:1px solid var(--line); color:var(--ink-2);}
.ep-table th:first-child, .ep-table td:first-child{text-align:left; color:var(--ink); font-weight:600;}
.ep-table thead th{border-top:0; color:var(--ink-3); font-weight:600; font-size:.8rem;}
.ep-table td:first-child svg{display:inline-block; vertical-align:-3px; width:16px; height:16px; color:var(--accent); margin-right:8px;}
.disc-list{list-style:none; display:flex; flex-direction:column; gap:11px;}
.disc-row{display:grid; grid-template-columns:minmax(0,1fr) 48px; gap:5px 12px; align-items:center; font-size:.92rem; color:var(--ink); font-weight:500;}
.disc-pct{text-align:right; font-variant-numeric:tabular-nums; color:var(--ink-2);}
.disc-bar{grid-column:1 / -1; height:6px; border-radius:99px; background:var(--mist); overflow:hidden;}
.disc-bar i{display:block; height:100%; background:var(--accent); border-radius:99px;}
.novel{display:inline-block; font-size:.72rem; font-weight:700; padding:2px 7px; border-radius:6px; background:var(--accent); color:var(--on-accent); margin-left:6px; vertical-align:1px;}
.lanes{position:relative;}
.lane-band{position:absolute; left:0; right:0; height:calc(50% - 5px); border-radius:18px; display:flex; align-items:center; padding-left:22px; font-weight:700; font-size:.95rem; color:var(--ink-2);}
.lane-band.you{top:0; background:var(--panel); border:1px solid var(--line);}
.lane-band.oz{bottom:0; background:var(--accent-tint);}
.lanes-svg{position:absolute; left:0; top:0; z-index:1; pointer-events:none; overflow:visible;}
.lane-link{fill:none; stroke:var(--accent); stroke-width:2;}
.lane-head{fill:var(--accent);}
.lane-grid{list-style:none; position:relative; z-index:2; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); grid-template-rows:1fr 1fr; column-gap:40px; row-gap:10px; padding:0 22px 0 112px; min-height:440px;}
.lstep{align-self:center; background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:16px; box-shadow:var(--shadow-s);}
.lstep.c1{grid-column:1;}
.lstep.c2{grid-column:2;}
.lstep.c3{grid-column:3;}
.lstep.c4{grid-column:4;}
.lstep.c5{grid-column:5;}
.lstep.both{grid-row:1 / span 2; border-color:var(--accent);}
.lstep.you{grid-row:1;}
.lstep.oz{grid-row:2;}
.lstep .n{display:inline-grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--accent); color:var(--on-accent); font-weight:700; font-size:.88rem;}
.lstep h3{font-size:1.02rem; margin-top:10px;}
.lstep p{color:var(--ink-2); font-size:.92rem; margin-top:6px; line-height:1.5;}
.lane-tag{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
@media (max-width:1060px){
.lane-band, .lanes-svg{display:none;}
.lane-grid{grid-template-columns:minmax(0,1fr); grid-template-rows:none; padding:0; min-height:0; row-gap:14px;}
.lane-grid > .lstep[class]{grid-column:auto; grid-row:auto;}
.lane-tag{position:static; width:auto; height:auto; overflow:visible; clip:auto; display:inline-block; margin-left:10px; font-size:.82rem; font-weight:700; color:var(--ink-3); vertical-align:middle;}
}
.ov-c{fill:none; stroke-width:2.2;}
.ov-c.a{stroke:var(--accent);}
.ov-c.b{stroke:var(--ink);}
.ov-c.o{stroke:var(--ink-3); stroke-opacity:.6;}
.ov-zone{fill:var(--accent); fill-opacity:.18;}
.ov-t{font:600 12px var(--font); fill:var(--ink-2);}
.ov-callout{font:700 12.5px var(--font); fill:var(--accent-strong);}
.ov-lead{stroke:var(--accent-strong); stroke-width:1.4; fill:none;}
.req-grid{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:clamp(32px, 5vw, 72px); align-items:start;}
.req-group{padding:30px 0; border-top:1px solid var(--line);}
.req-group:first-of-type{border-top:0; padding-top:0;}
.req-group h2{font-size:1.38rem; letter-spacing:-.015em; margin-bottom:16px;}
.req-group > p{color:var(--ink-2); margin-bottom:16px; max-width:68ch;}
.checks{list-style:none; display:flex; flex-direction:column; gap:14px;}
.checks li{display:grid; grid-template-columns:22px minmax(0,1fr); gap:12px; color:var(--ink-2); max-width:70ch;}
.ck{width:22px; height:22px; color:var(--accent); margin-top:2px;}
.req-aside{position:sticky; top:96px; display:flex; flex-direction:column; gap:16px;}
.aside-card{border:1px solid var(--line); border-radius:18px; padding:22px; background:var(--panel);}
.aside-card.tint{background:var(--accent-tint); border-color:transparent;}
.h-mini{font-size:1.04rem; letter-spacing:-.01em; margin-bottom:12px;}
.aside-card ul{list-style:none; display:flex; flex-direction:column; gap:12px; color:var(--ink-2); font-size:.96rem;}
.aside-card p{color:var(--ink-2); font-size:.96rem;}
.aside-card a{color:var(--accent-strong); font-weight:600;}
.req-table{width:100%; min-width:640px; border-collapse:separate; border-spacing:0;}
.req-table th, .req-table td{padding:16px 20px; text-align:left; vertical-align:top; border-top:1px solid var(--line); color:var(--ink-2);}
.req-table thead th{border-top:0; color:var(--ink-3); font-size:.86rem; font-weight:600; background:var(--mist); padding-top:12px; padding-bottom:12px;}
.req-table tbody th{color:var(--ink); font-weight:600; white-space:nowrap;}
.tier{display:inline-flex; gap:3px; margin-right:10px; vertical-align:-2px;}
.tier i{width:6px; height:16px; border-radius:2px; background:var(--line-2);}
.tier i{box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);}
.tier.t3 i{background:var(--tl-green);}
.tier.t2 i:nth-child(-n+2){background:var(--tl-yellow);}
.tier.t1 i:first-child{background:var(--tl-red);}
.req-table tr.thr td{border-top:1.5px dashed var(--accent); background:var(--accent-tint); color:var(--ink); font-size:.9rem; font-weight:600; padding:10px 20px;}
@media (max-width:980px){
.req-grid{grid-template-columns:minmax(0,1fr);}
.req-aside{position:static;}
}
.faq-grid{display:grid; grid-template-columns:270px minmax(0,1fr); gap:clamp(32px, 5vw, 72px); align-items:start;}
.faq-side{position:sticky; top:96px; display:flex; flex-direction:column; gap:18px;}
.search{position:relative;}
.search svg{position:absolute; left:14px; top:50%; width:18px; height:18px; transform:translateY(-50%); color:var(--ink-3); pointer-events:none;}
.search input{width:100%; font:inherit; font-size:1rem; padding:12px 14px 12px 42px; border-radius:12px; border:1.5px solid var(--line-2); background:var(--panel); color:var(--ink);}
.search input:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-tint);}
.faq-cats{display:flex; flex-direction:column; gap:2px;}
.cat{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:9px 12px; border-radius:10px; border:0; background:none; cursor:pointer; font-weight:500; color:var(--ink-2); text-align:left;}
.cat span{font-size:.82rem; color:var(--ink-3); font-variant-numeric:tabular-nums;}
.cat:hover{background:var(--mist); color:var(--ink);}
.cat[aria-pressed="true"]{background:var(--accent-tint); color:var(--ink); font-weight:600;}
.linkish{border:0; background:none; padding:0; cursor:pointer; color:var(--accent-strong); font-weight:600; text-align:left; width:fit-content;}
.linkish:hover{text-decoration:underline;}
.faq-group{margin-bottom:44px;}
.faq-group > h2{font-size:1.38rem; letter-spacing:-.015em; margin-bottom:6px;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item summary{list-style:none; cursor:pointer; display:flex; gap:16px; justify-content:space-between; align-items:flex-start; padding:18px 0; font-weight:600; font-size:1.06rem; line-height:1.4; color:var(--ink);}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary:hover{color:var(--accent-strong);}
.pm{flex:none; width:26px; height:26px; border-radius:50%; border:1.5px solid var(--line-2); position:relative;}
.pm::before, .pm::after{content:""; position:absolute; left:50%; top:50%; width:10px; height:1.8px; background:var(--ink-2); border-radius:2px; transform:translate(-50%,-50%);}
.pm::after{transform:translate(-50%,-50%) rotate(90deg); transition:transform .15s ease;}
.faq-item[open] .pm{border-color:var(--accent);}
.faq-item[open] .pm::after{transform:translate(-50%,-50%) rotate(0deg);}
.faq-a{padding:0 42px 22px 0; color:var(--ink-2); max-width:72ch;}
.faq-a > * + *{margin-top:10px;}
.faq-a ul{padding-left:20px; display:flex; flex-direction:column; gap:8px;}
.faq-a ul ul{margin-top:8px;}
.faq-a strong{color:var(--ink);}
.faq-a a{color:var(--accent-strong); font-weight:600;}
.faq-empty{padding:28px; border:1.5px dashed var(--line-2); border-radius:16px; color:var(--ink-2);}
@media (max-width:900px){
.faq-grid{grid-template-columns:minmax(0,1fr);}
.faq-side{position:static;}
.faq-cats{flex-direction:row; flex-wrap:wrap; gap:8px;}
.cat{border:1px solid var(--line); border-radius:999px; padding:7px 13px;}
}
.site-footer{background:var(--mist); border-top:1px solid var(--line); padding:64px 0 40px;}
.f-grid{display:grid; grid-template-columns:1.5fr repeat(3, minmax(0,1fr)); gap:32px;}
.f-brand p{color:var(--ink-2); margin-top:12px; max-width:34ch; font-size:.96rem;}
.f-grid nav h2{font-size:.92rem; font-weight:700; margin-bottom:10px; letter-spacing:0;}
.f-grid nav a{display:block; padding:5px 0; text-decoration:none; color:var(--ink-2); font-size:.96rem;}
.f-grid nav a:hover{color:var(--ink); text-decoration:underline;}
.f-bottom{margin-top:48px; padding-top:24px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:12px 28px; justify-content:space-between; font-size:.86rem; color:var(--ink-3);}
.f-links{display:flex; flex-wrap:wrap; gap:6px 20px;}
.f-links a{text-decoration:none; color:var(--ink-2);}
.f-links a:hover{color:var(--ink); text-decoration:underline;}
@media (max-width:760px){
.f-grid{grid-template-columns:repeat(2, minmax(0,1fr));}
.f-brand{grid-column:1 / -1;}
.site-footer{padding-bottom:96px;}
}
@media (max-width:520px){
.btn{white-space:normal; text-align:center;}
.btn-xl{padding:19px 36px;}
}
.ptable.simple{min-width:640px;}
.ptable.simple thead th{font-size:.86rem; color:var(--ink-3); font-weight:600; background:var(--mist); padding-top:12px; padding-bottom:12px; vertical-align:middle;}
.ptable tbody th small{display:block; font-weight:500; color:var(--ink-3); font-size:.86rem; margin-top:3px;}
.cz-node.hl{fill:var(--c, var(--accent)); stroke:var(--ink); stroke-width:2;}
.cz-mcur{fill:#fff; stroke:#0b1117; stroke-width:1.2; stroke-linejoin:round;}
.cz-pct{font:600 9.5px var(--font); fill:var(--ink-2);}
.cz-page{fill:var(--panel); stroke:var(--ink); stroke-width:1.5;}
.cz-page.back{opacity:.7;}
.cz-line{fill:var(--line-2);}
.cz-ck{fill:var(--accent);}
.cz-ck-t{fill:none; stroke:var(--on-accent); stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round;}
.cz-pill{fill:var(--mist); stroke:var(--line-2);}
.cz-pill-t{font:700 6.5px var(--font); fill:var(--ink-2); letter-spacing:.04em;}
.rp-page{fill:var(--panel); stroke:var(--line-2); stroke-width:1.2;}
.rp-page.back{fill:var(--mist);}
.rp-h{font:700 12.5px var(--font); fill:var(--ink);}
.rp-sub{font:500 10.5px var(--font); fill:var(--ink-3);}
.rp-pill{fill:var(--accent);}
.rp-pill-t{font:700 9px var(--font); fill:var(--on-accent); letter-spacing:.04em;}
.rp-rule{stroke:var(--line); stroke-width:1;}
.rp-l{font:600 11px var(--font); fill:var(--ink);}
.rp-v{font:500 11px var(--font); fill:var(--ink-2); font-variant-numeric:tabular-nums;}
.rp-track{fill:var(--mist);}
.rp-bar{fill:var(--c, var(--accent));}
.agent-foot{padding:10px 18px 12px; border-top:1px solid var(--line); font-size:.8rem; color:var(--ink-3);}
.tiers{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px; align-items:stretch;}
.tier-card{display:flex; flex-direction:column; background:var(--panel); border:1px solid var(--line); border-top:4px solid var(--tier); border-radius:16px; padding:24px 26px 26px;}
.tier-card.t1{--tier:var(--line-2);}
.tier-card.t2{--tier:var(--ink-3);}
.tier-card.t3{--tier:var(--ink);}
.tier-top{display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:30px;}
.tier-top h3{font-size:1.45rem; letter-spacing:-.02em;}
.tier-prices{margin:18px 0 0; display:flex; flex-direction:column; gap:14px;}
.tier-prices dt{font-size:.86rem; color:var(--ink-3); font-weight:600;}
.tier-prices dd{margin:2px 0 0; font-size:2rem; font-weight:700; letter-spacing:-.03em; color:var(--ink); font-variant-numeric:tabular-nums; line-height:1.1;}
.tier-prices dd small{font-size:1rem; font-weight:600; letter-spacing:0; color:var(--ink-2); margin-right:6px;}
.tier-feats{list-style:none; margin:22px 0 26px; padding-top:20px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:10px; color:var(--ink-2); font-size:.97rem;}
.tier-feats li{display:grid; grid-template-columns:18px minmax(0,1fr); gap:10px;}
.tier-feats svg{width:18px; height:18px; color:var(--ink); margin-top:3px;}
.tier-card .btn{margin-top:auto; align-self:flex-start;}
.pack-row{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin-top:24px; font-size:.92rem; color:var(--ink-2);}
.pack-row b{color:var(--ink);}
.pack{list-style:none; display:flex; flex-wrap:wrap; gap:8px;}
.pack li{padding:5px 12px; border-radius:999px; background:var(--panel); border:1px solid var(--line);}
@media (max-width:900px){
.tiers{grid-template-columns:minmax(0,1fr);}
}
.p-hero-grid.wide-visual{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);}
@media (max-width:900px){
.p-hero-grid.wide-visual{grid-template-columns:minmax(0,1fr);}
}
.dmock{margin:0;}
.dmock svg{width:100%; height:auto; border-radius:14px; box-shadow:var(--shadow);}
.dm-bg{fill:var(--panel);}
.dm-frame{fill:none; stroke:var(--line-2);}
.dm-head{fill:var(--platform-head);}
.dm-logo{font:700 20px var(--font); fill:#fff; letter-spacing:-.04em;}
.dm-avatar{fill:var(--platform-avatar);}
.dm-crumb{fill:var(--platform-crumb);}
.dm-crumb-t{font:500 11px var(--font); fill:var(--ink-3);}
.dm-crumb-t .sep{fill:var(--line-2);}
.dm-crumb-t .cur{fill:var(--ink);}
.dm-btn{fill:var(--platform-btn);}
.dm-btn-t{font:700 8.5px var(--font); fill:var(--platform-btn-ink); letter-spacing:.06em;}
.dm-box{fill:var(--panel); stroke:var(--line);}
.dm-lbl{font:500 7.5px var(--font); fill:var(--ink-3);}
.dm-val{font:600 8.5px var(--font); fill:var(--ink);}
.dm-chip{fill:var(--mist); stroke:var(--line);}
.dm-chip-t{font:600 6.8px var(--font); fill:var(--ink-2);}
.dm-title{font:700 10px var(--font); fill:var(--ink);}
.dm-small{font:500 7px var(--font); fill:var(--ink-3);}
.dm-dot{fill:var(--line-2);}
.dm-dot.on{fill:var(--ink);}
.dm-rule{stroke:var(--line);}
.dm-grid{stroke:var(--line); stroke-width:.8;}
.dm-tab{font:700 9px var(--font); fill:var(--ink);}
.dm-tab-line{fill:var(--ink);}
.dm-vt{font:700 6.2px var(--font); fill:var(--ink-3); letter-spacing:.05em;}
.dc1{--c:var(--d1);}
.dc2{--c:var(--d2);}
.dc3{--c:var(--d3);}
.dc4{--c:var(--d4);}
.dc5{--c:var(--d5);}
.dc6{--c:var(--d6);}
.req-table tfoot tr.thr td{border-top:1px solid var(--line); background:var(--mist); color:var(--ink-2); font-weight:500; font-size:.9rem; padding:12px 20px;}
.thr-scale{display:inline-flex; align-items:center; gap:3px; margin-right:10px; vertical-align:-1px; color:var(--ink-3);}
.thr-scale i{width:10px; height:6px; border-radius:2px;}
.thr-scale .tg{background:var(--tl-green);}
.thr-scale .tn{background:var(--tl-yellow);}
.thr-scale .tm{background:var(--tl-red);}
.thr-scale svg{width:16px; height:10px; margin-left:3px;}
#ep-viz{width:100%; height:auto; display:block; margin-top:6px;}
.ep-edge{fill:none; stroke:var(--line-2); stroke-width:1.5;}
.ep-edge.on{stroke:var(--accent); stroke-width:2;}
.ep-node rect{fill:var(--panel); stroke:var(--line-2); stroke-width:1.2;}
.ep-node.on rect{stroke:var(--accent); stroke-width:1.6;}
.ep-node.hl rect{fill:var(--accent); stroke:var(--accent);}
.ep-node text{font:600 11px var(--font); fill:var(--ink);}
.ep-node.hl text{fill:var(--on-accent);}
.ep-cap{font:600 11px var(--font); fill:var(--ink-2);}
.ep-box{fill:var(--panel); stroke:var(--line);}
.ep-title{font:600 10.5px var(--font); fill:var(--ink);}
.ep-pct{font:700 10.5px var(--font); fill:var(--accent-strong); font-variant-numeric:tabular-nums;}
.ep-axis{fill:none; stroke:var(--ink-3); stroke-width:1.1;}
.ep-ax{font:600 9.5px var(--font); fill:var(--ink-2);}
.ep-pt{fill:var(--d1); opacity:.5;}
.ep-pt.in{fill:var(--accent); opacity:.88;}
.ep-gate{fill:var(--accent); fill-opacity:.1; stroke:var(--accent); stroke-width:1.5; stroke-linejoin:round;}
.ep-gl{font:700 9px var(--font); fill:var(--accent-strong);}
.res-band{padding-top:clamp(36px, 4vw, 56px);}
.cta-band.plain{background:var(--paper); border-top:1px solid var(--line);}
.tag{display:inline-flex; align-items:center; padding:3px 10px; border-radius:999px; background:var(--mist); color:var(--ink-2); font-size:.8rem; font-weight:600; white-space:nowrap;}
.item-h{font-size:1.28rem; line-height:1.3; letter-spacing:-.015em; margin:10px 0 8px;}
.item-h a{color:var(--ink); text-decoration:none;}
.item-h a:hover{text-decoration:underline;}
.item-p{color:var(--ink-2); max-width:72ch;}
.more{display:inline-flex; align-items:center; gap:6px; margin-top:12px; font-weight:600; color:var(--ink); text-decoration:none;}
.more:hover{text-decoration:underline;}
.more svg{width:14px; height:14px;}
.clamp{display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;}
.news-list{list-style:none; border-top:1px solid var(--line);}
.news-item{display:grid; grid-template-columns:110px minmax(0,1fr); gap:28px; padding:28px 0; border-bottom:1px solid var(--line);}
.news-date{display:flex; flex-direction:column; font-variant-numeric:tabular-nums; padding-top:2px;}
.news-date b{font-size:1.12rem; color:var(--ink); font-weight:600;}
.news-date span{color:var(--ink-3); font-size:.9rem;}
@media (max-width:640px){
.news-item{grid-template-columns:minmax(0,1fr); gap:8px;}
.news-date{flex-direction:row; gap:8px; align-items:baseline;}
}
.card-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px;}
.r-card{display:flex; flex-direction:column; background:var(--panel); border:1px solid var(--line); border-radius:16px; overflow:hidden;}
.r-body{display:flex; flex-direction:column; flex:1; padding:20px 22px 22px;}
.r-card .item-h{font-size:1.1rem;}
.r-card .item-p{font-size:.95rem;}
.r-card .more{margin-top:auto; padding-top:16px;}
.r-meta{display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; color:var(--ink-3); font-size:.86rem;}
.r-thumb{position:relative; display:block; aspect-ratio:16 / 10; background:var(--mist); border-bottom:1px solid var(--line); overflow:hidden;}
.r-thumb img{width:100%; height:100%; object-fit:cover;}
.r-thumb.noimg::after, .hist-img.noimg::after{content:attr(data-label); position:absolute; inset:0; display:grid; place-items:center; color:var(--ink-3); font-weight:600; font-size:.92rem;}
.r-card.featured{grid-column:span 2;}
.r-card.featured .item-h{font-size:1.5rem;}
.r-card.featured .clamp{-webkit-line-clamp:6;}
.case .r-body{padding:26px;}
.case .item-h{font-size:1.3rem;}
@media (max-width:980px){
.card-grid{grid-template-columns:repeat(2, minmax(0,1fr));}
}
@media (max-width:640px){
.card-grid{grid-template-columns:minmax(0,1fr);}
.r-card.featured{grid-column:auto;}
}
.ev-year{font-size:1.05rem; font-weight:600; color:var(--ink-3); letter-spacing:0; margin:44px 0 0; padding-bottom:10px;}
.ev-year:first-of-type{margin-top:0;}
.ev-list{list-style:none; border-top:1px solid var(--line);}
.ev-item{display:grid; grid-template-columns:76px minmax(0,1fr) auto; gap:24px; align-items:start; padding:24px 0; border-bottom:1px solid var(--line);}
.ev-date{width:68px; border:1px solid var(--line); border-radius:12px; overflow:hidden; text-align:center; background:var(--panel);}
.ev-date b{display:block; background:var(--ink); color:var(--paper); font-size:.8rem; font-weight:700; padding:4px 0;}
.ev-date span{display:block; font-size:1.45rem; font-weight:700; color:var(--ink); padding:5px 0 7px; font-variant-numeric:tabular-nums;}
.ev-item .item-h{margin-top:0;}
.ev-time{color:var(--ink-3); font-size:.88rem; margin-bottom:4px;}
.ev-item > .more{margin-top:2px; white-space:nowrap;}
@media (max-width:760px){
.ev-item{grid-template-columns:68px minmax(0,1fr);}
.ev-item > .more{grid-column:2;}
}
.hist-img{position:relative; border-radius:18px; overflow:hidden; background:var(--mist); aspect-ratio:4 / 3; margin:0;}
.hist-img img{width:100%; height:100%; object-fit:cover;}
.sub-band{margin-top:clamp(56px, 7vw, 88px);}
.team{list-style:none; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px;}
.person{display:flex; flex-direction:column; gap:12px; background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:22px;}
.person-top{display:flex; align-items:center; gap:14px;}
.avatar{position:relative; flex:none; width:68px; height:68px; border-radius:50%; overflow:hidden; background:var(--mist);}
.avatar img{width:100%; height:100%; object-fit:cover;}
.avatar.noimg::after{content:attr(data-initials); position:absolute; inset:0; display:grid; place-items:center; font-weight:700; color:var(--ink-2);}
.person h3{font-size:1.1rem;}
.person .role{color:var(--ink-3); font-size:.9rem; margin-top:2px;}
.person details summary{list-style:none; cursor:pointer; font-weight:600; font-size:.92rem; color:var(--ink); width:fit-content;}
.person details summary::-webkit-details-marker{display:none;}
.person details summary::after{content:"+"; margin-left:6px; color:var(--ink-3);}
.person details[open] summary::after{content:"−";}
.person .bio{color:var(--ink-2); font-size:.93rem; margin-top:8px;}
.socials{display:flex; flex-wrap:wrap; gap:4px 14px; font-size:.88rem; margin-top:auto; padding-top:4px;}
.socials a{color:var(--ink-2); font-weight:600; text-decoration:none;}
.socials a:hover{color:var(--ink); text-decoration:underline;}
.backers{list-style:none; display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:12px;}
.backer{position:relative; height:84px; display:grid; place-items:center; padding:14px; background:#fff; border:1px solid var(--line); border-radius:14px;}
.backer img{max-width:100%; max-height:44px; object-fit:contain;}
.backer span{display:none; font-weight:700; color:#3f4a58; text-align:center;}
.backer.noimg span{display:block;}
.fineprint{color:var(--ink-3); font-size:.86rem; max-width:84ch; margin-top:32px;}
@media (max-width:980px){
.team{grid-template-columns:repeat(2, minmax(0,1fr));}
.backers{grid-template-columns:repeat(4, minmax(0,1fr));}
}
@media (max-width:600px){
.team{grid-template-columns:minmax(0,1fr);}
.backers{grid-template-columns:repeat(2, minmax(0,1fr));}
}
.role-card{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:center; padding:24px 26px; background:var(--panel); border:1px solid var(--line); border-radius:16px; color:var(--ink); text-decoration:none; transition:border-color .15s ease;}
.role-card:hover{border-color:var(--ink-3);}
.role-card .item-h{font-size:1.35rem; margin:10px 0 4px;}
.role-loc{color:var(--ink-2);}
.role-card .more{margin-top:0;}
@media (max-width:640px){
.role-card{grid-template-columns:minmax(0,1fr);}
}
.cmp-grid{display:grid; grid-template-columns:210px minmax(0,1fr); gap:clamp(32px, 5vw, 72px); align-items:start;}
.cmp-toc{position:sticky; top:96px; display:flex; flex-direction:column; gap:2px;}
.cmp-toc a{padding:8px 12px; border-radius:10px; color:var(--ink-2); font-weight:500; text-decoration:none;}
.cmp-toc a:hover{background:var(--mist); color:var(--ink);}
.cmp-sec{padding-bottom:40px; margin-bottom:40px; border-bottom:1px solid var(--line);}
.cmp-sec:last-child{border-bottom:0; margin-bottom:0; padding-bottom:0;}
.cmp-sec h2{font-size:1.6rem; letter-spacing:-.02em; margin-bottom:12px;}
.cmp-sec > p{color:var(--ink-2); max-width:72ch;}
.cmp-sec a{color:var(--ink); font-weight:600;}
.std-groups{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; margin-top:22px;}
.std-group{padding:18px; background:var(--panel); border:1px solid var(--line); border-radius:14px;}
.std-group h3{font-size:.92rem; color:var(--ink-3); letter-spacing:0; margin-bottom:10px;}
.std-group ul{list-style:none; display:flex; flex-wrap:wrap; gap:8px;}
.std-group li{padding:5px 11px; border-radius:8px; background:var(--mist); color:var(--ink); font-size:.9rem; font-weight:600;}
.callout-box{margin-top:20px; padding:16px 18px; border-radius:12px; background:var(--mist); color:var(--ink-2); font-size:.94rem; max-width:80ch;}
.callout-box b{color:var(--ink);}
.cmp-sec .checks{margin-top:18px;}
.reps{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; margin-top:20px;}
.rep{padding:18px; background:var(--panel); border:1px solid var(--line); border-radius:14px;}
.rep h3{font-size:1rem; margin-bottom:8px;}
.rep address{font-style:normal; color:var(--ink-2); font-size:.94rem; line-height:1.6;}
@media (max-width:900px){
.cmp-grid{grid-template-columns:minmax(0,1fr);}
.cmp-toc{position:static; flex-direction:row; flex-wrap:wrap;}
.std-groups, .reps{grid-template-columns:minmax(0,1fr);}
}
.about-copy a{color:var(--ink); text-decoration:underline; text-decoration-color:var(--pc, var(--ink)); text-decoration-thickness:2px; text-underline-offset:5px; border-radius:3px; transition:background-color .15s ease;}
.about-copy a:hover{background:var(--pc-tint, var(--mist));}
.checks .subpts{list-style:disc; padding-left:20px; margin-top:8px;}
.checks .subpts li{display:list-item; max-width:none;}
.checks .subpts li + li{margin-top:4px;}
.checks .subpts li::marker{color:var(--ink-3);}
.price-strong{color:var(--ink); font-weight:700;}
.mu-head.single{grid-template-columns:minmax(0,1fr);}
.lede a{color:var(--ink); text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:2px; text-underline-offset:4px;}
.ag-h{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:clamp(32px, 5vw, 80px); row-gap:.25em; margin-bottom:clamp(24px, 3vw, 40px);}
.ag-h span{display:block;}
.ag-h2{margin-bottom:clamp(28px, 3.5vw, 44px);}
.ag-h2 > span:not(.sr-only){display:block; text-wrap:balance;}
.ag-body .body-copy{font-size:clamp(1.12rem, .9rem + .62vw, 1.42rem); line-height:1.6; max-width:none;}
.ag-body .body-copy + .body-copy{margin-top:22px;}
.ag-body a{color:var(--ink); text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; text-decoration-color:var(--line-2);}
.ag-body a:hover{text-decoration-color:var(--ink);}
@media (max-width:900px){
.ag-h{grid-template-columns:minmax(0,1fr);}
}
.ag-grid{align-items:start;}
.pf-grid{grid-template-columns:minmax(0,1fr) 156px minmax(0,1fr) minmax(0,1fr); column-gap:14px;}
.pf-bracket{grid-column:3 / 5;}
.pf-a{grid-column:1;}
.pf-b{grid-column:3;}
.pf-c{grid-column:4;}
.pf-link{grid-column:2; grid-row:2; position:relative; display:flex; align-items:center; justify-content:center;}
.pf-link-line{position:absolute; left:0; top:50%; width:100%; height:20px; transform:translateY(-50%); overflow:visible;}
.pf-link-line path{fill:none; stroke:var(--ink-3); stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.pf-click{position:relative; display:inline-flex; align-items:center; gap:6px; padding:9px 14px; border-radius:999px; background:var(--accent); color:var(--on-accent); font-weight:700; font-size:.9rem; line-height:1; white-space:nowrap; box-shadow:var(--shadow-s);}
.pf-click svg{width:13px; height:13px;}
@media (max-width:900px){
.pf-grid{grid-template-columns:minmax(0,1fr);}
.pf-a, .pf-b, .pf-c, .pf-link{grid-column:auto; grid-row:auto;}
.pf-link{height:84px;}
.pf-link-line{display:none;}
.pf-link::before{content:""; position:absolute; left:50%; top:0; bottom:0; width:2px; margin-left:-1px; background:var(--ink-3);}
}
.pp-overview{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; margin-top:32px;}
.pp-card{display:flex; flex-direction:column; gap:4px; padding:20px 22px; background:var(--panel); border:1px solid var(--line); border-top:3px solid var(--pc); border-radius:16px; color:var(--ink); text-decoration:none; transition:box-shadow .15s ease, border-color .15s ease;}
.pp-card:hover{box-shadow:var(--shadow-s); border-color:var(--pc);}
.pp-card .dd-dot{margin-bottom:10px;}
.pp-card b{font-size:1rem; font-weight:600;}
.pp-price{font-size:1.6rem; font-weight:700; letter-spacing:-.02em; margin-top:6px;}
.pp-unit{color:var(--ink-3); font-size:.9rem;}
.pp-go{margin-top:12px; font-weight:600; font-size:.92rem; color:var(--pc);}
.pp-sec.p-lab{--accent:var(--lab); --accent-strong:var(--lab-strong); --accent-tint:var(--lab-tint);}
.pp-sec.p-consult{--accent:var(--consult); --accent-strong:var(--consult-strong); --accent-tint:var(--consult-tint);}
.pp-head{display:flex; align-items:center; gap:14px; margin-bottom:28px;}
.pp-head .dd-dot{width:44px; height:44px; border-radius:12px;}
.pp-head .dd-dot svg{width:22px; height:22px;}
.pp-head h2{font-size:clamp(1.6rem, 1.3rem + 1vw, 2.2rem);}
.pp-head p{color:var(--ink-3); font-size:.95rem; margin-top:2px;}
.pp-link{margin-left:auto; font-weight:600; color:var(--ink); text-decoration:none; white-space:nowrap;}
.pp-link:hover{text-decoration:underline;}
.pp-intro{margin-bottom:20px;}
.pp-cta{margin-top:24px;}
@media (max-width:760px){
.pp-overview{grid-template-columns:minmax(0,1fr);}
.pp-head{flex-wrap:wrap;}
.pp-link{margin-left:58px;}
}
.hero-cta.top{margin-top:clamp(22px, 2.5vw, 32px);}
.loop-frame{position:relative; z-index:1; margin:0; aspect-ratio:16 / 10; border-radius:20px; border:1.5px dashed var(--line-2); background:var(--mist); display:flex; align-items:center; justify-content:center; overflow:hidden;}
.loop-ph{display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; color:var(--ink-3); padding:0 24px 56px;}
.loop-ph b{color:var(--ink); font-size:1.15rem;}
.loop-icon{width:56px; height:56px; border-radius:50%; background:var(--panel); border:1px solid var(--line); display:grid; place-items:center; color:var(--ink-2); margin-bottom:6px;}
.loop-icon svg{width:26px; height:26px;}
.loop-steps{list-style:none; position:absolute; left:16px; right:16px; bottom:16px; display:flex; flex-wrap:wrap; justify-content:center; gap:8px;}
.loop-steps li{display:inline-flex; align-items:center; gap:8px; padding:7px 12px 7px 8px; border-radius:999px; background:var(--panel); border:1px solid var(--line); color:var(--ink-2); font-size:.86rem; font-weight:600; transition:background-color .25s ease, color .25s ease, border-color .25s ease;}
.loop-steps li i{font-style:normal; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; background:var(--mist); color:var(--ink-2); font-size:.75rem; font-weight:700;}
.loop-steps li.is-on{background:var(--ink); border-color:var(--ink); color:var(--paper);}
.loop-steps li.is-on i{background:var(--paper); color:var(--ink);}
@media (max-width:640px){
.loop-steps li:not(.is-on){display:none;}
.loop-ph{padding-bottom:48px;}
}
.video-band{background:var(--platform-head);}
.video-band .video-h{color:#fff; text-align:center; margin-bottom:clamp(24px, 3vw, 40px);}
.video-stage{max-width:960px; margin:0 auto;}
.video-band .video{box-shadow:0 24px 60px -24px rgba(0,0,0,.8);}
.video-band .video-meta a{color:#b9c3ce;}
.video-band .video-meta a:hover{color:#fff;}
.video-band .play{background:#fff; color:#0b1117; box-shadow:0 12px 34px -8px rgba(0,0,0,.7);}
.loop-frame.has-video{display:block; border:1px solid var(--line); background:#fff; box-shadow:var(--shadow);}
.loop-frame.has-video video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; cursor:pointer;}
.loop-play{position:absolute; left:50%; top:50%; width:84px; height:84px; margin:-42px 0 0 -42px; border-radius:50%; border:0; background:var(--ink); color:var(--paper); display:grid; place-items:center; cursor:pointer; box-shadow:0 12px 30px -8px rgba(0,0,0,.45);}
.loop-play svg{width:30px; height:30px; margin-left:4px;}
.loop-caption{position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:12px; margin-top:18px; text-align:center;}
.loop-prog{display:flex; gap:6px; width:min(300px, 70%);}
.loop-prog i{flex:1; height:3px; border-radius:2px; background:var(--line-2); overflow:hidden;}
.loop-prog b{display:block; height:100%; background:var(--ink); transform-origin:left center; transform:scaleX(0);}
.loop-caps{list-style:none; display:grid; width:100%;}
.loop-caps li{grid-area:1 / 1; display:flex; align-items:center; justify-content:center; gap:10px; opacity:0; transition:opacity .35s ease; font-size:clamp(1rem, .95rem + .25vw, 1.12rem); font-weight:500; color:var(--ink); padding:0 8px;}
.loop-caps li.is-on{opacity:1;}
.loop-n{flex:none; width:24px; height:24px; border-radius:50%; display:grid; place-items:center; background:var(--ink); color:var(--paper); font-size:.78rem; font-weight:700;}
@media (prefers-reduced-motion: reduce){
*, *::before, *::after{transition:none !important; animation:none !important;}
html{scroll-behavior:auto;}
}

/* =====================================================================
   site-extra.css — hand-maintained additions to the wireframe design system
   (site.css is generated by import_wireframe.py; don't edit that file).
   Everything here uses the wireframe's tokens, so light and dark both work.
   ===================================================================== */

/* ---------- Old token names, still used by markdown output and the calculator ---------- */
body{
  --ink-soft:var(--ink-2); --ink-faint:var(--ink-3);
  --card:var(--panel); --paper-2:var(--mist); --line-soft:var(--line);
  --teal:var(--accent); --teal-deep:var(--accent-strong); --teal-wash:var(--accent-tint);
  --coral:var(--consult); --coral-deep:var(--consult-strong); --coral-wash:var(--consult-tint);
  --maxw:var(--max);
  --accent-wash:var(--accent-tint); --blue:var(--accent); --blue-deep:var(--accent-strong); --blue-wash:var(--accent-tint);
}

/* ---------- Logo (real wordmark SVG inside the wireframe's .logo) ---------- */
.logo .logo-svg{ display:block; height:22px; width:auto; }
.f-brand .logo{ margin-bottom:14px; }

/* ---------- Announcement banner (chrome.BANNER) ---------- */
.site-banner{ display:block; width:100%; background:var(--ink); color:var(--paper); text-align:center; font-size:.92rem; font-weight:500; padding:10px 16px; text-decoration:none; }
a.site-banner:hover{ text-decoration:underline; text-underline-offset:3px; }

/* ---------- Buttons: old size/variant names used in content and legacy pages ---------- */
.btn-lg{ padding:16px 28px; font-size:1.05rem; }
.btn-ghost{ background:var(--btn2-bg); color:var(--btn2-ink); border-color:transparent; }
.btn-ghost:hover{ background:var(--btn2-hover); color:var(--ink); }

/* ---------- Breadcrumb links, jump links ---------- */
.crumbs a{ color:var(--ink-2); text-decoration:none; }
.crumbs a:hover{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.pp-jump{ display:flex; flex-wrap:wrap; gap:8px 22px; margin-top:22px; font-size:.95rem; }
.pp-jump a{ color:var(--ink-2); font-weight:600; text-decoration:none; }
.pp-jump a:hover{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }

/* ---------- Article / detail pages (build.py) ---------- */
.p-hero .art-meta{ margin-bottom:16px; }
.p-hero .btn-row{ margin-top:28px; }
.art-hero{ margin:0 0 clamp(32px, 4vw, 52px); border-radius:20px; overflow:hidden; border:1px solid var(--line); background:var(--mist); }
.art-hero img{ width:100%; height:auto; display:block; }
.art-hero.narrow{ max-width:760px; margin-left:auto; margin-right:auto; }
.more.back{ margin-top:clamp(32px, 4vw, 48px); }
.more.back svg{ transform:rotate(180deg); }
.more svg{ width:18px; height:18px; flex:none; }

/* Detail-page titles are longer than landing headlines */
.p-hero.art h1{ font-size:clamp(2.1rem, 1.4rem + 2.4vw, 3.4rem); line-height:1.08; max-width:26ch; }
.p-hero.art .lede{ max-width:68ch; }

/* ---------- Prose: articles, case studies, legal pages ---------- */
.article-body{ max-width:760px; margin:0 auto; color:var(--ink-2); font-size:1.06rem; line-height:1.72; }
.article-body > * + *{ margin-top:1.05em; }
.article-body h2, .article-body h3, .article-body h4{ color:var(--ink); font-size:clamp(1.25rem, 1.1rem + .5vw, 1.5rem); line-height:1.3; letter-spacing:-.015em; margin-top:2em; }
.article-body strong{ color:var(--ink); }
.article-body a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--line-2); text-underline-offset:3px; }
.article-body a:hover{ text-decoration-color:var(--ink); }
.article-body a.btn{ text-decoration:none; }
.article-body a.btn-primary{ color:var(--on-accent); }
.article-body ul, .article-body ol{ padding-left:1.35em; }
.article-body ul{ list-style:disc; }
.article-body ol{ list-style:decimal; }
.article-body li + li{ margin-top:.45em; }
.article-body img{ max-width:100%; height:auto; border-radius:14px; border:1px solid var(--line); }
.article-body figure{ margin:1.8em 0; }
.article-body figure img{ display:block; width:100%; }
.article-body figcaption{ font-size:.9rem; color:var(--ink-3); margin-top:10px; line-height:1.5; }
.article-body code{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.9em; background:var(--mist); padding:.12em .38em; border-radius:6px; }
.article-body pre{ background:var(--mist); border:1px solid var(--line); padding:16px 18px; border-radius:12px; overflow:auto; font-size:.92rem; line-height:1.55; }
.article-body pre code{ background:none; padding:0; }
.article-body table{ font-size:.95rem; display:block; overflow-x:auto; }
.article-body th, .article-body td{ border-bottom:1px solid var(--line); padding:9px 12px 9px 0; text-align:left; vertical-align:top; }
.article-body th{ color:var(--ink); font-weight:600; }
.article-back{ display:inline-flex; align-items:center; gap:6px; margin-top:2.4em; font-weight:600; color:var(--ink); text-decoration:none; }

/* ---------- Older page markup (legal pages, account requests, calculator) ---------- */
.reveal{ opacity:1; transform:none; }
.crumb{ font-size:.9rem; color:var(--ink-3); padding-top:clamp(32px, 4vw, 52px); }
.crumb a{ color:var(--ink-2); text-decoration:none; }
.crumb a:hover{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.phero{ padding:clamp(20px, 3vw, 30px) 0 clamp(40px, 5vw, 64px); }
.phero .eyebrow{ margin-bottom:14px; }
.phero h1{ font-size:clamp(2.3rem, 1.5rem + 2.8vw, 3.8rem); line-height:1.05; letter-spacing:-.03em; max-width:22ch; margin:0 0 20px; }
.phero p{ font-size:1.18rem; line-height:1.6; color:var(--ink-2); max-width:64ch; }
main.legacy > section:last-of-type{ padding-bottom:clamp(64px, 8vw, 104px); }

/* ---------- Lead-capture form (chrome.FORM_MODAL), in the wireframe's dialog style ---------- */
.ozf-overlay{ display:none; position:fixed; inset:0; z-index:200; background:rgba(10,14,28,.55); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); align-items:flex-start; justify-content:center; overflow-y:auto; padding:5vh 12px 16px; }
.ozf-overlay.show{ display:flex; }
.ozf-modal{ position:relative; width:min(640px, 100%); background:var(--panel); color:var(--ink); border-radius:22px; box-shadow:0 30px 80px -20px rgba(0,0,0,.45); padding:34px; animation:ozfpop .2s ease-out; }
@keyframes ozfpop{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .ozf-modal{ animation:none; } }
.ozf-close{ position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:11px; border:0; background:none; cursor:pointer; color:var(--ink-2); display:grid; place-items:center; }
.ozf-close:hover{ background:var(--mist); color:var(--ink); }
.ozf-close svg{ width:20px; height:20px; }
.ozf-head .eyebrow{ margin-bottom:8px; }
.ozf-head h2{ font-size:clamp(1.6rem, 1.3rem + 1vw, 2rem); letter-spacing:-.025em; padding-right:40px; }
.ozf-intro{ color:var(--ink-2); margin-top:10px; }
.ozf-form{ display:grid; gap:16px; margin-top:24px; }
.ozf-row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
@media (max-width:560px){ .ozf-row{ grid-template-columns:minmax(0,1fr); } .ozf-modal{ padding:28px 20px 24px; } }
.ozf-field{ display:grid; gap:7px; margin:0; padding:0; border:0; min-width:0; }
.ozf-field[hidden]{ display:none; }
.ozf-field > span, .ozf-field > legend{ font-size:.9rem; font-weight:600; color:var(--ink); padding:0; margin-bottom:0; }
.ozf-field > legend{ margin-bottom:8px; }
.ozf-field i{ font-style:normal; color:var(--ink-3); }
.ozf-field input, .ozf-field select, .ozf-field textarea{ font:inherit; font-size:1rem; padding:11px 13px; border-radius:11px; border:1.5px solid var(--line-2); background:var(--paper); color:var(--ink); width:100%; }
.ozf-field input:focus, .ozf-field select:focus, .ozf-field textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-tint); }
.ozf-field textarea{ resize:vertical; min-height:96px; }
.ozf-checks{ display:flex; flex-wrap:wrap; gap:8px; }
.ozf-chip{ position:relative; cursor:pointer; }
.ozf-chip input{ position:absolute; opacity:0; width:1px; height:1px; }
.ozf-chip span{ display:inline-flex; padding:8px 15px; border:1.5px solid var(--line-2); border-radius:999px; font-weight:500; font-size:.95rem; color:var(--ink-2); }
.ozf-chip input:checked + span{ background:var(--accent-tint); border-color:var(--accent); color:var(--ink); font-weight:600; }
.ozf-chip input:focus-visible + span{ outline:2.5px solid var(--accent); outline-offset:2px; }
.ozf-actions{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:4px; }
.ozf-err{ font-size:.9rem; font-weight:600; color:var(--tl-red); }
.ozf-fine{ font-size:.84rem; color:var(--ink-3); }
.ozf-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.ozf-success{ text-align:center; padding:12px 4px; }
.ozf-check{ width:56px; height:56px; border-radius:50%; background:var(--accent-tint); color:var(--ink); display:grid; place-items:center; margin:0 auto 18px; }
.ozf-check svg{ width:28px; height:28px; }
.ozf-success h2{ font-size:1.8rem; letter-spacing:-.02em; }
.ozf-success p{ color:var(--ink-2); margin:10px 0 22px; }

/* ---------- Header width ----------
   The wireframe collapses the header to the menu button at 1180px, but the full menu needs
   about 1140px at its spacing, so laptop windows and zoomed browsers got the button.
   Tighten the spacing below 1240px and keep the full menu down to 1024px. */
@media (max-width:1240px){
  :root{ --gutter:20px; }
  .nav{ gap:10px; }
  .nav-links{ margin-left:6px; gap:0; }
  .nav-link{ padding:8px 8px; font-size:.9rem; }
  .nav-actions .btn-s{ padding:9px 14px; font-size:.9rem; }
}
@media (min-width:1024px) and (max-width:1180px){
  .nav-links, .nav-actions{ display:flex; }
  .burger{ display:none; }
  .mobile-nav.open{ display:none; }
}

/* ---------- Pricing: "Contact for Pricing" in a plan's price slot ---------- */
.tier-prices dd.price-contact{ font-size:1.25rem; letter-spacing:-.01em; line-height:1.3; }
.tier-prices dd.price-contact a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--line-2); text-decoration-thickness:2px; text-underline-offset:4px; }
.tier-prices dd.price-contact a:hover{ text-decoration-color:var(--ink); }

/* ---------- Blog listing: previous ozette.com layout (thumbnail left, text right) ---------- */
.feed{ display:flex; flex-direction:column; }
.feed-item{ display:grid; grid-template-columns:minmax(0,420px) minmax(0,1fr); gap:clamp(20px, 3vw, 36px); align-items:center; padding:34px 0; border-top:1px solid var(--line); color:inherit; text-decoration:none; }
.feed-item:first-child{ border-top:0; padding-top:0; }
.feed-thumb{ aspect-ratio:420 / 260; border-radius:14px; overflow:hidden; border:1px solid var(--line); background:var(--mist); }
.feed-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease; }
.feed-item:hover .feed-thumb img{ transform:scale(1.02); }
.feed-ph{ position:relative; width:100%; height:100%; display:flex; align-items:flex-end; padding:16px 18px; background:radial-gradient(130% 120% at 0% 0%, var(--accent-tint), transparent 55%), var(--mist); }
.feed-ph::before{ content:""; position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg,#6E3CBF 0%,#185FA5 22%,#1D9E75 44%,#C9A227 64%,#D85A30 82%,#C0392B 100%); }
.feed-ph span{ font-weight:600; color:var(--ink-2); }
.feed-when, .evc-when{ font-size:.8rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-3); margin-bottom:10px; }
.feed-item h2{ font-size:clamp(1.25rem, 1.1rem + .5vw, 1.5rem); line-height:1.25; letter-spacing:-.015em; margin-bottom:10px; }
.feed-sum{ color:var(--ink-2); margin-bottom:14px; }
.feed-more, .evc-more{ display:inline-flex; align-items:center; gap:6px; font-weight:600; color:var(--ink); }
.feed-more svg, .evc-more svg{ width:18px; height:18px; flex:none; transition:transform .15s ease; }
.feed-item:hover .feed-more svg, .evc-card:hover .evc-more svg{ transform:translateX(3px); }
.feed-item:hover h2, .evc-card:hover h2{ text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; }
@media (max-width:780px){ .feed-item{ grid-template-columns:minmax(0,1fr); gap:16px; } }

/* ---------- Events listing: previous ozette.com layout (two-column flyer cards) ---------- */
.evc-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:28px; align-items:stretch; }
@media (max-width:760px){ .evc-grid{ grid-template-columns:minmax(0,1fr); } }
.evc-card{ display:flex; flex-direction:column; background:var(--panel); border:1px solid var(--line); border-radius:18px; overflow:hidden; color:inherit; text-decoration:none; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.evc-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-s); border-color:var(--line-2); }
@media (prefers-reduced-motion: reduce){ .evc-card, .evc-card:hover, .feed-thumb img{ transition:none; transform:none; } }
.evc-thumb{ aspect-ratio:16 / 9; overflow:hidden; background:var(--mist); }
.evc-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.evc-body{ display:flex; flex-direction:column; flex:1; padding:24px 26px 26px; }
.evc-card h2{ font-size:clamp(1.2rem, 1.1rem + .4vw, 1.4rem); line-height:1.25; letter-spacing:-.015em; margin-bottom:12px; }
.evc-sum{ color:var(--ink-2); margin-bottom:18px; flex:1; }
.evc-more{ margin-top:auto; }

/* ---------- Case studies: previous ozette.com layout (image cards, 3 across) ---------- */
.csc-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:22px; align-items:stretch; }
.csc-grid.two{ grid-template-columns:repeat(2, minmax(0,1fr)); }
@media (max-width:900px){ .csc-grid, .csc-grid.two{ grid-template-columns:minmax(0,1fr); } }
.csc-card{ display:flex; flex-direction:column; background:var(--panel); border:1px solid var(--line); border-radius:16px; overflow:hidden; color:inherit; text-decoration:none; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.csc-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-s); border-color:var(--line-2); }
@media (prefers-reduced-motion: reduce){ .csc-card, .csc-card:hover{ transition:none; transform:none; } }
.csc-thumb{ aspect-ratio:16 / 9; overflow:hidden; background:var(--mist); }
.csc-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.csc-body{ display:flex; flex-direction:column; flex:1; gap:8px; padding:22px 22px 24px; }
.csc-label{ font-size:.8rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-3); }
.csc-card h2{ font-size:clamp(1.15rem, 1.05rem + .35vw, 1.3rem); line-height:1.25; letter-spacing:-.015em; }
.csc-sum{ color:var(--ink-2); font-size:.97rem; line-height:1.55; flex:1; }
.csc-more{ display:inline-flex; align-items:center; gap:6px; margin-top:8px; font-weight:600; color:var(--ink); }
.csc-more svg{ width:18px; height:18px; flex:none; transition:transform .15s ease; }
.csc-card:hover .csc-more svg{ transform:translateX(3px); }
.csc-card:hover h2{ text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; }

/* ---------- About: "Proudly backed by" logos ----------
   The investor logo files are white on transparent (made for the old dark site), so on the
   wireframe's white tiles they were invisible. Light: render them dark; dark mode: dark tiles,
   logos in their original white. */
.backer img{ filter:brightness(0); opacity:.82; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .backer{ background:var(--panel); }
  :root:not([data-theme="light"]) .backer img{ filter:none; opacity:.92; }
  :root:not([data-theme="light"]) .backer span{ color:var(--ink-2); }
}
:root[data-theme="dark"] .backer{ background:var(--panel); }
:root[data-theme="dark"] .backer img{ filter:none; opacity:.92; }
:root[data-theme="dark"] .backer span{ color:var(--ink-2); }
