/* Tamem website v2. Built on Tamem Brand System 2.0.
   Layout concept: one continuous surface that shifts between graphite and paper as you scroll; pixels gather into blocks, blocks into the mark, the mark into the agent.
   Anchors: neon #E6FF00 (dark surfaces only), graphite #171A1B, vermilion #EF5148, paper #F5F5EF. */

:root{
  --neon:#E6FF00; --neon-2:#EFFF73; --graphite:#171A1B; --g2:#1E2322; --g3:#262E2A; --g4:#39433E;
  --verm:#EF5148; --verm-deep:#AD302A; --verm-soft:#FF9A90; --paper:#F5F5EF; --white:#FFFFFF; --mist:#E9ECE7; --stone:#D0D6D0; --slate:#89968F; --moss:#4E5A54; --fog:#B4BEB8;
  --f:"Montserrat", ui-sans-serif, system-ui, "Segoe UI", Tahoma, Arial, sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1); --spring:cubic-bezier(.34,1.32,.5,1);
  --r-ctl:6px; --r-card:14px; --r-media:20px;
  --gut:max(clamp(20px,4vw,48px), env(safe-area-inset-left,0px));
  --gut-r:max(clamp(20px,4vw,48px), env(safe-area-inset-right,0px));
  --max:1240px; --header-h:72px; --velo:0;
  color-scheme:dark;
  --bg:var(--graphite); --bg2:var(--g2); --surface:var(--g3); --surface2:#2B3430; --fg:var(--paper); --muted:var(--fog); --line:rgba(137,150,143,.22);
  --accent:var(--neon); --accent-2:var(--neon-2); --ink:var(--graphite); --accent-soft:rgba(230,255,0,.1); --red-text:var(--verm-soft); --chip:rgba(245,245,239,.06); --focus:var(--neon);
  --sb-a:var(--neon); --sb-b:var(--graphite);
}
[data-theme="dark"]{
  color-scheme:dark;
  --bg:var(--graphite); --bg2:var(--g2); --surface:var(--g3); --surface2:#2B3430; --fg:var(--paper); --muted:var(--fog); --line:rgba(137,150,143,.22);
  --accent:var(--neon); --accent-2:var(--neon-2); --ink:var(--graphite); --accent-soft:rgba(230,255,0,.1); --red-text:var(--verm-soft); --chip:rgba(245,245,239,.06); --focus:var(--neon);
}
[data-theme="light"]{
  color-scheme:light;
  --bg:var(--paper); --bg2:#EDEEE7; --surface:var(--white); --surface2:var(--paper); --fg:var(--graphite); --muted:var(--moss); --line:rgba(23,26,27,.12);
  --accent:var(--graphite); --accent-2:var(--g4); --ink:var(--paper); --accent-soft:rgba(23,26,27,.06); --red-text:var(--verm-deep); --chip:rgba(23,26,27,.05); --focus:var(--graphite);
  --sb-a:var(--graphite); --sb-b:var(--paper);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--graphite); -webkit-text-size-adjust:100%; scroll-padding-top:calc(var(--header-h) + 16px); scroll-behavior:smooth}
body{margin:0; background:var(--bg); color:var(--fg); font-family:var(--f); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden}
main>section[data-theme]{background:var(--bg); color:var(--fg)}
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:60; background:var(--graphite)}
img,svg,canvas{display:block; max-width:100%}
a{color:inherit}
p{margin:0}
h1,h2,h3,h4{margin:0; font-weight:600; letter-spacing:-.025em; text-wrap:balance}
ul,ol{margin:0; padding:0; list-style:none}
button{font:inherit; color:inherit}
::selection{background:var(--accent); color:var(--ink)}
:focus-visible{outline:2px solid var(--focus); outline-offset:3px; border-radius:4px}
.sr-only{position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.skip{position:fixed; left:16px; top:-80px; z-index:400; background:var(--neon); color:var(--graphite); padding:12px 16px; border-radius:var(--r-ctl); font-weight:600; text-decoration:none}
.skip:focus{top:calc(16px + env(safe-area-inset-top,0px))}

/* Shared transitions so the surface shift feels like one material */
.card,.chip,.btn,.tile,.faq details,.facts li,.choice,.pick,.icard,.line{transition:background-color .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease)}
.site-header{transition:background-color .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease)}

/* ---------- Scrollbars: native, quiet, usable ---------- */
html{scrollbar-width:thin; scrollbar-color:#6B7671 transparent}
::-webkit-scrollbar{width:10px; height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#6B7671; border-radius:6px; border:2px solid transparent; background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background-color:#89968F}
.scroller{scrollbar-width:thin; scrollbar-color:var(--muted) transparent}

/* ---------- Page transitions: native cross-document view transitions ---------- */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .28s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:vt-in .42s cubic-bezier(.2,.8,.2,1) both}
@keyframes vt-out{to{opacity:0; transform:translateY(-10px)}}
@keyframes vt-in{from{opacity:0; transform:translateY(14px)}}

/* ---------- Layout ---------- */
.wrap{width:100%; max-width:calc(var(--max) + 96px); margin-inline:auto; padding-left:var(--gut); padding-right:var(--gut-r)}
.sec{position:relative; padding-block:clamp(72px,8vw,120px)}
.sec-sm{position:relative; padding-block:clamp(56px,7vw,104px)}
.stack{display:grid; gap:20px; align-content:start}
.row{display:flex; flex-wrap:wrap; gap:12px; align-items:center}

/* ---------- Type ---------- */
.eyebrow{display:inline-flex; align-items:center; gap:10px; font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--muted)}
.eyebrow::before{content:""; width:8px; height:8px; background:var(--verm); flex:none}
.display{font-size:clamp(44px,6.6vw,92px); line-height:1.02; letter-spacing:-.035em; font-weight:600}
.h1{font-size:clamp(36px,4.8vw,64px); line-height:1.06; letter-spacing:-.03em}
.h2{font-size:clamp(30px,3.8vw,52px); line-height:1.08; letter-spacing:-.03em}
.h3{font-size:clamp(20px,1.8vw,24px); line-height:1.25; letter-spacing:-.015em}
.lead{font-size:clamp(17px,1.4vw,20px); line-height:1.55; color:var(--muted); max-width:56ch}
.muted{color:var(--muted)}
.small{font-size:14px; line-height:1.5}
.num{font-variant-numeric:tabular-nums}
.accent{color:var(--accent)}
.link{color:var(--red-text); text-decoration:underline; text-underline-offset:3px}
.sec-head{display:grid; gap:18px; max-width:760px; margin-bottom:clamp(40px,5vw,72px)}
.sec-head.center{margin-inline:auto; text-align:center; justify-items:center}

/* ---------- Icons ---------- */
.ic-line{fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round}
.ico{width:44px; height:44px; display:grid; place-items:center; border-radius:10px; background:rgba(239,81,72,.14); color:var(--fg); flex:none}
.ico svg{width:22px; height:22px}
.ico.lg{width:56px; height:56px; border-radius:12px}
.ico.lg svg{width:28px; height:28px}
.ico.sm{width:32px; height:32px; border-radius:8px}
.ico.sm svg{width:17px; height:17px}
.ico.acc{background:var(--accent-soft); color:var(--accent)}

/* ---------- Buttons, chips ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:50px; padding:0 22px; border-radius:var(--r-ctl); font-weight:600; font-size:15px; text-decoration:none; cursor:pointer; border:1px solid transparent; white-space:nowrap;
  transform:translate3d(var(--mx,0),var(--my,0),0)}
.btn-primary{background:var(--accent); color:var(--ink)}
.btn-primary:hover{background:var(--accent-2)}
.btn-ghost{background:transparent; color:var(--fg); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--fg)}
.btn .blk{width:8px; height:8px; background:var(--verm); flex:none; transition:transform .25s var(--spring)}
.btn:hover .blk{transform:translateX(4px) rotate(90deg)}
.btn-lg{min-height:58px; padding:0 28px; font-size:16px}
.btn-sm{min-height:42px; padding:0 16px; font-size:14px}
.btn:disabled{opacity:.45; cursor:not-allowed}
.chip{display:inline-flex; align-items:center; gap:10px; padding:8px 14px 8px 8px; border-radius:var(--r-ctl); background:var(--chip); border:1px solid var(--line); font-size:14px; font-weight:500; text-decoration:none; color:var(--fg)}
.chip .ico{width:28px; height:28px; border-radius:6px}
.chip .ico svg{width:16px; height:16px}
a.chip:hover{border-color:var(--fg)}
.tag{display:inline-flex; align-items:center; gap:8px; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; padding:5px 9px; border-radius:var(--r-ctl); border:1px solid var(--line); color:var(--muted)}
.tag i{width:6px; height:6px; background:var(--accent)}
.tag.red i{background:var(--verm)}
.more{display:inline-flex; align-items:center; gap:10px; font-weight:600; font-size:14px; cursor:pointer; color:var(--fg); list-style:none; padding:6px 0; border-bottom:1px solid var(--line); width:max-content}
.more::-webkit-details-marker{display:none}
.more .px{position:relative; width:10px; height:10px}
.more .px::before,.more .px::after{content:""; position:absolute; left:0; right:0; top:4px; height:2px; background:var(--verm); transition:transform .3s var(--spring)}
.more .px::after{transform:rotate(90deg)}
details[open]>.more .px::after{transform:rotate(0)}
details[open]>.more .t-open{display:none}
details:not([open])>.more .t-close{display:none}
.more-body{padding-top:16px; animation:fadeup .4s var(--ease)}
@keyframes fadeup{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}

/* ---------- Header ---------- */
.site-header{position:fixed; top:env(safe-area-inset-top,0px); left:0; right:0; z-index:70; height:var(--header-h); color:var(--fg); border-bottom:1px solid transparent}
.site-header .wrap{height:100%; display:flex; align-items:center; justify-content:space-between; gap:24px}
.site-header.is-scrolled{background:color-mix(in srgb,var(--bg) 82%,transparent); border-color:var(--line); backdrop-filter:saturate(140%) blur(14px); -webkit-backdrop-filter:saturate(140%) blur(14px)}
.brand{display:flex; align-items:center; text-decoration:none; flex:none}
.brand svg{height:30px; width:auto}
.lg-mark{fill:var(--accent); transition:fill .35s var(--ease)}
.lg-word{fill:var(--fg); transition:fill .35s var(--ease)}
.lg-foot{fill:var(--verm)}
.nav{display:flex; align-items:center; gap:2px}
.nav-link{position:relative; text-decoration:none; font-size:15px; font-weight:500; padding:10px 14px}
.nav-link::after{content:""; position:absolute; left:14px; right:14px; bottom:4px; height:2px; background:var(--verm); transform:scaleX(0); transform-origin:left; transition:transform .25s var(--ease)}
.nav-link:hover::after,.nav-link[aria-current="page"]::after{transform:scaleX(1)}
.nav .btn{margin-left:12px}
.menu-btn{display:none; align-items:center; gap:10px; min-height:44px; padding:0 14px; background:transparent; border:1px solid var(--line); border-radius:var(--r-ctl); cursor:pointer; font-weight:600; font-size:14px}
.menu-btn .bars{display:grid; gap:4px}
.menu-btn .bars i{display:block; width:16px; height:2px; background:currentColor}
@media (max-width:899px){.nav{display:none}.menu-btn{display:inline-flex}}
.mobile-menu{position:fixed; inset:0; z-index:90; background:var(--graphite); color:var(--paper); display:flex; flex-direction:column;
  padding:calc(env(safe-area-inset-top,0px) + 16px) var(--gut-r) calc(env(safe-area-inset-bottom,0px) + 24px) var(--gut);
  clip-path:inset(0 0 100% 0); transition:clip-path .5s var(--ease); visibility:hidden}
.mobile-menu.open{clip-path:inset(0 0 0 0); visibility:visible}
.mobile-menu .top{display:flex; justify-content:space-between; align-items:center; height:56px}
.mobile-menu .brand .lg-mark{fill:var(--neon)}.mobile-menu .brand .lg-word{fill:var(--paper)}
.mobile-menu nav{display:flex; flex-direction:column; margin-top:28px}
.mobile-menu nav a{font-size:clamp(30px,8vw,44px); font-weight:600; letter-spacing:-.02em; text-decoration:none; padding:10px 0; border-bottom:1px solid var(--g4); display:flex; justify-content:space-between; align-items:center}
.mobile-menu nav a .blk{width:12px; height:12px; background:var(--neon)}
.mobile-menu nav a[aria-current="page"] .blk{background:var(--verm)}
.mobile-menu .close{min-height:44px; padding:0 14px; background:transparent; border:1px solid var(--g4); border-radius:var(--r-ctl); color:var(--paper); cursor:pointer; font-weight:600}
.mobile-menu .foot{margin-top:auto; color:var(--fog); font-size:14px}

/* ---------- Hero ---------- */
.hero{position:relative; padding:calc(var(--header-h) + 8px) 12px 12px; min-height:min(100svh,980px); display:flex}
.hero-frame{position:relative; flex:1; border-radius:var(--r-media); overflow:hidden; isolation:isolate; display:flex; background:var(--graphite)}
.hero-frame>.dimg{position:absolute; inset:0; border-radius:0}
.hero-frame>.dimg img,.hero-frame>.dimg canvas{width:100%; height:100%}
.hero-frame::after{content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,rgba(23,26,27,.86) 0%,rgba(23,26,27,.6) 32%,rgba(23,26,27,.1) 58%,rgba(23,26,27,0) 72%)}
.hero-inner{position:relative; z-index:2; display:flex; flex-direction:column; justify-content:flex-end; gap:28px; padding:clamp(28px,5vw,72px); width:100%; pointer-events:none; color:var(--paper)}
.hero-inner a,.hero-inner button{pointer-events:auto}
.hero-copy{display:grid; gap:24px; max-width:720px}
.hero-copy .lead{color:#D0D6D0}
.hero .display .ln{display:block; overflow:hidden; padding-bottom:.06em}
.hero .display .ln>span{display:inline-block}
.hero-foot{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap}
.trust{display:flex; flex-wrap:wrap; gap:8px}
.trust .chip{background:rgba(23,26,27,.55); border-color:rgba(245,245,239,.16); color:var(--paper); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); font-size:13px}
.trust .chip .ico{background:rgba(230,255,0,.14); color:var(--neon)}
.prompt{display:inline-flex; align-items:center; gap:10px; padding:10px 14px; border-radius:var(--r-ctl); background:rgba(23,26,27,.6); border:1px solid rgba(245,245,239,.16); font-size:13px; color:var(--paper); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px)}
.prompt i{width:8px; height:8px; background:var(--neon); animation:blink 1.6s steps(2) infinite}
.prompt.done i{background:var(--verm); animation:none}
@keyframes blink{50%{opacity:.2}}
.hero.sub{min-height:auto}
.hero.sub .hero-frame{min-height:min(78svh,720px)}
.hero.split .hero-frame{background:var(--bg); display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:stretch}
.hero.split .hero-frame::after{display:none}
.hero.split .hero-inner{color:var(--fg); justify-content:center; padding:clamp(28px,5vw,64px) 0 clamp(28px,5vw,64px) clamp(12px,3vw,48px)}
.hero.split .hero-copy .lead{color:var(--muted)}
.hero.split .side{position:relative; min-height:420px; display:grid}
.hero.split .side .dimg{position:absolute; inset:0}
@media (max-width:899px){
  .hero{padding:calc(var(--header-h) + 4px) 8px 8px}
  .hero-frame::after{background:linear-gradient(0deg,rgba(23,26,27,.95) 0%,rgba(23,26,27,.78) 45%,rgba(23,26,27,.2) 75%,rgba(23,26,27,.1) 100%)}
  .hero:not(.split) .hero-inner{padding-top:40vh}
  .hero.split .hero-frame{grid-template-columns:minmax(0,1fr)}
  .hero.split .hero-inner{padding:24px 12px 8px}
  .hero.split .side{min-height:300px}
}
.crumbs{display:flex; gap:10px; font-size:13px; color:var(--muted); flex-wrap:wrap}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--fg)}
.crumbs [aria-current]{color:var(--fg)}

/* ---------- Dither image ---------- */
.dimg{position:relative; overflow:hidden; border-radius:var(--r-media); background:var(--graphite); margin:0; isolation:isolate}
.dimg img{width:100%; height:100%; object-fit:cover; display:block}
.dimg canvas{position:absolute; inset:0; width:100%; height:100%; pointer-events:none}
.dimg figcaption{position:absolute; left:14px; bottom:14px; z-index:2}

/* ---------- Build story ---------- */
.build{position:relative; height:330vh}
.build-sticky{position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); align-items:center}
.build-stage{position:relative; height:100%; min-width:0; display:grid; place-items:center; padding:calc(var(--header-h) + 8px) var(--gut-r) 24px 0}
.am-build{width:100%; height:100%; max-height:760px}
.am-build svg{width:100%; height:100%}
.fly .ic-tile{fill:var(--surface); stroke:var(--line); stroke-width:1}
.fly .ic-line{stroke:var(--fg); stroke-width:1.75}
.fly[data-p="check"] .ic-tile{fill:rgba(239,81,72,.14)}
.float{animation:float 5s ease-in-out infinite; transform-box:fill-box}
@keyframes float{50%{transform:translate(0,-6px)}}
.build-copy{position:relative; height:100%; padding-left:var(--gut); display:flex; flex-direction:column; justify-content:center; z-index:2}
.panels{position:relative; min-height:400px}
.panel{position:absolute; inset:0 0 auto 0; display:grid; gap:20px; align-content:start; opacity:0; transform:translateY(24px); pointer-events:none; visibility:hidden; transition:opacity .45s var(--ease), transform .45s var(--ease), visibility 0s .45s}
.panel.on{opacity:1; transform:none; pointer-events:auto; visibility:visible; transition:opacity .45s var(--ease), transform .45s var(--ease), visibility 0s}
.panel.past{transform:translateY(-24px)}
.panel .num-l{font-size:13px; font-weight:600; letter-spacing:.14em; color:var(--red-text)}
.panel .chips{display:flex; flex-wrap:wrap; gap:8px}
.phase-rail{display:flex; gap:6px; margin-bottom:32px}
.phase-rail i{width:22px; height:6px; border-radius:3px; background:var(--g4); transition:background-color .3s var(--ease), width .4s var(--spring)}
.phase-rail i.on{background:var(--accent); width:38px}
.phase-rail i.done{background:var(--accent)}
.build-hint{position:absolute; right:var(--gut-r); bottom:24px; z-index:3; display:flex; gap:10px; align-items:center; font-size:12px; color:var(--muted); padding:8px 12px; border-radius:var(--r-ctl); background:var(--chip); border:1px solid var(--line)}
.build-hint i{width:6px; height:6px; background:var(--accent)}
@media (max-width:899px){
  .build{height:300vh}
  .build-sticky{grid-template-columns:minmax(0,1fr); grid-template-rows:50% 50%}
  .build-stage{order:-1; padding:calc(var(--header-h)) 8px 0}
  .build-copy{padding:0 var(--gut-r) 24px var(--gut); justify-content:flex-start}
  .panels{min-height:280px}
  .panel .lead{font-size:16px}
  .phase-rail{margin-bottom:14px}
  .build-hint{display:none}
}
.reduced .build{height:auto}
.reduced .build-sticky{position:relative; height:auto; grid-template-columns:minmax(0,1fr)}
.reduced .build-stage{height:60vh}
.reduced .panels{min-height:0; display:grid; gap:40px; padding-block:40px}
.reduced .panel{position:relative; opacity:1; transform:none; pointer-events:auto; visibility:visible}

/* ---------- Agent mark (vector, never pixelated) ---------- */
.am{position:relative; display:block}
.am svg{display:block; width:100%; height:auto; overflow:visible}
.am .y{fill:var(--accent); transition:fill .6s var(--ease)}
.am .r{fill:var(--verm)}
.am .dim .y,.am .dim .r{fill:#2F3834}
[data-theme="light"] .am .dim .y,[data-theme="light"] .am .dim .r{fill:#E1E4DF}
.am-dark .y{fill:var(--neon)}
.am[data-mode="interactive"] svg{cursor:pointer}
.am-hero{width:min(100%,440px)}
.am-contact{width:min(100%,220px); margin-inline:auto}
.am-pin{width:min(100%,300px)}
.am-piece{width:100%; max-width:200px; align-self:center}
.am-buddy{width:48px; flex:none}
.cta-face .am{width:100%}

/* ---------- Marquee ---------- */
.marquee{overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex; gap:12px; width:max-content; animation:mq 40s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee .chip{padding:10px 18px 10px 10px; font-size:15px}
.marquee.rev .marquee-track{animation-direction:reverse; animation-duration:46s}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- People tiles ---------- */
.people{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:20px; align-items:stretch; height:clamp(620px,78vh,860px)}
.people-side{display:grid; gap:20px; grid-template-rows:1fr 1fr}
.person{display:grid; grid-template-rows:minmax(0,1fr) auto; gap:16px; text-decoration:none; color:inherit; min-height:0}
.person .dimg{min-height:0; height:100%}
.person .cap{display:flex; gap:14px; align-items:flex-start}
.person h3{font-size:19px}
.person p{color:var(--muted); font-size:15px}
.person:hover h3{text-decoration:underline; text-decoration-color:var(--verm); text-underline-offset:4px}
@media (max-width:899px){.people{grid-template-columns:minmax(0,1fr); height:auto}.people-side{grid-template-rows:auto}.person .dimg,.people>.person .dimg{min-height:0; height:auto; aspect-ratio:4/3}}

/* ---------- Service tiles (bento) ---------- */
.bento{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:16px}
.tile{position:relative; grid-column:span 2; display:grid; gap:14px; align-content:start; text-align:left; padding:26px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line); cursor:pointer; min-height:240px; overflow:hidden; color:var(--fg)}
.tile:hover{border-color:var(--fg); transform:translateY(-4px)}
.tile .top{display:flex; justify-content:space-between; align-items:flex-start; gap:12px}
.tile h3{font-size:22px; line-height:1.2}
.tile p{color:var(--muted); font-size:15px}
.tile .foot{display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:8px; font-size:13px; font-weight:600}
.tile .foot .go{display:inline-flex; gap:8px; align-items:center}
.tile .foot .go i{width:6px; height:6px; background:var(--verm); transition:transform .3s var(--spring)}
.tile:hover .foot .go i{transform:translateX(5px) rotate(90deg)}
.tile .glyph{position:absolute; right:-6px; bottom:-6px; width:120px; height:110px; opacity:.9; pointer-events:none}
.tile .mini-icons{display:flex; gap:6px; color:var(--muted)}
.tile .mini-icons svg{width:18px; height:18px}
@media (max-width:899px){.bento{grid-template-columns:minmax(0,1fr)}.tile,.tile:nth-child(1),.tile:nth-child(2){grid-column:auto}}

/* ---------- Dialog sheet ---------- */
dialog.dlg{position:fixed; inset:0 0 0 auto; margin:0; height:100%; max-height:100%; width:min(560px,100%); padding:0; border:0; background:var(--surface); color:var(--fg); box-shadow:-30px 0 80px rgba(0,0,0,.35)}
dialog.dlg::backdrop{background:rgba(10,12,12,.55); backdrop-filter:blur(3px)}
dialog.dlg[open]{animation:sheet .45s var(--ease)}
@keyframes sheet{from{transform:translateX(40px); opacity:0}to{transform:none; opacity:1}}
.dlg-in{height:100%; overflow:auto; padding:28px clamp(20px,4vw,40px) 40px; display:grid; gap:24px; align-content:start}
.dlg-top{display:flex; justify-content:space-between; align-items:center; gap:12px}
.dlg-close{min-height:44px; min-width:44px; display:grid; place-items:center; border-radius:var(--r-ctl); border:1px solid var(--line); background:transparent; cursor:pointer}
.svc-list{display:grid; gap:4px}
.svc-list li{display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; align-items:start; padding:14px 0; border-top:1px solid var(--line)}
.svc-list strong{display:block; font-weight:600}
.svc-list span{color:var(--muted); font-size:14px}
.note{display:flex; gap:12px; align-items:flex-start; padding:16px; border-radius:var(--r-card); background:var(--chip); font-size:14px}

/* ---------- Journey track ---------- */
.journey{position:relative; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; padding-top:150px}
.journey .rail{position:absolute; top:110px; left:0; right:0; height:4px; background:radial-gradient(circle,var(--g4) 1.5px,transparent 2px) 0 0/8px 4px}
.journey .rail i{position:absolute; inset:0; background:var(--neon); transform-origin:left; transform:scaleX(var(--jp,0))}
[data-theme="light"] .journey .rail i{background:var(--graphite)}
.journey .walker{position:absolute; top:0; width:100px; left:calc(var(--jp,0) * (100% - 100px)); pointer-events:none; transition:left .25s var(--ease)}
.stop{display:grid; gap:12px; align-content:start; position:relative}
.stop::before{content:""; position:absolute; top:-46px; left:0; width:16px; height:16px; background:var(--bg); border:2px solid var(--muted)}
.stop.lit::before{background:var(--neon); border-color:var(--neon)}
[data-theme="light"] .stop.lit::before{background:var(--graphite); border-color:var(--graphite)}
.stop .dur{font-size:clamp(44px,5vw,72px); line-height:1; font-weight:500; letter-spacing:-.04em; font-variant-numeric:tabular-nums}
.stop .dur small{font-size:.32em; font-weight:600; letter-spacing:0; margin-left:6px; color:var(--muted)}
.stop h3{font-size:22px}
.stop p{color:var(--muted)}
@media (max-width:799px){
  .journey{grid-template-columns:minmax(0,1fr); padding-top:0; padding-left:56px; gap:48px}
  .journey .rail{top:0; bottom:0; left:20px; right:auto; width:4px; height:auto; background:radial-gradient(circle,var(--g4) 1.5px,transparent 2px) 0 0/4px 8px}
  .journey .rail i{transform-origin:top; transform:scaleY(var(--jp,0))}
  .journey .walker{display:none}
  .stop::before{top:6px; left:-42px}
}

/* ---------- Matrix (comparison) ---------- */
.matrix-wrap{overflow-x:auto; border-radius:var(--r-card); border:1px solid var(--line); background:var(--surface)}
table.matrix{width:100%; min-width:720px; border-collapse:separate; border-spacing:0}
.matrix th,.matrix td{padding:18px 20px; text-align:left; vertical-align:middle; border-bottom:1px solid var(--line)}
.matrix thead th{font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.matrix thead th.us{color:var(--fg)}
.matrix tbody th{font-weight:600; font-size:15px}.matrix .mrow{display:flex; gap:12px; align-items:center}
.matrix td{font-size:13px; color:var(--muted)}
.matrix td.us{background:var(--chip)}
.matrix tr:last-child th,.matrix tr:last-child td{border-bottom:0}
.rate{display:inline-grid; grid-template-columns:repeat(3,14px); gap:3px; vertical-align:middle; margin-right:10px}
.rate i{width:14px; height:14px; border:1.5px solid var(--muted); background:transparent}
.rate i.f{background:var(--fg); border-color:var(--fg)}
.rate i.h{background:repeating-conic-gradient(var(--fg) 0 25%,transparent 0 50%) 0 0/4px 4px; border-color:var(--fg)}
.us .rate i.f:last-child{background:var(--verm); border-color:var(--verm)}
.legend{display:flex; gap:18px; flex-wrap:wrap; font-size:13px; color:var(--muted); margin-top:16px}
.legend span{display:inline-flex; align-items:center; gap:8px}
.legend .rate{grid-template-columns:14px; margin:0}

/* ---------- Facts + FAQ ---------- */
.two{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:clamp(32px,6vw,96px); align-items:start}
@media (min-width:900px){.two>.stick{position:sticky; top:calc(var(--header-h) + 32px)}}
@media (max-width:899px){.two{grid-template-columns:minmax(0,1fr)}}
.facts{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.facts li{display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; align-items:start; padding:18px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line)}
.facts dt,.facts strong{font-weight:600; font-size:14px; display:block}
.facts span{color:var(--muted); font-size:14px}
@media (max-width:599px){.facts{grid-template-columns:minmax(0,1fr)}}
.faq{display:grid; gap:10px}
.faq details{border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line)}
.faq summary{list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:20px; align-items:center; padding:20px 22px; font-weight:600; font-size:17px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .px{position:relative; width:14px; height:14px; flex:none}
.faq summary .px::before,.faq summary .px::after{content:""; position:absolute; left:0; right:0; top:6px; height:2px; background:currentColor; transition:transform .3s var(--spring)}
.faq summary .px::after{transform:rotate(90deg)}
.faq details[open] summary .px::after{transform:rotate(0)}
.faq details[open] summary .px::before{background:var(--verm)}
.faq .ans{padding:0 22px 22px; color:var(--muted); max-width:70ch; animation:fadeup .4s var(--ease)}

/* ---------- CTA ---------- */
.cta-frame{position:relative; border-radius:var(--r-media); overflow:hidden; min-height:560px; display:flex; align-items:flex-end; isolation:isolate}
.cta-frame>.dimg{position:absolute; inset:0; border-radius:0}
.cta-frame::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(0deg,rgba(23,26,27,.94) 0%,rgba(23,26,27,.6) 45%,rgba(23,26,27,.05) 80%); pointer-events:none}
.cta-card{position:relative; z-index:2; padding:clamp(28px,5vw,64px); display:grid; gap:22px; max-width:760px; color:var(--paper)}
.cta-card .lead{color:#D0D6D0}
.cta-face{position:absolute; right:clamp(20px,4vw,56px); bottom:clamp(20px,4vw,56px); width:clamp(110px,13vw,170px); z-index:2}
@media (max-width:699px){.cta-face{width:96px; top:20px; bottom:auto}}

/* ---------- Footer ---------- */
.site-footer{background:#101314; color:var(--paper); padding-block:clamp(56px,7vw,96px) calc(32px + env(safe-area-inset-bottom,0px)); position:relative}
.foot-grid{display:grid; grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr)); gap:40px}
.foot-grid h2{font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--fog); margin-bottom:16px}
.foot-grid ul{display:grid; gap:10px}
.foot-grid a{text-decoration:none; color:var(--paper); font-size:15px}
.foot-grid a:hover{color:var(--neon)}
.foot-brand img{width:300px; height:auto; margin-left:-11px}
.foot-brand p{color:var(--fog); font-size:14px; max-width:40ch; margin-top:14px}
.foot-buddy{display:flex; align-items:center; gap:14px; margin-top:24px; text-decoration:none; color:var(--paper); font-size:14px; padding:10px 14px 10px 10px; border:1px solid var(--g4); border-radius:var(--r-card); width:max-content; max-width:100%}
.foot-buddy:hover{border-color:var(--neon)}
.foot-base{margin-top:56px; padding-top:24px; border-top:1px solid var(--g4); display:flex; justify-content:space-between; gap:16px 32px; flex-wrap:wrap; font-size:13px; color:var(--fog)}
@media (max-width:899px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foot-brand{grid-column:1/-1}}

/* ---------- Agent face blocks ---------- */
.face-stage{position:relative; display:grid; place-items:center}
.bubble{position:relative; display:inline-flex; align-items:center; gap:10px; padding:12px 16px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line); font-size:15px; font-weight:500; max-width:100%}
.bubble::before{content:""; position:absolute; left:28px; top:-7px; width:12px; height:12px; background:inherit; border-left:1px solid var(--line); border-top:1px solid var(--line); transform:rotate(45deg)}
.bubble i{width:8px; height:8px; background:var(--verm); flex:none}
.moods{display:flex; flex-wrap:wrap; gap:8px}
.mood{display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 14px; border-radius:var(--r-ctl); border:1px solid var(--line); background:var(--chip); cursor:pointer; font-weight:600; font-size:14px; color:var(--fg); transition:border-color .2s var(--ease), background-color .2s var(--ease), transform .3s var(--spring)}
.mood:hover{border-color:var(--fg); transform:translateY(-2px)}
.mood[aria-pressed="true"]{background:var(--accent); color:var(--ink); border-color:var(--accent)}
.mood .e{font-family:ui-monospace,Menlo,monospace; font-size:13px; letter-spacing:-.05em}

/* ---------- Agent page pieces ---------- */
.agent-hero{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,5vw,80px); align-items:center; padding-top:calc(var(--header-h) + clamp(40px,6vw,80px))}
@media (max-width:899px){.agent-hero{grid-template-columns:minmax(0,1fr)}}
.badges{display:flex; flex-wrap:wrap; gap:8px}
.console{background:#0f1213; border:1px solid rgba(137,150,143,.22); border-radius:var(--r-media); overflow:hidden; color:var(--paper); min-width:0; box-shadow:0 40px 90px -50px rgba(0,0,0,.8)}
.console-bar{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; border-bottom:1px solid rgba(137,150,143,.18); font-size:12px; color:var(--fog)}
.console-bar .dots{display:flex; gap:6px}
.console-bar .dots i{width:8px; height:8px; background:var(--g4)}
.console-bar .dots i:last-child{background:var(--verm)}
.console-bar .tagx{border:1px solid rgba(137,150,143,.35); padding:3px 8px; border-radius:4px}
.console-body{padding:22px; display:grid; gap:18px}
.console-title{display:flex; justify-content:space-between; gap:16px; align-items:center; flex-wrap:wrap}
.steps{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px}
.step{display:grid; gap:8px; font-size:12px; color:var(--fog)}
.step i{display:block; height:6px; background:var(--g4); transition:background-color .2s var(--ease)}
.step.done i{background:var(--neon)}
.step.now i{background:var(--verm)}
.step.done,.step.now{color:var(--paper)}
.state{display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:600; letter-spacing:.06em; padding:4px 8px; border-radius:4px; white-space:nowrap}
.state::before{content:""; width:6px; height:6px; background:currentColor}
.state.queued{color:var(--fog); background:rgba(137,150,143,.12)}
.state.running{color:#D0D6D0; background:#39433E}
.state.review{color:#F3C47A; background:#3D301D}
.state.review::before{clip-path:polygon(50% 0,100% 100%,0 100%)}
.state.blocked{color:#FF9A90; background:#492421}
.state.done{color:#8DD7AC; background:#163B2B}
.log{display:grid; gap:6px; font-size:13px; max-height:220px; overflow:auto; padding-right:6px}
.log li{display:grid; grid-template-columns:52px minmax(0,1fr); gap:10px; color:var(--fog); opacity:0; transform:translateY(4px); transition:opacity .2s var(--ease), transform .2s var(--ease)}
.log li.in{opacity:1; transform:none}
.log li time{font-variant-numeric:tabular-nums; color:var(--slate)}
.log li b{color:var(--paper); font-weight:500}
.review-box{display:grid; gap:10px; padding:14px; border:1px dashed rgba(243,196,122,.5); border-radius:10px; font-size:13px; background:rgba(61,48,29,.35)}
.review-box .row{display:flex; justify-content:space-between; gap:12px}
.review-box .acts{display:flex; gap:8px; flex-wrap:wrap}
.review-box .acts span{border:1px solid rgba(137,150,143,.4); padding:6px 10px; border-radius:4px; font-weight:600; font-size:12px}
.review-box .acts span.pri{background:var(--neon); color:var(--graphite); border-color:var(--neon)}
.console-note{font-size:12px; color:var(--fog); border-top:1px solid rgba(137,150,143,.18); padding:12px 22px; display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap}
.demo{display:grid; grid-template-columns:260px minmax(0,1fr); gap:20px; align-items:start}
@media (max-width:899px){.demo{grid-template-columns:minmax(0,1fr)}}
.demo-tabs{display:grid; gap:8px}
@media (max-width:899px){.demo-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.demo-tab{display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:center; text-align:left; padding:14px; border-radius:var(--r-card); border:1px solid var(--line); background:transparent; cursor:pointer; color:var(--fg)}
.demo-tab:hover{border-color:var(--fg)}
.demo-tab[aria-selected="true"]{background:var(--surface); border-color:var(--accent)}
.demo-tab strong{display:block; font-size:14px}
.demo-tab small{display:block; font-size:12px; color:var(--muted)}
.icons-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px}
.icard{display:grid; gap:12px; align-content:start; padding:22px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line)}
.icard h3{font-size:17px; line-height:1.3}
.icard p{font-size:14px; color:var(--muted)}
.icard .ln{font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}
.icard:hover{border-color:var(--fg)}
@media (max-width:1039px){.icons-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:559px){.icons-grid{grid-template-columns:minmax(0,1fr)}}
.steps-pin{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,6vw,96px); align-items:start}
.steps-pin .visual{position:sticky; top:calc(var(--header-h) + 40px); display:grid; gap:18px; justify-items:center; padding:32px; border-radius:var(--r-media); background:var(--surface); border:1px solid var(--line)}
.pin-item{padding:clamp(40px,9vh,110px) 0; border-top:1px solid var(--line); display:grid; gap:14px; opacity:.35; transition:opacity .5s var(--ease)}
.pin-item.on{opacity:1}
.pin-item:first-child{border-top:0; padding-top:0}
.pin-item .n{font-size:13px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--red-text)}
@media (max-width:859px){.steps-pin{grid-template-columns:minmax(0,1fr)}.steps-pin .visual{position:relative; top:0}.pin-item{opacity:1}}
.split2{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,6vw,96px); align-items:center}
@media (max-width:899px){.split2{grid-template-columns:minmax(0,1fr)}}
.factors{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
@media (max-width:599px){.factors{grid-template-columns:minmax(0,1fr)}}
.quote-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-media); padding:32px; display:grid; gap:18px}
.quote-card .price{font-size:clamp(28px,3vw,40px); font-weight:600; letter-spacing:-.02em; line-height:1.1}

/* ---------- Services page ---------- */
.filters{display:flex; flex-wrap:wrap; gap:8px}
.filter{min-height:44px; padding:0 16px; border-radius:var(--r-ctl); border:1px solid var(--line); background:transparent; cursor:pointer; font-weight:600; font-size:14px; color:var(--fg); display:inline-flex; align-items:center; gap:8px}
.filter:hover{border-color:var(--fg)}
.filter[aria-pressed="true"]{background:var(--accent); color:var(--ink); border-color:var(--accent)}
.line{display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:clamp(24px,4vw,56px); padding:clamp(36px,5vw,56px); border-radius:var(--r-media); background:var(--surface); border:1px solid var(--line); scroll-margin-top:calc(var(--header-h) + 16px)}
.line+.line{margin-top:16px}
.line .head{display:flex; gap:18px; align-items:flex-start}
.line .meta{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.line .svc-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:6px}
.line .svc-chips .chip{font-size:13px}
.line .grid2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 24px}
@media (max-width:799px){.line{grid-template-columns:minmax(0,1fr)}.line .am-piece{width:120px; order:-1}.line .grid2{grid-template-columns:minmax(0,1fr)}}

/* ---------- Approach page ---------- */
.cards4{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px}
@media (max-width:1039px){.cards4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:559px){.cards4{grid-template-columns:minmax(0,1fr)}}
.markets{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:20px; align-items:stretch}
.markets .dimg{min-height:420px}
.mlist{display:grid; gap:12px}
.mkt{padding:22px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line); display:grid; gap:10px}
.mkt.primary{border-color:var(--accent)}
@media (max-width:899px){.markets{grid-template-columns:minmax(0,1fr)}.markets .dimg{min-height:280px}}
.std{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px}
.std .card{padding:28px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line); display:grid; gap:14px; align-content:start}
.std li{display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:start; padding:10px 0; border-top:1px solid var(--line)}
.std li span{color:var(--muted); font-size:14px; display:block}
.yes,.no{width:20px; height:20px; display:grid; place-items:center; margin-top:2px}
.yes svg,.no svg{width:18px; height:18px}
.yes{color:var(--fg)}
.no{color:var(--verm)}
@media (max-width:759px){.std{grid-template-columns:minmax(0,1fr)}}

/* ---------- Contact form ---------- */
.contact{display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:clamp(24px,4vw,64px); align-items:start; padding-top:calc(var(--header-h) + clamp(32px,5vw,64px))}
@media (max-width:959px){.contact{grid-template-columns:minmax(0,1fr)}}
.form-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-media); padding:clamp(22px,3vw,40px); display:grid; gap:26px; min-width:0}
.form-steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px}
.form-steps li{display:grid; gap:8px; font-size:13px; font-weight:600; color:var(--muted)}
.form-steps li i{height:6px; background:var(--line); display:block; transition:background-color .3s var(--ease)}
.form-steps li.done i{background:var(--fg)}
.form-steps li.now i{background:var(--verm)}
.form-steps li.now,.form-steps li.done{color:var(--fg)}
fieldset{border:0; margin:0; padding:0; display:grid; gap:22px; min-width:0}
legend{font-size:24px; font-weight:600; letter-spacing:-.02em; padding:0; margin-bottom:2px}
.fs-hint{color:var(--muted); font-size:15px; margin-top:-10px}
.choices{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
@media (max-width:559px){.choices{grid-template-columns:minmax(0,1fr)}}
.choice{position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 14px; border:1px solid var(--line); border-radius:var(--r-card); cursor:pointer; background:var(--surface)}
.choice:hover{border-color:var(--muted)}
.choice input{position:absolute; opacity:0; pointer-events:none}
.choice strong{display:block; font-size:15px; font-weight:600}
.choice small{display:block; font-size:13px; color:var(--muted)}
.choice .box{width:22px; height:22px; border:2px solid var(--muted); display:grid; place-items:center; transition:background-color .2s var(--ease), border-color .2s var(--ease)}
.choice .box::after{content:""; width:10px; height:10px; background:var(--ink); transform:scale(0); transition:transform .25s var(--spring)}
.choice:has(input:checked){border-color:var(--fg); background:var(--chip)}
.choice:has(input:checked) .box{background:var(--accent); border-color:var(--accent)}
.choice:has(input:checked) .box::after{transform:scale(1)}
.choice:has(input:focus-visible){outline:2px solid var(--focus); outline-offset:3px}
.group{display:grid; gap:10px; border:0; padding:0; margin:0}
.group>legend,.group .glabel{font-size:14px; font-weight:600; letter-spacing:0; margin-bottom:4px}
.picks{display:flex; flex-wrap:wrap; gap:8px}
.pick{position:relative; display:inline-flex; align-items:center; gap:10px; min-height:44px; padding:0 14px 0 12px; border-radius:var(--r-ctl); border:1px solid var(--line); background:var(--surface); cursor:pointer; font-size:14px; font-weight:500}
.pick input{position:absolute; opacity:0; pointer-events:none}
.pick .dot{width:10px; height:10px; border:2px solid var(--muted); transition:background-color .2s var(--ease), border-color .2s var(--ease), transform .3s var(--spring)}
.pick:hover{border-color:var(--muted)}
.pick:has(input:checked){background:var(--accent); color:var(--ink); border-color:var(--accent)}
.pick:has(input:checked) .dot{background:var(--verm); border-color:var(--verm); transform:rotate(45deg)}
.pick:has(input:focus-visible){outline:2px solid var(--focus); outline-offset:3px}
.fields{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px}
.fields .full{grid-column:1/-1}
@media (max-width:559px){.fields{grid-template-columns:minmax(0,1fr)}}
.field{display:grid; gap:8px; min-width:0}
.field label{font-size:14px; font-weight:600}
.opt{font-weight:400; color:var(--muted)}
.field input,.field textarea{width:100%; min-height:50px; padding:12px 14px; font:inherit; font-size:16px; color:var(--fg); background:var(--bg); border:1px solid var(--line); border-radius:var(--r-ctl)}
.field textarea{min-height:120px; resize:vertical}
.field input:hover,.field textarea:hover{border-color:var(--muted)}
.field input:focus,.field textarea:focus{outline:2px solid var(--focus); outline-offset:3px; border-color:var(--fg)}
.hint{font-size:13px; color:var(--muted)}
.err{font-size:13px; color:var(--red-text); display:none; align-items:center; gap:6px; font-weight:500}
.err::before{content:""; width:6px; height:6px; background:currentColor}
.invalid .err,.err.show{display:flex}
.field.invalid input,.field.invalid textarea{border-color:var(--verm-deep)}
.form-nav{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:center; border-top:1px solid var(--line); padding-top:22px}
.success{display:grid; gap:18px}
.ok{display:inline-flex; align-items:center; gap:10px; font-weight:600; color:#216746; background:#E2F3E9; padding:8px 12px; border-radius:var(--r-ctl); width:max-content; max-width:100%}
.ok svg{width:18px; height:18px}
.success pre{white-space:pre-wrap; word-break:break-word; font:inherit; font-size:14px; background:var(--bg); border:1px solid var(--line); border-radius:var(--r-card); padding:18px; margin:0; max-height:300px; overflow:auto}
.email-chip{font-weight:600; user-select:all; padding:10px 12px; background:var(--chip); border:1px solid var(--line); border-radius:var(--r-ctl); width:max-content; max-width:100%}
.side-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-media); padding:28px; display:grid; gap:14px}
.next li{display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; padding:14px 0; border-top:1px solid var(--line)}
.next li:first-child{border-top:0}
.next strong{display:block}
.next span{color:var(--muted); font-size:14px}

/* ---------- Reveal ---------- */
.js [data-reveal]{opacity:0; transform:translate3d(0,36px,0) scale(.985)}
.js [data-reveal].in{opacity:1; transform:none; transition:opacity .9s var(--ease), transform .9s var(--spring)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1; transform:none}
  .marquee-track{flex-wrap:wrap; width:auto}
  html.tt-enter body::after{display:none}
}

/* ---------- Small fixes ---------- */
.filter svg{width:18px; height:18px}
.chip svg{flex:none}
.hero .row .btn-ghost:hover{border-color:var(--paper)!important}
.svc-list.grid2{grid-template-columns:repeat(2,minmax(0,1fr)); display:grid; column-gap:24px}
@media (max-width:799px){.svc-list.grid2{grid-template-columns:minmax(0,1fr)}}
@media (max-width:959px){.contact aside{position:static!important}}
.facts li .ico{background:var(--accent-soft); color:var(--fg)}
.icard .ico.acc,.badges .ico.acc{color:var(--accent)}
.hero.split{padding-left:var(--gut); padding-right:var(--gut-r); max-width:calc(var(--max) + 96px); margin-inline:auto}
.hero.split .hero-inner{padding-left:0}
@media (max-width:899px){.hero.split{padding-left:var(--gut); padding-right:var(--gut-r)}}
.matrix-wrap,.matrix td,.matrix th{position:relative}
.am-build svg{overflow:hidden}

/* =================== v4 additions =================== */
.dither-cv{position:absolute; left:0; top:0; image-rendering:pixelated; pointer-events:none; z-index:0}
.dimg img{position:relative; z-index:0}
.dband{position:relative; height:clamp(90px,11vw,150px); overflow:hidden; pointer-events:auto}
.dband .dither-cv{opacity:.95}
.tag-on-img{position:absolute; left:16px; top:16px; z-index:2; background:rgba(23,26,27,.72); color:var(--paper); border-color:rgba(245,245,239,.2); backdrop-filter:blur(6px)}
.tag-on-img i{background:var(--neon)}
.prompt i{animation:none}

/* Services menu */
.nav-item{position:relative}
.nav-btn{display:inline-flex; align-items:center; gap:6px; background:none; border:0; cursor:pointer; color:var(--fg)}
.nav-btn svg{transition:transform .25s var(--ease)}
.nav-item.open .nav-btn svg{transform:rotate(180deg)}
.nav-btn.is-cur::after{transform:scaleX(1)}
.mega{position:absolute; top:calc(100% + 10px); left:50%; transform:translate(-40%,8px); width:min(980px,92vw); opacity:0; visibility:hidden; transition:opacity .2s var(--ease), transform .25s var(--ease), visibility 0s .25s; z-index:80}
.nav-item.open .mega{opacity:1; visibility:visible; transform:translate(-40%,0); transition:opacity .2s var(--ease), transform .25s var(--ease)}
.mega-in{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:18px; border-radius:16px; background:var(--surface); border:1px solid var(--line); box-shadow:0 30px 70px -30px rgba(0,0,0,.45); color:var(--fg)}
.mega-col{display:grid; gap:6px; align-content:start}
.mega-h{font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); padding:6px 10px}
.mega-col ul{display:grid; gap:2px}
.mega-col a{display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:start; padding:10px; border-radius:10px; text-decoration:none; color:var(--fg)}
.mega-col a:hover,.mega-col a:focus-visible{background:var(--chip)}
.mega-col strong{display:block; font-size:14px; font-weight:600}
.mega-col small{display:block; font-size:12.5px; color:var(--muted); line-height:1.4}
.mega-agent{background:#171A1B!important; color:var(--paper)!important; padding:14px!important; grid-template-columns:52px minmax(0,1fr)!important}
.mega-agent small{color:#B4BEB8!important}
.am-mega{width:52px}
.mega-all{display:flex!important; justify-content:space-between; align-items:center; font-weight:600; font-size:14px; border:1px solid var(--line)}
.mega-all .blk{width:8px; height:8px; background:var(--verm)}

/* Services page */
.svc-hero{position:relative; padding-top:calc(var(--header-h) + clamp(40px,6vw,72px))}
.svc-hero .wrap{padding-bottom:clamp(36px,5vw,56px)}
.svc-hero-top{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:24px 64px; align-items:end}
@media (max-width:899px){.svc-hero-top{grid-template-columns:minmax(0,1fr)}}
.disc-cards{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
.disc-card{display:grid; grid-template-columns:72px minmax(0,1fr); gap:18px; align-items:start; padding:20px; border-radius:var(--r-card); background:#1E2322; border:1px solid rgba(137,150,143,.22); text-decoration:none; color:var(--paper); transition:border-color .2s var(--ease), transform .3s var(--ease)}
.disc-card:hover{border-color:var(--neon); transform:translateY(-3px)}
.disc-card strong{font-size:18px; font-weight:600}
.am-disc-sm{width:72px}
.mini-lines{display:grid; gap:4px; margin-top:4px}
.mini-lines li{display:flex; gap:8px; align-items:center; font-size:13px; color:#D0D6D0}
@media (max-width:899px){.disc-cards{grid-template-columns:minmax(0,1fr)}}
.svc-body{position:relative; padding-block:clamp(48px,6vw,88px)}
.svc-layout{display:grid; grid-template-columns:240px minmax(0,1fr); gap:clamp(32px,4vw,64px); align-items:start}
.svc-aside{position:sticky; top:calc(var(--header-h) + 24px); display:grid; gap:20px}
.svc-nav{display:grid; gap:2px}
.side-h{font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:14px 0 6px 10px}
.side-h:first-child{margin-top:0}
.svc-nav a{display:flex; gap:10px; align-items:center; padding:8px 10px; border-radius:10px; text-decoration:none; font-size:14px; font-weight:500; color:var(--fg); transition:background-color .2s var(--ease)}
.svc-nav a .ico{background:transparent}
.svc-nav a:hover{background:var(--chip)}
.svc-nav a.on{background:var(--graphite); color:var(--paper)}
.svc-nav a.on .ico{color:var(--neon)}
.side-agent{margin-top:12px; border:1px dashed var(--line)}
.aside-cta{padding:16px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line); display:grid; gap:6px}
.aside-cta .btn{margin-top:8px}
.chipnav{display:none; position:sticky; top:var(--header-h); z-index:20; gap:8px; overflow-x:auto; padding:10px var(--gut-r) 10px var(--gut); background:color-mix(in srgb,var(--bg) 92%,transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); margin-top:-24px; margin-bottom:24px}
.chipnav .chip{white-space:nowrap; flex:none}
.chipnav .chip.on{background:var(--graphite); color:var(--paper); border-color:var(--graphite)}
@media (max-width:959px){.svc-layout{grid-template-columns:minmax(0,1fr)}.svc-aside{display:none}.chipnav{display:flex}}
.svc-main{display:grid; gap:clamp(56px,7vw,96px); min-width:0}
.disc-head{display:grid; grid-template-columns:96px minmax(0,1fr); gap:24px; align-items:center; padding-bottom:8px; border-bottom:1px solid var(--line); scroll-margin-top:calc(var(--header-h) + 24px)}
.am-disc{width:96px}
.svc-line{display:grid; gap:28px; scroll-margin-top:calc(var(--header-h) + 72px)}
.svc-banner{aspect-ratio:21/8; width:100%}
.svc-line-grid{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:clamp(24px,3vw,48px); align-items:start}
@media (max-width:1099px){.svc-line-grid{grid-template-columns:minmax(0,1fr)}}
.h-sub{font-size:13px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--fg); margin-top:12px; display:flex; gap:8px}
.inc-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
@media (max-width:699px){.inc-grid{grid-template-columns:minmax(0,1fr)}}
.inc{display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; padding:18px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line); transition:border-color .2s var(--ease), transform .3s var(--ease)}
.inc:hover{border-color:var(--fg); transform:translateY(-2px)}
.inc h4{margin:0; font-size:15.5px; font-weight:600; letter-spacing:-.005em}
.inc p{font-size:14px; color:var(--muted); margin-top:4px}
.svc-side-card{position:sticky; top:calc(var(--header-h) + 24px); display:grid; gap:14px; padding:20px; border-radius:var(--r-card); background:var(--surface); border:1px solid var(--line)}
.sbox{display:grid; gap:8px; padding-bottom:14px; border-bottom:1px solid var(--line)}
.sbox-h{font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.sbox p{font-size:14.5px}
.mini-list{display:grid; gap:6px}
.mini-list li{display:flex; gap:8px; align-items:center; font-size:14px}
.mini-list svg{color:var(--verm-deep); flex:none}
@media (max-width:1099px){.svc-side-card{position:static}}
.eng-strip{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,2fr) auto; gap:24px 40px; align-items:center; padding:28px; border-radius:var(--r-media); background:var(--surface); border:1px solid var(--line)}
.eng-steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
.eng-steps li{display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:start}
.eng-steps strong{display:block; font-size:14px}
.eng-steps span{font-size:13px; color:var(--muted)}
@media (max-width:999px){.eng-strip,.eng-steps{grid-template-columns:minmax(0,1fr)}}

/* Agent mark sizes and poke */
.am svg.grab{cursor:grabbing}
.am svg:focus-visible{outline:2px solid var(--focus); outline-offset:6px; border-radius:12px}
.am .burst{position:absolute; pointer-events:none; z-index:5}
.am-mini{width:84px}
.am-hero{touch-action:none}

/* Flow diagram */
.flow{display:grid; grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr) 56px minmax(0,1fr) 56px minmax(0,1fr); align-items:stretch}
.fnode{position:relative; display:grid; gap:12px; align-content:start; padding:24px 22px; border-radius:var(--r-card); background:#1E2322; border:1px solid rgba(137,150,143,.22); color:var(--paper); opacity:.25; transform:translateY(16px); transition:opacity .5s var(--ease) calc(var(--i) * .35s), transform .5s var(--ease) calc(var(--i) * .35s), border-color .4s var(--ease) calc(var(--i) * .35s)}
.flow.run .fnode{opacity:1; transform:none}
.fnode h3{font-size:18px}
.fnode p{font-size:14px; color:#B4BEB8}
.fnum{font-size:12px; font-weight:600; letter-spacing:.14em; color:var(--verm-soft)}
.ficons{display:flex; gap:6px}
.ficons .ico{width:40px; height:40px}
.fmark{height:76px; display:flex; align-items:center}
.fnode-agent{border-color:rgba(230,255,0,.55)}
.fnode-done{border-color:rgba(239,81,72,.5)}
.flink{position:relative; align-self:center; height:2px; margin-inline:6px; background:repeating-linear-gradient(90deg,rgba(137,150,143,.6) 0 6px,transparent 6px 12px)}
.flink i{position:absolute; top:-4px; left:0; width:10px; height:10px; background:var(--neon); opacity:0}
.flow.run .flink i{animation:token 2.2s var(--ease) calc(var(--i) * .35s + .4s) infinite}
@keyframes token{0%{left:0; opacity:0}15%{opacity:1}85%{opacity:1}100%{left:calc(100% - 10px); opacity:0}}
@media (max-width:999px){
  .flow{grid-template-columns:minmax(0,1fr); gap:0}
  .flink{height:36px; width:2px; margin:6px 0 6px 32px; background:repeating-linear-gradient(180deg,rgba(137,150,143,.6) 0 6px,transparent 6px 12px)}
  .flink i{left:-4px!important; top:0}
  .flow.run .flink i{animation:tokenv 2.2s var(--ease) calc(var(--i) * .35s + .4s) infinite}
}
@keyframes tokenv{0%{top:0; opacity:0}15%{opacity:1}85%{opacity:1}100%{top:calc(100% - 10px); opacity:0}}

/* Review demo */
.rv{border-radius:var(--r-media); overflow:hidden; background:#101314; border:1px solid rgba(137,150,143,.24); color:var(--paper); box-shadow:0 40px 100px -50px rgba(0,0,0,.9)}
.rv-bar{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 18px; border-bottom:1px solid rgba(137,150,143,.18); font-size:12px; color:#B4BEB8}
.rv-bar .dots{display:flex; gap:6px}.rv-bar .dots i{width:9px; height:9px; border-radius:50%; background:#39433E}.rv-bar .dots i:last-child{background:var(--verm)}
.tagx{border:1px solid rgba(137,150,143,.35); padding:3px 8px; border-radius:6px}
.rv-body{display:grid; grid-template-columns:230px minmax(0,1fr) 300px; min-height:520px}
.rv-side{border-right:1px solid rgba(137,150,143,.16); padding:16px 12px; display:grid; gap:10px; align-content:start; background:#141819}
.rv-label{font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#89968F; padding:0 8px}
.rv-tabs{display:grid; gap:4px}
.rv-tab{display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; align-items:center; text-align:left; padding:10px; border-radius:10px; border:1px solid transparent; background:transparent; color:var(--paper); cursor:pointer}
.rv-tab:hover{background:rgba(245,245,239,.05)}
.rv-tab[aria-selected="true"]{background:#1E2322; border-color:rgba(230,255,0,.45)}
.rv-tab .ico{background:rgba(239,81,72,.16); color:var(--paper)}
.rv-tab strong{display:block; font-size:13.5px; font-weight:600}
.rv-tab small{display:block; font-size:12px; color:#F3C47A}
.rv-main{padding:20px; display:grid; gap:14px; align-content:start; min-width:0}
.rv-head{display:flex; justify-content:space-between; align-items:flex-start; gap:12px}
.rv-head h3{font-size:20px}
.rv-head .btn{color:var(--paper); border-color:rgba(245,245,239,.22)}
.dsteps{display:flex; gap:6px; flex-wrap:wrap}
.dstep{display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:5px 10px; border-radius:999px; background:rgba(137,150,143,.12); color:#89968F; transition:background-color .3s var(--ease), color .3s var(--ease)}
.dstep::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor}
.dstep.done{background:rgba(230,255,0,.12); color:var(--neon)}
.dstep.now{background:rgba(239,81,72,.16); color:var(--verm-soft)}
.rv-prep{display:flex; gap:8px; align-items:center; font-size:13px; color:#B4BEB8}
.rv-prep svg{width:18px; height:18px; color:var(--neon)}
.rv-table{overflow:auto; border:1px solid rgba(137,150,143,.18); border-radius:12px}
.rv-table table{width:100%; border-collapse:collapse; font-size:13.5px; min-width:520px}
.rv-table th{text-align:left; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:#89968F; padding:10px 12px; border-bottom:1px solid rgba(137,150,143,.18); background:#141819; position:sticky; top:0}
.rv-table td{padding:11px 12px; border-bottom:1px solid rgba(137,150,143,.1); color:#D0D6D0}
.rv-table .r{text-align:right}
.rv-table tbody tr{opacity:0; transform:translateY(6px)}
.rv-body.ready tbody tr{animation:rowin .35s var(--ease) var(--d) forwards}
@keyframes rowin{to{opacity:1; transform:none}}
.rv-table tr.flag{background:rgba(243,196,122,.07); cursor:pointer}
.rv-table tr.flag:hover,.rv-table tr.sel{background:rgba(243,196,122,.14)}
.rv-table tr.flag td:first-child{box-shadow:inset 3px 0 0 #F3C47A}
.rv-table tr.res td:first-child{box-shadow:inset 3px 0 0 #8DD7AC}
.rv-table tr.qry td:first-child{box-shadow:inset 3px 0 0 var(--verm-soft)}
.rv-table tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--neon)}
.st{width:28px}
.dot{display:inline-block; width:8px; height:8px; border-radius:50%}
.dot.ok{background:#8DD7AC}.dot.warn{background:#F3C47A}.dot.q{background:var(--verm-soft)}
.pill{display:inline-flex; font-size:11.5px; font-weight:600; padding:3px 8px; border-radius:999px; white-space:nowrap}
.pill.warn{background:#3D301D; color:#F3C47A}.pill.ok{background:#163B2B; color:#8DD7AC}.pill.q{background:#492421; color:#FF9A90}
.rv-panel{border-left:1px solid rgba(137,150,143,.16); padding:20px; display:grid; gap:16px; align-content:start; background:#141819}
.rv-sum{display:grid; gap:8px; margin:0}
.rv-sum div{display:flex; justify-content:space-between; gap:12px; font-size:13px}
.rv-sum dt{color:#89968F}.rv-sum dd{margin:0; font-weight:500}
.rv-sum .diff{padding-top:8px; border-top:1px solid rgba(137,150,143,.18)}
.rv-sum .diff dd{color:#F3C47A}
.rv-detail{min-height:160px}
.det{display:grid; gap:10px; padding:14px; border-radius:12px; background:#1E2322; border:1px solid rgba(243,196,122,.35); animation:fadeup .3s var(--ease)}
.det-top{display:flex; justify-content:space-between; gap:8px; align-items:center; flex-wrap:wrap}
.det-title{font-weight:600}
.det-acts{display:flex; gap:8px; flex-wrap:wrap}
.det-acts .btn-ghost{color:var(--paper); border-color:rgba(245,245,239,.25)}
.det-acts .btn-primary,.rv-foot .btn-primary{background:var(--neon); color:var(--graphite)}
.rv-foot{display:grid; gap:10px; padding-top:12px; border-top:1px solid rgba(137,150,143,.18)}
.rv-foot .btn:disabled{opacity:.35}
.rv-done{display:flex; gap:8px; align-items:center; font-size:13px; font-weight:600; color:#8DD7AC; padding:10px 12px; border-radius:10px; background:#163B2B}
.rv-done svg{width:18px; height:18px}
.rv.approved .rv-sum .diff dd{color:#8DD7AC}
@media (max-width:1099px){.rv-body{grid-template-columns:200px minmax(0,1fr)}.rv-panel{grid-column:1/-1; border-left:0; border-top:1px solid rgba(137,150,143,.16)}}
@media (max-width:699px){.rv-body{grid-template-columns:minmax(0,1fr)}.rv-side{border-right:0; border-bottom:1px solid rgba(137,150,143,.16)}.rv-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.rv-tab{grid-template-columns:minmax(0,1fr)}.rv-tab .ico{display:none}}
.agent-top{position:relative}
.agent-top .agent-hero{padding-bottom:clamp(32px,4vw,56px)}

.dot{padding:0!important; flex:none}
.svc-line .h2{font-size:clamp(26px,2.8vw,40px)}
@media (max-width:699px){
  .rv-bar .tagx{display:none}
  .rv-bar>span:nth-child(2){white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .rv-tab strong{font-size:13px; line-height:1.25}
  .rv-table{overflow:visible}
  .rv-table table{min-width:0; display:block}
  .rv-table thead{display:none}
  .rv-table tbody{display:block}
  .rv-table tbody tr{display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"desc amt" "meta st"; gap:4px 12px; padding:12px 14px; border-bottom:1px solid rgba(137,150,143,.1); position:relative}
  .rv-table td{padding:0; border:0}
  .rv-table td:nth-child(1){grid-area:meta; font-size:12px; color:#89968F; align-self:center}
  .rv-table td:nth-child(2){grid-area:desc; color:var(--paper); font-weight:500}
  .rv-table td:nth-child(3){grid-area:amt}
  .rv-table td:nth-child(4){grid-column:1/-1; grid-row:3; font-size:12.5px; color:#89968F}
  .rv-table td:nth-child(4):empty{display:none}
  .rv-table td:nth-child(5){grid-area:st; justify-self:end; align-self:center}
  .rv-table tr td:first-child{box-shadow:none!important}
  .rv-table tr.flag{box-shadow:inset 3px 0 0 #F3C47A}.rv-table tr.res{box-shadow:inset 3px 0 0 #8DD7AC}.rv-table tr.qry{box-shadow:inset 3px 0 0 var(--verm-soft)}.rv-table tr.sel{box-shadow:inset 3px 0 0 var(--neon)}
}
.people .person .dimg{position:relative; overflow:hidden}.people .person .dimg img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
@media (max-width:899px){.people .person .dimg img{position:static}}

/* =================== v5 additions =================== */
/* Dithered edges: the surface changes from graphite to paper as an ordered dither, never as a flip */
.dedge{position:relative; display:block; height:clamp(72px,9vw,136px); overflow:hidden; pointer-events:auto}
.dedge[data-from="dark"]{background:linear-gradient(180deg,var(--graphite),var(--paper))}
.dedge[data-from="light"]{background:linear-gradient(180deg,var(--paper),var(--graphite))}
.dedge[data-to="dark"]+footer,.dedge+.site-footer{margin-top:0}
.dedge canvas{position:absolute; left:0; top:0; image-rendering:pixelated; pointer-events:none}
.dedge+section.sec{padding-top:clamp(48px,6vw,88px)}
main>section.sec:has(+ .dedge){padding-bottom:clamp(48px,6vw,88px)}
.dedge+.site-footer{background:var(--graphite)}

/* How it fits together */
.fn-head{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(20px,4vw,64px); align-items:end; margin-bottom:clamp(36px,5vw,64px)}
.fn{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:clamp(20px,3vw,40px); align-items:stretch}
.fn-stage{position:relative; border-radius:var(--r-media); background:#121516; border:1px solid var(--line); min-height:540px; display:grid; place-items:center; overflow:hidden}
.fn-dots{position:absolute; inset:0; background-image:radial-gradient(rgba(245,245,239,.16) 1px,transparent 1.6px); background-size:18px 18px; -webkit-mask-image:radial-gradient(circle at 50% 46%,#000 25%,transparent 72%); mask-image:radial-gradient(circle at 50% 46%,#000 25%,transparent 72%)}
.fn-mark{position:relative; width:min(76%,430px); margin-top:-30px}
.fn-mark svg{display:block; width:100%; height:auto; overflow:visible}
.fn-mark .y{fill:var(--neon); transition:fill .5s var(--ease)}
.fn-mark .r{fill:var(--verm); transition:fill .5s var(--ease)}
.fn-mark .asm{transform-box:fill-box; transform-origin:center; transition:transform 1.1s var(--spring), opacity .7s var(--ease)}
.fn:not(.built) .asm[data-p="base"]{transform:translate(-46px,30px) rotate(-14deg); opacity:.12}
.fn:not(.built) .asm[data-p="top"]{transform:translate(0,-40px) rotate(6deg); opacity:.12}
.fn:not(.built) .asm[data-p="check"]{transform:translate(46px,30px) rotate(14deg); opacity:.12}
.fn.built .asm[data-p="top"]{transition-delay:.14s}
.fn.built .asm[data-p="check"]{transition-delay:.28s}
.fn.built.picked .asm{transition-delay:0s}
.fn-mark :is(.y,.r){fill:var(--neon)}
.fn[data-sel="base"] .fn-mark .asm[data-p="base"] :is(.y,.r),.fn[data-sel="top"] .fn-mark .asm[data-p="top"] :is(.y,.r),.fn[data-sel="check"] .fn-mark .asm[data-p="check"] :is(.y,.r){fill:var(--verm)}
.fn.built[data-sel="base"] .asm[data-p="base"]{transform:translate(-7px,7px)}
.fn.built[data-sel="top"] .asm[data-p="top"]{transform:translate(0,-8px)}
.fn.built[data-sel="check"] .asm[data-p="check"]{transform:translate(7px,7px)}
.fn-cap{position:absolute; left:24px; right:24px; bottom:22px; display:grid; gap:4px}
.fn-cap-k{font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--fog)}
.fn-cap [data-fn-cap]{font-size:clamp(18px,1.6vw,22px); font-weight:600; letter-spacing:-.01em}
.fn-cap.swap span{animation:fadeup .45s var(--ease)}
.fn-list{display:grid; gap:10px; align-content:center}
.fn-item{border-radius:var(--r-card); border:1px solid var(--line); transition:background-color .35s var(--ease), border-color .35s var(--ease)}
.fn-item:hover{border-color:rgba(245,245,239,.35)}
.fn-item.on{background:var(--surface); border-color:rgba(230,255,0,.5)}
.fn-tab{position:relative; width:100%; display:grid; grid-template-columns:auto auto minmax(0,1fr) auto; gap:16px; align-items:center; padding:18px 20px; background:none; border:0; text-align:left; cursor:pointer; color:inherit; border-radius:var(--r-card); text-decoration:none}
.fn-go{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--fog); opacity:0; transform:translateX(-6px); transition:opacity .25s var(--ease), transform .25s var(--ease)}
.fn-go .blk{width:7px; height:7px; background:var(--verm)}
.fn-item.on .fn-go,.fn-tab:focus-visible .fn-go{opacity:1; transform:none; color:var(--paper)}
.fn-list{list-style:none; margin:0; padding:0}
.fn-n{font-size:13px; font-weight:600; color:var(--fog)}
.fn-sw{display:block; width:44px; height:44px}
.fn-sw svg{width:100%; height:100%; display:block}
.fn-sw :is(.y,.r){fill:var(--neon)}.fn-sw .asm:not(.dim) :is(.y,.r){fill:var(--verm)}
.fn-t strong{display:block; font-size:19px; letter-spacing:-.01em}
.fn-t small{display:block; color:var(--muted); font-size:14px; line-height:1.45; margin-top:2px}
.fn-prog{position:absolute; left:20px; right:20px; bottom:-1px; height:2px; overflow:hidden; border-radius:2px}
.fn-prog i{display:block; height:100%; background:var(--neon); transform-origin:left; transform:scaleX(0)}
.fn.auto .fn-item.on .fn-prog i{animation:prog 6s linear forwards}
@keyframes prog{to{transform:scaleX(1)}}
.fn-panel{display:grid; grid-template-rows:0fr; transition:grid-template-rows .5s var(--ease)}
.fn-item.on .fn-panel{grid-template-rows:1fr}
.fn-panel-in{overflow:hidden; min-height:0}
.fn-lines{display:grid; gap:2px; padding:0 14px 14px 76px}
.fn-lines a{display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:center; padding:10px; border-radius:10px; text-decoration:none; color:var(--fg)}
.fn-lines a:hover{background:var(--chip)}
.fn-lines strong{display:block; font-size:15px}
.fn-lines small{display:block; font-size:13px; color:var(--muted)}
@media (max-width:959px){.fn-head,.fn{grid-template-columns:minmax(0,1fr)}.fn-stage{min-height:340px}.fn-mark{width:min(64%,300px)}}
@media (max-width:599px){.fn-lines{padding-left:14px}.fn-tab{gap:12px; padding:16px}.fn-n{display:none}}
.reduced .fn .asm{transform:none!important; opacity:1!important}

/* Who we work with */
.who{display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:stretch}
.who-media{position:relative; margin:0; border-radius:var(--r-media); overflow:hidden; min-height:580px; background:var(--graphite); isolation:isolate}
.who-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.who-media canvas{position:absolute; left:0; top:0; z-index:1; image-rendering:pixelated; pointer-events:none}
.who-badge{position:absolute; left:16px; bottom:16px; z-index:2; display:flex; gap:12px; align-items:center; padding:10px 16px; border-radius:12px; background:rgba(23,26,27,.74); color:var(--paper); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); font-size:13px}
.who-badge .num{color:var(--fog)}
.who-badge strong{font-size:15px}
.who-side{display:grid; gap:28px; align-content:start; padding-top:6px}
.who-tabs{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px}
.who-tab{position:relative; display:flex; gap:12px; align-items:center; padding:12px 14px; border-radius:12px; border:1px solid var(--line); background:var(--surface); cursor:pointer; font-weight:600; font-size:15px; color:var(--fg); overflow:hidden; text-align:left; min-height:60px}
.who-tab:hover{border-color:var(--fg)}
.who-tab[aria-selected="true"]{background:var(--graphite); color:var(--paper); border-color:var(--graphite)}
.who-tab[aria-selected="true"] .ico{background:rgba(230,255,0,.16); color:var(--neon)}
.who-prog{position:absolute; left:0; right:0; bottom:0; height:3px}
.who-prog b{display:block; height:100%; background:var(--verm); transform-origin:left; transform:scaleX(0)}
.who.auto .who-tab[aria-selected="true"] .who-prog b{animation:prog 7s linear forwards}
.who-panel{display:grid; gap:26px; animation:fadeup .5s var(--ease)}
.who-pain{font-size:clamp(24px,2.5vw,34px); font-weight:600; letter-spacing:-.025em; line-height:1.18; text-wrap:balance}
.who-cols{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:24px; padding-top:24px; border-top:1px solid var(--line)}
.who-chips{display:flex; flex-wrap:wrap; gap:8px}
@media (max-width:959px){.who{grid-template-columns:minmax(0,1fr)}.who-media{min-height:0; aspect-ratio:4/3}}
@media (max-width:559px){.who-cols{grid-template-columns:minmax(0,1fr)}.who-tab{font-size:14px; padding:10px 12px}.who-tab .ico{display:none}}

/* Agent module: one consistent place for the agent on every page */
.agm{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(28px,5vw,80px); align-items:center; padding:clamp(24px,4vw,56px); border-radius:var(--r-media); background:linear-gradient(160deg,#1E2423,#141718 70%); border:1px solid var(--line)}
.agm-face{gap:16px; justify-items:center}
.am-agm{width:min(100%,300px)}
.agm-steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.agm-steps li{display:grid; gap:10px; align-content:start; padding:16px; border-radius:12px; background:var(--chip); border:1px solid var(--line)}
.agm-steps strong{display:block; font-size:15px}
.agm-steps span{display:block; font-size:13px; color:var(--muted); line-height:1.45}
.agm-mq{margin-top:clamp(32px,4vw,56px)}
@media (max-width:899px){.agm{grid-template-columns:minmax(0,1fr)}.am-agm{width:min(70%,220px)}}
@media (max-width:599px){.agm-steps{grid-template-columns:minmax(0,1fr)}}

/* Agent quick look */
dialog.peek{background:var(--graphite)}
.peek-hero{display:grid; grid-template-columns:92px minmax(0,1fr); gap:20px; align-items:center}
.am-peek{width:92px}
.peek-flow{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px}
.peek-flow li{display:grid; gap:6px; align-content:start; padding:14px; border-radius:12px; background:var(--chip); border:1px solid var(--line)}
.peek-flow .pk-n{font-size:12px; font-weight:600; color:var(--neon)}
.peek-flow strong{font-size:15px}
.peek-flow span:not(.pk-n){font-size:13px; color:var(--muted); line-height:1.45}
.peek-facts{display:flex; flex-wrap:wrap; gap:8px}
.peek .svc-list li{padding:12px 0}
@media (max-width:479px){.peek-flow{grid-template-columns:minmax(0,1fr)}}

/* Journey pager: where you are, and where to go next */
.jnav{display:grid; gap:14px; margin-top:16px}
.jnav-next{display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"k go" "t go" "d go"; gap:6px 24px; align-items:center; padding:clamp(22px,3vw,36px); border-radius:var(--r-media); background:var(--surface); border:1px solid var(--line); text-decoration:none; color:var(--fg); transition:border-color .3s var(--ease), background-color .3s var(--ease)}
.jnav-next:hover{border-color:var(--neon)}
.jnav-k{grid-area:k; font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; color:var(--fog)}
.jnav-next strong{grid-area:t; font-size:clamp(28px,3.4vw,46px); letter-spacing:-.03em; line-height:1.05}
.jnav-d{grid-area:d; color:var(--muted)}
.jnav-go{grid-area:go; width:clamp(52px,5vw,68px); height:clamp(52px,5vw,68px); border-radius:14px; background:var(--neon); display:grid; place-items:center}
.jnav-go svg{color:var(--graphite); transition:transform .35s var(--spring)}
.jnav-go .ic-line{stroke-width:2.2}
.jnav-next:hover .jnav-go svg{transform:translateX(5px)}
.jnav-steps{display:flex; flex-wrap:wrap; align-items:center; gap:4px}
.jnav-steps li{display:flex; align-items:center; gap:4px}
.jnav-steps li+li::before{content:""; width:14px; height:1px; background:var(--line)}
.jnav-steps a{display:inline-flex; gap:8px; align-items:center; padding:8px 12px; border-radius:8px; font-size:13px; font-weight:600; text-decoration:none; color:var(--muted); border:1px solid transparent}
.jnav-steps a:hover{color:var(--fg)}
.jnav-steps a i{width:8px; height:8px; border:1.5px solid currentColor; flex:none}
.jnav-steps .num{opacity:.6; font-weight:500}
.jnav-steps .done a i{background:var(--fog); border-color:var(--fog)}
.jnav-steps .now a{color:var(--paper); border-color:var(--line); background:var(--chip)}
.jnav-steps .now a i{background:var(--verm); border-color:var(--verm)}
@media (max-width:599px){.jnav-steps li+li::before{display:none}.jnav-steps a{padding:6px 8px; font-size:12px}}

/* Section rail */
.srail{position:fixed; right:16px; top:50%; transform:translateY(-50%); z-index:60; display:none; flex-direction:column; align-items:flex-end; gap:2px; color:var(--fg); transition:color .3s var(--ease)}
@media (min-width:1280px) and (pointer:fine){.srail{display:flex}}
.srail a{display:flex; align-items:center; justify-content:flex-end; gap:10px; min-height:22px; text-decoration:none; font-size:12px; font-weight:600}
.srail a span{opacity:0; transform:translateX(6px); transition:opacity .25s var(--ease), transform .25s var(--ease); padding:4px 9px; border-radius:6px; background:var(--bg); border:1px solid var(--line); white-space:nowrap; pointer-events:none}
.srail a i{width:8px; height:8px; background:var(--fg); opacity:.28; transition:height .35s var(--spring), opacity .25s var(--ease), background-color .3s var(--ease)}
.srail a:hover i{opacity:.7}
.srail a.on i{height:24px; background:var(--accent); opacity:1}
.srail:hover a span,.srail a:focus-visible span{opacity:1; transform:none; pointer-events:auto}

/* Sound toggle */
.snd{display:inline-flex; align-items:center; gap:8px; min-height:36px; padding:0 12px; border-radius:8px; border:1px solid var(--line); background:var(--chip); font-size:12px; font-weight:600; color:var(--muted); cursor:pointer}
.snd svg{width:16px; height:16px}
.snd[aria-pressed="true"]{color:var(--fg)}
.snd:hover{border-color:var(--fg)}
.snd .w{transition:opacity .2s var(--ease)}
.snd[aria-pressed="false"] .w{opacity:0}

/* =================== v6 additions =================== */
.chip-plus{display:grid; place-items:center; width:22px; height:22px; border-radius:6px; background:var(--chip); color:var(--muted); margin-left:2px}.chip-plus svg{width:14px; height:14px}
button.chip{cursor:pointer; font:inherit; font-size:14px; font-weight:500}
button.chip:hover{border-color:var(--fg)}

/* Journey, pinned so each stage holds */
.jpin{position:relative}
.jstick{position:relative}
@media (min-width:800px) and (min-height:640px){
  .jpin{height:300vh}
  .jstick{position:sticky; top:var(--header-h); height:calc(100vh - var(--header-h)); height:calc(100svh - var(--header-h)); display:flex; align-items:center}
  .jstick>.wrap{width:100%}
  .jsec{padding-block:0}
}
@media (min-width:800px) and (max-height:899px){.jpin-tall{height:auto}.jpin-tall .jstick{position:relative; height:auto; display:block}.jsec:has(.jpin-tall){padding-block:clamp(72px,8vw,120px)}}
.journey{padding-top:200px}
.journey .walker{left:0; top:48px; transition:none; will-change:transform; width:100px}
.journey .rail{top:160px}
.journey .stop::before{top:-46px}
.walker .wb{position:absolute; bottom:calc(100% + 12px); left:0; white-space:nowrap; font-size:13px; font-weight:600; padding:8px 12px; border-radius:10px; background:var(--surface); border:1px solid var(--line); color:var(--fg); transition:opacity .25s var(--ease), transform .25s var(--ease)}
.walker .wb::after{content:""; position:absolute; left:26px; bottom:-6px; width:10px; height:10px; background:var(--surface); border-right:1px solid var(--line); border-bottom:1px solid var(--line); transform:rotate(45deg)}
.walker .wb.away{opacity:0; transform:translateY(6px)}
.walker .wb.pop{animation:fadeup .35s var(--ease)}
.stop{transition:opacity .4s var(--ease)}
.journey .stop:not(.lit){opacity:.38}
.stop.cur h3{color:var(--accent)}
.jfoot{margin-top:40px}
.jhint{display:inline-flex; align-items:center; gap:8px}
@media (max-width:799px){.journey{padding-top:0}.walker .wb{display:none}.journey .stop:not(.lit){opacity:1}.jhint{display:none}}

/* Section rail: a quiet indicator that opens into a menu on a deliberate hover */
.srail{right:12px; padding:10px 8px; border-radius:14px; border:1px solid transparent; transition:background-color .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease), padding .25s var(--ease)}
.srail a{pointer-events:none}
.srail a span{opacity:0; transform:translateX(6px); background:none; border:0; padding:4px 2px}
.srail:hover a span{opacity:0}
.srail-h{font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); max-height:0; overflow:hidden; opacity:0; transition:opacity .2s var(--ease), max-height .25s var(--ease), margin .25s var(--ease); align-self:flex-start}
.srail.open{background:var(--bg); border-color:var(--line); box-shadow:0 20px 50px -20px rgba(0,0,0,.45); padding:14px 14px 12px 16px}
.srail.open .srail-h{max-height:30px; opacity:1; margin-bottom:6px}
.srail.open a{pointer-events:auto; cursor:pointer; min-height:30px}
.srail.open a span{opacity:1; transform:none; color:var(--muted)}
.srail.open a:hover span,.srail.open a.on span{color:var(--fg)}
.srail.open a i{opacity:.5}
.srail.open a.on i{opacity:1}

/* Promises */
.pm-grid{display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(32px,6vw,96px); align-items:start}
.pm-intro{display:grid; gap:20px; align-content:start}
@media (min-width:900px){.pm-intro{position:sticky; top:calc(var(--header-h) + 48px)}}
.pm-meter{display:grid; grid-template-columns:repeat(4,28px); gap:6px; margin-top:8px}
.pm-meter i{display:block; height:28px; border:1.5px solid var(--line); border-radius:4px; transition:background-color .35s var(--ease), border-color .35s var(--ease), transform .45s var(--spring)}
.pm-meter i.on{background:var(--graphite); border-color:var(--graphite); transform:translateY(-3px)}
.pm-meter i.cur{background:var(--verm); border-color:var(--verm)}
.promises{list-style:none; margin:0; padding:0; display:grid}
.pm{display:grid; grid-template-columns:72px minmax(0,1fr); gap:20px; padding:clamp(32px,5vh,56px) 0; border-top:1px solid var(--line)}
.pm:last-child{border-bottom:1px solid var(--line)}
.pm-n{font-size:14px; font-weight:600; color:var(--muted); padding-top:12px; transition:color .3s var(--ease)}
.pm-t{font-size:clamp(28px,3.4vw,48px); line-height:1.08; letter-spacing:-.03em; color:var(--fg); opacity:.28; transition:opacity .45s var(--ease)}
.pm-d{font-size:17px; color:var(--muted); max-width:52ch; margin-top:14px; opacity:0; transform:translateY(8px); transition:opacity .45s var(--ease), transform .45s var(--ease)}
.pm-proof{display:inline-flex; align-items:center; gap:12px; margin-top:18px; padding:10px 14px 10px 10px; border-radius:12px; background:var(--surface); border:1px solid var(--line); font-weight:600; font-size:14px; opacity:0; transform:translateY(8px); transition:opacity .45s var(--ease) .08s, transform .45s var(--ease) .08s}
.pm-proof small{display:block; font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}
.pm.seen .pm-t{opacity:.55}
.pm.on .pm-t{opacity:1}
.pm.on .pm-n{color:var(--red-text)}
.pm.on .pm-d,.pm.on .pm-proof{opacity:1; transform:none}
.pm.seen:not(.on) .pm-d,.pm.seen:not(.on) .pm-proof{opacity:.6; transform:none}
@media (max-width:899px){.pm-grid{grid-template-columns:minmax(0,1fr)}.pm{grid-template-columns:minmax(0,1fr); gap:8px}.pm-n{padding-top:0}.pm-t{opacity:1}.pm-d,.pm-proof{opacity:1; transform:none}}
.reduced .pm-t,.reduced .pm-d,.reduced .pm-proof{opacity:1; transform:none}

/* Demo: the agent talks you through the draft */
.rv-body{grid-template-columns:220px minmax(0,1fr) 360px; min-height:620px}
.rv-agent{display:flex; flex-direction:column; gap:12px; padding:16px; align-content:normal}
.ag-head{display:flex; gap:12px; align-items:center; padding-bottom:12px; border-bottom:1px solid rgba(137,150,143,.16)}
.am-ag{width:46px; flex:none}
.ag-id strong{display:block; font-size:15px}
.ag-status{display:inline-flex; gap:7px; align-items:center; font-size:12px; color:#B4BEB8}
.ag-status i{width:7px; height:7px; border-radius:50%; background:#89968F}
.ag-status.busy i{background:var(--neon); animation:agpulse 1s ease-in-out infinite}
.ag-status.wait i{background:#F3C47A}
.ag-status.ok i{background:#8DD7AC}
@keyframes agpulse{50%{opacity:.25}}
.ag-feed{flex:1; min-height:240px; max-height:380px; overflow:auto; display:flex; flex-direction:column; gap:10px; padding:2px 2px 6px}
.msg{max-width:92%; padding:10px 13px; border-radius:14px; font-size:13.5px; line-height:1.5; animation:msgin .32s var(--ease)}
.msg.agent{align-self:flex-start; background:#1E2322; border:1px solid rgba(137,150,143,.2); border-top-left-radius:4px; color:#E9ECE7}
.msg.me{align-self:flex-end; background:var(--neon); color:var(--graphite); font-weight:600; border-top-right-radius:4px}
.msg.typing{padding:12px 14px}
.msg .dots{display:inline-flex; gap:4px}
.msg .dots i{width:6px; height:6px; border-radius:50%; background:#89968F; animation:agtype 1s ease-in-out infinite}
.msg .dots i:nth-child(2){animation-delay:.15s}.msg .dots i:nth-child(3){animation-delay:.3s}
@keyframes agtype{0%,100%{transform:none; opacity:.4}50%{transform:translateY(-3px); opacity:1}}
@keyframes msgin{from{opacity:0; transform:translateY(6px) scale(.98)}to{opacity:1; transform:none}}
.m-card .m-top{display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:12px; color:#89968F; margin-bottom:8px}
.m-card .m-t{font-weight:600; margin-bottom:4px; color:var(--paper)}
.m-card .m-q{margin-top:8px; color:var(--paper); font-weight:500}
.ag-replies{display:flex; flex-wrap:wrap; gap:8px; min-height:0}
.ag-replies:empty{display:none}
.qr{min-height:40px; padding:0 16px; border-radius:999px; border:1px solid rgba(245,245,239,.28); background:transparent; color:var(--paper); font-weight:600; font-size:13.5px; cursor:pointer; animation:msgin .3s var(--ease)}
.qr:hover{border-color:var(--paper)}
.qr.pri{background:var(--neon); color:var(--graphite); border-color:var(--neon)}
.qr.pri:hover{background:var(--neon-2)}
.rv-agent .rv-foot{margin-top:auto}
.rv-foot .btn-primary.ready{animation:glow 1.8s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 0 6px rgba(230,255,0,.18)}}
.rv-body.scan tbody tr.flag td{animation:scanflag 1.2s ease-in-out}
@keyframes scanflag{40%{background:rgba(243,196,122,.18)}}
@media (max-width:1099px){.rv-body{grid-template-columns:200px minmax(0,1fr)}.rv-agent{grid-column:1/-1}.ag-feed{max-height:320px}}
@media (max-width:699px){.rv-body{grid-template-columns:minmax(0,1fr)}}
button.chip{text-align:left}
.rv-meta{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap}
.rv-stats{display:flex; gap:6px; flex-wrap:wrap}
.rv-stats div{display:grid; gap:0; padding:6px 10px; border-radius:8px; background:rgba(245,245,239,.04); border:1px solid rgba(137,150,143,.16); font-size:12px}
.rv-stats dt{font-size:11px}.rv-stats dd{font-size:12.5px}
.rv-stats .diff{padding-top:6px; border-top:1px solid rgba(137,150,143,.16)}
.disc-head,.svc-line{scroll-margin-top:calc(var(--header-h) + 24px)}