/* ЖуйЖги — главная страница (2026-11, «современный слой»).
   Все селекторы начинаются с .lp-, поэтому старые стили лендинга и темы приложения не мешают.
   Раскладка, тексты и маскоты общие для трёх тем; тема меняет цвет, шрифт заголовков, радиусы и тени
   (см. docs/product/design-themes.md, «Характер тем»). */

/* ---------- Токены тем ---------- */
:root,
:root[data-theme="light"] {
  --lp-bg: #f5f5f3;
  --lp-surface: #ffffff;
  --lp-surface-2: #eeede9;
  --lp-ink: #1d1f23;
  --lp-muted: #5b5f68;
  --lp-line: #e3e1db;
  --lp-line-strong: #cdcac2;
  --lp-accent: #e0603a;
  --lp-accent-ink: #b0401c;
  --lp-accent-soft: #fdece4;
  --lp-primary-bg: #1d1f23;
  --lp-on-primary: #ffffff;
  --lp-primary-shadow: 0 10px 24px -10px rgba(29, 31, 35, .55);
  --lp-em: #e0603a;
  --lp-glow-a: #ffd8c4;
  --lp-glow-b: #e2e3ff;
  --lp-ok: #1f7a55;
  --lp-ok-soft: #e6f4ed;
  --lp-bad: #b3263e;
  --lp-bad-soft: #fdecef;
  --lp-font-display: "Manrope", ui-sans-serif, system-ui, sans-serif;
  --lp-font-body: "Manrope", ui-sans-serif, system-ui, sans-serif;
  --lp-h-weight: 800;
  --lp-h-case: none;
  --lp-h-track: -.04em;
  --lp-h-leading: 1.04;
  --lp-h-scale: 1;
  --lp-radius-sm: .75rem;
  --lp-radius: 1rem;
  --lp-radius-lg: 1.5rem;
  --lp-radius-btn: .9rem;
  --lp-radius-bar: 999px;
  --lp-card-line: var(--lp-line);
  --lp-card-shadow: 0 1px 2px rgba(29, 31, 35, .04), 0 18px 40px -22px rgba(29, 31, 35, .22);
  --lp-nav-bg: rgba(255, 255, 255, .74);
  --lp-phone-frame: #17181c;
  --lp-btn-case: none;
  --lp-btn-track: 0;
  --lp-panel: linear-gradient(135deg, #fff0e8 0%, #ecebff 100%);
}

:root[data-theme="care"] {
  --lp-bg: #fff3f7;
  --lp-surface: #ffffff;
  --lp-surface-2: #ffe7f0;
  --lp-ink: #2d1f3a;
  --lp-muted: #6c597a;
  --lp-line: #f3d9e5;
  --lp-line-strong: #e6bfd2;
  --lp-accent: #cf3a78;
  --lp-accent-ink: #b0205f;
  --lp-accent-soft: #fde4ef;
  --lp-primary-bg: linear-gradient(100deg, #cf3a78 0%, #9257d2 100%);
  --lp-on-primary: #ffffff;
  --lp-primary-shadow: 0 14px 28px -12px rgba(176, 32, 95, .6);
  --lp-em: #cf3a78;
  --lp-glow-a: #ffc3dc;
  --lp-glow-b: #dccaff;
  --lp-font-display: "Nunito", ui-rounded, "Manrope", system-ui, sans-serif;
  --lp-font-body: "Nunito", ui-rounded, "Manrope", system-ui, sans-serif;
  --lp-h-weight: 800;
  --lp-h-track: -.03em;
  --lp-h-leading: 1.06;
  --lp-radius-sm: 1rem;
  --lp-radius: 1.5rem;
  --lp-radius-lg: 1.75rem;
  --lp-radius-btn: 999px;
  --lp-card-line: transparent;
  --lp-card-shadow: 0 22px 50px -22px rgba(207, 58, 120, .34), 0 2px 6px rgba(207, 58, 120, .06);
  --lp-nav-bg: rgba(255, 255, 255, .78);
  --lp-phone-frame: #ffffff;
  --lp-panel: linear-gradient(135deg, #ffdcec 0%, #e6d8ff 100%);
}

:root[data-theme="dark"] {
  --lp-bg: #09090b;
  --lp-surface: #121214;
  --lp-surface-2: #1b1b1f;
  --lp-ink: #f5f5f7;
  --lp-muted: #a7a7b2;
  --lp-line: #2a2a31;
  --lp-line-strong: #46464f;
  --lp-accent: #d7ff3f;
  --lp-accent-ink: #d7ff3f;
  --lp-accent-soft: #1e2308;
  --lp-primary-bg: #d7ff3f;
  --lp-on-primary: #111113;
  --lp-primary-shadow: 0 10px 28px -10px rgba(215, 255, 63, .45);
  --lp-em: #d7ff3f;
  --lp-glow-a: #2f3f00;
  --lp-glow-b: #2b1d52;
  --lp-ok: #a8df8b;
  --lp-ok-soft: #1c241d;
  --lp-bad: #ffa6b6;
  --lp-bad-soft: #35212a;
  --lp-font-display: "Oswald", "Manrope", Impact, sans-serif;
  --lp-h-weight: 600;
  --lp-h-case: uppercase;
  --lp-h-track: .005em;
  --lp-h-leading: 1.12;
  --lp-h-scale: 1.12;
  --lp-radius-sm: .375rem;
  --lp-radius: .5rem;
  --lp-radius-lg: .625rem;
  --lp-radius-btn: .375rem;
  --lp-radius-bar: .75rem;
  --lp-card-line: var(--lp-line);
  --lp-card-shadow: 0 24px 50px -28px rgba(0, 0, 0, .9);
  --lp-nav-bg: rgba(14, 14, 16, .76);
  --lp-phone-frame: #26262c;
  --lp-btn-case: uppercase;
  --lp-btn-track: .06em;
  --lp-panel: linear-gradient(135deg, #0d0d10 0%, #14160b 100%);
}

/* ---------- Основа ---------- */
html:has(body.lp-page) {
  /* На больших экранах интерфейс растёт целиком, а не расползается по ширине. */
  font-size: clamp(16px, calc(16px + (100vw - 1440px) * .0036), 20px);
  scroll-behavior: smooth;
  scroll-padding-top: 5.5rem;
  overflow-x: clip;
  background: var(--lp-bg);
}
.lp-page {
  min-height: 100vh;
  margin: 0;
  overflow-x: clip;
  color: var(--lp-ink);
  background: var(--lp-bg);
  font-family: var(--lp-font-body);
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
.lp-page :is(h1, h2, h3, h4, p, ul, ol, figure, blockquote) { margin: 0; }
.lp-page :is(ul, ol) { padding: 0; list-style: none; }
.lp-page :where(img, video, svg) { display: block; max-width: 100%; }
.lp-page :where(a) { color: inherit; }
.lp :is(a, button, summary, input):focus-visible,
.lp-nav :is(a, button, summary):focus-visible,
.lp-footer a:focus-visible {
  outline: 2px solid var(--lp-accent-ink);
  outline-offset: 3px;
  border-radius: .35rem;
}
.lp-skip { position: fixed; z-index: 100; left: .75rem; top: .75rem; padding: .75rem 1.1rem; color: var(--lp-on-primary); background: var(--lp-ink); border-radius: var(--lp-radius-sm); transform: translateY(-200%); text-decoration: none; }
.lp-skip:focus { transform: none; }

.lp-container { width: min(72rem, calc(100% - 2.5rem)); margin-inline: auto; }
@media (min-width: 720px) { .lp-container { width: min(72rem, calc(100% - 4rem)); } }
.lp-section { padding-block: clamp(2.75rem, 5vw, 5rem); }

.lp-page :is(h1, h2, h3, h4) {
  font-family: var(--lp-font-display);
  font-weight: var(--lp-h-weight);
  text-transform: var(--lp-h-case);
  letter-spacing: var(--lp-h-track);
  line-height: var(--lp-h-leading);
  text-wrap: balance;
}
.lp-page :is(h1, h2) em { font-style: normal; color: var(--lp-em); }
:root[data-theme="care"] .lp-page :is(h1, h2) em {
  color: transparent;
  background: linear-gradient(100deg, #e0488a 0%, #9257d2 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
.lp-page h2 { font-size: calc(var(--lp-h-scale) * clamp(2rem, 1.1rem + 2.7vw, 3.25rem)); }
.lp-page p { text-wrap: pretty; }

/* ---------- Мелочи: плашки, кнопки, ссылки ---------- */
.lp-pill {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: .55rem;
  padding: .42rem .95rem;
  color: var(--lp-accent-ink);
  background: var(--lp-accent-soft);
  border-radius: 999px;
  font-size: .8125rem;
  font-weight: 700;
  line-height: 1.3;
}
.lp-pill__dot { width: .45rem; height: .45rem; flex: none; background: currentColor; border-radius: 50%; }
:root[data-theme="dark"] .lp-pill { border-radius: .375rem; border: 1px solid rgba(215, 255, 63, .28); font-family: var(--lp-font-display); font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }

.lp-btn {
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  padding: 0 1.4rem;
  color: var(--lp-ink);
  border: 1px solid transparent;
  border-radius: var(--lp-radius-btn);
  font: 700 .9375rem/1.1 var(--lp-font-body);
  letter-spacing: var(--lp-btn-track);
  text-decoration: none;
  text-transform: var(--lp-btn-case);
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
}
.lp-btn .ui-icon { width: 1.2em; height: 1.2em; flex: none; transition: transform .2s ease; }
.lp-btn:hover .ui-icon { transform: translateX(.2rem); }
.lp-btn--lg { min-height: 3.5rem; padding: 0 1.8rem; font-size: 1rem; }
.lp-btn--block { width: 100%; }
.lp-btn--primary { color: var(--lp-on-primary); background: var(--lp-primary-bg); box-shadow: var(--lp-primary-shadow); }
.lp-btn--primary:hover { transform: translateY(-2px); }
.lp-btn--primary:active { transform: translateY(0); }
.lp-btn--ghost { background: var(--lp-surface); border-color: var(--lp-line-strong); }
.lp-btn--ghost:hover { border-color: var(--lp-accent); }
:root[data-theme="dark"] .lp-btn--primary { clip-path: polygon(0 0, calc(100% - .7rem) 0, 100% .7rem, 100% 100%, .7rem 100%, 0 calc(100% - .7rem)); border-radius: 0; box-shadow: none; }
.lp-btn__play { position: relative; width: 1.65rem; height: 1.65rem; flex: none; background: var(--lp-accent-soft); border-radius: 50%; }
.lp-btn__play::after { content: ""; position: absolute; left: 50%; top: 50%; width: .5rem; height: .6rem; background: var(--lp-accent-ink); transform: translate(-35%, -50%); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.lp-link { display: inline-flex; align-items: center; gap: .45rem; color: var(--lp-accent-ink); font-weight: 700; text-decoration: none; }
.lp-link .ui-icon { width: 1.1em; height: 1.1em; transition: transform .2s ease; }
.lp-link:hover { text-decoration: underline; text-underline-offset: .3em; }
.lp-link:hover .ui-icon { transform: translateX(.2rem); }

.lp-card { background-color: var(--lp-surface); border: 1px solid var(--lp-card-line); border-radius: var(--lp-radius-lg); box-shadow: var(--lp-card-shadow); }
.lp-icon-tile { display: grid; width: 3rem; height: 3rem; flex: none; place-items: center; color: var(--lp-accent-ink); background: var(--lp-accent-soft); border-radius: var(--lp-radius-sm); }
.lp-icon-tile .ui-icon { width: 1.4rem; height: 1.4rem; }

.lp-head { display: grid; max-width: 46rem; justify-items: center; gap: 1rem; margin: 0 auto clamp(2rem, 4vw, 3.25rem); text-align: center; }
.lp-head__sub { max-width: 38rem; color: var(--lp-muted); font-size: clamp(1rem, .95rem + .3vw, 1.1875rem); }

.lp-notice { margin: 1rem 0 0; padding: .9rem 1.1rem; color: var(--lp-ok); background: var(--lp-ok-soft); border-radius: var(--lp-radius-sm); font-size: .9375rem; }
.lp-notice--error { color: var(--lp-bad); background: var(--lp-bad-soft); }

/* Мягкое появление при прокрутке; без поддержки браузером блоки просто видны. */
@supports (animation-timeline: view()) {
  .lp-reveal { animation: lp-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 32%; }
}
/* translate, not transform: hover lifts on the same cards keep working. */
@keyframes lp-rise { from { opacity: 0; translate: 0 1.6rem; } to { opacity: 1; translate: 0 0; } }
@keyframes lp-float { 50% { transform: translateY(-.55rem); } }

/* ---------- Навигация ---------- */
.lp-nav { position: sticky; top: 0; z-index: 50; padding-top: .75rem; pointer-events: none; }
.lp-nav__bar {
  display: flex;
  width: min(66rem, calc(100% - 1.5rem));
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-inline: auto;
  padding: .45rem .5rem .45rem 1rem;
  background: var(--lp-nav-bg);
  border: 1px solid var(--lp-line);
  border-radius: var(--lp-radius-bar);
  backdrop-filter: blur(18px) saturate(1.5);
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  pointer-events: auto;
  transition: box-shadow .25s ease;
}
:root[data-theme="care"] .lp-nav__bar { border-color: transparent; box-shadow: 0 10px 30px -16px rgba(207, 58, 120, .35); }
.lp-nav[data-stuck] .lp-nav__bar { box-shadow: var(--lp-card-shadow); }
.lp-brand { display: inline-flex; align-items: center; gap: .6rem; color: var(--lp-ink); text-decoration: none; }
.lp-brand__avatar { width: 2.25rem; height: 2.25rem; object-fit: cover; border-radius: .7rem; }
.lp-brand__name { font-family: var(--lp-font-display); font-size: 1.25rem; font-weight: 800; letter-spacing: -.03em; text-transform: var(--lp-h-case); }
:root[data-theme="dark"] .lp-brand__name { font-weight: 600; letter-spacing: .04em; }
.lp-nav__links { display: flex; gap: .15rem; }
.lp-nav__links a { padding: .5rem .85rem; color: var(--lp-muted); border-radius: 999px; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background-color .15s ease, color .15s ease; }
.lp-nav__links a:hover { color: var(--lp-ink); background: var(--lp-surface-2); }
.lp-nav__tools { display: flex; align-items: center; gap: .5rem; }
.lp-nav__account { display: inline-flex; min-height: 2.5rem; align-items: center; padding: 0 1.1rem; color: var(--lp-ink); background: var(--lp-surface); border: 1px solid var(--lp-line-strong); border-radius: var(--lp-radius-btn); font-size: .9rem; font-weight: 700; letter-spacing: var(--lp-btn-track); text-decoration: none; text-transform: var(--lp-btn-case); white-space: nowrap; }
:root[data-theme="care"] .lp-nav__account { border-radius: 999px; }
.lp-nav .theme-picker--compact summary { width: 2.5rem; height: 2.5rem; color: var(--lp-muted); background: transparent; border: 1px solid var(--lp-line); border-radius: 50%; }
.lp-nav .theme-picker--compact summary:hover, .lp-nav .theme-picker--compact[open] summary { color: var(--lp-ink); border-color: var(--lp-line-strong); }
.lp-nav .theme-picker--compact .theme-picker__options { width: 11rem; color: var(--lp-ink); background: var(--lp-surface); border: 1px solid var(--lp-line); border-radius: var(--lp-radius); box-shadow: var(--lp-card-shadow); }
.lp-nav .theme-picker__option { color: var(--lp-muted); font-size: .875rem; }
.lp-nav .theme-picker__option:hover { color: var(--lp-ink); }
.lp-nav .theme-picker__option[aria-pressed="true"] { color: var(--lp-ink); background: var(--lp-accent-soft); border-color: transparent; }

/* ---------- Первый экран ---------- */
.lp-hero { position: relative; isolation: isolate; padding-top: clamp(2rem, 4.5vw, 3.75rem); overflow-x: clip; }
.lp-hero::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: -7rem -8% 0;
  background:
    radial-gradient(42rem 26rem at 18% 12%, var(--lp-glow-a), transparent 70%),
    radial-gradient(40rem 26rem at 84% 4%, var(--lp-glow-b), transparent 70%);
  opacity: .85;
}
.lp-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image: radial-gradient(var(--lp-line-strong) 1px, transparent 1.3px);
  background-size: 1.6rem 1.6rem;
  -webkit-mask-image: radial-gradient(55% 60% at 50% 28%, #000, transparent);
  mask-image: radial-gradient(55% 60% at 50% 28%, #000, transparent);
  opacity: .55;
}
.lp-hero__copy { display: grid; justify-items: center; gap: 1.25rem; text-align: center; }
.lp-hero h1 { max-width: 20ch; font-size: calc(var(--lp-h-scale) * clamp(2.5rem, 1rem + 4.6vw, 4.5rem)); letter-spacing: var(--lp-h-track); }
.lp-lead { max-width: 41rem; color: var(--lp-muted); font-size: clamp(1.0625rem, 1rem + .45vw, 1.3125rem); line-height: 1.55; }
.lp-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .85rem 1rem; }
.lp-hint { margin-top: -.35rem; color: var(--lp-muted); font-size: .875rem; }

/* Сцена: только настоящие экраны, обрезанные по содержимому. */
.lp-stage { position: relative; height: clamp(22.5rem, 40vw, 32rem); margin-top: clamp(1.25rem, 3vw, 2.25rem); }
.lp-stage__glow { position: absolute; left: 50%; bottom: 0; width: min(46rem, 100%); aspect-ratio: 2 / 1; background: radial-gradient(closest-side, var(--lp-glow-a), transparent); border-radius: 50%; opacity: .75; transform: translateX(-50%); }
.lp-stage__devices { position: absolute; inset: 0; -webkit-mask-image: linear-gradient(#000 72%, transparent 100%); mask-image: linear-gradient(#000 72%, transparent 100%); }
.lp-phone { position: absolute; bottom: 0; left: 50%; width: clamp(12.25rem, 25vw, 17.5rem); padding: .5rem .5rem 0; background: var(--lp-phone-frame); border-radius: 2.25rem 2.25rem 0 0; box-shadow: 0 40px 70px -28px rgba(20, 20, 30, .45), inset 0 0 0 1px rgba(255, 255, 255, .08); }
:root[data-theme="care"] .lp-phone { box-shadow: 0 40px 70px -24px rgba(207, 58, 120, .4); }
:root[data-theme="dark"] .lp-phone { box-shadow: 0 0 0 1px #3a3a42, 0 40px 80px -30px rgba(215, 255, 63, .25); }
.lp-phone--chat { z-index: 2; transform: translateX(-76%); }
.lp-phone--diary { z-index: 1; transform: translate(-6%, 3rem) rotate(2.5deg); transform-origin: bottom left; }
.lp-phone__screen { position: relative; aspect-ratio: 390 / 610; overflow: hidden; background: #fff; border-radius: 1.8rem 1.8rem 0 0; }
.lp-phone__screen img { display: none; width: 100%; height: auto; }
:root[data-theme="light"] .lp-phone__screen img[data-preview-theme="light"],
:root[data-theme="care"] .lp-phone__screen img[data-preview-theme="care"],
:root[data-theme="dark"] .lp-phone__screen img[data-preview-theme="dark"] { display: block; }
.lp-phone__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

.lp-stage__mascots { position: absolute; bottom: -.5rem; left: 50%; z-index: 3; width: clamp(11rem, 23vw, 17rem); margin-left: clamp(-30rem, -36vw, -16rem); }
.lp-stage__mascot { width: 100%; height: auto; }
.lp-stage__mascot--dark { display: none; }
:root[data-theme="dark"] .lp-stage__mascot--light { display: none; }
:root[data-theme="dark"] .lp-stage__mascot--dark { display: block; width: 74%; margin-left: 12%; border: 1px solid var(--lp-line); border-radius: var(--lp-radius); box-shadow: 0 30px 50px -24px rgba(0, 0, 0, .9); }

.lp-stage__chips { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.lp-chip { position: absolute; display: inline-flex; align-items: center; gap: .5rem; padding: .55rem 1rem .55rem .75rem; color: var(--lp-ink); background: var(--lp-surface); border: 1px solid var(--lp-card-line); border-radius: 999px; box-shadow: var(--lp-card-shadow); font-size: .9rem; font-weight: 700; animation: lp-float 7s ease-in-out infinite; }
.lp-chip .ui-icon { width: 1.25rem; height: 1.25rem; padding: .22rem; box-sizing: content-box; color: var(--lp-accent-ink); background: var(--lp-accent-soft); border-radius: 50%; }
:root[data-theme="dark"] .lp-chip { border-radius: .375rem; font-family: var(--lp-font-display); font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.lp-chip--photo { left: calc(50% + 7.2rem); top: 22%; animation-delay: -1.5s; }
.lp-chip--voice { left: calc(50% + 11.5rem); top: 44%; animation-delay: -3.5s; }
.lp-chip--text { left: calc(50% - 21rem); top: 12%; animation-delay: -5s; }
.lp-stage__note { margin-top: 1rem; color: var(--lp-muted); font-size: .8125rem; text-align: center; }

@media (max-width: 900px) {
  .lp-stage__mascots { width: 10.5rem; margin-left: -20rem; }
  .lp-chip--text { left: calc(50% - 14rem); top: 6%; }
  .lp-chip--photo { left: calc(50% + 6rem); }
  .lp-chip--voice { left: calc(50% + 8rem); }
}
@media (max-width: 720px) {
  .lp-nav__links { display: none; }
  .lp-stage { height: 20rem; }
  .lp-phone { width: 11.25rem; }
  .lp-phone--chat { transform: translateX(-92%); }
  .lp-phone--diary { transform: translate(-8%, 2rem) rotate(2.5deg); }
  .lp-stage__mascots, .lp-stage__chips { display: none; }
  .lp-brand__avatar { width: 2rem; height: 2rem; }
}

/* ---------- Почему дневники бросают ---------- */
.lp-switch__pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 1.25rem; }
.lp-switch__card { display: grid; align-content: start; gap: 1rem; padding: clamp(1.4rem, 3vw, 2.25rem); }
.lp-switch__card ul { display: grid; gap: .8rem; }
.lp-switch__card li { position: relative; padding-left: 2rem; line-height: 1.5; }
.lp-switch__card li::before { position: absolute; left: 0; top: .12rem; display: grid; width: 1.35rem; height: 1.35rem; place-items: center; border-radius: 50%; font-size: .75rem; font-weight: 800; line-height: 1; }
.lp-switch__label { font-size: .8125rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.lp-switch__card h3 { font-size: calc(var(--lp-h-scale) * clamp(1.5rem, 1.1rem + 1.2vw, 2rem)); }
.lp-switch__card--before { color: var(--lp-muted); background: transparent; border: 1px dashed var(--lp-line-strong); box-shadow: none; }
.lp-switch__card--before h3 { text-decoration: line-through; text-decoration-thickness: .12rem; text-decoration-color: color-mix(in srgb, var(--lp-muted) 55%, transparent); }
.lp-switch__card--before li::before { content: "−"; color: var(--lp-muted); background: var(--lp-surface-2); }
.lp-switch__card--after { border-color: color-mix(in srgb, var(--lp-accent) 50%, var(--lp-line)); box-shadow: 0 30px 70px -36px color-mix(in srgb, var(--lp-accent) 70%, transparent), var(--lp-card-shadow); }
:root[data-theme="care"] .lp-switch__card--after { border-color: transparent; }
.lp-switch__card--after .lp-switch__label, .lp-switch__card--after h3 { color: var(--lp-accent-ink); }
.lp-switch__card--after li::before { content: "✓"; color: var(--lp-on-primary); background: var(--lp-primary-bg); }
.lp-switch__card--after li strong { color: var(--lp-ink); }

/* ---------- Как работает ---------- */
.lp-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.lp-step { position: relative; display: grid; align-content: start; justify-items: center; gap: .6rem; padding: 1.75rem 1.5rem 2rem; text-align: center; }
.lp-step__number { position: absolute; left: 1.25rem; top: 1.1rem; color: var(--lp-accent-ink); font-family: var(--lp-font-display); font-size: .9375rem; font-weight: 800; letter-spacing: .08em; }
.lp-step h3 { margin-top: .5rem; font-size: calc(var(--lp-h-scale) * 1.5rem); }
.lp-step p { max-width: 17rem; color: var(--lp-muted); }
.lp-mascot { position: relative; display: block; width: 8.5rem; aspect-ratio: 1; }
.lp-mascot::before { content: ""; position: absolute; inset: 9%; background: var(--lp-accent-soft); border-radius: 50%; }
.lp-mascot__img { position: relative; width: 100%; height: 100%; object-fit: contain; }
.lp-mascot__img--dark { display: none; }
:root[data-theme="dark"] .lp-mascot::before { display: none; }
:root[data-theme="dark"] .lp-mascot__img--light { display: none; }
:root[data-theme="dark"] .lp-mascot__img--dark { display: block; border: 1px solid var(--lp-line); border-radius: var(--lp-radius); }

.lp-diary { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 1.5rem 2.5rem; margin-top: 1.25rem; padding: 1.5rem 2rem; background: var(--lp-surface-2); border: 1px solid var(--lp-card-line); border-radius: var(--lp-radius-lg); }
:root[data-theme="care"] .lp-diary { background: var(--lp-surface); box-shadow: var(--lp-card-shadow); }
.lp-diary__title { font-family: var(--lp-font-display); font-size: calc(var(--lp-h-scale) * 1.25rem); font-weight: var(--lp-h-weight); letter-spacing: var(--lp-h-track); text-transform: var(--lp-h-case); }
.lp-diary ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.lp-diary li { display: flex; align-items: center; gap: .85rem; min-width: 0; }
.lp-diary strong { display: block; line-height: 1.25; }
.lp-diary small { display: block; margin-top: .15rem; color: var(--lp-muted); font-size: .875rem; line-height: 1.35; }

/* ---------- Ролик ---------- */
.lp-story__grid { display: grid; grid-template-columns: minmax(0, 27rem) minmax(0, 1fr); align-items: center; gap: clamp(2rem, 5vw, 4rem); }
.lp-story__copy { display: grid; justify-items: start; gap: 1rem; }
.lp-chapters { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin-top: .75rem; }
.lp-chapters button { display: grid; width: 100%; gap: .1rem; padding: .6rem .85rem; color: var(--lp-ink); text-align: left; background: var(--lp-surface); border: 1px solid var(--lp-line); border-radius: var(--lp-radius-sm); font: inherit; cursor: pointer; transition: border-color .15s ease, background-color .15s ease, transform .15s ease; }
.lp-chapters button:hover { border-color: var(--lp-accent); transform: translateY(-1px); }
.lp-chapters button[aria-current] { background: var(--lp-accent-soft); border-color: var(--lp-accent); }
.lp-chapters time { color: var(--lp-accent-ink); font-size: .8125rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.lp-chapters span { font-size: .875rem; font-weight: 600; line-height: 1.3; }
.lp-player__frame { overflow: hidden; background: #000; border: 1px solid var(--lp-card-line); border-radius: var(--lp-radius-lg); box-shadow: 0 40px 80px -40px rgba(20, 20, 30, .55), var(--lp-card-shadow); }
.lp-player video { width: 100%; aspect-ratio: 16 / 9; background: #000; }
.lp-player figcaption { display: grid; gap: .25rem; margin-top: 1rem; color: var(--lp-muted); font-size: .875rem; line-height: 1.55; }
.lp-player figcaption strong { color: var(--lp-ink); }
.lp-player__credit { display: block; margin-top: .35rem; font-size: .75rem; }
.lp-player__credit a { text-underline-offset: .2em; }

/* ---------- Сценарии ---------- */
.lp-cases__groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.lp-case { display: grid; align-content: start; gap: 1.5rem; padding: clamp(1.25rem, 3vw, 2rem); }
.lp-case__format { margin-bottom: .5rem; color: var(--lp-accent-ink); font-size: .8125rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.lp-case__header h3 { font-size: calc(var(--lp-h-scale) * clamp(1.5rem, 1.2rem + 1vw, 2rem)); }
.lp-case__header > p:last-child { margin-top: .35rem; color: var(--lp-muted); }
.lp-case__demo { display: grid; grid-template-columns: minmax(0, 12.5rem) minmax(0, 1fr); align-items: center; gap: 1.5rem; }
.lp-case__moment { margin-bottom: .35rem; color: var(--lp-accent-ink); font-size: .8125rem; font-weight: 800; }
.lp-case__demo-copy h4 { margin-bottom: .6rem; font-size: calc(var(--lp-h-scale) * 1.375rem); }
.lp-case__result { color: var(--lp-muted); font-size: .9375rem; line-height: 1.6; }
.lp-demo__player { position: relative; overflow: hidden; background: var(--lp-surface-2); border: 1px solid var(--lp-line); border-radius: 1.25rem; box-shadow: 0 24px 40px -24px rgba(20, 20, 30, .45); }
.lp-demo video { width: 100%; height: auto; aspect-ratio: 390 / 640; object-fit: contain; }
.lp-demo__play { position: absolute; left: 50%; bottom: 1rem; display: inline-flex; align-items: center; gap: .5rem; min-height: 2.5rem; padding: 0 1rem; color: var(--lp-on-primary); background: var(--lp-primary-bg); border: 0; border-radius: 999px; box-shadow: 0 8px 24px rgba(0, 0, 0, .3); font: 700 .8125rem/1 var(--lp-font-body); white-space: nowrap; cursor: pointer; transform: translateX(-50%); }
.lp-demo__play span { width: .55rem; height: .65rem; background: currentColor; clip-path: polygon(0 0, 100% 50%, 0 100%); }
.lp-demo figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem .75rem; margin-top: .65rem; color: var(--lp-muted); font-size: .75rem; line-height: 1.5; }
.lp-demo figcaption a { color: var(--lp-accent-ink); text-underline-offset: .2em; }
.lp-case__more-label { margin-bottom: .35rem; color: var(--lp-accent-ink); font-size: .8125rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.lp-ask { border-top: 1px solid var(--lp-line); }
.lp-ask summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .95rem 0; list-style: none; font-weight: 700; line-height: 1.4; cursor: pointer; }
.lp-ask summary::-webkit-details-marker { display: none; }
.lp-ask summary:hover .lp-ask__title { color: var(--lp-accent-ink); }
.lp-ask__toggle { display: grid; width: 1.75rem; height: 1.75rem; flex: none; place-items: center; color: var(--lp-accent-ink); background: var(--lp-accent-soft); border-radius: 50%; font-size: 1.2rem; font-weight: 500; line-height: 1; }
.lp-ask__toggle::after { content: "+"; }
.lp-ask[open] .lp-ask__toggle::after { content: "−"; }
.lp-ask__body { padding-bottom: .75rem; }
.lp-ask blockquote { margin-bottom: .6rem; padding-left: 1rem; border-left: .2rem solid var(--lp-accent); line-height: 1.55; }
.lp-note { max-width: 46rem; margin: 1.75rem auto 0; color: var(--lp-muted); font-size: .8125rem; line-height: 1.6; text-align: center; }

/* ---------- Платформы ---------- */
.lp-platforms__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(13.5rem, 1fr)); gap: 1rem; }
.lp-platform { display: grid; align-content: start; gap: .35rem; padding: 1.25rem 1.25rem 1.4rem; }
.lp-platform__topline { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; }
.lp-platform__icon { display: grid; width: 2.5rem; height: 2.5rem; flex: none; place-items: center; }
.lp-platform__icon img { width: 100%; height: 100%; object-fit: contain; }
.lp-platform__icon--tile { padding: .4rem; background: #fff; border: 1px solid var(--lp-line); border-radius: .7rem; }
.lp-platform__status { display: inline-flex; align-items: center; gap: .4rem; color: var(--lp-muted); font-size: .75rem; font-weight: 700; line-height: 1.3; text-align: right; }
.lp-platform__status i { width: .45rem; height: .45rem; flex: none; background: currentColor; border-radius: 50%; }
.lp-platform__status--live { color: var(--lp-ok); }
.lp-platform__status--live i { box-shadow: 0 0 0 .25rem color-mix(in srgb, var(--lp-ok) 22%, transparent); }
.lp-platform__status--web { color: var(--lp-accent-ink); }
.lp-platform h3 { font-size: calc(var(--lp-h-scale) * 1.25rem); }
.lp-platform p { color: var(--lp-muted); font-size: .9rem; line-height: 1.55; }
.lp-platform__soon { margin-top: .25rem; color: var(--lp-muted); font-size: .8125rem; }
.lp-platform--live { border-color: color-mix(in srgb, var(--lp-ok) 40%, var(--lp-line)); }
:root[data-theme="care"] .lp-platform--live { border-color: transparent; }
.lp-platform--soon { background: transparent; border-style: dashed; border-color: var(--lp-line-strong); box-shadow: none; }

/* ---------- Тариф ---------- */
.lp-pricing__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 26rem); align-items: center; gap: clamp(2rem, 6vw, 5rem); }
.lp-pricing__copy { display: grid; justify-items: start; gap: 1rem; }
.lp-pricing__card { display: grid; gap: 1.25rem; padding: clamp(1.4rem, 3vw, 2rem); }
.lp-pricing__topline { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.lp-pricing__topline h3 { font-size: calc(var(--lp-h-scale) * 1.5rem); }
.lp-pricing__topline span { padding: .25rem .75rem; color: var(--lp-accent-ink); background: var(--lp-accent-soft); border-radius: 999px; font-size: .8125rem; font-weight: 700; }
.lp-pricing__price { color: var(--lp-muted); }
.lp-pricing__price strong { display: block; margin-top: .15rem; color: var(--lp-ink); font-family: var(--lp-font-display); font-size: calc(var(--lp-h-scale) * 2rem); font-weight: var(--lp-h-weight); letter-spacing: var(--lp-h-track); line-height: 1.1; text-transform: var(--lp-h-case); }
.lp-pricing__card ul { display: grid; gap: .75rem; padding-block: 1.25rem; border-block: 1px solid var(--lp-line); }
.lp-pricing__card li { position: relative; padding-left: 1.9rem; }
.lp-pricing__card li::before { content: "✓"; position: absolute; left: 0; top: .1rem; display: grid; width: 1.25rem; height: 1.25rem; place-items: center; color: var(--lp-on-primary); background: var(--lp-primary-bg); border-radius: 50%; font-size: .7rem; font-weight: 800; }
.lp-pricing__note { color: var(--lp-muted); font-size: .8125rem; text-align: center; }

/* ---------- Список ожидания ---------- */
.lp-waitlist { scroll-margin-top: 4rem; }
.lp-waitlist__panel { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; gap: clamp(1.75rem, 5vw, 4rem); padding: clamp(1.5rem, 4.5vw, 3.75rem); overflow: hidden; background: var(--lp-surface); border: 1px solid var(--lp-card-line); border-radius: calc(var(--lp-radius-lg) * 1.3); box-shadow: var(--lp-card-shadow); }
.lp-waitlist__panel::before { content: ""; position: absolute; z-index: -1; right: -8rem; top: -10rem; width: 30rem; height: 30rem; background: radial-gradient(closest-side, var(--lp-glow-a), transparent); opacity: .8; }
.lp-waitlist__copy { display: grid; justify-items: start; gap: 1rem; }
.lp-waitlist__copy p:not(.lp-pill) { color: var(--lp-muted); }
.lp-waitlist__promises { display: grid; gap: .6rem; margin-block: .5rem; }
.lp-waitlist__promises li { position: relative; padding-left: 1.9rem; color: var(--lp-ink); line-height: 1.5; }
.lp-waitlist__promises li::before { content: "✓"; position: absolute; left: 0; top: .1rem; display: grid; width: 1.25rem; height: 1.25rem; place-items: center; color: var(--lp-accent-ink); background: var(--lp-accent-soft); border-radius: 50%; font-size: .7rem; font-weight: 800; }
.lp-waitlist__invite a { color: var(--lp-accent-ink); font-weight: 700; text-underline-offset: .2em; }
.lp-form { display: grid; gap: 1rem; min-width: 0; padding: clamp(1.25rem, 3vw, 1.75rem); background: var(--lp-bg); border: 1px solid var(--lp-line); border-radius: var(--lp-radius-lg); }
:root[data-theme="care"] .lp-form { background: var(--lp-surface-2); border-color: transparent; }
.lp-form label { font-size: .875rem; font-weight: 700; }
.lp-form input[type="email"] { width: 100%; min-height: 3.5rem; padding: 0 1.1rem; color: var(--lp-ink); background: var(--lp-surface); border: 1px solid var(--lp-line-strong); border-radius: var(--lp-radius-btn); font: 500 1rem/1 var(--lp-font-body); }
.lp-form input[type="email"]::placeholder { color: var(--lp-muted); opacity: .7; }
.lp-form input[type="email"]:focus { border-color: var(--lp-accent-ink); outline: 2px solid color-mix(in srgb, var(--lp-accent) 40%, transparent); outline-offset: 2px; }
.lp-form input[type="submit"].lp-btn { appearance: none; white-space: normal; }
.lp-form__note { color: var(--lp-muted); font-size: .8125rem; line-height: 1.55; }
.lp-form__note a { color: var(--lp-ink); text-underline-offset: .2em; }
.lp-form .lp-notice { margin: 0; }

/* ---------- Вопросы ---------- */
.lp-faq__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.lp-faq__head { position: sticky; top: 6rem; display: grid; justify-items: start; gap: 1rem; }
.lp-faq__items { border-top: 1px solid var(--lp-line-strong); }
.lp-faq details { border-bottom: 1px solid var(--lp-line-strong); }
.lp-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.25rem 0; list-style: none; font-size: 1.0625rem; font-weight: 700; line-height: 1.4; cursor: pointer; }
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary::after { content: "+"; display: grid; width: 2rem; height: 2rem; flex: none; place-items: center; color: var(--lp-accent-ink); background: var(--lp-accent-soft); border-radius: 50%; font-size: 1.3rem; font-weight: 500; line-height: 1; transition: transform .2s ease; }
.lp-faq details[open] summary::after { content: "−"; }
.lp-faq summary:hover { color: var(--lp-accent-ink); }
.lp-faq details p { max-width: 38rem; padding: 0 3rem 1.4rem 0; color: var(--lp-muted); }

/* ---------- Медиацентр ---------- */
.lp-reading__head { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.lp-reading__head > div { display: grid; justify-items: start; gap: .85rem; }
.lp-reading__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.lp-article { display: grid; align-content: start; overflow: hidden; color: var(--lp-ink); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.lp-article:hover { transform: translateY(-.3rem); }
.lp-article img { width: 100%; height: auto; aspect-ratio: 600 / 315; object-fit: cover; }
.lp-article__body { display: grid; gap: .45rem; padding: 1.1rem 1.25rem 1.4rem; }
.lp-article__body small { color: var(--lp-muted); font-size: .8125rem; }
.lp-article__body strong { font-size: 1.0625rem; line-height: 1.35; }

/* ---------- Финальный призыв ---------- */
.lp-final { padding-bottom: clamp(3rem, 6vw, 5rem); }
.lp-final__panel { position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: center; gap: 2rem; padding: clamp(1.75rem, 5vw, 4rem); overflow: hidden; background: var(--lp-panel); border: 1px solid var(--lp-card-line); border-radius: calc(var(--lp-radius-lg) * 1.4); }
:root[data-theme="care"] .lp-final__panel { border-color: transparent; box-shadow: var(--lp-card-shadow); }
.lp-final__copy { display: grid; justify-items: start; gap: 1.25rem; }
.lp-final__copy h2 { font-size: calc(var(--lp-h-scale) * clamp(2rem, 1rem + 3.2vw, 3.5rem)); }
.lp-final__copy .lp-actions { justify-content: flex-start; gap: 1rem 1.5rem; margin-top: .5rem; }
.lp-final__character { display: grid; justify-items: center; }
.lp-final__character .lp-mascot { width: clamp(10rem, 24vw, 16rem); }
.lp-final__character .lp-mascot::before { background: rgba(255, 255, 255, .6); }

/* ---------- Подвал ---------- */
.lp-footer { padding-block: 2.5rem 3rem; color: var(--lp-muted); border-top: 1px solid var(--lp-line); }
.lp-footer__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.4fr); align-items: start; gap: 2rem 3rem; }
.lp-footer__brand { display: grid; justify-items: start; gap: .75rem; }
.lp-footer__brand p { font-size: .9rem; }
.lp-footer__links { display: grid; gap: .55rem; font-size: .9rem; }
.lp-footer a { text-decoration-color: var(--lp-line-strong); text-underline-offset: .25em; }
.lp-footer__links a { color: var(--lp-ink); text-decoration: none; }
.lp-footer__links a:hover { color: var(--lp-accent-ink); text-decoration: underline; }
.lp-footer__legal { display: grid; gap: .6rem; font-size: .875rem; }
.lp-footer__legal small { font-size: .75rem; line-height: 1.6; }

/* ---------- Адаптив ---------- */
@media (max-width: 960px) {
  .lp-story__grid, .lp-pricing__grid, .lp-faq__grid, .lp-waitlist__panel, .lp-final__panel { grid-template-columns: minmax(0, 1fr); }
  .lp-faq__head { position: static; }
  .lp-final__character { order: -1; justify-items: start; }
  .lp-cases__groups { grid-template-columns: minmax(0, 1fr); }
  .lp-diary { grid-template-columns: minmax(0, 1fr); }
  .lp-diary ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-footer__grid { grid-template-columns: minmax(0, 1fr) auto; }
  .lp-footer__legal { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .lp-switch__pair, .lp-steps, .lp-reading__list { grid-template-columns: minmax(0, 1fr); }
  .lp-steps { gap: 1rem; }
  .lp-step { grid-template-columns: auto minmax(0, 1fr); justify-items: start; column-gap: 1.25rem; padding: 1.25rem; text-align: left; }
  .lp-step .lp-mascot { grid-row: span 2; width: 5.5rem; }
  .lp-step__number { display: none; }
  .lp-step h3 { margin-top: 0; align-self: end; }
  .lp-case__demo { grid-template-columns: minmax(0, 10rem) minmax(0, 1fr); gap: 1rem; }
  .lp-reading__head { flex-direction: column; align-items: start; }
  .lp-article { grid-template-columns: 7rem minmax(0, 1fr); align-items: stretch; }
  .lp-article img { height: 100%; aspect-ratio: auto; }
  .lp-faq details p { padding-right: 0; }
}
@media (max-width: 720px) {
  /* Chapters become a swipeable row so the video stays close to the heading. */
  .lp-chapters { display: flex; overflow-x: auto; margin-inline: -1.25rem; padding: .25rem 1.25rem .5rem; scroll-snap-type: x proximity; scrollbar-width: none; }
  .lp-chapters::-webkit-scrollbar { display: none; }
  .lp-chapters li { flex: 0 0 9.5rem; scroll-snap-align: start; }
  .lp-story__copy { width: 100%; }
}
@media (max-width: 520px) {
  .lp-actions { width: 100%; }
  .lp-actions .lp-btn { width: 100%; }
  .lp-case__demo { grid-template-columns: minmax(0, 1fr); }
  .lp-demo { max-width: 14rem; }
  .lp-diary ul { grid-template-columns: minmax(0, 1fr); }
  .lp-footer__grid { grid-template-columns: minmax(0, 1fr); }
  .lp-nav__account { padding: 0 .85rem; }
  .lp-brand__name { font-size: 1.1rem; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(body.lp-page) { scroll-behavior: auto; }
  .lp-reveal { animation: none; }
  .lp-chip { animation: none; }
  .lp-btn, .lp-btn .ui-icon, .lp-article, .lp-chapters button { transition: none; }
}

/* =====================================================================
   Продающий слой: движение и эффекты (ноябрь 2026, второй проход).
   Всё отключается при prefers-reduced-motion; без JS блоки видны в финальном состоянии.
   ===================================================================== */
:root, :root[data-theme="light"] { --lp-spot: rgba(224, 96, 58, .09); --lp-pulse: rgba(29, 31, 35, .35); }
:root[data-theme="care"] { --lp-spot: rgba(207, 58, 120, .1); --lp-pulse: rgba(207, 58, 120, .45); }
:root[data-theme="dark"] { --lp-spot: rgba(215, 255, 63, .08); --lp-pulse: rgba(215, 255, 63, .45); }

/* Прогресс чтения по верхнему краю */
.lp-progress { position: fixed; z-index: 60; top: 0; left: 0; right: 0; height: 3px; background: var(--lp-primary-bg); transform: scaleX(0); transform-origin: 0 50%; pointer-events: none; }
@supports (animation-timeline: scroll()) {
  .lp-progress { animation: lp-progress linear both; animation-timeline: scroll(root block); }
}
@supports not (animation-timeline: scroll()) { .lp-progress { display: none; } }
@keyframes lp-progress { to { transform: scaleX(1); } }

/* Плавающая панель: появляется кнопка списка ожидания, «Войти» — вторичная */
.lp-nav__cta { display: inline-flex; max-width: 0; min-height: 2.5rem; align-items: center; overflow: hidden; padding: 0; color: var(--lp-on-primary); background: var(--lp-primary-bg); border-radius: var(--lp-radius-btn); font-size: .9rem; font-weight: 700; letter-spacing: var(--lp-btn-track); text-decoration: none; text-transform: var(--lp-btn-case); white-space: nowrap; opacity: 0; transition: max-width .45s cubic-bezier(.2, .7, .2, 1), padding .45s cubic-bezier(.2, .7, .2, 1), opacity .3s ease; }
.lp-nav__cta[data-visible] { max-width: 14rem; padding: 0 1.1rem; opacity: 1; }
.lp-nav__account:hover { border-color: var(--lp-accent); }

/* Первый экран: появление по очереди */
.lp-intro { animation: lp-in .9s cubic-bezier(.2, .75, .2, 1) both; animation-delay: calc(var(--i, 0) * 90ms + 60ms); }
@keyframes lp-in { from { opacity: 0; translate: 0 1.25rem; filter: blur(6px); } to { opacity: 1; translate: 0 0; filter: blur(0); } }
.lp-trust { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.25rem; margin-top: -.25rem; color: var(--lp-muted); font-size: .9rem; font-weight: 600; }
.lp-trust li { display: inline-flex; align-items: center; gap: .4rem; }
.lp-trust .ui-icon { width: 1.1rem; height: 1.1rem; color: var(--lp-ok); }

.lp-hero::before { animation: lp-aurora 22s ease-in-out infinite alternate; }
@keyframes lp-aurora { from { transform: translate3d(-3%, -2%, 0) scale(1); } to { transform: translate3d(3%, 3%, 0) scale(1.08); } }

.lp-stage { --px: 0; --py: 0; }
.lp-stage__devices, .lp-stage__mascots, .lp-stage__chips { transition: translate .7s cubic-bezier(.2, .7, .2, 1); }
.lp-stage__devices { translate: calc(var(--px) * -14px) calc(var(--py) * -8px); }
.lp-stage__mascots { translate: calc(var(--px) * 26px) calc(var(--py) * 10px); }
.lp-stage__chips { translate: calc(var(--px) * -34px) calc(var(--py) * -18px); }
.lp-phone { animation: lp-phone-in 1.1s cubic-bezier(.2, .75, .2, 1) .45s both; }
.lp-phone--diary { animation-delay: .62s; }
@keyframes lp-phone-in { from { opacity: 0; translate: 0 38%; } to { opacity: 1; translate: 0 0; } }
.lp-stage__mascot { animation: lp-hop .8s cubic-bezier(.3, 1.4, .5, 1) .95s both; }
@keyframes lp-hop { from { opacity: 0; translate: 0 2.5rem; scale: .92; } to { opacity: 1; translate: 0 0; scale: 1; } }
.lp-chip { animation: lp-pop .6s cubic-bezier(.3, 1.6, .5, 1) both, lp-float 7s ease-in-out infinite; }
.lp-chip--text { animation-delay: 1.15s, -5s; }
.lp-chip--photo { animation-delay: 1.3s, -1.5s; }
.lp-chip--voice { animation-delay: 1.45s, -3.5s; }
@keyframes lp-pop { from { opacity: 0; scale: .6; } to { opacity: 1; scale: 1; } }

/* Кнопки: блик при наведении */
.lp-btn--primary { position: relative; isolation: isolate; overflow: hidden; }
.lp-btn--primary::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -60%; width: 45%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .38), transparent); transform: skewX(-20deg); pointer-events: none; }
.lp-btn--primary:hover::before { transform: skewX(-20deg) translateX(440%); transition: transform .85s ease; }

/* Подсветка карточки под курсором */
@property --lp-spot-a { syntax: "<percentage>"; inherits: false; initial-value: 0%; }
@media (hover: hover) and (pointer: fine) {
  .lp-card { background-image: radial-gradient(26rem circle at var(--mx, 50%) var(--my, 0), color-mix(in srgb, var(--lp-spot) var(--lp-spot-a), transparent), transparent 65%); background-repeat: no-repeat; transition: --lp-spot-a .35s ease, transform .25s ease, box-shadow .25s ease; }
  .lp-card:hover { --lp-spot-a: 100%; }
}

/* Лента фраз */
.lp-marquee { padding-block: clamp(1.75rem, 3.5vw, 2.75rem) .5rem; }
.lp-marquee__label { margin-bottom: .9rem; color: var(--lp-muted); font-size: .8125rem; font-weight: 800; letter-spacing: .12em; text-align: center; text-transform: uppercase; }
.lp-marquee__viewport { display: flex; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); }
.lp-marquee__track { display: flex; flex: none; gap: .75rem; padding: .35rem .75rem .9rem 0; animation: lp-marquee 70s linear infinite; }
.lp-marquee__track li { flex: none; padding: .6rem 1.1rem; color: var(--lp-ink); background: var(--lp-surface); border: 1px solid var(--lp-card-line); border-radius: 999px; box-shadow: var(--lp-card-shadow); font-size: .9375rem; font-weight: 600; white-space: nowrap; }
:root[data-theme="dark"] .lp-marquee__track li { border-radius: .375rem; }
.lp-marquee__viewport:hover .lp-marquee__track { animation-play-state: paused; }
@keyframes lp-marquee { to { transform: translateX(-100%); } }

/* Было → стало: старый способ зачёркивается, у нового появляются галочки */
.lp-switch__card--before li span { background-image: linear-gradient(currentColor, currentColor); background-position: 0 58%; background-repeat: no-repeat; background-size: 100% .09em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.lp-js .lp-switch__card--before li span { background-size: 0% .09em; transition: background-size .55s ease; }
.lp-js [data-animate].is-in .lp-switch__card--before li span { background-size: 100% .09em; }
.lp-js .lp-switch__card--after li::before { scale: 0; transition: scale .45s cubic-bezier(.3, 1.6, .5, 1); }
.lp-js [data-animate].is-in .lp-switch__card--after li::before { scale: 1; }
.lp-switch__card--before li:nth-child(1) span { transition-delay: .2s; }
.lp-switch__card--before li:nth-child(2) span { transition-delay: .38s; }
.lp-switch__card--before li:nth-child(3) span { transition-delay: .56s; }
.lp-switch__card--before li:nth-child(4) span { transition-delay: .74s; }
.lp-switch__card--after li:nth-child(1)::before { transition-delay: 1s; }
.lp-switch__card--after li:nth-child(2)::before { transition-delay: 1.12s; }
.lp-switch__card--after li:nth-child(3)::before { transition-delay: 1.24s; }
.lp-switch__card--after li:nth-child(4)::before { transition-delay: 1.36s; }

/* Шаги: маскот подпрыгивает при наведении */
.lp-step:hover .lp-mascot__img { animation: lp-bounce .7s cubic-bezier(.3, 1.4, .5, 1); }
@keyframes lp-bounce { 40% { translate: 0 -.6rem; rotate: -4deg; } 70% { translate: 0 .1rem; rotate: 2deg; } }
.lp-final__character .lp-mascot { animation: lp-float 6s ease-in-out infinite; }

/* Доказательства из ролика */
.lp-proof__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1.25rem; }
.lp-proof__card { display: flex; grid-column: span 2; flex-direction: column; overflow: hidden; padding: 1.6rem 1.6rem 0; }
.lp-proof__card--voice, .lp-proof__card--week { grid-column: span 3; flex-direction: row; align-items: stretch; gap: 1.5rem; padding: 1.75rem 0 0 1.75rem; }
.lp-proof__copy { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: .55rem; padding-bottom: 1.4rem; }
.lp-proof__stat { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: .15rem; color: var(--lp-em); font-family: var(--lp-font-display); font-size: calc(var(--lp-h-scale) * clamp(2.25rem, 1.6rem + 1.4vw, 3rem)); font-weight: var(--lp-h-weight); font-variant-numeric: tabular-nums; letter-spacing: var(--lp-h-track); line-height: 1; }
:root[data-theme="care"] .lp-proof__stat > span { color: transparent; background: linear-gradient(100deg, #e0488a 0%, #9257d2 100%); -webkit-background-clip: text; background-clip: text; }
.lp-proof__suffix { font-size: .55em; opacity: .75; }
.lp-proof__stat small { flex-basis: 100%; margin-top: .35rem; color: var(--lp-muted); font-family: var(--lp-font-body); font-size: .8125rem; font-weight: 700; letter-spacing: .02em; text-transform: none; }
.lp-proof__card h3 { margin-top: .35rem; font-size: calc(var(--lp-h-scale) * 1.3rem); }
.lp-proof__text { color: var(--lp-muted); font-size: .9375rem; line-height: 1.55; }
.lp-proof__seek { display: inline-flex; align-items: center; gap: .5rem; margin-top: .4rem; padding: .3rem .85rem .3rem .3rem; color: var(--lp-ink); background: var(--lp-surface); border: 1px solid var(--lp-line-strong); border-radius: 999px; font: 700 .8125rem/1 var(--lp-font-body); cursor: pointer; transition: border-color .2s ease, transform .2s ease; }
.lp-proof__seek:hover { border-color: var(--lp-accent); transform: translateY(-1px); }
.lp-proof__seek .lp-btn__play { width: 1.5rem; height: 1.5rem; }
.lp-proof__screen { position: relative; flex: none; height: 15rem; margin: auto 0 0; overflow: hidden; background: #fff; border: 1px solid var(--lp-line); border-bottom: 0; border-radius: 1.25rem 1.25rem 0 0; box-shadow: 0 -10px 30px -18px rgba(20, 20, 30, .35); }
.lp-proof__card--voice .lp-proof__screen, .lp-proof__card--week .lp-proof__screen { width: 15.5rem; height: 19.5rem; margin: auto 0 0; border-right: 0; border-radius: 1.25rem 0 0 0; }
.lp-proof__screen img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; transition: object-position 3.2s ease-in-out; }
.lp-proof__card:hover .lp-proof__screen img, .lp-proof__card:focus-within .lp-proof__screen img { object-position: 50% 100%; }
.lp-proof__card:hover { transform: translateY(-.25rem); }
:root[data-theme="dark"] .lp-proof__screen { border-color: #3a3a42; box-shadow: 0 -10px 40px -20px rgba(215, 255, 63, .3); }

/* Ролик: большая кнопка запуска поверх постера */
.lp-player__frame { position: relative; }
.lp-player__start { position: absolute; inset: 0; z-index: 2; display: grid; place-content: center; justify-items: center; gap: 1rem; color: #fff; background: radial-gradient(circle at 50% 50%, rgba(0, 0, 0, .05), rgba(0, 0, 0, .38)); border: 0; font: 700 1rem/1 var(--lp-font-body); cursor: pointer; }
.lp-player__start-icon { position: relative; width: 5rem; height: 5rem; background: var(--lp-primary-bg); border-radius: 50%; box-shadow: 0 0 0 0 var(--lp-pulse); animation: lp-pulse 2.4s ease-out infinite; transition: scale .25s ease; }
.lp-player__start-icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 1.4rem; height: 1.65rem; background: var(--lp-on-primary); clip-path: polygon(0 0, 100% 50%, 0 100%); transform: translate(-38%, -50%); }
.lp-player__start > span:last-child { padding: .5rem 1rem; background: rgba(0, 0, 0, .5); border-radius: 999px; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.lp-player__start:hover .lp-player__start-icon { scale: 1.07; }
@keyframes lp-pulse { 0% { box-shadow: 0 0 0 0 var(--lp-pulse); } 70% { box-shadow: 0 0 0 1.4rem transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }

/* Полоса с призывом после ролика */
.lp-band { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem 2rem; margin-top: clamp(2rem, 4vw, 3rem); padding: clamp(1.25rem, 3vw, 1.75rem) clamp(1.25rem, 3vw, 2.25rem); background: var(--lp-panel); border: 1px solid var(--lp-card-line); border-radius: var(--lp-radius-lg); }
:root[data-theme="care"] .lp-band { box-shadow: var(--lp-card-shadow); }
.lp-band__title { font-family: var(--lp-font-display); font-size: calc(var(--lp-h-scale) * 1.5rem); font-weight: var(--lp-h-weight); letter-spacing: var(--lp-h-track); line-height: 1.15; text-transform: var(--lp-h-case); }
.lp-band__text { margin-top: .25rem; color: var(--lp-muted); }

/* Успешная запись в список ожидания */
.lp-form .lp-notice[data-waitlist-goal] { position: relative; padding-left: 3rem; font-weight: 700; animation: lp-pop .5s cubic-bezier(.3, 1.5, .5, 1) both; }
.lp-form .lp-notice[data-waitlist-goal]::before { content: "✓"; position: absolute; left: .85rem; top: 50%; display: grid; width: 1.5rem; height: 1.5rem; place-items: center; color: var(--lp-bg); background: var(--lp-ok); border-radius: 50%; font-weight: 800; translate: 0 -50%; animation: lp-pop .55s cubic-bezier(.3, 1.8, .5, 1) .2s both; }

/* Мобильная кнопка внизу экрана */
.lp-sticky { position: fixed; z-index: 45; left: 0; right: 0; bottom: 0; padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--lp-bg) 84%, transparent); border-top: 1px solid var(--lp-line); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); translate: 0 110%; transition: translate .35s cubic-bezier(.2, .7, .2, 1); }
.lp-sticky[data-visible] { translate: 0 0; }
body:has(.analytics-consent:not([hidden])) .lp-sticky { display: none; }

@media (max-width: 960px) {
  .lp-proof__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-proof__card, .lp-proof__card--voice { grid-column: span 1; flex-direction: column; gap: 0; padding: 1.5rem 1.5rem 0; }
  .lp-proof__card--voice .lp-proof__screen { width: auto; height: 15rem; min-height: 0; margin-top: auto; border-right: 1px solid var(--lp-line); border-radius: 1.25rem 1.25rem 0 0; }
  .lp-proof__card--week { grid-column: span 2; }
}
@media (max-width: 720px) {
  .lp-nav__cta { display: none; }
  .lp-trust { flex-direction: column; align-items: center; gap: .4rem; }
  /* Доказательства листаются карточками */
  .lp-proof__grid { display: flex; overflow-x: auto; margin-inline: -1.25rem; padding: .25rem 1.25rem 1.25rem; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .lp-proof__grid::-webkit-scrollbar { display: none; }
  .lp-proof__card, .lp-proof__card--voice, .lp-proof__card--week { flex: 0 0 84%; flex-direction: column; gap: 0; padding: 1.4rem 1.4rem 0; scroll-snap-align: center; }
  .lp-proof__card--week .lp-proof__screen, .lp-proof__card--voice .lp-proof__screen { width: auto; height: 14rem; min-height: 0; margin-top: auto; border-right: 1px solid var(--lp-line); border-radius: 1.25rem 1.25rem 0 0; }
  .lp-proof__screen { height: 14rem; }
  .lp-band { flex-direction: column; align-items: stretch; }
  .lp-band .lp-btn { width: 100%; }
}
@media (min-width: 721px) { .lp-sticky { display: none; } }

@media (prefers-reduced-motion: reduce) {
  .lp-intro, .lp-phone, .lp-stage__mascot, .lp-chip, .lp-hero::before, .lp-player__start-icon, .lp-final__character .lp-mascot, .lp-form .lp-notice[data-waitlist-goal], .lp-form .lp-notice[data-waitlist-goal]::before { animation: none; }
  .lp-stage__devices, .lp-stage__mascots, .lp-stage__chips { translate: none; transition: none; }
  .lp-marquee__track { flex: 1 1 auto; flex-wrap: wrap; justify-content: center; padding-inline: 1.25rem; animation: none; }
  .lp-marquee__track[aria-hidden] { display: none; }
  .lp-marquee__viewport { justify-content: center; -webkit-mask-image: none; mask-image: none; }
  .lp-marquee__track li { white-space: normal; }
  .lp-js .lp-switch__card--before li span { background-size: 100% .09em; transition: none; }
  .lp-js .lp-switch__card--after li::before { scale: 1; transition: none; }
  .lp-btn--primary::before, .lp-step:hover .lp-mascot__img { display: none; animation: none; }
  .lp-proof__screen img { transition: none; }
  .lp-proof__card:hover, .lp-card:hover { transform: none; }
  .lp-sticky, .lp-nav__cta { transition: none; }
}

/* =====================================================================
   Третий проход (3 ноября 2026): живая плашка-призыв, прогресс главы ролика,
   ответ формы на нажатие и первый экран на невысоких ноутбуках.
   ===================================================================== */
a.lp-pill { text-decoration: none; transition: background-color .2s ease; }
a.lp-pill:hover { background: color-mix(in srgb, var(--lp-accent) 18%, var(--lp-accent-soft)); }
a.lp-pill .ui-icon { width: .9rem; height: .9rem; transition: translate .2s ease; }
a.lp-pill:hover .ui-icon { translate: .2rem 0; }
.lp-pill--live .lp-pill__dot { animation: lp-live 2s ease-out infinite; }
@keyframes lp-live {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 55%, transparent); }
  80%, 100% { box-shadow: 0 0 0 .5rem transparent; }
}

/* Активная глава заполняется, пока ролик идёт по ней */
.lp-chapters button { position: relative; overflow: hidden; }
.lp-chapters button[aria-current]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--lp-accent); transform: scaleX(var(--lp-chapter-progress, 0)); transform-origin: 0 50%; transition: transform .3s linear; }

/* Форма сразу отвечает на нажатие */
.lp-form input[type="submit"][aria-busy="true"] { cursor: progress; opacity: .78; }

/* Невысокий экран ноутбука: телефоны заметнее на первом экране */
@media (min-width: 961px) and (max-height: 960px) {
  .lp-hero { padding-top: 1.75rem; }
  .lp-hero__copy { gap: 1rem; }
  .lp-stage { height: 28rem; margin-top: .75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .lp-pill--live .lp-pill__dot { animation: none; }
  .lp-chapters button[aria-current]::after, a.lp-pill .ui-icon { transition: none; }
}

/* Переход по якорю (меню, ссылки медиацентра) оставляет плашку над заголовком видимой под плавающей шапкой */
.lp h2[id] { scroll-margin-top: 4.5rem; }