:root {
  --background: #f4f7fb;
  --surface: #fff;
  --accent: #5064d8;
  --accent-deep: #3548be;
  --soft: #dfe7ff;
  --ink: #171b2c;
  --muted: #60677a;
  --accent-rgb: 80, 100, 216;
  --font: "Onest", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.theme-neurobox { --background: #f1f9fc; --accent: #2d9fc3; --accent-deep: #197c9d; --soft: #d9f1f8; --accent-rgb: 45, 159, 195; }
.theme-auto { --background: #f4f7ff; --accent: #3a6de0; --accent-deep: #2452bd; --soft: #dfe8ff; --accent-rgb: 58, 109, 224; }
.theme-nyam { --background: #fff7f0; --accent: #e96851; --accent-deep: #c84d39; --soft: #ffe3d8; --accent-rgb: 233, 104, 81; }
.theme-fin { --background: #f1faf6; --accent: #1d9b73; --accent-deep: #117455; --soft: #d7f1e6; --accent-rgb: 29, 155, 115; }
.theme-repetitor { --background: #f4f6ff; --accent: #4d6fe8; --accent-deep: #3354c9; --soft: #e0e7ff; --accent-rgb: 77, 111, 232; }
.theme-mama { --background: #fff6f4; --accent: #db7f70; --accent-deep: #b75e51; --soft: #f8ded9; --accent-rgb: 219, 127, 112; }
.theme-razvivashki { --background: #f2fafb; --accent: #2994a7; --accent-deep: #197386; --soft: #d8f0f3; --accent-rgb: 41, 148, 167; }
.theme-garage { --background: #f2f6f9; --accent: #315b88; --accent-deep: #213f63; --soft: #dce7f0; --accent-rgb: 49, 91, 136; }
.theme-lapki { --background: #f2faf7; --accent: #32977f; --accent-deep: #21745f; --soft: #d8eee7; --accent-rgb: 50, 151, 127; }
.theme-znak { --background: #f7f3fb; --accent: #6850a8; --accent-deep: #4c3787; --soft: #e8def4; --accent-rgb: 104, 80, 168; }

*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; background: var(--background); }
body { min-width: 320px; margin: 0; overflow-x: hidden; color: var(--ink); background: var(--background); font-family: var(--font); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
.skip-link { position: fixed; z-index: 100; top: 8px; left: 8px; padding: 10px 14px; border-radius: 10px; color: #fff; background: var(--ink); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
a:focus-visible { outline: 3px solid var(--ink); outline-offset: 4px; }
.landing { position: relative; min-height: 100svh; overflow: hidden; isolation: isolate; }
.ambient { position: absolute; z-index: -2; border-radius: 50%; pointer-events: none; }
.ambient--top { top: -250px; right: -150px; width: 700px; height: 700px; background: radial-gradient(circle, rgba(var(--accent-rgb), .17) 0, rgba(var(--accent-rgb), .07) 48%, transparent 72%); }
.ambient--bottom { bottom: -360px; left: -290px; width: 660px; height: 660px; background: radial-gradient(circle, rgba(255,255,255,.96) 0, rgba(var(--accent-rgb), .04) 58%, transparent 75%); }
.hero { display: grid; grid-template-columns: minmax(0, 590px) minmax(460px, 560px); grid-template-rows: auto 1fr; column-gap: clamp(52px, 7vw, 104px); width: min(100%, 1344px); min-height: 100svh; margin: 0 auto; padding: 48px 68px 38px; }
.product-badge { display: inline-flex; grid-column: 1; grid-row: 1; width: max-content; min-height: 42px; align-items: center; gap: 8px; padding: 8px 13px; border: 1px solid var(--soft); border-radius: 999px; background: rgba(255,255,255,.9); box-shadow: 0 8px 24px rgba(var(--accent-rgb), .06); font-size: 12px; font-weight: 700; line-height: 18px; letter-spacing: .02em; }
.product-badge__mark { display: inline-flex; width: 24px; height: 24px; align-items: center; justify-content: center; border-radius: 50%; color: #fff; background: var(--accent); font-size: 12px; font-weight: 800; }
.hero__copy { display: flex; grid-column: 1; grid-row: 2; flex-direction: column; align-items: flex-start; align-self: center; gap: 21px; padding: 18px 0 28px; }
.hero h1 { margin: 0; font-size: clamp(50px, 4.35vw, 61px); font-weight: 800; line-height: 1.06; letter-spacing: -.037em; }
.hero__lead { max-width: 570px; margin: 0; font-size: 19px; line-height: 1.5; }
.proof-points { display: flex; flex-wrap: wrap; gap: 9px; margin: 0; padding: 0; list-style: none; }
.proof-points li { display: inline-flex; min-height: 38px; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--accent); border-radius: 999px; background: color-mix(in srgb, var(--soft) 78%, transparent); font-size: 13px; font-weight: 500; line-height: 20px; white-space: nowrap; }
.proof-points li::before { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); content: ""; }
.telegram-cta { display: flex; width: min(100%, 380px); min-height: 60px; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 16px 16px 24px; border-radius: 16px; color: #fff; background: linear-gradient(135deg, var(--accent) 0%, var(--accent-deep) 110%); box-shadow: 0 18px 28px -14px rgba(var(--accent-rgb), .5); font-size: 16px; font-weight: 700; line-height: 24px; transition: transform 180ms ease, box-shadow 180ms ease; }
.telegram-cta:hover { box-shadow: 0 22px 32px -14px rgba(var(--accent-rgb), .62); transform: translateY(-2px); }
.telegram-cta:active { transform: translateY(0); }
.telegram-cta__arrow { display: inline-flex; width: 28px; height: 28px; flex: 0 0 28px; align-items: center; justify-content: center; border-radius: 50%; color: var(--accent); background: #fff; font-size: 17px; }
.handoff-note { margin: -5px 0 0; font-size: 12px; line-height: 17px; }
.legal-links { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: -11px; color: var(--muted); font-size: 10px; line-height: 15px; }
.legal-links a { text-decoration: underline; text-decoration-color: rgba(96,103,122,.4); text-underline-offset: 3px; }
.hero__visual { position: relative; display: flex; grid-column: 2; grid-row: 1 / 3; width: 560px; height: 610px; align-self: center; justify-self: center; }
.visual-scene { position: relative; width: 560px; height: 610px; }
.visual-scene__glow { position: absolute; top: 72px; left: 40px; width: 480px; height: 480px; border-radius: 50%; background: radial-gradient(circle, rgba(var(--accent-rgb), .22) 0, rgba(var(--accent-rgb), .1) 42%, transparent 70%); filter: blur(14px); }
.visual-scene__halo { position: absolute; top: 112px; left: 76px; width: 408px; height: 408px; border: 1px solid rgba(var(--accent-rgb), .2); border-radius: 50%; box-shadow: inset 0 0 72px rgba(var(--accent-rgb), .05); }
.visual-scene__image { position: absolute; z-index: 2; inset: 4px 0 auto; width: 550px; height: 588px; object-fit: contain; filter: drop-shadow(0 28px 30px rgba(var(--accent-rgb), .15)); }
.visual-callout { position: absolute; z-index: 4; right: 2px; bottom: 66px; display: flex; min-height: 66px; align-items: center; gap: 11px; padding: 10px 16px 10px 12px; border: 1px solid rgba(var(--accent-rgb), .18); border-radius: 18px; background: rgba(255,255,255,.9); box-shadow: 0 18px 36px -14px rgba(var(--accent-rgb), .31); backdrop-filter: blur(16px); }
.visual-callout__pulse { width: 11px; height: 11px; flex: 0 0 11px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 6px rgba(var(--accent-rgb), .13); }
.visual-callout small { display: block; color: var(--muted); font-size: 10px; font-weight: 500; line-height: 14px; }
.visual-callout strong { display: block; font-size: 13px; line-height: 18px; }
.policy-body { min-height: 100svh; padding: 32px 20px; }
.policy-card { width: min(100%, 760px); margin: 0 auto; padding: clamp(26px, 5vw, 56px); border: 1px solid var(--soft); border-radius: 28px; background: rgba(255,255,255,.94); box-shadow: 0 24px 70px -40px rgba(var(--accent-rgb), .55); }
.policy-card h1 { margin: 12px 0 26px; font-size: clamp(36px, 6vw, 56px); line-height: 1.04; letter-spacing: -.04em; }
.policy-card h2 { margin: 28px 0 8px; font-size: 20px; }
.policy-card p { color: var(--muted); font-size: 16px; line-height: 1.65; }
.policy-kicker { color: var(--accent) !important; font-size: 12px !important; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.policy-back { color: var(--accent-deep); font-size: 14px; font-weight: 700; }

@media (max-width: 1090px) and (min-width: 761px) {
  .hero { grid-template-columns: minmax(0, 520px) 400px; gap: 22px; padding-inline: 42px; }
  .hero__visual { width: 400px; height: 436px; }
  .visual-scene { transform: scale(.715); transform-origin: top left; }
  .hero h1 { font-size: 49px; }
}

@media (max-width: 760px) {
  .ambient--top { top: -160px; right: -180px; width: 520px; height: 520px; }
  .hero { grid-template-columns: 1fr; grid-template-rows: auto 300px auto; width: 100%; min-height: 100svh; padding: 20px 24px 26px; }
  .product-badge { grid-column: 1; grid-row: 1; min-height: 38px; padding: 7px 11px; font-size: 11px; line-height: 16px; }
  .product-badge__mark { width: 22px; height: 22px; }
  .hero__visual { grid-column: 1; grid-row: 2; width: 319px; height: 300px; align-self: start; justify-self: center; }
  .visual-scene { transform: scale(.57); transform-origin: top left; }
  .hero__copy { grid-column: 1; grid-row: 3; align-self: start; gap: 14px; padding: 3px 0 0; }
  .hero h1 { width: 100%; font-size: clamp(35px, 9.4vw, 38px); line-height: 1.07; letter-spacing: -.035em; }
  .hero__lead { max-width: 350px; font-size: 15px; line-height: 22px; }
  .proof-points { gap: 7px; }
  .proof-points li { min-height: 36px; padding: 7px 10px; font-size: 12px; }
  .telegram-cta { width: 100%; max-width: 100%; }
  .handoff-note { margin-top: 0; font-size: 11px; line-height: 15px; }
  .legal-links { margin-top: -7px; font-size: 9px; }
}

@media (max-width: 360px) {
  .hero { grid-template-rows: auto 274px auto; padding-inline: 18px; }
  .hero__visual { width: 290px; height: 274px; }
  .visual-scene { transform: scale(.52); }
}

@media (prefers-reduced-motion: no-preference) {
  .visual-scene__image { animation: quiet-float 5.5s ease-in-out infinite; }
  .visual-callout__pulse { animation: quiet-pulse 2.4s ease-in-out infinite; }
}

@keyframes quiet-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes quiet-pulse { 0%, 100% { box-shadow: 0 0 0 6px rgba(var(--accent-rgb), .13); } 50% { box-shadow: 0 0 0 10px rgba(var(--accent-rgb), .025); } }