/* mistralapikey.com — bearer bond at night: intaglio green-black, platinum hairlines, guilloche lathe-work */
:root{
--bg:#0d0c08;--bg2:#12100b;--panel:#16140e;--ink:#080605;
--text:#f2eaea;--soft:#cec5c3;--mut:#ada39f;
--plat:#d3ccc8;--line:rgba(211,204,200,.15);--line2:rgba(211,204,200,.34);
--g:#cfa77f;--g2:#e3bfa4;--gd:#302716;--err:#dfa6ff;
--serif:"Libre Caslon Display","Libre Caslon Text",Georgia,"Times New Roman",serif;
--sans:Figtree,system-ui,-apple-system,"Segoe UI",sans-serif;
--mono:"Martian Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
--wave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='14'%3E%3Cg fill='none' stroke='%23c9d3c8' stroke-width='.7'%3E%3Cpath d='M0 7Q12-5 24 7T48 7' opacity='.5'/%3E%3Cpath d='M0 7Q12 19 24 7T48 7' opacity='.5'/%3E%3Cpath d='M0 7Q12 1 24 7T48 7' stroke='%237fcf7f' opacity='.75'/%3E%3Cpath d='M0 7Q12 13 24 7T48 7' stroke='%237fcf7f' opacity='.75'/%3E%3C/g%3E%3C/svg%3E");
--wavev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='48'%3E%3Cg fill='none' stroke='%23c9d3c8' stroke-width='.7'%3E%3Cpath d='M7 0Q-5 12 7 24T7 48' opacity='.5'/%3E%3Cpath d='M7 0Q19 12 7 24T7 48' opacity='.5'/%3E%3Cpath d='M7 0Q1 12 7 24T7 48' stroke='%237fcf7f' opacity='.75'/%3E%3Cpath d='M7 0Q13 12 7 24T7 48' stroke='%237fcf7f' opacity='.75'/%3E%3C/g%3E%3C/svg%3E");
--micro:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='104' height='8'%3E%3Ctext x='0' y='6' font-family='monospace' font-size='5.6' letter-spacing='1' fill='%23c9d3c8' fill-opacity='.55'%3EMISTRALAPIKEY.COM %C2%B7%3C/text%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--text);font:400 16.5px/1.68 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
[hidden]{display:none!important}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:var(--g2);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--text)}
:focus-visible{outline:2px solid var(--g2);outline-offset:3px;border-radius:1px}
::selection{background:var(--g);color:var(--ink)}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3{font-family:var(--serif);font-weight:400;text-wrap:balance}
.skip{position:absolute;left:12px;top:-80px;z-index:99;background:var(--g);color:var(--ink);padding:12px 18px;font-weight:600}
.skip:focus{top:12px}

/* rosette */
.ros{display:block;fill:none;overflow:visible}
.ros *{vector-effect:non-scaling-stroke;stroke-width:.8px}
.ros-a{stroke:var(--g);stroke-opacity:.6}
.ros-b{stroke:var(--plat);stroke-opacity:.26}
.ros-c{stroke:var(--plat);stroke-opacity:.7}
.ros-c circle:last-child{fill:var(--bg)}
.ros-seal,.ros-s{flex:none}
.ros-seal{width:42px;height:42px}
.ros-seal .ros-b,.ros-s .ros-b{display:none}
.ros-seal .ros-a,.ros-s .ros-a{stroke-opacity:.95}
.ros-seal .ros-c circle:last-child,.ros-s .ros-c circle:last-child{fill:var(--g);stroke:none;r:5px}
.ros-s{width:72px;height:72px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:12px 26px;border:1px solid var(--g);border-radius:2px;background:var(--g);color:var(--ink);font:600 13px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;text-align:center;box-shadow:inset 0 0 0 3px var(--g),inset 0 0 0 4px rgba(8,6,5,.45);transition:background .18s,color .18s,border-color .18s}
.btn:hover{background:var(--g2);border-color:var(--g2);color:var(--ink);box-shadow:inset 0 0 0 3px var(--g2),inset 0 0 0 4px rgba(8,6,5,.45)}
.btn.ghost{background:transparent;color:var(--text);border-color:var(--line2);box-shadow:none}
.btn.ghost:hover{border-color:var(--plat);background:rgba(211,204,200,.07);color:var(--text)}
.btn.sm{min-height:44px;padding:8px 16px;font-size:11.5px;letter-spacing:.12em}
.acts{display:flex;flex-wrap:wrap;gap:14px}

/* counterfoil sidebar */
.stub{position:fixed;inset:0 auto 0 0;z-index:30;width:288px;display:flex;flex-direction:column;padding:34px 38px 26px 30px;background:var(--bg2);overflow-y:auto}
.stub::after{content:"";position:absolute;top:0;bottom:0;right:0;width:14px;background:var(--wavev) repeat-y;border-left:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none;font:400 21px/1.1 var(--serif);letter-spacing:.005em;min-height:44px;min-width:0}
.brand span{overflow-wrap:anywhere;min-width:0}
.stub-tag{margin-top:14px;color:var(--mut);font-size:13.5px;line-height:1.5;padding-bottom:22px;border-bottom:1px solid var(--line)}
.burger{display:none}
.nav{counter-reset:n;display:flex;flex-direction:column;margin-top:10px}
.nav a{counter-increment:n;display:flex;align-items:baseline;gap:14px;min-height:54px;padding:14px 0 12px;border-bottom:1px solid var(--line);color:var(--soft);text-decoration:none;font:400 22px/1.2 var(--serif);transition:color .15s,padding .2s}
.nav a::before{content:counter(n,decimal-leading-zero);font:400 10.5px/1 var(--mono);font-stretch:85%;color:var(--mut);letter-spacing:.08em}
.nav a:hover{color:var(--text);padding-left:6px}
.nav a[aria-current]{color:var(--g2)}
.nav a[aria-current]::before{color:var(--g)}
.nav a[aria-current]::after{content:"";align-self:center;margin-left:auto;width:7px;height:7px;background:var(--g);transform:rotate(45deg)}
.stub-end{margin-top:26px;display:grid;gap:14px}
.stub-end dt{font:600 10.5px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.stub-end dd{margin-top:4px;font:400 9.8px/1.5 var(--mono);font-stretch:85%;color:var(--plat);overflow-wrap:anywhere}
.stub-key{order:5;margin-top:auto}
.stub-end{order:4;margin-bottom:28px}
.micro{order:6;height:8px;margin-top:18px;background:var(--micro) repeat-x;flex:none}

/* pane */
.pane{margin-left:288px;padding:0 clamp(28px,4.4vw,64px)}
main{display:block;max-width:1040px;counter-reset:reg;min-width:0}
main>*{min-width:0}
.lead{color:var(--soft);font-size:19px;line-height:1.6;max-width:60ch}

/* hero */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:48px;align-items:center;padding:72px 0 56px}
.eyebrow{display:flex;align-items:center;gap:14px;font:400 11.5px/1.4 var(--mono);font-stretch:85%;letter-spacing:.2em;text-transform:uppercase;color:var(--g)}
.eyebrow::before{content:"";width:48px;height:14px;background:var(--wave) repeat-x;flex:none}
.hero h1{margin-top:22px;font-size:clamp(2.5rem,4.5vw,4.3rem);line-height:1.04;letter-spacing:-.012em}
.hero .lead{margin-top:24px}
.ticks{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:26px;font:400 11.5px/1.5 var(--mono);font-stretch:85%;color:var(--plat);letter-spacing:.02em}
.ticks li{display:flex;align-items:center;gap:10px}
.ticks li::before{content:"";width:6px;height:6px;background:var(--g);transform:rotate(45deg);flex:none}
.hero .acts{margin-top:34px}
.medal{position:relative;width:330px;height:330px;justify-self:end}
.ros-xl{width:100%;height:100%;animation:spin 180s linear infinite}
.ros-xl .ros-c circle:last-child{r:19px}
@keyframes spin{to{transform:rotate(360deg)}}
.medal-c{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.medal-c b{font:400 36px/1 var(--serif);color:var(--text)}
.medal-c span{margin-top:6px;max-width:96px;font:600 8.5px/1.35 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--g2)}

/* facts register */
.facts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--line2);border-bottom:1px solid var(--line2);position:relative}
.facts::before,.facts::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--line)}
.facts::before{top:4px}.facts::after{bottom:4px}
.facts div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:8px;padding:30px 20px 28px;border-left:1px solid var(--line);min-width:0}
.facts div:first-child{border-left:0;padding-left:2px}
.facts dd{font:400 clamp(28px,2.9vw,40px)/1 var(--serif);color:var(--text)}
.facts dt{font:600 10.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.facts div:first-child dd{color:var(--g2)}
.sub{margin-top:18px;display:flex;align-items:center;gap:12px;font:400 11.5px/1.6 var(--mono);font-stretch:85%;color:var(--g2);letter-spacing:.03em}
.sub::before{content:"";width:6px;height:6px;background:var(--g);transform:rotate(45deg);flex:none}

/* registers (sections) */
.reg{margin-top:92px}
.reg-h{counter-increment:reg;display:flex;align-items:center;gap:18px;margin-bottom:34px}
.reg-h::before{content:counter(reg,decimal-leading-zero);font:400 11px/1 var(--mono);font-stretch:85%;color:var(--g);letter-spacing:.1em;padding:7px 8px;border:1px solid var(--line2);flex:none}
.reg-h h2{font-size:clamp(1.75rem,3vw,2.5rem);line-height:1.1;min-width:0}
.reg-h::after{content:"";flex:1 1 60px;min-width:40px;height:14px;background:var(--wave) repeat-x;opacity:.8}
.reg-try{margin-top:64px}
.cells{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.cells.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cells.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cells.steps{grid-template-columns:repeat(3,minmax(0,1fr));counter-reset:st}
.cell{background:var(--bg);padding:30px 28px 32px;min-width:0;transition:background .2s}
.cell:hover{background:var(--panel)}
.cell h3{font-size:23px;line-height:1.2;color:var(--text)}
.cell p{margin-top:12px;color:var(--mut);font-size:15.5px;line-height:1.62}
.c3 .cell h3::before{content:"";display:block;width:26px;height:1px;background:var(--g);margin-bottom:18px}
.steps .cell{counter-increment:st;padding-top:26px}
.steps .cell::before{content:counter(st);display:block;font:400 68px/1 var(--serif);color:transparent;-webkit-text-stroke:1px var(--g);margin-bottom:18px}
.use .cell{padding-left:44px;position:relative}
.use .cell::before{content:"";position:absolute;left:22px;top:38px;width:7px;height:7px;border:1px solid var(--g);transform:rotate(45deg)}
.reg-ben{margin-top:72px}

/* certificate frame */
.cert{position:relative;background:var(--panel);border:1px solid var(--line2);padding:44px 38px 38px}
.cert::before{content:"";position:absolute;inset:6px;border:1px solid var(--line);pointer-events:none}
.cert::after{content:"";position:absolute;left:20px;right:20px;top:15px;height:14px;background:var(--wave) repeat-x;pointer-events:none;opacity:.85}
.cert>*{position:relative}

/* key page */
.keytop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:56px;align-items:start;padding-top:56px}
.keytop h1{font-size:clamp(2.2rem,3.6vw,3.4rem);line-height:1.06;margin-top:20px}
.keytop .lead{margin-top:22px;font-size:17.5px}
.facts-key{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:34px;border-bottom:0}
.facts-key::after{display:none}
.facts-key div{padding:18px 16px 16px;border-bottom:1px solid var(--line)}
.facts-key div:nth-child(odd){border-left:0;padding-left:2px}
.facts-key div:last-child:nth-child(odd){grid-column:1/-1}
.facts-key dd{font-size:26px}
.signup{padding:46px 34px 30px}
.signup-h{display:flex;align-items:center;gap:18px;margin-bottom:22px}
.signup-h h2{font-size:27px;line-height:1.15}
.signup-h p{margin-top:5px;color:var(--mut);font-size:14.5px;line-height:1.5}
.signup-h .ros-s{width:58px;height:58px}
.tabs2{display:flex;border-bottom:1px solid var(--line2);margin-bottom:22px}
.tabs2 button{flex:1;min-height:48px;padding:10px 8px;background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--mut);font:600 12px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.tabs2 button:hover{color:var(--text)}
.tabs2 button[aria-selected="true"]{color:var(--g2);border-bottom-color:var(--g)}
.msg{margin:0 0 18px;padding:12px 14px;border:1px solid var(--g);background:rgba(207,167,127,.08);color:var(--g2);font-size:14.5px;line-height:1.5}
.msg:empty{display:none}
.msg.err{border-color:var(--err);background:rgba(197,100,255,.09);color:var(--err)}
.form .row{margin-bottom:18px}
.form label,.calc label{display:block;margin-bottom:8px;font:600 10.5px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--plat)}
.form input,.calc input{display:block;width:100%;min-height:52px;padding:12px 14px;background:var(--ink);border:1px solid var(--line2);border-radius:2px;color:var(--text);font:400 16px/1.3 var(--sans);transition:border-color .15s,box-shadow .15s}
.form input:hover,.calc input:hover{border-color:var(--plat)}
.form input:focus,.calc input:focus{outline:0;border-color:var(--g);box-shadow:0 0 0 3px rgba(207,167,127,.22)}
.note{margin-top:8px;color:var(--mut);font-size:13px;line-height:1.5}
.form form .btn{width:100%;margin-top:6px}
.form form>.note{margin-top:14px;text-align:center}
.keyout{display:none}
.keyout.on{display:block}
.keyout h3{font-size:24px;margin-bottom:14px}
.keybox{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 16px;background:var(--ink);border:1px solid var(--g);box-shadow:inset 0 0 0 3px var(--ink),inset 0 0 0 4px rgba(207,167,127,.3)}
.keybox span{flex:1;min-width:0;font:400 12.5px/1.5 var(--mono);font-stretch:85%;color:var(--g2);overflow-wrap:anywhere;word-break:break-all}
.keyout>p{margin-top:14px;font-size:14.5px;line-height:1.9;color:var(--soft)}
.keyout>p strong{font-weight:600;color:var(--mut);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.keyout code{font:400 12px/1.5 var(--mono);font-stretch:85%;color:var(--plat);overflow-wrap:anywhere}
.keyout .note{margin-top:10px}
.keyout .acts{margin-top:18px;gap:10px}
.mut{color:var(--mut)}

/* page head */
.ph{padding:60px 0 44px}
.ph h1{margin-top:20px;font-size:clamp(2.3rem,4vw,3.7rem);line-height:1.05;letter-spacing:-.01em;max-width:20ch}
.ph .lead{margin-top:22px}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font:400 10.5px/1.5 var(--mono);font-stretch:85%;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.crumbs li{display:flex;align-items:center;gap:12px;min-width:0}
.crumbs li+li::before{content:"";width:22px;height:1px;background:var(--line2);flex:none}
.crumbs a{color:var(--g2);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.crumbs a:hover{text-decoration:underline}
.crumbs li[aria-current]{max-width:32ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.stamp{margin-top:22px;font:400 11px/1.5 var(--mono);font-stretch:85%;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.stamp time{color:var(--plat)}

/* docs / article shell */
.doc{display:grid;grid-template-columns:minmax(0,1fr) 232px;gap:64px;align-items:start;border-top:1px solid var(--line2);padding-top:48px}
.doc-plain{grid-template-columns:minmax(0,1fr)}
.doc-m{min-width:0}
.doc .reg{margin-top:0}
.doc-s{position:sticky;top:32px;min-width:0}
.toc{border-left:1px solid var(--line2);padding-left:20px}
.toc-h{font:600 10.5px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--g);margin-bottom:10px}
.toc ol{counter-reset:tc}
.toc li{counter-increment:tc}
.toc a{display:flex;gap:10px;padding:8px 0;min-height:44px;align-items:baseline;color:var(--soft);text-decoration:none;font-size:14px;line-height:1.4}
.toc a::before{content:counter(tc,decimal-leading-zero);font:400 9.5px/1 var(--mono);font-stretch:85%;color:var(--mut);flex:none}
.toc a:hover{color:var(--g2)}
.take{margin-bottom:48px;padding:50px 34px 30px}
.take h2{font-size:26px;margin-bottom:16px}
.take ol{counter-reset:tk}
.take li{counter-increment:tk;display:flex;gap:16px;padding:13px 0;border-top:1px solid var(--line);color:var(--soft);font-size:15.5px;line-height:1.55}
.take li::before{content:counter(tk,decimal-leading-zero);font:400 10.5px/1.9 var(--mono);font-stretch:85%;color:var(--g);flex:none}

/* prose */
.prose{max-width:72ch;font-size:17px;line-height:1.75;color:var(--soft)}
.prose>*+*{margin-top:1.15em}
.prose h2{color:var(--text);font-size:clamp(1.65rem,2.6vw,2.15rem);line-height:1.15;margin-top:2.2em;padding-top:30px;background:var(--wave) repeat-x 0 0/48px 14px;background-size:48px 14px;background-repeat:no-repeat;background-image:var(--wave),var(--wave);background-position:0 0,48px 0}
.prose>h2:first-child{margin-top:0}
.prose h3{color:var(--text);font:600 18px/1.35 var(--sans);margin-top:1.9em}
.prose strong{color:var(--text);font-weight:600}
.prose ul,.prose ol{padding-left:1.3em}
.prose ul{list-style:square}.prose ol{list-style:decimal}
.prose li{margin-top:.45em;padding-left:.2em}
.prose li::marker{color:var(--g)}
.prose :not(pre)>code{font:400 .8em/1.4 var(--mono);font-stretch:85%;color:var(--g2);background:var(--panel);border:1px solid var(--line);padding:.15em .4em;overflow-wrap:anywhere}
.prose table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;font-size:15px;line-height:1.5;border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.prose th,.prose td{padding:12px 18px 12px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);min-width:120px}
.prose th{font:600 10.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--plat);white-space:nowrap}
.prose tr:last-child td{border-bottom:0}
.prose blockquote{margin-left:0;margin-right:0;padding-left:20px;border-left:1px solid var(--g);color:var(--text);font:400 1.2em/1.5 var(--serif)}

/* code */
pre.code{position:relative;margin:0;max-width:100%;overflow-x:auto;background:var(--ink);border:1px solid var(--line2);padding:0 20px 20px;font:400 12px/1.8 var(--mono);font-stretch:85%;color:#e6dedc;-moz-tab-size:2;tab-size:2}
pre.code code{font:inherit;display:block;width:max-content;min-width:100%}
.prose pre.code{margin-top:1.3em}
.copy{position:sticky;left:0;display:flex;align-items:center;gap:8px;min-height:44px;margin:0 0 6px;padding:0 2px;background:none;border:0;color:var(--mut);font:600 10.5px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.copy::before{content:"";width:9px;height:11px;border:1px solid currentColor;box-shadow:3px -3px 0 -1px var(--ink),3px -3px 0 0 currentColor}
.copy:hover{color:var(--g2)}
.k{color:var(--g)}.s{color:#e9c2d0}.c{color:#968c87;font-style:italic}
.codebox{border:1px solid var(--line2);background:var(--ink);position:relative}
.codebox::before{content:"";position:absolute;inset:-6px;border:1px solid var(--line);pointer-events:none}
.codetabs{display:flex;border-bottom:1px solid var(--line2);background:var(--panel);overflow-x:auto}
.codetabs button{min-height:48px;padding:10px 22px;background:none;border:0;border-right:1px solid var(--line);border-bottom:2px solid transparent;color:var(--mut);font:400 11px/1 var(--mono);font-stretch:85%;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.codetabs button:hover{color:var(--text)}
.codetabs button[aria-selected="true"]{color:var(--g2);border-bottom-color:var(--g);background:var(--ink)}
.codebox pre.code{border:0}

/* pricing */
.price-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start;margin-top:64px}
.price-grid .reg-h{margin-bottom:24px}
.price-grid .reg-h h2{font-size:28px}
.calcbox{padding:50px 34px 34px}
.calcbox .reg-h::after{display:none}
.calc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.calc>div{min-width:0}
.calc>div:last-child{grid-column:1/-1;margin-top:8px;padding-top:20px;border-top:1px solid var(--line2);display:flex;flex-direction:column}
.calc output{display:block;font:400 clamp(44px,5vw,62px)/1.05 var(--serif);color:var(--g2);overflow-wrap:anywhere}
.ledger{counter-reset:lg;border-top:1px solid var(--line2)}
.ledger li{counter-increment:lg;position:relative;padding:22px 0 22px 48px;border-bottom:1px solid var(--line)}
.ledger li::before{content:counter(lg,decimal-leading-zero);position:absolute;left:0;top:27px;font:400 10.5px/1 var(--mono);font-stretch:85%;color:var(--g)}
.ledger h3{font-size:21px;line-height:1.25}
.ledger p{margin-top:8px;color:var(--mut);font-size:15px;line-height:1.6}

/* faq */
.faq{border-top:1px solid var(--line2)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px;padding:16px 0;cursor:pointer;list-style:none;font:400 21px/1.3 var(--serif);color:var(--text)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--g2)}
.faq summary i{position:relative;flex:none;width:30px;height:30px;border:1px solid var(--line2);border-radius:50%}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1px;background:var(--g);transform:translate(-50%,-50%);transition:transform .2s}
.faq summary i::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq details[open] summary i::after{transform:translate(-50%,-50%)}
.faq details p{padding:0 54px 24px 0;color:var(--mut);max-width:72ch}

/* cta */
.cta{margin-top:96px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:30px;align-items:center;padding:52px 40px 40px}
.cta h2{font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.12}
.cta p{margin-top:8px;color:var(--mut);font-size:15.5px;max-width:54ch}

/* 404 */
.nf{position:relative;padding:96px 0 40px;min-height:70vh;overflow:hidden}
.nf-ros{position:absolute;right:-60px;top:30px;width:420px;height:420px;opacity:.5}
.nf h1{position:relative;font-size:clamp(2.6rem,6vw,5rem);line-height:1.02}
.nf .lead{position:relative;margin-top:20px}
.nf-l{position:relative;margin:34px 0;max-width:380px;border-top:1px solid var(--line2)}
.nf-l a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--line);font:400 21px/1.2 var(--serif);text-decoration:none;color:var(--soft)}
.nf-l a:hover{color:var(--g2)}

/* footer */
.foot{max-width:1040px;margin-top:104px;padding:44px 0 40px;position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 40px;align-items:center}
.foot::before{content:"";position:absolute;left:0;right:0;top:0;height:14px;background:var(--wave) repeat-x}
.foot-b{display:flex;align-items:center;gap:14px;min-width:0}
.foot-b b{display:block;font:400 20px/1.2 var(--serif);overflow-wrap:anywhere}
.foot-b span{display:block;color:var(--mut);font-size:13.5px}
.foot-l{display:flex;flex-wrap:wrap;gap:0 26px}
.foot-l a{display:inline-flex;align-items:center;min-height:44px;color:var(--soft);font-size:14px;text-decoration:none}
.foot-l a:hover{color:var(--g2);text-decoration:underline}
.legal{grid-column:1/-1;padding-top:20px;border-top:1px solid var(--line);color:var(--mut);font-size:12.5px;line-height:1.6}

/* tablet + mobile: counterfoil becomes a slim top bar with drawer */
@media (max-width:1100px){
.hero{grid-template-columns:minmax(0,1fr) 260px;gap:32px}
.medal{width:260px;height:260px}
.medal-c b{font-size:29px}.medal-c span{font-size:7.5px;max-width:78px}
.doc{grid-template-columns:minmax(0,1fr);gap:36px}
.doc-s{position:static;order:-1}
.toc ol{columns:2;column-gap:32px}
.toc li{break-inside:avoid}
.keytop{grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:36px}
}
@media (max-width:940px){
html{scroll-padding-top:76px}
.stub{position:sticky;inset:0 0 auto 0;width:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:0 8px;padding:8px 14px;overflow:visible;border-bottom:1px solid var(--line2);max-height:100vh}
.stub::after{top:auto;bottom:-8px;left:0;right:0;width:auto;height:7px;border:0;background:var(--wave) repeat-x 0 50%/24px 7px;opacity:.7;pointer-events:none}
.brand{flex:1 1 0;font-size:16px;gap:9px}
.ros-seal{width:30px;height:30px}
.stub-tag,.micro{display:none}
.stub-key{order:0;margin:0;min-height:44px;padding:8px 13px;font-size:11px;letter-spacing:.09em;flex:none}
.burger{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;width:44px;height:44px;background:none;border:1px solid var(--line2);border-radius:2px;flex:none}
.burger i{display:block;width:18px;height:1px;background:var(--plat)}
.nav{display:none;order:9;flex:1 0 100%;margin:8px 0 0;border-top:1px solid var(--line)}
.nav.open{display:flex}
.stub-end{display:none;order:10;flex:1 0 100%;margin:14px 0 10px;grid-template-columns:1fr auto;gap:16px}
.nav.open~.stub-end{display:grid}
.pane{margin-left:0;padding:0 clamp(16px,4.5vw,40px)}
.reg{margin-top:68px}
.cells.c3{grid-template-columns:repeat(2,minmax(0,1fr))}
.facts{grid-template-columns:repeat(3,minmax(0,1fr))}
.facts div:nth-child(4){border-left:0;padding-left:2px}
.facts div:nth-child(n+4){border-top:1px solid var(--line)}
.price-grid{grid-template-columns:minmax(0,1fr);gap:56px}
.cta{grid-template-columns:auto minmax(0,1fr)}
.cta-a{grid-column:1/-1}
}
@media (max-width:760px){
body{font-size:16px}
.hero{display:block;padding:40px 0 40px;overflow:hidden;overflow:clip}
.medal{position:absolute;z-index:0;right:-120px;top:-36px;width:300px;height:300px;opacity:.3}
.medal-c{display:none}
.hero-t{position:relative;z-index:1}
.hero h1{font-size:clamp(2.1rem,9.6vw,2.9rem)}
.lead{font-size:17px}
.keytop{display:block;padding-top:28px}
.keytop h1{font-size:clamp(1.95rem,8.4vw,2.6rem);margin-top:10px}
.keytop .lead{font-size:16px;margin-top:14px}
.facts-key{display:none}
.signup{margin-top:26px;padding:42px 20px 22px}
.cert{padding-left:22px;padding-right:22px}
.crumbs ol{flex-wrap:nowrap}.crumbs li:first-child{flex:none}.crumbs li[aria-current]{flex:1 1 0;max-width:none}
.ph{padding:28px 0 32px}
.ph h1{font-size:clamp(2rem,8.6vw,2.7rem);margin-top:10px}
.cells.c3,.cells.c2,.cells.steps{grid-template-columns:minmax(0,1fr)}
.cell{padding:24px 20px 26px}
.use .cell{padding-left:40px}.use .cell::before{left:18px;top:32px}
.steps .cell::before{font-size:54px;margin-bottom:12px}
.facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.facts div{padding:22px 14px 20px}
.facts div:nth-child(4){border-left:1px solid var(--line);padding-left:14px}
.facts div:nth-child(odd){border-left:0;padding-left:2px}
.facts div:nth-child(n+3){border-top:1px solid var(--line)}
.facts div:last-child:nth-child(odd){grid-column:1/-1}
.reg-h{gap:12px;margin-bottom:24px}
.reg-h::after{flex-basis:24px;min-width:24px}
.toc ol{columns:1}
.doc{padding-top:32px}
.prose{font-size:16.5px}
.faq summary{font-size:19px}
.faq details p{padding-right:8px}
.cta{grid-template-columns:minmax(0,1fr);padding:46px 22px 28px;margin-top:72px}
.cta-ros{display:none}
.cta .btn{width:100%}
.calc{grid-template-columns:minmax(0,1fr)}
.foot{grid-template-columns:minmax(0,1fr);margin-top:76px}
.nf{padding-top:56px}.nf-ros{width:300px;height:300px;right:-110px;opacity:.3}
pre.code{padding:0 14px 16px;font-size:11.5px}
.codetabs button{padding:10px 16px}
.hero .acts .btn{flex:1 1 100%}
}
@media (max-width:380px){
.brand{font-size:14.5px;gap:7px}
.ros-seal{width:26px;height:26px}
.stub-key{padding:8px 10px;letter-spacing:.06em}
.stub{padding:8px 12px;gap:0 6px}
}
@media (min-width:941px) and (max-height:700px){
.stub{padding-top:20px}.stub-tag{padding-bottom:14px}.nav a{min-height:46px;padding:10px 0 9px;font-size:20px}.stub-end{margin-top:16px;margin-bottom:16px}
}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{animation:none!important;transition:none!important}
}
@media print{.stub,.cta{display:none}.pane{margin:0}body{background:#ffffff;color:#000000}}