/* Production illustrations retain their own aspect ratio. No sprite stretching. */
:root{--blue:#0054ef;--ink:#102547;--muted:#435f83;--line:#bad0ed}
body{background:radial-gradient(ellipse 75% 650px at 88% 5%,#bed8ff80,transparent 75%),#f8fbff}
.hero{isolation:isolate;grid-template-columns:1fr 1.22fr;gap:16px;min-height:640px}
.hero:before{content:'';position:absolute;z-index:-1;inset:-100px 0 -10px 30%;background:radial-gradient(ellipse,#3d8dff2e,transparent 65%);pointer-events:none}
.hero-art{margin:0 -30px 0 -30px;background:none;border:0;position:relative;z-index:1}
.hero-art>img{display:block;width:100%;height:auto;mix-blend-mode:normal;object-fit:contain;filter:drop-shadow(0 28px 27px #1353a912)}
.hero h1{font-size:clamp(45px,5vw,72px)}
.floating-chip{left:8%;bottom:5%;background:#fffffff2;border-color:#d1e2ff;color:#143c70;box-shadow:0 12px 35px #0054ee16}
.hero .lead{color:#415b7c}
.eyebrow{color:#27528b}
.benefits{gap:22px;padding-top:10px}
.benefits article{display:block;background:#fff;border-color:#bfd4f1;box-shadow:0 8px 25px #064db20a}
.benefits article>div{padding:27px}
.benefits h2{font-size:25px;color:#0e2850}
.benefits p{color:#425d80;font-size:13px}
.feature-art{display:flex;align-items:center;justify-content:center;margin:0;width:100%;aspect-ratio:3/2;overflow:hidden;background:#e6f0ff}
.feature-art img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.feature-phone{background:radial-gradient(ellipse at 50% 15%,#edf5ff,#6c9eff 70%,#0750dc);padding:12px}
.feature-phone img{width:auto;max-width:100%;height:100%;filter:drop-shadow(10px 12px 10px #07337d40)}
.helper-card{border-color:#b8cfee;background:linear-gradient(125deg,#fff,#eaf2ff)}
.helper-card:hover{border-color:#0061f9;background:#e3eeff;box-shadow:0 7px 24px #0057e61c}
.phone-banner{background:radial-gradient(ellipse at 85% 40%,#479aff 0,transparent 58%),linear-gradient(115deg,#002ba8,#0062f7);color:#fff;grid-template-columns:1.2fr 1fr;gap:30px;padding:48px 64px;border-color:#145bef;box-shadow:0 20px 60px #0052d71c;min-height:440px}
.phone-banner h2,.phone-banner h2 span{color:#fff}
.phone-banner .eyebrow{color:#d1e3ff;letter-spacing:1.8px}
.phone-banner p{color:#e3eeff;font-size:15px;line-height:1.8}
.phone-banner .button.secondary{background:#fff;border-color:#fff;color:#0343bb;box-shadow:0 6px 20px #00267522}
.phone-cabinet{display:inline-block;color:#fff;font-size:12px;text-decoration-thickness:1px;text-underline-offset:5px}
.phone-illustration{display:flex;align-items:center;justify-content:center;min-width:0;height:380px}
.phone-illustration img{display:block;width:auto;max-width:100%;height:100%;object-fit:contain;filter:drop-shadow(14px 20px 20px #00196d40)}
.mobile-preview{transform:none;width:300px;height:auto;aspect-ratio:390/844;border:8px solid #162e52;border-radius:34px;box-shadow:0 22px 45px #0b428721}
.mobile-preview img{display:block;width:100%;height:auto}
.plan{border-color:#b8d0f0}.plan.featured{border-color:#005fff;box-shadow:0 8px 24px #0054ef13}.plan.featured>span{color:#0054df}
/* Explicit CTA roles beat article link styles; never blue text on blue fill. */
a.button:not(.secondary),button.button:not(.secondary),.reading a.button:not(.secondary),.legal-page a.button:not(.secondary){color:#fff;background:linear-gradient(#0872ee,#004bd0)}
a.button.secondary,button.button.secondary{color:#073d92;background:#fff}
.hero-actions>a[href="/demo"]{display:inline-flex;align-items:center;justify-content:center;min-height:51px;padding:12px 19px;color:#0544ab;background:#fff;border:2px solid #1264ee;border-radius:8px;font-size:14px;font-weight:650;box-shadow:0 5px 18px #075be816;text-decoration:none}
.hero-actions>a[href="/demo"]:hover{background:#e6f0ff;box-shadow:0 7px 22px #0054ef25}
.hero-actions>a[href="/demo"]:before{content:'Демо · ';white-space:pre}
.hero .hero-actions{gap:12px}
.pricing .section-heading>a[href="/demo"]{font-size:14px;color:#0643a4;background:#e7f0ff;border:1px solid #a7c7f3;border-radius:8px;padding:12px 17px}
@media(max-width:1000px){.hero{grid-template-columns:1fr 1.05fr;min-height:560px}.hero h1{font-size:55px}.hero-art{margin:0 -10px}.phone-banner{padding:40px}.benefits article>div{padding:21px}.phone-illustration{height:330px}}
@media(max-width:760px){.hero{grid-template-columns:1fr;min-height:0;gap:8px}.hero:before{inset:10% -4% -4% 0}.hero h1{font-size:49px}.hero-art{height:auto;margin:0}.hero-art>img{width:100%;height:auto}.floating-chip{left:8%;bottom:2%;font-size:11px}.benefits{gap:24px;padding-top:28px}.benefits article{display:block}.feature-art{aspect-ratio:3/2}.benefits article>div{padding:26px}.benefits h2{font-size:26px}.benefits p{font-size:14px}.benefits .eyebrow{font-size:9px}.phone-banner{grid-template-columns:1fr;padding:32px;gap:25px;min-height:0}.phone-banner h2{font-size:42px}.phone-banner p{font-size:14px}.phone-illustration{height:340px}.phone-banner .hero-actions{gap:14px}.mobile-preview{width:min(300px,100%);height:auto}.helper-card{background:#edf4ff}}
@media(prefers-reduced-motion:reduce){.hero-art>img{animation:none}}
.legal-page h1{margin-bottom:16px;overflow-wrap:anywhere}
.legal-updated{font-size:14px;color:#526782;margin:0 0 32px}
.legal-page article{overflow-wrap:anywhere}
.footer-bottom nav{flex-wrap:wrap}
.footer-bottom .payment-label{display:block;width:100%;font-size:13px;color:#526782}
@media(max-width:520px){.legal-page h1{font-size:clamp(24px,7.2vw,34px);line-height:1.18}}
/* Game hubs and the continuous autorun landscape. */
.hero .game-heading{font-size:clamp(38px,4.5vw,70px);line-height:1.04;letter-spacing:-.05em}
.profession-hero .profession-heading{font-size:clamp(34px,4.2vw,66px);line-height:1.08}
.hero-checks,.autorun-modes{display:flex;flex-wrap:wrap;gap:10px 22px;list-style:none;padding:0;margin:24px 0;color:#173d70;font-size:14px;font-weight:650}
.hero-checks li:before,.autorun-modes li:before{content:'✓';display:inline-block;margin-right:8px;color:#005cfa;font-weight:800}
.autorun-feature{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;overflow:hidden;min-height:530px;border-radius:32px;background:linear-gradient(110deg,#eef5ff,#edf5ff 56%,#e4efff);border:1px solid #d4e4ff;margin-top:16px;margin-bottom:92px;box-shadow:0 24px 70px -50px #1163dc80}
.autorun-copy{position:relative;z-index:2;padding:48px 0 48px 46px}
.autorun-copy h2{font-size:clamp(32px,3.8vw,57px);line-height:1.05;letter-spacing:-.045em;margin:18px 0 22px;color:#102d56}
.autorun-copy h2 span{color:#005cfa}
.autorun-copy .lead{font-size:17px;line-height:1.65;max-width:570px}
.autorun-modes{gap:12px 22px;margin:24px 0 16px}
.autorun-caption{color:#496c99;font-size:13px;line-height:1.7}
.autorun-scene{align-self:stretch;position:relative;min-width:0;margin:0;display:flex;align-items:center;mix-blend-mode:multiply}
.autorun-scene img{width:124%;max-width:none;height:auto;position:relative;left:-12%;object-fit:contain;mask-image:linear-gradient(to right,transparent,#000 13%,#000 94%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 13%,#000 94%,transparent)}
.route-pulse{display:inline-block;width:7px;height:7px;border-radius:100%;background:#0064ff;margin-right:6px;box-shadow:0 0 0 5px #0064ff12;animation:route-beacon 2.5s ease-in-out infinite}
@keyframes route-beacon{50%{box-shadow:0 0 0 9px #0064ff05}}
.game-portals{margin-bottom:92px}.game-portals .section-heading>p{max-width:260px;color:#52719b}
.game-portal-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.game-portal{display:flex;flex-direction:column;padding:38px;border:1px solid #c7daff;border-radius:24px;background:linear-gradient(145deg,#fff,#edf4ff);text-decoration:none;color:#12315a;transition:transform .2s,box-shadow .2s}
.game-portal.majestic{background:radial-gradient(ellipse at 95% 0,#278bff44,transparent 70%),linear-gradient(140deg,#082c66,#0c47a5);color:#fff;border-color:#194f9c}
.game-portal h3{font-size:clamp(28px,3.2vw,46px);line-height:1.05;letter-spacing:-.04em;margin:28px 0 18px}
.game-portal h3 span{color:#0062ff}.game-portal.majestic h3 span{color:#a2c8ff}
.game-portal p{max-width:440px;line-height:1.7;font-size:15px;color:#496b96}.game-portal.majestic p,.game-portal.majestic .eyebrow{color:#d4e5ff}
.game-portal-action{margin-top:auto;padding-top:26px;font-weight:700;display:flex;gap:20px;justify-content:space-between}.game-portal-action b{font-size:22px}
.game-portal:hover{transform:translateY(-3px);box-shadow:0 18px 40px -25px #005ce588}
.guide-hero{padding-top:70px;padding-bottom:54px;max-width:1000px}.guide-hero h1{font-size:clamp(35px,5vw,68px);line-height:1.08;letter-spacing:-.04em}.guide-hero .lead{max-width:820px}
.learning-links{margin-top:65px;margin-bottom:70px}.learning-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:25px}.learning-grid>a{display:block;border-top:2px solid #a9c8ff;padding:24px 0;text-decoration:none;color:#193d6c}.learning-grid h3{font-size:21px}.learning-grid p{font-size:14px;line-height:1.7;color:#52719b}
@media(max-width:1000px){.site-header .header-inner{flex-wrap:wrap;gap:14px;padding-top:14px;padding-bottom:14px}.site-header nav{order:3;width:100%;display:flex;justify-content:center;flex-wrap:wrap;gap:12px 22px}.header-account{margin-left:auto}.autorun-feature{grid-template-columns:1fr 1fr;min-height:0}.autorun-copy{padding:32px 0 32px 28px}.autorun-copy .lead{font-size:15px}.autorun-scene img{width:140%;left:-20%}.autorun-copy .hero-actions{flex-wrap:wrap;gap:18px}}
@media(max-width:680px){.site-header nav{font-size:12px;gap:10px 16px}.hero .game-heading{font-size:40px}.hero-checks{gap:10px 14px;font-size:12px}.autorun-feature{display:flex;flex-direction:column;margin-bottom:58px;border-radius:24px}.autorun-copy{padding:30px 22px 0;align-self:stretch}.autorun-copy h2{font-size:36px}.autorun-scene{min-height:0;margin-top:2px;align-self:stretch}.autorun-scene img{width:100%;left:0;mask-image:linear-gradient(to bottom,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 10%,#000 90%,transparent)}.autorun-modes{gap:10px 18px;font-size:13px}.game-portal-grid,.learning-grid{grid-template-columns:1fr}.game-portal{padding:28px}.game-portals{margin-bottom:55px}.guide-hero{padding-top:40px}.guide-hero h1{font-size:36px}}
@media(prefers-reduced-motion:reduce){.route-pulse{animation:none}.game-portal{transition:none}}

/* Fade the illustration into the shared surface on all four edges. */
@media(min-width:681px){.autorun-scene img{width:114%;left:-7%;mask-image:linear-gradient(to right,transparent,#000 14%,#000 88%,transparent),linear-gradient(to bottom,transparent,#000 13%,#000 87%,transparent);mask-composite:intersect;-webkit-mask-image:linear-gradient(to right,transparent,#000 14%,#000 88%,transparent),linear-gradient(to bottom,transparent,#000 13%,#000 87%,transparent);-webkit-mask-composite:source-in}}
.autorun-feature a[href="/demo"]::before{content:none}.autorun-copy h2{max-width:480px}
