/* Лендинг Разноса: статика без сборки. Токены и макеты экранов повторяют raznos-app, экраны нарисованы вёрсткой и не кликаются */

@font-face { font-family: "Onest"; src: url("./assets/fonts/onest-cyrillic.woff2") format("woff2"); font-weight: 400 800; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Onest"; src: url("./assets/fonts/onest-latin.woff2") format("woff2"); font-weight: 400 800; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Onest"; src: url("./assets/fonts/onest-ruble.woff2") format("woff2"); font-weight: 400 800; font-display: swap; unicode-range: U+20BD; }
@font-face { font-family: "JetBrains Mono"; src: url("./assets/fonts/jetbrains-mono-cyrillic.woff2") format("woff2"); font-weight: 500 700; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "JetBrains Mono"; src: url("./assets/fonts/jetbrains-mono-latin.woff2") format("woff2"); font-weight: 500 700; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "JetBrains Mono"; src: url("./assets/fonts/jetbrains-mono-ruble.woff2") format("woff2"); font-weight: 500 700; font-display: swap; unicode-range: U+20BD; }
@font-face { font-family: "Onest Fallback"; src: local("Arial"), local("Helvetica"), local("Roboto"); size-adjust: 102.9%; ascent-override: 94.3%; descent-override: 30.1%; line-gap-override: 0%; }

:root {
  color-scheme: light;
  --raznos-hex: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  --raznos-bg: oklch(0.965 0.008 250);
  --raznos-surface: oklch(0.995 0.002 250);
  --raznos-surface-2: oklch(0.98 0.004 250);
  --raznos-line: oklch(0.88 0.01 250);
  --raznos-line-strong: oklch(0.68 0.018 250);
  --raznos-ink: oklch(0.22 0.012 250);
  --raznos-ink-2: oklch(0.42 0.012 250);
  --raznos-ink-3: oklch(0.52 0.012 250);
  --raznos-dark: oklch(0.24 0.02 250);
  --raznos-dark-2: oklch(0.32 0.02 250);
  --raznos-on-dark: oklch(0.97 0.004 250);
  --raznos-green: oklch(0.52 0.12 150);
  --raznos-green-deep: oklch(0.42 0.11 150);
  --raznos-green-tint: oklch(0.94 0.04 150);
  --raznos-brand: oklch(0.62 0.16 150);
  --raznos-amber: oklch(0.5 0.13 70);
  --raznos-amber-tint: oklch(0.95 0.05 85);
  --raznos-gold: oklch(0.86 0.15 90);
  --raznos-red: oklch(0.5 0.16 25);
  --raznos-red-tint: oklch(0.95 0.03 25);
  --raznos-font: "Onest", "Onest Fallback", "Helvetica Neue", Helvetica, sans-serif;
  --raznos-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --raznos-svc-vkusvill: oklch(0.5 0.14 150);
  --raznos-svc-samokat: oklch(0.62 0.2 355);
  --raznos-svc-yandex-eda: oklch(0.6 0.19 35);
  --raznos-svc-x5: oklch(0.62 0.17 55);
  --raznos-svc-kuper: oklch(0.55 0.15 140);
  --raznos-svc-ozon: oklch(0.55 0.17 250);
  --raznos-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--raznos-bg); color: var(--raznos-ink); font: 400 17px/1.55 var(--raznos-font); overflow-x: hidden; }
::selection { background: color-mix(in oklab, var(--raznos-brand) 30%, transparent); }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--raznos-brand); outline-offset: 3px; border-radius: 8px; }
img { display: block; max-width: 100%; }
h1, h2, h3, p, ul { margin: 0; }

.raznos-lp-wrap { width: 100%; max-width: 1160px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 720px) { .raznos-lp-wrap { padding: 0 32px; } }

/* кнопки как в прежнем лендинге */
.raznos-lp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 26px; border-radius: 14px; border: 1px solid transparent; font: 600 16px var(--raznos-font); text-decoration: none; cursor: pointer; transition: transform .12s ease, box-shadow .16s ease; white-space: nowrap; }
.raznos-lp-btn:hover { transform: translateY(-1px); }
.raznos-lp-btn-main { background: var(--raznos-green-deep); color: var(--raznos-on-dark); }
.raznos-lp-btn-main:hover { box-shadow: 0 10px 26px oklch(0.42 0.11 150 / .35); }
.raznos-lp-btn-line { background: transparent; color: var(--raznos-on-dark); border-color: rgba(255, 255, 255, .3); }
.raznos-lp-btn-icon { width: 26px; height: 26px; border-radius: 7px; }

/* шапка как в прежнем лендинге: светлая плашка поверх первого экрана */
.raznos-lp-header { position: sticky; top: 0; z-index: 30; padding: calc(9px + env(safe-area-inset-top, 0px)) 16px 0; margin-bottom: -69px; }
.raznos-lp-header-in { max-width: 1120px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 18px; border-radius: 15px; background: var(--raznos-surface); box-shadow: 0 6px 22px oklch(0 0 0 / .09); }
.raznos-lp-logo { display: flex; align-items: center; gap: 10px; font: 700 19px var(--raznos-font); letter-spacing: -0.01em; color: var(--raznos-ink); text-decoration: none; }
.raznos-lp-logo img { width: 30px; height: 30px; }
.raznos-lp-header-end { display: flex; align-items: center; gap: 18px; }
.raznos-lp-nav { display: none; align-items: center; gap: 22px; }
.raznos-lp-nav a { font: 600 15px var(--raznos-font); color: var(--raznos-ink-2); text-decoration: none; }
.raznos-lp-nav a:hover { color: var(--raznos-ink); }
.raznos-lp-header-btn { min-height: 40px; padding: 0 18px; font-size: 15px; }
.raznos-lp-lang { min-height: 40px; padding: 0 32px 0 12px; border-radius: 10px; border: 1px solid var(--raznos-line-strong); background: var(--raznos-surface) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1.5l5 5 5-5' fill='none' stroke='%23596270' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 12px center; color: var(--raznos-ink); font: 600 14px var(--raznos-font); cursor: pointer; -webkit-appearance: none; appearance: none; }
.raznos-lp-lang:hover { border-color: var(--raznos-ink-3); }
@media (max-width: 480px) { .raznos-lp-header-end { gap: 8px; } .raznos-lp-header-btn { padding: 0 14px; } .raznos-lp-lang { padding-right: 28px; background-position: right 9px center; max-width: 112px; } }
@media (min-width: 1000px) { .raznos-lp-nav { display: flex; } }


/* первый экран как в прежнем лендинге: точечная сетка, бейдж, карточка дохода */
.raznos-lp-hero { background-color: var(--raznos-dark); background-image: radial-gradient(rgba(255, 255, 255, .05) 1px, transparent 1.5px); background-size: 24px 24px; color: var(--raznos-on-dark); padding: 104px 0 64px; overflow: hidden; }
.raznos-lp-hero-in { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .raznos-lp-hero { padding: 132px 0 96px; } .raznos-lp-hero-in { grid-template-columns: 1.05fr .95fr; gap: 48px; } }
.raznos-lp-hero-badge { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin-bottom: 22px; padding: 7px 14px; border-radius: 999px; background: rgba(255, 255, 255, .1); font: 600 13px var(--raznos-font); }
.raznos-lp-hero-badge::before { content: ''; flex: none; width: 8px; height: 8px; border-radius: 50%; background: oklch(0.82 0.15 150); }
.raznos-lp-h1 { font: 700 clamp(36px, 8vw, 52px)/1.04 var(--raznos-font); letter-spacing: -0.03em; text-wrap: balance; }
.raznos-lp-h1 em { font-style: normal; color: oklch(0.82 0.15 150); }
.raznos-lp-hero-lead { margin-top: 20px; max-width: 46ch; font: 400 20px/1.5 var(--raznos-font); opacity: .85; text-wrap: pretty; }
@media (max-width: 600px) { .raznos-lp-hero-lead { font-size: 18px; } }
.raznos-lp-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

/* в первом экране шторка Начислено сегодня из приложения (DaySheet) */
.raznos-lp-sheet { display: flex; flex-direction: column; gap: 12px; width: 100%; max-width: 440px; justify-self: center; padding: 10px 16px 18px; border-radius: 28px; background: var(--raznos-bg); color: var(--raznos-ink); box-shadow: 0 30px 70px rgba(0, 0, 0, .38); }
.raznos-lp-sheet-grab { align-self: center; width: 40px; height: 4px; margin-bottom: 4px; border-radius: 999px; background: var(--raznos-line-strong); opacity: .6; }
.raznos-lp-sheet-net { display: flex; flex-direction: column; gap: 2px; padding: 0 4px; }
.raznos-lp-sheet-net > span { font: 600 14px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-sheet-net b { font: 800 34px/1.1 var(--raznos-font); letter-spacing: -0.02em; color: var(--raznos-green-deep); font-variant-numeric: tabular-nums; }
.raznos-lp-sheet-net small { font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-sheet-card { display: flex; flex-direction: column; padding: 4px 16px; border-radius: 18px; background: var(--raznos-surface); }
.raznos-lp-sheet-card > * + * { border-top: 1px solid var(--raznos-line); }
.raznos-lp-sheet-svc { display: flex; align-items: center; gap: 12px; padding: 8px 0; }
.raznos-lp-sheet-svc img { width: 28px; height: 28px; border-radius: 8px; flex: none; }
.raznos-lp-sheet-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.raznos-lp-sheet-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.raznos-lp-sheet-name { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; font: 600 14.5px var(--raznos-font); }
.raznos-lp-sheet-name small { font: 500 12.5px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-sheet-card b { font: 700 15px var(--raznos-font); font-variant-numeric: tabular-nums; white-space: nowrap; }
.raznos-lp-sheet-card b.is-minus { color: var(--raznos-red); }
.raznos-lp-sheet-bar { display: block; height: 6px; border-radius: 999px; background: var(--raznos-surface-2); overflow: hidden; }
.raznos-lp-sheet-bar > i { display: block; height: 100%; border-radius: inherit; background: var(--raznos-green); transform-origin: left; }
.raznos-lp-sheet-chev { font: 600 16px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-sheet-exp { display: flex; align-items: center; gap: 12px; padding: 8px 0; }
.raznos-lp-sheet-ico { width: 32px; height: 32px; flex: none; display: grid; place-items: center; border-radius: 10px; background: var(--raznos-red-tint); color: var(--raznos-red); }
.raznos-lp-sheet-ico svg { width: 18px; height: 18px; }
.raznos-lp-sheet-ico.is-tips { background: var(--raznos-green-tint); color: var(--raznos-green-deep); font: 700 16px var(--raznos-font); }
.raznos-lp-sheet-add { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 12px; border: 1px solid var(--raznos-line-strong); }
.raznos-lp-sheet-add svg { width: 16px; height: 16px; }
.raznos-lp-sheet-line { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; font: 700 15px var(--raznos-font); }
.raznos-lp-sheet-goal { gap: 8px; padding-bottom: 12px; }
.raznos-lp-sheet-goal > * + * { border-top: 0; }
.raznos-lp-sheet-goal .raznos-lp-sheet-line { min-height: 36px; }
.raznos-lp-sheet-goal .raznos-lp-sheet-bar { height: 8px; }
.raznos-lp-sheet-goal small { font: 500 12.5px/1.4 var(--raznos-font); color: var(--raznos-ink-3); }

/* ряд подключаемых сервисов под кнопками первого экрана */
.raznos-lp-hero-svc { margin-top: 32px; }
.raznos-lp-hero-svc p { font: 500 15px var(--raznos-font); color: color-mix(in oklab, var(--raznos-on-dark) 72%, transparent); }
.raznos-lp-hero-svc p b { color: var(--raznos-on-dark); font-weight: 650; }
.raznos-lp-hero-svc div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.raznos-lp-hero-svc img { width: 32px; height: 32px; border-radius: 9px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .12); }

/* заголовки секций */
.raznos-lp-section { padding: 72px 0; }
@media (min-width: 900px) { .raznos-lp-section { padding: 112px 0; } }
.raznos-lp-h2 { font: 800 clamp(30px, 6.4vw, 46px)/1.08 var(--raznos-font); letter-spacing: -0.03em; text-wrap: balance; max-width: 18em; }
.raznos-lp-dek { margin-top: 16px; max-width: 36em; font-size: 18px; color: var(--raznos-ink-2); text-wrap: pretty; }

/* история: на телефоне шаг и под ним экран, на широком экране телефон липкий и экран в нём меняется (landing.js) */
.raznos-lp-story { display: flex; flex-direction: column; gap: 72px; }
.raznos-lp-row { display: grid; gap: 32px; align-items: center; scroll-margin-top: 96px; }
@media (min-width: 900px) {
  .raznos-lp-story { gap: 120px; }
  .raznos-lp-row { grid-template-columns: minmax(0, 1fr) 340px; gap: 80px; }
}
.raznos-lp-story.is-sticky { display: grid; grid-template-columns: minmax(0, 1fr) 340px; column-gap: 80px; row-gap: 0; }
.raznos-lp-story.is-sticky > :not(.raznos-lp-stage) { grid-column: 1; }
.raznos-lp-story.is-sticky .raznos-lp-row { display: flex; flex-direction: column; justify-content: center; min-height: 86vh; }
.raznos-lp-story.is-sticky .raznos-lp-row .raznos-lp-phone { display: none; }
.raznos-lp-stage { grid-column: 2; grid-row: 1 / span 20; }
.raznos-lp-stage-phone { position: sticky; top: max(96px, calc(50vh - 326px)); height: 653px; }
.raznos-lp-stage-phone .raznos-lp-screen { position: absolute; top: 12px; left: 12px; opacity: 0; transform: translateY(14px) scale(.985); filter: blur(4px); transition: opacity .45s var(--raznos-ease), transform .55s var(--raznos-ease), filter .45s var(--raznos-ease); }
.raznos-lp-stage-phone .raznos-lp-screen.is-on { opacity: 1; transform: none; filter: none; }
.raznos-lp-story.is-sticky .raznos-lp-story-head { padding-top: 40px; }
@media (prefers-reduced-motion: reduce) { .raznos-lp-stage-phone .raznos-lp-screen { transition: none; transform: none; filter: none; } }
.raznos-lp-row-h { font: 750 clamp(26px, 5vw, 34px)/1.15 var(--raznos-font); letter-spacing: -0.025em; text-wrap: balance; }
.raznos-lp-row-d { margin-top: 14px; max-width: 32em; color: var(--raznos-ink-2); text-wrap: pretty; }
.raznos-lp-ul { list-style: none; padding: 0; margin-top: 22px; display: flex; flex-direction: column; gap: 12px; max-width: 32em; }
.raznos-lp-ul li { position: relative; padding-left: 26px; font-size: 16px; line-height: 1.45; }
.raznos-lp-ul li::before { content: ''; position: absolute; left: 2px; top: 5px; width: 12px; height: 14px; clip-path: var(--raznos-hex); background: var(--raznos-brand); }
.raznos-lp-quote { margin-top: 24px; padding: 14px 16px; border-radius: 14px; background: var(--raznos-surface); font: 500 15px/1.45 var(--raznos-font); color: var(--raznos-ink-2); max-width: 32em; }
.raznos-lp-quote b { color: var(--raznos-ink); }

/* телефон: экран нарисован на ширине 360 по скриншотам приложения и уменьшен */
.raznos-lp-phone { justify-self: center; width: 320px; max-width: 100%; padding: 10px; border-radius: 46px; background: oklch(0.18 0.01 250); box-shadow: 0 2px 0 1px oklch(0.32 0.01 250) inset, 0 40px 80px -30px rgba(20, 25, 40, .45); }
.raznos-lp-screen { position: relative; width: 360px; height: 760px; zoom: .8333; border-radius: 43px; overflow: hidden; background: var(--raznos-bg); display: flex; flex-direction: column; font-size: 14px; line-height: 1.35; pointer-events: none; user-select: none; }
.raznos-lp-screen svg { flex: none; }
.raznos-lp-status { flex: none; display: flex; justify-content: space-between; align-items: center; height: 38px; padding: 4px 30px 0; font: 600 14px var(--raznos-font); }
.raznos-lp-status svg { width: 46px; height: 12px; }
.raznos-lp-strip { flex: none; padding: 7px 12px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); font: 600 12.5px var(--raznos-font); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.raznos-lp-top { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 12px 12px 18px; }
.raznos-lp-top h4 { margin: 0; font: 750 26px/1.1 var(--raznos-font); letter-spacing: -0.02em; white-space: nowrap; }
.raznos-lp-top small { display: flex; align-items: center; gap: 4px; margin-top: 3px; font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-i14 { width: 13px; height: 13px; }
.raznos-lp-back { justify-content: flex-start; gap: 14px; padding: 8px 12px 10px; }
.raznos-lp-back h4 { font-size: 24px; }
.raznos-lp-sqbtn { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: var(--raznos-surface); color: var(--raznos-ink); }
.raznos-lp-sqbtn svg { width: 20px; height: 20px; }
.raznos-lp-sqbtn.is-off { background: transparent; border: 1px solid var(--raznos-line); color: var(--raznos-line-strong); }
.raznos-lp-top-btns { display: flex; align-items: center; gap: 8px; }
.raznos-lp-orb { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle at 30% 30%, oklch(0.62 0.13 150), oklch(0.31 0.04 205) 70%); color: #fff; }
.raznos-lp-orb svg { width: 18px; height: 18px; }
.raznos-lp-tbtn { position: relative; height: 40px; display: inline-flex; align-items: center; padding: 0 14px; border-radius: 12px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); font: 600 14px var(--raznos-font); }
.raznos-lp-tbtn i { position: absolute; top: -3px; right: -3px; width: 9px; height: 9px; border-radius: 50%; background: var(--raznos-red); }
.raznos-lp-tbtn-sq { width: 40px; padding: 0; justify-content: center; }
.raznos-lp-tbtn svg { width: 18px; height: 18px; }
.raznos-lp-body { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: 10px; padding: 0 12px 12px; }
.raznos-lp-body > * { flex: none; }
.raznos-lp-sec-t { margin: 6px 0 -2px; font: 700 17px var(--raznos-font); }
.raznos-lp-chev { width: 14px; height: 14px; color: var(--raznos-ink-3); }
.raznos-lp-note { font: 500 12px/1.4 var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-card { padding: 14px; border-radius: 16px; background: var(--raznos-surface); border: 1px solid var(--raznos-line); }
.raznos-lp-ico { width: 28px; height: 28px; border-radius: 8px; }
.raznos-lp-ico-md { width: 32px; height: 32px; border-radius: 9px; }
.raznos-lp-ico-lg { width: 40px; height: 40px; border-radius: 11px; }
.raznos-lp-num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.raznos-lp-pill { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; font: 650 11.5px var(--raznos-font); white-space: nowrap; background: var(--raznos-green-tint); color: var(--raznos-green-deep); }
.raznos-lp-pill-dark { background: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-pill-dark::before, .raznos-lp-pill-dot::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--raznos-brand); }
.raznos-lp-pill-dot::before { background: var(--raznos-green-deep); }
@media (prefers-reduced-motion: no-preference) { .raznos-lp-pill-dark::before { animation: raznos-lp-live 1.6s ease-in-out infinite; } }
@keyframes raznos-lp-live { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in oklab, var(--raznos-green) 70%, transparent); } 50% { box-shadow: 0 0 0 4px transparent; } }

/* нижнее меню */
.raznos-lp-tabs { flex: none; display: flex; padding: 4px 8px 16px; background: var(--raznos-surface); border-top: 1px solid var(--raznos-line); }
.raznos-lp-tab { position: relative; flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 5px 2px; border-radius: 12px; font: 600 11px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-tab svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.raznos-lp-tab.is-on { background: var(--raznos-green); color: #fff; }
.raznos-lp-tab:nth-child(2)::after { content: ''; position: absolute; top: 3px; left: calc(50% + 5px); width: 8px; height: 8px; border-radius: 50%; background: var(--raznos-red); border: 2px solid var(--raznos-surface); }
.raznos-lp-tab.is-on:nth-child(2)::after { display: none; }

/* кнопка Спросить из приложения */
.raznos-lp-ask { position: relative; flex: none; height: 40px; display: inline-flex; align-items: center; gap: 6px; padding: 0 16px 0 12px; border-radius: 999px; overflow: hidden; isolation: isolate; background: oklch(0.31 0.04 205); color: #fff; font: 600 14px var(--raznos-font); box-shadow: 0 2px 8px rgba(20, 25, 40, .18); }
.raznos-lp-ask i { position: absolute; z-index: -1; width: 60%; aspect-ratio: 1; border-radius: 50%; filter: blur(6px); }
.raznos-lp-ask i:nth-child(1) { left: -15%; top: -15%; background: oklch(0.56 0.13 150); }
.raznos-lp-ask i:nth-child(2) { right: -20%; top: 5%; background: oklch(0.5 0.09 188); }
.raznos-lp-ask i:nth-child(3) { left: 10%; bottom: -25%; background: oklch(0.7 0.14 140); opacity: .7; }
.raznos-lp-ask svg { width: 18px; height: 18px; fill: currentColor; }
@media (prefers-reduced-motion: no-preference) {
  .raznos-lp-ask i:nth-child(1) { animation: raznos-lp-drift-a 5s ease-in-out infinite alternate; }
  .raznos-lp-ask i:nth-child(2) { animation: raznos-lp-drift-b 6s ease-in-out infinite alternate; }
  .raznos-lp-ask i:nth-child(3) { animation: raznos-lp-drift-c 7s ease-in-out infinite alternate; }
  .raznos-lp-ask::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .38) 50%, transparent 70%); translate: -100% 0; animation: raznos-lp-sheen 4.8s cubic-bezier(.4, 0, .2, 1) 1.5s infinite; }
}
@keyframes raznos-lp-drift-a { 50% { transform: translate(35%, 20%) scale(1.15); } 100% { transform: translate(15%, 45%) scale(.95); } }
@keyframes raznos-lp-drift-b { 50% { transform: translate(-40%, 25%) scale(.9); } 100% { transform: translate(-15%, -20%) scale(1.12); } }
@keyframes raznos-lp-drift-c { 50% { transform: translate(30%, -35%) scale(.92); } 100% { transform: translate(-10%, -15%) scale(1.1); } }
@keyframes raznos-lp-sheen { 0% { translate: -100% 0; } 25%, 100% { translate: 100% 0; } }

/* Сегодня */
.raznos-lp-alert { border-radius: 16px; background: var(--raznos-amber-tint); }
.raznos-lp-alert-main { display: flex; align-items: center; gap: 12px; padding: 12px 14px; }
.raznos-lp-alert-main > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-alert b { font: 650 15px var(--raznos-font); }
.raznos-lp-alert small { font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-alert-ico { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; background: var(--raznos-surface); color: var(--raznos-amber); }
.raznos-lp-alert-ico svg { width: 20px; height: 20px; }
.raznos-lp-alert-more { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px 10px 58px; border-top: 1px solid color-mix(in oklab, var(--raznos-amber) 20%, transparent); }
.raznos-lp-alert-more b { font: 600 13.5px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-today { position: relative; padding: 18px; border-radius: 20px; background: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-today-go { position: absolute; top: 14px; right: 14px; }
.raznos-lp-today-go svg { width: 20px; height: 20px; color: color-mix(in oklab, var(--raznos-on-dark) 75%, transparent); }
.raznos-lp-today-lab { font: 500 14px var(--raznos-font); opacity: .72; }
.raznos-lp-today-val { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.raznos-lp-today-val b { font: 700 40px/1 var(--raznos-mono); letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.raznos-lp-today-val span { font: 600 16px var(--raznos-font); opacity: .8; }
.raznos-lp-today-stats { margin-top: 8px; font: 600 13px var(--raznos-mono); opacity: .88; }
.raznos-lp-today-legend { display: flex; justify-content: space-between; gap: 8px; margin-top: 16px; font: 500 13px var(--raznos-font); white-space: nowrap; }
.raznos-lp-today-legend span { opacity: .8; display: inline-flex; align-items: center; gap: 6px; }
.raznos-lp-today-legend b { font-weight: 700; }
.raznos-lp-hexmark { width: 10px; height: 11px; clip-path: var(--raznos-hex); background: color-mix(in oklab, var(--raznos-on-dark) 55%, transparent); }
.raznos-lp-today-track { position: relative; height: 6px; margin-top: 10px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-green) 32%, transparent); }
.raznos-lp-today-track .raznos-lp-fill { position: absolute; inset: 0 26% 0 0; border-radius: inherit; background: var(--raznos-green); transform-origin: left; }
.raznos-lp-today-track .raznos-lp-goal { position: absolute; left: 87%; top: 50%; width: 16px; height: 18px; transform: translate(-50%, -50%); clip-path: var(--raznos-hex); background: var(--raznos-dark); }
.raznos-lp-today-track .raznos-lp-goal::after { content: ''; position: absolute; inset: 3px; clip-path: var(--raznos-hex); background: color-mix(in oklab, var(--raznos-on-dark) 55%, transparent); }
.raznos-lp-today-track .raznos-lp-tick { position: absolute; right: 0; top: -4px; bottom: -4px; width: 2px; border-radius: 1px; background: color-mix(in oklab, var(--raznos-on-dark) 70%, transparent); }
.raznos-lp-today-money { margin-top: 14px; font: 500 13px/1.5 var(--raznos-font); opacity: .8; }
.raznos-lp-today-money b { font-weight: 700; }
.raznos-lp-today-act { display: flex; gap: 8px; margin-top: 12px; }
.raznos-lp-today-act span { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 16px 0 12px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-on-dark) 12%, transparent); font: 600 14px var(--raznos-font); }
.raznos-lp-today-act svg { width: 16px; height: 16px; }
.raznos-lp-shift { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 18px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); }
.raznos-lp-shift-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.raznos-lp-shift-head b { display: block; font: 700 16px var(--raznos-font); }
.raznos-lp-shift-head small { font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-shift-end { font: 600 14px var(--raznos-font); color: var(--raznos-ink-2); padding-top: 2px; }
.raznos-lp-slot { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px; background: var(--raznos-surface-2); }
.raznos-lp-slot.is-now { background: var(--raznos-green-tint); }
.raznos-lp-slot > span { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.raznos-lp-slot em { display: flex; justify-content: space-between; font: normal 650 11px var(--raznos-font); letter-spacing: .04em; text-transform: uppercase; color: var(--raznos-ink-3); }
.raznos-lp-slot em i { font-style: normal; text-transform: none; letter-spacing: 0; font-size: 12px; }
.raznos-lp-slot.is-now em { color: var(--raznos-green-deep); }
.raznos-lp-slot b { font: 700 16px var(--raznos-font); }
.raznos-lp-slot small { font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* План */
.raznos-lp-banner { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 12px; background: var(--raznos-amber-tint); font: 500 13px/1.35 var(--raznos-font); }
.raznos-lp-banner span { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.raznos-lp-banner .raznos-lp-chev { color: var(--raznos-amber); }
.raznos-lp-close { width: 16px; height: 16px; color: var(--raznos-ink-3); }
.raznos-lp-weekrow { display: flex; align-items: center; gap: 2px; margin: 0 -4px; }
.raznos-lp-weekrow > svg { width: 20px; height: 20px; color: var(--raznos-ink-2); }
.raznos-lp-week { flex: 1; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.raznos-lp-day { height: 62px; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 7px 0 6px; border-radius: 12px; }
.raznos-lp-day > span:first-child { font: 600 11px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-day b { font: 700 18px var(--raznos-mono); }
.raznos-lp-day > svg { width: 12px; height: 12px; color: var(--raznos-green-deep); }
.raznos-lp-day.is-past b { color: var(--raznos-ink-3); }
.raznos-lp-day.is-today { background: var(--raznos-dark); box-shadow: inset 0 0 0 2px var(--raznos-green), inset 0 0 0 4px var(--raznos-dark); }
.raznos-lp-day.is-today > span:first-child { color: color-mix(in oklab, var(--raznos-on-dark) 70%, transparent); }
.raznos-lp-day.is-today b { color: var(--raznos-on-dark); }
.raznos-lp-dots { display: flex; gap: 2px; height: 5px; }
.raznos-lp-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--svc); }
.raznos-lp-legend { display: flex; align-items: center; gap: 5px; font: 500 11.5px var(--raznos-font); color: var(--raznos-ink-3); white-space: nowrap; }
.raznos-lp-legend i { width: 6px; height: 6px; margin-left: 4px; border-radius: 50%; background: var(--svc); }
.raznos-lp-goalcard { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border-radius: 14px; background: var(--raznos-surface); box-shadow: 0 1px 3px rgba(20, 25, 40, .08); }
.raznos-lp-goalcard p { display: flex; align-items: center; gap: 8px; }
.raznos-lp-goalcard b { font: 700 15px var(--raznos-font); }
.raznos-lp-goalcard p span { margin-left: auto; font: 650 13px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-goalcard-track { height: 6px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-green) 30%, var(--raznos-surface)); overflow: hidden; }
.raznos-lp-goalcard-track i { display: block; width: 24%; height: 100%; border-radius: inherit; background: var(--raznos-green); transform-origin: left; }
.raznos-lp-dayhead { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 4px; }
.raznos-lp-dayhead span { display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-dayhead span:last-child { align-items: flex-end; }
.raznos-lp-dayhead b { font: 700 18px var(--raznos-font); }
.raznos-lp-dayhead span:last-child b { font: 750 24px/1 var(--raznos-font); letter-spacing: -0.02em; }
.raznos-lp-dayhead small { font: 500 12.5px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-dayhead u { text-decoration-color: var(--raznos-green-deep); text-underline-offset: 3px; color: var(--raznos-green-deep); }
.raznos-lp-dayhead span:last-child u { color: var(--raznos-ink-3); text-decoration-color: var(--raznos-line-strong); }
.raznos-lp-rebuild { display: flex; align-items: center; gap: 8px; font: 700 15px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-rebuild svg:first-child { width: 18px; height: 18px; }
.raznos-lp-rebuild span { padding: 3px 9px; border-radius: 999px; background: var(--raznos-green-tint); font-size: 13px; }

/* окно плана, у идущего бежит рамка */
@property --raznos-lp-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.raznos-lp-win { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 12px; border-radius: 14px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); box-shadow: inset 4px 0 0 var(--svc, transparent); }
.raznos-lp-win.is-now { background: var(--raznos-green-tint); border-color: color-mix(in oklab, var(--raznos-green) 45%, var(--raznos-line)); }
.raznos-lp-win.is-warn { background: var(--raznos-amber-tint); border-color: color-mix(in oklab, var(--raznos-amber) 55%, var(--raznos-line)); }
.raznos-lp-win.is-free { border-style: dashed; border-color: var(--raznos-line-strong); }
@media (prefers-reduced-motion: no-preference) {
  .raznos-lp-win.is-now::before { content: ''; position: absolute; inset: -1.5px; padding: 2px; border-radius: 15px; background: conic-gradient(from var(--raznos-lp-a), transparent 0deg 210deg, oklch(0.62 0.15 150) 320deg, oklch(0.88 0.09 150) 345deg, transparent 360deg); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: raznos-lp-run 3.2s linear infinite; }
}
@keyframes raznos-lp-run { to { --raznos-lp-a: 360deg; } }
.raznos-lp-win-main { display: grid; grid-template-columns: 50px 28px minmax(0, 1fr) auto; gap: 10px; align-items: start; }
.raznos-lp-win-time { display: flex; flex-direction: column; padding-top: 2px; font: 700 13px/1.25 var(--raznos-mono); }
.raznos-lp-win-time small { font: 600 13px/1.25 var(--raznos-mono); color: var(--raznos-ink-3); }
.raznos-lp-win-copy { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.raznos-lp-win-copy b { font: 700 15px var(--raznos-font); }
.raznos-lp-win-copy small { font: 500 12.5px/1.3 var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-win-copy em { margin-top: 2px; padding: 1px 8px; border-radius: 999px; border: 1px solid var(--raznos-line-strong); font: normal 600 11px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-win-end { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 4px 2px; max-width: 108px; font: 650 13px var(--raznos-font); color: var(--raznos-ink-2); white-space: nowrap; }
.raznos-lp-win-end .raznos-lp-pill { background: var(--raznos-surface); color: var(--raznos-ink-2); font-size: 11px; }
.raznos-lp-win-end .raznos-lp-pill-dark { background: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-quest { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-green) 14%, var(--raznos-surface)); font: 650 12.5px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-win.is-now .raznos-lp-quest { background: transparent; padding-left: 0; }
.raznos-lp-quest svg { width: 14px; height: 14px; }
.raznos-lp-win-left { font: 700 13px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-win-warn { display: flex; align-items: center; gap: 10px; padding-top: 8px; border-top: 1px solid color-mix(in oklab, var(--raznos-amber) 30%, transparent); }
.raznos-lp-win-warn span { flex: 1; display: flex; flex-direction: column; gap: 1px; }
.raznos-lp-win-warn b { font: 650 14px var(--raznos-font); }
.raznos-lp-win-warn small { font: 500 12.5px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-alert-i { width: 18px; height: 18px; color: var(--raznos-amber); }

/* Результаты */
.raznos-lp-periods { display: grid; grid-template-columns: repeat(5, 1fr); padding: 4px; border-radius: 14px; background: var(--raznos-surface); font: 600 14px var(--raznos-font); text-align: center; color: var(--raznos-ink-2); }
.raznos-lp-periods span { padding: 8px 0; border-radius: 999px; }
.raznos-lp-periods .is-on { background: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-range { display: flex; align-items: center; gap: 8px; }
.raznos-lp-range b { margin-right: auto; font: 700 17px var(--raznos-font); }
.raznos-lp-res { display: flex; flex-direction: column; gap: 14px; padding: 18px; border-radius: 20px; background: var(--raznos-surface); }
.raznos-lp-res-head { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 8px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-green) 14%, var(--raznos-surface)); font: 700 13px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-res-head i { width: 14px; height: 16px; clip-path: var(--raznos-hex); background: var(--raznos-green); }
.raznos-lp-res-top { display: flex; justify-content: space-between; align-items: center; font: 650 16px var(--raznos-font); }
.raznos-lp-res-amt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; margin-top: -8px; }
.raznos-lp-res-amt b { font: 800 46px/1 var(--raznos-font); letter-spacing: -0.04em; color: var(--raznos-green-deep); font-variant-numeric: tabular-nums; }
.raznos-lp-res-amt > span { font: 650 20px var(--raznos-font); }
.raznos-lp-res-sub { margin-top: -8px; font: 500 14px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-res-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 12px; padding-top: 14px; border-top: 1px solid var(--raznos-line); }
.raznos-lp-res-grid div { display: flex; flex-direction: column; gap: 3px; }
.raznos-lp-res-grid b { font: 750 17px var(--raznos-font); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.raznos-lp-res-grid small { font: 500 12.5px var(--raznos-font); color: var(--raznos-ink-3); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--raznos-line-strong); }
.raznos-lp-res-grid .is-red b { color: var(--raznos-red); }
.raznos-lp-res-grid .is-green b { color: var(--raznos-green-deep); }
.raznos-lp-res-goal { display: flex; flex-direction: column; gap: 8px; padding-top: 14px; border-top: 1px solid var(--raznos-line); }
.raznos-lp-res-goal div:first-child { display: flex; justify-content: space-between; font: 650 15px var(--raznos-font); }
.raznos-lp-res-goal div:first-child span { font: 600 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-res-gt { position: relative; height: 10px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-ink) 8%, var(--raznos-surface)); }
.raznos-lp-res-gt i { position: absolute; inset: 0 78% 0 0; border-radius: inherit; background: var(--raznos-green); transform-origin: left; }
.raznos-lp-res-gt em { position: absolute; left: 43%; top: -4px; width: 3px; height: 18px; border-radius: 2px; background: var(--raznos-ink); box-shadow: 0 0 0 2px var(--raznos-surface); }
.raznos-lp-res-goal p { font: 550 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-rhythm { display: flex; flex-direction: column; gap: 12px; padding-top: 14px; border-top: 1px solid var(--raznos-line); }
.raznos-lp-rhythm p { font: 700 18px/1.25 var(--raznos-font); letter-spacing: -0.02em; }
.raznos-lp-rhythm em { font-style: normal; color: var(--raznos-green-deep); }
.raznos-lp-rings { display: flex; justify-content: space-between; }
.raznos-lp-rings > span { display: flex; flex-direction: column; align-items: center; gap: 5px; }
.raznos-lp-rings i { position: relative; width: 36px; height: 36px; border-radius: 50%; background: conic-gradient(var(--raznos-green) 0 var(--r, 0%), color-mix(in oklab, var(--raznos-ink) 8%, var(--raznos-surface)) var(--r, 0%) 100%); }
.raznos-lp-rings i::after { content: ''; position: absolute; inset: 7px; border-radius: 50%; background: var(--raznos-surface); }
.raznos-lp-rings .is-best i { background: conic-gradient(var(--raznos-green-deep) 0 100%); }
.raznos-lp-rings .is-empty i { background: color-mix(in oklab, var(--raznos-ink) 6%, var(--raznos-surface)); }
.raznos-lp-rings small { font: 600 12px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-rings .is-best small { color: var(--raznos-green-deep); font-weight: 750; }

/* Топ курьеров с золотым бликом */
.raznos-lp-topcard { position: relative; overflow: hidden; display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 18px; background: var(--raznos-surface); }
.raznos-lp-medal { width: 44px; height: 48px; flex: none; display: grid; place-items: center; clip-path: var(--raznos-hex); background: color-mix(in oklab, var(--raznos-amber) 22%, var(--raznos-surface)); color: var(--raznos-amber); }
.raznos-lp-medal svg { width: 22px; height: 22px; }
.raznos-lp-topcard-copy { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.raznos-lp-topcard-copy b { font: 700 16px var(--raznos-font); }
.raznos-lp-topcard-copy small { font: 500 12.5px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-topcard-copy em { display: flex; align-items: center; gap: 3px; font: normal 600 11.5px var(--raznos-font); color: var(--raznos-green-deep); white-space: nowrap; }
.raznos-lp-topcard-copy em svg { width: 11px; height: 11px; }
.raznos-lp-place { flex: none; padding: 6px 11px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-green) 14%, var(--raznos-surface)); color: var(--raznos-green-deep); font: 750 14px/1 var(--raznos-font); }
@media (prefers-reduced-motion: no-preference) {
  .raznos-lp-topcard::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(105deg, transparent 32%, color-mix(in oklab, var(--raznos-gold) 60%, transparent) 50%, transparent 68%); transform: translateX(-100%); }
  .is-seen .raznos-lp-topcard::before, .raznos-lp-screen.is-on .raznos-lp-topcard::before { animation: raznos-lp-sweep 5s cubic-bezier(.45, 0, .25, 1) .6s infinite; }
}
@keyframes raznos-lp-sweep { 0% { transform: translateX(-100%); } 40%, 100% { transform: translateX(100%); } }

/* Рынок: переключатели и фильтры */
.raznos-lp-seg { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 14px; background: color-mix(in oklab, var(--raznos-ink) 5%, transparent); font: 600 15px var(--raznos-font); text-align: center; }
.raznos-lp-seg span { padding: 8px; border-radius: 10px; color: var(--raznos-ink-2); }
.raznos-lp-seg .is-on { background: var(--raznos-surface); color: var(--raznos-ink); box-shadow: 0 1px 3px rgba(20, 25, 40, .12); }
.raznos-lp-chips { display: flex; gap: 8px; overflow: hidden; }
.raznos-lp-chips span { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--raznos-line-strong); background: var(--raznos-surface); font: 600 14px var(--raznos-font); white-space: nowrap; }
.raznos-lp-chips svg { width: 12px; height: 12px; }

/* Где выгоднее */
.raznos-lp-map { position: relative; border-radius: 18px; overflow: hidden; aspect-ratio: 1000 / 860; border: 1px solid var(--raznos-line); background: oklch(0.9 0.005 250); }
.raznos-lp-map img { width: 100%; height: 100%; object-fit: cover; }
.raznos-lp-map-toggle { position: absolute; left: 8px; top: 8px; display: flex; padding: 3px; border-radius: 999px; background: var(--raznos-surface); font: 600 13px var(--raznos-font); box-shadow: 0 2px 6px rgba(20, 25, 40, .18); }
.raznos-lp-map-toggle span { padding: 5px 12px; border-radius: 999px; color: var(--raznos-ink-2); }
.raznos-lp-map-toggle .is-on { background: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-map-legend { position: absolute; left: 8px; bottom: 8px; display: flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; background: var(--raznos-surface); font: 600 11px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-map-legend i { width: 10px; height: 11px; clip-path: var(--raznos-hex); }
.raznos-lp-map-fit { position: absolute; right: 8px; bottom: 22px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: var(--raznos-surface); box-shadow: 0 2px 6px rgba(20, 25, 40, .18); }
.raznos-lp-map-fit svg { width: 18px; height: 18px; }
.raznos-lp-map-osm { position: absolute; right: 8px; bottom: 5px; font: 500 9px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-district { display: grid; grid-template-columns: 14px auto minmax(0, 1fr) auto auto 36px; gap: 8px; align-items: center; padding: 10px 12px; border-radius: 16px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); }
.raznos-lp-district > span:first-child { font: 700 14px var(--raznos-font); }
.raznos-lp-district b { font: 650 15px var(--raznos-font); }
.raznos-lp-route { display: inline-flex; align-items: center; gap: 5px; height: 34px; padding: 0 10px; border-radius: 10px; background: var(--raznos-surface-2); font: 600 13px var(--raznos-font); }
.raznos-lp-route svg { width: 14px; height: 14px; }
.raznos-lp-bell { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--raznos-line-strong); }
.raznos-lp-bell svg { width: 16px; height: 16px; }
.raznos-lp-rank-track { height: 6px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-ink) 10%, transparent); overflow: hidden; }
.raznos-lp-rank-track i { display: block; height: 100%; border-radius: inherit; background: color-mix(in oklab, var(--raznos-green) 55%, var(--raznos-surface)); transform-origin: left; }
.raznos-lp-district .raznos-lp-rank-track i, .raznos-lp-rank-row.is-top .raznos-lp-rank-track i { background: var(--raznos-green); }
.raznos-lp-rank-val { font: 700 14px var(--raznos-font); text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Когда выгоднее */
.raznos-lp-bars-card { display: flex; flex-direction: column; gap: 10px; }
.raznos-lp-bars-head { display: flex; justify-content: space-between; align-items: flex-start; }
.raznos-lp-bars-head small { display: block; font: 600 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-bars-head b { font: 800 30px/1.15 var(--raznos-font); letter-spacing: -0.02em; }
.raznos-lp-bars { display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; align-items: end; height: 170px; padding-top: 26px; border-bottom: 1px solid var(--raznos-line); }
.raznos-lp-bar { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; }
.raznos-lp-bar i { display: block; height: var(--h); border-radius: 6px 6px 0 0; background: color-mix(in oklab, var(--raznos-ink) 12%, var(--raznos-surface)); transform-origin: bottom; }
.raznos-lp-bar.is-best i { background: var(--raznos-green-deep); }
.raznos-lp-bar.is-best::before { content: '530'; position: absolute; left: 50%; bottom: calc(var(--h) + 6px); transform: translateX(-50%); padding: 2px 7px; border-radius: 999px; background: var(--raznos-dark); color: #fff; font: 700 11px var(--raznos-mono); }
.raznos-lp-bars-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; text-align: center; font: 600 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-bars-days .is-today { color: var(--raznos-green-deep); font-weight: 750; }
.raznos-lp-trend { display: flex; gap: 8px; padding: 10px 12px; border-radius: 12px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); font: 600 13px/1.35 var(--raznos-font); }
.raznos-lp-trend svg { width: 14px; height: 14px; margin-top: 2px; }
.raznos-lp-trend span b { font-weight: 700; }
.raznos-lp-trend-row { margin: 4px 0; font-weight: 500; }
.raznos-lp-linkcard { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 16px; background: var(--raznos-surface); }
.raznos-lp-linkcard > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-linkcard b { font: 700 15px/1.3 var(--raznos-font); }
.raznos-lp-linkcard small { font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-linkcard-ico { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); }
.raznos-lp-linkcard-ico svg { width: 20px; height: 20px; }

/* Сравнение сервисов */
.raznos-lp-rank { padding: 2px 12px; border-radius: 16px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); }
.raznos-lp-rank-row { display: grid; grid-template-columns: 16px minmax(0, 1fr) 40px auto 34px; gap: 6px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--raznos-line); }
.raznos-lp-rank-row:last-child { border-bottom: 0; }
.raznos-lp-rank-row > span:first-child { font: 700 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-rank-name { min-width: 0; display: flex; align-items: center; gap: 8px; }
.raznos-lp-rank-name > span { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.raznos-lp-rank-name b { font: 600 14.5px var(--raznos-font); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.raznos-lp-rank-name small { display: flex; align-items: center; gap: 3px; font: 500 12px var(--raznos-font); color: var(--raznos-ink-3); white-space: nowrap; }
.raznos-lp-flame { width: 10px; height: 10px; color: var(--raznos-ink-3); }
.raznos-lp-check { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); }
.raznos-lp-check svg { width: 16px; height: 16px; }
.raznos-lp-check.is-off { background: var(--raznos-surface-2); color: var(--raznos-ink); }
.raznos-lp-star { width: 14px; height: 14px; margin-right: 3px; vertical-align: -2px; color: var(--raznos-amber); fill: currentColor; }

/* рефералки */
.raznos-lp-ref { background: var(--raznos-surface); }
.raznos-lp-ref-in { display: grid; gap: 40px; margin-top: 40px; align-items: start; }
@media (min-width: 900px) { .raznos-lp-ref-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; margin-top: 56px; } }
.raznos-lp-ref-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; }
.raznos-lp-ref-tile { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 18px; background: var(--raznos-bg); }
.raznos-lp-ref-tile:first-child { background: var(--raznos-green-tint); }
.raznos-lp-ref-tile svg { width: 26px; height: 26px; color: var(--raznos-green-deep); }
.raznos-lp-ref-tile b { font: 700 16px/1.25 var(--raznos-font); }
.raznos-lp-ref-tile span { font: 500 14px/1.4 var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-ref-note { margin-top: 20px; font: 500 14px/1.5 var(--raznos-font); color: var(--raznos-ink-3); max-width: 34em; }
.raznos-lp-prog { padding: 22px; border-radius: 22px; background: var(--raznos-dark); color: var(--raznos-on-dark); box-shadow: 0 30px 60px -30px rgba(20, 25, 40, .5); }
.raznos-lp-prog-head { display: flex; align-items: center; gap: 12px; }
.raznos-lp-prog-head img { width: 40px; height: 40px; border-radius: 11px; }
.raznos-lp-prog-head b { display: block; font: 700 17px var(--raznos-font); }
.raznos-lp-prog-head small { font: 500 13px var(--raznos-font); opacity: .72; }
.raznos-lp-prog-lab { margin-top: 22px; font: 500 14px var(--raznos-font); opacity: .72; }
.raznos-lp-prog-sum { margin-top: 4px; font: 700 clamp(40px, 11vw, 52px)/1 var(--raznos-mono); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.raznos-lp-prog-sub { margin-top: 8px; font: 500 15px var(--raznos-font); opacity: .85; }
.raznos-lp-ladder { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; align-items: end; height: 150px; margin-top: 24px; }
.raznos-lp-step { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 6px; height: 100%; font: 600 11px var(--raznos-mono); }
.raznos-lp-step i { width: 100%; height: var(--h); border-radius: 6px 6px 2px 2px; background: color-mix(in oklab, var(--raznos-on-dark) 22%, transparent); transform-origin: bottom; }
.raznos-lp-step:last-child i { background: var(--raznos-brand); }
.raznos-lp-step span { opacity: .8; white-space: nowrap; }
.raznos-lp-ladder-x { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin-top: 6px; text-align: center; font: 600 11px var(--raznos-mono); opacity: .6; }
.raznos-lp-prog-foot { margin-top: 16px; padding-top: 14px; border-top: 1px solid color-mix(in oklab, var(--raznos-on-dark) 14%, transparent); font: 600 13px var(--raznos-font); opacity: .8; }
.raznos-lp-offer { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; margin-top: 12px; padding: 16px; border-radius: 18px; background: var(--raznos-bg); }
.raznos-lp-offer-ava { grid-row: span 2; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: oklch(0.9 0.05 300); font: 800 16px var(--raznos-font); color: oklch(0.4 0.12 300); }
.raznos-lp-offer b { font: 700 15px var(--raznos-font); }
.raznos-lp-offer small { grid-column: 2 / 4; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-offer > span:nth-child(3) { font: 700 14px var(--raznos-font); }
.raznos-lp-offer .raznos-lp-pill svg { width: 12px; height: 12px; }

/* сервисы */
.raznos-lp-svc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 32px; }
@media (min-width: 640px) { .raznos-lp-svc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .raznos-lp-svc-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.raznos-lp-svc { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px 14px; border-radius: 16px; background: var(--raznos-surface); font: 600 15px var(--raznos-font); }
.raznos-lp-svc img { width: 36px; height: 36px; border-radius: 10px; flex: none; }
.raznos-lp-svc span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.raznos-lp-svc.is-soon { background: transparent; border: 1px dashed var(--raznos-line); color: var(--raznos-ink-3); }
.raznos-lp-svc.is-soon img { filter: grayscale(1); opacity: .55; }
.raznos-lp-svc-soon-t { margin-top: 28px; font: 650 15px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-svc-soon-t + .raznos-lp-svc-grid { margin-top: 12px; }
.raznos-lp-svc-note { margin-top: 20px; font: 500 14px var(--raznos-font); color: var(--raznos-ink-3); }

/* доверие: три карточки с иконками */
.raznos-lp-trust { display: grid; gap: 12px; margin-top: 48px; }
@media (min-width: 800px) { .raznos-lp-trust { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.raznos-lp-trust > div { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 4px 16px; align-items: start; padding: 20px; border-radius: 18px; background: var(--raznos-surface); }
.raznos-lp-trust-ico { grid-row: span 2; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); }
.raznos-lp-trust-ico svg { width: 24px; height: 24px; }
.raznos-lp-trust b { font: 700 18px/1.3 var(--raznos-font); }
.raznos-lp-trust p { font: 500 15px/1.45 var(--raznos-font); color: var(--raznos-ink-2); }

/* вопросы как в прежнем лендинге: на всю ширину, первый раскрыт, шеврон */
.raznos-lp-faq { margin-top: 14px; }
.raznos-lp-faq details { border-bottom: 1px solid var(--raznos-line); }
.raznos-lp-faq details:last-child { border-bottom: 0; }
.raznos-lp-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 0; font: 600 17px var(--raznos-font); cursor: pointer; list-style: none; }
.raznos-lp-faq summary::-webkit-details-marker { display: none; }
.raznos-lp-faq summary::after { content: ''; flex: none; width: 9px; height: 9px; margin-right: 4px; border-right: 2px solid var(--raznos-ink-3); border-bottom: 2px solid var(--raznos-ink-3); transform: rotate(45deg); transition: transform .2s ease; }
.raznos-lp-faq details[open] summary::after { transform: rotate(-135deg); }
.raznos-lp-faq details p { margin: 0 0 18px; font: 400 16px/1.5 var(--raznos-font); color: var(--raznos-ink-2); text-wrap: pretty; }

/* финал */
.raznos-lp-final { background: var(--raznos-dark); color: var(--raznos-on-dark); text-align: center; }
.raznos-lp-final img.raznos-lp-final-icon { width: 72px; height: 72px; margin: 0 auto 24px; border-radius: 18px; }
.raznos-lp-final .raznos-lp-h2 { margin: 0 auto; }
.raznos-lp-final .raznos-lp-dek { margin: 16px auto 0; color: color-mix(in oklab, var(--raznos-on-dark) 78%, transparent); }
.raznos-lp-final .raznos-lp-btn { margin-top: 32px; }
.raznos-lp-final-bot { display: inline-block; margin-top: 20px; font: 550 15px var(--raznos-font); color: color-mix(in oklab, var(--raznos-on-dark) 75%, transparent); text-underline-offset: 4px; }
.raznos-lp-fine { margin-top: 40px; font: 400 13px var(--raznos-font); opacity: .55; }

/* появление: цифры и полосы стартуют, когда блок виден. Без скрипта всё сразу на месте */
.raznos-lp-js .raznos-lp-grow { transform: scaleX(0); transition: transform 1s var(--raznos-ease) .2s; }
.raznos-lp-js .raznos-lp-rise { transform: scaleY(0); transition: transform .9s var(--raznos-ease); transition-delay: calc(var(--i, 0) * 60ms + .15s); }
.raznos-lp-js .is-seen .raznos-lp-grow, .raznos-lp-js .is-seen.raznos-lp-grow { transform: none; }
.raznos-lp-js .is-seen .raznos-lp-rise { transform: none; }
@media (prefers-reduced-motion: reduce) { .raznos-lp-js .raznos-lp-grow, .raznos-lp-js .raznos-lp-rise { transform: none; transition: none; } }

/* страница скачивания */
.raznos-lp-dl { min-height: 100dvh; display: grid; place-items: center; padding: 104px 16px 56px; }
.raznos-lp-dl-box { width: 100%; max-width: 440px; text-align: center; }
.raznos-lp-dl-box > img { width: 88px; height: 88px; margin: 0 auto; border-radius: 22px; box-shadow: 0 16px 32px -12px color-mix(in oklab, var(--raznos-brand) 60%, transparent); }
.raznos-lp-dl-box h1 { margin-top: 24px; font: 800 36px/1.1 var(--raznos-font); letter-spacing: -0.03em; }
.raznos-lp-dl-box > p { margin-top: 10px; color: var(--raznos-ink-2); }
.raznos-lp-dl-list { display: flex; flex-direction: column; gap: 10px; margin-top: 32px; text-align: left; }
.raznos-lp-dl-item { display: grid; grid-template-columns: 44px minmax(0, 1fr) 20px; gap: 14px; align-items: center; min-height: 72px; padding: 12px 16px; border-radius: 18px; background: var(--raznos-surface); text-decoration: none; box-shadow: 0 1px 2px rgba(20, 25, 40, .06); transition: transform .15s var(--raznos-ease), box-shadow .15s; }
.raznos-lp-dl-item:hover { box-shadow: 0 8px 22px -8px rgba(20, 25, 40, .18); }
.raznos-lp-dl-item:active { transform: scale(.98); }
.raznos-lp-dl-item.is-main { background: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-dl-ico { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: var(--raznos-bg); }
.raznos-lp-dl-item.is-main .raznos-lp-dl-ico { background: color-mix(in oklab, var(--raznos-on-dark) 12%, transparent); }
.raznos-lp-dl-ico svg { width: 26px; height: 26px; }
.raznos-lp-dl-item b { display: block; font: 700 16px var(--raznos-font); }
.raznos-lp-dl-item small { display: block; margin-top: 2px; font: 500 13px/1.35 var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-dl-item.is-main small { color: color-mix(in oklab, var(--raznos-on-dark) 70%, transparent); }
.raznos-lp-dl-item > svg { width: 20px; height: 20px; opacity: .5; }
.raznos-lp-dl-stores-t { margin-top: 32px; font: 600 14px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-dl-stores { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.raznos-lp-store { position: relative; display: flex; align-items: center; gap: 10px; height: 56px; padding: 0 14px; border-radius: 12px; background: oklch(0.2 0.01 250); color: #fff; opacity: .45; cursor: not-allowed; text-align: left; }
.raznos-lp-store svg { width: 24px; height: 24px; flex: none; }
.raznos-lp-store span { display: flex; flex-direction: column; font: 700 15px/1.1 var(--raznos-font); white-space: nowrap; }
.raznos-lp-store small { font: 500 10px var(--raznos-font); opacity: .8; }
.raznos-lp-dl-stores em { position: absolute; top: -8px; right: -6px; padding: 2px 8px; border-radius: 999px; background: var(--raznos-amber-tint); color: var(--raznos-ink); font: normal 700 11px var(--raznos-font); }
.raznos-lp-dl-stores > div { position: relative; }
.raznos-lp-dl-back { display: inline-block; margin-top: 32px; font: 550 15px var(--raznos-font); color: var(--raznos-ink-2); text-underline-offset: 4px; }

.raznos-lp-final-proto { margin-top: 12px; }

/* ссылка на страницу подробностей и узкая шапка */
.raznos-lp-more { display: inline-flex; align-items: center; gap: 4px; margin-top: 22px; font: 650 16px var(--raznos-font); color: var(--raznos-green-deep); text-decoration: none; }
.raznos-lp-more:hover { text-decoration: underline; text-underline-offset: 4px; }
.raznos-lp-more svg { width: 16px; height: 16px; color: currentColor; }
@media (max-width: 420px) {
  .raznos-lp-header-in { padding: 8px 10px 8px 14px; }
  .raznos-lp-lang { width: 40px; min-width: 40px; max-width: 40px; padding: 0; color: transparent; background: var(--raznos-surface) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23596270' stroke-width='1.8' stroke-linecap='round'><circle cx='12' cy='12' r='9'/><path d='M3 12h18M12 3c2.5 2.6 3.8 5.6 3.8 9s-1.3 6.4-3.8 9c-2.5-2.6-3.8-5.6-3.8-9S9.5 5.6 12 3z'/></svg>") no-repeat center; }
  .raznos-lp-lang option { color: var(--raznos-ink); }
}
@media (max-width: 899px) { .raznos-lp-row { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 359px) { .raznos-lp-phone { zoom: .9; } }
@media (max-width: 899px) { .raznos-lp-hero-in { grid-template-columns: minmax(0, 1fr); } }

/* Профиль */
.raznos-lp-me { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 20px 16px 18px; border-radius: 22px; background: var(--raznos-dark); color: var(--raznos-on-dark); text-align: center; }
.raznos-lp-me > img { width: 88px; height: 88px; border-radius: 50%; margin-bottom: 10px; }
.raznos-lp-me > b { font: 700 19px var(--raznos-font); }
.raznos-lp-me > span { font: 500 14px var(--raznos-font); opacity: .72; }
.raznos-lp-me > small { margin-top: 10px; font: 500 12.5px var(--raznos-font); opacity: .72; }
.raznos-lp-me-stats { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; margin-top: 12px; }
.raznos-lp-me-stats > span { display: flex; flex-direction: column; gap: 4px; font: 500 13px var(--raznos-font); color: color-mix(in oklab, var(--raznos-on-dark) 72%, transparent); }
.raznos-lp-me-stats > span + span { border-left: 1px solid color-mix(in oklab, var(--raznos-on-dark) 18%, transparent); }
.raznos-lp-me-stats b { font: 700 18px var(--raznos-mono); color: var(--raznos-on-dark); white-space: nowrap; }
.raznos-lp-conn { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--raznos-line-strong); background: var(--raznos-surface); font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-conn i { width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--raznos-green); }
.raznos-lp-conn svg { margin-left: auto; }
.raznos-lp-accs { padding: 0 14px; border-radius: 18px; background: var(--raznos-surface); }
.raznos-lp-accs > div { display: flex; align-items: center; gap: 12px; padding: 12px 0; }
.raznos-lp-accs > div + div { border-top: 1px solid var(--raznos-line); }
.raznos-lp-accs > div > span { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.raznos-lp-accs b { font: 700 15px var(--raznos-font); }
.raznos-lp-accs small { display: flex; align-items: center; gap: 6px; font: 500 12.5px var(--raznos-font); color: var(--raznos-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.raznos-lp-accs small i { padding: 1px 7px; border-radius: 999px; background: var(--raznos-amber-tint); color: var(--raznos-amber); font: normal 650 11.5px var(--raznos-font); }
.raznos-lp-accs em { font: normal 500 12px var(--raznos-font); color: var(--raznos-ink-3); white-space: nowrap; }
.raznos-lp-accs em b { font: 750 20px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-accs-bar { display: block; height: 4px; margin-top: 3px; border-radius: 999px; background: var(--raznos-surface-2); overflow: hidden; }
.raznos-lp-accs-bar i { display: block; height: 100%; background: var(--raznos-green); }

/* зелёная полоса про настоящие данные, как в прежнем лендинге */
.raznos-lp-green { padding: 64px 0; background: var(--raznos-green-tint); text-align: center; }
@media (min-width: 900px) { .raznos-lp-green { padding: 88px 0; } }
.raznos-lp-green-icons { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-bottom: 22px; }
.raznos-lp-green-icons img { width: 40px; height: 40px; border-radius: 12px; }
.raznos-lp-statement { max-width: 900px; margin: 0 auto; font: 700 clamp(23px, 4vw, 30px)/1.4 var(--raznos-font); letter-spacing: -0.01em; text-wrap: balance; }
.raznos-lp-statement b { color: var(--raznos-green-deep); }

/* подключение в три шага */
.raznos-lp-steps { display: grid; gap: 16px; margin-top: 32px; }
@media (min-width: 800px) { .raznos-lp-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.raznos-lp-step-card { display: flex; flex-direction: column; gap: 12px; padding: 20px; border-radius: 18px; background: var(--raznos-surface); }
.raznos-lp-step-card small { font: 500 13px/1.45 var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-step-h { display: flex; align-items: center; gap: 12px; font: 700 17px var(--raznos-font); }
.raznos-lp-step-h span { width: 42px; height: 42px; flex: none; display: grid; place-items: center; border-radius: 12px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); font: 700 19px var(--raznos-mono); }
.raznos-lp-pick { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--raznos-line); font: 600 15px var(--raznos-font); }
.raznos-lp-pick img { width: 28px; height: 28px; border-radius: 8px; }
.raznos-lp-pick em, .raznos-lp-synced { margin-left: auto; padding: 3px 10px; border-radius: 999px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); font: normal 650 12.5px var(--raznos-font); }
.raznos-lp-synced { align-self: flex-start; margin-left: 0; }
.raznos-lp-field { padding: 14px; border-radius: 12px; border: 1px solid var(--raznos-line-strong); font: 500 15px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-svc-h { margin-top: 56px; font: 750 clamp(24px, 4vw, 30px)/1.2 var(--raznos-font); letter-spacing: -0.02em; }

/* блоки прежнего лендинга: сравнение сервисов, отзывы, что происходит, лидерборд */
.raznos-lp-plain { background: var(--raznos-surface-2); }
.raznos-lp-band { background: var(--raznos-surface); }
.raznos-lp-acc { font-style: normal; color: var(--raznos-green-deep); }
.raznos-lp-demo { margin-top: 14px; font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-small { margin-top: 14px; font: 500 15px/1.5 var(--raznos-font); color: var(--raznos-ink-3); max-width: 34em; }
.raznos-lp-sub-h { margin-top: 40px; font: 700 20px var(--raznos-font); }
.raznos-lp-feature { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .raznos-lp-feature { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; } }
.raznos-lp-feature-media { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.raznos-lp-cmp { display: grid; gap: 16px; margin-top: 32px; }
@media (min-width: 800px) { .raznos-lp-cmp { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.raznos-lp-cmp-card { display: flex; flex-direction: column; padding: 18px; border-radius: 18px; background: var(--raznos-surface); box-shadow: 0 6px 22px oklch(0 0 0 / .06); }
.raznos-lp-cmp-head { display: flex; align-items: center; gap: 10px; font: 700 16px var(--raznos-font); }
.raznos-lp-cmp-head img { width: 32px; height: 32px; border-radius: 9px; }
.raznos-lp-cmp-head em { margin-left: auto; padding: 4px 10px; border-radius: 999px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); font: normal 650 13px var(--raznos-font); }
.raznos-lp-cmp-rate { display: flex; flex-direction: column; gap: 4px; margin: 22px 0 14px; }
.raznos-lp-cmp-rate b { font: 700 24px var(--raznos-font); letter-spacing: -0.01em; }
.raznos-lp-cmp-rate small { font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-cmp-row { display: flex; justify-content: space-between; align-items: center; min-height: 44px; border-top: 1px solid var(--raznos-line); font: 500 15px var(--raznos-font); }
.raznos-lp-cmp-row b { font: 600 16px var(--raznos-mono); }
.raznos-lp-reviews { display: grid; gap: 16px; margin-top: 16px; }
@media (min-width: 800px) { .raznos-lp-reviews { grid-template-columns: 1fr 1fr; } }
.raznos-lp-review { display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 18px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); }
.raznos-lp-review-head { display: flex; align-items: center; gap: 10px; }
.raznos-lp-review-head i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; font: normal 750 15px var(--raznos-font); }
.raznos-lp-review-head b { font: 650 16px var(--raznos-font); }
.raznos-lp-review-head span { margin-left: auto; font: 500 14px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-review-meta { display: flex; align-items: center; gap: 8px; font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-review-meta em { padding: 3px 10px; border-radius: 999px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); font: normal 650 13px var(--raznos-font); }
.raznos-lp-review-meta img { width: 24px; height: 24px; margin-left: auto; border-radius: 7px; }
.raznos-lp-stars { display: flex; gap: 2px; }
.raznos-lp-stars i { width: 16px; height: 16px; color: var(--raznos-line-strong); }
.raznos-lp-stars i.is-on { color: var(--raznos-amber); }
.raznos-lp-stars svg { width: 16px; height: 16px; fill: currentColor; }
.raznos-lp-review-text { font: 500 16px/1.5 var(--raznos-font); }
.raznos-lp-review small { font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-review-votes { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-review-votes em { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 10px; border: 1px solid var(--raznos-line); font: normal 600 13px var(--raznos-font); }
.raznos-lp-review-votes span + em { margin-left: 4px; }
.raznos-lp-review-votes em + span { margin-left: 10px; }
.raznos-lp-thumb { width: 14px; height: 14px; }
.raznos-lp-teaser { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 24px; padding: 16px 18px; border-radius: 18px; background: var(--raznos-green-tint); text-decoration: none; }
.raznos-lp-teaser > span { display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-teaser b { font: 700 16px var(--raznos-font); }
.raznos-lp-teaser small { font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-live { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font: 650 13px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-live i, .raznos-lp-cmap-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--raznos-green); }
@media (prefers-reduced-motion: no-preference) { .raznos-lp-live i, .raznos-lp-cmap-chip i { animation: raznos-lp-blink 1.5s ease-in-out infinite; } }
@keyframes raznos-lp-blink { 0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(41, 140, 74, .45); } 50% { opacity: .55; box-shadow: 0 0 0 6px rgba(41, 140, 74, 0); } }
.raznos-lp-cmap-card { overflow: hidden; border-radius: 18px; background: var(--raznos-surface); box-shadow: 0 6px 22px oklch(0 0 0 / .06); }
.raznos-lp-cmap { position: relative; aspect-ratio: 512 / 300; overflow: hidden; }
.raznos-lp-cmap svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.raznos-lp-cmap-chip { position: absolute; left: 12px; top: 12px; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--raznos-surface); box-shadow: 0 2px 8px rgba(20, 25, 40, .16); font: 700 14px var(--raznos-font); }
.raznos-lp-cmap-note { padding: 12px 16px 14px; font: 500 13px/1.45 var(--raznos-font); color: var(--raznos-ink-2); }
.lm-land { fill: oklch(0.955 0.008 95); }
.lm-block { fill: oklch(0.93 0.01 95); }
.lm-park { fill: oklch(0.9 0.06 145); }
.lm-street { fill: none; stroke: oklch(0.99 0.005 95); stroke-width: 1.6; }
.lm-ttk { fill: none; stroke: oklch(0.93 0.07 85); stroke-width: 5; }
.lm-road { fill: none; stroke: oklch(0.99 0.005 95); stroke-width: 4; stroke-linecap: round; }
.lm-river { fill: none; stroke: oklch(0.86 0.05 235); stroke-width: 16; stroke-linecap: round; }
.lm-ring { fill: none; stroke: oklch(0.99 0.005 95); stroke-width: 6; }
.lm-label { font: 700 8px var(--raznos-font); letter-spacing: .08em; fill: oklch(0.55 0.015 250); text-anchor: middle; }
.lm-dot { stroke: #fff; stroke-width: 2.2; transform-box: fill-box; transform-origin: center; }
.lm-pin path { stroke: #fff; stroke-width: 1.5; }
.lm-pin circle { fill: #fff; }
@media (prefers-reduced-motion: no-preference) {
  .raznos-lp-js .lm-dot { opacity: 0; transform: scale(.3); transition: opacity .4s ease, transform .5s var(--raznos-ease); transition-delay: calc(var(--i) * 30ms); }
  .raznos-lp-js .is-seen .lm-dot { opacity: 1; transform: none; }
}
.raznos-lp-feed { padding: 14px 16px; border-radius: 18px; border: 1px solid var(--raznos-line-strong); background: var(--raznos-surface); }
.raznos-lp-feed-head { display: flex; justify-content: space-between; padding-bottom: 10px; border-bottom: 1px solid var(--raznos-line); font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-feed-head b { font: 650 16px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-feed-item { display: flex; flex-direction: column; gap: 6px; padding: 12px 0; border-bottom: 1px solid var(--raznos-line); }
.raznos-lp-feed-meta { display: flex; align-items: center; gap: 8px; font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-feed-meta img { width: 28px; height: 28px; border-radius: 8px; }
.raznos-lp-feed-text { font: 500 15px/1.45 var(--raznos-font); }
.raznos-lp-feed-votes { display: flex; align-items: center; gap: 4px; font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-feed-more { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-feed-btns { display: flex; gap: 10px; }
.raznos-lp-feed-btns span { display: inline-flex; align-items: center; height: 44px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--raznos-line-strong); font: 600 14px var(--raznos-font); }
.raznos-lp-feed-btns .is-dark { background: var(--raznos-dark); border-color: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-lead { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 20px; background: var(--raznos-surface); box-shadow: 0 6px 22px oklch(0 0 0 / .06); }
.raznos-lp-lead-head { display: flex; justify-content: space-between; align-items: baseline; font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-lead-head b { font: 650 16px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-lead-me { position: relative; overflow: hidden; display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-radius: 14px; background: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-lead-me > span { display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-lead-me > span:last-child { align-items: flex-end; }
.raznos-lp-lead-me b { font: 750 19px var(--raznos-font); }
.raznos-lp-lead-me > span:last-child b { font: 600 20px var(--raznos-mono); }
.raznos-lp-lead-me small { display: flex; align-items: center; gap: 4px; font: 500 13px var(--raznos-font); opacity: .8; }
.raznos-lp-lead-me small svg { width: 12px; height: 12px; }
@media (prefers-reduced-motion: no-preference) {
  .raznos-lp-lead-me::before { content: ''; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 32%, color-mix(in oklab, var(--raznos-gold) 45%, transparent) 50%, transparent 68%); transform: translateX(-100%); }
  .is-seen .raznos-lp-lead-me::before { animation: raznos-lp-sweep 5s cubic-bezier(.45, 0, .25, 1) .6s infinite; }
}
.raznos-lp-lead-near { font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-lead-row { display: grid; grid-template-columns: 24px 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 14px; border-radius: 14px; border: 1px solid var(--raznos-line-strong); }
.raznos-lp-lead-row > span:first-child { font: 600 14px var(--raznos-mono); color: var(--raznos-ink-2); }
.raznos-lp-lead-row i { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; font: normal 750 15px var(--raznos-font); }
.raznos-lp-lead-row > span:nth-child(3) { display: flex; flex-direction: column; }
.raznos-lp-lead-row > span:nth-child(3) b { font: 650 15px var(--raznos-font); }
.raznos-lp-lead-row small { font: 500 12.5px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-lead-row > b { font: 600 15px var(--raznos-mono); white-space: nowrap; }
.raznos-lp-lead-row.is-me { border-color: transparent; background: var(--raznos-green-tint); }
.raznos-lp-lead-gap { font: 650 14px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-lead-foot { font: 500 14px/1.45 var(--raznos-font); color: var(--raznos-ink-2); }

/* нижнее меню в макетах: подписи не прилипают к краям активной плашки */
.raznos-lp-tabs { gap: 2px; padding: 6px 6px 16px; }
.raznos-lp-tab { gap: 3px; padding: 6px 2px 5px; font-size: 10.5px; letter-spacing: -0.01em; white-space: nowrap; }

/* шаги истории у левого края, как заголовок */
.raznos-lp-story.is-sticky .raznos-lp-row { align-items: stretch; min-height: 80vh; }

/* телефон: ровная рамка и вырез камеры */
.raznos-lp-phone { position: relative; padding: 11px; border-radius: 50px; background: oklch(0.2 0.01 250); box-shadow: 0 0 0 1px oklch(0.32 0.01 250), 0 40px 80px -30px rgba(20, 25, 40, .45); }
.raznos-lp-phone::after { content: ''; position: absolute; top: 20px; left: 50%; width: 84px; height: 24px; margin-left: -42px; border-radius: 999px; background: oklch(0.12 0.01 250); }
.raznos-lp-screen { border-radius: 47px; }
.raznos-lp-stage-phone { height: 655px; }
.raznos-lp-stage-phone .raznos-lp-screen { top: 13px; left: 13px; }

/* разбивка по часам на экране Когда выгоднее */
.raznos-lp-hours-card { display: flex; flex-direction: column; gap: 8px; }
.raznos-lp-hours-t { display: flex; justify-content: space-between; align-items: baseline; font: 500 12px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-hours-t b { font: 700 15px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-hours { display: grid; grid-template-columns: repeat(12, 1fr); gap: 3px; }
.raznos-lp-hours i { height: 28px; border-radius: 6px; background: oklch(0.58 0.15 150 / var(--o)); }
.raznos-lp-hours-l { display: flex; justify-content: space-between; font: 600 11px var(--raznos-mono); color: var(--raznos-ink-3); }

/* первый шаг сразу под заголовком истории, экраны сменяются без размытия и наложения */
.raznos-lp-story.is-sticky #today { justify-content: flex-start; padding-top: 56px; min-height: 72vh; }
.raznos-lp-story.is-sticky .raznos-lp-story-head { padding-top: 24px; }
.raznos-lp-stage-phone .raznos-lp-screen { filter: none; transform: translateY(10px); transition: opacity .18s ease, transform .4s var(--raznos-ease); }
.raznos-lp-stage-phone .raznos-lp-screen.is-on { transition: opacity .32s ease .12s, transform .45s var(--raznos-ease) .12s; }
.raznos-lp-review-svc { display: flex; align-items: center; gap: 8px; margin: -4px 0 4px; padding-bottom: 12px; border-bottom: 1px solid var(--raznos-line); font: 650 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-review-svc img { width: 24px; height: 24px; border-radius: 7px; }

/* Что происходит: настоящая карта курьеров и карточки ленты из приложения */
.raznos-lp-cmap { aspect-ratio: 920 / 740; }
.raznos-lp-cmap img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.raznos-lp-posts { display: flex; flex-direction: column; gap: 10px; }
.raznos-lp-posts-h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 4px 2px; font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-posts-h b { font: 700 17px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-post { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; border-radius: 18px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); box-shadow: inset 4px 0 0 var(--svc); }
.raznos-lp-post-meta { display: flex; align-items: center; gap: 6px; font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-post-meta img { width: 28px; height: 28px; border-radius: 8px; }
.raznos-lp-post-meta span { margin-left: 4px; }
.raznos-lp-post-who { display: flex; justify-content: space-between; font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-post-who u { text-underline-offset: 3px; text-decoration-color: var(--raznos-line-strong); }
.raznos-lp-post-text { font: 500 16px/1.45 var(--raznos-font); }
.raznos-lp-post-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.raznos-lp-post-acts em { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--raznos-line-strong); font: normal 650 14px var(--raznos-font); }
.raznos-lp-post-acts em svg { width: 16px; height: 16px; }
.raznos-lp-post-acts em.is-on { background: var(--raznos-green-tint); border-color: color-mix(in oklab, var(--raznos-green) 40%, var(--raznos-line)); color: var(--raznos-green-deep); }
.raznos-lp-post-acts b { font: 650 14px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-post-acts u { margin-left: auto; font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); text-underline-offset: 3px; }

/* Лидерборд: карточка Топ курьеров из приложения */
.raznos-lp-top-me { display: flex; flex-direction: column; gap: 14px; padding: 20px; border-radius: 22px; background: var(--raznos-dark); color: var(--raznos-on-dark); box-shadow: 0 30px 60px -30px rgba(20, 25, 40, .5); }
.raznos-lp-top-me-h { display: flex; align-items: center; gap: 14px; }
.raznos-lp-top-me-h img { width: 48px; height: 48px; border-radius: 50%; }
.raznos-lp-top-me-h span { display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-top-me-h b { font: 700 22px var(--raznos-mono); }
.raznos-lp-top-me-h small { font: 500 14px var(--raznos-font); opacity: .75; }
.raznos-lp-top-me-sum { display: flex; align-items: baseline; gap: 10px; font: 500 14px var(--raznos-font); color: color-mix(in oklab, var(--raznos-on-dark) 75%, transparent); }
.raznos-lp-top-me-sum b { font: 700 30px var(--raznos-mono); color: var(--raznos-on-dark); font-variant-numeric: tabular-nums; }
.raznos-lp-top-me-bar { display: block; height: 6px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-on-dark) 22%, transparent); overflow: hidden; }
.raznos-lp-top-me-bar i { display: block; width: 52%; height: 100%; border-radius: inherit; background: var(--raznos-green); transform-origin: left; }
.raznos-lp-top-t { margin-top: 10px; font: 700 18px var(--raznos-font); }
.raznos-lp-top-list { display: flex; flex-direction: column; padding: 6px 14px; border-radius: 18px; background: var(--raznos-surface); box-shadow: 0 6px 22px oklch(0 0 0 / .06); }
.raznos-lp-top-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 14px; align-items: center; min-height: 54px; padding: 6px 4px; }
.raznos-lp-top-row + .raznos-lp-top-row { border-top: 1px solid var(--raznos-line); }
.raznos-lp-top-hex { width: 32px; height: 36px; display: grid; place-items: center; clip-path: var(--raznos-hex); font: normal 700 15px var(--raznos-font); }
.is-gold .raznos-lp-top-hex { background: oklch(0.86 0.13 90); color: oklch(0.35 0.08 80); }
.is-silver .raznos-lp-top-hex { background: oklch(0.88 0.01 250); color: var(--raznos-ink-2); }
.is-bronze .raznos-lp-top-hex { background: oklch(0.8 0.08 55); color: oklch(0.38 0.08 50); }
.raznos-lp-top-n { font: normal 650 15px var(--raznos-font); color: var(--raznos-ink-2); text-align: center; }
.raznos-lp-top-mid { display: flex; flex-direction: column; gap: 4px; }
.raznos-lp-top-you { font: 700 15px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-top-bar { display: block; height: 6px; border-radius: 999px; background: color-mix(in oklab, var(--raznos-ink) 8%, transparent); overflow: hidden; }
.raznos-lp-top-bar i { display: block; height: 100%; border-radius: inherit; background: var(--raznos-line-strong); transform-origin: left; }
.is-gold .raznos-lp-top-bar i { background: oklch(0.78 0.14 85); }
.is-silver .raznos-lp-top-bar i { background: oklch(0.72 0.03 240); }
.is-bronze .raznos-lp-top-bar i { background: oklch(0.68 0.1 55); }
.is-me .raznos-lp-top-bar i { background: var(--raznos-green); }
.raznos-lp-top-v { font: 600 16px var(--raznos-mono); white-space: nowrap; }
.raznos-lp-top-row.is-me { margin: 2px -8px; padding: 6px 12px; border-radius: 14px; border-top-color: transparent; background: var(--raznos-green-tint); }
.raznos-lp-top-row.is-me + .raznos-lp-top-row { border-top-color: transparent; }
.raznos-lp-top-more { display: flex; align-items: center; gap: 12px; min-height: 40px; font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-top-more::before, .raznos-lp-top-more::after { content: ''; flex: 1; border-top: 1px dashed var(--raznos-line-strong); }
.raznos-lp-top-more + .raznos-lp-top-row { border-top: 0; }
.raznos-lp-sheet-money { padding: 12px 0; font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-sheet-money b { font-weight: 700; color: var(--raznos-ink); white-space: nowrap; }
.raznos-lp-sheet-money b.is-minus { color: var(--raznos-red); }
.raznos-lp-faq details p a { color: var(--raznos-green-deep); text-decoration: underline; text-underline-offset: 3px; }

/* липкий телефон истории: правило рамки выше задаёт relative, здесь возвращаем sticky */
.raznos-lp-phone.raznos-lp-stage-phone { position: sticky; }
/* скрытые экраны не тратят кадры на анимации */
.raznos-lp-stage-phone .raznos-lp-screen:not(.is-on), .raznos-lp-stage-phone .raznos-lp-screen:not(.is-on) *, .raznos-lp-stage-phone .raznos-lp-screen:not(.is-on) *::before, .raznos-lp-stage-phone .raznos-lp-screen:not(.is-on) *::after { animation-play-state: paused; }

/* секции ниже первого экрана браузер раскладывает и рисует, только когда до них долистали */
main > section:not(.raznos-lp-hero) { content-visibility: auto; contain-intrinsic-size: auto 900px; }
/* у шагов истории без content-visibility: оно обрезает тень телефона ровной линией по низу блока */

/* страницы подробностей по экранам */
.raznos-lp-detail-hero { padding-top: 120px; }
@media (min-width: 900px) { .raznos-lp-detail-hero { padding-top: 140px; } .raznos-lp-detail-hero .raznos-lp-row { grid-template-columns: minmax(0, 1fr) 340px; gap: 80px; } }
.raznos-lp-detail-hero .raznos-lp-row { content-visibility: visible; }
.raznos-lp-crumb { display: inline-flex; align-items: center; gap: 4px; margin-bottom: 20px; font: 600 15px var(--raznos-font); color: var(--raznos-ink-2); text-decoration: none; }
.raznos-lp-crumb:hover { color: var(--raznos-ink); }
.raznos-lp-crumb svg { width: 16px; height: 16px; color: currentColor; }
.raznos-lp-facts { display: flex; flex-direction: column; padding: 4px 20px; border-radius: 18px; background: var(--raznos-surface); box-shadow: 0 6px 22px oklch(0 0 0 / .06); }
.raznos-lp-band .raznos-lp-facts { background: var(--raznos-bg); box-shadow: none; }
.raznos-lp-facts p { display: flex; flex-direction: column; gap: 2px; padding: 14px 0; }
.raznos-lp-facts p + p { border-top: 1px solid var(--raznos-line); }
.raznos-lp-facts b { font: 700 16px var(--raznos-font); }
.raznos-lp-facts span { font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-detail-map { position: relative; overflow: hidden; border-radius: 18px; aspect-ratio: 1000 / 860; }
.raznos-lp-detail-map img { width: 100%; height: 100%; object-fit: cover; }
.raznos-lp-detail-hours { display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 18px; background: var(--raznos-bg); }
.raznos-lp-detail-hours p:first-child { display: flex; justify-content: space-between; font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-detail-hours p:first-child b { font: 700 16px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-detail-hours .raznos-lp-hours i { height: 40px; }
.raznos-lp-detail-hours small { font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-feature-media .raznos-lp-sheet { max-width: 440px; box-shadow: 0 20px 50px -20px rgba(20, 25, 40, .3); }
.raznos-lp-feature-media .raznos-lp-cmp { margin-top: 0; grid-template-columns: minmax(0, 1fr); }
.raznos-lp-feature-media .raznos-lp-reviews { margin-top: 0; grid-template-columns: minmax(0, 1fr); }
.raznos-lp-feature-media .raznos-lp-steps { margin-top: 0; grid-template-columns: minmax(0, 1fr); }
.raznos-lp-pager { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }
.raznos-lp-pager a { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 16px 20px; border-radius: 18px; background: var(--raznos-surface); text-decoration: none; box-shadow: 0 6px 22px oklch(0 0 0 / .06); }
.raznos-lp-pager a:hover { box-shadow: 0 10px 28px oklch(0 0 0 / .1); }
.raznos-lp-pager span { display: inline-flex; align-items: center; gap: 4px; font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-pager span svg { width: 14px; height: 14px; }
.raznos-lp-pager b { font: 700 19px var(--raznos-font); }
.raznos-lp-pager .is-next { margin-left: auto; align-items: flex-end; text-align: right; }
[hidden] { display: none !important; }
/* нижнее меню плотнее: подпись прижата к иконке, как в приложении */
.raznos-lp-tabs { padding: 5px 6px 14px; }
.raznos-lp-tab { gap: 1px; padding: 5px 2px 4px; line-height: 1.15; }

/* телефон по пропорциям iPhone 15 Pro: экран 393x852 pt в масштабе 360 px, остров 126x37 pt на 11 pt от верха, скругление экрана 55 pt */
.raznos-lp-phone { padding: 10px; border-radius: 52px; }
.raznos-lp-phone::after { content: none; }
.raznos-lp-screen { height: 780px; border-radius: 50px; }
.raznos-lp-screen::before { content: ''; position: absolute; z-index: 5; top: 10px; left: 50%; width: 115px; height: 34px; margin-left: -57.5px; border-radius: 17px; background: #000; }
.raznos-lp-status { height: 49px; padding: 4px 30px 0 34px; font: 650 15px var(--raznos-font); }
.raznos-lp-status svg { width: 50px; height: 13px; }
.raznos-lp-stage-phone { height: 670px; top: max(96px, calc(50vh - 335px)); }
.raznos-lp-stage-phone .raznos-lp-screen { top: 12px; left: 12px; }

/* сообщество: два ряда текст и карточки */
.raznos-lp-community { margin-top: 48px; align-items: start; }
.raznos-lp-community + .raznos-lp-community { margin-top: 72px; }
/* ещё в приложении: ссылки на План и Профиль */
.raznos-lp-more-cards { display: grid; gap: 12px; margin-top: 16px; }
@media (min-width: 800px) { .raznos-lp-more-cards { grid-template-columns: 1fr 1fr; } }
.raznos-lp-more-cards a { display: grid; grid-template-columns: minmax(0, 1fr) 20px; gap: 4px 12px; align-items: center; padding: 18px 20px; border-radius: 18px; background: var(--raznos-surface); text-decoration: none; }
.raznos-lp-more-cards a:hover { box-shadow: 0 8px 22px -8px rgba(20, 25, 40, .18); }
.raznos-lp-more-cards b { font: 700 17px var(--raznos-font); }
.raznos-lp-more-cards span { grid-column: 1; font: 500 14px/1.45 var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-more-cards svg { grid-column: 2; grid-row: 1 / span 2; width: 20px; height: 20px; color: var(--raznos-ink-3); }
.raznos-lp-demo a { color: var(--raznos-green-deep); text-underline-offset: 3px; }
/* ссылки удобно нажимать пальцем */
.raznos-lp-more, .raznos-lp-crumb, .raznos-lp-final-bot, .raznos-lp-dl-back { min-height: 44px; display: inline-flex; align-items: center; }
/* длинные абзацы не шире удобной строки */
.raznos-lp-faq details p, .raznos-lp-demo, .raznos-lp-svc-note { max-width: 46em; }
.raznos-lp-map-osm { font-size: 10px; }
/* язык: пока переводов нет, честно говорим об этом */
.raznos-lp-lang-note { position: fixed; z-index: 40; left: 50%; bottom: 20px; transform: translateX(-50%); max-width: calc(100% - 32px); padding: 12px 18px; border-radius: 14px; background: var(--raznos-dark); color: var(--raznos-on-dark); font: 600 14px var(--raznos-font); box-shadow: 0 10px 30px rgba(0, 0, 0, .25); }

/* карточка места на карте: отзывы курьеров о магазинах и дарксторах */
.raznos-lp-cmap { aspect-ratio: 1020 / 900; }
.raznos-lp-spot { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 12px; margin: -72px 16px 0; padding: 18px; border-radius: 20px; background: var(--raznos-surface); box-shadow: 0 14px 34px -10px rgba(20, 25, 40, .28); }
.raznos-lp-spot-head { display: flex; align-items: center; gap: 12px; }
.raznos-lp-spot-head > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-spot-head b { font: 700 17px var(--raznos-font); }
.raznos-lp-spot-head small { font: 500 14px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-spot-ico { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 12px; background: oklch(0.38 0.03 250); color: #fff; }
.raznos-lp-spot-ico svg { width: 22px; height: 22px; }
.raznos-lp-spot-rate { display: flex; align-items: center; gap: 6px; font: 500 15px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-spot-rate b { font: 700 17px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-spot-rate .raznos-lp-star { width: 16px; height: 16px; }
.raznos-lp-spot-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.raznos-lp-spot-tags em { padding: 6px 10px; border-radius: 10px; background: var(--raznos-surface-2); font: normal 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-spot-tags b { margin-left: 4px; font-weight: 700; color: var(--raznos-ink); }
.raznos-lp-spot-route { display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; border-radius: 14px; border: 1px solid var(--raznos-line-strong); font: 600 15px var(--raznos-font); }
.raznos-lp-spot-route svg { width: 18px; height: 18px; }

/* полоса сервисов под карточкой Начислено сегодня, как в приложении */
.raznos-lp-split { display: flex; flex-direction: column; gap: 8px; padding: 2px 2px 0; }
.raznos-lp-split-bar { display: flex; gap: 4px; height: 8px; }
.raznos-lp-split-bar i { height: 100%; border-radius: 999px; transform-origin: left; }
.raznos-lp-split-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font: 500 13.5px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-split-legend span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.raznos-lp-split-legend i { width: 8px; height: 8px; border-radius: 50%; }
.raznos-lp-split-legend b { color: var(--raznos-ink); font-weight: 700; }
.raznos-lp-today-money span { white-space: nowrap; }

/* страница Новичкам */
.raznos-lp-nb-tabs { display: grid; gap: 10px; margin-top: 28px; }
@media (min-width: 800px) { .raznos-lp-nb-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.raznos-lp-nb-tabs a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 64px; padding: 14px 16px; border-radius: 16px; background: var(--raznos-surface); text-decoration: none; box-shadow: 0 6px 22px oklch(0 0 0 / .06); }
.raznos-lp-nb-tabs span { display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-nb-tabs b { font: 700 16px var(--raznos-font); }
.raznos-lp-nb-tabs small { font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-nb-tabs svg { width: 18px; height: 18px; color: var(--raznos-ink-3); }
.raznos-lp-nb-src { padding: 3px 10px; border-radius: 999px; font: normal 650 12.5px var(--raznos-font); white-space: nowrap; }
.raznos-lp-nb-src { display: inline-block; margin-left: 4px; background: var(--raznos-surface-2); color: var(--raznos-ink-3); }
.raznos-lp-nb-svc { display: flex; align-items: center; gap: 10px; margin-top: 24px; font: 700 17px var(--raznos-font); }
.raznos-lp-nb-svc img { width: 32px; height: 32px; border-radius: 9px; }
.raznos-lp-teaser { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 24px; padding: 16px 18px; border-radius: 18px; background: var(--raznos-green-tint); text-decoration: none; }
.raznos-lp-teaser > span { display: flex; flex-direction: column; gap: 2px; }
.raznos-lp-teaser b { font: 700 16px var(--raznos-font); }
.raznos-lp-teaser small { font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-teaser svg { width: 18px; height: 18px; flex: none; color: var(--raznos-ink-3); }

/* липкий телефон: статус-бар и меню общие, между ними перетекает содержимое экранов */
.raznos-lp-stage-phone .raznos-lp-screen { transform: none; filter: none; transition: opacity .38s ease; }
.raznos-lp-stage-phone .raznos-lp-screen.is-on { transition: opacity .38s ease; }
.raznos-lp-stage-phone .raznos-lp-screen:not(.raznos-lp-chrome) > .raznos-lp-status,
.raznos-lp-stage-phone .raznos-lp-screen:not(.raznos-lp-chrome) > .raznos-lp-tabs { visibility: hidden; }
.raznos-lp-stage-phone .raznos-lp-screen:not(.raznos-lp-chrome)::before { display: none; }
.raznos-lp-stage-phone .raznos-lp-chrome { z-index: 3; opacity: 1; justify-content: space-between; background: transparent; pointer-events: none; }
.raznos-lp-chrome .raznos-lp-status { background: transparent; }
.raznos-lp-chrome .raznos-lp-tabs { position: relative; pointer-events: auto; }
.raznos-lp-chrome .raznos-lp-tab { z-index: 1; border: 0; background: transparent; cursor: pointer; font-family: var(--raznos-font); transition: color .3s ease; }
.raznos-lp-chrome .raznos-lp-tab.is-on { background: transparent; color: #fff; }
.raznos-lp-chrome .raznos-lp-tab:focus-visible { outline: 3px solid var(--raznos-brand); outline-offset: -3px; }
.raznos-lp-tab-ind { position: absolute; left: 6px; top: 5px; bottom: 14px; width: calc((100% - 12px - 8px) / 5); border-radius: 12px; background: var(--raznos-green); transform: translateX(calc(var(--raznos-lp-tab) * (100% + 2px))); transition: transform .42s cubic-bezier(.2, .8, .2, 1); }
.raznos-lp-chrome .raznos-lp-tab:nth-child(2)::after { display: block; }
.raznos-lp-chrome .raznos-lp-tab.is-on:nth-child(2)::after { display: none; }
@media (prefers-reduced-motion: reduce) { .raznos-lp-tab-ind, .raznos-lp-stage-phone .raznos-lp-screen { transition: none; } }

/* шапка полупрозрачная с размытием, как на проде */
.raznos-lp-header-in { background: color-mix(in oklch, var(--raznos-surface) 88%, transparent); -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px); }
.raznos-lp-faq details p { max-width: none; }

/* вкладка Рынок в истории: Когда выгоднее, Где выгоднее и Сравнение сервисов на одном экране */
.raznos-lp-mk { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border-radius: 18px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); }
.raznos-lp-mk > small { margin-top: -4px; font: 500 12px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-mk-h { display: flex; align-items: center; gap: 8px; }
.raznos-lp-mk-h > svg { width: 18px; height: 18px; }
.raznos-lp-mk-h b { font: 700 16px var(--raznos-font); }
.raznos-lp-mk-seg { margin-left: auto; display: flex; padding: 2px; border-radius: 10px; background: color-mix(in oklab, var(--raznos-ink) 5%, transparent); }
.raznos-lp-mk-seg i { padding: 3px 9px; border-radius: 8px; font: normal 600 12px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-mk-seg i.is-on { background: var(--raznos-surface); color: var(--raznos-ink); box-shadow: 0 1px 3px rgba(20, 25, 40, .12); }
.raznos-lp-mk-bars { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; align-items: end; height: 84px; margin-top: 4px; padding-top: 18px; border-bottom: 1px solid var(--raznos-line); }
.raznos-lp-mk-bars span { position: relative; height: 100%; display: flex; align-items: flex-end; }
.raznos-lp-mk-bars i { display: block; width: 100%; height: var(--h); border-radius: 5px 5px 0 0; background: color-mix(in oklab, var(--raznos-ink) 12%, var(--raznos-surface)); transform-origin: bottom; }
.raznos-lp-mk-bars .is-best i { background: var(--raznos-green-deep); }
.raznos-lp-mk-bars .is-best::before { content: '530'; position: absolute; left: 50%; bottom: calc(var(--h) + 3px); transform: translateX(-50%); padding: 1px 5px; border-radius: 999px; background: var(--raznos-dark); color: #fff; font: 700 9.5px var(--raznos-mono); }
.raznos-lp-mk-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; text-align: center; font: 600 11.5px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-mk-days .is-best { color: var(--raznos-ink); }
.raznos-lp-mk-sum { display: flex; align-items: baseline; gap: 4px; font: 500 13px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-mk-sum b { color: var(--raznos-ink); }
.raznos-lp-mk-sum em { margin-left: auto; font: normal 650 13px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-mk-row { display: grid; grid-template-columns: 14px minmax(0, 1fr) 56px auto; gap: 8px; align-items: center; min-height: 34px; }
.raznos-lp-mk-row > span { font: 700 14px var(--raznos-font); }
.raznos-lp-mk-row > b { display: flex; align-items: center; gap: 8px; min-width: 0; font: 600 14.5px var(--raznos-font); white-space: nowrap; }
.raznos-lp-mk-row img { width: 26px; height: 26px; border-radius: 7px; }
.raznos-lp-mk-row em { font: normal 700 14px var(--raznos-font); text-align: right; font-variant-numeric: tabular-nums; }
.raznos-lp-mk-row.is-top .raznos-lp-rank-track i { background: var(--raznos-green); }
.raznos-lp-ok { width: 16px; height: 16px; color: var(--raznos-green); }
.raznos-lp-mk-sum { display: block; } .raznos-lp-mk-sum em { float: right; margin-left: 8px; }

/* экран iPhone 17 Pro: 402x874 pt, остров 126x37 на 11 pt от верха; телефон на странице того же размера, внутри больше места */
.raznos-lp-screen { width: 402px; height: 874px; zoom: .7463; border-radius: 74px; }
.raznos-lp-screen::before { top: 11px; width: 126px; height: 37px; margin-left: -63px; border-radius: 18.5px; }
.raznos-lp-status { height: 54px; padding: 4px 34px 0 40px; }
.raznos-lp-stage-phone { height: 672px; top: max(96px, calc(50vh - 336px)); }
.raznos-lp-stage-phone .raznos-lp-screen { top: 13.4px; left: 13.4px; }
@media (max-width: 359px) { .raznos-lp-phone { zoom: .9; } }

/* перекрёстная смена: новый экран проявляется поверх старого, старый уходит только после этого, фон не просвечивает */
.raznos-lp-stage-phone .raznos-lp-screen:not(.raznos-lp-chrome) { z-index: 1; opacity: 0; transition: opacity 0s linear .4s; }
.raznos-lp-stage-phone .raznos-lp-screen.is-on:not(.raznos-lp-chrome) { z-index: 2; opacity: 1; transition: opacity .36s ease; }

/* страницы подробностей: шаги с настоящими экранами, словарик цифр, источники */
.raznos-lp-detail-tab { margin-bottom: 10px; font: 650 14px var(--raznos-font); color: var(--raznos-green-deep); }
.raznos-lp-howto { display: flex; flex-direction: column; gap: 56px; margin-top: 40px; }
.raznos-lp-howto-step { display: grid; gap: 28px; align-items: center; }
@media (min-width: 900px) {
  .raznos-lp-howto { gap: 88px; }
  .raznos-lp-howto-step { grid-template-columns: minmax(0, 1fr) 320px; gap: 80px; }
  .raznos-lp-howto-step:nth-child(even) { grid-template-columns: 320px minmax(0, 1fr); }
  .raznos-lp-howto-step:nth-child(even) > figure { order: -1; }
}
.raznos-lp-howto-n { display: inline-grid; place-items: center; width: 40px; height: 40px; margin-bottom: 14px; border-radius: 12px; background: var(--raznos-green-tint); color: var(--raznos-green-deep); font: 700 18px var(--raznos-mono); }
.raznos-lp-howto .raznos-lp-row-d { max-width: 34em; }
.raznos-lp-shot { margin: 0; }
.raznos-lp-shot .raznos-lp-screen img { display: block; width: 100%; height: calc(100% - 54px); object-fit: cover; object-position: top; }
.raznos-lp-detail-facts { display: grid; gap: 48px; }
@media (min-width: 900px) { .raznos-lp-detail-facts { grid-template-columns: 1.2fr 1fr; gap: 80px; } }
.raznos-lp-gloss { margin: 24px 0 0; }
.raznos-lp-gloss > div { padding: 16px 0; border-top: 1px solid var(--raznos-line); }
.raznos-lp-gloss dt { font: 700 17px var(--raznos-font); }
.raznos-lp-gloss dd { margin: 6px 0 0; font: 500 16px/1.5 var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-detail-facts .raznos-lp-ul { margin-top: 24px; }

/* рамка как у iPhone 17 Pro: около 2% ширины, без светлой обводки */
.raznos-lp-phone { padding: 6px; border-radius: 50px; box-shadow: 0 0 0 1px oklch(0.4 0.01 250), 0 40px 80px -30px rgba(20, 25, 40, .45); }
.raznos-lp-screen { border-radius: 59px; }
.raznos-lp-stage-phone { height: 664px; top: max(96px, calc(50vh - 332px)); }
.raznos-lp-stage-phone .raznos-lp-screen { top: 8px; left: 8px; }

/* справка по вкладкам: оглавление слева, колонка текста для чтения, снимки экранов внутри текста */
.raznos-lp-doc { padding: 112px 0 64px; background: var(--raznos-surface); }
.raznos-lp-doc-tabs { display: flex; gap: 6px; margin: 16px 0 32px; padding: 4px; border-radius: 14px; background: var(--raznos-bg); overflow-x: auto; scrollbar-width: none; }
.raznos-lp-doc-tabs a { flex: 1 0 auto; padding: 10px 14px; border-radius: 10px; text-align: center; font: 600 15px var(--raznos-font); color: var(--raznos-ink-2); text-decoration: none; white-space: nowrap; }
.raznos-lp-doc-tabs a[aria-current="page"] { background: var(--raznos-green); color: #fff; }
.raznos-lp-doc-grid { display: grid; gap: 40px; }
@media (min-width: 1000px) { .raznos-lp-doc-grid { grid-template-columns: 220px minmax(0, 1fr); gap: 64px; } }
.raznos-lp-doc-toc { display: none; }
@media (min-width: 1000px) {
  .raznos-lp-doc-toc { position: sticky; top: 100px; align-self: start; display: flex; flex-direction: column; gap: 2px; max-height: calc(100vh - 120px); overflow: auto; }
  .raznos-lp-doc-toc p { margin-bottom: 8px; font: 700 13px var(--raznos-font); color: var(--raznos-ink-3); text-transform: uppercase; letter-spacing: .06em; }
  .raznos-lp-doc-toc a { padding: 7px 10px; border-radius: 8px; font: 500 14px/1.35 var(--raznos-font); color: var(--raznos-ink-2); text-decoration: none; }
  .raznos-lp-doc-toc a:hover { background: var(--raznos-bg); color: var(--raznos-ink); }
}
.raznos-lp-doc-body { max-width: 760px; font: 400 17px/1.65 var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-doc-body h1 { font: 800 clamp(30px, 5vw, 42px)/1.12 var(--raznos-font); letter-spacing: -0.025em; text-wrap: balance; }
.raznos-lp-doc-lead { margin-top: 18px; font-size: 18px; color: var(--raznos-ink-2); }
.raznos-lp-doc-sec { padding-top: 48px; scroll-margin-top: 96px; }
.raznos-lp-doc-sec h2 { margin-bottom: 14px; padding-top: 28px; border-top: 1px solid var(--raznos-line); font: 750 26px/1.2 var(--raznos-font); letter-spacing: -0.015em; }
.raznos-lp-doc-sec p { margin-top: 14px; }
.raznos-lp-doc-sec p:first-of-type { margin-top: 0; }
.raznos-lp-doc-sec b { font-weight: 700; }
.raznos-lp-doc-sec .raznos-lp-ul { margin-top: 14px; }
.raznos-lp-doc-sec .raznos-lp-ul li { font-size: 17px; line-height: 1.55; }
.raznos-lp-doc-fig { float: right; width: 236px; margin: 4px 0 20px 32px; }
.raznos-lp-doc-fig .raznos-lp-phone { width: 236px; padding: 5px; border-radius: 38px; }
.raznos-lp-doc-fig .raznos-lp-screen { zoom: .5622; }
.raznos-lp-doc-fig figcaption { margin-top: 10px; font: 500 13.5px/1.4 var(--raznos-font); color: var(--raznos-ink-3); text-align: center; }
.raznos-lp-doc-sec::after { content: ''; display: block; clear: both; }
@media (max-width: 699px) { .raznos-lp-doc-fig { float: none; width: auto; margin: 20px auto; } .raznos-lp-doc-fig .raznos-lp-phone { margin: 0 auto; } }
.raznos-lp-doc-terms { margin: 0; }
.raznos-lp-doc-term { padding: 14px 0; border-top: 1px solid var(--raznos-line); }
.raznos-lp-doc-term:first-child { border-top: 0; padding-top: 0; }
.raznos-lp-doc-term dt { font: 700 17px var(--raznos-font); }
.raznos-lp-doc-term dd { margin: 4px 0 0; color: var(--raznos-ink-2); }
.raznos-lp-doc-body .raznos-lp-faq { margin-top: 0; }
.raznos-lp-doc-body .raznos-lp-pager { margin-top: 48px; }
.raznos-lp-doc-body > .raznos-lp-demo { margin-top: 32px; }
.raznos-lp-cmap { aspect-ratio: 1020 / 910; }
/* рамка ровно по экрану: 402 pt в масштабе .7463 это 300 px, плюс по 6 px рамки */
.raznos-lp-phone { width: 312px; }
.raznos-lp-stage-phone { height: 664.3px; }
.raznos-lp-stage-phone .raznos-lp-screen { top: 6px; left: 6px; }
.raznos-lp-doc-fig .raznos-lp-phone { width: 236px; }
.raznos-lp-stage-phone .raznos-lp-screen { top: 8.04px; left: 8.04px; }
/* Результаты: суммы в три столбца, как в приложении на узком экране, ниже помещается больше */
.raznos-lp-res-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 10px; }
.raznos-lp-res-grid b { font-size: 16px; }
.raznos-lp-res { gap: 12px; }

/* справка: вкладки переносятся, все пять видны и на телефоне */
.raznos-lp-doc-tabs { flex-wrap: wrap; overflow: visible; }
.raznos-lp-doc-tabs a { flex: 1 0 auto; }
/* снимки раздела: один справа от текста сверху, несколько рядом над текстом */
.raznos-lp-doc-fig { margin-top: 0; }
.raznos-lp-doc-figs { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; margin: 4px 0 24px; }
.raznos-lp-doc-figs .raznos-lp-doc-fig { float: none; margin: 0; }
@media (max-width: 699px) { .raznos-lp-doc-figs .raznos-lp-doc-fig { width: 160px; } .raznos-lp-doc-figs .raznos-lp-doc-fig .raznos-lp-phone { width: 160px; padding: 4px; border-radius: 28px; } .raznos-lp-doc-figs .raznos-lp-doc-fig .raznos-lp-screen { zoom: .378; } }
/* финал плотнее: ссылка на бота и пометка про цифры сразу под кнопкой */
.raznos-lp-final br { display: none; }
.raznos-lp-final .raznos-lp-wrap { display: flex; flex-direction: column; align-items: center; }
.raznos-lp-final-bot { margin-top: 8px; }
.raznos-lp-fine { margin-top: 12px; }
.raznos-lp-final .raznos-lp-final-proto { margin-top: 10px; }
/* снимки в справке: тень короче, подпись не под тенью */
.raznos-lp-doc-fig .raznos-lp-phone { box-shadow: 0 0 0 1px oklch(0.4 0.01 250), 0 10px 22px -12px rgba(20, 25, 40, .35); }
.raznos-lp-doc-fig figcaption { margin-top: 16px; font: 500 14px/1.45 var(--raznos-font); color: var(--raznos-ink-2); }

/* Рынок: плитка Подобрать работу как в приложении */
.raznos-lp-guide { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 18px; border: 1px solid var(--raznos-line); background: var(--raznos-surface); }
.raznos-lp-guide > span { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.raznos-lp-guide b { font: 700 16px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-guide small { font: 500 12px/1.3 var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-guide svg { flex: none; }
.raznos-lp-guide i { font: normal 600 16px var(--raznos-font); color: var(--raznos-ink-3); }

/* ховер и нажатие: виджеты страницы приподнимаются, кнопки внутри телефона подсвечиваются как в приложении */
/* подъём через translate и drop-shadow: свои тени виджетов (полоса сервиса у поста) не перетираются */
.raznos-lp-cmp-card, .raznos-lp-review, .raznos-lp-ref-tile, .raznos-lp-post, .raznos-lp-spot, .raznos-lp-step-card, .raznos-lp-svc-grid > *, .raznos-lp-sheet-card, .raznos-lp-top-me, .raznos-lp-offer, .raznos-lp-prog {
  transition: translate .18s ease, filter .18s ease, scale .18s ease;
}
@media (hover: hover) {
  :is(.raznos-lp-cmp-card, .raznos-lp-review, .raznos-lp-ref-tile, .raznos-lp-post, .raznos-lp-spot, .raznos-lp-step-card, .raznos-lp-svc-grid > *, .raznos-lp-sheet-card, .raznos-lp-top-me, .raznos-lp-offer, .raznos-lp-prog):hover {
    translate: 0 -2px;
    filter: drop-shadow(0 10px 14px rgba(20, 25, 40, .12));
  }
  .raznos-lp-faq summary:hover { color: var(--raznos-green-ink, var(--raznos-ink)); }
}
/* на тач-экране вместо нажатия тот же подъём, что и при наведении мышью */
:is(.raznos-lp-cmp-card, .raznos-lp-review, .raznos-lp-ref-tile, .raznos-lp-post, .raznos-lp-spot, .raznos-lp-step-card, .raznos-lp-svc-grid > *, .raznos-lp-sheet-card, .raznos-lp-top-me, .raznos-lp-offer, .raznos-lp-prog).is-touched {
  translate: 0 -2px;
  filter: drop-shadow(0 10px 14px rgba(20, 25, 40, .12));
}

.raznos-lp-phone:not(.raznos-lp-shot) .raznos-lp-screen { pointer-events: auto; }
.raznos-lp-stage-phone .raznos-lp-screen:not(.is-on):not(.raznos-lp-chrome) { pointer-events: none; }
.raznos-lp-phone.raznos-lp-stage-phone .raznos-lp-screen.raznos-lp-chrome { pointer-events: none; }
.raznos-lp-screen :is(.raznos-lp-mk, .raznos-lp-guide, .raznos-lp-card, .raznos-lp-win, .raznos-lp-topcard, .raznos-lp-alert, .raznos-lp-today, .raznos-lp-shift, .raznos-lp-goalcard, .raznos-lp-res, .raznos-lp-res-grid > div, .raznos-lp-place, .raznos-lp-slot, .raznos-lp-quest, .raznos-lp-banner, .raznos-lp-note) {
  cursor: pointer;
  transition: background-color .15s ease, filter .15s ease, transform .15s ease;
}
.raznos-lp-screen :is(.raznos-lp-tbtn, .raznos-lp-sqbtn, .raznos-lp-back, .raznos-lp-today-go, .raznos-lp-periods span, .raznos-lp-seg > *, .raznos-lp-chips > *, .raznos-lp-day, .raznos-lp-mk-seg i, .raznos-lp-rebuild, .raznos-lp-ask, .raznos-lp-top-btns > *) {
  cursor: pointer;
  transition: filter .15s ease, transform .15s ease;
}
@media (hover: hover) {
  .raznos-lp-screen :is(.raznos-lp-mk, .raznos-lp-guide, .raznos-lp-card, .raznos-lp-win, .raznos-lp-topcard, .raznos-lp-alert, .raznos-lp-today, .raznos-lp-shift, .raznos-lp-goalcard, .raznos-lp-res, .raznos-lp-res-grid > div, .raznos-lp-place, .raznos-lp-slot, .raznos-lp-quest, .raznos-lp-banner, .raznos-lp-note):hover:not(:has(:is(.raznos-lp-tbtn, .raznos-lp-sqbtn, .raznos-lp-back, .raznos-lp-today-go, .raznos-lp-periods span, .raznos-lp-seg > *, .raznos-lp-chips > *, .raznos-lp-day, .raznos-lp-mk-seg i, .raznos-lp-rebuild, .raznos-lp-ask, .raznos-lp-top-btns > *):hover)) { filter: brightness(.97); }
  .raznos-lp-screen :is(.raznos-lp-tbtn, .raznos-lp-sqbtn, .raznos-lp-back, .raznos-lp-today-go, .raznos-lp-periods span, .raznos-lp-seg > *, .raznos-lp-chips > *, .raznos-lp-day, .raznos-lp-mk-seg i, .raznos-lp-rebuild, .raznos-lp-ask, .raznos-lp-top-btns > *):hover { filter: brightness(.93); }
}
.raznos-lp-screen :is(.raznos-lp-mk, .raznos-lp-guide, .raznos-lp-card, .raznos-lp-win, .raznos-lp-topcard, .raznos-lp-alert, .raznos-lp-today, .raznos-lp-shift, .raznos-lp-goalcard, .raznos-lp-res, .raznos-lp-place, .raznos-lp-slot, .raznos-lp-quest, .raznos-lp-banner, .raznos-lp-note):active:not(:has(:is(.raznos-lp-tbtn, .raznos-lp-sqbtn, .raznos-lp-back, .raznos-lp-today-go, .raznos-lp-periods span, .raznos-lp-seg > *, .raznos-lp-chips > *, .raznos-lp-day, .raznos-lp-mk-seg i, .raznos-lp-rebuild, .raznos-lp-ask, .raznos-lp-top-btns > *):active)) { transform: scale(.985); }
.raznos-lp-screen :is(.raznos-lp-tbtn, .raznos-lp-sqbtn, .raznos-lp-back, .raznos-lp-today-go, .raznos-lp-periods span, .raznos-lp-seg > *, .raznos-lp-chips > *, .raznos-lp-day, .raznos-lp-rebuild):active { transform: scale(.95); }
.raznos-lp-chrome .raznos-lp-tab { cursor: pointer; transition: color .15s ease; }
@media (hover: hover) { .raznos-lp-chrome .raznos-lp-tab:not(.is-on):hover { color: var(--raznos-ink); } }

/* сравнение сервисов: цифры обычным шрифтом, карточка компактнее */
.raznos-lp-cmp-card { padding: 16px 18px 8px; }
.raznos-lp-cmp-rate { margin: 16px 0 10px; }
.raznos-lp-cmp-rate b { font-size: 22px; }
.raznos-lp-cmp-rate small { font-size: 13px; }
.raznos-lp-cmp-row { min-height: 40px; font-size: 14px; color: var(--raznos-ink-2); }
.raznos-lp-cmp-row b { font: 650 15px var(--raznos-font); font-variant-numeric: tabular-nums; color: var(--raznos-ink); }

/* Курьеры города: на широком экране лента Что происходит слева под текстом, карта с карточкой места справа */
.raznos-lp-spot { box-shadow: 0 10px 24px -12px rgba(20, 25, 40, .26); }
.raznos-lp-community-map { row-gap: 24px; }
@media (min-width: 900px) {
  .raznos-lp-community-map { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "text media" "feed media"; align-items: start; }
  .raznos-lp-community-map > div:first-child { grid-area: text; }
  .raznos-lp-community-map > .raznos-lp-feature-media { grid-area: media; }
  .raznos-lp-community-map > .raznos-lp-community-feed { grid-area: feed; }
}

/* фон секций чередуется: Что умеет серый, Сервисы рядом белый, Рефералки серый, Сообщество белый, Подключить серый */
.raznos-lp-plain { background: var(--raznos-surface); }
.raznos-lp-ref { background: var(--raznos-bg); }
.raznos-lp-ref-tile:not(:first-child) { background: var(--raznos-surface); }
.raznos-lp-ref .raznos-lp-offer { background: var(--raznos-surface); }
.raznos-lp-row .raznos-lp-tab { cursor: pointer; }
@media (hover: hover) { .raznos-lp-row .raznos-lp-tab:not(.is-on):hover { color: var(--raznos-ink); } }

/* Профиль и прочие строки-кнопки в телефоне: аккаунты сервисов, Подключено N сервисов, карточка недели */
.raznos-lp-screen :is(.raznos-lp-me, .raznos-lp-conn, .raznos-lp-accs > div, .raznos-lp-linkcard, .raznos-lp-trend, .raznos-lp-rank > *) {
  cursor: pointer;
  transition: background-color .15s ease, filter .15s ease, transform .15s ease;
}
@media (hover: hover) {
  .raznos-lp-screen :is(.raznos-lp-me, .raznos-lp-conn, .raznos-lp-accs > div, .raznos-lp-linkcard, .raznos-lp-trend, .raznos-lp-rank > *):hover { filter: brightness(.96); }
}
.raznos-lp-screen :is(.raznos-lp-me, .raznos-lp-conn, .raznos-lp-accs > div, .raznos-lp-linkcard, .raznos-lp-trend, .raznos-lp-rank > *):active { transform: scale(.985); }

/* рефералки: тень тёмной карточки короче, при наведении не ложится на карточку курьера под ней */
.raznos-lp-prog { box-shadow: 0 12px 22px -16px rgba(20, 25, 40, .45); }
@media (hover: hover) { :is(.raznos-lp-prog, .raznos-lp-offer):hover { filter: drop-shadow(0 4px 6px rgba(20, 25, 40, .1)); } }
:is(.raznos-lp-prog, .raznos-lp-offer).is-touched { filter: drop-shadow(0 4px 6px rgba(20, 25, 40, .1)); }

/* фокус в липкой шапке не прокручивает страницу: зона отступа для якорей на шапку не распространяется */
.raznos-lp-header, .raznos-lp-header * { scroll-margin-top: -200px; }

/* ===== Ссылки и кнопки: единые состояния на всех страницах =====
   кнопки: ховер ярче и с подъёмом, нажатие вдавливает
   текстовые ссылки: подчёркивание проявляется, нажатие приглушает
   навигация: цвет текста и подложка, нажатие приглушает
   ссылки-карточки: подъём с тенью, стрелка уезжает вправо, нажатие вдавливает */
:root { --raznos-lp-ease: cubic-bezier(.2, .7, .3, 1); }
a, button, summary, select { -webkit-tap-highlight-color: transparent; transition: color .16s var(--raznos-lp-ease), background-color .16s var(--raznos-lp-ease), border-color .16s var(--raznos-lp-ease), box-shadow .2s var(--raznos-lp-ease), transform .16s var(--raznos-lp-ease), opacity .16s var(--raznos-lp-ease), text-decoration-color .16s var(--raznos-lp-ease); }
::selection { background: var(--raznos-green-tint); color: var(--raznos-ink); }
.raznos-lp-final :focus-visible, .raznos-lp-dl-item.is-main:focus-visible { outline-color: var(--raznos-on-dark); }

/* кнопки */
@media (hover: hover) {
  .raznos-lp-btn-main:hover { background: color-mix(in oklab, var(--raznos-green-deep) 88%, white); }
  .raznos-lp-btn-line:hover { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .55); }
}
.raznos-lp-btn:active { transform: translateY(0) scale(.97); box-shadow: none; }

/* текстовые ссылки */
.raznos-lp-more, .raznos-lp-final-bot, .raznos-lp-dl-back, .raznos-lp-demo a, .raznos-lp-dek a, .raznos-lp-doc-body p a, .raznos-lp-doc-body li a, .raznos-lp-ref-note a, .raznos-lp-fine a {
  text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px;
  text-decoration-color: color-mix(in oklab, currentColor 30%, transparent);
}
.raznos-lp-more { text-decoration-color: transparent; }
@media (hover: hover) {
  :is(.raznos-lp-more, .raznos-lp-final-bot, .raznos-lp-dl-back, .raznos-lp-demo a, .raznos-lp-dek a, .raznos-lp-doc-body p a, .raznos-lp-doc-body li a, .raznos-lp-ref-note a, .raznos-lp-fine a):hover { text-decoration-color: currentColor; }
  .raznos-lp-final-bot:hover { color: var(--raznos-on-dark); }
  .raznos-lp-dl-back:hover { color: var(--raznos-ink); }
}
:is(.raznos-lp-more, .raznos-lp-final-bot, .raznos-lp-dl-back, .raznos-lp-demo a, .raznos-lp-dek a, .raznos-lp-doc-body p a, .raznos-lp-doc-body li a, .raznos-lp-ref-note a, .raznos-lp-fine a, .raznos-lp-crumb):active { opacity: .6; }
.raznos-lp-more svg, .raznos-lp-crumb svg { transition: transform .16s var(--raznos-lp-ease); }
@media (hover: hover) {
  .raznos-lp-more:hover svg { transform: translateX(3px); }
  .raznos-lp-crumb:hover svg { transform: translateX(-3px); }
}

/* навигация */
.raznos-lp-nav a { padding: 8px 2px; }
:is(.raznos-lp-nav a, .raznos-lp-doc-toc a):active { opacity: .6; }
@media (hover: hover) { .raznos-lp-doc-tabs a:not([aria-current="page"]):hover { background: var(--raznos-surface); color: var(--raznos-ink); } }
.raznos-lp-doc-tabs a:active { transform: scale(.97); }
@media (hover: hover) { .raznos-lp-lang:hover { background-color: var(--raznos-bg); } }
.raznos-lp-lang:active { transform: scale(.97); }
@media (hover: hover) { .raznos-lp-faq summary:hover, .raznos-lp-faq summary:hover::after { color: var(--raznos-green-deep); border-color: var(--raznos-green-deep); } }
.raznos-lp-faq summary:active { opacity: .7; }

/* логотип */
.raznos-lp-logo img { transition: transform .22s var(--raznos-lp-ease); }
@media (hover: hover) {
  .raznos-lp-logo:hover { color: var(--raznos-green-deep); }
  .raznos-lp-logo:hover img { transform: rotate(-8deg) scale(1.06); }
}
.raznos-lp-logo:active { transform: scale(.96); }

/* ссылки-карточки */
.raznos-lp-teaser, .raznos-lp-pager a, .raznos-lp-more-cards a, .raznos-lp-dl-item, .raznos-lp-nb-tabs a { transition: transform .18s var(--raznos-lp-ease), box-shadow .2s var(--raznos-lp-ease), background-color .16s var(--raznos-lp-ease); }
.raznos-lp-teaser svg, .raznos-lp-pager svg, .raznos-lp-more-cards svg, .raznos-lp-dl-item > svg, .raznos-lp-nb-tabs svg { transition: transform .16s var(--raznos-lp-ease), color .16s var(--raznos-lp-ease); }
@media (hover: hover) {
  :is(.raznos-lp-teaser, .raznos-lp-pager a, .raznos-lp-more-cards a, .raznos-lp-dl-item, .raznos-lp-nb-tabs a):hover { transform: translateY(-2px); box-shadow: 0 12px 24px -14px rgba(20, 25, 40, .3); }
  .raznos-lp-teaser:hover { background: color-mix(in oklab, var(--raznos-green-tint) 85%, var(--raznos-green)); }
  :is(.raznos-lp-teaser, .raznos-lp-more-cards a, .raznos-lp-dl-item, .raznos-lp-nb-tabs a, .raznos-lp-pager .is-next):hover > svg, .raznos-lp-pager .is-next:hover span svg { transform: translateX(3px); color: var(--raznos-ink); }
  .raznos-lp-pager a:not(.is-next):hover svg { transform: translateX(-3px); }
}
:is(.raznos-lp-teaser, .raznos-lp-pager a, .raznos-lp-more-cards a, .raznos-lp-dl-item, .raznos-lp-nb-tabs a):active { transform: scale(.98); box-shadow: none; }


@media (prefers-reduced-motion: reduce) {
  a, button, summary, select, a svg, a img { transition-duration: .01ms; }
  :is(.raznos-lp-btn, .raznos-lp-teaser, .raznos-lp-pager a, .raznos-lp-more-cards a, .raznos-lp-dl-item, .raznos-lp-nb-tabs a, .raznos-lp-logo):is(:hover, :active) { transform: none; }
}

/* финал: справка и Telegram в одну строку, на узком экране друг под другом */
.raznos-lp-final-links { display: flex; flex-wrap: wrap; justify-content: center; column-gap: 28px; margin-top: 8px; }
.raznos-lp-final-links .raznos-lp-final-bot { margin-top: 0; }

/* быстрый скролл: пролистанные экраны не просвечивают под новым */
.raznos-lp-stage-phone .raznos-lp-screen:not(.raznos-lp-chrome):not(.is-on):not(.is-prev) { transition: none; }

/* 12 сервисов в первом экране: иконка подпрыгивает при наведении, название в подсказке title */
.raznos-lp-hero-svc img { transition: transform .18s var(--raznos-lp-ease), box-shadow .18s var(--raznos-lp-ease); }
@media (hover: hover) { .raznos-lp-hero-svc img:hover { transform: translateY(-3px) scale(1.12); box-shadow: 0 0 0 1px rgba(255, 255, 255, .3), 0 8px 16px -6px rgba(0, 0, 0, .5); } }
.raznos-lp-hero-svc div > span { display: flex; }

/* вкладки справки: одна строка, на узком экране листается вбок до края экрана, без переноса столбиком */
.raznos-lp-doc-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.raznos-lp-doc-tabs::-webkit-scrollbar { display: none; }
.raznos-lp-doc-tabs a { flex: 1 0 auto; scroll-snap-align: center; }
@media (max-width: 719px) {
  .raznos-lp-doc-tabs { margin-left: -16px; margin-right: -16px; padding: 4px 16px; border-radius: 0; background: transparent; gap: 8px; scroll-padding: 0 16px; }
  .raznos-lp-doc-tabs a { flex: 0 0 auto; padding: 9px 16px; border-radius: 999px; background: var(--raznos-bg); }
}

/* ссылки в тексте справки зелёные, как Подробнее на главной */
.raznos-lp-doc-body :is(p, li) a { color: var(--raznos-green-deep); font-weight: 600; }

/* шапка внутренних страниц: логотип и название раздела через черту */
.raznos-lp-header-start { display: flex; align-items: center; gap: 12px; min-width: 0; }
.raznos-lp-header-sec { display: inline-flex; align-items: center; gap: 12px; font: 600 16px var(--raznos-font); color: var(--raznos-ink-2); text-decoration: none; white-space: nowrap; }
.raznos-lp-header-sec::before { content: ''; width: 1px; height: 20px; background: var(--raznos-line-strong); }
a.raznos-lp-header-sec:active { opacity: .6; }
@media (hover: hover) { a.raznos-lp-header-sec:hover { color: var(--raznos-ink); } }
.raznos-lp-header-start .raznos-lp-logo { flex: none; }
@media (max-width: 440px) {
  .raznos-lp-header-start .raznos-lp-logo { font-size: 0; gap: 0; }
  .raznos-lp-header-start { gap: 10px; }
  .raznos-lp-header-sec { gap: 10px; font-size: 15px; }
}

/* ===== Новичкам: карточки в языке приложения (Подобрать работу) ===== */
.raznos-lp-newbie-pays { display: grid; gap: 14px; margin-top: 32px; }
@media (min-width: 860px) { .raznos-lp-newbie-pays { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.raznos-lp-newbie-pay, .raznos-lp-newbie-list, .raznos-lp-newbie-terms { border-radius: 20px; background: var(--raznos-surface); border: 1px solid var(--raznos-line); box-shadow: 0 8px 24px -18px rgba(20, 25, 40, .35); }
.raznos-lp-newbie-pay { display: flex; flex-direction: column; gap: 18px; padding: 20px; }
.raznos-lp-newbie-svc { display: flex; align-items: center; gap: 12px; }
.raznos-lp-newbie-svc img, .raznos-lp-newbie-fit img { flex: none; width: 44px; height: 44px; border-radius: 12px; }
.raznos-lp-newbie-svc span, .raznos-lp-newbie-fit > span, .raznos-lp-newbie-list p > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.raznos-lp-newbie-svc b { font: 700 17px var(--raznos-font); }
.raznos-lp-newbie-svc small { font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-newbie-rate { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.raznos-lp-newbie-rate b { font: 750 34px/1 var(--raznos-font); letter-spacing: -0.02em; color: var(--raznos-green-deep); font-variant-numeric: tabular-nums; }
.raznos-lp-newbie-rate span { font: 500 14px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-newbie-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; }
.raznos-lp-newbie-stats > div { padding: 12px; border-radius: 14px; background: var(--raznos-bg); }
.raznos-lp-newbie-stats dt { font: 500 13px/1.3 var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-newbie-stats dd { display: flex; flex-direction: column; gap: 2px; margin: 6px 0 0; }
.raznos-lp-newbie-stats dd b { font: 700 20px var(--raznos-font); font-variant-numeric: tabular-nums; }
.raznos-lp-newbie-stats dd span { font: 500 12.5px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-newbie-hard { display: flex; flex-direction: column; gap: 2px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--raznos-line); font: 500 14px/1.45 var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-newbie-hard span { font: 600 12.5px var(--raznos-font); color: var(--raznos-amber-ink, oklch(0.5 0.12 65)); }

/* вложить на старте: тёмная карточка с суммой, как в приложении */
.raznos-lp-newbie-cost { padding: 22px 24px 24px; border-radius: 22px; background: var(--raznos-dark); color: var(--raznos-on-dark); box-shadow: 0 18px 40px -24px rgba(20, 25, 40, .6); }
.raznos-lp-newbie-cost-h { font: 500 15px var(--raznos-font); color: color-mix(in oklab, var(--raznos-on-dark) 70%, transparent); }
.raznos-lp-newbie-cost-sum { margin-top: 10px; font: 500 26px var(--raznos-font); }
.raznos-lp-newbie-cost-sum b { font: 700 52px/1 var(--raznos-mono); letter-spacing: -0.02em; }
.raznos-lp-newbie-cost-sub { margin-top: 10px; font: 500 15px var(--raznos-font); color: color-mix(in oklab, var(--raznos-on-dark) 78%, transparent); }

/* список строк: название, пояснение мелко, сумма справа */
.raznos-lp-newbie-list { display: flex; flex-direction: column; padding: 6px 20px; }
.raznos-lp-newbie-list > p { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 0; border-top: 1px solid var(--raznos-line); }
.raznos-lp-newbie-list > p:first-child { border-top: 0; }
.raznos-lp-newbie-list p b { font: 600 16px/1.35 var(--raznos-font); }
.raznos-lp-newbie-list p small { font: 500 13.5px/1.35 var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-newbie-list p strong { flex: none; font: 650 17px var(--raznos-mono); font-variant-numeric: tabular-nums; }
.raznos-lp-newbie-list-h small { order: -1; }
.raznos-lp-newbie-list > p.raznos-lp-newbie-tags, .raznos-lp-newbie-list > p.raznos-lp-newbie-days { justify-content: flex-start; flex-wrap: wrap; gap: 8px; padding-top: 0; border-top: 0; }
.raznos-lp-newbie-tags em { padding: 4px 10px; border-radius: 999px; background: var(--raznos-bg); font: normal 600 13px var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-newbie-days em { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--raznos-line-strong); font: normal 600 15px var(--raznos-font); color: var(--raznos-ink); }
.raznos-lp-newbie-days em.is-on { background: var(--raznos-dark); border-color: var(--raznos-dark); color: var(--raznos-on-dark); }
.raznos-lp-newbie-note { display: block; padding: 4px 0 14px; font: 500 13.5px/1.4 var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-newbie-list .raznos-lp-newbie-days + .raznos-lp-newbie-note { padding-top: 0; }
.raznos-lp-feature-media > .raznos-lp-newbie-list + .raznos-lp-newbie-list, .raznos-lp-newbie-cost + .raznos-lp-newbie-list { margin-top: 0; }

/* под твои часы: строка сервиса с меткой записи и вилкой дохода */
.raznos-lp-newbie-fit { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; grid-template-areas: "ico txt pill" "ico txt sum"; gap: 2px 12px; align-items: center; padding: 14px 0; border-top: 1px solid var(--raznos-line); }
.raznos-lp-newbie-fit img { grid-area: ico; }
.raznos-lp-newbie-fit > span { grid-area: txt; }
.raznos-lp-newbie-fit b { font: 650 16px var(--raznos-font); }
.raznos-lp-newbie-fit small { font: 500 13px/1.35 var(--raznos-font); color: var(--raznos-ink-2); }
.raznos-lp-newbie-fit em { grid-area: pill; justify-self: end; padding: 3px 10px; border-radius: 999px; font: normal 650 12.5px var(--raznos-font); white-space: nowrap; }
.raznos-lp-newbie-fit em.is-ok { background: var(--raznos-green-tint); color: var(--raznos-green-deep); }
.raznos-lp-newbie-fit em.is-warn { background: var(--raznos-amber-tint); color: var(--raznos-ink); }
.raznos-lp-newbie-fit strong { grid-area: sum; justify-self: end; font: 650 16px var(--raznos-mono); white-space: nowrap; }

/* условия: три карточки, подпись мелко сверху, значение крупно */
.raznos-lp-newbie-terms-grid { display: grid; gap: 14px; margin-top: 20px; }
@media (min-width: 860px) { .raznos-lp-newbie-terms-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.raznos-lp-newbie-terms { padding: 20px; }
.raznos-lp-newbie-terms h3 { margin: 0 0 6px; font: 700 19px var(--raznos-font); }
.raznos-lp-newbie-terms p { display: flex; flex-direction: column; gap: 3px; padding: 12px 0; border-top: 1px solid var(--raznos-line); }
.raznos-lp-newbie-terms h3 + p { border-top: 0; }
.raznos-lp-newbie-terms p span { font: 500 13px var(--raznos-font); color: var(--raznos-ink-3); }
.raznos-lp-newbie-terms p b { font: 600 15.5px/1.45 var(--raznos-font); }

/* ховер как у остальных виджетов страницы */
.raznos-lp-newbie-pay, .raznos-lp-newbie-list, .raznos-lp-newbie-terms, .raznos-lp-newbie-cost { transition: translate .18s ease, filter .18s ease; }
@media (hover: hover) { :is(.raznos-lp-newbie-pay, .raznos-lp-newbie-list, .raznos-lp-newbie-terms, .raznos-lp-newbie-cost):hover { translate: 0 -2px; filter: drop-shadow(0 10px 14px rgba(20, 25, 40, .1)); } }
:is(.raznos-lp-newbie-pay, .raznos-lp-newbie-list, .raznos-lp-newbie-terms, .raznos-lp-newbie-cost).is-touched { translate: 0 -2px; filter: drop-shadow(0 10px 14px rgba(20, 25, 40, .1)); }
@media (max-width: 520px) {
  .raznos-lp-newbie-list { padding: 4px 16px; }
  .raznos-lp-newbie-days em { min-width: 38px; height: 38px; padding: 0 10px; font-size: 14px; }
  .raznos-lp-newbie-list > p.raznos-lp-newbie-days { gap: 6px; }
  .raznos-lp-newbie-fit { grid-template-columns: 40px minmax(0, 1fr); grid-template-areas: "ico txt" "ico pill" "ico sum"; row-gap: 6px; }
  .raznos-lp-newbie-fit img { width: 40px; height: 40px; align-self: start; }
  .raznos-lp-newbie-fit em, .raznos-lp-newbie-fit strong { justify-self: start; }
}

/* смена экрана: прошлый экран сразу целиком непрозрачный под новым, новый проявляется сверху, остальные гаснут сразу.
   Без этого при быстром скролле два полупрозрачных экрана пропускали тёмный корпус телефона */
.raznos-lp-stage-phone .raznos-lp-screen.is-prev:not(.raznos-lp-chrome):not(.is-on) { z-index: 1; opacity: 1; transition: none; }
.raznos-lp-stage-phone .raznos-lp-screen.is-on:not(.raznos-lp-chrome) { z-index: 2; }
.raznos-lp-stage-phone.is-instant .raznos-lp-screen:not(.raznos-lp-chrome) { transition: none; }

/* стрелка между снимками справки: что происходит после нажатия */
.raznos-lp-doc-arrow { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; align-self: center; margin-bottom: 64px; color: var(--raznos-green-deep); font: normal 600 13px/1.3 var(--raznos-font); text-align: center; }
.raznos-lp-doc-arrow svg { width: 48px; height: 24px; }
.raznos-lp-doc-arrow span { max-width: 96px; }
@media (max-width: 699px) { .raznos-lp-doc-arrow { margin-bottom: 0; } .raznos-lp-doc-arrow span { display: none; } .raznos-lp-doc-arrow svg { width: 28px; } }

/* выбор языка как в приложении: глобус, название, стрелка; под ними прозрачный select на всю плашку */
.raznos-lp-lang-wrap { position: relative; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 10px 0 11px; border-radius: 10px; border: 1px solid var(--raznos-line-strong); background: var(--raznos-surface); color: var(--raznos-ink); cursor: pointer; transition: background-color .16s var(--raznos-lp-ease), border-color .16s var(--raznos-lp-ease), transform .16s var(--raznos-lp-ease); }
.raznos-lp-lang-globe { flex: none; width: 18px; height: 18px; color: var(--raznos-ink-2); }
.raznos-lp-lang-name { font: 600 15px var(--raznos-font); white-space: nowrap; }
.raznos-lp-lang-chev { flex: none; width: 16px; height: 16px; color: var(--raznos-ink-3); }
.raznos-lp-lang-wrap .raznos-lp-lang { position: absolute; inset: 0; width: 100%; max-width: none; min-width: 0; height: 100%; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: inherit; background: none; color: var(--raznos-ink); opacity: 0; cursor: pointer; appearance: none; font: 500 15px var(--raznos-font); }
@media (hover: hover) { .raznos-lp-lang-wrap:hover { background: var(--raznos-bg); border-color: var(--raznos-ink-3); } }
.raznos-lp-lang-wrap:active { transform: scale(.97); }
.raznos-lp-lang-wrap:has(.raznos-lp-lang:focus-visible) { outline: 3px solid var(--raznos-brand); outline-offset: 3px; }
@media (max-width: 480px) {
  .raznos-lp-lang-wrap { width: 40px; padding: 0; justify-content: center; }
  .raznos-lp-lang-name, .raznos-lp-lang-chev { display: none; }
}

/* снимки справки: экран уходит под статус-бар, сверху мягкий градиент фона как в приложении, без серой полосы */
.raznos-lp-shot .raznos-lp-screen { position: relative; }
.raznos-lp-shot .raznos-lp-screen > .raznos-lp-status { position: absolute; z-index: 2; inset: 0 0 auto; background: linear-gradient(to bottom, var(--raznos-lp-shot-top, var(--raznos-bg)) 0%, color-mix(in oklab, var(--raznos-lp-shot-top, var(--raznos-bg)) 85%, transparent) 50%, transparent 100%); }
.raznos-lp-shot .raznos-lp-screen img { height: 100%; padding-top: 40px; box-sizing: border-box; }
.raznos-lp-shot .raznos-lp-screen { background: var(--raznos-lp-shot-top, var(--raznos-bg)); }

/* страница скачивания: крошка сверху, вариант под устройство, тихие магазины */
.raznos-lp-dl { display: block; padding: 96px 0 64px; }
.raznos-lp-dl > .raznos-lp-wrap { max-width: 1160px; }
.raznos-lp-dl-box { margin: 8px auto 0; padding: 0 16px; }
.raznos-lp-dl-box > img { width: 80px; height: 80px; }
.raznos-lp-dl-box h1 { margin-top: 20px; }
.raznos-lp-dl-item b { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.raznos-lp-dl-mine { padding: 2px 8px; border-radius: 999px; background: var(--raznos-brand); color: #fff; font: normal 650 11.5px var(--raznos-font); }
.raznos-lp-dl-item:not(.is-main) { border: 1px solid var(--raznos-line); box-shadow: none; }
@media (hover: hover) { .raznos-lp-dl-item[data-os="android"]:hover > svg { transform: translateY(2px); } }
.raznos-lp-dl-stores-t { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--raznos-line); font: 600 13px var(--raznos-font); }
.raznos-lp-store { height: 52px; background: transparent; border: 1px dashed var(--raznos-line-strong); color: var(--raznos-ink-2); opacity: 1; cursor: default; }
.raznos-lp-store svg { filter: grayscale(1); opacity: .6; }
.raznos-lp-store small { opacity: 1; color: var(--raznos-ink-3); font-size: 11px; }

/* статус-бар снимков: без своей заливки, верх снимка уходит под него и растворяется в полупрозрачном градиенте */
.raznos-lp-shot .raznos-lp-screen > .raznos-lp-status { background: none; }
.raznos-lp-shot .raznos-lp-screen::after { content: ''; position: absolute; z-index: 1; inset: 0 0 auto; height: 86px; pointer-events: none; background: linear-gradient(to bottom, var(--raznos-lp-shot-top, var(--raznos-bg)) 0%, color-mix(in oklab, var(--raznos-lp-shot-top, var(--raznos-bg)) 92%, transparent) 38%, color-mix(in oklab, var(--raznos-lp-shot-top, var(--raznos-bg)) 55%, transparent) 62%, transparent 100%); }
.raznos-lp-shot .raznos-lp-screen img { padding-top: 26px; }
.raznos-lp-shot .raznos-lp-screen::after { height: 58px; background: linear-gradient(to bottom, var(--raznos-lp-shot-top, var(--raznos-bg)) 0%, color-mix(in oklab, var(--raznos-lp-shot-top, var(--raznos-bg)) 85%, transparent) 55%, transparent 100%); }
.raznos-lp-shot .raznos-lp-screen img { padding-top: 34px; }
.raznos-lp-shot .raznos-lp-screen img { padding-top: 46px; }
.raznos-lp-shot .raznos-lp-screen::after { height: 64px; background: linear-gradient(to bottom, var(--raznos-lp-shot-top, var(--raznos-bg)) 0%, var(--raznos-lp-shot-top, var(--raznos-bg)) 62%, transparent 100%); }

/* рефералки: мелкий текст тёмной карточки без прозрачности, контраст стабильный */
.raznos-lp-prog-head small, .raznos-lp-prog-lab, .raznos-lp-prog-sub, .raznos-lp-prog-foot { opacity: 1; color: color-mix(in oklab, var(--raznos-on-dark) 82%, var(--raznos-dark)); }

/* ===== по итогам аудита ===== */
/* фокус на тёмной карточке скачивания виден на светлом фоне */
.raznos-lp-dl-item.is-main:focus-visible { outline-color: var(--raznos-brand); }
/* липкий телефон помещается на невысоких ноутбуках */
@media (min-width: 900px) and (max-height: 820px) { .raznos-lp-stage-phone { zoom: .86; } }
@media (min-width: 900px) and (max-height: 700px) { .raznos-lp-stage-phone { zoom: .74; } }
/* вложенные строки в макете: подсвечивается только то, на чём курсор */
@media (hover: hover) {
  .raznos-lp-screen :is(.raznos-lp-shift, .raznos-lp-win, .raznos-lp-topcard, .raznos-lp-res):has(:is(.raznos-lp-slot, .raznos-lp-quest, .raznos-lp-place, .raznos-lp-res-grid > div):hover) { filter: none; }
}
/* стрелка вниз у вкладок Новичкам уезжает вниз */
@media (hover: hover) { .raznos-lp-nb-tabs a:hover > svg { transform: translateY(3px); } }
/* названия сервисов на узком экране переносятся, а не обрезаются */
.raznos-lp-svc span { white-space: normal; overflow: visible; line-height: 1.25; }
.raznos-lp-accs small { white-space: normal; flex-wrap: wrap; }
.raznos-lp-map-osm { font-size: 11px; }
/* ссылки в FAQ и определениях ведут себя как остальные ссылки в тексте */
.raznos-lp-faq details p a, .raznos-lp-doc-term dd a { color: var(--raznos-green-deep); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; text-decoration-color: color-mix(in oklab, currentColor 30%, transparent); }
@media (hover: hover) { :is(.raznos-lp-faq details p a, .raznos-lp-doc-term dd a):hover { text-decoration-color: currentColor; } }
:is(.raznos-lp-faq details p a, .raznos-lp-doc-term dd a):active { opacity: .6; }
/* зоны нажатия на телефоне не меньше 44px */
@media (max-width: 720px) {
  .raznos-lp-header-btn, .raznos-lp-lang-wrap { height: 44px; min-height: 44px; }
  .raznos-lp-lang-wrap { width: 44px; }
  .raznos-lp-logo { min-height: 44px; }
  a.raznos-lp-header-sec { min-height: 44px; }
  .raznos-lp-doc-tabs a { min-height: 44px; display: inline-flex; align-items: center; }
}
@media (max-width: 400px) { .raznos-lp-svc { gap: 8px; padding-left: 10px; padding-right: 8px; } .raznos-lp-svc img { width: 32px; height: 32px; } .raznos-lp-svc span { font-size: 14px; } }

/* ===== первый экран ===== */
/* на телефоне первый экран легче: меньше заголовок и текст, вторая кнопка тише, иконки компактнее */
@media (max-width: 600px) {
  .raznos-lp-hero-badge { margin-bottom: 18px; padding: 6px 12px; font-size: 13px; }
  .raznos-lp-h1 { font-size: clamp(32px, 9vw, 38px); line-height: 1.06; }
  .raznos-lp-hero-lead { margin-top: 14px; font-size: 16.5px; line-height: 1.5; opacity: .78; }
  .raznos-lp-hero-cta { margin-top: 24px; gap: 4px; }
  .raznos-lp-hero-cta .raznos-lp-btn-main { min-height: 50px; padding: 0 22px; }
  .raznos-lp-hero-cta .raznos-lp-btn-line { min-height: 44px; padding: 0 12px; border-color: transparent; opacity: .85; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .3); text-underline-offset: 5px; }
  .raznos-lp-hero-svc { margin-top: 26px; }
  .raznos-lp-hero-svc p { font-size: 14px; }
  .raznos-lp-hero-svc div { gap: 6px; }
  .raznos-lp-hero-svc img { width: 28px; height: 28px; border-radius: 8px; }
}

/* появление при открытии: текст поднимается по очереди, иконки сервисов выскакивают одна за другой, шторка выезжает снизу */
@keyframes raznos-lp-rise-in { from { opacity: 0; transform: translateY(14px); } }
@keyframes raznos-lp-pop-in { from { opacity: 0; transform: translateY(6px) scale(.6); } }
@keyframes raznos-lp-sheet-in { from { opacity: 0; transform: translateY(40px); } }
@media (prefers-reduced-motion: no-preference) {
  .raznos-lp-hero-copy > * { animation: raznos-lp-rise-in .6s cubic-bezier(.2, .7, .3, 1) both; }
  .raznos-lp-hero-copy > :nth-child(1) { animation-delay: .05s; }
  .raznos-lp-hero-copy > :nth-child(2) { animation-delay: .12s; }
  .raznos-lp-hero-copy > :nth-child(3) { animation-delay: .22s; }
  .raznos-lp-hero-copy > :nth-child(4) { animation-delay: .32s; }
  .raznos-lp-hero-copy > :nth-child(5) { animation-delay: .4s; }
  .raznos-lp-hero-svc [role="listitem"] { animation: raznos-lp-pop-in .45s cubic-bezier(.3, 1.5, .5, 1) both; animation-delay: calc(.5s + var(--i, 0) * 45ms); }
  .raznos-lp-hero .raznos-lp-sheet { animation: raznos-lp-sheet-in .8s cubic-bezier(.2, .7, .3, 1) .25s both; }
}

/* тап на телефоне: подсветка держится, пока не тапнешь в другое место */
.raznos-lp-hero-svc img.is-touched { transform: translateY(-3px) scale(1.12); box-shadow: 0 0 0 1px rgba(255, 255, 255, .3), 0 8px 16px -6px rgba(0, 0, 0, .5); }
.raznos-lp-screen .is-touched { filter: brightness(.95); }
@media (max-width: 420px) { .raznos-lp-hero-svc div { gap: 5px; } .raznos-lp-hero-svc img { width: 26px; height: 26px; border-radius: 7px; } }

/* справка на телефоне: снимки крупнее; несколько снимков листаются вбок, а не сжимаются в столбик */
@media (max-width: 699px) {
  .raznos-lp-doc-fig { width: 300px; max-width: 100%; }
  .raznos-lp-doc-fig .raznos-lp-phone { width: 300px; padding: 6px; border-radius: 46px; }
  .raznos-lp-doc-fig .raznos-lp-screen { zoom: .7164; }
  .raznos-lp-doc-figs { flex-wrap: nowrap; justify-content: flex-start; gap: 16px; margin: 4px -16px 24px; padding: 4px 16px 12px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 16px; scrollbar-width: none; }
  .raznos-lp-doc-figs::-webkit-scrollbar { display: none; }
  .raznos-lp-doc-figs .raznos-lp-doc-fig { flex: none; width: 270px; scroll-snap-align: start; }
  .raznos-lp-doc-figs .raznos-lp-doc-fig .raznos-lp-phone { width: 270px; padding: 5px; border-radius: 42px; }
  .raznos-lp-doc-figs .raznos-lp-doc-fig .raznos-lp-screen { zoom: .6468; }
  .raznos-lp-doc-figs .raznos-lp-doc-arrow { flex: none; }
}
@media (max-width: 999px) { .raznos-lp-doc-grid { grid-template-columns: minmax(0, 1fr); } }
.raznos-lp-doc-body { min-width: 0; }

/* справка на компьютере: одиночный снимок крупнее, рядом с текстом */
@media (min-width: 700px) {
  .raznos-lp-doc-sec > .raznos-lp-doc-fig { width: 300px; margin-left: 40px; }
  .raznos-lp-doc-sec > .raznos-lp-doc-fig .raznos-lp-phone { width: 300px; padding: 6px; border-radius: 46px; }
  .raznos-lp-doc-sec > .raznos-lp-doc-fig .raznos-lp-screen { zoom: .7164; }
}
.raznos-lp-shot .raznos-lp-screen.is-dark-top > .raznos-lp-status { color: #fff; }
.raznos-lp-shot .raznos-lp-screen.is-dark-top img { padding-top: 54px; }

/* статус-бар снимков как в приложении (Page .raznosTopFade): подложка ровно высотой строки состояния,
   фон верха снимка 92% сверху и 72% снизу. Прокрученное содержимое уходит под неё приглушённым,
   у снимков с начала экрана отступ под строку состояния, как в приложении */
.raznos-lp-shot .raznos-lp-screen::after { height: 54px; background: linear-gradient(to bottom, color-mix(in srgb, var(--raznos-lp-shot-top, var(--raznos-bg)) 92%, transparent), color-mix(in srgb, var(--raznos-lp-shot-top, var(--raznos-bg)) 72%, transparent)); }
.raznos-lp-shot .raznos-lp-screen img, .raznos-lp-shot .raznos-lp-screen.is-dark-top img { padding-top: 54px; }
/* is-scrolled: срез по промежутку между блоками, отступ под статус-бар как у остальных */

/* страница 404: указатель в цветах приложения, дальше те же карточки, что на странице скачивания */
.raznos-lp-missing .raznos-lp-dl-item { grid-template-columns: minmax(0, 1fr) 20px; }
.raznos-lp-missing-sign svg { display: block; width: 140px; height: 112px; margin: 0 auto; }
@media (prefers-reduced-motion: no-preference) {
  .raznos-lp-missing-sign svg { transform-origin: 50% 100%; animation: raznos-lp-sway 3.2s ease-in-out infinite; }
  @keyframes raznos-lp-sway { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg); } }
}

/* Safari считает ширину select по самому длинному пункту и раздвигает шапку: обрезаем по кнопке, страницу по экрану */
.raznos-lp-lang-wrap { overflow: hidden; }
html, body { overflow-x: clip; }