/* ========== ЭТАП 0. Глобальные настройки ========== */

/* Reset (мягкий) */
*,
*::before,
*::after { box-sizing: border-box; }
html:focus-within { scroll-behavior: smooth; }
body, h1, h2, h3, h4, p, ul, ol, li, figure { margin: 0; padding: 0; }
ul[role="list"], ol[role="list"] { list-style: none; }
img, picture { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }

/* Типографика и палитра */
:root{
  /* Палитра — свежая и небанальная */
  --bg: #0f1220;             /* глубокой ночи */
  --bg-soft: #151a2e;        /* приглушенный */
  --card: #11162a;           /* карточки */
  --primary: #6fe3d4;        /* мятный неон */
  --primary-600: #57cbbd;
  --accent: #b388ff;         /* сиреневый акцент */
  --muted: #9aa3b2;          /* вторичный текст */
  --text: #e7ecf2;           /* основной текст */
  --danger: #ff6b6b;

  /* Тени и радиусы */
  --radius-lg: 16px;
  --radius-xl: 24px;
  --shadow-1: 0 10px 30px rgba(0,0,0,.25);
  --shadow-2: 0 6px 18px rgba(0,0,0,.3);

  /* Размеры */
  --container: 1200px;
  --h-pad: 16px;

  /* Текст */
  --ff-sans-1: "Manrope", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --ff-sans-2: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --fs-base: 16px;
  --fs-sm: 14px;
  --fs-xs: 12px;
  --fs-h3: 20px;
  --fs-h2: 28px;
  --fs-h1: 34px;
}

@media (min-width: 768px){
  :root{
    --fs-h3: 22px;
    --fs-h2: 32px;
    --fs-h1: 44px;
  }
}

html, body{
  height: 100%;
  background: radial-gradient(1200px 600px at 70% -10%, rgba(111,227,212,.15), transparent 60%) , var(--bg);
  color: var(--text);
  font-family: var(--ff-sans-1);
  font-size: var(--fs-base);
  line-height: 1.6;
}

/* Утилиты */
.container{
  width: 100%;
  max-width: var(--container);
  padding-inline: var(--h-pad);
  margin-inline: auto;
}
.btn{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .9rem 1.1rem;
  border-radius: var(--radius-lg);
  border: 1px solid transparent;
  background: var(--primary);
  color: #0a0f14;
  font-weight: 700;
  box-shadow: var(--shadow-1);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, opacity .2s ease;
}
.btn:hover{ transform: translateY(-1px); box-shadow: var(--shadow-2); }
.btn:active{ transform: translateY(0); }
.btn--primary{ background: var(--primary); }
.btn--ghost{
  background: transparent;
  color: var(--text);
  border-color: rgba(231,236,242,.2);
}
.btn--xs{ padding: .4rem .7rem; font-size: var(--fs-sm); border-radius: 12px; }
.btn--sm{ padding: .6rem .9rem; font-size: var(--fs-sm); }

/* ========== ЭТАП 1. Header ========== */
.header{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: saturate(140%) blur(8px);
  background: linear-gradient(180deg, rgba(15,18,32,.9), rgba(15,18,32,.6));
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.header--scrolled{
  background: rgba(15,18,32,.95);
}
.header__container{
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  gap: 1rem;
}
.header__logo{ display: inline-flex; align-items: center; gap:.6rem; font-weight: 800; letter-spacing: .2px; }
.logo__mark{
  width: 20px; height: 20px; border-radius: 6px;
  background: conic-gradient(from 210deg, var(--primary), var(--accent));
  box-shadow: 0 0 0 3px rgba(111,227,212,.2), 0 8px 16px rgba(179,136,255,.2);
}
.logo__mark--footer{ box-shadow: 0 0 0 3px rgba(111,227,212,.12), 0 8px 16px rgba(179,136,255,.15); }
.logo__text{ font-size: 18px; }
.logo__text--footer{ color: var(--text); }

.header__burger{
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  color: var(--text);
  transition: background .2s ease, transform .2s ease;
}
.header__burger:hover{ background: rgba(255,255,255,.06); transform: translateY(-1px); }
.header__burger i{ width: 20px; height: 20px; }

.nav{ position: fixed; inset: 64px 0 auto 0; transform: translateY(-8px); opacity: 0; pointer-events: none; transition: .2s ease; background: var(--bg); border-bottom: 1px solid rgba(255,255,255,.06); }
.nav--open{ transform: translateY(0); opacity: 1; pointer-events: auto; }
.nav__list{ display: grid; gap:.5rem; padding: .75rem var(--h-pad) 1rem; }
.nav__link{
  display: inline-flex; align-items: center; gap:.5rem; padding:.7rem 1rem; border-radius: 12px;
  color: var(--text);
  font-weight: 600;
  background: transparent;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.nav__link:hover{
  background: rgba(111,227,212,.1);
  color: var(--primary);
  transform: translateX(2px);
}
.nav__link--cta{
  background: linear-gradient(90deg, var(--primary), var(--accent));
  color: #0a0f14;
  box-shadow: var(--shadow-1);
}
.nav__link--cta:hover{ color: #091015; }

/* Desktop nav */
@media (min-width: 992px){
  .header__burger{ display: none; }
  .nav{ position: static; inset: auto; transform: none; opacity: 1; pointer-events: auto; background: transparent; border-bottom: 0; }
  .nav__list{ display: flex; align-items: center; gap:.25rem; padding: 0; }
  .nav__link{ padding:.55rem .8rem; border-radius: 10px; }
}

/* ========== Main ==========
(секции добавим позже; базовые отступы) */
.main { min-height: 40vh; }

/* ========== ЭТАП 2. Footer ========== */
.footer{
  margin-top: 64px;
  background:
    radial-gradient(800px 500px at 20% -10%, rgba(179,136,255,.15), transparent 60%),
    var(--bg-soft);
  border-top: 1px solid rgba(255,255,255,.06);
}
.footer__container{
  display: grid;
  gap: 2rem;
  padding: 2.2rem 0;
  grid-template-columns: 1fr;
}
.footer__col .footer__title{
  font-size: var(--fs-h3);
  margin-bottom: .8rem;
  font-family: var(--ff-sans-2);
}
.footer__logo{ display: inline-flex; align-items: center; gap:.6rem; margin-bottom: .8rem; }
.footer__tagline{ color: var(--muted); font-size: var(--fs-sm); }
.footer__note{ margin-top: .5rem; font-size: var(--fs-xs); color: var(--muted); opacity: .9; }

.footer-nav__list,
.footer-legal__list,
.footer-contacts__list{
  list-style: none;
  display: grid;
  gap: .5rem;
}
.footer a{ color: var(--text); }
.footer a:hover{ color: var(--primary); }

.footer__address{ font-style: normal; color: var(--muted); }
.icon{ width: 18px; height: 18px; margin-right: .5rem; transform: translateY(2px); }

.footer__disclaimer{ margin-top: .7rem; color: var(--muted); font-size: var(--fs-xs); }

.footer__bottom{ border-top: 1px solid rgba(255,255,255,.06); }
.footer__bottom-container{
  display: flex; flex-direction: column; gap: .8rem;
  align-items: flex-start; justify-content: space-between;
  padding: 1rem 0;
}
.footer__copy{ color: var(--muted); font-size: var(--fs-sm); }
.footer__actions{ display: flex; gap: .5rem; flex-wrap: wrap; }

@media (min-width: 768px){
  .footer__container{
    grid-template-columns: 1.2fr 1fr 1fr 1.2fr;
  }
  .footer__bottom-container{
    flex-direction: row; align-items: center;
  }
}

/* ===== Ссылки-CTA внутри текста ===== */
.link-cta{
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .3rem .55rem; border-radius: 10px;
  border: 1px dashed rgba(255,255,255,.2);
}
.link-cta:hover{ border-color: var(--primary); color: var(--primary); }

/* ===== Стили для будущих текстовых страниц (Этап 5 задел) ===== */
.pages{
  padding: 48px 0 80px;
}
.pages .container{
  max-width: 820px;
  background: var(--card);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-2);
  padding: 28px 22px;
}
.pages h1{
  font-size: var(--fs-h1);
  line-height: 1.2;
  margin-bottom: 16px;
  font-weight: 800;
}
.pages h2{
  font-size: var(--fs-h2);
  line-height: 1.3;
  margin: 22px 0 10px;
  font-weight: 700;
}
.pages p{
  margin: 10px 0;
  color: var(--text);
}
.pages ul{
  margin: 12px 0 12px 24px;
}
.pages li{
  margin: 8px 0;
}
.pages a{
  color: var(--primary);
  text-decoration: underline;
}
.pages strong{ font-weight: 700; }

/* Декоративные hover-микроэффекты для ссылок в футере и навигации */
.nav__link, .footer a{
  position: relative;
}
.nav__link::after, .footer a::after{
  content: ""; position: absolute; inset: auto 0 -2px 0; height: 2px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
  border-radius: 2px;
}
.nav__link:hover::after, .footer a:hover::after{ transform: scaleX(1); }

/* Подсказка: будущие секции будут использовать эти токены */
.section{ padding: 56px 0; }
.section__title{ font-size: var(--fs-h2); margin-bottom: 14px; }
.section__lead{ color: var(--muted); max-width: 60ch; }

/* ===== Hero ===== */
.hero{
  position: relative;
  padding-top: 72px;
  padding-bottom: 72px;
  overflow: clip;
  isolation: isolate;
}
.hero__canvas{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  z-index: -1; opacity: .5;
}
.hero__container{
  display: grid;
  gap: 28px;
  align-items: center;
}
@media (min-width: 992px){
  .hero__container{
    grid-template-columns: 1.1fr 0.9fr;
    gap: 40px;
  }
}
.hero__content{ max-width: 640px; }
.hero__eyebrow{
  display: inline-flex; gap:.5rem; align-items:center;
  font-size: var(--fs-xs);
  letter-spacing: .4px; text-transform: uppercase;
  color: var(--primary-600);
  padding: .25rem .5rem; border: 1px dashed rgba(255,255,255,.15);
  border-radius: 999px; background: rgba(111,227,212,.08);
  margin-bottom: 12px;
}
.hero__title{
  font-size: var(--fs-h1);
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: .2px;
}
.hero__title-accent{
  background: linear-gradient(90deg, var(--primary), var(--accent));
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  text-shadow: 0 8px 28px rgba(179,136,255,.15);
}
.hero__lead{
  margin-top: 12px;
  color: var(--muted);
}
.hero__actions{
  display: flex; gap: .6rem; flex-wrap: wrap;
  margin-top: 16px;
}
.hero__badges{
  display: grid; gap: .4rem; margin-top: 16px; list-style: none;
  grid-template-columns: 1fr;
}
.hero-badge{
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .5rem .7rem; border-radius: 12px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  font-size: var(--fs-sm);
}
.hero-badge i{ width: 18px; height: 18px; }
.hero__note{ margin-top: 10px; font-size: var(--fs-xs); color: var(--muted); }

@media (min-width: 640px){
  .hero__badges{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (min-width: 992px){
  .hero__badges{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* Hero media card */
.hero__media{ width: 100%; }
.hero-card{
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-2);
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .3s ease, box-shadow .3s ease;
}
.hero-card:hover{ transform: translateY(-2px); box-shadow: 0 12px 36px rgba(0,0,0,.35); }
.hero-card__img{ width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.hero-card__content{ padding: 16px; }
.hero-card__title{ font-size: var(--fs-h3); margin-bottom: 6px; }
.hero-card__text{ color: var(--muted); margin-bottom: 8px; }

/* Небольшая подсветка CTA при фокусе */
.btn:focus-visible, .link-cta:focus-visible{
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

/* ===== Courses ===== */
.courses__header{
  display: grid; gap: 12px; margin-bottom: 18px;
}
.courses__cta{ display: flex; gap: .6rem; flex-wrap: wrap; }

.tabs{
  display: grid; grid-auto-flow: column; gap: .5rem;
  background: rgba(255,255,255,.03);
  padding: .4rem; border-radius: 14px;
  border: 1px solid rgba(255,255,255,.06);
  overflow-x: auto;
}
.tabs__btn{
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .5rem .8rem; border-radius: 12px;
  font-weight: 700; color: var(--text);
  background: transparent; border: 1px solid transparent;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
  white-space: nowrap;
}
.tabs__btn:hover{ background: rgba(255,255,255,.05); transform: translateY(-1px); }
.tabs__btn--active{
  background: linear-gradient(90deg, var(--primary), var(--accent));
  color: #0a0f14; border-color: transparent; box-shadow: var(--shadow-1);
}

.tabs__panels{ margin-top: 16px; }
.tabs__panel{ animation: fadeIn .35s ease; }
@keyframes fadeIn { from{ opacity: 0; transform: translateY(6px);} to{ opacity: 1; transform: translateY(0);} }

.courses-grid{
  display: grid; gap: 14px;
  grid-template-columns: 1fr;
}
@media (min-width: 768px){
  .courses-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
}
@media (min-width: 1120px){
  .courses-grid{ gap: 20px; }
}

.course-card{
  display: grid;
  grid-template-rows: auto 1fr;
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-2);
  transition: transform .25s ease, box-shadow .25s ease;
}
.course-card:hover{ transform: translateY(-2px); box-shadow: 0 12px 36px rgba(0,0,0,.35); }
.course-card__img{ width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.course-card__body{ padding: 14px; display: grid; gap: 10px; }
.course-card__title{ font-size: var(--fs-h3); }
.course-card__text{ color: var(--muted); }
.course-card__list{
  list-style: none; display: grid; gap: 6px; color: var(--text);
}
.course-card__list i{ width: 18px; height: 18px; margin-right: .4rem; transform: translateY(2px); }
.course-card__actions{ display: flex; gap: .6rem; flex-wrap: wrap; }

.courses__footer{ margin-top: 14px; }
.courses__disclaimer{ font-size: var(--fs-xs); color: var(--muted); }

/* ===== Benefits ===== */
.benefits__header{ display: grid; gap: 10px; margin-bottom: 16px; }

.benefits-grid{
  display: grid; gap: 14px;
  grid-template-columns: 1fr;
}
@media (min-width: 768px){
  .benefits-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
}
@media (min-width: 1120px){
  .benefits-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
}

.benefit-card{
  position: relative;
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-xl);
  padding: 16px;
  min-height: 180px;
  display: grid; gap: 8px;
  box-shadow: var(--shadow-2);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.benefit-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(0,0,0,.35);
  border-color: rgba(111,227,212,.25);
}
.benefit-card__icon{
  width: 22px; height: 22px;
  color: var(--primary);
}
.benefit-card__title{
  font-size: var(--fs-h3);
  font-weight: 800;
}
.benefit-card__text{
  color: var(--muted);
}
.benefit-card__cta{
  margin-top: 4px;
}

/* Нежная анимация появления при скролле */
.reveal{
  opacity: 0; transform: translateY(10px);
  transition: opacity .5s ease, transform .5s ease;
}
.reveal--visible{
  opacity: 1; transform: translateY(0);
}

/* ===== Platform ===== */
.platform__header{ display:grid; gap:10px; margin-bottom:16px; }

.platform__grid{
  display:grid; gap:18px;
  grid-template-columns: 1fr;
}
@media (min-width: 992px){
  .platform__grid{
    grid-template-columns: 1.05fr 0.95fr;
    align-items: start;
  }
}

/* Media mockup */
.mockup{
  position: relative;
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-2);
  transition: transform .25s ease, box-shadow .25s ease;
}
.mockup:hover{ transform: translateY(-2px); box-shadow: 0 12px 36px rgba(0,0,0,.35); }
.mockup__img{ width:100%; aspect-ratio: 16/10; object-fit: cover; display:block; }
.mockup__glow{
  position:absolute; inset:auto 0 0 0; height: 60px;
  background: linear-gradient(180deg, rgba(111,227,212,.0), rgba(111,227,212,.12));
  filter: blur(10px);
}

.metrics{
  margin-top:12px; display:grid; gap:10px; grid-template-columns: repeat(3, minmax(0,1fr));
}
.metric{
  display:grid; justify-items:start; gap:2px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding:10px;
}
.metric i{ width:18px; height:18px; color: var(--primary); }
.metric__value{ font-weight:800; line-height:1.2; }
.metric__label{ font-size: var(--fs-xs); color: var(--muted); }

/* Content */
.platform__content{ display:grid; gap:16px; }

.checklist{
  display:grid; gap:10px;
}
.checklist__item{
  display:grid; grid-template-columns: 28px 1fr; gap:10px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding:12px;
  transition: border-color .25s ease, transform .25s ease;
}
.checklist__item:hover{ border-color: rgba(111,227,212,.25); transform: translateY(-1px); }
.checklist__item i{ width:22px; height:22px; color: var(--primary); }
.checklist__title{ font-weight:800; }
.checklist__text{ color: var(--muted); }

.stepper{
  position: relative;
  display:grid; gap:12px;
  padding-left: 2px;
}
.stepper::before{
  content:""; position:absolute; left:9px; top:8px; bottom:8px; width:2px;
  background: linear-gradient(180deg, rgba(179,136,255,.35), rgba(111,227,212,.35));
  border-radius: 2px;
}
.stepper__item{ position:relative; display:grid; grid-template-columns: 20px 1fr; gap:10px; }
.stepper__dot{
  width:18px; height:18px; border-radius:50%;
  background: radial-gradient(circle at 35% 35%, var(--primary), var(--accent));
  box-shadow: 0 0 0 3px rgba(111,227,212,.18);
  transform: translateY(2px);
}
.stepper__item--active .stepper__dot{ box-shadow: 0 0 0 4px rgba(179,136,255,.24); }
.stepper__title{ font-weight:800; }
.stepper__text{ color: var(--muted); }

.platform__actions{ display:flex; gap:.6rem; flex-wrap: wrap; }
.platform__note{ font-size: var(--fs-xs); color: var(--muted); }

/* ===== Reviews ===== */
.reviews__header{ display:grid; gap:10px; margin-bottom:16px; }

.reviews-slider{
  position: relative;
  display: grid;
  gap: 10px;
}
.reviews-slider__viewport{
  overflow: hidden;
  border-radius: var(--radius-xl);
  border: 1px solid rgba(255,255,255,.08);
  background: var(--card);
  outline: none;
}
.reviews-slider__track{
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  transition: transform .45s cubic-bezier(.2,.7,.2,1);
  will-change: transform;
}

.review-card{
  display: grid;
  gap: 10px;
  padding: 16px;
}
.review-card__head{
  display: grid; grid-template-columns: 48px 1fr; gap: 10px; align-items: center;
}
.review-card__avatar{
  width: 48px; height: 48px; border-radius: 14px; object-fit: cover;
  box-shadow: 0 6px 18px rgba(0,0,0,.3);
}
.review-card__name{ font-weight: 800; }
.review-card__role{ color: var(--muted); font-size: var(--fs-sm); }
.review-card__text{ color: var(--text); }
.review-card__footer{
  margin-top: 6px; display:flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap;
}
.review-card__rating{ color: var(--accent); letter-spacing: 1px; }

/* Controls */
.reviews-slider__controls{
  position: absolute; inset: 0; display: flex; justify-content: space-between; align-items: center; pointer-events: none;
  padding: 8px;
}
.reviews-slider__btn{
  pointer-events: auto;
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 12px;
  background: rgba(15,18,32,.7);
  border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(6px);
  transition: transform .2s ease, background .2s ease;
}
.reviews-slider__btn:hover{ transform: translateY(-1px); background: rgba(15,18,32,.9); }
.reviews-slider__btn i{ width: 20px; height: 20px; }

/* Dots */
.reviews-slider__dots{
  display: flex; justify-content: center; gap: 6px;
}
.reviews-slider__dot{
  width: 10px; height: 10px; border-radius: 999px; font-size: 0;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(255,255,255,.08);
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.reviews-slider__dot--active{
  transform: scale(1.2);
  border-color: transparent;
  background: linear-gradient(90deg, var(--primary), var(--accent));
}

/* На больших экранах показываем 2 слайда */
@media (min-width: 992px){
  .reviews-slider__track{
    grid-auto-columns: 50%;
  }
}

/* ===== Contact ===== */
.contact__header{ display:grid; gap:10px; margin-bottom:16px; }

.contact__grid{
  display:grid; gap:18px; grid-template-columns: 1fr;
}
@media (min-width: 992px){
  .contact__grid{ grid-template-columns: 1fr .9fr; align-items: start; }
}

/* Form */
.form{
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-xl);
  padding: 16px;
  box-shadow: var(--shadow-2);
  display:grid; gap: 12px;
}
.form__row{ display:grid; gap:6px; }
.form__label{ font-weight:700; }
.form__input{
  width:100%;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  color: var(--text);
  border-radius: 12px;
  padding: .8rem .9rem;
  outline: none;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.form__input:focus{
  border-color: rgba(111,227,212,.45);
  box-shadow: 0 0 0 4px rgba(111,227,212,.15);
}
.form__error{
  color: var(--danger);
  font-size: var(--fs-xs);
  min-height: 1.1em;
}

.form__row--captcha .captcha{
  display:grid; grid-template-columns: 1fr 110px 42px; gap:8px; align-items: center;
}
.captcha__question{
  font-weight:800; letter-spacing:.2px;
  background: rgba(255,255,255,.03);
  border:1px dashed rgba(255,255,255,.12);
  border-radius:12px; padding:.6rem .7rem;
}
.captcha__input{ text-align:center; }
.captcha__refresh{ padding:.6rem; }

.form__row--consent .checkbox{
  display:flex; align-items: flex-start; gap:.6rem;
}
.checkbox input{ display:none; }
.checkbox__box{
  width:20px; height:20px; border-radius:6px;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);
  display:inline-block; position: relative; flex: 0 0 20px;
}
.checkbox input:checked + .checkbox__box{
  border-color: transparent;
  background: linear-gradient(90deg, var(--primary), var(--accent));
}
.checkbox input:checked + .checkbox__box::after{
  content:""; position:absolute; inset:4px; border-radius:4px; background: rgba(0,0,0,.35);
}
.checkbox__label a{ color: var(--primary); text-decoration: underline; }

.form__actions{ display:flex; gap:.6rem; flex-wrap:wrap; }

.form__result{
  margin-top: 4px;
  padding: .7rem .9rem;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(111,227,212,.10);
  color: var(--text);
}

/* Aside */
.contact__info{ display:grid; gap: 12px; }
.contact-card{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-xl);
  padding: 14px;
  display:grid; gap: 10px;
}
.contact-card__title{ font-size: var(--fs-h3); }
.contact-card__list{ list-style:none; display:grid; gap:8px; }
.contact-card__list i{ width:18px; height:18px; margin-right:.4rem; transform:translateY(2px); color: var(--primary); }
.contact-card__note{ font-size: var(--fs-xs); color: var(--muted); }

.contact-badges{ display:flex; gap:.5rem; flex-wrap: wrap; }
.badge{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.4rem .6rem; border:1px solid rgba(255,255,255,.08);
  border-radius: 999px; background: rgba(255,255,255,.03);
  font-size: var(--fs-sm);
}
.badge i{ width:16px; height:16px; color: var(--primary); }

/* ===== Cookie Pop-up ===== */
.cookie{
  position: fixed; inset: auto 0 0 0; z-index: 60;
  padding: 10px var(--h-pad) 14px;
  pointer-events: none; opacity: 0; transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease;
}
.cookie--show{ pointer-events: auto; opacity: 1; transform: translateY(0); }
.cookie__container{
  margin: 0 auto; max-width: var(--container);
  display: grid; gap: 10px; align-items: center;
  grid-template-columns: 1fr auto;
  background: rgba(15,18,32,.9);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 12px;
  backdrop-filter: blur(8px);
  box-shadow: var(--shadow-2);
}
.cookie__text{ display:flex; gap:.6rem; align-items: center; color: var(--text); }
.cookie__text a{ color: var(--primary); text-decoration: underline; }
.cookie__icon{ width: 20px; height: 20px; color: var(--primary); }
.cookie__accept{ justify-self: end; }

/* ===== Доп. улучшения для страниц политик (Этап 5) ===== */
.pages .container{
  /* уже задано выше — добавим чуть воздуха на десктопе */
}
.pages .container p + ul{ margin-top: 6px; }
.pages ul li{ padding-left: 6px; }
.pages ul li::marker{ color: var(--primary); }