/* Heebo (SIL OFL 1.1), self-hosted: no third-party requests */
@font-face{font-family:"Heebo";font-style:normal;font-weight:300 900;font-display:swap;src:url(/assets/fonts/heebo-hebrew.woff2) format("woff2");unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Heebo";font-style:normal;font-weight:300 900;font-display:swap;src:url(/assets/fonts/heebo-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --bg:#050816; --bg2:#0a1030; --ink:#e8ecff; --muted:#9aa4c7; --dim:#8f99c4;
  --cyan:#22d3ee; --violet:#8b5cf6; --pink:#e879f9; --green:#34d399; --red:#fb7185; --amber:#fbbf24;
  --glass:rgba(255,255,255,.055); --glass2:rgba(255,255,255,.09); --stroke:rgba(255,255,255,.12);
  --grad:linear-gradient(100deg,var(--cyan),var(--violet) 55%,var(--pink));
  --radius:22px; --maxw:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:"Heebo","Assistant","Arimo",system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,svg{display:block}
.wrap{width:min(var(--maxw),92vw);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
::selection{background:var(--violet);color:#fff}

/* ---------- background ---------- */
#net{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.mesh{position:fixed;inset:-20vmax;z-index:-2;pointer-events:none;filter:blur(70px);opacity:.55}
.mesh i{position:absolute;border-radius:50%;mix-blend-mode:screen;animation:drift 26s ease-in-out infinite alternate}
.mesh i:nth-child(1){width:55vmax;height:55vmax;background:radial-gradient(circle,#1e3a8a 0,transparent 65%);top:5%;right:10%}
.mesh i:nth-child(2){width:45vmax;height:45vmax;background:radial-gradient(circle,#5b21b6 0,transparent 65%);top:35%;left:0;animation-duration:32s}
.mesh i:nth-child(3){width:40vmax;height:40vmax;background:radial-gradient(circle,#0e7490 0,transparent 65%);bottom:0;right:30%;animation-duration:38s}
@keyframes drift{to{transform:translate3d(8vmax,-6vmax,0) scale(1.15)}}
.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* ---------- nav ---------- */
.nav{position:fixed;top:14px;inset-inline:0;z-index:50}
.nav .bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px 10px 18px;border-radius:999px;background:rgba(8,12,34,.55);border:1px solid var(--stroke);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);transition:background .3s}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.05rem;letter-spacing:.2px}
.zlogo{display:block;filter:drop-shadow(0 0 10px rgba(34,211,238,.35));transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.brand:hover .zlogo{transform:rotate(-6deg) scale(1.06)}
.zflow{animation:zflow 2.4s linear infinite}
@keyframes zflow{from{stroke-dashoffset:96}to{stroke-dashoffset:0}}
.zword{font-weight:800;letter-spacing:.22em;font-size:1.02rem;background:linear-gradient(90deg,#fff,#bfeaf5 55%,#22d3ee);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-reduced-motion:reduce){.zflow{animation:none;stroke-opacity:0}}
.logo{width:34px;height:34px;border-radius:10px;background:conic-gradient(from 200deg,var(--cyan),var(--violet),var(--pink),var(--cyan));position:relative;box-shadow:0 0 24px rgba(34,211,238,.45)}
.logo::after{content:"";position:absolute;inset:7px;border-radius:6px;background:var(--bg)}
.logo::before{content:"";position:absolute;inset:12px;border-radius:3px;background:var(--cyan);z-index:1;box-shadow:0 0 12px var(--cyan);animation:blink 2.4s ease-in-out infinite}
@keyframes blink{50%{opacity:.35}}
.nav ul{display:flex;gap:4px;list-style:none}
.nav ul a{padding:8px 14px;border-radius:999px;color:var(--muted);font-size:.95rem;transition:color .2s,background .2s}
.nav ul a:hover{color:var(--ink);background:var(--glass2)}
.btn{--b:var(--grad);display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 26px;border-radius:999px;font-weight:700;font-size:1rem;border:0;cursor:pointer;font-family:inherit;color:#061022;background:var(--b);background-size:200% 100%;position:relative;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background-position .6s;box-shadow:0 10px 30px -10px rgba(139,92,246,.7),0 0 0 1px rgba(255,255,255,.15) inset}
.btn:hover{transform:translateY(-2px);background-position:100% 0;box-shadow:0 16px 40px -10px rgba(34,211,238,.7),0 0 0 1px rgba(255,255,255,.25) inset}
.btn.ghost{background:var(--glass);color:var(--ink);border:1px solid var(--stroke);box-shadow:none;backdrop-filter:blur(10px)}
.btn.ghost:hover{background:var(--glass2);border-color:rgba(34,211,238,.5)}
.btn.sm{padding:10px 18px;font-size:.92rem}
.btn svg{width:20px;height:20px}

/* ---------- hero ---------- */
.hero{min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:120px 0 70px;position:relative}
.hero .grid{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 16px;border-radius:999px;background:var(--glass);border:1px solid var(--stroke);font-size:.88rem;color:var(--muted);margin-bottom:22px}
.eyebrow b{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:ping 2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 10px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
h1{font-size:clamp(2.5rem,5.6vw,4.6rem);line-height:1.05;font-weight:900;letter-spacing:-1px;min-height:2.2em}
h1 .l{display:block}
@media (min-width:1021px){h1{min-height:2.3em}}
.gt{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:shine 6s linear infinite}
@keyframes shine{to{background-position:-200% 0}}
.caret{display:inline-block;width:.07em;height:.9em;margin-inline-start:4px;background:var(--cyan);vertical-align:-.08em;box-shadow:0 0 12px var(--cyan);animation:car 1s steps(1) infinite}
@keyframes car{50%{opacity:0}}
.lead{font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--muted);max-width:34em;margin:22px 0 32px}
.lead strong{color:var(--ink);font-weight:600}
.ctas{display:flex;gap:12px;flex-wrap:wrap}
.trust{display:flex;gap:22px;flex-wrap:wrap;margin-top:30px;color:var(--dim);font-size:.9rem}
.trust span{display:flex;align-items:center;gap:8px}
.trust svg{width:18px;height:18px;color:var(--cyan)}

/* transformation stage */
.stage{position:relative;aspect-ratio:1/0.92;width:100%;max-width:560px;justify-self:center;perspective:1200px}
.stage .frame{position:absolute;inset:0;border-radius:28px;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--stroke);backdrop-filter:blur(14px);overflow:hidden;box-shadow:0 40px 120px -30px rgba(34,211,238,.25),0 0 0 1px rgba(139,92,246,.15) inset;transform:rotateY(-8deg) rotateX(4deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.stage:hover .frame{transform:rotateY(0) rotateX(0)}
.tog{position:absolute;top:16px;inset-inline-start:16px;z-index:6;display:flex;align-items:center;gap:6px;padding:5px;border-radius:999px;background:rgba(5,8,22,.7);border:1px solid var(--stroke);font-size:.8rem;font-weight:700}
.tog span{padding:5px 12px;border-radius:999px;position:relative;z-index:1;transition:color .4s}
.tog i{position:absolute;top:5px;bottom:5px;width:calc(50% - 5px);border-radius:999px;background:var(--grad);inset-inline-start:5px;animation:togm 10s infinite cubic-bezier(.7,0,.3,1)}
.tog span:nth-of-type(1){animation:tc1 10s infinite}
.tog span:nth-of-type(2){animation:tc2 10s infinite}
@keyframes togm{0%,38%{transform:translateX(0)}48%,92%{transform:translateX(-100%)}100%{transform:translateX(0)}}
@keyframes tc1{0%,38%{color:#061022}48%,92%{color:var(--muted)}100%{color:#061022}}
@keyframes tc2{0%,38%{color:var(--muted)}48%,92%{color:#061022}100%{color:var(--muted)}}
.layer{position:absolute;inset:0;padding:64px 22px 22px}
.before{animation:bef 10s infinite cubic-bezier(.7,0,.3,1)}
.after{animation:aft 10s infinite cubic-bezier(.7,0,.3,1)}
@keyframes bef{0%,36%{opacity:1;filter:none;transform:none}46%,94%{opacity:0;filter:blur(10px) saturate(0);transform:scale(.92) rotate(-2deg)}100%{opacity:1;filter:none;transform:none}}
@keyframes aft{0%,40%{opacity:0;transform:scale(1.06);filter:blur(8px)}50%,92%{opacity:1;transform:none;filter:none}98%,100%{opacity:0;transform:scale(1.06);filter:blur(8px)}}
.beam{position:absolute;top:0;bottom:0;width:120px;inset-inline-start:-140px;z-index:5;background:linear-gradient(90deg,transparent,rgba(34,211,238,.0) 20%,rgba(34,211,238,.55) 48%,#fff 50%,rgba(139,92,246,.55) 52%,transparent 80%);filter:blur(2px);mix-blend-mode:screen;animation:beam 10s infinite cubic-bezier(.6,0,.4,1);opacity:0}
@keyframes beam{0%,37%{transform:translateX(0);opacity:0}38%{opacity:1}49%{transform:translateX(-760px);opacity:1}50%,100%{opacity:0;transform:translateX(-760px)}}
/* before scene */
.note{position:absolute;top:70px;inset-inline-end:26px;width:55%;height:58%;background:#f5f0e1;border-radius:6px;transform:rotate(3deg);box-shadow:0 18px 40px rgba(0,0,0,.45);padding:22px 18px 12px 14px;color:#3b3b55;font-family:"Amatic SC","Alef",cursive;font-size:1.05rem;background-image:repeating-linear-gradient(#f5f0e1 0 27px,#c9d6ef 27px 28px);line-height:28px}
.note::before{content:"";position:absolute;top:0;bottom:0;inset-inline-start:22px;width:2px;background:#f2a3a3}
.note p{padding-inline-start:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.note s{color:#a33}
.phone{position:absolute;bottom:26px;inset-inline-start:24px;width:42%;padding:14px;border-radius:18px;background:#141827;border:1px solid #2a3150;box-shadow:0 18px 40px rgba(0,0,0,.5);transform:rotate(-4deg);animation:shake 2.2s ease-in-out infinite}
@keyframes shake{0%,70%,100%{transform:rotate(-4deg)}74%{transform:rotate(-7deg)}78%{transform:rotate(-1deg)}82%{transform:rotate(-6deg)}86%{transform:rotate(-3deg)}}
.phone .row{display:flex;align-items:center;gap:8px;font-size:.78rem;color:#c7cbe0;padding:6px 0;border-bottom:1px solid #232945}
.phone .row:last-child{border:0}
.phone .row b{color:var(--red);font-weight:700}
.phone .ic{width:22px;height:22px;border-radius:50%;background:rgba(251,113,133,.15);display:grid;place-items:center;color:var(--red);flex:none}
.phone .ic svg{width:12px;height:12px}
.wa{position:absolute;top:84px;inset-inline-start:22px;display:flex;flex-direction:column;gap:7px;width:40%}
.wa div{align-self:flex-start;background:#1f2c34;color:#e9edef;font-size:.76rem;padding:7px 11px;border-radius:12px 12px 12px 3px;box-shadow:0 6px 16px rgba(0,0,0,.35);animation:pop 3s ease-in-out infinite}
.wa div:nth-child(2){animation-delay:.4s;margin-inline-start:12px}
.wa div:nth-child(3){animation-delay:.8s}
@keyframes pop{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.badge{position:absolute;top:66px;inset-inline-start:calc(40% + 6px);min-width:30px;height:30px;padding:0 8px;border-radius:999px;background:#25d366;color:#04230f;font-weight:900;display:grid;place-items:center;font-size:.85rem;box-shadow:0 0 0 4px rgba(37,211,102,.18)}
.sticky{position:absolute;width:86px;height:80px;padding:9px;font-size:.72rem;line-height:1.25;color:#4a3b00;background:#fde68a;box-shadow:0 10px 24px rgba(0,0,0,.4);font-weight:700}
.sticky.s1{bottom:42px;inset-inline-end:36px;transform:rotate(7deg)}
.sticky.s2{bottom:118px;inset-inline-end:150px;transform:rotate(-9deg);background:#fbcfe8;color:#5b1238}
/* after scene */
.dash{position:absolute;inset:60px 18px 18px;border-radius:18px;background:rgba(6,10,30,.75);border:1px solid rgba(34,211,238,.25);box-shadow:0 0 60px -10px rgba(34,211,238,.35) inset;padding:14px;display:grid;grid-template-rows:auto 1fr auto;gap:10px}
.dash .top{display:flex;justify-content:space-between;align-items:center;font-size:.78rem;color:var(--muted)}
.dash .top b{color:var(--ink);font-weight:700}
.live{display:flex;align-items:center;gap:6px;color:var(--green);font-weight:700}
.live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:blink 1.2s infinite}
.flow{position:relative}
.flow svg.wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.wires path{fill:none;stroke:url(#wg);stroke-width:2;stroke-linecap:round;opacity:.6;vector-effect:non-scaling-stroke}
.wires path.p{stroke:#fff;stroke-width:3;opacity:1;stroke-dasharray:14 220;animation:flowdash 2.4s linear infinite;filter:drop-shadow(0 0 6px var(--cyan))}
@keyframes flowdash{to{stroke-dashoffset:-234}}
.node{position:absolute;width:78px;text-align:center;font-size:.7rem;color:var(--muted);transform:translate(50%,-50%)}
.node .o{width:50px;height:50px;margin:0 auto 6px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.18);box-shadow:0 0 0 0 rgba(34,211,238,.5);animation:nodepulse 3s infinite}
.node .o svg{width:24px;height:24px}
.node:nth-child(3) .o{animation-delay:.5s}.node:nth-child(4) .o{animation-delay:1s}.node:nth-child(5) .o{animation-delay:1.5s}.node:nth-child(6) .o{animation-delay:2s}
@keyframes nodepulse{0%{box-shadow:0 0 0 0 rgba(34,211,238,.45)}60%,100%{box-shadow:0 0 0 14px rgba(34,211,238,0)}}
.node b{display:block;color:var(--ink);font-weight:700;font-size:.74rem}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tile{padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);font-size:.68rem;color:var(--muted);line-height:1.3}
.tile b{display:block;font-size:.82rem;color:var(--ink)}
.tile .ok{color:var(--green)}
.demo{position:absolute;bottom:6px;inset-inline-end:12px;font-size:.62rem;color:var(--dim)}

/* ---------- sections ---------- */
section{position:relative}
.sec{padding:120px 0}
.kicker{display:inline-block;font-size:.85rem;font-weight:700;letter-spacing:2px;color:var(--cyan);margin-bottom:14px;text-transform:uppercase}
h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.12;font-weight:900;letter-spacing:-.5px;margin-bottom:16px}
.sub{color:var(--muted);font-size:1.1rem;max-width:40em}
.head{margin-bottom:56px}
.head.c{text-align:center}.head.c .sub{margin-inline:auto}

.glass{position:relative;border-radius:var(--radius);background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.025));border:1px solid var(--stroke);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);overflow:hidden}
.glow{--mx:50%;--my:50%}
.glow::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(34,211,238,.16),transparent 45%);opacity:0;transition:opacity .35s;pointer-events:none}
.glow:hover::before{opacity:1}
.glow::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:radial-gradient(300px circle at var(--mx) var(--my),rgba(139,92,246,.9),transparent 50%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s;pointer-events:none}
.glow:hover::after{opacity:1}

/* problems */
.probs{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.prob{padding:28px 24px;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.prob:hover{transform:translateY(-6px)}
.ico{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;margin-bottom:18px;background:linear-gradient(160deg,rgba(251,113,133,.2),rgba(251,113,133,.05));border:1px solid rgba(251,113,133,.3);color:var(--red)}
.ico svg{width:26px;height:26px}
.prob h3{font-size:1.15rem;margin-bottom:8px}
.prob p{color:var(--muted);font-size:.96rem}

/* before -> after scroll */
.ba{height:330vh}
.ba-pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;overflow:hidden}
.ba .wrap{display:grid;grid-template-rows:auto 1fr;gap:28px;height:min(760px,88vh);padding-top:70px}
.ba-head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap}
.ba-head h2{margin:0}
.ba-head h2 .x{display:inline-grid}
.ba-head h2 .x>span{grid-area:1/1;transition:opacity .5s,transform .5s}
.ba-head h2 .x .t2{opacity:0;transform:translateY(14px)}
.ba.done .ba-head h2 .x .t1{opacity:0;transform:translateY(-14px)}
.ba.done .ba-head h2 .x .t2{opacity:1;transform:none}
.meter{width:min(320px,100%);font-size:.85rem;color:var(--muted)}
.meter .track{height:8px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:8px}
.meter .fill{height:100%;width:calc(var(--p,0)*100%);background:var(--grad);border-radius:99px;box-shadow:0 0 18px var(--cyan)}
.ba-body{display:grid;grid-template-columns:1fr 1fr;gap:24px;min-height:0}
.chaos,.order{position:relative;border-radius:var(--radius);overflow:hidden;min-height:0}
.chaos{background:linear-gradient(160deg,rgba(251,113,133,.08),rgba(255,255,255,.02));border:1px solid rgba(251,113,133,.25)}
.chaos .lbl,.order .lbl{position:absolute;top:16px;inset-inline-start:18px;font-size:.8rem;font-weight:800;letter-spacing:1px;z-index:3}
.chaos .lbl{color:var(--red)}
.order .lbl{color:var(--cyan)}
.ch{position:absolute;padding:11px 16px;border-radius:12px;font-size:1rem;font-weight:600;box-shadow:0 10px 26px rgba(0,0,0,.4);
  --dx:0px;--dy:0px;--r:0deg;
  transform:translate(calc(var(--dx)*var(--p,0)),calc(var(--dy)*var(--p,0))) rotate(calc(var(--r) + var(--p,0)*var(--r)*4)) scale(calc(1 - var(--p,0)*.5));
  opacity:calc(1 - var(--p,0)*1.5);will-change:transform,opacity}
.ch.paper{background:#f5f0e1;color:#3b3b55;font-family:"Amatic SC","Alef",cursive;font-size:1.25rem;font-weight:700}
.ch.call{background:#1a1f33;color:#ffd1d9;border:1px solid rgba(251,113,133,.4)}
.ch.msg{background:#1f2c34;color:#e9edef;border-radius:14px 14px 14px 4px}
.ch.yel{background:#fde68a;color:#4a3b00}
.calm{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;text-align:center;opacity:calc(var(--p,0)*2.2 - 1.2);transform:scale(calc(.85 + var(--p,0)*.15));pointer-events:none}
.calm .big{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,rgba(52,211,153,.35),rgba(52,211,153,.05) 70%);border:1px solid rgba(52,211,153,.5);box-shadow:0 0 60px rgba(52,211,153,.35);color:var(--green)}
.calm .big svg{width:44px;height:44px}
.calm b{font-size:1.5rem}.calm small{color:var(--muted)}
.chaos{transition:border-color .5s,background .5s}
.ba.done .chaos{border-color:rgba(52,211,153,.35);background:linear-gradient(160deg,rgba(52,211,153,.07),rgba(255,255,255,.02))}
.ba.done .chaos .lbl{color:var(--green)}
.order{background:linear-gradient(160deg,rgba(34,211,238,.08),rgba(139,92,246,.05));border:1px solid rgba(34,211,238,.28);padding:56px 22px 22px;display:flex;flex-direction:column;justify-content:center;gap:12px}
.step{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:16px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);opacity:.28;transform:translateX(-18px);transition:all .6s cubic-bezier(.2,.8,.2,1)}
.step.on{opacity:1;transform:none;background:rgba(34,211,238,.08);border-color:rgba(34,211,238,.35);box-shadow:0 0 30px -10px rgba(34,211,238,.6)}
.step .o{width:42px;height:42px;flex:none;border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.06);color:var(--cyan)}
.step.on .o{background:var(--grad);color:#061022}
.step .o svg{width:22px;height:22px}
.step b{display:block;font-size:1rem}
.step small{color:var(--muted);font-size:.85rem}
.step .chk{margin-inline-start:auto;width:24px;height:24px;border-radius:50%;border:2px solid rgba(255,255,255,.2);display:grid;place-items:center;transition:.4s}
.step.on .chk{background:var(--green);border-color:var(--green);color:#04230f;box-shadow:0 0 14px var(--green)}
.step .chk svg{width:14px;height:14px;opacity:0;transition:.3s}
.step.on .chk svg{opacity:1}

/* pain -> fix */
.pfs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pf{padding:26px 24px 22px;display:flex;flex-direction:column;gap:12px;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.pf:hover{transform:translateY(-6px)}
.pf .ico{margin-bottom:2px}
.pf .pain{font-size:1.28rem;font-weight:800;line-height:1.35;color:#fff}
.pf .fix{display:flex;gap:8px;align-items:flex-start;color:#bfeaf5;font-size:1.02rem;padding-top:12px;border-top:1px dashed rgba(255,255,255,.12)}
.pf .fix svg{flex:none;width:18px;height:18px;margin-top:4px;color:var(--cyan);filter:drop-shadow(0 0 6px var(--cyan))}
.pf .tag{margin-top:auto;align-self:flex-start;display:inline-flex;gap:6px;align-items:center;font-size:.8rem;font-weight:700;padding:5px 11px;border-radius:999px;color:#e9d5ff;background:rgba(139,92,246,.14);border:1px solid rgba(139,92,246,.4)}
.pf .tag svg{width:14px;height:14px}
.pf-note{margin-top:16px;font-size:.82rem;color:var(--muted);text-align:center}
@media (max-width:1020px){.pfs{grid-template-columns:repeat(2,1fr)}}
@media (max-width:680px){.pfs{grid-template-columns:1fr}.pf .pain{font-size:1.15rem}}
/* services */
.svcs{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}
.svc{padding:30px 26px;grid-column:span 2;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.svc:nth-child(4),.svc:nth-child(5){grid-column:span 3}
.svc:hover{transform:translateY(-6px)}
.svc .ico{background:linear-gradient(160deg,rgba(34,211,238,.22),rgba(139,92,246,.12));border-color:rgba(34,211,238,.35);color:var(--cyan)}
.svc h3{font-size:1.25rem;margin-bottom:10px}
.svc p{color:var(--muted);font-size:.98rem;margin-bottom:14px}
.svc ul{list-style:none;display:grid;gap:7px}
.svc li{display:flex;gap:8px;align-items:flex-start;font-size:.92rem;color:#c9d0ee}
.svc li::before{content:"";flex:none;width:6px;height:6px;margin-top:9px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.num{position:absolute;top:18px;inset-inline-end:22px;font-size:3.2rem;font-weight:900;line-height:1;background:linear-gradient(180deg,rgba(255,255,255,.12),transparent);-webkit-background-clip:text;background-clip:text;color:transparent}

/* steps */
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
.how .line{position:absolute;top:44px;inset-inline:16%;height:2px;background:rgba(255,255,255,.08);overflow:hidden}
.how .line i{position:absolute;inset:0;background:var(--grad);transform:scaleX(0);transform-origin:right;transition:transform 1.6s cubic-bezier(.6,0,.2,1) .2s;box-shadow:0 0 14px var(--cyan)}
.how.in .line i{transform:scaleX(1)}
.hstep{text-align:center;padding:0 10px}
.hstep .n{width:88px;height:88px;margin:0 auto 22px;border-radius:50%;display:grid;place-items:center;font-size:2rem;font-weight:900;position:relative;background:var(--bg);border:1px solid var(--stroke);z-index:1}
.hstep .n::before{content:"";position:absolute;inset:-6px;border-radius:50%;background:conic-gradient(var(--cyan),var(--violet),var(--pink),var(--cyan));z-index:-2;animation:spin 6s linear infinite;opacity:.8}
.hstep .n::after{content:"";position:absolute;inset:2px;border-radius:50%;background:var(--bg2);z-index:-1}
@keyframes spin{to{transform:rotate(360deg)}}
.hstep h3{font-size:1.3rem;margin-bottom:8px}
.hstep p{color:var(--muted)}

/* offer */
.offer{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;padding:56px;align-items:center;border-color:rgba(34,211,238,.35);box-shadow:0 40px 120px -40px rgba(139,92,246,.5)}
.offer::after{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from var(--a,0deg),transparent 0 70%,var(--cyan) 80%,var(--violet) 90%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:rot 6s linear infinite;pointer-events:none}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes rot{to{--a:360deg}}
.free{display:inline-block;padding:6px 14px;border-radius:999px;background:rgba(52,211,153,.12);border:1px solid rgba(52,211,153,.4);color:var(--green);font-weight:800;font-size:.85rem;margin-bottom:16px}
.checks{list-style:none;display:grid;gap:12px;margin:22px 0 30px}
.checks li{display:flex;gap:12px;align-items:flex-start}
.checks li svg{flex:none;width:22px;height:22px;color:var(--cyan);margin-top:2px}
.report{position:relative;padding:24px;border-radius:18px;background:#0b1130;border:1px solid var(--stroke);transform:rotate(-2deg);box-shadow:0 30px 60px rgba(0,0,0,.5);transition:transform .5s}
.report:hover{transform:rotate(0) scale(1.02)}
.report h4{font-size:1rem;margin-bottom:4px}
.report .meta{font-size:.78rem;color:var(--dim);margin-bottom:16px}
.rline{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 0;border-top:1px dashed rgba(255,255,255,.1);font-size:.88rem}
.rline span:last-child{font-weight:700;color:var(--cyan);white-space:nowrap}
.bars{display:flex;gap:6px;align-items:end;height:60px;margin-top:14px}
.bars i{flex:1;border-radius:6px 6px 2px 2px;background:var(--grad);opacity:.85;transform-origin:bottom;transform:scaleY(.1);transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.in .bars i{transform:scaleY(1)}
.stamp{position:absolute;top:-14px;inset-inline-start:-14px;padding:6px 12px;border-radius:10px;background:var(--grad);color:#061022;font-weight:900;font-size:.78rem;transform:rotate(-8deg)}

/* why */
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.wcard{padding:30px 26px}
.wcard h3{font-size:1.2rem;margin:14px 0 8px}
.wcard p{color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}
.stat{padding:26px;text-align:center}
.stat .v{font-size:clamp(2.2rem,4vw,3rem);font-weight:900;line-height:1}
.stat .v small{font-size:.45em;font-weight:700;margin-inline-start:4px}
.stat p{color:var(--muted);font-size:.92rem;margin-top:8px}
.ph{margin-top:18px;padding:26px;border:1px dashed rgba(255,255,255,.22);border-radius:var(--radius);color:var(--dim);text-align:center;font-size:.95rem}

/* faq */
.faq{max-width:860px;margin-inline:auto;display:grid;gap:12px}
.faq details{border-radius:18px;background:var(--glass);border:1px solid var(--stroke);transition:border-color .3s,background .3s}
.faq details[open]{border-color:rgba(34,211,238,.4);background:rgba(34,211,238,.05)}
.faq summary{list-style:none;cursor:pointer;padding:20px 24px;font-weight:700;font-size:1.05rem;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:28px;height:28px;border-radius:50%;background:var(--glass2);position:relative;transition:transform .35s,background .35s}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;top:50%;left:50%;width:12px;height:2px;background:var(--ink);transform:translate(-50%,-50%)}
.faq summary i::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .35s}
.faq details[open] summary i{background:var(--grad);transform:rotate(180deg)}
.faq details[open] summary i::after{transform:translate(-50%,-50%) rotate(0)}
.faq details p{padding:0 24px 22px;color:var(--muted)}

/* contact */
.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;padding:56px;align-items:start}
.form{display:grid;gap:14px}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{position:relative}
.field input,.field textarea,.field select{width:100%;padding:16px 16px;border-radius:14px;background:rgba(5,8,22,.6);border:1px solid var(--stroke);color:var(--ink);font:inherit;font-size:1rem;transition:border-color .25s,box-shadow .25s;resize:vertical}
.field select{appearance:none}
.field textarea{min-height:110px}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 4px rgba(34,211,238,.15)}
.field label{display:block;font-size:.85rem;color:var(--muted);margin-bottom:6px}
.note-ph{font-size:.8rem;color:var(--dim)}
.cinfo{display:grid;gap:14px;margin-top:26px}
.cinfo a,.cinfo div{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;background:var(--glass);border:1px solid var(--stroke);transition:border-color .25s,transform .25s}
.cinfo a:hover{border-color:rgba(34,211,238,.5);transform:translateX(-4px)}
.cinfo svg{width:22px;height:22px;color:var(--cyan);flex:none}
.cinfo small{display:block;color:var(--dim);font-size:.8rem}

footer{padding:40px 0 60px;color:var(--dim);font-size:.9rem;border-top:1px solid rgba(255,255,255,.06)}
footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

.fab{position:fixed;bottom:22px;inset-inline-start:22px;z-index:60;width:60px;height:60px;border-radius:50%;background:#25d366;display:grid;place-items:center;box-shadow:0 12px 30px rgba(37,211,102,.45);transition:transform .25s}
.fab:hover{transform:scale(1.08) rotate(-6deg)}
.fab svg{width:32px;height:32px;color:#fff}
.fab::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25d366;animation:fab 2.4s infinite}
@keyframes fab{to{transform:scale(1.6);opacity:0}}

/* reveal */
.rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .hero .grid{grid-template-columns:1fr;gap:40px}
  .stage{max-width:520px}
  .probs{grid-template-columns:repeat(2,1fr)}
  .svcs{grid-template-columns:1fr 1fr}.svc,.svc:nth-child(4),.svc:nth-child(5){grid-column:span 1}
  .svc:nth-child(5){grid-column:span 2}
  .offer,.contact{grid-template-columns:1fr;padding:36px}
  .nav ul{display:none}
}
@media (max-width:680px){
  .sec{padding:84px 0}
  .hero{padding:104px 0 50px}
  h1{min-height:2.2em}
  .probs,.svcs,.why,.stats{grid-template-columns:1fr}
  .svc:nth-child(5){grid-column:span 1}
  .how{grid-template-columns:1fr;gap:36px}.how .line{display:none}
  .offer,.contact{padding:26px 20px}
  .form .two{grid-template-columns:1fr}
  .stage{aspect-ratio:1/1.02}
  .stage .frame{transform:none}
  .note{width:58%;font-size:.95rem;line-height:24px;background-image:repeating-linear-gradient(#f5f0e1 0 23px,#c9d6ef 23px 24px)}
  .wa{width:46%}.wa div{font-size:.7rem}
  .phone{width:52%}
  .sticky{display:none}
  .node{width:64px;font-size:.62rem}.node .o{width:42px;height:42px;border-radius:12px}
  .tiles{grid-template-columns:1fr 1fr}.tile:nth-child(3){display:none}
  .ba .wrap{padding-top:76px;gap:14px;height:92svh}
  .ba-body{grid-template-columns:1fr;grid-template-rows:minmax(0,34%) minmax(0,1fr);gap:10px}
  .calm .big{width:60px;height:60px}.calm .big svg{width:30px;height:30px}.calm b{font-size:1.1rem}
  .ba-head h2{font-size:1.5rem}.ba .kicker{margin-bottom:4px}
  .meter{font-size:.78rem}
  .ch{font-size:.78rem;padding:7px 10px}.ch.paper{font-size:1rem}
  .order{padding:38px 10px 10px;gap:6px;justify-content:flex-start}
  .order .lbl{top:12px}.chaos .lbl{top:12px}
  .step{padding:8px 10px;gap:10px;border-radius:12px}
  .step .o{width:34px;height:34px;border-radius:10px}.step .o svg{width:18px;height:18px}
  .step b{font-size:.86rem}.step small{display:none}.step .chk{width:20px;height:20px}
  .nav .bar .btn{padding:9px 14px;font-size:.85rem}
  .fab{width:54px;height:54px;bottom:16px;inset-inline-start:16px}
}

/* capture mode: static full page */
.capture .ba{height:auto}
.capture .ba-pin{position:relative;height:auto;padding:40px 0}
.capture .ba .wrap{height:auto}
.capture .ba-body{min-height:520px}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
  .before{opacity:0}.after{opacity:1}
  .tog i{transform:translateX(-100%)}.tog span:nth-of-type(2){color:#061022}.tog span:nth-of-type(1){color:var(--muted)}
  .ba{height:auto}.ba-pin{position:relative;height:auto;padding:40px 0}.ba .wrap{height:auto}.ba-body{min-height:520px}
  .step{opacity:1;transform:none}
  .ch{opacity:.25}
  .caret{display:none}
}

/* ---------- utility classes (from former inline styles; CSP-safe) ---------- */
.u1{--d:.1s!important}
.u2{--d:.2s!important}
.u3{--d:.15s!important}
.u4{right:12%!important;top:30%!important}
.u5{color:#25d366!important}
.u6{right:50%!important;top:30%!important}
.u7{color:var(--cyan)!important}
.u8{right:88%!important;top:30%!important}
.u9{color:var(--violet)!important}
.u10{right:72%!important;top:72%!important}
.u11{color:var(--pink)!important}
.u12{right:28%!important;top:72%!important}
.u13{color:var(--amber)!important}
.u14{--d:0.00s!important}
.u15{--d:0.08s!important}
.u16{--d:0.16s!important}
.u17{color:var(--red)!important}
.u18{top:18%!important;right:8%!important;--dx:-60px!important;--dy:-80px!important;--r:-6deg!important}
.u19{top:32%!important;left:6%!important;--dx:80px!important;--dy:-60px!important;--r:4deg!important}
.u20{top:46%!important;right:18%!important;--dx:-90px!important;--dy:40px!important;--r:-3deg!important}
.u21{top:60%!important;left:12%!important;--dx:70px!important;--dy:70px!important;--r:8deg!important}
.u22{top:72%!important;right:6%!important;--dx:-50px!important;--dy:90px!important;--r:5deg!important}
.u23{top:84%!important;left:20%!important;--dx:40px!important;--dy:110px!important;--r:-8deg!important}
.u24{top:22%!important;left:30%!important;--dx:20px!important;--dy:-120px!important;--r:-4deg!important}
.u25{top:10%!important;left:8%!important;--dx:60px!important;--dy:-90px!important;--r:-7deg!important}
.u26{top:56%!important;left:44%!important;--dx:10px!important;--dy:120px!important;--r:6deg!important}
.u27{top:88%!important;right:34%!important;--dx:-30px!important;--dy:90px!important;--r:3deg!important}
.u28{height:85%!important}
.u29{height:60%!important;transition-delay:.1s!important}
.u30{height:40%!important;transition-delay:.2s!important}
.u31{height:25%!important;transition-delay:.3s!important}
.u32{color:var(--cyan)!important;border-color:rgba(34,211,238,.35)!important;background:rgba(34,211,238,.1)!important}
.u33{--d:.08s!important}
.u34{color:var(--violet)!important;border-color:rgba(139,92,246,.35)!important;background:rgba(139,92,246,.1)!important}
.u35{--d:.16s!important}
.u36{color:var(--pink)!important;border-color:rgba(232,121,249,.35)!important;background:rgba(232,121,249,.1)!important}

/* user-controlled "stop animations" (accessibility menu / pause button) */
html.motion-off *,html.motion-off *::before,html.motion-off *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html.motion-off .rv{opacity:1;transform:none}
html.motion-off .before{opacity:0}
html.motion-off .after{opacity:1}
html.motion-off .tog i{transform:translateX(-100%)}
html.motion-off .tog span:nth-of-type(2){color:#061022}
html.motion-off .tog span:nth-of-type(1){color:var(--muted)}
html.motion-off .ba{height:auto}
html.motion-off .ba-pin{position:relative;height:auto;padding:40px 0}
html.motion-off .ba .wrap{height:auto}
html.motion-off .ba-body{min-height:520px}
html.motion-off .step{opacity:1;transform:none}
html.motion-off .ch{opacity:.25}
html.motion-off .caret{display:none}
html.motion-off .zflow{animation:none;stroke-opacity:0}

/* =====================================================================
   Accessibility, forms, footer, legal pages (added 2026-10-20)
   ===================================================================== */
html.motion-off{scroll-behavior:auto}
/* without JS nothing stays hidden */
html:not(.js) .rv{opacity:1;transform:none}

.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.c-wa{color:#25d366}
.ltr-r{text-align:right}

/* skip link */
.skip{position:fixed;top:10px;inset-inline-start:10px;z-index:1000;padding:12px 18px;border-radius:12px;background:#fff;color:#050816;font-weight:800;transform:translateY(-200%);transition:transform .2s}
.skip:focus{transform:none}

/* visible focus everywhere (WCAG 2.4.7) */
:focus-visible{outline:3px solid #fff;outline-offset:3px;box-shadow:0 0 0 6px rgba(34,211,238,.85);border-radius:6px}
.btn:focus-visible,.fab:focus-visible,.a11y-btn:focus-visible{border-radius:999px}
.field input:focus-visible,.field textarea:focus-visible{outline:3px solid #fff;outline-offset:2px;border-radius:14px}
.faq summary:focus-visible{border-radius:18px;outline-offset:-3px}
main:focus{outline:none}

/* buttons on gradient: lighter violet stop keeps dark text >= 4.5:1 */
:root{--grad-btn:linear-gradient(100deg,#22d3ee,#a78bfa 55%,#f0abfc)}
.btn,.stamp,.step.on .o{background-image:var(--grad-btn)}
.btn.ghost{background-image:none}

/* links inside running text are underlined (WCAG 1.4.1) */
.prose a,.consent a,.note-ph a,.foot a,.flinks a,.linkbtn{text-decoration:underline;text-underline-offset:3px}

/* pause / play animations button (WCAG 2.2.2) */
.mpause{position:absolute;bottom:-18px;inset-inline-end:14px;z-index:8;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--stroke);background:rgba(5,8,22,.85);color:var(--ink);font:inherit;font-size:.85rem;font-weight:700;cursor:pointer}
.mpause:hover{border-color:rgba(34,211,238,.6)}
.mp-ic{width:12px;height:12px;display:inline-block;border-inline:4px solid currentColor;box-sizing:border-box}
.mpause[aria-pressed="true"] .mp-ic{border:0;width:0;height:0;border-block:7px solid transparent;border-inline-end:11px solid currentColor}

/* form */
.req{color:#fda4af}
.reqnote{font-size:.8rem;color:var(--muted);margin-top:-4px}
.err{min-height:0;font-size:.85rem;color:#fda4af;margin-top:6px}
.err:empty{display:none}
.field [aria-invalid="true"]{border-color:#fb7185;box-shadow:0 0 0 3px rgba(251,113,133,.25)}
.field ::placeholder{color:#8f99c4;opacity:1}
.hp{position:absolute!important;inset-inline-start:-10000px;width:1px;height:1px;overflow:hidden}
.consent{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;align-items:start;font-size:.92rem;color:var(--ink)}
.consent input{width:22px;height:22px;margin-top:2px;accent-color:#22d3ee;cursor:pointer}
.consent .err{grid-column:1/-1}
.consent a{color:#7dd3fc}
.form .ctas .btn svg{width:20px;height:20px}
.form-status{font-weight:700;color:#6ee7b7}
.form-status:empty{display:none}
.form-status.bad{color:#fda4af}
.note-ph{font-size:.82rem;color:var(--muted)}
.note-ph a{color:#7dd3fc}
.cinfo small bdi{unicode-bidi:isolate}

/* footer */
.foot{padding:40px 0 110px}
.foot .wrap{display:flex;justify-content:space-between;align-items:center;gap:14px 24px;flex-wrap:wrap}
.foot p{color:var(--muted)}
.foot a{color:var(--ink)}
.flinks{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px}
.flinks a,.linkbtn{color:var(--ink);font-size:.92rem}
.linkbtn{background:none;border:0;padding:0;font:inherit;cursor:pointer}

/* accessibility menu */
.a11y-btn{position:fixed;bottom:22px;inset-inline-end:22px;z-index:70;width:56px;height:56px;border-radius:50%;border:2px solid #fff;background:#1d4ed8;color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 28px rgba(29,78,216,.5)}
.a11y-btn svg{width:30px;height:30px}
.a11y-panel{position:fixed;bottom:90px;inset-inline-end:22px;z-index:80;width:min(320px,calc(100vw - 32px));max-height:calc(100vh - 120px);overflow:auto;padding:18px;border-radius:18px;background:#0b1130;border:1px solid rgba(255,255,255,.25);box-shadow:0 30px 80px rgba(0,0,0,.6);color:#fff}
.a11y-panel[hidden]{display:none}
.a11y-panel h2{font-size:1.15rem;margin:0 0 12px;letter-spacing:0}
.a11y-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.a11y-panel button.opt{display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:8px;border-radius:12px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;font:inherit;font-size:.9rem;font-weight:700;cursor:pointer}
.a11y-panel button.opt:hover{border-color:#22d3ee}
.a11y-panel button.opt[aria-pressed="true"]{background:#22d3ee;color:#050816;border-color:#22d3ee}
.a11y-panel .wide{grid-column:1/-1}
.a11y-foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:.9rem}
.a11y-foot a{color:#7dd3fc;text-decoration:underline}
.a11y-close{position:absolute;top:10px;inset-inline-end:10px;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font-size:1.3rem;line-height:1;cursor:pointer}
.a11y-live{font-size:.85rem;color:#c7d2fe;margin-top:8px;min-height:1.2em}
@media (max-width:680px){.a11y-btn{width:50px;height:50px;bottom:16px;inset-inline-end:16px}.a11y-panel{bottom:76px;inset-inline-end:16px}}

/* text size steps */
html.fsm1{font-size:90%}html.fs1{font-size:112.5%}html.fs2{font-size:125%}html.fs3{font-size:137.5%}html.fs4{font-size:150%}

/* readable font */
html.a11y-font body,html.a11y-font button,html.a11y-font input,html.a11y-font textarea{font-family:Arial,"Segoe UI",Tahoma,sans-serif!important}
html.a11y-font body{line-height:1.8;word-spacing:.08em}
html.a11y-font .zword,html.a11y-font .kicker{letter-spacing:.05em!important}

/* underline links */
html.a11y-links a{text-decoration:underline!important;text-underline-offset:3px}
html.a11y-links a.btn,html.a11y-links nav a{outline:1px dashed currentColor;outline-offset:2px}

/* high contrast */
html.a11y-contrast{--bg:#000;--bg2:#000;--ink:#fff;--muted:#fff;--dim:#fff;--stroke:#fff;--glass:#000;--glass2:#1a1a1a;--cyan:#ffe600}
html.a11y-contrast body{background:#000;color:#fff}
html.a11y-contrast .mesh,html.a11y-contrast .grain,html.a11y-contrast #net{display:none}
html.a11y-contrast .gt,html.a11y-contrast .zword{background:none!important;color:#ffe600!important;-webkit-text-fill-color:#ffe600}
html.a11y-contrast .glass,html.a11y-contrast .nav .bar,html.a11y-contrast .faq details,html.a11y-contrast .cinfo a,html.a11y-contrast .report,html.a11y-contrast .chaos,html.a11y-contrast .order,html.a11y-contrast .step{background:#000!important;border:2px solid #fff!important;backdrop-filter:none!important;box-shadow:none!important}
html.a11y-contrast .btn{background:#ffe600!important;color:#000!important;border:2px solid #fff;box-shadow:none}
html.a11y-contrast .btn.ghost,html.a11y-contrast .mpause{background:#000!important;color:#fff!important;border:2px solid #fff}
html.a11y-contrast a:not(.btn):not(.fab):not(.skip){color:#ffe600!important}
html.a11y-contrast .pf .fix,html.a11y-contrast .pf .tag,html.a11y-contrast .free,html.a11y-contrast .kicker,html.a11y-contrast .lead,html.a11y-contrast .sub,html.a11y-contrast p{color:#fff}
html.a11y-contrast .pf .tag,html.a11y-contrast .free{background:#000;border-color:#fff}
html.a11y-contrast .field input,html.a11y-contrast .field textarea{background:#000;border:2px solid #fff;color:#fff}
html.a11y-contrast :focus-visible{outline:4px solid #ffe600;box-shadow:none}

/* ---------- legal / inner pages ---------- */
.page-head{position:sticky;top:0;z-index:50;background:rgba(5,8,22,.9);border-bottom:1px solid var(--stroke);backdrop-filter:blur(12px)}
.page-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.legal{padding:60px 0 40px}
.legal .wrap{max-width:820px}
.legal h1{font-size:clamp(2rem,4.5vw,3rem);min-height:0;margin-bottom:10px;line-height:1.15}
.legal .updated{color:var(--muted);margin-bottom:34px}
.prose{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid var(--stroke);border-radius:var(--radius);padding:clamp(22px,4vw,44px)}
.prose h2{font-size:1.35rem;margin:30px 0 10px;letter-spacing:0;line-height:1.3}
.prose h2:first-child{margin-top:0}
.prose p,.prose li{color:#d5dbf5;font-size:1.02rem}
.prose p+p{margin-top:10px}
.prose ul{padding-inline-start:22px;display:grid;gap:6px;margin:8px 0}
.prose a{color:#7dd3fc}
.prose strong{color:#fff}
.prose .box{margin-top:14px;padding:16px 18px;border-radius:14px;background:rgba(34,211,238,.07);border:1px solid rgba(34,211,238,.35)}
.prose table{width:100%;border-collapse:collapse;margin:10px 0;font-size:.95rem}
.prose th,.prose td{border:1px solid var(--stroke);padding:9px 10px;text-align:start;vertical-align:top;color:#d5dbf5}
.prose th{background:rgba(255,255,255,.06);color:#fff}
.nf{min-height:70vh;display:grid;place-items:center;text-align:center;padding:60px 0}
.nf .big{font-size:clamp(5rem,16vw,9rem);font-weight:900;line-height:1}
.nf p{color:var(--muted);margin:12px 0 26px;font-size:1.15rem}
@media print{.mesh,.grain,#net,.a11y-btn,.a11y-panel,.fab,.page-head{display:none!important}body{background:#fff;color:#000}.prose{border:0}.prose p,.prose li{color:#000}}
