/* SRFA REBUILD A · "Electric checkout" (REBUILD_BRIEF_A_1022). Token template: every color/type value comes from src/theme.json (double-at tokens), filled by build.py. */
@font-face{font-family:"Inter";src:url(/assets/fonts/inter-var.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Archivo Black";src:url(/assets/fonts/archivo-black.woff2) format("woff2");font-weight:400 900;font-display:swap}
:root{--field:#1F3BFF;--on-field:#FFFFFF;--soft:#D6E0FF;--accent:#C8FF2E;--on-accent:#0A1240;--navy:#0A1240;--on-navy:#FFFFFF;--card:#FFFFFF;--on-card:#0A1240;--mute:#3B4566;--link:#1F3BFF;--rule:#D6E0FF;--ok:#0F7A3A;--bad:#E0244A;--bad-d:#FF6B7F;--ok-d:#C8FF2E;--acc-d:#C8FF2E;--lab-d:#D6E0FF;--edge:#FFFFFF;--notice-bg:#FFF4C2;--notice:#3A2E00;--focus:#C8FF2E;--ring:#0A1240;--dis-bg:#5B6A9E;--dis:#FFFFFF;--grey-btn:#C9CED9;--head:"Archivo Black","Arial Black",system-ui,sans-serif;--body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--field);color:var(--on-field);font:500 16px/1.5 var(--body)}
a{color:inherit;text-underline-offset:3px}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;box-shadow:0 0 0 6px var(--ring)}[tabindex="-1"]:focus{outline:none;box-shadow:none}
h1,h2,h3{font-family:var(--head);font-weight:900;letter-spacing:-.02em;line-height:1.02;margin:0 0 .45em}
h2{font-size:clamp(1.8rem,4.4vw,2.8rem)}h3{font-size:1.25rem;line-height:1.15}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0;padding:12px 16px;min-height:44px;z-index:50}.skip:focus{left:12px;top:12px;z-index:9;background:var(--card);color:var(--on-card);padding:8px 12px;border-radius:10px}
.pv{background:var(--notice-bg);color:var(--notice);font-size:12.5px;line-height:1.35;padding:6px 20px;text-align:center}
.ok{color:var(--ok);font-weight:900}.x{color:var(--bad);font-weight:900}
/* header: wordmark + Free check */
.top{padding:10px 0}.top-in{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font:800 13px/1 var(--body);letter-spacing:.08em;text-transform:uppercase}.brand .acc{color:var(--accent)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:0;border-radius:16px;background:var(--accent);color:var(--on-accent);font:900 17px/1.1 var(--head);letter-spacing:-.01em;text-decoration:none;cursor:pointer;text-align:center}
.btn:hover{filter:brightness(1.05);color:var(--on-accent)}
.btn-top{min-height:44px;padding:0 16px;font:800 13px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;border-radius:12px}
.btn-fat{width:100%;min-height:54px;font-size:18px}
.btn[aria-disabled="true"]{background:var(--dis-bg);color:var(--dis);cursor:not-allowed;filter:none}
/* hero */
.hero{padding:6px 0 28px}
.hero-grid{display:grid;grid-template-columns:1fr;grid-template-areas:"copy" "demo" "form" "note" "strip";gap:14px}
.hero-copy{grid-area:copy}.demo-col{grid-area:demo}.demo-note{grid-area:note;margin:0}.form{grid-area:form}.strip{grid-area:strip}
h1{font-size:clamp(2.35rem,10.6vw,4.6rem);line-height:1;margin:6px 0 12px}
h1 em.acc{font-style:normal;color:var(--accent)}
.sub{font:500 15px/1.42 var(--body);margin:0;max-width:36em}
/* assistant demo (unbranded; label 'Example store · simulation'; stops at what it can read) */
.chat{position:relative;background:var(--navy);color:var(--on-navy);border-radius:26px;padding:12px 12px 14px}
.chat-label{font:700 11px/1.2 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--acc-d);margin:0 4px 8px}
.bub{margin:0}.me{background:var(--accent);color:var(--on-accent);font:700 14px/1.35 var(--body);border-radius:20px 20px 4px 20px;padding:9px 14px;margin:0 0 8px auto;width:fit-content;max-width:85%}
.bot .who{font:700 11px/1.2 var(--body);color:var(--lab-d);margin:0 4px 5px}
.res-list .fix{display:block;margin-top:3px;font-weight:700;color:var(--on-card)}.res-list .fix b{color:var(--bad)}
.bot ul{list-style:none;margin:0;padding:9px 14px;background:var(--card);color:var(--on-card);border-radius:20px 20px 20px 4px;font:600 14.5px/1.55 var(--body);max-width:92%}
.art{display:none;margin:0}.art svg{display:block;width:100%;height:auto}
.a-cap{fill:var(--accent)}.a-body{fill:var(--card)}.a-label{fill:var(--soft)}.a-pepper{fill:var(--bad)}.a-line{stroke:var(--navy)}
.note{font-size:12.5px;line-height:1.4;margin:8px 4px 0;color:var(--on-field)}
/* form */
.form{display:grid;gap:10px}
.field label{display:block;font:700 13px/1.2 var(--body);margin:0 0 5px}
.field input{width:100%;height:50px;border-radius:16px;border:2px solid var(--edge);background:var(--card);color:var(--on-card);padding:0 16px;font:600 16px var(--body)}
.req{color:inherit}
.box{display:flex;gap:9px;align-items:center;min-height:44px;font-size:12.5px;line-height:1.35}
.box input{flex:0 0 22px;width:22px;height:22px;margin:0;accent-color:var(--accent)}
.box a{color:inherit}
.ver{display:block;font-size:10.5px;opacity:.85}
.form .ver{display:none}
.err{margin:0;min-height:0;font-weight:700;color:var(--on-field)}.err:not(:empty){background:var(--card);color:var(--bad);padding:6px 10px;border-radius:10px}
.vary{font:500 12px/1.35 var(--body);text-align:center;margin:0}
.free{font:900 clamp(22px,2.6vw,30px)/1.15 var(--display,var(--body));text-align:center;margin:10px 0 4px;color:#C8FF2E;letter-spacing:-.01em}
/* 3-step strip */
.strip{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.strip li{background:var(--navy);color:var(--on-navy);border-radius:999px;padding:8px 14px;font:700 13px/1.25 var(--body)}
/* sections */
.sec{padding:44px 0}
.lede{max-width:46em;margin:0 0 20px}
.edu-grid{display:grid;gap:14px}
.edu-b{background:var(--card);color:var(--on-card);border-radius:22px;padding:20px}
.edu-b .ic{display:flex;gap:6px;color:var(--field);margin:0 0 10px}.edu-b .ic svg{width:48px;height:48px}
.edu-b p{margin:0}
.list{display:grid;gap:10px}
.li{display:flex;gap:14px;background:var(--card);color:var(--on-card);border-radius:18px;padding:14px 16px}
.li .n{font:900 15px/1.4 var(--head);color:var(--link)}.li b{display:block}.li span{color:var(--mute)}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:s}
.steps li{background:var(--navy);color:var(--on-navy);border-radius:22px;padding:18px 20px}
.steps li h3::before{counter-increment:s;content:counter(s) " · ";color:var(--acc-d)}
.steps p{margin:0}.steps a{color:var(--on-navy)}
.faq-card{background:var(--card);color:var(--on-card);border-radius:22px;padding:6px 18px}
details{border-bottom:2px solid var(--rule);padding:14px 0}details:last-child{border:0}
summary{font-weight:800;cursor:pointer;min-height:24px}details p{margin:10px 0 0}details a{color:var(--link)}
.cta-band{margin:22px 0 0}
/* results */
.res{padding:28px 0 44px}
.res-pv{background:var(--notice-bg);color:var(--notice);border-radius:12px;padding:8px 12px;font-size:13px}
.res-grid{display:grid;gap:18px;align-items:start}
.res-card{background:var(--card);color:var(--on-card);border-radius:26px;padding:22px}
.res-card h2{font-size:1.6rem}
.verdict{margin:0 0 6px}.verdict strong{font:900 clamp(1.7rem,5vw,2.3rem)/1.05 var(--head);letter-spacing:-.02em;color:var(--on-card)}
.score{margin:0 0 10px;font-weight:700}.score .tag{display:inline-block;background:var(--navy);color:var(--acc-d);font:800 11px/1 var(--body);letter-spacing:.06em;padding:5px 8px;border-radius:8px;vertical-align:2px}
.res-meta{color:var(--mute);font-size:14px;margin:4px 0}
.res-list{list-style:none;margin:10px 0;padding:0}
.res-list li{display:flex;gap:10px;align-items:flex-start;border-top:2px solid var(--rule);padding:10px 0}
.res-list .mark{font-weight:900;font-size:18px;line-height:1.3}.res-list .mark.ok{color:var(--ok)}.res-list .mark.x{color:var(--bad)}
.res-list li > div{flex:1}.res-list li span{color:var(--mute);font-size:14px}.res-list .val{font-weight:800;color:var(--on-card)}
.res-card .note{color:var(--mute)}
.offer{background:var(--navy);color:var(--on-navy);border-radius:26px;padding:22px}
.offer h2{font-size:1.6rem}.offer a{color:var(--on-navy)}.offer .btn{color:var(--on-accent)}
.offer .price strong{font:900 1.9rem/1 var(--head);color:var(--acc-d);display:block;margin:0 0 6px}
.offer .ver{color:var(--lab-d)}.offer .box{font-size:14px;margin:0 0 12px}
.offer .err:not(:empty){background:var(--card)}
.inc{font-size:14.5px}.cancel{font-size:13px}.links{font-size:13px}
.pv-note{background:var(--notice-bg);color:var(--notice);border-radius:10px;padding:8px 10px;font-size:13px}
.res-foot{font-size:12.5px;margin:16px 0 0}
#freefix,#ht{background:var(--card);color:var(--on-card)}#freefix a,#ht a{color:var(--link)}
/* footer + cookie notice */
.foot{background:var(--navy);color:var(--on-navy);padding:30px 0;font-size:13.5px}.foot a,.foot button{color:var(--on-navy)}
.foot .fb{font:900 18px var(--head)}
.foot button{background:none;border:0;padding:10px 0;min-height:44px;font:inherit;text-decoration:underline;cursor:pointer;color:var(--on-navy)}
/* cookie bar: compact, bottom; clears the form + button (mobile: hero is sized to end above it; desktop: sits bottom-right, beside the form column) */
.ck{position:fixed;left:0;right:0;bottom:0;z-index:8;background:var(--card);color:var(--on-card);border-top:2px solid var(--navy);padding:6px 12px;display:flex;align-items:center;gap:10px;font:500 12px/1.35 var(--body);box-shadow:0 -6px 20px rgba(0,0,0,.18)}
.ck[hidden]{display:none}
body:has(#ck:not([hidden])){padding-bottom:72px}
.ck p{margin:0;flex:1 1 auto;min-width:0}
.ck a{color:var(--link)}.ck .acts{display:flex;gap:6px;flex:0 0 auto}
.ck button{min-height:44px;min-width:76px;padding:0 10px;border-radius:12px;border:2px solid var(--navy);background:var(--card);color:var(--on-card);font:700 13.5px var(--body);cursor:pointer}
.ck button.acc{background:var(--navy);color:var(--on-navy)}
@media (min-width:980px){.ck{left:auto;right:16px;bottom:16px;width:min(560px,calc(50vw - 72px));border:2px solid var(--navy);border-radius:16px;padding:8px 10px 8px 14px;font-size:13px}}
/* doc pages */
.doc{background:var(--card);color:var(--on-card);border-radius:26px;padding:28px 22px;margin:10px auto 40px;max-width:820px}
.doc h1{font-size:clamp(2rem,6vw,3rem)}.doc a{color:var(--link)}.doc .meta{color:var(--mute);font-size:13.5px}.doc code{word-break:break-all}
/* mobile: when the form pushes the button low, the strip gives way to a peek of the education section */
@media (max-width:719px){.strip{display:none}.hero{padding-bottom:8px}.edu{padding-top:22px}
 .pv{font-size:11px;padding:4px 12px}.field label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
 .hero-grid{gap:8px}h1{font-size:39px;margin:0 0 6px}.top{padding:5px 0}.sub{font-size:14.5px;line-height:1.38}.form{gap:6px}.box{font-size:12px;line-height:1.3}.chat{padding:10px 11px 11px}.chat-label{margin-bottom:6px}.bot ul{font-size:14px;line-height:1.42;padding:7px 13px}.me{font-size:13.5px;padding:7px 13px;margin-bottom:6px}.field input{height:48px}}
@media (min-width:720px){.edu-grid{grid-template-columns:repeat(3,1fr)}.steps{grid-template-columns:repeat(3,1fr)}.list{grid-template-columns:1fr 1fr}}
@media (min-width:980px){
 .hero{padding:10px 0 48px}
 .hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);grid-template-areas:"copy demo" "form note" "strip strip";column-gap:56px;row-gap:14px;align-items:start}
 .sub{font-size:18px}.chat{padding:18px 18px 20px;margin-top:10px}.me,.bot ul{font-size:17px}
 .art{display:block;position:absolute;width:92px;right:-30px;top:58%;transform:rotate(8deg)}.demo-note{align-self:start;padding-right:70px;margin-top:-4px}.chat{margin-top:18px}.me,.bot ul{font-size:18px}
 .form{max-width:520px}
 .res-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
}
@media (prefers-reduced-motion:no-preference){.bot li{animation:in .4s ease both}.bot li:nth-child(2){animation-delay:.35s}.bot li:nth-child(3){animation-delay:.7s}.bot li:nth-child(4){animation-delay:1.05s}@keyframes in{from{opacity:0;transform:translateY(4px)}}}

/* --prod additions */
.res-label{margin:0 0 8px}.res-label .tag{display:inline-block;background:var(--navy);color:var(--acc-d);font:800 11px/1 var(--body);letter-spacing:.06em;padding:5px 8px;border-radius:8px}
.check-status{font:600 14px/1.4 var(--body);margin:8px 0 0;text-align:center}
.btn[disabled]{background:var(--dis-bg);color:var(--dis);cursor:not-allowed;filter:none}
button.btn[disabled][aria-busy="true"]{cursor:progress}
.soon{font-size:13px;margin:8px 0 0}