@import url("fonts/fonts.css");

/* The display font has no ruble sign: take ₽ from Golos everywhere. */
@font-face{font-family:'Rub';font-weight:400 900;font-display:swap;src:url('fonts/golos-text-rub.woff2') format('woff2');unicode-range:U+20BD}

:root{
  --bg0:#090E1A;--bg1:#0E1527;--bg2:#131C32;--bg3:#19243E;
  --line:rgba(150,172,214,.15);--line2:rgba(150,172,214,.30);
  --ink0:#F4F6FA;--ink1:#C9D1DE;--ink2:#93A0B6;--ink3:#64718A;
  --acc:#EC7B4F;--acc2:#F7A882;--accA:rgba(236,123,79,.13);--accB:rgba(236,123,79,.50);
  --steel:#8DB3F8;--steelA:rgba(141,179,248,.10);
  --ok:#74D4A0;--okA:rgba(116,212,160,.10);
  --warn:#F2C463;--bad:#F28C82;
  --f-d:'Rub','Sofia Sans Extra Condensed','Oswald','Arial Narrow',sans-serif;
  --f-b:'Rub','Golos Text','Segoe UI',system-ui,sans-serif;
  --f-m:'JetBrains Mono',Consolas,monospace;
  --silver:linear-gradient(180deg,#FFFFFF 0%,#EDF0F5 38%,#BCC5D2 74%,#97A2B4 100%);
  --ease:cubic-bezier(.2,.75,.15,1);
  --wrap:1180px;--gut:clamp(16px,4vw,40px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--bg0);color:var(--ink1);font:400 17px/1.6 var(--f-b);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
body::after{content:"";position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.06;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit}
code{font-family:var(--f-m)}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}
.wrap{width:min(var(--wrap),100% - 2*var(--gut));margin-inline:auto}
@media (max-width:640px){body{font-size:16px}}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;gap:28px;padding:14px max(var(--gut),calc((100% - var(--wrap))/2));border-bottom:1px solid transparent;transition:background .35s,border-color .35s,padding .35s}
.hdr.scrolled{background:rgba(9,14,26,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-color:var(--line);padding-block:10px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink0)}
.logo-mark{width:30px;height:30px;flex:0 0 auto}
.logo-word{font:800 25px/1 var(--f-d);letter-spacing:.03em;text-transform:uppercase}
.logo-word b{color:var(--acc);margin-left:.2em;font-weight:800}
.hdr-nav{display:flex;gap:26px;margin-left:auto}
.hdr-nav a{color:var(--ink2);text-decoration:none;font-size:15px;font-weight:500;transition:color .2s}
.hdr-nav a:hover{color:var(--ink0)}
@media (max-width:880px){.hdr-nav{display:none}.hdr .btn{margin-left:auto}}

/* ---------- buttons ---------- */
.btn{--h:56px;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:var(--h);padding:0 26px;border:0;border-radius:14px;background:var(--acc);color:#1B0E07;font:700 16px/1 var(--f-b);text-decoration:none;white-space:nowrap;cursor:pointer;box-shadow:0 12px 32px -12px var(--accB),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .25s var(--ease),box-shadow .25s,background .25s}
.btn:hover{transform:translateY(-2px);background:#F28B62;box-shadow:0 18px 42px -14px var(--accB),inset 0 1px 0 rgba(255,255,255,.45)}
.btn:active{transform:translateY(0)}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}
.btn-ghost{background:rgba(255,255,255,.02);color:var(--ink0);box-shadow:inset 0 0 0 1px var(--line2)}
.btn-ghost:hover{background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--ink3)}
.btn-sm{--h:42px;padding:0 18px;font-size:14.5px;border-radius:12px}
.btn-wide{width:100%}

/* ---------- hero ---------- */
.hero{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:118px 0 72px;overflow:hidden}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-3}
#nebula{background:radial-gradient(70% 60% at 75% 30%,#1b2a52 0%,transparent 70%),radial-gradient(50% 50% at 15% 80%,rgba(236,123,79,.18),transparent 70%),var(--bg0)}
#stars{z-index:-2;will-change:transform}
.hero::after{content:"";position:absolute;inset:auto 0 0;height:200px;background:linear-gradient(transparent,var(--bg0));z-index:-1;pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center}
.hero-grid > *{min-width:0}
.eyebrow{display:inline-flex;align-items:center;gap:12px;margin:0;font:500 12.5px/1.3 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--acc2)}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
.h-mega{margin:22px 0 26px;font:900 clamp(60px,8.6vw,136px)/.86 var(--f-d);text-transform:uppercase;letter-spacing:.004em;color:var(--ink0)}
.h-mega span{display:block}
.h-mega .l1{background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.h-mega .l2{color:var(--acc);text-shadow:0 0 70px rgba(236,123,79,.35)}
.lead{max-width:33em;margin:0 0 30px;font-size:clamp(17px,1.5vw,20px);color:var(--ink1)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}
.cta-row.center{justify-content:center}
.facts{display:flex;flex-wrap:wrap;gap:10px 24px;margin:30px 0 0;padding:0;list-style:none;font:500 13px/1.3 var(--f-m);color:var(--ink2)}
.facts li::before{content:"◆";margin-right:9px;color:var(--acc);font-size:8px;vertical-align:2px}
@media (max-width:980px){
  .hero{min-height:0;padding-top:104px}
  .hero-grid{grid-template-columns:1fr;gap:38px}
}
@media (max-width:520px){.cta-row .btn{flex:1 1 100%}}

.rise{opacity:0;transform:translateY(20px);animation:rise 1s var(--ease) forwards;animation-delay:calc(var(--i,0)*110ms + 150ms)}
@keyframes rise{to{opacity:1;transform:none}}

/* ---------- agent terminal ---------- */
.term{position:relative;border-radius:22px;overflow:hidden;background:linear-gradient(180deg,rgba(21,31,56,.94),rgba(11,17,32,.96));box-shadow:0 0 0 1px var(--line2),0 50px 90px -40px rgba(0,0,0,.85),0 0 140px -50px rgba(236,123,79,.5)}
.term::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.06),transparent 30%)}
.term-bar{display:flex;align-items:center;gap:7px;padding:14px 18px;border-bottom:1px solid var(--line);font:500 12px/1 var(--f-m);color:var(--ink3);letter-spacing:.03em}
.term-bar i{width:9px;height:9px;border-radius:50%;background:#2B3756}
.term-bar i:first-child{background:var(--acc)}
.term-bar span{margin-left:10px}
.term-body{min-height:338px;padding:22px 22px 20px;font:400 14.5px/1.6 var(--f-m);font-variant-ligatures:none;color:var(--ink1)}
.term-who{margin-bottom:12px;font:500 11.5px/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.term-who b{color:var(--steel);font-weight:500}
.term-ask{min-height:3.25em;margin:0 0 16px;color:var(--ink0)}
.term-ask::before{content:"› ";color:var(--acc)}
.caret{display:inline-block;width:.55em;height:1.1em;margin-left:3px;vertical-align:-.18em;background:var(--acc);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.term-steps{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.term-steps li{display:flex;gap:11px;opacity:0;transform:translateX(-8px);transition:opacity .4s,transform .4s var(--ease)}
.term-steps li.on{opacity:1;transform:none}
.term-steps li::before{content:"";flex:0 0 auto;width:13px;height:13px;margin-top:.33em;border-radius:50%;border:1.5px solid var(--ink3);transition:all .3s}
.term-steps li.on:not(.done)::before{border-color:var(--acc);border-top-color:transparent;animation:spin .8s linear infinite}
.term-steps li.done::before{border-color:var(--ok);background:radial-gradient(circle,var(--ok) 0 2.5px,transparent 3px)}
@keyframes spin{to{transform:rotate(360deg)}}
.term-steps code{color:var(--acc2)}
.term-steps li > span{min-width:0;overflow-wrap:anywhere}
@media (max-width:520px){.term-body{min-height:320px;padding:18px 16px;font-size:13.5px}}
.term-out{display:flex;align-items:center;gap:14px;margin-top:18px;padding:12px 14px;border-radius:14px;background:var(--okA);box-shadow:inset 0 0 0 1px rgba(116,212,160,.32);opacity:0;transform:translateY(10px) scale(.97);transition:opacity .5s,transform .5s var(--ease)}
.term-out.on{opacity:1;transform:none}
.term-out .fi{position:relative;flex:0 0 auto;width:34px;height:42px;border-radius:6px 12px 6px 6px;background:linear-gradient(160deg,#2C3D63,#1A253F);box-shadow:inset 0 0 0 1px var(--line2)}
.term-out .fi::after{content:attr(data-ext);position:absolute;inset:auto 0 6px;text-align:center;font:600 8px/1 var(--f-m);letter-spacing:.04em;color:var(--ok)}
.term-out b{display:block;font:500 14px/1.35 var(--f-m);color:var(--ink0)}
.term-out span{font:400 12.5px/1.35 var(--f-b);color:var(--ink2)}
.roles{display:flex;gap:8px;margin-top:14px;padding:2px;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.roles::-webkit-scrollbar{display:none}
.roles button{flex:0 0 auto;padding:9px 13px;border:0;border-radius:999px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink2);font:500 13px/1 var(--f-b);cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.roles button:hover{color:var(--ink0)}
.roles button[aria-pressed="true"]{background:var(--accA);box-shadow:inset 0 0 0 1px var(--accB);color:var(--acc2)}

/* ---------- sections ---------- */
.sec{position:relative;padding:clamp(76px,10vw,140px) 0}
.sec-tight{padding-top:clamp(30px,5vw,60px)}
.kicker{display:flex;align-items:center;gap:10px;margin:0 0 18px;font:500 12.5px/1 var(--f-m);letter-spacing:.16em;text-transform:uppercase;color:var(--acc2)}
.kicker span{color:var(--ink3)}
.h2{margin:0 0 20px;font:800 clamp(42px,6.2vw,88px)/.9 var(--f-d);text-transform:uppercase;letter-spacing:.004em;color:var(--ink0)}
.h3{margin:0 0 6px;font:800 clamp(30px,3.6vw,44px)/1 var(--f-d);text-transform:uppercase;color:var(--ink0)}
.silver{background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.acc{color:var(--acc)}
.sub{max-width:40em;margin:0;font-size:clamp(16px,1.35vw,18px);color:var(--ink2)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* proof marquee */
.proof{padding:10px 0 0}
.proof-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-bottom:22px}
.proof-head .kicker{margin:0}
.proof-title{margin:0;color:var(--ink1);font-size:16px}
.proof-title b{color:var(--ink0);font-weight:600}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee-track{display:flex;gap:14px;width:max-content;animation:marq 60s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marq{to{transform:translateX(calc(-50% - 7px))}}
.case{width:296px;padding:20px 20px 22px;border-radius:18px;background:var(--bg1);box-shadow:inset 0 0 0 1px var(--line)}
.case .tag{font:500 11px/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.case h3{margin:12px 0 6px;font:700 18px/1.25 var(--f-b);color:var(--ink0)}
.case p{margin:0;font-size:14.5px;line-height:1.5;color:var(--ink2)}

/* chat vs agent */
.vs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:46px}
.vs-card{padding:30px 28px;border-radius:24px;background:var(--bg1);box-shadow:inset 0 0 0 1px var(--line)}
.vs-card.agent{background:radial-gradient(120% 90% at 100% 0%,rgba(236,123,79,.16),transparent 55%),var(--bg1);box-shadow:inset 0 0 0 1px var(--accB)}
.vs-card h3{margin:0 0 6px;font:800 40px/1 var(--f-d);text-transform:uppercase;color:var(--ink0)}
.vs-card.agent h3{color:var(--acc)}
.vs-card .who{margin:0;font:500 12px/1.4 var(--f-m);color:var(--ink3)}
.vs-card ul{display:grid;gap:12px;margin:22px 0 0;padding:0;list-style:none}
.vs-card li{display:grid;grid-template-columns:20px 1fr;gap:10px}
.vs-card li::before{content:"—";color:var(--ink3)}
.vs-card.agent li{color:var(--ink0)}
.vs-card.agent li::before{content:"✓";color:var(--acc);font-weight:700}
@media (max-width:760px){.vs{grid-template-columns:1fr}}

/* 99% */
.big{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,80px);align-items:center}
.big-num{font:900 clamp(150px,23vw,300px)/.8 var(--f-d);letter-spacing:-.01em;background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.big-num small{font-size:.42em;-webkit-text-fill-color:var(--acc);color:var(--acc)}
.big .t{margin:0 0 14px;font:600 clamp(22px,2.5vw,32px)/1.25 var(--f-b);color:var(--ink0)}
.one{margin:24px 0 0;padding:16px 20px;border-left:2px solid var(--acc);border-radius:0 14px 14px 0;background:var(--accA);font-size:15.5px;color:var(--ink1)}
.one b{margin-right:6px;font:800 24px/1 var(--f-d);color:var(--acc2)}
@media (max-width:760px){.big{grid-template-columns:1fr}}

/* professions */
.prof{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px}
.prof-card{display:flex;flex-direction:column;padding:22px 20px 20px;border:0;border-radius:20px;background:var(--bg1);box-shadow:inset 0 0 0 1px var(--line);color:inherit;text-align:left;cursor:pointer;transition:transform .35s var(--ease),box-shadow .35s,background .35s}
.prof-card:hover{transform:translateY(-4px);background:var(--bg2);box-shadow:inset 0 0 0 1px var(--line2),0 24px 50px -30px rgba(0,0,0,.9)}
.prof-card .n{font:500 11px/1 var(--f-m);letter-spacing:.14em;color:var(--ink3)}
.prof-card h3{margin:14px 0 10px;font:800 28px/1 var(--f-d);text-transform:uppercase;color:var(--ink0)}
.prof-card p{flex:1;margin:0 0 18px;font-size:14.5px;line-height:1.5;color:var(--ink2)}
.prof-card .play{font:500 12px/1 var(--f-m);letter-spacing:.06em;color:var(--acc2)}
.prof-card:hover .play{color:var(--acc)}
@media (max-width:1020px){.prof{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.prof{grid-template-columns:1fr}}

/* foundation stages */
.stages{position:relative;display:grid;grid-template-columns:repeat(4,1fr);margin:50px 0 0;padding:0;list-style:none}
.stages::before{content:"";position:absolute;top:27px;left:28px;right:12%;height:2px;background:linear-gradient(90deg,var(--steel),var(--acc));opacity:.55}
.stage{position:relative;padding-right:20px}
.stage .dot{position:relative;z-index:1;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--bg0);box-shadow:inset 0 0 0 2px var(--line2);font:800 22px/1 var(--f-d);color:var(--ink0)}
.stage:last-child .dot{background:radial-gradient(circle,rgba(236,123,79,.3),var(--bg0) 72%);box-shadow:inset 0 0 0 2px var(--acc),0 0 40px -6px var(--accB);color:var(--acc)}
.stage h3{margin:20px 0 6px;font:800 32px/1 var(--f-d);text-transform:uppercase;color:var(--ink0)}
.stage:last-child h3{color:var(--acc)}
.stage p{margin:0;font-size:15px;color:var(--ink2)}
.stages-note{margin:34px 0 0;font:500 13px/1.5 var(--f-m);color:var(--ink3)}
@media (max-width:760px){
  .stages{grid-template-columns:1fr;gap:26px}
  .stages::before{top:10px;bottom:10px;left:27px;right:auto;width:2px;height:auto;background:linear-gradient(180deg,var(--steel),var(--acc))}
  .stage{display:grid;grid-template-columns:56px 1fr;column-gap:18px;padding:0}
  .stage .dot{grid-row:span 2}
  .stage h3{margin:4px 0 4px}
}

/* program */
.prog{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:44px;border-radius:22px;overflow:hidden;background:var(--line);box-shadow:0 0 0 1px var(--line)}
.wk{min-height:158px;padding:24px 22px;background:var(--bg0);transition:background .3s}
.wk:hover{background:var(--bg1)}
.wk .n{font:800 48px/1 var(--f-d);color:transparent;-webkit-text-stroke:1px var(--ink3)}
.wk.hl .n{-webkit-text-stroke:1px var(--acc)}
.wk h3{margin:12px 0 6px;font:700 18px/1.25 var(--f-b);color:var(--ink0)}
.wk p{margin:0;font-size:14.5px;line-height:1.5;color:var(--ink2)}
@media (max-width:900px){.prog{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.prog{grid-template-columns:1fr}.wk{min-height:0}}

/* tariffs */
.tariffs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:48px}
.tc{position:relative;display:flex;flex-direction:column;padding:34px 30px 30px;border-radius:28px;background:var(--bg1);box-shadow:inset 0 0 0 1px var(--line2)}
.tc.pro{background:radial-gradient(120% 80% at 100% 0%,rgba(236,123,79,.22),transparent 55%),linear-gradient(180deg,#152038,#0E1628);box-shadow:inset 0 0 0 1px var(--accB),0 50px 100px -50px rgba(236,123,79,.55)}
.tc .badge{position:absolute;top:24px;right:24px;padding:7px 12px;border-radius:999px;background:var(--acc);color:#1B0E07;font:700 11px/1 var(--f-m);letter-spacing:.1em;text-transform:uppercase}
.tc .nm{margin:0;font:800 46px/1 var(--f-d);text-transform:uppercase;color:var(--ink0)}
.tc .for{margin:8px 0 22px;font-size:15.5px;color:var(--ink2)}
.tc .price{margin:0 0 26px;font:900 clamp(58px,6vw,80px)/1 var(--f-d);color:var(--ink0)}
.tc.pro .price{color:var(--acc)}
.tc ul{display:grid;gap:13px;margin:0 0 30px;padding:0;list-style:none}
.tc li{display:grid;grid-template-columns:20px 1fr;gap:12px;font-size:15.5px;line-height:1.45;color:var(--ink1)}
.tc li::before{content:"";width:20px;height:20px;margin-top:1px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--accB);background:var(--accA) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.2 5.3l1.9 1.9 3.8-4.2' fill='none' stroke='%23F7A882' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat}
.tc .btn{margin-top:auto}
@media (max-width:860px){.tariffs{grid-template-columns:1fr}.tc{padding:30px 22px 24px}}
.costs{display:flex;gap:14px;align-items:flex-start;margin-top:20px;padding:18px 20px;border-radius:16px;background:rgba(242,196,99,.06);box-shadow:inset 0 0 0 1px rgba(242,196,99,.25)}
.costs svg{flex:0 0 auto;margin-top:2px;color:var(--warn)}
.costs p{margin:0;font-size:15px;color:var(--ink1)}
.howto{margin-top:70px}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:26px 0 0;padding:0;list-style:none;counter-reset:s}
.step{padding:24px 22px;border-radius:20px;background:var(--bg1);box-shadow:inset 0 0 0 1px var(--line);counter-increment:s}
.step::before{content:"0" counter(s);font:500 12px/1 var(--f-m);letter-spacing:.14em;color:var(--acc2)}
.step h4{margin:12px 0 6px;font:700 18px/1.3 var(--f-b);color:var(--ink0)}
.step p{margin:0;font-size:15px;color:var(--ink2)}
.refund{margin:20px 0 0;font-size:15px;color:var(--ink2)}
.refund a{color:var(--acc2)}
@media (max-width:860px){.steps3{grid-template-columns:1fr}}

/* authors */
.authors{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:46px}
.au{overflow:hidden;border-radius:28px;background:var(--bg1);box-shadow:inset 0 0 0 1px var(--line)}
.au img{width:100%;height:auto;aspect-ratio:4/4.3;object-fit:cover;object-position:center 18%;-webkit-mask-image:linear-gradient(#000 55%,transparent 98%);mask-image:linear-gradient(#000 55%,transparent 98%)}
.au .txt{position:relative;margin-top:-96px;padding:0 28px 30px}
.au .role{margin:0 0 10px;font:500 12px/1.4 var(--f-m);letter-spacing:.12em;text-transform:uppercase;color:var(--acc2)}
.au h3{margin:0 0 12px;font:800 clamp(38px,4.2vw,52px)/.92 var(--f-d);text-transform:uppercase;color:var(--ink0)}
.au p{margin:0;font-size:15.5px;color:var(--ink1)}
@media (max-width:760px){.authors{grid-template-columns:1fr}}

/* faq */
.faq-wrap{max-width:900px}
.faq{margin-top:40px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;list-style:none;cursor:pointer;font:600 clamp(17px,1.6vw,20px)/1.35 var(--f-b);color:var(--ink0)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:0 0 auto;font:300 30px/1 var(--f-b);color:var(--acc);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{max-width:46em;margin:-4px 0 24px;color:var(--ink2)}
.faq a{color:var(--acc2)}

/* final cta */
.final{position:relative;isolation:isolate;overflow:hidden;padding:clamp(90px,12vw,170px) 0;text-align:center}
.final::before{content:"";position:absolute;inset:auto -10% -55%;height:110%;z-index:-1;background:radial-gradient(closest-side,rgba(236,123,79,.24),transparent)}
.final .h2{margin-bottom:34px}

/* footer */
.ftr{padding:56px 0 calc(28px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#070B15;font-size:14.5px;color:var(--ink2)}
.ftr-grid{display:grid;grid-template-columns:1.1fr 1fr 1.25fr;gap:36px}
.ftr h4{margin:6px 0 16px;font:500 12px/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.ftr-col > a:not(.logo){display:block;margin-bottom:10px;color:var(--ink1);text-decoration:none}
.ftr-col > a:not(.logo):hover,.ftr-col p a:hover{color:var(--acc2)}
.ftr-col p{margin:14px 0 0;line-height:1.65}
.ftr-col p a{color:var(--ink1)}
.ftr-pay{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-top:42px;padding-top:24px;border-top:1px solid var(--line)}
.pay-note{font-size:13.5px}
.paylogos{display:flex;flex-wrap:wrap;gap:8px}
.pl{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:8px;background:#fff;color:#16213A;font:800 13px/1 var(--f-b);letter-spacing:.02em}
.pl-tbank,.pl-tpay{background:#FFDD2D;color:#111}
.pl-mir{color:#0F754E}
.pl-sbp{color:#5B57A2}
.ftr-copy{margin-top:18px;font-size:13px;color:var(--ink3)}
@media (max-width:860px){.ftr-grid{grid-template-columns:1fr;gap:28px}}

/* sticky mobile bar */
.sbar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:60;display:none;justify-content:space-between;align-items:center;gap:12px;padding:10px 10px 10px 18px;border-radius:18px;background:rgba(14,21,39,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px var(--line2),0 20px 40px -12px rgba(0,0,0,.7);transform:translateY(160%);transition:transform .5s var(--ease)}
.sbar.on{transform:none}
.sbar > span{font:600 15px/1.2 var(--f-b);color:var(--ink0)}
.sbar small{display:block;font-size:12.5px;font-weight:400;color:var(--ink2)}
@media (max-width:760px){.sbar{display:flex}}

/* order dialog */
dialog.order{width:min(520px,100% - 20px);max-height:calc(100% - 20px);padding:0;border:0;border-radius:26px;background:var(--bg1);color:var(--ink1);box-shadow:0 0 0 1px var(--line2),0 40px 120px rgba(0,0,0,.75);overscroll-behavior:contain}
dialog.order[open]{animation:pop .45s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.98)}}
dialog.order::backdrop{background:rgba(4,7,14,.74);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.order form{position:relative;padding:30px 28px 24px}
.order .kicker{margin-bottom:10px}
.order h3{margin:0;font:800 36px/1 var(--f-d);text-transform:uppercase;color:var(--ink0)}
.order .sum{display:flex;justify-content:space-between;align-items:baseline;margin:12px 0 22px;padding-bottom:18px;border-bottom:1px solid var(--line);color:var(--ink2)}
.order .sum b{font:900 36px/1 var(--f-d);color:var(--acc)}
.field{display:block;margin-bottom:14px}
.field > span{display:block;margin-bottom:7px;font:500 13px/1.3 var(--f-b);color:var(--ink2)}
.field input{width:100%;height:52px;padding:0 15px;border:0;border-radius:13px;background:var(--bg0);box-shadow:inset 0 0 0 1px var(--line2);color:var(--ink0);font:500 16px/1 var(--f-b);transition:box-shadow .2s}
.field input::placeholder{color:var(--ink3)}
.field input:focus{outline:0;box-shadow:inset 0 0 0 2px var(--acc)}
.field input[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--bad)}
.check{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;margin:12px 0;font-size:14px;line-height:1.45;color:var(--ink2);cursor:pointer}
.check input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--acc)}
.check.bad span{color:var(--bad)}
.check a{color:var(--acc2)}
.order .err{min-height:22px;margin:6px 0 10px;font-size:14px;color:var(--bad)}
.order .x{position:absolute;top:14px;right:14px;width:42px;height:42px;border:0;border-radius:12px;background:transparent;color:var(--ink2);font-size:28px;line-height:1;cursor:pointer}
.order .x:hover{background:rgba(255,255,255,.05);color:var(--ink0)}
.order .fine{margin:14px 0 0;text-align:center;font-size:12.5px;color:var(--ink3)}

/* scroll film: a tall section, the picture sticks to the screen while frames follow the scroll */
.film{position:relative;height:380vh;background:var(--bg0)}
.film-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#05070D url("film/wide/001.webp") center/cover no-repeat}
@media (max-aspect-ratio:17/20){.film-stage{background-image:url("film/tall/001.webp")}}
.film-fade{position:absolute;inset:0;z-index:1;background:var(--bg0);opacity:0;pointer-events:none}
.film-cap .cta-row{margin-top:24px}
.film-cap .eyebrow{margin-bottom:4px;max-width:none}
@media (max-width:640px){
  .film-cap.top{top:88px}
  .film-cap .h-mega{margin-bottom:14px}
  .film-cap .lead{font-size:16px}
  .film-cap .cta-row{margin-top:18px}
  .film-cap .cta-row .btn{flex:0 1 auto}
  .film-cap .film-hint{display:none}
}
.film canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.film-stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(9,14,26,.55),transparent 30%,transparent 70%,rgba(9,14,26,.6))}
.film-cap{position:absolute;z-index:2;left:max(var(--gut),calc((100% - var(--wrap))/2));right:var(--gut);opacity:0;transform:translateY(24px);transition:opacity .6s var(--ease),transform .6s var(--ease);pointer-events:none}
.film-cap.on{opacity:1;transform:none;pointer-events:auto}
.film-cap.top{top:clamp(96px,14vh,150px)}
.film-cap.bottom{bottom:clamp(70px,12vh,120px)}
.film-cap .h-mega{margin:0 0 18px;font-size:clamp(56px,8vw,128px)}
.film-cap p{max-width:30em;margin:0;font:600 clamp(20px,2.4vw,30px)/1.25 var(--f-b);color:var(--ink0);text-shadow:0 2px 24px rgba(0,0,0,.6)}
.film-cap .lead{font-weight:400;font-size:clamp(16px,1.5vw,20px);color:var(--ink1)}
.film-hint{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font:500 12px/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--acc2)}
.film-hint::after{content:"";width:1px;height:34px;background:linear-gradient(var(--acc),transparent);animation:hint 1.6s var(--ease) infinite}
@keyframes hint{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.film-bar{position:absolute;z-index:2;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.06)}
.film-bar i{position:absolute;inset:0;background:var(--acc);transform-origin:left;transform:scaleX(0)}
.film-badge{position:absolute;z-index:3;right:var(--gut);bottom:18px;padding:8px 12px;border-radius:10px;background:rgba(9,14,26,.75);box-shadow:inset 0 0 0 1px var(--line2);font:500 11.5px/1.4 var(--f-m);color:var(--ink2);max-width:300px}
@media (prefers-reduced-motion:reduce){.film{height:100vh;height:100svh}.film-cap.bottom,.film-hint,.film-bar{display:none}.film-cap.top{opacity:1;transform:none}}

/* access & status pages */
.status{min-height:100vh;min-height:100svh;padding:120px 0 80px}
.status .wrap{max-width:860px}
.panel{margin-top:30px;padding:30px 28px;border-radius:26px;background:var(--bg1);box-shadow:inset 0 0 0 1px var(--line2)}
.panel h2{margin:0 0 10px;font:800 clamp(34px,4.6vw,52px)/.95 var(--f-d);text-transform:uppercase;color:var(--ink0)}
.panel p{margin:0 0 14px;color:var(--ink1)}
.panel video{width:100%;margin:10px 0 18px;border-radius:16px;background:#000;box-shadow:0 0 0 1px var(--line2)}
.panel .row{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.panel .hint{font-size:14px;color:var(--ink2)}
.spinner{width:34px;height:34px;margin-bottom:16px;border-radius:50%;border:3px solid var(--line2);border-top-color:var(--acc);animation:spin .9s linear infinite}
[hidden]{display:none!important}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rise,.reveal{opacity:1;transform:none}
}
