/* Landing v5 — redesign layer for the homepage (Alina, Aug 2026).
   Extracted from the design-file export: the three <style> blocks that carry new rules.
   Loaded by test_site/index_v5.html.erb AFTER the legacy inline styles — it overrides them,
   so order matters. The export's own review layer (#dsgBar, .dsg-badge) is NOT here. */


/* ---------- export style block #4 (86.8 KB) ---------- */
.release-carousel {
      position: relative;
      padding: 132px 0 24px;
      background: var(--bg-deep);
      overflow: hidden;
    }
    .rc-viewport { overflow: hidden; }
    .rc-track {
      display: flex;
      gap: 24px;
      transition: transform .7s var(--ease-out);
      will-change: transform;
    }
    .rc-slide {
      flex: 0 0 auto;
      width: clamp(200px, 17vw, 280px);
      text-decoration: none;
      color: inherit;
      display: block;
    }
    .rc-media {
      position: relative;
      aspect-ratio: 9 / 16;
      border-radius: 14px;
      overflow: hidden;
      background: #000;
      transition: opacity .5s var(--ease-out), transform .5s var(--ease-out);
    }
    .rc-media video, .rc-media img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
    }
    .rc-slide:hover .rc-media { transform: translateY(-4px); }
    .rc-copy { padding: 18px 2px 0; }
    .rc-title {
      font-family: 'Helvetica Neue', Helvetica, 'Segoe UI', system-ui, Arial, sans-serif;
      font-size: 17px;
      font-weight: 700;
      line-height: 1.2;
      letter-spacing: 0.01em;
      text-transform: uppercase;
      margin: 0 0 8px;
      color: var(--text-primary);
    }
    .rc-sub {
      font-size: 15px;
      line-height: 1.4;
      color: var(--text-secondary);
      margin: 0;
      text-wrap: pretty;
    }
    .rc-arrow {
      position: absolute;
      top: calc(132px + clamp(160px, 15vw, 240px));
      width: 44px; height: 44px;
      border-radius: 50%;
      display: grid; place-items: center;
      background: rgba(255,255,255,.1);
      border: 1px solid rgba(255,255,255,.28);
      backdrop-filter: blur(var(--glass-blur));
      color: #fff;
      cursor: pointer;
      z-index: 4;
      box-shadow: 0 8px 28px rgba(0,0,0,.5);
      transition: background .25s var(--ease-out), opacity .25s var(--ease-out);
    }
    .rc-arrow:hover { background: var(--neon-coral); border-color: var(--neon-coral); }
    .rc-arrow:active { transform: scale(.94); }
    .rc-arrow[disabled] { opacity: .28; cursor: default; }
    .rc-arrow svg { width: 18px; height: 18px; }
    .rc-arrow-prev { left: 14px; }
    .rc-arrow-next { right: 14px; }

    /* МОЗАИКА ВИДЕО ВОКРУГ СТРОКИ (первый экран) */
    .video-wall {
      position: relative;
      width: calc(100vw - 60px);
      margin-left: calc(50% - 50vw + 30px);
      border-radius: 24px;
      height: 100vh;
      min-height: 640px;
      display: grid;
      place-items: center;
      overflow: hidden;
      background: #05050A;
    }
    .vw-grid {
      position: absolute;
      inset: -8% -4%;
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 12px;
      transform: rotate(-4deg) scale(1.14);
    }
    .vw-col { overflow: hidden; }
    .vw-run {
      display: flex;
      flex-direction: column;
      gap: 12px;
      animation: vwSlide var(--dur, 54s) linear infinite;
      animation-delay: var(--off, 0s);
    }
    .vw-col:nth-child(even) .vw-run { animation-direction: reverse; }
    @keyframes vwSlide { from { transform: translateY(0); } to { transform: translateY(-50%); } }
    .vw-cell {
      position: relative;
      aspect-ratio: 9 / 16;
      border-radius: 10px;
      overflow: hidden;
      background: #0B0B10;
      border: 1px solid rgba(255,255,255,.07);
      transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
    }
    .vw-cell video {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      filter: none;
      transition: filter .4s ease;
    }
    .vw-cell:hover,
    .vw-cell.is-lit { transform: scale(1.06); box-shadow: 0 24px 60px rgba(0,0,0,.65); z-index: 3; }
    .vw-cell:hover video,
    .vw-cell.is-lit video { filter: saturate(1.1); }
    .vw-veil {
      position: absolute; inset: 0;
      pointer-events: none;
      background: none;
    }
    .vw-core {
      position: relative;
      z-index: 5;
      width: min(540px, calc(100% - 48px));
      text-align: center;
      pointer-events: none;
      padding: 26px 24px 24px;
      border-radius: 24px;
      background: rgba(6,6,9,.82);
      border: 1px solid rgba(255,255,255,.12);
      backdrop-filter: blur(30px) saturate(1.2);
      box-shadow: 0 50px 120px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.1);
    }
    .vw-core > * { pointer-events: auto; }
    .vw-core h1 .vw-h1-sub { font-size: .74em; font-weight: 800; color: rgba(255,255,255,.82); }
    .vw-tagline {
      margin: 0 0 12px;
      font-size: clamp(22px, 2.8vw, 44px);
      font-weight: 900;
      letter-spacing: -.045em;
      line-height: 1;
      color: rgba(255,255,255,.34);
    }
    .vw-tagline b {
      color: var(--neon-coral);
      font-weight: 900;
      text-shadow: 0 0 34px rgba(255,59,33,.55);
    }
    .vw-claim {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      margin: 0 0 16px;
      padding: 9px 16px;
      border-radius: 999px;
      background: var(--neon-coral);
      color: #fff;
      font-size: clamp(11px, 1.05vw, 13px);
      font-weight: 800;
      letter-spacing: .02em;
      text-transform: uppercase;
      box-shadow: 0 10px 30px rgba(255,59,33,.45);
    }
    .vw-claim b { font-size: 1.25em; font-weight: 900; letter-spacing: -.02em; }
    .vw-claim-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: #fff;
      animation: vwClaimPulse 2s ease-in-out infinite;
    }
    @keyframes vwClaimPulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
    .vw-core h1 { font-size: clamp(19px, 2.2vw, 34px) !important; margin-bottom: 9px !important; white-space: normal !important; line-height: 1.1 !important; }
    .vw-core .lead { font-size: 14px !important; margin-bottom: 18px !important; }
    .vw-core .cc-form { min-height: 56px; padding: 8px 8px 8px 17px; }
    .vw-core .cc-input { font-size: 13.5px; min-height: 38px; }
    .vw-core .cc-submit { height: 40px; padding: 0 15px; font-size: 14px; }
    .vw-core .sbsteps { margin-top: 13px; display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; gap: 0; }
    .vw-core .sbstep { padding: 8px 11px; justify-content: center; }
    .vw-core .sbstep:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.1); }
    .vw-core .sbstep + .sbstep::before { display: none; }
    .vw-core .sbstep:nth-child(even)::after {
      content: '';
      position: absolute;
      left: 0; top: 8px; bottom: 8px;
      width: 1px;
      background: rgba(255,255,255,.1);
    }
    .vw-core .sbstep.is-now::after { display: none; }
    .vw-core .sbstep-name { font-size: 9px; }
    .vw-core .sbstep-num { font-size: 8.5px; }
    @media (max-width: 900px) {
      .video-wall { height: auto; min-height: 0; padding: 90px 0 60px; }
      .vw-grid { grid-template-columns: repeat(4, 1fr); }
      .vw-core { padding: 28px 20px 26px; border-radius: 14px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .vw-run { animation: none; }
      .vw-cell { transition: none; }
    }

    /* Горизонтальная карусель работ (под вертикальной) */
    .hrc {
      position: relative;
      width: 100%;
      margin-top: 14px;
    }
    .hrc-viewport { overflow: hidden; }
    .hrc-track {
      display: flex;
      gap: 14px;
      padding: 0 max(24px, calc((100% - 1400px) / 2));
      transition: transform .7s cubic-bezier(.2,.8,.2,1);
      will-change: transform;
    }
    .hrc-slide {
      flex: 0 0 auto;
      width: clamp(280px, 30vw, 460px);
      text-decoration: none;
      color: inherit;
    }
    .hrc-media {
      position: relative;
      aspect-ratio: 16 / 9;
      border-radius: 14px;
      overflow: hidden;
      background: #0C0C10;
      border: 1px solid rgba(255,255,255,.08);
      transition: transform .4s cubic-bezier(.2,.8,.2,1), border-color .4s ease;
    }
    .hrc-slide:hover .hrc-media { transform: translateY(-4px); border-color: rgba(255,255,255,.2); }
    .hrc-media video, .hrc-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .hrc-copy { padding: 12px 2px 0; }
    .hrc-title {
      margin: 0;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: -.02em;
      color: #EDEDF2;
    }
    .hrc-sub {
      margin: 4px 0 0;
      font-size: 13px;
      color: var(--text-muted);
      line-height: 1.45;
    }
    .hrc-arrow {
      position: absolute;
      top: calc(50% - 26px);
      transform: translateY(-50%);
      width: 44px; height: 44px;
      display: grid; place-items: center;
      border-radius: 50%;
      background: rgba(255,255,255,.1);
      border: 1px solid rgba(255,255,255,.28);
      backdrop-filter: blur(var(--glass-blur));
      color: #fff;
      cursor: pointer;
      z-index: 4;
      box-shadow: 0 8px 28px rgba(0,0,0,.5);
      transition: background .25s ease, border-color .25s ease, transform .15s ease;
    }
    .hrc-arrow:hover { background: var(--neon-coral); border-color: var(--neon-coral); }
    .hrc-arrow:active { transform: translateY(-50%) scale(.94); }
    .hrc-arrow svg { width: 18px; height: 18px; }
    .hrc-arrow-prev { left: 14px; }
    .hrc-arrow-next { right: 14px; }
    @media (max-width: 768px) {
      .hrc-track { gap: 10px; padding: 0 16px; }
      .hrc-slide { width: 76vw; }
      .hrc-arrow { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .hrc-track { transition: none; }
      .hrc-media { transition: none; }
    }


    @media (max-width: 768px) {
      .release-carousel { padding: 96px 0 32px; }
      .rc-slide { width: 54vw; }
      .rc-track { gap: 14px; }
      .rc-title { font-size: 15px; }
      .rc-sub { font-size: 14px; }
      .rc-arrow { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .rc-track { transition: none; }
      .rc-media { transition: none; }
    }

    /* FULL-WIDTH CORAL NAV (перенести в _header_v3.html.erb) */
    header.floating-nav {
      top: 0;
      left: 0;
      right: 0;
      width: 100%;
      max-width: none;
      transform: none;
      border: 0;
      border-bottom: 0;
      border-radius: 0;
      background: var(--neon-coral);
      backdrop-filter: none;
      padding: 4px max(24px, calc((100% - 1400px) / 2));
      gap: 24px;
    }
    body.spellzi-on header.floating-nav { top: var(--spellzi-h) !important; }
    body { --spellzi-nav-gap: 0px; }
    header.floating-nav .nav-links a {
      color: #fff;
      font-size: 15px;
      font-weight: 500;
      letter-spacing: .01em;
      padding: 8px 4px;
    }
    header.floating-nav .nav-links { gap: 30px; }
    header.floating-nav .nav-links a:hover { color: rgba(255,255,255,.72); }
    header.floating-nav .btn-neon {
      background: #14090A !important;
      color: #fff !important;
      box-shadow: none !important;
    }
    header.floating-nav .btn-neon:hover { background: #000 !important; }
    .nav-create {
      display: inline-flex;
      align-items: center;
      padding: 9px 18px;
      border-radius: 6px;
      background: var(--neon-coral);
      color: #fff !important;
      font-size: 14px;
      font-weight: 800;
      letter-spacing: -.01em;
      text-decoration: none;
      transition: background .25s ease, transform .2s ease;
    }
    .nav-create:hover { background: #FF6446; transform: translateY(-1px); }
    header.floating-nav .logo {
      display: inline-flex;
      align-items: center;
      padding: 7px 14px;
      border-radius: 10px;
      background: #14090A;
      transition: background .25s var(--ease-out);
    }
    header.floating-nav .logo:hover { background: #000; }
    header.floating-nav .mobile-menu-toggle { color: #fff; }
    header.floating-nav .lang-dropdown > button { color: #fff !important; }
    header.floating-nav .lang-dropdown > button svg { fill: currentColor; }
    @media (max-width: 768px) {
      header.floating-nav {
        width: 100% !important;
        left: 0 !important;
        border-radius: 0 !important;
        padding: 8px max(16px, env(safe-area-inset-left)) 8px max(16px, env(safe-area-inset-right)) !important;
      }
      body.spellzi-on header.floating-nav { top: var(--spellzi-h) !important; }
    }

    /* Типографика: нейтральный гротеск, плотные заголовки */
    h1, h2, h3, h4 { letter-spacing: -0.025em !important; font-weight: 700; }
    .hero h1 { letter-spacing: -0.035em !important; }
    body { letter-spacing: -0.005em; }
    p, li { text-wrap: pretty; }

    /* HERO + TERRA - micro-label / display / one big input */
    .hero {
      min-height: 0;
      align-items: flex-start;
      justify-content: flex-start;
      padding-top: 0 !important;
    }
    .hero-content {
      text-align: center;
      width: 100%;
      max-width: 1400px;
      margin: 0 auto;
      padding: 0 24px;
    }
    @media (min-width: 1025px) {
      .hero h1 { font-size: clamp(40px, 4.4vw, 72px) !important; }
    }
    @media (max-width: 1024px) {
      .hero h1 { white-space: normal !important; }
    }
    .lead { max-width: none; }
    @media (min-width: 1025px) {
      .lead { white-space: nowrap; }
    }
    .hero h1 { margin-bottom: 18px; }
    .creation-concierge { margin-left: auto; margin-right: auto; }
    .hero-pills {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
      margin: 0 0 28px;
    }
    .hero-pill {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 9px 16px;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 999px;
      background: rgba(255,255,255,.02);
      color: #C9C9D2;
      font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, monospace;
      font-size: 11px;
      font-weight: 500;
      letter-spacing: .16em;
      text-transform: uppercase;
      line-height: 1;
    }
    .hero-pill-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--neon-coral);
      box-shadow: 0 0 12px rgba(255,59,33,.9);
    }
    .hero-pill-new { border-color: rgba(255,59,33,.42); color: #FFD6CE; }
    .hero-pill-new b {
      padding: 3px 7px;
      border-radius: 6px;
      background: var(--neon-coral);
      color: #14090A;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .12em;
    }
    .lead-accent {
      color: var(--neon-coral);
      text-decoration: underline;
      text-decoration-thickness: 2px;
      text-underline-offset: 6px;
      text-decoration-color: rgba(255,59,33,.55);
    }

    /* TERRA - коралловая афиша во всю ширину */
    .creation-concierge {
      width: 100%;
      max-width: none;
      margin: 0;
      text-align: center;
    }
    .cc-shell {
      padding: 0;
      border: 0;
      border-radius: 0;
      background: none;
      box-shadow: none;
      backdrop-filter: none;
      animation: none;
      overflow: visible;
    }
    .cc-shell.is-chatting { min-height: 0; border: 0; box-shadow: none; }
    .cc-shell::before { display: none; }
    .cc-kicker {
      margin-bottom: 16px;
      color: rgba(20,9,10,.72);
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10.5px;
      font-weight: 500;
      letter-spacing: .18em;
      text-transform: uppercase;
      transform: none;
      background: none;
      padding: 0;
      border-radius: 0;
    }
    .cc-pulse { background: #14090A; box-shadow: none; width: 7px; height: 7px; }
    .lv4 section h2.cc-title {
      display: none;
      font-size: clamp(30px, 4vw, 60px) !important;
      font-weight: 800;
      color: #14090A;
      letter-spacing: -.04em !important;
      line-height: 1.02 !important;
      margin: 0 0 26px;
      max-width: none;
      white-space: nowrap;
    }
    .cc-form {
      position: relative;
      align-items: center;
      gap: 12px;
      min-height: 76px;
      padding: 12px 12px 12px 26px;
      border: 0;
      border-radius: 6px;
      background: rgba(12,12,16,.86);
      border: 1px solid rgba(255,255,255,.22);
      backdrop-filter: blur(28px) saturate(1.3);
      box-shadow: 0 30px 80px rgba(0,0,0,.7);
      transition: box-shadow .35s var(--ease-out), background .35s var(--ease-out);
    }
    .cc-form::after {
      content: '';
      position: absolute;
      inset: -1px;
      border-radius: inherit;
      pointer-events: none;
      opacity: 0;
      box-shadow: 0 0 0 5px rgba(255,59,33,.22), 0 0 70px rgba(255,59,33,.45);
      transition: opacity .35s var(--ease-out);
    }
    .cc-form::after { display: none; }
    .cc-form:focus-within { border-color: var(--neon-coral); background: rgba(14,12,16,.92); }
    .cc-form:focus-within { box-shadow: 0 0 0 4px rgba(20,9,10,.28); background: #0A0A0D; }
    .cc-input {
      font-size: 18px;
      font-weight: 500;
      letter-spacing: -.01em;
      min-height: 48px;
      padding: 0;
      color: #fff;
      text-align: left;
      caret-color: var(--neon-coral);
    }
    .cc-input::placeholder { color: rgba(255,255,255,.45); }
    .cc-submit {
      position: relative;
      width: auto;
      height: 52px;
      padding: 0 22px;
      border: 0;
      border-radius: 6px;
      color: #1A0B08;
      font-weight: 800;
      font-size: 16px;
      background: var(--neon-coral);
      box-shadow: none;
      transition: transform .3s var(--ease-out), box-shadow .3s var(--ease-out), background .3s var(--ease-out);
    }
    .cc-submit:hover { transform: none; background: #F45C45; box-shadow: none; }
    .cc-submit:active { transform: scale(.98); }
    .cc-submit:hover { filter: none; background: #fff; transform: none; }
    /* кнопка просыпается на первом символе */
    .cc-submit.is-asleep { background: rgba(255,255,255,.16); color: rgba(255,255,255,.72); box-shadow: none; }
    .cc-submit.is-awake { animation: ccWake .5s cubic-bezier(.2,1.5,.4,1) both; }
    @keyframes ccWake {
      0%   { transform: scale(1); box-shadow: 0 0 0 0 rgba(255,209,102,.7); }
      45%  { transform: scale(1.07); box-shadow: 0 0 0 12px rgba(255,209,102,0); }
      100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255,209,102,0); }
    }
    .cc-caret {
      display: inline-block;
      width: 2px;
      height: 1.05em;
      margin-left: 2px;
      background: #FFD166;
      vertical-align: -.15em;
      animation: ccBlink 1s steps(1) infinite;
    }
    @keyframes ccBlink { 50% { opacity: 0; } }
    .cc-typed {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      padding: 0;
      pointer-events: none;
      font: inherit;
      font-size: clamp(17px, 1.6vw, 24px);
      font-weight: 500;
      color: #8A8A94;
      white-space: nowrap;
      overflow: hidden;
    }
    .cc-input-wrap { position: relative; flex: 1 1 auto; min-width: 0; }
    .cc-input.is-ghost::placeholder { color: transparent; }
    @media (prefers-reduced-motion: reduce) {
      .cc-caret { animation: none; }
      .cc-submit.is-awake { animation: none; }
    }
    .cc-submit svg { width: 20px; height: 20px; }
    .cc-chips { gap: 8px; margin-top: 18px; flex-wrap: wrap; overflow: visible; }
    .cc-chip {
      min-height: 38px;
      padding: 9px 15px;
      border: 2px solid rgba(20,9,10,.55);
      border-radius: 999px;
      background: transparent;
      color: #14090A;
      font-size: 13px;
      font-weight: 700;
      transform: none;
    }
    .cc-chip:hover { background: #14090A; border-color: #14090A; color: #fff; transform: none; }
    .cc-privacy {
      margin-top: 22px;
      padding-top: 0;
      border-top: 0;
      color: rgba(20,9,10,.68);
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10.5px;
      letter-spacing: .14em;
      text-transform: uppercase;
    }
    .cc-privacy svg { width: 13px; height: 13px; opacity: .7; }
    .cc-thread { background: rgba(10,10,13,.9); border-radius: 14px; padding: 16px; margin-top: 18px; }
    .cc-shell.is-chatting .sbsteps { display: none; }

    /* Цифры - единая панель с колонками */
    .stats-band { padding: 26px 0 64px; }
    .sb-claim {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      margin: 0 auto 22px;
      font-size: clamp(18px, 2.2vw, 34px);
      font-weight: 900;
      letter-spacing: -.04em;
      color: #fff;
      text-align: center;
    }
    .sb-claim b { color: var(--neon-coral); font-weight: 900; }
    .sb-claim-dot {
      width: 8px; height: 8px;
      border-radius: 50%;
      background: var(--neon-coral);
      box-shadow: 0 0 16px var(--neon-coral);
      flex: 0 0 auto;
      animation: vwClaimPulse 2s ease-in-out infinite;
    }
    .sb-box { display: flex; justify-content: center; }
    .sb-line {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 0;
      width: 100%;
      max-width: 1400px;
      border-radius: 14px;
      border: 1px solid rgba(255,255,255,.12);
      background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
      backdrop-filter: blur(20px) saturate(1.15);
      overflow: hidden;
    }
    .sb-unit {
      position: relative;
      display: grid;
      justify-items: center;
      align-content: center;
      gap: 6px;
      padding: 22px 14px;
      transition: background .3s ease;
    }
    .sb-unit + .sb-unit::before {
      content: '';
      position: absolute;
      left: 0; top: 18px; bottom: 18px;
      width: 1px;
      background: rgba(255,255,255,.1);
    }
    .sb-unit:hover { background: rgba(255,255,255,.04); }
    .sb-unit b {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: clamp(20px, 2.1vw, 32px);
      font-weight: 900;
      letter-spacing: -.045em;
      color: #fff;
      font-variant-numeric: tabular-nums;
      line-height: 1;
    }
    .sb-unit i {
      font-style: normal;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9.5px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: rgba(255,255,255,.42);
      white-space: nowrap;
    }
    .sb-unit-live { background: rgba(255,59,33,.07); }
    .sb-unit-live b { color: var(--neon-coral); }
    .sb-unit-live i { color: rgba(255,138,110,.75); }
    .live-dot {
      width: 7px; height: 7px;
      border-radius: 50%;
      background: var(--neon-coral);
      box-shadow: 0 0 12px var(--neon-coral);
      animation: vwClaimPulse 2s ease-in-out infinite;
    }
    @media (max-width: 900px) {
      .sb-line { grid-template-columns: repeat(2, 1fr); }
      .sb-unit { padding: 16px 10px; }
      .sb-unit:nth-child(odd)::before { display: none; }
      .sb-unit:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.1); }
      .sb-unit-live { grid-column: span 2; }
    }

    /* Блок «А что снимаете вы» - стена телефонов, реагирующая на курсор */
    .pw-wall {
      display: grid;
      grid-template-columns: repeat(8, 1fr);
      gap: 12px;
      perspective: 1200px;
      perspective-origin: 50% 40%;
    }
    .pw-phone {
      position: relative;
      padding: 0;
      border: 0;
      background: none;
      color: inherit;
      font: inherit;
      cursor: pointer;
      transform-style: preserve-3d;
      transition: transform .5s cubic-bezier(.2,.9,.25,1), z-index 0s;
      z-index: 1;
    }
    .pw-body {
      position: relative;
      display: block;
      aspect-ratio: 9 / 19.5;
      border-radius: 14px;
      overflow: hidden;
      background: #0C0C11;
      border: 3px solid #16161C;
      box-shadow:
        0 14px 30px rgba(0,0,0,.55),
        0 0 0 1px rgba(255,255,255,.1);
      transition: box-shadow .45s ease, border-color .45s ease;
    }
    .pw-notch {
      position: absolute;
      left: 50%; top: 6px;
      transform: translateX(-50%);
      width: 34px; height: 4px;
      border-radius: 24px;
      background: rgba(0,0,0,.85);
      z-index: 3;
    }
    .pw-body video {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      filter: brightness(.5) saturate(.9);
      transition: filter .45s ease;
    }

    /* соседи расступаются */
    .pw-wall:hover .pw-phone { transform: scale(.94); }
    .pw-wall .pw-phone:hover {
      z-index: 6;
      transform: scale(1.34) translateZ(70px) rotateY(-11deg) rotateX(4deg);
    }
    .pw-wall .pw-phone:hover + .pw-phone { transform: scale(.9) translateX(16px); }
    .pw-phone:hover .pw-body {
      border-color: #24242C;
      box-shadow:
        0 40px 80px rgba(0,0,0,.75),
        0 0 0 1px rgba(255,59,48,.5),
        0 0 60px rgba(255,59,48,.28);
    }
    .pw-phone:hover .pw-body video { filter: brightness(1.06) saturate(1.12); }

    /* звуковая волна */
    .pw-wave {
      position: absolute;
      left: 8px; right: 8px; bottom: 10px;
      height: 26px;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      gap: 2px;
      z-index: 4;
      opacity: 0;
      transform: translateY(6px);
      transition: opacity .3s ease, transform .3s ease;
    }
    .pw-phone:hover .pw-wave { opacity: 1; transform: none; }
    .pw-wave i {
      width: 2px;
      height: 20%;
      border-radius: 24px;
      background: var(--neon-coral);
      box-shadow: 0 0 8px rgba(255,59,48,.7);
      animation: pwBeat 1s ease-in-out infinite;
      animation-play-state: paused;
      animation-delay: calc(var(--k) * -.08s);
    }
    .pw-phone:hover .pw-wave i { animation-play-state: running; }
    @keyframes pwBeat {
      0%, 100% { height: 18%; }
      35%      { height: 88%; }
      60%      { height: 42%; }
      80%      { height: 70%; }
    }

    /* подпись */
    .pw-cap {
      position: absolute;
      left: 0; right: 0; bottom: 0;
      z-index: 3;
      display: grid;
      gap: 6px;
      padding: 34px 10px 12px;
      text-align: center;
      background: linear-gradient(0deg, rgba(5,5,7,.95), transparent);
    }
    .pw-cap b {
      font-size: 11.5px;
      font-weight: 800;
      letter-spacing: -.015em;
      color: rgba(255,255,255,.85);
      transition: color .3s ease, font-size .4s ease;
    }
    .pw-cap em {
      font-style: normal;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 8px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: #fff;
      background: var(--neon-coral);
      border-radius: 6px;
      padding: 4px 7px;
      justify-self: center;
      opacity: 0;
      transform: translateY(5px);
      transition: opacity .3s ease, transform .3s ease;
    }
    .pw-phone:hover .pw-cap b { color: #fff; font-size: 12.5px; }
    .pw-phone:hover .pw-cap em, .pw-phone:focus-visible .pw-cap em { opacity: 1; transform: none; }
    .pw-phone:hover .pw-cap { padding-bottom: 42px; }
    .pw-phone.is-taken .pw-cap em { opacity: 1; transform: none; background: #fff; color: #14090A; }

    /* призыв под стеной телефонов */
    .pw-ticket {
      position: relative;
      display: flex;
      align-items: stretch;
      margin-top: 24px;
      border-radius: 10px;
      background: linear-gradient(115deg, #17171C 0%, #101015 55%, #0B0B0F 100%);
      box-shadow: 0 22px 50px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
      overflow: hidden;
      transform: rotate(-.5deg);
      transition: transform .45s cubic-bezier(.2,.8,.2,1);
    }
    .pw-ticket:hover { transform: rotate(0deg) translateY(-3px); }
    .pw-ticket-stub {
      position: relative;
      flex: 0 0 auto;
      display: grid;
      place-content: center;
      gap: 2px;
      padding: 20px 22px;
      text-align: center;
      background: var(--neon-coral);
      color: #fff;
    }
    .pw-ticket-num { display: block; font-size: 30px; font-weight: 800; letter-spacing: -.05em; line-height: 1; }
    .pw-ticket-word {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 8.5px;
      letter-spacing: .22em;
      text-transform: uppercase;
      opacity: .85;
    }
    .pw-ticket-stub::after {
      content: '';
      position: absolute;
      right: -1px; top: 0; bottom: 0;
      width: 2px;
      background: repeating-linear-gradient(180deg, rgba(255,255,255,.85) 0 6px, transparent 6px 12px);
    }
    .pw-ticket-body {
      flex: 1;
      display: grid;
      align-content: center;
      gap: 6px;
      padding: 18px 26px;
      min-width: 260px;
    }
    .pw-ticket-kicker {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9px;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--neon-coral);
    }
    .pw-ticket-body b { font-size: 19px; font-weight: 800; letter-spacing: -.03em; color: #fff; }
    .pw-ticket-body span { font-size: 13px; color: rgba(255,255,255,.5); }
    .pw-ticket-btn {
      flex: 0 0 auto;
      align-self: stretch;
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 0 30px;
      background: rgba(255,255,255,.06);
      border-left: 2px dashed rgba(255,255,255,.16);
      color: #fff;
      font-size: 14px;
      font-weight: 700;
      text-decoration: none;
      white-space: nowrap;
      transition: background .3s ease, gap .3s ease;
    }
    .pw-ticket-btn svg { width: 18px; height: 18px; }
    .pw-ticket-btn:hover { background: var(--neon-coral); gap: 14px; }
    @media (max-width: 760px) {
      .pw-ticket { flex-wrap: wrap; transform: none; }
      .pw-ticket-stub { flex: 1 0 100%; display: flex; align-items: baseline; justify-content: center; gap: 8px; padding: 12px; }
      .pw-ticket-stub::after { display: none; }
      .pw-ticket-num { font-size: 20px; }
      .pw-ticket-btn { flex: 1 0 100%; justify-content: center; padding: 16px; border-left: 0; border-top: 2px dashed rgba(255,255,255,.16); }
    }

    @media (max-width: 1200px) { .pw-wall { grid-template-columns: repeat(4, 1fr); } }
    @media (max-width: 640px) {
      .pw-wall { grid-template-columns: repeat(2, 1fr); }
      .pw-wall:hover .pw-phone, .pw-wall .pw-phone:hover, .pw-wall .pw-phone:hover + .pw-phone { transform: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .pw-phone, .pw-wall:hover .pw-phone { transform: none !important; }
      .pw-wave i { animation: none; }
    }

    /* ЕДИНАЯ ТИПОГРАФИКА СЕКЦИЙ (перенести в шаблон вместе с :root) */
    .lv4 section h2:not(#sd-heading):not(.cc-title) {
      font-size: var(--t-h2) !important;
      font-weight: 800;
      letter-spacing: -.035em !important;
      line-height: 1.06 !important;
    }
    .lv4 section h3:not(.rc-title):not(.hrc-title) {
      font-size: var(--t-h3);
      font-weight: 800;
      letter-spacing: -.025em;
    }
    .af-title { font-size: var(--t-display) !important; }

    /* Компактные заголовки новых секций - перебиваем правило .lv4 со !important */
    .lv4 section h2#how-heading,
    .lv4 section h2#sbfeat-heading,
    .lv4 section h2#task-heading {
      font-size: clamp(22px, 2.1vw, 30px) !important;
      font-weight: 800;
      letter-spacing: -.035em !important;
      line-height: 1.1 !important;
    }

    @media (max-width: 860px) {
      .faq-section .faq-grid { grid-template-columns: 1fr !important; }
    }
    /* заглушки: место под вашу точную формулировку */
    .faq-section .answer i {
      font-style: normal;
      display: inline-block;
      padding: 2px 7px;
      margin-top: 4px;
      border-radius: 6px;
      border: 1px dashed rgba(255,59,33,.55);
      color: var(--neon-coral);
      font-size: 13px;
    }
    .faq-section .answer b { color: #fff; font-weight: 700; }

    /* Блок «Всё, что есть в сториборде» - облако чипов */


    /* Подвал на фирменном оранжевом (перенести в _footer_v3.html.erb) */
    .site-footer,
    .site-footer p,
    .site-footer div,
    .site-footer span,
    .site-footer li {
      color: #14090A !important;
      font-size: 15px !important;
      font-weight: 600 !important;
      line-height: 1.6 !important;
      letter-spacing: -.01em;
    }
    .site-footer a {
      color: #14090A !important;
      font-weight: 600;
      text-decoration: none;
      transition: opacity .2s ease;
    }
    .site-footer a:hover { opacity: .62; }
    .site-footer h3, .site-footer h4, .site-footer strong, .site-footer b {
      color: #0E0605 !important;
      font-weight: 800 !important;
      letter-spacing: -.02em;
    }
    .site-footer { border-top: 1px solid rgba(20,16,12,.12) !important; }
    .site-footer [style*="background: rgba(255,255,255,0.05)"] {
      background: rgba(20,9,10,.06) !important;
      border-color: rgba(20,9,10,.14) !important;
    }
    .site-footer [style*="border-top"] { border-top-color: rgba(20,9,10,.14) !important; }
    .site-footer svg { color: #14090A !important; }

    /* FAQ - поочерёдная белая подсветка */
    .faq-grid > .glass-card {
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      height: 100%;
      transition: background .5s ease, border-color .5s ease, box-shadow .5s ease, transform .4s var(--ease-out);
    }
    .faq-grid > .glass-card.is-lit {
      background: rgba(255,255,255,.1);
      border-color: rgba(255,255,255,.4);
      box-shadow: 0 0 0 1px rgba(255,255,255,.16), 0 18px 44px rgba(0,0,0,.45);
      transform: translateY(-3px);
    }
    .faq-grid > .glass-card:hover {
      background: rgba(255,255,255,.08);
      border-color: rgba(255,255,255,.3);
    }
    @media (prefers-reduced-motion: reduce) {
      .faq-grid > .glass-card { transition: none; }
    }

    /* Финальный CTA - на фоне страницы */
    .final-cta { padding: 88px 0 110px; }
    .fc-box { text-align: center; max-width: 720px; margin: 0 auto; }
    .fc-kick {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10.5px;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--neon-coral);
      margin-bottom: 26px;
    }
    .lv4 section h2#fc-heading, #finalCta h2 {
      color: #fff !important;
      font-size: clamp(32px, 4.2vw, 64px) !important;
      font-weight: 900;
      letter-spacing: -.05em !important;
      line-height: .98 !important;
      margin: 0 0 16px !important;
    }
    .fc-lead { margin: 0 auto 34px; max-width: 52ch; font-size: 16px; color: rgba(255,255,255,.6); }
    .fc-btn {
      display: inline-block;
      padding: 24px 68px;
      border-radius: 6px;
      background: var(--neon-coral);
      color: #fff;
      font-size: clamp(18px, 1.9vw, 24px);
      font-weight: 800;
      letter-spacing: -.02em;
      text-decoration: none;
      box-shadow: 0 18px 48px rgba(255,59,33,.4);
      transition: transform .25s var(--ease-out), background .25s ease, box-shadow .25s ease;
    }
    .fc-btn:hover { transform: translateY(-3px); background: #FF6446; box-shadow: 0 24px 60px rgba(255,59,33,.55); }
    .fc-btn:active { transform: translateY(0); }
    .fc-note {
      margin-top: 22px;
      color: rgba(255,255,255,.4);
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10.5px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: rgba(20,16,12,.5);
    }

    /* Блок «Что о нас говорят» - витрина телефонов */
    .rv-band { padding-top: 96px; padding-bottom: 104px; }
    .rv-head { text-align: center; margin-bottom: 48px; }
    .lv4 section h2#rv-heading, #reviews h2 {
      font-size: clamp(22px, 3.5vw, 72px) !important;
      white-space: nowrap;
      font-weight: 900;
      letter-spacing: -.05em !important;
      line-height: .98 !important;
      margin: 16px 0 0 !important;
      text-wrap: balance;
    }
    .rv-head p { margin: 22px auto 0; max-width: none; white-space: nowrap; font-size: clamp(13px, 1.55vw, 26px); font-weight: 800; letter-spacing: -.035em; line-height: 1.3; color: #FFFFFF; text-shadow: 0 2px 18px rgba(0,0,0,.6); }
    @media (max-width: 860px) { .rv-head p { white-space: normal; max-width: 46ch; } }

    /* Витрина отзывов - плоские кадры 9:16 в ровной сетке */
    .rv-link {
      display: inline-block;
      margin-top: 8px;
      color: var(--neon-coral);
      font-size: .78em;
      font-weight: 800;
      letter-spacing: -.02em;
      text-decoration: underline;
      text-decoration-thickness: 2px;
      text-underline-offset: 6px;
      text-decoration-color: rgba(255,59,33,.45);
      transition: color .2s ease, text-decoration-color .2s ease;
    }
    .rv-link:hover { color: #fff; text-decoration-color: #fff; }

    .rv-shelf {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
      align-items: start;
      max-width: 1400px;
      margin: 0 auto;
      perspective: none;
      padding-bottom: 0;
    }
    .rv-slot { width: auto; transition: transform .35s cubic-bezier(.2,.8,.2,1); }
    .rv-slot:hover { transform: translateY(-6px); z-index: 5; }

    .rv-ph {
      position: relative;
      aspect-ratio: 9 / 16;
      border-radius: 14px;
      padding: 0;
      overflow: hidden;
      background: #0C0C11;
      border: 1px solid rgba(255,255,255,.1);
      box-shadow: none;
      transition: border-color .35s ease, box-shadow .35s ease;
    }
    .rv-slot:hover .rv-ph { border-color: rgba(255,255,255,.26); box-shadow: 0 18px 44px rgba(0,0,0,.5); }
    .rv-btn, .rv-island, .rv-top { display: none !important; }
    .rv-btn { position: absolute; background: #2A2A31; border-radius: 6px; }
    .rv-vol { left: -2px; top: 88px; width: 3px; height: 26px; }
    .rv-vol2 { left: -2px; top: 122px; width: 3px; height: 26px; }
    .rv-pw { right: -2px; top: 104px; width: 3px; height: 40px; }
    .rv-screen { position: relative; height: 100%; border-radius: 0; overflow: hidden; background: #000; }
    .rv-screen video { width: 100%; height: 100%; object-fit: cover; filter: brightness(.72); transition: filter .35s ease; }
    .rv-slot:hover .rv-screen video { filter: brightness(1); }
    .rv-island { position: absolute; left: 50%; top: 9px; transform: translateX(-50%); width: 32%; height: 16px; border-radius: 999px; background: #000; z-index: 3; }
    .rv-ui { position: absolute; inset: 0; z-index: 2; pointer-events: none; display: flex; flex-direction: column; justify-content: flex-end; }
    /* инфографика Reels поверх кадра */
    .rv-hud {
      position: absolute;
      left: 0; right: 0; top: 0;
      z-index: 3;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 12px 12px 0;
      pointer-events: none;
    }
    .rv-hud-label {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: rgba(255,255,255,.9);
      text-shadow: 0 1px 6px rgba(0,0,0,.8);
    }
    .rv-hud-cam { display: flex; align-items: center; gap: 4px; }
    .rv-hud-cam i {
      width: 5px; height: 5px;
      border-radius: 50%;
      background: var(--neon-coral);
      display: block;
      box-shadow: 0 0 8px var(--neon-coral);
    }
    .rv-side {
      position: absolute;
      right: 10px; bottom: 84px;
      z-index: 3;
      display: grid;
      gap: 14px;
      justify-items: center;
      pointer-events: none;
    }
    .rv-side b {
      display: grid;
      justify-items: center;
      gap: 3px;
      font-size: 9px;
      font-weight: 700;
      color: rgba(255,255,255,.92);
      text-shadow: 0 1px 6px rgba(0,0,0,.8);
    }
    .rv-side svg { width: 19px; height: 19px; display: block; filter: drop-shadow(0 1px 4px rgba(0,0,0,.7)); }
    .rv-bar {
      position: absolute;
      left: 12px; right: 12px; bottom: 8px;
      z-index: 3;
      height: 2px;
      border-radius: 99px;
      background: rgba(255,255,255,.28);
      overflow: hidden;
      pointer-events: none;
    }
    .rv-bar i { display: block; height: 100%; width: 38%; background: #fff; border-radius: 99px; }
    .rv-slot:hover .rv-bar i { animation: rvBar 6s linear forwards; }
    @keyframes rvBar { from { width: 0; } to { width: 100%; } }
    .rv-bot { padding-bottom: 22px; }
    .rv-top { padding: 34px 12px 0; text-align: center; font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 9px; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.85); }
    .rv-bot { padding: 16px 14px 14px; background: linear-gradient(0deg, rgba(0,0,0,.88), transparent); }
    .rv-user { display: flex; align-items: center; gap: 7px; margin-bottom: 6px; }
    .rv-ava { width: 22px; height: 22px; border-radius: 50%; background: linear-gradient(135deg, var(--neon-coral), #FF8A5C); display: grid; place-items: center; font-size: 10px; font-weight: 900; }
    .rv-user b { font-size: 11.5px; font-weight: 800; }
    .rv-cap { margin: 0; font-size: 12px; line-height: 1.45; color: rgba(255,255,255,.78); }
    .rv-play {
      position: absolute; left: 50%; top: 50%;
      transform: translate(-50%, -50%);
      z-index: 4;
      width: 46px; height: 46px;
      border: 0; border-radius: 6px;
      background: rgba(255,255,255,.92);
      color: #0A0A0D;
      font-size: 13px;
      cursor: pointer;
      display: grid; place-items: center;
      box-shadow: 0 10px 26px rgba(0,0,0,.5);
      transition: transform .25s cubic-bezier(.2,.8,.2,1), background .25s ease, opacity .25s ease;
    }
    .rv-slot:hover .rv-play { transform: translate(-50%,-50%) scale(1.08); background: var(--neon-coral); color: #fff; }
    .rv-ph.is-playing .rv-play { opacity: 0; }
    .rv-meta { margin-top: 12px; text-align: left; }
    .rv-meta b { display: block; font-size: 13.5px; font-weight: 800; }
    .rv-meta span { display: block; font-size: 11.5px; color: rgba(255,255,255,.42); }

    .rv-strip { display: flex; justify-content: center; gap: 26px; flex-wrap: wrap; margin-top: 36px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); }
    .rv-st b { font-size: 20px; font-weight: 900; letter-spacing: -.03em; margin-right: 8px; }
    .rv-st span { font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.42); }
    @media (max-width: 1100px) { .rv-shelf { grid-template-columns: repeat(3, 1fr); } }
    @media (max-width: 700px) { .rv-shelf { grid-template-columns: repeat(2, 1fr); } }

    /* Блок «Всё, что есть на Doitong» - бегущая стена возможностей */
    .all-feat {
      position: relative;
      padding: 104px 0 112px;
      text-align: left;
      overflow: hidden;
    }

    .af-head {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 32px;
      flex-wrap: wrap;
      margin-bottom: 40px;
    }
    .lv4 section h2.af-title,
    .af-title {
      font-size: clamp(28px, 3.6vw, 56px) !important;
      font-weight: 900;
      letter-spacing: -.04em !important;
      line-height: .96 !important;
      margin: 0 !important;
      max-width: none;
      white-space: nowrap;
    }
    .af-title em {
      font-style: normal;
      color: var(--neon-coral);
    }
    .af-sub {
      display: flex;
      align-items: center;
      gap: 12px;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10.5px;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: rgba(255,255,255,.42);
    }
    .af-sub b { color: #fff; font-size: 20px; letter-spacing: -.03em; font-family: inherit; }

    /* дорожки */
    .af-cloud {
      display: grid;
      gap: 12px;
      max-width: none;
      margin: 0;


    }
    .af-row { display: flex; flex-wrap: wrap; gap: 12px; }
    .af-row .af-run:nth-child(2) { display: none; }

    .af-run {
      display: flex;
      flex: 1 1 auto;
      min-width: 0;
      flex-wrap: wrap;
      gap: 12px;
      padding-right: 12px;
      animation: none;
    }

    .af-chip {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 14px 22px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.1);
      background: rgba(255,255,255,.04);
      color: rgba(255,255,255,.72);
      font-size: 15px;
      font-weight: 600;
      letter-spacing: -.015em;
      text-decoration: none;
      white-space: nowrap;
      transition: background .22s ease, color .22s ease, border-color .22s ease, transform .22s var(--ease-out), box-shadow .22s ease;
    }
    /* модели крупнее и с точкой - иерархия внутри потока */
    .af-chip.is-model {
      font-size: 17px;
      font-weight: 800;
      color: #fff;
      background: rgba(255,255,255,.07);
      border-color: rgba(255,255,255,.16);
    }
    .af-chip.is-model::before {
      content: '';
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--neon-coral);
      box-shadow: 0 0 12px rgba(255,59,33,.9);
    }
    .af-chip.is-new { border-color: rgba(255,59,33,.5); }
    .af-chip.is-new::after {
      content: 'NEW';
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 8.5px;
      letter-spacing: .14em;
      padding: 3px 6px;
      border-radius: 6px;
      background: var(--neon-coral);
      color: #fff;
    }
    .af-chip:hover {
      background: var(--neon-coral);
      border-color: var(--neon-coral);
      color: #fff;
      transform: translateY(-3px);
      box-shadow: 0 12px 30px rgba(255,59,33,.35);
    }
    .af-chip:hover::before { background: #fff; box-shadow: none; }
    .af-foot {
      display: flex;
      align-items: center;
      gap: 18px;
      flex-wrap: wrap;
      margin-top: 40px;
    }
    @media (max-width: 700px) {
      .all-feat { padding: 64px 0 72px; }
      .af-chip { padding: 11px 16px; font-size: 13.5px; }
      .af-chip.is-model { font-size: 14.5px; }
      .af-cloud { gap: 9px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .af-run { animation: none; }
    }

    /* Тонкая бегущая строка с моделями */
    .models-line {
      position: relative;
      width: 100vw;
      max-width: none;
      margin-left: calc(50% - 50vw);
      width: calc(100vw - 60px);
      margin-left: calc(50% - 50vw + 30px);
      border: 1px solid rgba(255,255,255,.1);
      border-radius: 24px;
      background:
        radial-gradient(80% 160% at 12% 50%, rgba(255,59,48,.16), transparent 62%),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
      overflow: hidden;
    }
    .ml-viewport {
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
      mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    }
    .ml-track { display: flex; width: max-content; animation: mlRun 46s linear infinite; }
    .models-line:hover .ml-track { animation-play-state: paused; }
    @keyframes mlRun { to { transform: translateX(-50%); } }
    .ml-set { display: flex; align-items: center; gap: 34px; padding: 18px 18px; }
    .ml-label {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 11px;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--neon-coral);
      white-space: nowrap;
    }
    .ml-item {
      position: relative;
      font-size: 18px;
      font-weight: 700;
      letter-spacing: -.025em;
      color: rgba(255,255,255,.72);
      white-space: nowrap;
      transition: color .25s ease;
    }
    .ml-item::before {
      content: '';
      position: absolute;
      left: -19px; top: 50%;
      width: 4px; height: 4px;
      margin-top: -2px;
      border-radius: 50%;
      background: rgba(255,59,48,.55);
    }
    .ml-item:hover { color: #fff; }
    @media (prefers-reduced-motion: reduce) {
      .ml-track { animation: none; }
    }

    .lv4 section h2#case-heading {
      font-size: clamp(30px, 3vw, 46px) !important;
      font-weight: 800;
      letter-spacing: -.04em !important;
      line-height: 1.05 !important;
      color: #fff;
    }

    /* Блок Seedance 2.5 - тёмно-синяя полоса с логотипом и сеткой работ */
    .sd-band {
      position: relative;
      width: calc(100vw - 60px);
      max-width: none;
      margin: 76px 0 0 calc(50% - 50vw + 30px);
      padding: 40px max(24px, calc((100% - 1400px) / 2)) 0;
      border-radius: 24px;
      isolation: isolate;
      /* глубокая ночная база: тёмно-синий с тёплым краем, без банальной полосатой заливки */
      background:
        radial-gradient(58% 44% at 84% 2%, rgba(255,59,33,.3) 0%, transparent 62%),
        radial-gradient(52% 42% at 10% 6%, rgba(255,110,70,.16) 0%, transparent 64%),
        radial-gradient(92% 70% at 50% 112%, rgba(255,59,33,.24) 0%, transparent 68%),
        radial-gradient(120% 96% at 50% 46%, rgba(0,0,0,0) 44%, rgba(0,0,0,.72) 100%),
        linear-gradient(168deg, #14090A 0%, #0E0708 34%, #090506 66%, #050304 100%);
      box-shadow:
        0 50px 130px rgba(0,0,0,.75),
        0 0 0 1px rgba(255,59,33,.16),
        inset 0 1px 0 rgba(255,255,255,.12);
      overflow: hidden;
    }
    /* тёплая световая дуга по верхней кромке */
    .sd-band::before {
      content: '';
      position: absolute;
      left: 8%; right: 8%; top: 0;
      height: 1px;
      z-index: 0;
      background: linear-gradient(90deg, transparent, rgba(255,59,33,.85) 20%, rgba(255,200,180,.65) 52%, rgba(255,59,33,.8) 80%, transparent);
    }
    /* мелкое зерно - убирает «дешёвую» гладкость градиента */
    .sd-band::after {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      opacity: .4;
      mix-blend-mode: overlay;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.36'/%3E%3C/svg%3E");
    }
    .sd-band > * { position: relative; z-index: 1; }
    .sd-already {
      max-width: 1400px;
      margin: 0 auto 26px;
      text-align: center;
      font-size: clamp(16px, 1.6vw, 26px);
      font-weight: 900;
      letter-spacing: -.03em;
      color: rgba(255,246,240,.6);
    }
    .sd-head {
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      gap: 32px;
      max-width: 1400px;
      margin: 0 auto 44px;
    }
    .sd-claim {
      display: grid;
      gap: 4px;
      font-family: inherit;
      font-size: clamp(15px, 1.35vw, 20px);
      letter-spacing: -.025em;
      text-transform: none;
      line-height: 1.18;
      color: rgba(255,246,240,.78);
    }
    .sd-claim b { font-weight: 800; color: #FFF6EC; }
    .sd-claim b:last-child { color: rgba(20,16,12,.5); }
    .sd-claim-left { text-align: center; }
    .sd-claim-right { text-align: center; }
    .sd-logo { display: grid; justify-items: center; gap: 22px; }
    .lv4 section h2#sd-heading,
    #seedance h2 {
      margin: 0 !important;
      display: flex;
      align-items: baseline;
      gap: .22em;
      font-size: clamp(40px, 6.2vw, 92px) !important;
      font-weight: 900;
      letter-spacing: -.045em !important;
      line-height: .92 !important;
      color: #FFF6EC;
      text-shadow: 0 3px 0 rgba(120,32,18,.5), 0 16px 50px rgba(0,0,0,.6);
      white-space: nowrap;
    }
    #seedance h2 span { color: var(--neon-coral); }
    .sd-btn {
      padding: 15px 30px;
      border-radius: 6px;
      background: var(--neon-coral);
      color: #fff;
      font-size: 15px;
      font-weight: 800;
      letter-spacing: -.01em;
      text-decoration: none;
      transition: transform .25s var(--ease-out), box-shadow .25s var(--ease-out);
    }
    .sd-btn:hover { transform: translateY(-2px); background: #FF6446; box-shadow: 0 14px 32px rgba(255,59,33,.4); }
    .sd-grid {
      display: grid;
      grid-template-columns: repeat(8, 1fr);
      grid-template-rows: repeat(6, 92px);
      grid-auto-flow: dense;
      gap: 12px;
      max-width: 1400px;
      margin: 0 auto;
      padding-bottom: 64px;
    }
    .sd-cell {
      position: relative;
      border-radius: 10px;
      overflow: hidden;
      background: #1A0C0A;
      transition: transform .4s cubic-bezier(.2,.8,.2,1);
    }
    /* горизонтальные 16:9 */
    .sd-cell.sd-h { grid-column: span 2; grid-row: span 2; }
    /* вертикальные 9:16 */
    .sd-cell.sd-v { grid-column: span 1; grid-row: span 3; }
    /* крупный акцентный кадр */
    .sd-cell.sd-hero { grid-column: span 3; grid-row: span 3; }
    /* широкая полоса-кинокадр */
    .sd-cell.sd-w { grid-column: span 2; grid-row: span 1; }
    .sd-cell video {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      filter: brightness(.82) saturate(1.02);
      transition: filter .35s ease;
    }
    .sd-cell:hover { transform: translateY(-4px); z-index: 2; }
    .sd-cell:hover video { filter: brightness(1.06) saturate(1.12); }
    @media (max-width: 1000px) {
      .sd-head { grid-template-columns: 1fr; gap: 22px; }
      .sd-grid { grid-template-columns: repeat(4, 1fr); grid-template-rows: none; grid-auto-rows: 116px; padding-bottom: 40px; }
      .sd-cell { grid-area: auto !important; }
      .sd-cell.sd-v { grid-column: span 1; grid-row: span 3; }
      .sd-cell.sd-h { grid-column: span 2; grid-row: span 2; }
      .sd-cell.sd-w { grid-column: span 2; grid-row: span 1; }
      .sd-cell.sd-hero { grid-column: span 2; grid-row: span 3; }
    }

    /* Блок «Разбор проекта» - компактно: финал 16:9 + промпт + лента сцен */
    .ci-main { display: grid; grid-template-columns: 1.15fr 1fr; gap: 20px; align-items: stretch; isolation: isolate; width: 88%; margin: 0 auto; }
    .ci-final { z-index: 1; margin-left: -76px; margin-top: 38px; }
    .ci-final {
      position: relative;
      aspect-ratio: 16 / 9;
      border-radius: 14px;
      overflow: hidden;
      background: #0C0C11;
      border: 1px solid rgba(255,255,255,.12);
    }
    .ci-final video { width: 100%; height: 100%; object-fit: cover; display: block; }
    .ci-final-tag {
      position: absolute; left: 12px; bottom: 12px;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9.5px;
      letter-spacing: .14em;
      text-transform: uppercase;
      background: rgba(5,5,7,.78);
      backdrop-filter: blur(10px);
      padding: 6px 10px;
      border-radius: 6px;
    }
    /* Светлый фактурный фон третьего блока */
    #case-inside {
      position: relative;
      isolation: isolate;
      background: transparent;
      box-shadow: none;
    }
    #case-inside::before {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      opacity: 0;
      background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23p)' opacity='.55'/%3E%3C/svg%3E"),
        repeating-linear-gradient(96deg, rgba(120,100,70,.05) 0 2px, transparent 2px 5px);
      mix-blend-mode: multiply;
    }
    #case-inside::after {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background: none;
    }
    #case-inside > * { position: relative; z-index: 1; }
    .lv4 section.container#case-inside { padding-top: 112px !important; padding-bottom: 34px !important; }
    .lv4 section h2#case-heading {
      font-size: clamp(28px, 3.6vw, 52px) !important;
      font-weight: 700;
      letter-spacing: -.04em !important;
      line-height: 1.05 !important;
      color: #FFFFFF !important;
      text-shadow: 0 4px 30px rgba(0,0,0,.95);
    }
    /* Лента как дорогая киноплёнка: тёплая перфорация, кожаный корешок, лак */
    #case-inside .ci-strip {
      position: relative;
      border-color: rgba(38,30,20,.5);
      padding: 26px 16px;
      background:
        /* перфорация сверху */
        repeating-linear-gradient(90deg, transparent 0 14px, rgba(38,30,20,.9) 14px 24px, transparent 24px 40px) top / 100% 12px no-repeat,
        /* перфорация снизу */
        repeating-linear-gradient(90deg, transparent 0 14px, rgba(38,30,20,.9) 14px 24px, transparent 24px 40px) bottom / 100% 12px no-repeat,
        /* лаковый блик */
        linear-gradient(168deg, rgba(255,255,255,.92) 0%, rgba(246,241,231,.9) 40%, rgba(232,224,208,.92) 100%);
      box-shadow:
        0 22px 46px rgba(0,0,0,.45),
        inset 0 1px 0 rgba(255,255,255,.9),
        inset 0 -18px 30px -18px rgba(60,45,25,.35);
    }
    /* тёмные кромки плёнки с тиснением */
    #case-inside .ci-strip::before,
    #case-inside .ci-strip::after {
      content: '';
      position: absolute;
      left: 0; right: 0;
      height: 12px;
      z-index: 0;
      background: linear-gradient(180deg, rgba(38,30,20,.14), rgba(38,30,20,.04));
      pointer-events: none;
    }
    #case-inside .ci-strip::before { top: 0; border-bottom: 1px solid rgba(38,30,20,.22); }
    #case-inside .ci-strip::after { bottom: 0; border-top: 1px solid rgba(38,30,20,.22); }
    #case-inside .ci-strip > * { position: relative; z-index: 1; }
    /* кадры на плёнке: тёмная окантовка вместо белой */
    #case-inside .ci-strip .ci-scene {
      border-color: rgba(38,30,20,.55);
      box-shadow: 0 6px 16px rgba(38,30,20,.28), inset 0 0 0 1px rgba(255,255,255,.14);
    }
    #case-inside .ci-strip .ci-label { color: rgba(20,15,10,.55); }
    #case-inside .ci-final { border-color: rgba(60,48,30,.18); box-shadow: 0 24px 50px rgba(60,48,30,.28); }
    #case-inside .ci-scene { border-color: rgba(255,255,255,.12); }

    /* Панель промпта - киношная хлопушка */
    .ci-side {
      position: relative;
      display: flex;
      flex-direction: column;
      padding: 0 20px 18px;
      border: 0;
      border-radius: 6px;
      background: linear-gradient(180deg, #16161A 0%, #0D0D10 100%);
      box-shadow: 0 26px 54px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.08);
      overflow: visible;
      transform: rotate(-1.2deg);
      transition: transform .5s cubic-bezier(.2,.8,.2,1);
    }
    .ci-side { margin-left: 38px; }
    .ci-side:hover { transform: rotate(0deg) translateY(-4px); }
    .ci-clap {
      position: absolute;
      left: 0; right: 0; top: 0;
      height: 40px;
      border-radius: 6px 6px 2px 2px;
      background: repeating-linear-gradient(72deg, #F2F2F2 0 26px, #131317 26px 52px);
      box-shadow: 0 4px 12px rgba(0,0,0,.5);
      transform-origin: 6% 100%;
      transform: rotate(-15deg);
      z-index: 3;
    }
    /* крышка стучит сама, чаще - при наведении */
    .ci-in .ci-clap { animation: ciClapIdle 4.5s ease-in-out .6s infinite; }
    @keyframes ciClapIdle {
      0%   { transform: rotate(-15deg); }
      12%  { transform: rotate(1.5deg); }
      19%  { transform: rotate(-4deg); }
      26%  { transform: rotate(.8deg); }
      36%  { transform: rotate(-15deg); }
      100% { transform: rotate(-15deg); }
    }
    .ci-side:hover .ci-clap { animation: ciClapHover .7s cubic-bezier(.25,.9,.3,1); }
    @keyframes ciClapHover {
      0%   { transform: rotate(-15deg); }
      34%  { transform: rotate(1.5deg); }
      52%  { transform: rotate(-4deg); }
      70%  { transform: rotate(.8deg); }
      100% { transform: rotate(-15deg); }
    }
    .ci-side::before {
      content: '';
      position: absolute;
      left: 0; right: 0; top: 40px;
      height: 16px;
      background: repeating-linear-gradient(72deg, #F2F2F2 0 26px, #131317 26px 52px);
      opacity: .95;
      z-index: 1;
    }
    .ci-slate {
      position: relative;
      z-index: 2;
      margin-top: 64px;
      display: flex;
      flex-direction: column;
      flex: 1;
    }
    .ci-slate-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      border: 1px solid rgba(255,255,255,.16);
      border-radius: 6px;
      margin-bottom: 14px;
    }
    .ci-slate-cell { padding: 8px 10px; border-right: 1px solid rgba(255,255,255,.16); }
    .ci-slate-cell:last-child { border-right: 0; }
    .ci-slate-cell b {
      display: block;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 8.5px;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: rgba(255,255,255,.38);
      margin-bottom: 3px;
    }
    .ci-slate-cell span { font-family: 'Segoe Script', 'Bradley Hand', 'Snell Roundhand', cursive; font-size: 15px; color: #fff; }
    .ci-side .ci-label-lead {
      font-family: inherit;
      font-size: clamp(20px, 1.8vw, 27px);
      font-weight: 900;
      letter-spacing: -.03em;
      line-height: 1.14;
      text-transform: none;
      color: var(--neon-coral);
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .ci-side .ci-label {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 8.5px;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: rgba(255,255,255,.38);
    }
    /* промпт мелом */
    .ci-text {
      margin: 8px 0 14px;
      padding: 0;
      border: 0;
      font-family: 'Segoe Script', 'Bradley Hand', 'Snell Roundhand', 'Brush Script MT', cursive;
      font-size: clamp(17px, 1.5vw, 21px);
      font-weight: 500;
      line-height: 1.45;
      color: #F4F4F0;
      text-shadow: 0 0 6px rgba(255,255,255,.18);
      transform: rotate(-.5deg);
      text-wrap: pretty;
      -webkit-mask-image: linear-gradient(90deg, #000 0 var(--ink, 0%), transparent var(--ink, 0%));
      mask-image: linear-gradient(90deg, #000 0 var(--ink, 0%), transparent var(--ink, 0%));
    }
    .ci-in .ci-text { animation: ciInk 2.4s cubic-bezier(.45,0,.2,1) .9s forwards; }
    @keyframes ciInk { from { --ink: 0%; } to { --ink: 108%; } }
    @property --ink { syntax: '<percentage>'; inherits: true; initial-value: 0%; }
    .ci-underline {
      display: block;
      height: 9px;
      margin: -8px 0 16px;
      background: no-repeat left center / 0% 100%
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 8' preserveAspectRatio='none'%3E%3Cpath d='M2 5 C 60 1, 120 8, 180 4 S 280 2, 298 5' fill='none' stroke='%23F04A32' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E");
      transition: background-size 1s cubic-bezier(.4,0,.2,1) 3.1s;
    }
    .ci-in .ci-underline { background-size: 100% 100%; }
    .ci-copy {
      align-self: flex-start;
      padding: 9px 15px;
      border-radius: 6px;
      border: 0;
      background: var(--neon-coral);
      color: #fff;
      font: inherit;
      font-size: 12px;
      font-weight: 700;
      cursor: pointer;
      transition: background .25s ease, transform .2s ease;
    }
    .ci-copy {
      position: relative;
      overflow: hidden;
      box-shadow: 0 6px 18px rgba(255,59,48,.34), 0 1px 0 rgba(255,255,255,.28) inset;
      animation: ciPulse 2.6s ease-in-out infinite;
    }
    @keyframes ciPulse {
      0%, 100% { box-shadow: 0 6px 18px rgba(255,59,48,.34), 0 0 0 0 rgba(255,59,48,.5), 0 1px 0 rgba(255,255,255,.28) inset; }
      50%      { box-shadow: 0 6px 18px rgba(255,59,48,.34), 0 0 0 7px rgba(255,59,48,0), 0 1px 0 rgba(255,255,255,.28) inset; }
    }
    /* блик пробегает по кнопке */
    .ci-copy::after {
      content: '';
      position: absolute;
      top: 0; bottom: 0; left: -40%;
      width: 34%;
      background: linear-gradient(105deg, transparent, rgba(255,255,255,.42) 50%, transparent);
      transform: skewX(-16deg);
      opacity: 0;
    }
    .ci-copy:hover::after { animation: ciSheen .75s ease forwards; }
    @keyframes ciSheen {
      0%   { left: -40%; opacity: 0; }
      20%  { opacity: 1; }
      100% { left: 110%; opacity: 0; }
    }
    .ci-copy:hover { background: #FF5A50; transform: translateY(-2px); animation-play-state: paused; }
    .ci-copy:active { transform: translateY(0) scale(.97); }
    .ci-copy.is-done { background: #fff; color: #14090A; animation: none; }
    .ci-side .ci-facts { border-top: 1px solid rgba(255,255,255,.14); }
    #case-inside .ci-side .ci-fact span { color: rgba(255,255,255,.45); }
    @media (prefers-reduced-motion: reduce) {
      .ci-side { transform: none; }
      .ci-clap, .ci-in .ci-clap, .ci-side:hover .ci-clap { transform: rotate(-15deg); animation: none; }
      .ci-text { -webkit-mask-image: none; mask-image: none; animation: none; }
      .ci-underline { background-size: 100% 100%; transition: none; }
    }
    .ci-label {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9.5px;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: rgba(255,255,255,.42);
    }
    .ci-facts { display: flex; gap: 22px; margin-top: auto; padding-top: 20px; flex-wrap: wrap; }
    .ci-fact { display: flex; flex-direction: column; gap: 2px; }
    .ci-fact b { font-size: 19px; font-weight: 800; letter-spacing: -.03em; color: var(--neon-coral); }
    .ci-fact span {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: rgba(255,255,255,.42);
    }
    .ci-strip {
      display: flex;
      align-items: center;
      gap: 18px;
      margin-top: 52px;
      padding: 12px 14px;
      border-radius: 10px;
      border: 1px solid rgba(255,255,255,.1);
      background: rgba(255,255,255,.02);
      flex-wrap: wrap;
    }
    .ci-scenes { display: flex; gap: 8px; flex: 1; min-width: 260px; perspective: 900px; }
    .ci-scene {
      position: relative;
      flex: 1;
      aspect-ratio: 16 / 10;
      border-radius: 10px;
      overflow: hidden;
      background: #0C0C11;
      border: 1px solid rgba(255,255,255,.1);
      transform-style: preserve-3d;
      /* появление: кадры «падают» на монтажный стол по очереди */
      opacity: 0;
      transform: translateY(22px) rotateX(26deg) scale(.94);
      transition:
        opacity .6s var(--ease-out),
        transform .7s cubic-bezier(.2,.9,.25,1),
        flex .55s cubic-bezier(.2,.8,.2,1),
        border-color .35s ease,
        box-shadow .45s ease;
      transition-delay: var(--d, 0s);
    }
    .ci-in-scenes .ci-scene { opacity: 1; transform: none; }
    /* активный кадр раздвигает соседей */
    .ci-scenes:hover .ci-scene { flex: .82; }
    .ci-scenes .ci-scene:hover {
      flex: 1.9;
      border-color: rgba(255,255,255,.35);
      box-shadow: 0 18px 42px rgba(0,0,0,.6), 0 0 0 1px rgba(255,59,48,.4);
      z-index: 2;
    }
    /* блик, пробегающий по кадру */
    .ci-scene::after {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 3;
      pointer-events: none;
      background: linear-gradient(105deg, transparent 38%, rgba(255,255,255,.22) 50%, transparent 62%);
      transform: translateX(-120%);
      transition: transform .8s cubic-bezier(.3,0,.2,1);
    }
    .ci-scene:hover::after { transform: translateX(120%); }
    .ci-scene img, .ci-scene video {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      filter: brightness(.68);
      transition: filter .35s ease, transform .45s cubic-bezier(.2,.8,.2,1);
    }
    .ci-scene:hover img, .ci-scene:hover video { filter: brightness(1.05); transform: scale(1.05); }
    .ci-scene-num, .ci-scene-dur {
      position: absolute;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9px;
      letter-spacing: .1em;
      padding: 3px 6px;
      border-radius: 6px;
    }
    .ci-scene-num, .ci-scene-dur {
      z-index: 4;
      transition: opacity .35s ease, transform .35s var(--ease-out);
    }
    .ci-scene-num { left: 6px; top: 6px; background: var(--neon-coral); color: #fff; }
    .ci-scene-dur { right: 6px; bottom: 6px; background: rgba(5,5,7,.75); color: rgba(255,255,255,.75); opacity: 0; transform: translateY(4px); }
    .ci-scene:hover .ci-scene-dur { opacity: 1; transform: none; }
    /* полоска «проигрывания» под активным кадром */
    .ci-scene::before {
      content: '';
      position: absolute;
      left: 0; right: 0; bottom: 0;
      height: 2px;
      z-index: 4;
      background: var(--neon-coral);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .4s ease;
    }
    .ci-scene:hover::before { transform: scaleX(1); transition: transform 2.4s linear; }
    .ci-cta {
      flex: 0 0 auto;
      padding: 12px 22px;
      border-radius: 6px;
      background: var(--neon-coral);
      color: #fff;
      font-size: 13px;
      font-weight: 700;
      text-decoration: none;
      white-space: nowrap;
    }
    /* Переключатель проектов на видео */
    .ci-nav {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 5;
      width: 52px; height: 52px;
      display: grid;
      place-items: center;
      border: 0;
      border-radius: 50%;
      background: var(--neon-coral);
      color: #fff;
      cursor: pointer;
      box-shadow: 0 10px 30px rgba(255,59,48,.5), inset 0 1px 0 rgba(255,255,255,.35);
      transition: transform .22s var(--ease-out), background .22s ease, box-shadow .22s ease;
    }
    .ci-nav:hover { background: #FF5A50; transform: translateY(-50%) scale(1.08); box-shadow: 0 16px 40px rgba(255,59,48,.62); }
    .ci-nav:active { transform: translateY(-50%) scale(.94); }
    .ci-nav svg { width: 22px; height: 22px; }
    .ci-nav-prev { left: 14px; }
    .ci-nav-next { right: 14px; }
    .ci-count {
      position: absolute;
      top: 14px; right: 14px;
      z-index: 5;
      padding: 7px 11px;
      border-radius: 6px;
      background: rgba(5,5,8,.78);
      backdrop-filter: blur(8px);
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10px;
      letter-spacing: .14em;
      color: rgba(255,255,255,.85);
    }
    .ci-count b { color: var(--neon-coral); }
    @media (max-width: 700px) {
      .ci-nav { width: 42px; height: 42px; }
      .ci-nav svg { width: 18px; height: 18px; }
    }
    .ci-final .ci-cta {
      position: absolute;
      left: 14px; bottom: 14px;
      z-index: 3;
    }
    .ci-final .ci-final-tag { left: auto; right: 14px; }
    .ci-cta {
      position: relative;
      overflow: hidden;
      box-shadow: 0 8px 22px rgba(255,59,48,.38), 0 1px 0 rgba(255,255,255,.26) inset;
      transition: background .25s var(--ease-out), transform .22s var(--ease-out), box-shadow .25s var(--ease-out);
      animation: ciPulse 2.6s ease-in-out infinite .4s;
    }
    .ci-cta::after {
      content: '';
      position: absolute;
      top: 0; bottom: 0; left: -40%;
      width: 34%;
      background: linear-gradient(105deg, transparent, rgba(255,255,255,.4) 50%, transparent);
      transform: skewX(-16deg);
      opacity: 0;
    }
    .ci-cta:hover::after { animation: ciSheen .75s ease forwards; }
    .ci-cta:hover {
      background: #FF5A50;
      transform: translateY(-2px);
      box-shadow: 0 14px 32px rgba(255,59,48,.5), 0 1px 0 rgba(255,255,255,.3) inset;
      animation-play-state: paused;
    }
    .ci-cta:active { transform: translateY(0) scale(.98); }
    @media (prefers-reduced-motion: reduce) {
      .ci-copy, .ci-cta { animation: none; }
      .ci-copy::after, .ci-cta::after { display: none; }
    }
    @media (max-width: 960px) {
      .ci-main { grid-template-columns: 1fr; width: 100%; }
      .ci-side { transform: rotate(-1deg); }
      .ci-strip { gap: 12px; }
      .ci-scenes:hover .ci-scene, .ci-scenes .ci-scene:hover { flex: 1; }
      .ci-final .ci-cta { width: auto; right: auto; max-width: calc(100% - 28px); text-align: center; }
    }

    /* Блок «Как собирается сториборд» - карты внахлёст с номерами */
    .sbnum-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
    .sbnum-card {
      position: relative;
      transition: transform .45s cubic-bezier(.2,.8,.2,1);
      opacity: 0;
      transform: translateY(26px);
      transition: opacity .8s var(--ease-out), transform .8s var(--ease-out);
      transition-delay: var(--d, 0s);
    }
    .sbnum-in .sbnum-card { opacity: 1; transform: none; }
    .sbnum-card:not(:first-child) { margin-left: -26px; }
    .sbnum-in .sbnum-card:hover { transform: translateY(-10px); z-index: 5; }
    .sbnum-ghost {
      position: absolute;
      left: -6px; top: -46px;
      font-size: 150px;
      font-weight: 800;
      letter-spacing: -.08em;
      line-height: 1;
      color: rgba(255,255,255,.055);
      pointer-events: none;
      transition: color .4s ease;
    }
    .sbnum-card:hover .sbnum-ghost { color: rgba(255,59,48,.22); }
    .sbnum-pic {
      position: relative;
      aspect-ratio: 3 / 4;
      border-radius: 14px;
      overflow: hidden;
      background: #0C0C11;
      border: 1px solid rgba(255,255,255,.12);
      box-shadow: 0 30px 70px rgba(0,0,0,.6);
    }
    .sbnum-pic video {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
      filter: brightness(.58);
      transition: filter .4s ease;
    }
    .sbnum-card:hover .sbnum-pic video { filter: brightness(1.05); }
    .sbnum-cap {
      position: absolute; left: 0; right: 0; bottom: 0;
      padding: 20px 16px 16px;
      background: linear-gradient(0deg, rgba(5,5,7,.95), transparent);
    }
    .sbnum-cap h3 { margin: 0; font-size: 17px; font-weight: 800; letter-spacing: -.02em; }
    .sbnum-card > p {
      margin: 16px 0 0;
      font-size: 13.5px;
      line-height: 1.55;
      color: rgba(255,255,255,.5);
      padding-right: 20px;
    }
    @media (max-width: 960px) {
      .sbnum-cards { grid-template-columns: repeat(2, 1fr); gap: 16px; }
      .sbnum-card:not(:first-child) { margin-left: 0; }
      .sbnum-ghost { font-size: 96px; top: -30px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .sbnum-card { opacity: 1; transform: none; transition: none; }
    }

    /* Приглашение под лидом: действие + бесплатное обучение */
    .hero-invite {
      display: inline-flex;
      align-items: center;
      gap: 14px;
      margin: 0 auto 22px;
      padding: 9px 9px 9px 18px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.18);
      background: rgba(12,12,18,.6);
      backdrop-filter: blur(16px);
      flex-wrap: wrap;
      justify-content: center;
    }
    .hero-invite-text {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10.5px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: rgba(255,255,255,.7);
    }
    .hero-invite-sep { width: 1px; height: 16px; background: rgba(255,255,255,.2); }
    .hero-invite-link {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 8px 16px;
      border-radius: 999px;
      background: var(--neon-coral);
      color: #fff;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: -.01em;
      text-decoration: none;
      transition: background .25s ease, transform .2s ease;
    }
    .hero-invite-link:hover { background: #FF6446; transform: translateY(-1px); }
    @media (max-width: 560px) {
      .hero-invite { gap: 10px; padding: 8px; }
      .hero-invite-sep { display: none; }
    }

    /* Четыре шага - единый рельс под строкой */
    .sbsteps {
      display: flex;
      flex-wrap: wrap;
      max-width: 100%;
      width: fit-content;
      margin-left: auto;
      margin-right: auto;
      align-items: stretch;
      gap: 0;
      margin: 22px auto 0;
      padding: 4px;
      border-radius: 6px;
      border: 1px solid rgba(255,255,255,.16);
      background: rgba(12,12,16,.7);
      backdrop-filter: blur(18px) saturate(1.2);
      box-shadow: 0 16px 44px rgba(0,0,0,.45);
    }
    .sbstep {
      position: relative;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 9px 18px;
      border: 0;
      border-radius: 6px;
      background: transparent;
      transition: background .45s var(--ease-out), color .45s var(--ease-out);
    }
    .sbstep + .sbstep::before {
      content: '';
      position: absolute;
      left: 0; top: 50%;
      transform: translateY(-50%);
      width: 1px; height: 16px;
      background: rgba(255,255,255,.12);
      transition: opacity .3s ease;
    }
    .sbstep.is-now::before,
    .sbstep.is-now + .sbstep::before { opacity: 0; }
    .sbstep-num {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10px;
      letter-spacing: .14em;
      color: rgba(255,255,255,.42);
      transition: color .45s ease;
    }
    .sbstep-name {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .11em;
      text-transform: uppercase;
      color: rgba(255,255,255,.6);
      white-space: nowrap;
      transition: color .45s ease;
    }
    .sbstep-bar { display: none; }
    .sbstep.is-now { background: var(--neon-coral); box-shadow: none; }
    .sbstep.is-now .sbstep-num { color: rgba(26,11,8,.65); }
    .sbstep.is-now .sbstep-name { color: #1A0B08; }
    .sbstep.is-done .sbstep-num { color: rgba(255,59,33,.7); }
    .sbstep.is-done .sbstep-name { color: rgba(255,59,33,.92); }
    @media (max-width: 700px) {
      .sbsteps { flex-wrap: wrap; border-radius: 6px; }
      .sbstep { padding: 8px 13px; }
      .sbstep + .sbstep::before { display: none; }
    }
    @media (max-width: 640px) {
      .hero-pill { font-size: 10px; letter-spacing: .12em; padding: 8px 12px; }
      .hero-pill-new { display: none; }
      .cc-shell { padding: 18px; border-radius: 24px; }
      .cc-form { min-height: 68px; padding: 10px 10px 10px 16px; }
      .cc-input { font-size: 16px; }
      .cc-submit { width: 46px; height: 46px; }
    }

    /* Заголовок агрегатора - крупный, перебивает все прежние правила */
    body .lv4 section#features h2#capabilities-heading,
    body section#features h2#capabilities-heading,
    #features h2#capabilities-heading,
    #features .cap-head h2 {
      white-space: nowrap !important;
      font-size: clamp(22px, 3.5vw, 72px) !important;
      line-height: 1.05 !important;
      letter-spacing: -.05em !important;
      font-weight: 900 !important;
      max-width: none;
      margin-left: auto !important;
      margin-right: auto !important;
      text-wrap: balance;
    }
    body .lv4 section#reviews h2#rv-heading,
    body section#reviews h2#rv-heading,
    #reviews h2#rv-heading,
    #reviews .rv-head h2 {
      font-size: clamp(22px, 3.5vw, 72px) !important;
      line-height: 1.05 !important;
      letter-spacing: -.05em !important;
      font-weight: 900 !important;
      white-space: nowrap !important;
      margin-left: auto !important;
      margin-right: auto !important;
    }
    .case-head { display: block; }
    .case-slogan {
      margin: 0 0 10px;
      font-size: clamp(15px, 1.7vw, 26px);
      font-weight: 900;
      letter-spacing: -.03em;
      color: var(--neon-coral);
      white-space: nowrap;
    }
    .case-sub {
      margin: 10px 0 0;
      font-size: clamp(13px, 1.55vw, 22px);
      font-weight: 700;
      letter-spacing: -.02em;
      color: rgba(255,255,255,.6);
      white-space: nowrap;
    }
    body .lv4 section#case-inside h2#case-heading,
    body section#case-inside h2#case-heading,
    #case-inside h2#case-heading {
      font-size: clamp(22px, 3.5vw, 72px) !important;
      line-height: 1.05 !important;
      letter-spacing: -.045em !important;
      font-weight: 900 !important;
      white-space: nowrap !important;
      text-align: left !important;
    }
    body .lv4 section.faq-section h2#faq-heading,
    body section.faq-section h2#faq-heading,
    .faq-section h2#faq-heading {
      font-size: clamp(22px, 3.5vw, 72px) !important;
      line-height: 1.05 !important;
      letter-spacing: -.05em !important;
      font-weight: 900 !important;
      white-space: nowrap !important;
    }
    #your-task h2#task-heading span {
      font-weight: 700;
      font-size: .84em;
      letter-spacing: -.025em;
      color: rgba(255,255,255,.55);
      margin-left: .4em;
    }
    body .lv4 section#your-task h2#task-heading,
    body section#your-task h2#task-heading,
    #your-task h2#task-heading {
      font-size: clamp(18px, 2.5vw, 52px) !important;
      line-height: 1.05 !important;
      letter-spacing: -.05em !important;
      font-weight: 900 !important;
      white-space: nowrap !important;
    }
    body #reviews .rv-head p {
      font-size: clamp(13px, 1.55vw, 26px) !important;
      font-weight: 800 !important;
      white-space: nowrap !important;
    }
    body #features .cap-lead {
      font-size: clamp(13px, 1.55vw, 26px) !important;
      font-weight: 800 !important;
      white-space: nowrap !important;
      max-width: none !important;
    }

    /* Блок «А что снимаете вы» - кадры во весь размер, минимум фона */
    .yt-head { text-align: center; margin-bottom: 34px; }
    #your-task h2#task-heading { margin-bottom: 0 !important; }
    .yt-lead {
      margin: 4px auto 0;
      font-size: clamp(13px, 1.55vw, 22px);
      font-weight: 700;
      letter-spacing: -.02em;
      color: rgba(255,255,255,.55);
    }
    .yt-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      max-width: 1400px;
      margin: 0 auto;
    }
    /* все кадры одинакового формата 16:10 - удобно подставлять видео */
    .yt-card { aspect-ratio: 16 / 10; }

    .yt-card {
      position: relative;
      display: block;
      width: 100%;
      padding: 0;
      overflow: hidden;
      border-radius: 14px;
      border: 1px solid rgba(255,255,255,.14);
      background: #0A0A0E;
      color: #fff;
      font: inherit;
      text-align: left;
      cursor: pointer;
      box-shadow: 0 18px 44px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.14);
      opacity: 0;
      transform: translateY(22px);
      animation: ytIn .7s var(--ease-out) forwards;
      animation-delay: calc(var(--i) * .07s);
      transition: border-color .35s ease, box-shadow .35s ease;
    }
    @keyframes ytIn { to { opacity: 1; transform: none; } }
    .yt-card:hover {
      border-color: var(--cap, var(--neon-coral));
      box-shadow: 0 26px 60px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.16);
      z-index: 2;
    }
    .yt-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 3px;
      z-index: 3;
      background: var(--cap, var(--neon-coral));
      transform: scaleX(1);
      transform-origin: left;
      transition: transform .5s var(--ease-out);
    }

    .yt-video {
      position: absolute; inset: 0;
      width: 100%; height: 100%;
      object-fit: cover;
      filter: brightness(.62) saturate(.95);
      transform: scale(1.02);
      transition: filter .45s ease, transform .7s cubic-bezier(.2,.8,.2,1);
    }
    .yt-card:hover .yt-video { filter: brightness(1) saturate(1.08); transform: scale(1.07); }
    .yt-shade {
      position: absolute; inset: 0;
      background: linear-gradient(0deg, rgba(5,5,8,.92) 0%, rgba(5,5,8,.45) 38%, transparent 68%);
      pointer-events: none;
    }
    .yt-share {
      position: absolute;
      left: 14px; top: 14px;
      z-index: 2;
      padding: 6px 11px;
      border-radius: 999px;
      background: rgba(8,8,12,.62);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(255,255,255,.18);
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .1em;
      color: #fff;
      transition: background .3s ease, border-color .3s ease;
    }
    .yt-card:hover .yt-share { background: var(--cap, var(--neon-coral)); border-color: var(--cap, var(--neon-coral)); color: #0E0B08; }

    .yt-caption {
      position: absolute;
      left: 0; right: 0; bottom: 0;
      z-index: 2;
      display: grid;
      gap: 6px;
      padding: 18px 16px 16px;
    }
    .yt-caption b {
      font-size: clamp(17px, 1.7vw, 24px);
      font-weight: 900;
      letter-spacing: -.035em;
      line-height: 1.1;
      text-shadow: 0 2px 16px rgba(0,0,0,.8);
    }
    .yt-caption em {
      font-style: normal;
      font-size: 12.5px;
      line-height: 1.45;
      color: rgba(255,255,255,.72);
      max-height: 0;
      opacity: 0;
      overflow: hidden;
      transition: max-height .45s var(--ease-out), opacity .35s ease;
    }
    .yt-card:hover .yt-caption em { max-height: 60px; opacity: 1; }

    .yt-cta {
      position: absolute;
      right: 14px; bottom: 16px;
      z-index: 3;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 9px 14px;
      border-radius: 999px;
      background: var(--cap, var(--neon-coral));
      color: #0E0B08;
      font-size: 12px;
      font-weight: 800;
      opacity: 0;
      transform: translateY(8px);
      transition: opacity .3s ease, transform .3s var(--ease-out);
    }
    .yt-cta i { font-style: normal; }
    .yt-cta u { text-decoration: none; }
    .yt-card:hover .yt-cta, .yt-card:focus-visible .yt-cta { opacity: 1; transform: none; }
    .yt-card.is-taken .yt-cta { opacity: 1; transform: none; background: #fff; color: #14090A; }

    @media (max-width: 1000px) {
      .yt-grid { grid-template-columns: repeat(2, 1fr); }
      .yt-caption em { display: none; }
    }
    @media (max-width: 560px) {
      .yt-grid { grid-template-columns: 1fr; }
    }
    @media (prefers-reduced-motion: reduce) {
      .yt-card { opacity: 1; transform: none; animation: none; }
    }

    /* Прогресс чтения */
    .read-progress {
      position: fixed;
      left: 0; top: 0;
      height: 3px;
      width: 0;
      z-index: 9999;
      background: linear-gradient(90deg, rgba(255,59,33,.6), var(--neon-coral));
      box-shadow: 0 0 14px rgba(255,59,33,.6);
      pointer-events: none;
      transition: width .1s linear;
    }

    /* Липкая строка ввода */
    .sticky-bar {
      position: fixed;
      left: 0; right: 0;
      top: 0;
      z-index: 900;
      padding: 10px max(24px, calc((100% - 1400px) / 2));
      background: rgba(8,8,12,.86);
      backdrop-filter: blur(22px) saturate(1.2);
      border-bottom: 1px solid rgba(255,255,255,.1);
      transform: translateY(-110%);
      transition: transform .4s var(--ease-out);
    }
    .sticky-bar.is-on { transform: translateY(0); }
    .sticky-inner { display: flex; align-items: center; gap: 12px; max-width: 1400px; margin: 0 auto; }
    .sticky-label {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: rgba(255,255,255,.45);
      white-space: nowrap;
    }
    .sticky-input {
      flex: 1;
      min-width: 0;
      height: 42px;
      padding: 0 16px;
      border-radius: 6px;
      border: 1px solid rgba(255,255,255,.16);
      background: rgba(255,255,255,.05);
      color: #fff;
      font: inherit;
      font-size: 14px;
      outline: 0;
    }
    .sticky-input::placeholder { color: rgba(255,255,255,.38); }
    .sticky-input:focus { border-color: var(--neon-coral); }
    .sticky-go {
      flex: 0 0 auto;
      padding: 12px 24px;
      border-radius: 6px;
      background: var(--neon-coral);
      color: #fff;
      font-size: 14px;
      font-weight: 800;
      text-decoration: none;
      transition: background .25s ease;
    }
    .sticky-go:hover { background: #FF6446; }
    @media (max-width: 700px) { .sticky-label { display: none; } }

    /* Курсор-подсказка на видео */
    .cursor-hint {
      position: fixed;
      z-index: 9998;
      left: 0; top: 0;
      padding: 7px 12px;
      border-radius: 999px;
      background: var(--neon-coral);
      color: #fff;
      font-size: 11.5px;
      font-weight: 800;
      pointer-events: none;
      opacity: 0;
      transform: translate(-50%, -140%) scale(.9);
      transition: opacity .2s ease, transform .2s var(--ease-out);
    }
    .cursor-hint.is-on { opacity: 1; transform: translate(-50%, -140%) scale(1); }

    /* Плавное появление секций */


    /* Переключатель месяц/год в тарифах */
    .pricing-toggle {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 4px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.04);
    }
    .pricing-toggle button {
      border: 0;
      border-radius: 999px;
      padding: 9px 18px;
      background: transparent;
      color: rgba(255,255,255,.6);
      font: inherit;
      font-size: 13px;
      font-weight: 800;
      cursor: pointer;
      transition: background .3s ease, color .3s ease;
      white-space: nowrap;
    }
    .pricing-toggle button.is-on { background: var(--neon-coral); color: #fff; }
    .pricing-save {
      margin-left: 8px;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9.5px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--neon-coral);
    }
    @media (prefers-reduced-motion: reduce) {
      .sticky-bar { transition: none; }
    }


/* ---------- export style block #7 (7.1 KB) ---------- */
.cap-head { text-align: center; max-width: 900px; margin: 0 auto 46px; }
    .lv4 section h2#capabilities-heading, #features h2 {
      font-size: clamp(40px, 6.4vw, 96px) !important;
      font-weight: 900;
      letter-spacing: -.055em !important;
      line-height: .94 !important;
      margin: 14px 0 0 !important;
      color: #fff;
    }
    #features h2 em { font-style: normal; color: var(--neon-coral); }
    .cap-lead {
      margin: 20px 0 0;
      font-size: clamp(18px, 1.9vw, 28px);
      font-weight: 800;
      letter-spacing: -.03em;
      color: rgba(255,255,255,.72);
      max-width: 34ch;
      margin-left: auto;
      margin-right: auto;
      text-wrap: balance;
    }
    .cap-head { position: relative; }
    .cap-head::after {
      content: '';
      display: block;
      width: 88px; height: 3px;
      margin: 26px auto 0;
      border-radius: 99px;
      background: var(--neon-coral);
      box-shadow: 0 0 22px rgba(255,59,33,.7);
    }
    @media (max-width: 760px) {
      #features h2, .cap-lead { white-space: normal; }
    }

    .cap-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 1400px; margin: 0 auto; }
    /* появление карточек по очереди */
    .cap-card {
      opacity: 0;
      transform: translateY(30px) scale(.97);
      transition: opacity .7s var(--ease-out), transform .7s var(--ease-out);
      transition-delay: var(--d, 0s);
    }
    .cap-in .cap-card { opacity: 1; transform: none; }
    /* кант сверху прочерчивается */
    .cap-card::before { transform: scaleX(0); transform-origin: left; transition: transform .8s var(--ease-out); transition-delay: calc(var(--d, 0s) + .25s); }
    .cap-in .cap-card::before { transform: scaleX(1); }
    /* блик, пробегающий по картинке при наведении */
    .cap-media::before {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
      background: linear-gradient(105deg, transparent 34%, rgba(255,255,255,.5) 50%, transparent 66%);
      transform: translateX(-120%);
    }
    .cap-card:hover .cap-media::before { animation: capSheen .9s cubic-bezier(.4,0,.2,1); }
    @keyframes capSheen { to { transform: translateX(120%); } }
    /* иконка оживает */
    .cap-ico { transition: transform .4s var(--ease-out), background .3s ease, color .3s ease; }
    .cap-card:hover .cap-ico { transform: translateY(-4px) rotate(-6deg) scale(1.08); background: var(--cap); color: #fff; }
    /* строки состава выезжают по очереди */
    .cap-spec { opacity: 0; transform: translateX(-8px); transition: opacity .4s ease, transform .4s var(--ease-out); }
    .cap-in .cap-spec { opacity: 1; transform: none; }
    .cap-card:hover .cap-spec::before { transform: scale(1.5); transition: transform .3s var(--ease-out); }
    .cap-spec::before { transition: transform .3s var(--ease-out); }
    /* стрелка в ссылке уезжает вправо */
    .cap-link { display: inline-flex; align-items: center; gap: 7px; }
    .cap-link i { font-style: normal; display: inline-block; transition: transform .3s var(--ease-out); }
    .cap-card:hover .cap-link i { transform: translateX(6px); }
    @media (prefers-reduced-motion: reduce) {
      .cap-card, .cap-spec { opacity: 1; transform: none; transition: none; }
      .cap-card::before { transform: scaleX(1); }
    }
    .cap-card {
      position: relative;
      display: flex;
      flex-direction: column;
      padding: 0;
      overflow: hidden;
      text-decoration: none;
      color: #fff;
      background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03)) !important;
      border: 1px solid rgba(255,255,255,.14) !important;
      backdrop-filter: blur(22px) saturate(1.2) !important;
      box-shadow: 0 18px 44px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.14);
      transition: transform .3s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;
    }
    .cap-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--cap); z-index: 3; }
    .cap-card:hover { transform: translateY(-6px); border-color: var(--cap) !important; box-shadow: 0 18px 48px rgba(0,0,0,.45); }
    .cap-idx {
      position: absolute;
      right: 14px; top: 14px;
      z-index: 3;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10px;
      letter-spacing: .16em;
      color: rgba(255,255,255,.85);
      padding: 5px 8px;
      border-radius: 6px;
      background: rgba(8,8,12,.55);
      backdrop-filter: blur(8px);
    }
    .cap-media {
      position: relative;
      aspect-ratio: 16 / 10;
      overflow: hidden;
      display: flex;
      align-items: flex-end;
      background: radial-gradient(120% 120% at 70% 0%, var(--cap-bg), transparent 70%);
    }
    .cap-media video, .cap-media img {
      position: absolute; inset: 0;
      width: 100%; height: 100%;
      object-fit: cover;
      filter: brightness(.88) saturate(1);
      transition: transform .4s ease, filter .4s ease;
    }
    .cap-card:hover .cap-media video, .cap-card:hover .cap-media img { transform: scale(1.05); filter: brightness(1.04) saturate(1.08); }
    .cap-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.42), transparent 52%); }
    .cap-ico {
      position: relative; z-index: 2;
      margin: 14px;
      width: 42px; height: 42px;
      border-radius: 10px;
      display: grid; place-items: center;
      color: var(--cap);
      background: rgba(10,10,14,.55);
      backdrop-filter: blur(8px);
      border: 1px solid rgba(255,255,255,.12);
    }
    .cap-ico svg { width: 22px; height: 22px; display: block; }
    .cap-body { padding: 20px 24px 24px; display: flex; flex-direction: column; flex: 1; }
    .cap-title { font-size: 22px; font-weight: 800; margin: 0 0 8px; color: #fff; letter-spacing: -.03em; }
    .cap-desc { color: rgba(255,255,255,.72); font-size: 15.5px; font-weight: 500; line-height: 1.5; margin: 0 0 18px; flex: 0 0 auto; }
    .cap-specs { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; }
    .cap-spec {
      position: relative;
      padding-left: 16px;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 12.5px;
      letter-spacing: .02em;
      text-transform: none;
      font-weight: 600;
      color: rgba(255,255,255,.6);
      line-height: 1.45;
    }
    .cap-spec::before { content: ''; position: absolute; left: 0; top: 5px; width: 6px; height: 6px; border-radius: 50%; background: var(--cap); opacity: .75; }
    .cap-link { color: var(--cap); font-weight: 800; font-size: 14.5px; letter-spacing: -.01em; margin-top: auto; }
    .cap-models { margin-top: 28px; }
    .cap-models-label {
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 10.5px;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: rgba(255,255,255,.4);
      margin-bottom: 12px;
      text-align: center;
    }
    .cap-models .models-line { width: 100%; margin-left: 0; border-radius: 14px; }
    @media (max-width: 1000px) { .cap-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (max-width: 560px) { .cap-grid { grid-template-columns: 1fr; } }


/* ---------- export style block #8 (4.1 KB) ---------- */
.pricing-teaser-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; max-width: 1400px; margin: 0 auto; align-items: stretch; }
    .pricing-teaser-grid.cols-4 { grid-template-columns: repeat(5, 1fr); max-width: 1400px; }
    .pricing-teaser-card {
      position: relative;
      display: flex;
      flex-direction: column;
      padding: 26px 20px;
      text-align: left;
      border-radius: 14px;
      background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
      border: 1px solid rgba(255,255,255,.12);
      transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;
    }
    .pricing-teaser-card:hover { transform: translateY(-8px); border-color: rgba(255,255,255,.3); }
    .pricing-teaser-card.is-popular {
      background:
        linear-gradient(180deg, rgba(255,59,33,.16), rgba(255,59,33,.04)) padding-box,
        linear-gradient(140deg, var(--neon-coral), #FFB07A 60%, var(--neon-coral)) border-box;
      border: 1px solid transparent;
      color: #fff;
      box-shadow: 0 0 0 1px rgba(255,59,33,.3), 0 26px 66px rgba(255,59,33,.32);
    }
    .pricing-pop {
      position: absolute; top: -11px; left: 20px;
      background: var(--neon-coral);
      color: #fff;
      font-family: ui-monospace, 'SF Mono', Menlo, monospace;
      font-size: 9px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .14em;
      padding: 5px 11px;
      border-radius: 999px;
      white-space: nowrap;
    }
    .pricing-tier-name { font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: rgba(255,255,255,.5); font-weight: 800; margin-bottom: 14px; }
    .pricing-teaser-card.is-popular .pricing-tier-name { color: rgba(255,255,255,.62); }
    .pricing-tier-price { display: flex; align-items: baseline; gap: 5px; font-size: clamp(24px, 2.2vw, 32px); font-weight: 900; letter-spacing: -.045em; color: #fff; }
    .pricing-teaser-card.is-popular .pricing-tier-price { color: #fff; }
    .pricing-tier-per { font-size: 13px; font-weight: 500; color: rgba(255,255,255,.45); letter-spacing: normal; }
    .pricing-teaser-card.is-popular .pricing-tier-per { color: rgba(255,255,255,.6); }
    .pricing-feats { list-style: none; margin: 18px 0 22px; padding: 0; display: grid; gap: 9px; flex: 1; }
    .pricing-feat { position: relative; padding-left: 18px; font-size: 13px; line-height: 1.45; color: rgba(255,255,255,.68); }
    .pricing-feat::before { content: ''; position: absolute; left: 0; top: 6px; width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.2); }
    .pricing-teaser-card.is-popular .pricing-feat { color: rgba(255,255,255,.78); }
    .pricing-teaser-card.is-popular .pricing-feat::before { background: var(--neon-coral); }
    .pricing-teaser-card .btn-neon {
      border-radius: 6px;
      font-size: 14px;
      font-weight: 800;
      padding: 13px;
      text-align: center;
      margin-top: auto;
      width: 100%;
    }
    .pricing-teaser-card .btn-neon.is-ghost { background: transparent !important; border: 1px solid rgba(255,255,255,.24); color: #fff !important; box-shadow: none !important; }
    .pricing-teaser-card .btn-neon.is-ghost:hover { background: #fff !important; color: #0A0A0D !important; }
    .pricing-teaser-card.is-popular .btn-neon { background: var(--neon-coral) !important; color: #fff !important; box-shadow: none !important; }
    .pricing-teaser-card.is-popular .btn-neon:hover { background: #FF6446 !important; }
    .pricing-foot { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; margin-top: 28px; font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.4); }
    .pricing-foot .uc-link { margin-left: auto; letter-spacing: -.01em; text-transform: none; font-family: inherit; font-size: 13.5px; }
    @media (max-width: 1100px) { .pricing-teaser-grid, .pricing-teaser-grid.cols-4 { grid-template-columns: repeat(3, 1fr); } }
    @media (max-width: 760px) { .pricing-teaser-grid, .pricing-teaser-grid.cols-4 { grid-template-columns: 1fr; max-width: 420px; } .pricing-foot .uc-link { margin-left: 0; } }

/* ------------------------------------------------------------------------------------------------
   Terra concierge on the dark hero card — readability fix, deliberate deviation from the export.

   The export styles this block for a LIGHT surface: title, kicker, chips and the privacy note are
   all #14090A, and the live dot is a #14090A circle. In the published layout the block sits inside
   .vw-core, which is rgba(6,6,9,.82) — so the contrast lands around 1.1:1 and the chips read as
   empty outlines. Geometry (pill, 2px border, 38px, bold 13px) is kept exactly; only the ink flips,
   and the hover state keeps her inverse (dark ink on a light fill) which is what it was drawn for.
   ------------------------------------------------------------------------------------------------ */
/* её правило для заголовка — .lv4 section h2.cc-title, поэтому переопределяем на ступень выше */
.lv4 .vw-core section h2.cc-title { color: #FFFFFF; }
.vw-core .cc-kicker { color: rgba(255, 255, 255, .74); }
.vw-core .cc-privacy { color: rgba(255, 255, 255, .62); }
.vw-core .cc-pulse { background: var(--neon-coral, #FF6F61); }
.vw-core .cc-chip {
  color: #D8D8E0;
  border-color: rgba(255, 255, 255, .34);
}
.vw-core .cc-chip:hover,
.vw-core .cc-chip:focus-visible {
  background: #FFFFFF;
  border-color: #FFFFFF;
  color: #14090A;
}

/* Same light-surface ink, three more places the export leaves unreadable on the dark page.
   Verified by a contrast sweep of the built page, not by reading the CSS: each of these computes
   to near-black over a near-black background (ratios 1.07-1.54). Geometry and layout untouched. */
#case-inside .ci-final-tag { color: rgba(255, 255, 255, .82); }
/* .ci-strip НЕ трогаем: это светлая «киноплёнка» (лаковый градиент в background-image),
   тёмная подпись на ней верна. Мой первый прогон принял её за тёмную, потому что скрипт
   смотрел только background-color — background-image так не увидеть. */
#seedance .sd-claim b { color: rgba(255, 246, 240, .88); }
/* Live counter in the stats band: coral on a 7%-coral tint reads at 1.3:1 */
#statsBand .sb-unit-live,
#statsBand .sb-unit-live b,
#statsBand .sb-unit-live span,
#statsBand .sb-unit-live i { color: rgba(255, 236, 230, .92); }

/* Карточки раздела «Doitong — агрегатор нейросетей»: баннеры 16:9 в окне 1.60,
   object-fit: cover срезает по 5% с каждой стороны. У «Аватаров и липсинка» заголовок
   прижат к правому краю кадра — центрированная обрезка съедала бы последние буквы,
   поэтому этой карточке кадрируем от правого края (лицо слева теряет 10%, текст цел). */
#features .cap-card:nth-of-type(5) .cap-media img { object-position: 100% 50%; }

/* Пилюля вокруг «Смотреть бесплатное обучение»: в экспорте padding 9px 9px 9px 18px —
   лишние 9px слева уравновешивали подпись .hero-invite-text и разделитель, которых в
   финальной разметке нет (внутри только кнопка). Итог — кнопка стояла в пилюле не по центру:
   19px слева против 10px справа. Выравниваем. */
.vw-core .hero-invite { padding: 9px; }

/* ------------------------------------------------------------------------------------------------
   Отзывы: карусель вместо сетки 4×2.
   В финальную выгрузку попал вариант-сетка, но выбран был «веер» (options/mr-e-phone-fan):
   лента со скролл-снапом, центральная карточка в полный размер, соседние уменьшены и притушены.
   Активную карточку назначает скрипт по близости к центру ленты — в самом варианте класс `on`
   стоял статикой на первой, то есть при прокрутке подсветка никуда не переезжала.
   ------------------------------------------------------------------------------------------------ */
#reviews .rv-shelf {
  display: flex;
  grid-template-columns: none;
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 6px calc(50% - 124px) 16px;   /* поля, чтобы крайние карточки доезжали до центра */
  scrollbar-width: none;
  -ms-overflow-style: none;
  overscroll-behavior-x: contain;
}
#reviews .rv-shelf::-webkit-scrollbar { display: none; }
#reviews .rv-slot {
  flex: 0 0 auto;
  width: 248px;
  scroll-snap-align: center;
  transform: scale(.88);
  opacity: .5;
  transition: transform .4s cubic-bezier(.2,.8,.2,1), opacity .4s ease;
}
#reviews .rv-slot.is-on { transform: scale(1); opacity: 1; }
#reviews .rv-slot.is-on:hover { transform: scale(1) translateY(-6px); }
#reviews .rv-slot:hover { opacity: 1; }

/* Стрелки: лента на десктопе не читается как прокручиваемая без них */
#reviews .rv-rail { position: relative; }
#reviews .rv-nav {
  position: absolute; top: 42%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 999px; z-index: 4;
  display: grid; place-items: center; cursor: pointer;
  color: #fff; background: rgba(12,12,18,.72); border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(10px); transition: background .2s ease, transform .2s ease;
}
#reviews .rv-nav:hover { background: var(--neon-coral, #FF6F61); transform: translateY(-50%) scale(1.06); }
#reviews .rv-nav svg { width: 20px; height: 20px; }
#reviews .rv-nav-prev { left: 8px; }
#reviews .rv-nav-next { right: 8px; }
@media (max-width: 700px) {
  #reviews .rv-shelf { padding-left: calc(50% - 82px); padding-right: calc(50% - 82px); }
  #reviews .rv-slot { width: 164px; }
  #reviews .rv-nav { display: none; }   /* на телефоне листается пальцем */
}
@media (prefers-reduced-motion: reduce) {
  #reviews .rv-shelf { scroll-behavior: auto; }
  #reviews .rv-slot { transition: none; }
}

/* Дуга: центральная карточка наверху, боковые ступеньками вниз и с лёгким наклоном.
   --d (со знаком) и --ad (модуль) выставляет скрипт при пересчёте активной карточки. */
#reviews .rv-slot {
  --d: 0; --ad: 0;
  transform-origin: 50% 100%;
  transform:
    translateY(calc(var(--ad) * 34px))
    rotate(calc(var(--d) * 1.1deg))
    scale(calc(1 - var(--ad) * 0.07));
  opacity: calc(1 - var(--ad) * 0.14);
}
#reviews .rv-slot.is-on { transform: translateY(0) rotate(0deg) scale(1); opacity: 1; }
#reviews .rv-slot.is-on:hover { transform: translateY(-6px) scale(1); }
/* дальние карточки не должны утонуть совсем */
#reviews .rv-slot { min-opacity: unset; }
#reviews .rv-shelf { align-items: flex-start; padding-bottom: 116px; }  /* место под нижнюю ступень дуги */
@media (max-width: 700px) {
  #reviews .rv-slot { transform: translateY(calc(var(--ad) * 12px)) scale(calc(1 - var(--ad) * 0.07)); }
}

/* Поле Terra: убираем полосу прокрутки внутри textarea.
   Высота поля 38px, а плейсхолдер переносится на три строки — контент 117px, и браузер рисует
   скроллбар прямо в строке ввода, рядом с кнопкой отправки. Прокрутка колесом и клавишами
   остаётся, скрыт только сам ползунок. */
.vw-core .cc-input { scrollbar-width: none; -ms-overflow-style: none; }
.vw-core .cc-input::-webkit-scrollbar { width: 0; height: 0; display: none; }