@font-face{
  font-family:'Playfair Display';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/playfair-display-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Playfair Display';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/playfair-display-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Inter Tight';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/inter-tight-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Inter Tight';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/inter-tight-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/inter-cyrillic-ext.woff2") format("woff2");
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/inter-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/inter-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'JetBrains Mono';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/jetbrains-mono-cyrillic.woff2") format("woff2");
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{
  font-family:'JetBrains Mono';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url("assets/fonts/jetbrains-mono-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Сброс страницы ───────────────────────────────────────── */
html,body{margin:0;padding:0;background:var(--canvas);}
html{-webkit-text-size-adjust:100%;}

/* ═══ ТЕМЫ ══════════════════════════════════════════════════
   Тёмная — основная: так задано источником стиля и так же
   устроено само приложение. Светлая включается системной
   настройкой или переключателем в шапке.
   Роли токенов в обеих темах одинаковы: меняются только значения.
   ═══════════════════════════════════════════════════════════ */
:root{
  color-scheme:dark;

  /* Холст и слои */
  --canvas:#000000;
  --hairline:#292d30;
  --surface-lift:#0b0e14;

  /* Текст — от самого сильного к самому тихому */
  --ink-strong:#ffffff;
  --ink:#f0f0f0;
  --ink-muted:#a1a4a5;
  --ink-soft:#abafb4;
  --ink-faint:#6e727a;
  --ink-ghost:#464a4d;

  /* Акцент — фирменный RuChat вместо фиолетового Resend.
     Роль сохранена: только идентификаторы и технические строки, никогда на кнопках.
     --brand-glow — тот же цвет, доведённый до читаемого контраста на холсте. */
  --brand:#4268f9;
  --brand-glow:#8aa2ff;

  /* Статусы — только для состояний доставки, как в источнике */
  --delivered:#3ad389;
  --opened:#70b8ff;
  --failed:#ff9592;

  /* Поверхности окна переписки */
  --bubble-in:#1a1a1a;
  --cipher-bg:#0d0d0d;
  --switch-active:#141414;

  /* Прочее, зависящее от темы */
  --nav-bg:rgba(0,0,0,.92);
  --border-hover:rgba(255,255,255,.55);
  --border-hover-soft:rgba(255,255,255,.4);

  /* Шрифты по ролям */
  --font-display:'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-headline:'Inter Tight', Inter, ui-sans-serif, system-ui, sans-serif;
  --font-body:'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Шкала */
  --text-caption:12px;  --leading-caption:1.33;
  --text-body-sm:14px;  --leading-body-sm:1.43;
  --text-body:16px;     --leading-body:1.5;
  --text-subheading:20px;
  --text-heading-sm:24px;

  /* Отступы */
  --sp-4:4px; --sp-8:8px; --sp-12:12px; --sp-16:16px; --sp-20:20px;
  --sp-24:24px; --sp-28:28px; --sp-32:32px; --sp-40:40px; --sp-48:48px;
  --sp-64:64px; --sp-80:80px; --sp-96:96px; --sp-144:144px;

  /* Раскладка */
  --page:1200px;
  --section-gap:96px;
  --card-padding:32px;

  /* Радиусы — их ровно два */
  --r-control:6px;
  --r-panel:16px;

  --ease:cubic-bezier(0.22,0.61,0.36,1);
}

/* ── Светлая тема ───────────────────────────────────────────
   Не «инверсия», а тот же строй в другом материале: чистый белый
   холст вместо чистого чёрного, волосяная рамка вместо теней,
   призрачные кнопки. Акцент темнеет, чтобы остаться читаемым:
   #4268F9 на белом даёт 4.9:1, светлый #8AA2FF не дал бы и 2:1. */
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    color-scheme:light;

    --canvas:#ffffff;
    --hairline:#e3e5e8;
    --surface-lift:#fafbfc;

    --ink-strong:#000000;
    --ink:#16181a;
    --ink-muted:#5b6166;
    --ink-soft:#6b7176;
    --ink-faint:#8a9096;
    --ink-ghost:#a8aeb4;

    --brand:#4268f9;
    --brand-glow:#2b46c9;

    --delivered:#12854c;
    --opened:#1d6fd0;
    --failed:#c0392b;

    --bubble-in:#f1f3f5;
    --cipher-bg:#f7f8f9;
    --switch-active:#eceef0;

    --nav-bg:rgba(255,255,255,.92);
    --border-hover:rgba(0,0,0,.45);
    --border-hover-soft:rgba(0,0,0,.3);
  }
}

:root[data-theme="light"]{
  color-scheme:light;

  --canvas:#ffffff;
  --hairline:#e3e5e8;
  --surface-lift:#fafbfc;

  --ink-strong:#000000;
  --ink:#16181a;
  --ink-muted:#5b6166;
  --ink-soft:#6b7176;
  --ink-faint:#8a9096;
  --ink-ghost:#a8aeb4;

  --brand:#4268f9;
  --brand-glow:#2b46c9;

  --delivered:#12854c;
  --opened:#1d6fd0;
  --failed:#c0392b;

  --bubble-in:#f1f3f5;
  --cipher-bg:#f7f8f9;
  --switch-active:#eceef0;

  --nav-bg:rgba(255,255,255,.92);
  --border-hover:rgba(0,0,0,.45);
  --border-hover-soft:rgba(0,0,0,.3);
}

.rc *,.rc *::before,.rc *::after{box-sizing:border-box;}
.rc{
  background:var(--canvas);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:var(--text-body);
  line-height:var(--leading-body);
  -webkit-font-smoothing:antialiased;
  margin:0;
  overflow-x:hidden;
}
.rc img{max-width:100%;display:block;}

.rc-wrap{max-width:var(--page);margin:0 auto;padding-inline:var(--sp-24);}

/* ─── Типографика ─────────────────────────────────────────── */
.rc h1,.rc h2,.rc h3,.rc p,.rc ul,.rc ol,.rc figure{margin:0;}
.rc ul{list-style:none;padding:0;}

.rc-display{
  font-family:var(--font-display);
  font-weight:400;
  font-size:clamp(40px,7.4vw,96px);
  line-height:1.0;
  letter-spacing:-0.01em;
  color:var(--ink-strong);
  text-wrap:balance;
}
.rc-h2{
  font-family:var(--font-headline);
  font-weight:400;
  font-size:clamp(32px,5vw,56px);
  line-height:1.2;
  letter-spacing:-0.05em;
  color:var(--ink-strong);
  text-wrap:balance;
}
.rc-h3{
  font-family:var(--font-headline);
  font-weight:500;
  font-size:var(--text-subheading);
  line-height:1.3;
  letter-spacing:-0.02em;
  color:var(--ink-strong);
}
.rc-lead{
  font-size:clamp(16px,1.6vw,18px);
  line-height:1.6;
  color:var(--ink-muted);
  max-width:62ch;
  text-wrap:pretty;
}
.rc-body{color:var(--ink-muted);text-wrap:pretty;}

.rc-mono{
  font-family:var(--font-mono);
  font-size:var(--text-body-sm);
  line-height:var(--leading-body-sm);
  color:var(--ink-muted);
}
.rc-eyebrow{
  font-family:var(--font-mono);
  font-size:var(--text-caption);
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ink-faint);
}
.rc-ident{font-family:var(--font-mono);color:var(--brand-glow);}

/* ─── Управляющие элементы ────────────────────────────────── */
.rc-btn{
  display:inline-flex;align-items:center;gap:var(--sp-8);
  font-family:var(--font-body);font-size:var(--text-body-sm);font-weight:500;
  color:var(--ink-strong);
  background:transparent;
  border:1px solid var(--hairline);
  border-radius:var(--r-control);
  padding:12px 16px;
  cursor:pointer;
  text-decoration:none;
  transition:border-color 150ms var(--ease), color 150ms var(--ease);
}
.rc-btn:hover{border-color:var(--border-hover);}
.rc-btn:focus-visible{outline:2px solid var(--brand-glow);outline-offset:2px;}
.rc-btn--quiet{color:var(--ink);}
.rc-btn--quiet:hover{color:var(--ink-strong);}

.rc-pill{
  display:inline-flex;align-items:center;gap:var(--sp-8);
  border:1px solid var(--hairline);
  border-radius:9999px;
  padding:6px 12px;
  font-size:var(--text-body-sm);
  color:var(--ink);
  text-decoration:none;
  transition:border-color 150ms var(--ease);
}
.rc-pill:hover{border-color:var(--border-hover-soft);}
.rc-pill:focus-visible{outline:2px solid var(--brand-glow);outline-offset:2px;}

.rc-link{
  color:var(--ink);text-decoration:none;
  font-size:var(--text-body-sm);
  transition:color 150ms var(--ease);
}
.rc-link:hover{color:var(--ink-strong);}
.rc-link:focus-visible{outline:2px solid var(--brand-glow);outline-offset:2px;border-radius:2px;}

/* ─── Навигация ───────────────────────────────────────────── */
.rc-nav{
  position:sticky;top:0;z-index:20;
  background:var(--nav-bg);
  backdrop-filter:blur(25px);
  border-bottom:1px solid transparent;
}
.rc-nav__inner{
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-24);
  height:64px;
}
.rc-wordmark{
  display:flex;align-items:center;gap:var(--sp-8);
  font-family:var(--font-headline);
  font-weight:600;font-size:18px;letter-spacing:-0.03em;
  color:var(--ink-strong);text-decoration:none;
}
/* Знак — настоящая иконка приложения. Она почти чёрная, поэтому на чёрном
   холсте её край очерчен волосяной рамкой, как и все прочие поверхности. */
.rc-wordmark__mark{
  width:20px;height:20px;border-radius:5px;
  border:1px solid var(--hairline);
  flex:none;
  display:block;
}
.rc-nav__links{display:flex;align-items:center;gap:var(--sp-24);}
@media (max-width:720px){.rc-nav__links .rc-nav__hideable{display:none;}}

/* ─── Секции ──────────────────────────────────────────────── */
.rc-section{padding-block:var(--section-gap);}
.rc-section--tight{padding-block:var(--sp-64);}
.rc-rule{border:0;border-top:1px solid var(--hairline);margin:0;}

.rc-section__head{
  display:flex;flex-direction:column;gap:var(--sp-16);
  max-width:70ch;margin-bottom:var(--sp-48);
}

/* ─── Герой ───────────────────────────────────────────────── */
.rc-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--sp-64);
  align-items:center;
  padding-block:var(--sp-96) var(--section-gap);
}
@media (max-width:940px){
  .rc-hero{grid-template-columns:minmax(0,1fr);gap:var(--sp-48);padding-block:var(--sp-64);}
}
.rc-hero__copy{display:flex;flex-direction:column;gap:var(--sp-24);align-items:flex-start;}
.rc-hero__actions{display:flex;flex-wrap:wrap;gap:var(--sp-12);}

/* Появление героя — сдвиг и проявление, как в источнике */
.rc-rise{opacity:0;transform:translateY(12px);animation:rc-rise 620ms var(--ease) forwards;}
.rc-rise:nth-child(1){animation-delay:40ms;}
.rc-rise:nth-child(2){animation-delay:120ms;}
.rc-rise:nth-child(3){animation-delay:200ms;}
.rc-rise:nth-child(4){animation-delay:280ms;}
.rc-rise:nth-child(5){animation-delay:360ms;}
@keyframes rc-rise{to{opacity:1;transform:none;}}

/* ─── Окно-доказательство (переписка) ─────────────────────── */
.rc-window{
  border:1px solid var(--hairline);
  border-radius:var(--r-panel);
  background:var(--canvas);
  overflow:hidden;
}
.rc-window__bar{
  display:flex;align-items:center;gap:var(--sp-12);
  padding:var(--sp-12) var(--sp-16);
  border-bottom:1px solid var(--hairline);
}
.rc-dots{display:flex;gap:6px;flex:none;}
.rc-dots i{width:8px;height:8px;border-radius:9999px;background:var(--hairline);display:block;}
.rc-window__title{
  font-family:var(--font-mono);font-size:var(--text-caption);color:var(--ink-ghost);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* Переключатель «вы / сервер» — единственный цветной управляющий элемент */
.rc-switch{
  margin-left:auto;display:flex;flex:none;
  border:1px solid var(--hairline);border-radius:var(--r-control);
  overflow:hidden;
}
.rc-switch button{
  font-family:var(--font-mono);font-size:var(--text-caption);
  background:transparent;border:0;color:var(--ink-ghost);
  padding:5px 10px;cursor:pointer;
  transition:color 150ms var(--ease), background-color 150ms var(--ease);
}
.rc-switch button:hover{color:var(--ink-muted);}
.rc-switch button[aria-pressed="true"]{color:var(--ink-strong);background:var(--switch-active);}
.rc-switch button:focus-visible{outline:2px solid var(--brand-glow);outline-offset:-2px;}

.rc-chat{
  display:flex;flex-direction:column;gap:var(--sp-12);
  padding:var(--sp-24) var(--sp-20);
  min-height:340px;
}
.rc-msg{display:flex;flex-direction:column;gap:6px;max-width:82%;}
.rc-msg--out{align-self:flex-end;align-items:flex-end;}
.rc-bubble{
  border-radius:var(--r-panel);
  padding:10px 14px;
  font-size:var(--text-body-sm);
  line-height:var(--leading-body-sm);
  color:var(--ink);
  background:var(--bubble-in);                     /* входящий пузырь — токен приложения */
  word-break:break-word;
  transition:background-color 200ms var(--ease);
}
.rc-msg--out .rc-bubble{
  color:var(--ink-strong);
  background:linear-gradient(135deg,#4a64f5,#4268f9);  /* фирменный градиент исходящих */
}
.rc-meta{
  display:flex;align-items:center;gap:6px;
  font-family:var(--font-mono);font-size:var(--text-caption);color:var(--ink-ghost);
}
.rc-meta i{width:5px;height:5px;border-radius:9999px;background:var(--delivered);display:block;flex:none;}

/* Шифртекст — тот же пузырь, другое содержимое */
.rc-cipher .rc-bubble{
  font-family:var(--font-mono);
  font-size:var(--text-caption);
  color:var(--ink-ghost);
  background:var(--cipher-bg);
  border:1px solid var(--hairline);
}
.rc-cipher .rc-msg--out .rc-bubble{
  background:var(--cipher-bg);
  color:var(--ink-ghost);
}
.rc-window__note{
  border-top:1px solid var(--hairline);
  padding:var(--sp-12) var(--sp-16);
  font-family:var(--font-mono);font-size:var(--text-caption);
  color:var(--ink-faint);
}

/* ─── Терминал рукопожатия ────────────────────────────────── */
.rc-term{
  font-family:var(--font-mono);
  font-size:var(--text-body-sm);
  line-height:1.7;
  padding:var(--sp-24);
  overflow-x:auto;
}
.rc-term .k{color:var(--ink);}
.rc-term .s{color:var(--brand-glow);}
.rc-term .ok{color:var(--delivered);}
.rc-term .c{color:var(--ink-ghost);}

/* ─── Списки-факты вместо карточек ────────────────────────── */
.rc-facts{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:0;
  border-top:1px solid var(--hairline);
}
.rc-fact{
  border-bottom:1px solid var(--hairline);
  border-right:1px solid var(--hairline);
  padding:var(--sp-28) var(--sp-24);
  display:flex;flex-direction:column;gap:var(--sp-8);
}
.rc-fact:last-child{border-right:1px solid var(--hairline);}
.rc-fact__label{font-family:var(--font-mono);font-size:var(--text-caption);color:var(--ink-faint);letter-spacing:.04em;}
.rc-fact__value{font-family:var(--font-headline);font-size:var(--text-heading-sm);letter-spacing:-0.03em;color:var(--ink-strong);}
.rc-fact__note{font-size:var(--text-body-sm);color:var(--ink-muted);}

/* ─── Языки ───────────────────────────────────────────────── */
.rc-langs{
  display:flex;flex-wrap:wrap;gap:var(--sp-8);
}
.rc-lang{
  display:inline-flex;align-items:center;gap:var(--sp-8);
  border:1px solid var(--hairline);
  border-radius:var(--r-control);
  padding:8px 12px;
  font-size:var(--text-body-sm);
  color:var(--ink);
}
.rc-lang code{font-family:var(--font-mono);font-size:var(--text-caption);color:var(--ink-ghost);}
.rc-lang--asr code{color:var(--brand-glow);}

/* ─── Возможности ─────────────────────────────────────────── */
.rc-feats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:var(--sp-48) var(--sp-40);
}
.rc-feat{display:flex;flex-direction:column;gap:var(--sp-8);}
.rc-feat__title{
  font-family:var(--font-headline);font-weight:500;font-size:var(--text-body);
  letter-spacing:-0.02em;color:var(--ink-strong);
}
.rc-feat__list{display:flex;flex-direction:column;gap:var(--sp-4);}
.rc-feat__list li{font-size:var(--text-body-sm);color:var(--ink-muted);line-height:1.5;}

/* ─── Платформы ───────────────────────────────────────────── */
.rc-plat{display:flex;flex-wrap:wrap;gap:var(--sp-16);}
.rc-plat__item{
  border:1px solid var(--hairline);border-radius:var(--r-panel);
  padding:var(--sp-24);
  display:flex;flex-direction:column;gap:var(--sp-4);
  min-width:220px;flex:1;
}

/* ─── Подвал ──────────────────────────────────────────────── */
.rc-footer{padding-block:var(--sp-48);}
.rc-footer__row{display:flex;flex-wrap:wrap;gap:var(--sp-24);align-items:center;justify-content:space-between;}
.rc-footer__links{display:flex;gap:var(--sp-24);}
.rc-footer__links a{color:var(--ink-muted);}
.rc-footer__links a:hover{color:var(--ink);}

/* ─── Появление секций при прокрутке ──────────────────────── */
.rc-js .rc-reveal{opacity:0;transform:translateY(14px);transition:opacity 620ms var(--ease),transform 620ms var(--ease);}
.rc-reveal.is-in{opacity:1;transform:none;}

@media (prefers-reduced-motion:reduce){
  .rc *,.rc *::before,.rc *::after{animation-duration:1ms !important;animation-delay:0ms !important;transition-duration:1ms !important;}
  .rc-rise{opacity:1;transform:none;animation:none;}
  .rc-reveal{opacity:1;transform:none;}
}

/* ═══ ПЕРЕКЛЮЧАТЕЛЬ ТЕМЫ ════════════════════════════════════ */
.rc-theme{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;flex:none;
  background:transparent;
  border:1px solid var(--hairline);
  border-radius:var(--r-control);
  color:var(--ink-muted);
  cursor:pointer;
  transition:border-color 150ms var(--ease), color 150ms var(--ease);
}
.rc-theme:hover{border-color:var(--border-hover);color:var(--ink-strong);}
.rc-theme:focus-visible{outline:2px solid var(--brand-glow);outline-offset:2px;}
.rc-theme svg{width:16px;height:16px;display:block;}
/* Показываем значок той темы, в КОТОРУЮ переключимся:
   в тёмной — солнце (нажать = станет светло), в светлой — луна. */
.rc-theme .rc-theme__moon{display:none;}
.rc-theme .rc-theme__sun{display:block;}
:root[data-theme="light"] .rc-theme .rc-theme__moon{display:block;}
:root[data-theme="light"] .rc-theme .rc-theme__sun{display:none;}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]) .rc-theme .rc-theme__moon{display:block;}
  :root:not([data-theme="dark"]) .rc-theme .rc-theme__sun{display:none;}
}

/* ═══ ДВИЖЕНИЕ ══════════════════════════════════════════════
   Сдержанное и по правилам источника: только проявление и сдвиг,
   никаких отскоков и увеличений. Всё запускается появлением
   в поле зрения и играет один раз.
   ═══════════════════════════════════════════════════════════ */

/* Заголовок поднимается построчно из-под маски — как строки набора */
.rc-lines{display:block;}
.rc-line{display:block;overflow:hidden;}
.rc-line > span{
  display:block;
  transform:translateY(105%);
  transition:transform 900ms cubic-bezier(0.16,1,0.3,1);
  transition-delay:calc(var(--i, 0) * 90ms);
}
.is-in .rc-line > span,
.rc-lines.is-in .rc-line > span{transform:none;}

/* Волосяные линии прочерчиваются слева направо */
.rc-js .rc-rule{
  transform:scaleX(0);transform-origin:left center;
  transition:transform 900ms var(--ease);
}
.rc-rule.is-in{transform:scaleX(1);}

/* Ступенчатое появление — для языков, фактов, возможностей */
.rc-js .rc-stagger > *{
  opacity:0;transform:translateY(10px);
  transition:opacity 520ms var(--ease), transform 520ms var(--ease);
  transition-delay:calc(var(--i, 0) * 28ms);
}
.rc-stagger.is-in > *{opacity:1;transform:none;}

/* Строки терминала набегают сверху вниз */
.rc-js .rc-term .rc-tline{
  display:block;
  opacity:0;transform:translateY(6px);
  transition:opacity 380ms var(--ease), transform 380ms var(--ease);
  transition-delay:calc(var(--i, 0) * 55ms);
}
.rc-term.is-in .rc-tline{opacity:1;transform:none;}

/* Сообщения в окне переписки приходят по очереди, как настоящие */
.rc-js .rc-chat .rc-msg{
  opacity:0;transform:translateY(8px);
  transition:opacity 460ms var(--ease), transform 460ms var(--ease);
  transition-delay:calc(320ms + var(--i, 0) * 220ms);
}
.rc-chat.is-in .rc-msg{opacity:1;transform:none;}

/* Плавная смена темы — но только для цвета, не для раскладки */
.rc, .rc-window, .rc-bubble, .rc-btn, .rc-pill, .rc-lang,
.rc-fact, .rc-plat__item, .rc-theme, .rc-nav{
  transition-property:background-color, border-color, color;
  transition-duration:220ms;
  transition-timing-function:var(--ease);
}

@media (prefers-reduced-motion:reduce){
  .rc-line > span{transform:none;}
  .rc-rule{transform:scaleX(1);}
  .rc-stagger > *,
  .rc-term .rc-tline,
  .rc-chat .rc-msg{opacity:1;transform:none;}
}

/* ═══ СНИМОК ЭКРАНА ПРИЛОЖЕНИЯ ══════════════════════════════
   Настоящий кадр из сборки, а не рисунок. Обрамление — то же,
   что у окон: волосяная рамка и радиус панели, без бутафорского
   корпуса телефона. */
.rc-plat-grid{
  display:grid;
  grid-template-columns:minmax(240px, 320px) minmax(0, 1fr);
  gap:var(--sp-48);
  align-items:start;
}
@media (max-width:820px){
  .rc-plat-grid{grid-template-columns:minmax(0,1fr);gap:var(--sp-32);}
  .rc-shot{max-width:300px;margin-inline:auto;}
}
.rc-shot{display:flex;flex-direction:column;gap:var(--sp-12);}
.rc-shot img{
  width:100%;height:auto;
  border:1px solid var(--hairline);
  border-radius:var(--r-panel);
  background:var(--canvas);
}
.rc-shot__note{
  font-family:var(--font-mono);
  font-size:var(--text-caption);
  color:var(--ink-faint);
}
/* Внутри сетки карточки платформ идут столбцом */
.rc-plat-grid .rc-plat{flex-direction:column;}
