/* ===== Tokens ===== */
:root {
    /* Turquoise accent palette */
    /* Цвет «брендовых» теней/свечений (RGB). На center переопределяется на синий — см. body.page-kover-center. */
    --sh1: 20, 184, 166;   /* teal-500 */
    --sh2: 13, 148, 136;   /* teal-600 (глубже) */
    --sh3: 94, 234, 212;   /* teal-300 (светлое свечение) */
    --sh-dark: 11, 31, 29;   /* тёмная тень #0b1f1d (зелёно-чёрная) */
    --teal-50:  #f0fdfa;
    --teal-100: #ccfbf1;
    --teal-200: #99f6e4;
    --teal-300: #5eead4;
    --teal-400: #2dd4bf;
    --teal-500: #14b8a6;
    --teal-600: #0d9488;
    --teal-700: #0f766e;
    --teal-800: #115e59;

    --brand:       var(--teal-500);
    --brand-dark:  var(--teal-600);
    --brand-soft:  var(--teal-50);
    --brand-ring:  rgba(var(--sh1),  0.18);

    --accent:      #f97316; /* warm secondary */

    --ink:         #0b1f1d;
    --ink-2:       #4b5b59;
    --ink-3:       #8a9694;

    --line:        #e6efed;
    --line-2:      #d4e2df;

    --bg:          #ffffff;
    --bg-soft:     #f5fbfa;
    --bg-mint:     #ecfdf8;

    --radius-lg:   24px;
    --radius:      18px;
    --radius-sm:   12px;

    /* Унифицированные радиусы и высоты для элементов управления.
       Используются везде, чтобы кнопки / переключатели / floating-плашки
       выглядели согласованно. Менять только здесь. */
    --r-btn:       12px;   /* .btn */
    --r-pill:      999px;  /* .lang pill, бирюзовые pill-кнопки */
    --r-card:      16px;   /* .sl-sticky, .cookie-banner, modal cards */
    --h-btn-sm:    38px;   /* .btn--sm / .lang — единая высота */

    /* ============================================================
       Единый вертикальный ритм блоков на всех страницах сайта.
       Source of truth — менять размер ТОЛЬКО здесь.

       КАК ПОЛЬЗОВАТЬСЯ при добавлении новой секции:
       1. Дефолтный <section> уже получает padding: var(--section-py) 0
          через универсальное правило `section { padding: ... }`.
       2. Если рядом стоят две секции класса .sl-section, ставим на ВТОРУЮ
          модификатор .sl-section--no-top — это убирает padding-top, чтобы
          gap между секциями остался ровно --section-py (а не удваивался).
       3. .sl-section--no-bottom — аналогично для последней в группе.
       4. На мобильных --section-py автоматически уменьшается до 72px
          в @media (max-width: 768px) — НЕ переопределять вручную.

       Исключения с собственными отступами (не трогать):
       Hero, .uhero, .article__head, footer, modal-card. */
    --section-py: 116px;

    --shadow-xs:   0 1px 2px rgba(var(--sh-dark),  0.04);
    --shadow-sm:   0 4px 14px rgba(var(--sh-dark),  0.06);
    --shadow-md:   0 18px 40px rgba(var(--sh-dark),  0.08);
    --shadow-lg:   0 30px 60px rgba(var(--sh1),  0.22);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
html, body {
    overflow-x: hidden; /* fallback for browsers without clip support */
    overflow-x: clip;   /* preferred — does not create a new scroll container, so position: sticky keeps working */
}
body {
    font-family: 'Manrope', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: var(--ink);
    background: var(--bg);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; }

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ===== Typography ===== */
h1, h2, h3, h4 {
    line-height: 1.12;
    color: var(--ink);
    letter-spacing: -0.025em;
    font-weight: 800;
}
h1 { font-size: clamp(36px, 5.6vw, 64px); }
h2 { font-size: clamp(28px, 3.6vw, 44px); }
h3 { font-size: 20px; font-weight: 700; }
h4 { font-size: 14px; font-weight: 700; }
p { color: var(--ink-2); }

.eyebrow {
    display: none; /* плашки-«eyebrow» над заголовками убраны на всех сайтах */
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--brand-dark);
    background: var(--brand-soft);
    padding: 7px 14px;
    border-radius: 999px;
    margin-bottom: 16px;
    border: 1px solid var(--teal-100);
}
.eyebrow--light {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    border-color: rgba(255,255,255,0.18);
}

.section-head { text-align: center; max-width: 760px; margin: 0 auto 50px; }
.section-sub { margin-top: 16px; font-size: 18px; }

/* ===== Buttons ===== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 15px 26px;
    font: 600 15px/1 'Manrope', sans-serif;
    letter-spacing: -0.01em;
    border-radius: 12px;
    border: 1.5px solid transparent;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .25s ease, background .2s ease, color .2s ease, border-color .2s ease;
    white-space: nowrap;
}
.btn:hover { transform: translateY(-2px); }
/* Small button — фиксированная высота, чтобы lang-переключатель и
   соседние .btn--sm в шапке всегда совпадали по высоте. */
.btn--sm { padding: 0 18px; height: var(--h-btn-sm); font-size: 14px; }
.btn--block { width: 100%; }
/* Атрибут hidden у кнопок: класс .btn задаёт display, поэтому усиливаем. */
.btn[hidden] { display: none !important; }

.btn--primary {
    background: var(--brand);
    color: #fff;
    box-shadow: 0 14px 30px rgba(var(--sh1),  0.34);
}
.btn--primary:hover { background: var(--brand-dark); box-shadow: 0 18px 36px rgba(var(--sh1),  0.42); }

.btn--secondary {
    background: #fff;
    color: var(--ink);
    border-color: var(--line);
}
.btn--secondary:hover { border-color: var(--brand); color: var(--brand-dark); }

.btn--outline {
    background: transparent;
    color: var(--brand-dark);
    border-color: var(--teal-300);
}
.btn--outline:hover { background: var(--brand); color: #fff; border-color: var(--brand); }

/* Вторая кнопка в hero — всегда белая (на всех сайтах/страницах, включая темы data-program) */
.hero__cta .btn.btn--outline {
    background: #fff;
    color: var(--ink);
    border-color: #fff;
}
.hero__cta .btn.btn--outline:hover {
    background: #fff;
    color: var(--brand-dark);
    border-color: #fff;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
}

.btn--ghost {
    background: transparent;
    color: var(--ink);
    border-color: var(--line);
}
.btn--ghost:hover { background: var(--ink); color: #fff; border-color: var(--ink); }

.btn--white {
    background: #fff;
    color: var(--brand-dark);
}
.btn--white:hover { background: var(--brand-soft); }

/* ===== Header ===== */
.header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: saturate(180%) blur(18px);
    -webkit-backdrop-filter: saturate(180%) blur(18px);
    border-bottom: 1px solid var(--line);
}
.header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 76px;
}
.logo { display: inline-flex; align-items: center; gap: 12px; font-weight: 800; }
img.logo__mark {
    width: 42px;
    height: 42px;
    display: block;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    flex-shrink: 0;
}
/* Backwards-compat: на странице остался <span class="logo__mark">K</span>
   — оставляем для них старый стиль. */
span.logo__mark {
    width: 40px; height: 40px;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--teal-400), var(--teal-600));
    color: #fff;
    border-radius: 12px;
    font-weight: 800;
    font-size: 18px;
    box-shadow: 0 6px 16px rgba(var(--sh1),  0.4);
}
/* Унифицированное соотношение KOVER : EDUCATION = ~1.65 во всех точках.
   KOVER — основной текст (бирюзовый акцент).
   EDUCATION — small, нейтральный (серый или белый-полупрозрачный). */
.logo__text {
    display: inline-flex;
    flex-direction: column;
    font-size: 18px;
    line-height: 1;
    letter-spacing: -0.012em;
    font-weight: 800;
    color: var(--teal-700);
}
.logo__text small {
    font-size: 11px;
    font-weight: 700;
    color: var(--ink-2);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-top: 5px;
}
/* Тёмный фон (footer): KOVER — светлее бирюзовый, EDUCATION — полупрозрачный белый */
.logo--light .logo__text { color: var(--teal-500); }
.logo--light .logo__text small { color: rgba(255, 255, 255, 0.7); }
/* Footer: lighten the dark logo SVG (originally fill=currentColor=black)
   to white via CSS filter. */
.logo--light img.logo__mark {
    filter: brightness(0) invert(1);
}
/* Footer brand: те же пропорции, увеличенный масштаб */
.footer__col--brand .logo { gap: 14px; }
.footer__col--brand img.logo__mark { width: 56px; height: 56px; }
.footer__col--brand .logo__text { font-size: 26px; }
.footer__col--brand .logo__text small { font-size: 16px; margin-top: 7px; }

.header__tools { display: inline-flex; align-items: center; gap: 16px; }
.lang {
    display: inline-flex;
    align-items: center;
    height: var(--h-btn-sm);          /* идентично .btn--sm */
    padding: 3px;
    background: var(--bg-soft);
    border: 1.5px solid var(--line);  /* такая же толщина обводки как у .btn */
    border-radius: var(--r-pill);
}
.lang__btn {
    background: transparent;
    border: none;
    color: var(--ink-2);
    font: 700 11px/1 'Manrope', sans-serif;
    letter-spacing: 0.06em;
    height: 100%;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    border-radius: var(--r-pill);
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.lang__btn:hover { color: var(--ink); }
.lang__btn.is-active {
    background: var(--brand);
    color: #fff;
    box-shadow: 0 2px 6px rgba(var(--sh1),  0.35);
}

.nav { display: flex; gap: 30px; }
.nav a {
    font-weight: 500;
    color: var(--ink-2);
    transition: color .15s ease;
    position: relative;
}
.nav a::after {
    content: "";
    position: absolute;
    left: 0; bottom: -6px;
    width: 0; height: 2px;
    background: var(--brand);
    transition: width .2s ease;
}
.nav a:hover { color: var(--ink); }
.nav a:hover::after { width: 100%; }

/* (Old nav-item--dropdown rules removed; dropdown styles live below at .nav-dropdown) */

/* ===== Hero ===== */
.hero {
    position: relative;
    min-height: calc(100vh - 76px);
    max-height: calc(100vh - 76px);
    padding: 40px 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    color: #fff;
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(var(--sh1),  0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(var(--sh3),  0.18), transparent 60%),
        linear-gradient(160deg, #0b1f1d 0%, #0f2e2a 50%, #0a2724 100%);
}
.hero .container { width: 100%; }
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(var(--sh3), 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--sh3), 0.08) 1px, transparent 1px);
    background-size: 60px 60px;
    mask-image: radial-gradient(ellipse at 50% 50%, #000 30%, transparent 75%);
    -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000 30%, transparent 75%);
    pointer-events: none;
}

/* Prague silhouette layers */
.hero__silhouette {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: auto;
    pointer-events: none;
    z-index: 0;
}
.hero__silhouette--back {
    color: rgba(var(--sh3),  0.08);
    transform: translateY(2px);
}
.hero__silhouette--front {
    color: rgba(var(--sh1),  0.18);
}
.hero__inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.hero__content {
    max-width: 980px;
    width: 100%;
}
.hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--line);
    color: var(--ink);
    box-shadow: var(--shadow-sm);
    margin-bottom: 24px;
}
.hero__badge::before {
    content: "";
    width: 8px; height: 8px;
    background: var(--brand);
    border-radius: 50%;
    box-shadow: 0 0 0 4px var(--brand-ring);
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0%, 100% { box-shadow: 0 0 0 0 var(--brand-ring); }
    50%      { box-shadow: 0 0 0 8px rgba(var(--sh1), 0.05); }
}

.hero h1 {
    margin-bottom: 56px;
    color: #fff;
}
.hero h1 .accent {
    background: linear-gradient(135deg, #5eead4 0%, #2dd4bf 60%, #14b8a6 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.hero__sub { font-size: 19px; max-width: 640px; margin: 0 auto 36px; color: rgba(255,255,255,0.85); line-height: 1.55; }
.hero__sub strong { color: #fff; font-weight: 700; }
.hero h1:has(+ .hero__sub) { margin-bottom: 18px; }

.hero__stats {
    list-style: none;
    margin: 0 auto 40px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    padding: 0;
    max-width: 1080px;
    width: 100%;
}
.hero__stat {
    border-radius: 18px;
    text-align: center;
    perspective: 1200px;
    min-height: 168px;
}
.hero__stat-inner {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 168px;
    transition: transform .9s cubic-bezier(.6,.05,.25,1);
    transform-style: preserve-3d;
    transform: rotateY(var(--flip-deg, 0deg));
}
.hero__stat-face {
    position: absolute;
    inset: 0;
    border-radius: 18px;
    padding: 22px 20px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: hidden;
}
.hero__stat-face--front {
    background: rgba(255, 255, 255, 0.04);
    transition: background .25s ease;
}
.hero__stat:hover .hero__stat-face--front {
    background: rgba(255, 255, 255, 0.07);
}
.hero__stat-face--back {
    transform: rotateY(180deg);
    background-color: rgba(255,255,255,0.04);
    background-size: cover;
    background-position: center;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}
.hero__stat-face--back::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15,23,42,0) 50%, rgba(15,23,42,0.55) 100%);
}
.hero__stat-icon {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    margin-bottom: 12px;
    font-size: 19px;
    background: rgba(var(--sh3),  0.12);
    border-radius: 11px;
}
.hero__stat-value {
    display: block;
    font-size: clamp(26px, 2.6vw, 34px);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    background: linear-gradient(135deg, #5eead4, #14b8a6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 10px;
}
.hero__stat-value small {
    font-size: 16px;
    font-weight: 700;
    margin-left: 4px;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.85);
    letter-spacing: 0;
}
.hero__stat-hint {
    display: block;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.45;
}

.hero__cta {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    justify-content: center;
}

.hero__visual {
    position: relative;
    height: 100%;
    min-height: 480px;
    display: flex;
    flex-direction: column;
}

.hero__photo {
    position: relative;
    flex: 1;
    border-radius: 28px;
    overflow: hidden;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.06),
        0 30px 80px rgba(var(--sh1),  0.35),
        0 12px 32px rgba(0, 0, 0, 0.5);
    isolation: isolate;
}
.hero__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .8s ease;
}
.hero__photo:hover img { transform: scale(1.03); }
.hero__photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(var(--sh-dark),  0) 50%, rgba(var(--sh-dark),  0.35) 100%);
    pointer-events: none;
    z-index: 1;
}
.hero__photo-tag {
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 2;
    padding: 7px 14px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: 0.02em;
    box-shadow: var(--shadow-sm);
}

.hero__pill {
    position: relative;
    margin: -36px 24px 0;
    z-index: 3;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 18px 8px;
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: 4px;
    box-shadow: 0 18px 50px rgba(var(--sh-dark),  0.14);
}
.hero__pill-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
    padding: 0 10px;
}
.hero__pill-item b {
    font-size: 32px;
    font-weight: 800;
    color: var(--brand-dark);
    letter-spacing: -0.03em;
    line-height: 1;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.hero__pill-item span {
    font-size: 13px;
    color: var(--ink-2);
    line-height: 1.3;
    font-weight: 500;
}
.hero__pill-item span strong { color: var(--ink); font-weight: 700; }
.hero__pill-divider {
    width: 1px;
    align-self: stretch;
    background: var(--line);
    margin: 6px 0;
}

/* ===== Sections shared ===== */
section { padding: var(--section-py) 0; }

/* ============================================================
   Унификация gap между секциями site-wide.

   Проблема: каждая «paddingful» секция (.programs, .why-kover,
   .consult, .help-prog, .reviews, .cmp-section,
   .ct-form-section, .sl-section) имеет свой
   padding: var(--section-py) 0 — top + bottom. Если две идут
   подряд, gap между ними = bottom(100) + top(100) = 200px.
   На страницах с цепочкой .sl-section--no-top — gap 100px.
   Отсюда жалобы «отступы на разных страницах разные».

   Решение: когда любая paddingful секция следует за другой
   paddingful (и предшественник — НЕ .hero), сбрасываем top
   padding. Тогда gap всегда = var(--section-py) ровно.

   После .hero оставляем top — между hero и первой секцией
   нужен полноценный воздух (hero имеет свой малый padding).

   Специфичность (0,2,2) гарантированно бьёт правила .programs
   и т.д. (0,1,0). */
section:not(.hero) + section.help-prog,
section:not(.hero) + section.programs,
section:not(.hero) + section.why-kover,
section:not(.hero) + section.reviews,
section:not(.hero) + section.consult,
section:not(.hero) + section.cmp-section,
section:not(.hero) + section.ct-form-section,
section:not(.hero) + section.sl-section { padding-top: 0; }

/* ===== Why ===== */
.why { background: #fff; }
.why__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.feature {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 30px 26px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    position: relative;
    overflow: hidden;
}
.feature::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 4px;
    background: linear-gradient(90deg, var(--teal-400), var(--teal-600));
    transform: translateY(-4px);
    transition: transform .25s ease;
}
.feature:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
    border-color: transparent;
}
.feature:hover::before { transform: translateY(0); }
.feature__icon {
    width: 56px; height: 56px;
    display: grid; place-items: center;
    font-size: 26px;
    background: var(--brand-soft);
    border-radius: 14px;
    margin-bottom: 20px;
    transition: transform .25s ease;
}
.feature:hover .feature__icon { transform: rotate(-6deg) scale(1.05); }
.feature h3 { margin-bottom: 12px; font-size: 18px; }
.feature p { font-size: 14.5px; }

/* ===== We Help (Smart program intro) ===== */
.help-prog {
    position: relative;
    overflow: hidden;
    background: var(--bg-soft);
    padding-top: var(--section-py);
    padding-bottom: var(--section-py);
}
.help-prog .container { position: relative; z-index: 1; }

/* Decorative study-themed emojis around the steps */
.steps-emojis {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}
.steps-emoji {
    position: absolute;
    line-height: 0;
    color: var(--teal-200);
    opacity: 0.85;
    will-change: transform;
}
.steps-emoji svg {
    width: 100%;
    height: 100%;
    display: block;
}
.steps-emoji--tl {
    left: 4%; top: 110px;
    width: 64px; height: 64px;
    transform: rotate(-14deg);
    animation: emojiFloatA 9s ease-in-out infinite;
}
.steps-emoji--lm {
    left: 6%; top: 46%;
    width: 50px; height: 50px;
    transform: rotate(8deg);
    animation: emojiFloatB 11s ease-in-out infinite;
}
.steps-emoji--bl {
    left: 3%; bottom: 110px;
    width: 72px; height: 72px;
    transform: rotate(18deg);
    animation: emojiFloatC 13s ease-in-out infinite;
}
.steps-emoji--tr {
    right: 4%; top: 140px;
    width: 70px; height: 70px;
    transform: rotate(12deg);
    animation: emojiFloatD 10s ease-in-out infinite;
}
.steps-emoji--rm {
    right: 6%; top: 48%;
    width: 46px; height: 46px;
    transform: rotate(-10deg);
    animation: emojiFloatA 12s ease-in-out infinite reverse;
}
.steps-emoji--br {
    right: 3%; bottom: 90px;
    width: 60px; height: 60px;
    transform: rotate(-16deg);
    animation: emojiFloatB 10s ease-in-out infinite reverse;
}
@keyframes emojiFloatA {
    0%, 100% { transform: rotate(-14deg) translateY(0)   scale(1);    }
    50%      { transform: rotate(-6deg)  translateY(-18px) scale(1.06); }
}
@keyframes emojiFloatB {
    0%, 100% { transform: rotate(8deg)  translateY(0)   scale(1);    }
    50%      { transform: rotate(16deg) translateY(16px) scale(1.05); }
}
@keyframes emojiFloatC {
    0%, 100% { transform: rotate(18deg) translateY(0)   scale(1);    }
    50%      { transform: rotate(10deg) translateY(-14px) scale(1.08); }
}
@keyframes emojiFloatD {
    0%, 100% { transform: rotate(12deg) translateY(0)   scale(1);    }
    50%      { transform: rotate(4deg)  translateY(18px) scale(1.05); }
}
@media (max-width: 1280px) {
    .steps-emoji--tl, .steps-emoji--tr { width: 50px; height: 50px; }
    .steps-emoji--lm, .steps-emoji--rm { width: 38px; height: 38px; }
    .steps-emoji--bl, .steps-emoji--br { width: 54px; height: 54px; }
}
@media (max-width: 1024px) {
    .steps-emojis { display: none; }
}

/* Decorative Prague photos around the steps */
.steps-decor {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}
.steps-decor__photo {
    position: absolute;
    width: 210px;
    height: 270px;
    background-size: cover;
    background-position: center;
    border-radius: 14px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14), 0 0 0 6px rgba(255,255,255,0.65);
    opacity: 0.55;
    filter: saturate(0.85) brightness(1.02);
    transition: opacity .4s ease;
    will-change: transform;
}
.steps-decor__photo--tl {
    left: 2.5%;
    top: 90px;
    transform: rotate(-7deg);
    animation: decorFloatA 9s ease-in-out infinite;
}
.steps-decor__photo--bl {
    left: 4%;
    bottom: 110px;
    transform: rotate(5deg);
    animation: decorFloatB 11s ease-in-out infinite;
}
.steps-decor__photo--tr {
    right: 3%;
    top: 130px;
    transform: rotate(6deg);
    animation: decorFloatC 10s ease-in-out infinite;
}
.steps-decor__photo--br {
    right: 2.5%;
    bottom: 90px;
    transform: rotate(-5deg);
    animation: decorFloatD 12s ease-in-out infinite;
}
@keyframes decorFloatA {
    0%, 100% { transform: rotate(-7deg) translateY(0); }
    50%      { transform: rotate(-5deg) translateY(-12px); }
}
@keyframes decorFloatB {
    0%, 100% { transform: rotate(5deg) translateY(0); }
    50%      { transform: rotate(7deg) translateY(10px); }
}
@keyframes decorFloatC {
    0%, 100% { transform: rotate(6deg) translateY(0); }
    50%      { transform: rotate(4deg) translateY(-10px); }
}
@keyframes decorFloatD {
    0%, 100% { transform: rotate(-5deg) translateY(0); }
    50%      { transform: rotate(-7deg) translateY(12px); }
}
@media (max-width: 1280px) {
    .steps-decor__photo { width: 170px; height: 220px; }
    .steps-decor__photo--tl { left: 1%; top: 70px; }
    .steps-decor__photo--bl { left: 1.5%; bottom: 90px; }
    .steps-decor__photo--tr { right: 1.5%; top: 100px; }
    .steps-decor__photo--br { right: 1%; bottom: 70px; }
}
@media (max-width: 1024px) {
    .steps-decor { display: none; }
}

.help-prog__head {
    text-align: center;
    max-width: 880px;
    margin: 0 auto 50px;
}
.help-prog__head h2 {
    margin: 14px 0 18px;
}

/* Steps — vertical timeline with reveal-on-scroll animation */
.steps {
    list-style: none;
    /* Цепочка шагов всегда на всю ширину контейнера (12 колонок) — на всех сайтах. */
    max-width: none;
    margin: 0 auto;
    padding: 0;
    position: relative;
}
/* Растягиваем цепочку шагов на всю ширину контейнера (12 колонок) */
.steps--full { max-width: none; }
.steps::before {
    content: "";
    position: absolute;
    left: 60px;
    top: 60px;
    bottom: 60px;
    width: 2px;
    background: linear-gradient(180deg, var(--teal-300) 0%, var(--teal-200) 60%, transparent 100%);
    z-index: 0;
}
.step {
    display: grid;
    grid-template-columns: 68px 1fr;
    gap: 28px;
    padding: 36px 44px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    margin-bottom: 22px;
    align-items: center;
    position: relative;
    z-index: 1;
    color: var(--ink);
    transition:
        box-shadow .45s ease,
        border-color .45s ease,
        background .45s ease,
        color .45s ease;
}
.step:hover {
    background: var(--teal-50);
    border-color: var(--teal-300);
    box-shadow: 0 14px 32px rgba(var(--sh1),  0.14);
    transform: translateY(-2px);
}
.step:hover .step__num {
    transform: scale(1.1);
    background: #fff;
    color: var(--teal-700);
    text-shadow: none;
    box-shadow: 0 10px 24px rgba(var(--sh1),  0.35), 0 0 0 2px var(--teal-300);
}
.step:hover .step__num::before {
    opacity: 1;
}
.step__num {
    transition: transform .4s cubic-bezier(.5,0,.3,1.4), box-shadow .4s ease;
}

.step__num {
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    font-weight: 800;
    font-size: 17px;
    letter-spacing: -0.02em;
    display: grid;
    place-items: center;
    box-shadow: 0 6px 16px rgba(var(--sh1),  0.3);
    flex-shrink: 0;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
}
.step__num::before {
    content: "";
    position: absolute;
    inset: -5px;
    border-radius: 50%;
    background: var(--teal-100);
    opacity: 0;
    z-index: -1;
    transition: opacity .25s ease;
}
.step:hover .step__num::before { opacity: 1; }
/* kover.center синий: тень вокруг цифры шага вместо бирюзовой */
body.page-kover-center .step__num { box-shadow: 0 6px 16px rgba(37, 99, 235, 0.3); }
body.page-kover-center .step:hover .step__num { box-shadow: 0 10px 24px rgba(37, 99, 235, 0.35), 0 0 0 2px var(--teal-300); }
/* и сама карточка шага при наведении — синяя тень вместо зелёной */
body.page-kover-center .step:hover { box-shadow: 0 14px 32px rgba(37, 99, 235, 0.14); }

/* Кликабельная карточка-шаг (вместо кнопки «Оставить заявку») со стрелкой справа.
   Зазор резервируем на .step__body (выше по специфичности, чем мобильный .step padding). */
.step--link { cursor: pointer; }
.step--link .step__body { padding-right: 40px; }
.step--link .step__chev {
    position: absolute; right: 26px; top: 50%; transform: translateY(-50%);
    width: 24px; height: 24px; color: var(--brand); flex: none;
    transition: transform .2s ease; pointer-events: none;
}
.step--link:hover .step__chev { transform: translateY(-50%) translateX(4px); }
.step__stretch { position: absolute; inset: 0; z-index: 3; border-radius: inherit; }
@media (max-width: 640px) {
    .step--link .step__body { padding-right: 24px; }
    .step--link .step__chev { right: 14px; width: 20px; height: 20px; }
}
.step__cta { margin-top: 14px; }
.step__body h3 {
    font-size: 21px;
    margin-bottom: 6px;
    line-height: 1.25;
    font-weight: 700;
}
.step__body p {
    font-size: 13px;
    color: var(--ink-2);
    line-height: 1.5;
}
.step__body p b { color: var(--ink); font-weight: 700; }

/* Step 03: expandable card — toggle + animated reveal */
.step__toggle {
    margin-top: 14px;
    background: none;
    border: none;
    color: var(--teal-700);
    font: 600 14px 'Manrope', sans-serif;
    padding: 6px 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    text-align: left;
    white-space: nowrap;
    transition: color .2s ease;
    align-self: flex-start;
}
.step__toggle:hover { color: var(--teal-500); }
.step__toggle-icon {
    width: 16px;
    height: 16px;
    transition: transform .3s ease;
}
.step__toggle[aria-expanded="true"] .step__toggle-icon {
    transform: rotate(180deg);
}
.step__expand {
    max-height: 0;
    overflow: hidden;
    transition: max-height .55s cubic-bezier(.4, 0, .2, 1);
}
.step__expand-inner {
    padding-top: 18px;
}
.step__expand-text {
    font-size: 14px;
    color: var(--ink-2);
    line-height: 1.55;
    margin-bottom: 18px;
}

/* Step 03: photo gallery — реальные фото с занятий */
.step-gallery {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 160px;
    gap: 10px;
    margin-top: 22px;
    width: 100%;
    align-self: stretch;
}
.step-gallery__photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
    display: block;
    background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 100%);
}
@media (max-width: 720px) {
    .step-gallery { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 140px; }
}
@media (max-width: 480px) {
    .step-gallery { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 120px; }
}

/* Step 04: embedded universities — compact logos only, 7 in a row */
.step--wide .step__body { padding-right: 4px; }
.step--wide .unis__grid.step__unis {
    grid-template-columns: repeat(9, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
    max-width: none;
    padding-right: 8px;
}
.step--wide .step__unis .uni {
    position: relative;
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
    border-radius: 10px;
    display: block;
    aspect-ratio: 1 / 1;
}
.step--wide .step__unis .uni::after {
    content: "↗";
    position: absolute;
    top: 3px;
    right: 4px;
    width: 14px;
    height: 14px;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.92);
    color: var(--teal-700);
    font-size: 10px;
    font-weight: 800;
    border-radius: 50%;
    line-height: 1;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.18);
    transition: transform .2s ease, background .2s ease;
    pointer-events: none;
    z-index: 2;
}
.step--wide .step__unis .uni:hover::after {
    transform: scale(1.18);
    background: #fff;
}
.step--wide .step__unis .uni:hover {
    transform: translateY(-3px);
    box-shadow: none;
    border-color: transparent;
}
.step--wide .step__unis .uni__logo {
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: clamp(6px, 1.2vw, 10px);
    font-size: clamp(8px, 1.4vw, 11px);
    letter-spacing: 0.02em;
}
.step--wide .step__unis .uni--more .uni__logo--more {
    background: linear-gradient(135deg, var(--teal-400), var(--teal-700));
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 6px;
}
.uni__more-grid {
    display: grid;
    grid-template-columns: repeat(3, 4px);
    grid-gap: 2.5px;
    line-height: 0;
}
.uni__more-grid i {
    width: 4px;
    height: 4px;
    background: #fff;
    border-radius: 1.5px;
    opacity: 0.92;
}
.uni__more-label {
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #fff;
}
@media (max-width: 760px) {
    .step--wide .unis__grid.step__unis { gap: 6px; max-width: 100%; }
}
@media (max-width: 480px) {
    .step--wide .unis__grid.step__unis { gap: 4px; }
}

/* ===== Programs ===== */
.programs {
    background: var(--bg-soft);
    padding-top: var(--section-py);
    padding-bottom: var(--section-py);
}
.programs__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: stretch;
}
.plan {
    --plan-bg: #fff;
    --plan-color: var(--ink);
    --plan-border: var(--line);
    --plan-divider: var(--line-2);
    --plan-meta: var(--ink-3);
    --plan-price-color: var(--ink-2);
    --plan-price-num: var(--ink);
    --plan-shadow: none;
    position: relative;
    background: var(--plan-bg);
    color: var(--plan-color);
    border: 1px solid var(--plan-border);
    border-radius: 22px;
    padding: 34px 30px;
    display: flex;
    flex-direction: column;
    box-shadow: var(--plan-shadow);
    transition:
        transform .25s ease,
        box-shadow .35s ease,
        border-color .35s ease,
        background .35s ease,
        color .35s ease;
}
.programs__grid:not(:has(.plan:hover)) .plan--featured,
.plan:hover { transform: translateY(-6px); }

/* Dark highlight applied to: default Standard plan, OR any plan hovered */
.programs__grid:not(:has(.plan:hover)) .plan--featured,
.plan:hover {
    --plan-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(var(--sh3),  0.28), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    --plan-color: #fff;
    --plan-border: var(--teal-400);
    --plan-divider: rgba(255, 255, 255, 0.22);
    --plan-meta: rgba(255, 255, 255, 0.7);
    --plan-price-color: rgba(255, 255, 255, 0.8);
    --plan-price-num: #fff;
    --plan-shadow: 0 22px 50px rgba(var(--sh2),  0.32);
}
/* Кнопка-outline на тёмном фоне выделенной программы — белая обводка и текст */
.programs__grid:not(:has(.plan:hover)) .plan--featured .btn--outline,
.plan:hover .btn--outline {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.55);
}
.programs__grid:not(:has(.plan:hover)) .plan--featured .btn--outline:hover,
.plan:hover .btn--outline:hover {
    background: #fff;
    color: var(--brand-dark);
    border-color: #fff;
}
.plan__ribbon {
    position: absolute;
    top: -14px; right: 28px;
    background: linear-gradient(160deg, #0b1f1d 0%, #0f2e2a 55%, #0a2724 100%);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 7px 16px;
    border-radius: 999px;
    box-shadow: 0 8px 18px rgba(var(--sh-dark),  0.45);
}
.plan__head {
    padding-bottom: 22px;
    margin-bottom: 22px;
    border-bottom: 1px dashed var(--plan-divider);
}
.plan__head h3 { font-size: 24px; margin-bottom: 10px; color: var(--plan-color); }
.plan__price { font-size: 14px; color: var(--plan-price-color); }
.plan__price b { font-size: 28px; color: var(--plan-price-num); font-weight: 800; letter-spacing: -0.02em; }
.plan__row {
    display: block;
    padding: 10px 0;
    font-size: 14px;
}
.plan__row > span {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--plan-meta);
    margin-bottom: 8px;
}
.plan__row p { color: var(--plan-color); font-size: 14.5px; }
.plan__row ul { list-style: none; display: grid; gap: 8px; }
.plan__row ul li {
    position: relative;
    padding-left: 22px;
    color: var(--plan-color);
    font-size: 14.5px;
}
.plan__row ul li::before {
    content: "";
    position: absolute;
    left: 0; top: 6px;
    width: 14px; height: 14px;
    background:
        linear-gradient(135deg, var(--teal-400), var(--teal-600));
    border-radius: 50%;
}
.plan__row ul li::after {
    content: "✓";
    position: absolute;
    left: 3px; top: 4px;
    color: #fff;
    font-size: 9px;
    font-weight: 800;
}
.plan .btn { margin-top: auto; }

/* ===== Quiz ===== */
.quiz {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(var(--sh3),  0.25), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.quiz::before, .quiz::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
}
.quiz::before { width: 400px; height: 400px; top: -150px; left: -100px; }
.quiz::after  { width: 320px; height: 320px; bottom: -120px; right: -80px; }

.quiz__inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 60px;
    align-items: center;
}
.quiz__text h2 { color: #fff; margin-bottom: 18px; }
.quiz__text p { color: rgba(255, 255, 255, 0.88); font-size: 17px; margin-bottom: 28px; }

.quiz__visual {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}
.quiz__chip {
    padding: 14px 22px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(10px);
    border-radius: 999px;
    font-weight: 600;
    color: #fff;
    transition: transform .25s ease, background .25s ease;
}
.quiz__chip:hover { background: rgba(255, 255, 255, 0.22); transform: translateY(-3px); }
.quiz__chip:nth-child(odd) { transform: translateY(-10px); }
.quiz__chip:nth-child(odd):hover { transform: translateY(-13px); }

/* ===== Universities ===== */
.unis { background: #fff; }
.unis__grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 16px;
}
.uni {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 28px 16px;
    text-align: center;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.uni:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--teal-200); }
.uni__logo {
    width: 68px; height: 68px;
    margin: 0 auto 18px;
    display: grid; place-items: center;
    font-weight: 800;
    font-size: 14px;
    color: #fff;
    border-radius: 18px;
    letter-spacing: 0.02em;
    box-shadow: var(--shadow-sm);
}
.uni h3 { font-size: 15px; margin-bottom: 4px; line-height: 1.25; }
.uni p { font-size: 13px; }
.uni__logo--1 { background: linear-gradient(135deg, #ef4444, #b91c1c); }
.uni__logo--2 { background: linear-gradient(135deg, var(--teal-400), var(--teal-600)); }
.uni__logo--3 { background: linear-gradient(135deg, #0ea5e9, #0369a1); }
.uni__logo--4 { background: linear-gradient(135deg, #f59e0b, #b45309); }
.uni h3 { margin-bottom: 6px; }
.uni p { font-size: 14px; }

.unis__cta { text-align: center; margin-top: 52px; }

/* ===== Reviews ===== */
.reviews {
    background: var(--bg-soft);
    padding-top: var(--section-py);
    padding-bottom: var(--section-py);
}
.reviews__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.review {
    position: relative;
    background: #fff;
    border-radius: var(--radius);
    overflow: hidden;
    border: 1px solid var(--line);
    transition: transform .25s ease, box-shadow .25s ease;
    cursor: pointer;
}
.review:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.review__photo {
    aspect-ratio: 4/3;
    display: grid;
    place-items: center;
    font-size: 80px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.85);
    text-shadow: 0 4px 14px rgba(0,0,0,0.15);
}
.review__play {
    position: absolute;
    top: 30%; left: 50%;
    transform: translate(-50%, -50%);
    width: 56px; height: 56px;
    background: rgba(255, 255, 255, 0.95);
    color: var(--brand-dark);
    border-radius: 50%;
    display: grid; place-items: center;
    font-size: 18px;
    box-shadow: var(--shadow-md);
    transition: transform .25s ease;
}
.review:hover .review__play { transform: translate(-50%, -50%) scale(1.12); }
.review__body { padding: 20px 22px 24px; }
.review__body h3 { font-size: 17px; margin-bottom: 4px; }
.review__uni {
    font-size: 13px;
    font-weight: 600;
    color: var(--brand-dark);
    margin-bottom: 12px;
}
.review__quote { font-size: 14px; font-style: italic; line-height: 1.5; }

/* Google review card variant (used inline in the video reviews slider) */
.review--google {
    text-decoration: none;
    color: var(--ink);
    display: flex;
    flex-direction: column;
}
.review__photo--google {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border-bottom: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: var(--ink);
}
.review__google-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 700;
    color: var(--ink-2);
    letter-spacing: 0.01em;
}
.review__google-brand svg {
    width: 28px;
    height: 28px;
}
.review__google-stars {
    color: #fbbc05;
    font-size: 26px;
    letter-spacing: 2px;
    line-height: 1;
}
.review--google .review__body h3 {
    font-size: 17px;
    color: var(--ink);
}
.review--google .review__uni {
    color: var(--ink-3);
    font-weight: 600;
}

/* Video review card (YouTube iframe embed) */
.review--video {
    text-decoration: none;
    color: var(--ink);
    display: flex;
    flex-direction: column;
    cursor: default;
}
.review--video:hover { color: var(--ink); }
.review__video {
    aspect-ratio: 9 / 16;        /* портрет — под YouTube Shorts */
    position: relative;
    overflow: hidden;
    background: #000;
    width: 100%;
    display: block;
}
.review__video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}
.review--video .review__body { padding: 14px 16px 16px; }
.review--video .review__body h3 { font-size: 16px; margin-bottom: 4px; }
.review--video .review__uni {
    color: var(--ink-3);
    font-weight: 600;
    margin-bottom: 0;
    font-size: 13px;
}

/* Reviews slider */
.reviews__slider {
    position: relative;
}
.reviews__grid--slider {
    display: flex;
    grid-template-columns: none;
    gap: 20px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    /* запас сверху/снизу, чтобы тень приподнятой при наведении карточки не обрезалась overflow-y */
    padding: 16px 2px 40px;
    scroll-padding-left: 4px;
}
.reviews__grid--slider::-webkit-scrollbar { display: none; }
.reviews__grid--slider .review {
    flex: 0 0 calc((100% - 60px) / 4); /* 4 cards visible, with 3 gaps of 20px */
    scroll-snap-align: start;
    min-width: 260px;
}
.reviews__nav {
    position: absolute;
    top: 50%;
    width: 36px;
    height: 36px;
    border-radius: 0;
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
    cursor: pointer;
    display: grid;
    place-items: center;
    z-index: 5;
    transition: transform .2s ease, color .2s ease;
    color: var(--teal-600);
}
.reviews__nav:hover {
    color: var(--teal-700);
}
.reviews__nav svg { width: 28px; height: 28px; }
.reviews__nav--prev { left: -54px; transform: translateY(-50%); }
.reviews__nav--next { right: -54px; transform: translateY(-50%); }
.reviews__nav--prev:hover { transform: translateY(-50%) translateX(-3px); }
.reviews__nav--next:hover { transform: translateY(-50%) translateX(3px); }
.reviews__nav[disabled] {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
@media (max-width: 1100px) {
    .reviews__grid--slider .review { flex-basis: calc((100% - 40px) / 3); }
}
@media (max-width: 760px) {
    .reviews__grid--slider .review { flex-basis: calc((100% - 20px) / 2); }
    .reviews__nav--prev { left: -28px; }
    .reviews__nav--next { right: -28px; }
}
@media (max-width: 540px) {
    .reviews__grid--slider .review { flex-basis: 82%; }
    /* Let the slider bleed to the viewport edge on the right so the next card peeks in */
    .reviews .reviews__slider { margin-right: -24px; }
    .reviews .reviews__grid--slider { padding-right: 24px; }
}

/* ===== Teacher cards (reuse reviews slider) ===== */
.review--teacher {
    text-decoration: none;
    color: var(--ink);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    text-align: left;
    width: 100%;
    font: inherit;
    padding: 0;
    border: 1px solid var(--line);
}
.review--teacher .review__photo {
    width: 100%;
    aspect-ratio: 1 / 1;
    font-size: 62px;
    letter-spacing: 2px;
    background-size: cover;
    background-position: center;
}
.review--teacher .review__body {
    padding: 16px 18px 18px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.review--teacher .review__more {
    margin-top: 12px;
    font-size: 13px;
    font-weight: 700;
    color: var(--brand-dark);
}
.review--teacher:hover { color: var(--ink); }
.review--teacher:hover .review__more { text-decoration: underline; }
.teacher-pop__role {
    color: var(--brand-dark);
    font-weight: 700;
    font-size: 14px;
    margin: 0 0 12px;
}

/* ===== Teacher silhouette placeholder (пока нет фото) ===== */
.teacher-sil { color: #9aa8bd; display: block; }
.review--teacher .review__photo .teacher-sil { width: 46%; height: 46%; }
.upop__logo .teacher-sil { width: 62%; height: 62%; }

/* ===== Pricing: старая (зачёркнутая) цена + примечание ===== */
.sl-price__old {
    display: block;
    text-decoration: line-through;
    color: var(--ink-3);
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 2px;
}
.sl-price--best .sl-price__old { color: rgba(255, 255, 255, 0.55); }
.sl-pricing-note {
    text-align: center;
    margin-top: 18px;
    font-size: 13.5px;
    color: var(--ink-3);
}

/* ===== Pricing: блоки по периодам (две таблицы цен) ===== */
.sl-pricing-block + .sl-pricing-block { margin-top: 40px; }
.sl-pricing-period {
    text-align: center;
    font-size: 18px;
    font-weight: 800;
    margin: 0 0 20px;
    color: var(--ink);
}
.sl-pricing-period span {
    display: block;
    margin-top: 4px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--brand-dark);
}

/* ===== «Чешский 365» vs обычные курсы — сравнительная таблица (на всю ширину) ===== */
.cmp365 {
    width: 100%;
    border: 1px solid var(--line);
    border-radius: 22px;
    overflow: hidden;
    background: #fff;
}
.cmp365__head { display: grid; grid-template-columns: 1fr 1fr; }
.cmp365__hcell { padding: 18px 28px; font-weight: 800; font-size: 17px; }
.cmp365__hcell--bad { color: #dc2626; background: #fff; }
.cmp365__hcell--good { color: var(--brand-dark); background: #fff; border-left: 1px solid var(--line); }
.cmp365__row { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
.cmp365__cell { padding: 22px 28px; display: flex; gap: 13px; font-size: 15px; line-height: 1.55; }
.cmp365__cell--bad { color: var(--ink-3); }
.cmp365__cell--bad h3 { font-size: 16.5px; margin: 0 0 4px; color: var(--ink-2); line-height: 1.3; }
.cmp365__cell--bad p { margin: 0; }
.cmp365__cell--good { background: #fff; border-left: 1px solid var(--line); }
.cmp365__cell--good h3 { font-size: 16.5px; margin: 0 0 4px; color: var(--ink); line-height: 1.3; }
.cmp365__cell--good p { margin: 0; color: var(--ink-2); }
.cmp365__ic {
    flex: 0 0 auto;
    width: 24px; height: 24px;
    border-radius: 50%;
    display: grid; place-items: center;
    font-size: 12px; font-weight: 800;
    margin-top: 1px;
}
.cmp365__ic--x { background: #fee2e2; color: #ef4444; }
.cmp365__ic--check { background: var(--brand-soft); color: var(--brand-dark); }
@media (max-width: 700px) {
    /* каждая строка (за + против) — отдельная плашка, между плашками отступ */
    .cmp365 { border: none; border-radius: 0; background: transparent; overflow: visible; }
    .cmp365__head { display: none; }
    .cmp365__row {
        grid-template-columns: 1fr;
        border: 1px solid var(--line);
        border-radius: 16px;
        overflow: hidden;
        background: #fff;
        margin-bottom: 16px;
    }
    .cmp365__row:last-child { margin-bottom: 0; }
    .cmp365__cell { flex-wrap: wrap; padding: 16px 18px; }
    .cmp365__cell::before {
        content: attr(data-label);
        flex-basis: 100%;
        font-size: 11px; font-weight: 800;
        letter-spacing: 0.06em; text-transform: uppercase;
        color: var(--ink-3);
        margin-bottom: 4px;
    }
    .cmp365__cell--good { border-left: none; border-top: 1px solid var(--line); }
}

/* ===== Guide block ===== */
.guide-block {
    background: #fff;
    padding-top: var(--section-py);
    padding-bottom: var(--section-py);
}
.guide-block__inner {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 60px;
    align-items: center;
}
.guide-cover {
    aspect-ratio: 3/4;
    max-width: 320px;
    margin: 0 auto;
    background: linear-gradient(160deg, var(--teal-600) 0%, var(--teal-800) 100%);
    color: #fff;
    border-radius: 18px;
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: var(--shadow-lg);
    transform: rotate(-3deg);
    position: relative;
    transition: transform .4s ease;
}
.guide-cover:hover { transform: rotate(0deg) scale(1.03); }
.guide-cover::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(300px 200px at 80% 10%, rgba(255, 255, 255, 0.22), transparent 60%);
    border-radius: 18px;
    pointer-events: none;
}
.guide-cover__small { font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; opacity: 0.85; }
.guide-cover__title { font-size: 26px; font-weight: 800; line-height: 1.18; letter-spacing: -0.02em; }
.guide-cover__brand { font-weight: 700; opacity: 0.9; }

/* ===== Forms ===== */
.form { display: grid; gap: 12px; }
.form input, .form select {
    width: 100%;
    padding: 14px 18px;
    font: 500 15px 'Manrope', sans-serif;
    color: var(--ink);
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 12px;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.form select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 44px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d9488' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 18px 18px;
    cursor: pointer;
}
.form select:invalid { color: var(--ink-3); }
.form select option { color: var(--ink); }
.form input:focus, .form select:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 4px var(--brand-ring);
}
.form label {
    display: grid;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink-2);
}
.form--inline {
    grid-template-columns: 1fr 1fr auto;
    align-items: center;
}
.form--card {
    background: #fff;
    border-radius: var(--radius-lg);
    padding: 36px;
    border: 1px solid var(--line);
}
.form--card:hover,
.pay-form:hover,
.calc:hover,
.prof-tabs:hover,
.prof-panel:hover,
.map-card:hover,
.ct-map:hover { box-shadow: var(--shadow-md); }
.form--card h3 { margin-bottom: 20px; font-size: 22px; }
/* Inline submit error (вместо нативного alert) */
.form__error {
    margin: 4px 0 2px;
    padding: 10px 12px;
    border-radius: var(--r-btn, 12px);
    background: #fdecec;
    border: 1px solid #f3b4b4;
    color: #a11616;
    font-size: 13px;
    line-height: 1.45;
}
.form__error[hidden] { display: none; }
/* В grid-формах (квиз, consult) ошибка — отдельной строкой во всю ширину под
   полями, иначе вставляется в свободную ячейку грида (сбоку от поля ввода). */
.form__grid .form__error { grid-column: 1 / -1; }

.form__hint { font-size: 12px; color: var(--ink-3); margin-top: 4px; line-height: 1.5; }
.form__hint a {
    color: var(--teal-700);
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
    font-weight: 600;
}
.form__hint a:hover { color: var(--teal-500); }
.form__hint--privacy { margin-top: 6px; }
/* Privacy hint inside the dark .consult teal card */
.consult .form--card .form__hint a {
    color: #fff;
    text-decoration-color: rgba(255, 255, 255, 0.6);
}
.consult .form--card .form__hint a:hover {
    text-decoration-color: #fff;
}

/* ===== Payment ===== */
.payment {
    background: var(--bg-soft);
    padding-top: var(--section-py);
    padding-bottom: var(--section-py);
}
.payment__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.pay {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 36px 30px;
    text-align: left;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.pay:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--teal-200); }
.pay--accent {
    background: linear-gradient(160deg, var(--teal-500) 0%, var(--teal-700) 100%);
    color: #fff;
    border-color: transparent;
    box-shadow: var(--shadow-lg);
}
.pay--accent:hover { border-color: transparent; }
.pay--accent h3 { color: #fff; }
.pay--accent p { color: rgba(255,255,255,0.88); }
.pay--accent .pay__tag { background: rgba(255, 255, 255, 0.2); color: #fff; border-color: rgba(255,255,255,0.25); }
.pay__tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 6px 12px;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border: 1px solid var(--teal-100);
    border-radius: 999px;
    margin-bottom: 22px;
}
.pay__highlight {
    font-size: 60px;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
    margin-bottom: 14px;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pay--accent .pay__highlight {
    background: none;
    -webkit-text-fill-color: #fff;
    color: #fff;
}
.pay h3 { margin-bottom: 14px; font-size: 19px; }
.pay p { font-size: 15px; }

.payment__cta { text-align: center; margin-top: 52px; }

/* ===== Consultation ===== */
.consult {
    /* На главной и страницах программ — bg-soft под цвет соседних
       секций (.programs / .sl-section). Внутри статей (.article__consult)
       и кейсов (.case-consult) фон переопределяется на transparent,
       чтобы плашка-форма «парила» между белыми блоками. */
    background: var(--bg-soft);
    padding-top: var(--section-py);
    padding-bottom: var(--section-py);
}
.consult__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}
.consult__inner--wide {
    grid-template-columns: 1fr;
    gap: 50px;
}
.consult__head {
    text-align: center;
    max-width: 820px;
    margin: 0 auto 36px;
}
.consult__icon {
    display: inline-grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    margin-bottom: 12px;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}
.consult__icon svg { width: 30px; height: 30px; }
.consult__head h2 { margin: 14px 0 22px; }
.consult__head p { font-size: 17px; line-height: 1.55; }
.consult__head p b { color: var(--ink); }
/* На мобиле описание не&nbsp;шире, чем поля ввода: уменьшаем шрифт и
   подрезаем max-width, чтобы текст визуально совпадал с шириной input. */
@media (max-width: 540px) {
    .consult__head { margin-bottom: 24px; }
    .consult__head h2 { font-size: 26px; margin: 10px 0 14px; }
    .consult__head p { font-size: 14.5px; line-height: 1.5; max-width: 32ch; margin-left: auto; margin-right: auto; }
}

/* Consult form card — teal gradient bg, like the Quiz block */
.consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(var(--sh3),  0.25), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 28px 60px rgba(var(--sh2),  0.32);
}
.consult .form--card .consult__head h2,
.consult .form--card .consult__head p,
.consult .form--card .consult__head p b { color: #fff; }
.consult .form--card .eyebrow {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.25);
}
.consult .form--card label { color: rgba(255, 255, 255, 0.85); }
.consult .form--card input,
.consult .form--card select {
    background: rgba(255, 255, 255, 0.97);
    border-color: transparent;
    color: var(--ink);
}
.consult .form--card input::placeholder { color: var(--ink-3); }
.consult .form--card input:focus,
.consult .form--card select:focus {
    border-color: #fff;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.35);
}
.consult .form--card .btn--primary {
    background: #fff;
    color: var(--brand-dark);
}
.consult .form--card .btn--primary:hover {
    background: #fff;
    box-shadow: 0 18px 36px rgba(255, 255, 255, 0.25);
    color: var(--teal-700);
}
.consult .form--card .form__hint {
    color: rgba(255, 255, 255, 0.7);
}

.form--wide {
    width: 100%;
    max-width: none;
    padding: 48px clamp(40px, 8vw, 110px);
}
.form--wide .form__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    max-width: 920px;
    margin: 0 auto;
}
.form--wide .form__grid--with-btn {
    grid-template-columns: 1fr 1fr 1.6fr auto;
    align-items: end;
}
.form--wide .form__grid--with-btn .btn {
    padding: 14px 28px;
    height: 51px;
}
.form--wide .form__hint {
    margin: 16px auto 0;
    text-align: center;
    max-width: 920px;
}
@media (max-width: 900px) {
    .form--wide .form__grid--with-btn { grid-template-columns: 1fr 1fr; }
    .form--wide .form__grid--with-btn .btn { grid-column: 1 / -1; }
}
@media (max-width: 768px) {
    /* Pull the consult card's huge clamp() padding down so input fields
       can breathe on tablets and phones. Container padding следует общему
       правилу, чтобы плашка по ширине совпадала с другими секциями. */
    .form--wide { padding: 32px 22px; }
}
@media (max-width: 540px) {
    .form--wide .form__grid--with-btn { grid-template-columns: 1fr; }
    /* Higher specificity than the .form--card mobile padding rule
       so the consult form really gets compact paddings → inputs wider. */
    .form--card.form--wide { padding: 22px 14px; }
    .form--wide .form__grid { gap: 12px; }
    .consult .form input,
    .consult .form select { padding: 13px 14px; }
    /* Контейнер consult-формы держит общий горизонтальный отступ .container
       (24px), чтобы бирюзовая плашка по ширине совпадала с карточками
       соседних секций (.programs / .why-kover / etc.). */
}


/* ===== Cookie consent banner — точно как .sl-sticky: одна высота, шрифт, радиус ===== */
.cookie-banner {
    position: fixed;
    left: 0;
    right: 0;                                             /* на всю ширину экрана, поверх виджет-иконок */
    bottom: 0;
    z-index: 9000;
    padding: 16px 24px;
    background: linear-gradient(160deg, var(--teal-800, #0f2e2a) 0%, #0a2724 100%);
    color: #fff;
    border-radius: 0;
    box-shadow: 0 -8px 30px rgba(var(--sh-dark),  0.28);
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
    transition: opacity 0.32s ease, transform 0.32s ease;
}
/* На время показа баннера прячем плавающие иконки (tg/ИИ) — баннер их полностью перекрывает */
body:has(.cookie-banner.is-visible) .cwidget { display: none; }
/* Контент центрируем на широких экранах */
.cookie-banner__inner { max-width: 1240px; margin: 0 auto; }
/* kover.center: тёмно-синий фон вместо зелёного хвоста градиента */
body.page-kover-center .cookie-banner { background: linear-gradient(160deg, var(--teal-800) 0%, #0a1a3a 100%); }
.cookie-banner.is-visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
/* Single-row flex layout: icon + text on the left, buttons on the right */
.cookie-banner__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: nowrap;
}
.cookie-banner__icon {
    font-size: 22px;
    flex-shrink: 0;
    line-height: 1;
}
.cookie-banner__text {
    flex: 1 1 auto;
    margin: 0;
    font-size: 13px;                            /* как sl-sticky__info span */
    line-height: 1.3;
    color: rgba(255, 255, 255, 0.85);
    font-weight: 600;                           /* как sl-sticky usp */
}
.cookie-banner__text a {
    color: var(--teal-300, #5eead4);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.cookie-banner__text a:hover { color: #fff; }
.cookie-banner__actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    margin-left: auto;
}
.cookie-banner__btn { white-space: nowrap; }
.cookie-banner #cookieAccept,
.cookie-banner #cookieAccept.btn--primary {
    background: #fff;
    color: var(--teal-700);
    padding: 12px 22px;                         /* идентично sl-sticky__cta */
    height: auto;
    font-size: 14.5px;
    border-radius: var(--r-btn);
    box-shadow: 0 4px 14px rgba(var(--sh-dark),  0.25);
}
.cookie-banner #cookieAccept:hover { background: var(--teal-50); color: var(--teal-800); }
.cookie-banner #cookieReject,
.cookie-banner #cookieReject.btn--outline {
    background: transparent;
    color: rgba(255, 255, 255, 0.85);
    border: 1.5px solid rgba(255, 255, 255, 0.25);
    padding: 12px 18px;
    height: auto;
    font-size: 14.5px;
    border-radius: var(--r-btn);
}
.cookie-banner #cookieReject:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.06);
}

@media (max-width: 720px) {
    .cookie-banner { left: 0; right: 0; bottom: 0; padding: 12px 16px; border-radius: 0; }
    /* текст наверху, обе кнопки строкой ниже на всю ширину */
    .cookie-banner__inner { flex-wrap: wrap; gap: 10px 12px; }
    .cookie-banner__icon { font-size: 18px; }
    .cookie-banner__text { font-size: 12.5px; line-height: 1.35; flex: 1 1 200px; }
    .cookie-banner__actions { flex: 1 1 100%; margin-left: 0; gap: 10px; }
    .cookie-banner__btn { flex: 1 1 0; padding: 11px 14px !important; font-size: 13.5px !important; }
    .cookie-banner #cookieReject { padding: 11px 14px !important; }
}
@media (max-width: 480px) {
    .cookie-banner__icon { display: none; }
    /* обе кнопки (Принять + Отклонить) видны и в мобильной версии */
}

/* Когда есть и cookie-banner, и sl-sticky одновременно — sticky сдвигается выше */
.cookie-banner.is-visible ~ .sl-sticky {
    bottom: 90px;
}

/* ===== Phone input with country dial dropdown ===== */
.phone-input {
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
    border: 1.5px solid var(--line);
    border-radius: 12px;
    background: #fff;
    overflow: visible;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.phone-input:focus-within {
    border-color: var(--brand);
    box-shadow: 0 0 0 4px var(--brand-ring);
}
.phone-input__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 10px 0 14px;
    border: none;
    background: transparent;
    color: var(--ink);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    border-right: 1px solid rgba(15, 23, 42, 0.08);
    white-space: nowrap;
    flex-shrink: 0;
}
.phone-input__btn:focus-visible {
    outline: 2px solid var(--teal-500);
    outline-offset: -2px;
    border-radius: 8px;
}
.phone-input__dial { letter-spacing: 0.01em; }
.phone-input__chev {
    width: 11px;
    height: 7px;
    transition: transform 0.18s ease;
}
.phone-input__btn[aria-expanded="true"] .phone-input__chev {
    transform: rotate(180deg);
}
.phone-input__number {
    flex: 1 1 auto;
    min-width: 0;
    border: none !important;
    background: transparent !important;
    padding-left: 12px !important;
    border-radius: 0 12px 12px 0 !important;
}
.phone-input__list {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 30;
    width: 100%;
    min-width: 280px;
    max-height: 280px;
    overflow-y: auto;
    margin: 0;
    padding: 6px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.18), 0 4px 12px rgba(15, 23, 42, 0.08);
    list-style: none;
    color: var(--ink);
    font-size: 14.5px;
}
.phone-input__list[hidden] { display: none; }
.phone-input__list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 8px;
    cursor: pointer;
    color: var(--ink);
    transition: background 0.12s ease;
}
.phone-input__list li b {
    font-weight: 700;
    color: var(--teal-700);
    min-width: 54px;
}
.phone-input__list li span { color: var(--ink-2); }
.phone-input__list li:hover,
.phone-input__list li:focus,
.phone-input__list li[aria-selected="true"] {
    background: rgba(var(--sh2),  0.08);
    outline: none;
}
.phone-input__list li[aria-selected="true"] b { color: var(--teal-700); }

/* Make the .consult dark-theme phone field match the rest of inputs (white) */
.consult .form--card .phone-input {
    background: rgba(255, 255, 255, 0.97);
    border-color: transparent;
}
.consult .form--card .phone-input__btn {
    color: var(--ink);
    border-right-color: rgba(15, 23, 42, 0.10);
}
.consult .form--card .phone-input__number {
    color: var(--ink);
    background: transparent !important;
}
.consult .form--card .phone-input__number::placeholder { color: var(--ink-3); }
.consult .form--card .phone-input:focus-within {
    border-color: #fff;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.35);
}

@media (max-width: 540px) {
    .phone-input__list { min-width: 100%; }
    .phone-input__btn { padding: 0 8px 0 12px; }
}
.consult__text h2 { margin-bottom: 18px; }
.consult__text > p { font-size: 17px; margin-bottom: 28px; }
.consult__text > p b { color: var(--ink); }
.consult__list {
    list-style: none;
    display: grid;
    gap: 14px;
}
.consult__list li {
    font-weight: 500;
    color: var(--ink);
    display: flex;
    align-items: center;
    gap: 12px;
}
.consult__list li::before {
    content: "✓";
    width: 24px; height: 24px;
    display: grid; place-items: center;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border-radius: 50%;
    font-weight: 800;
    font-size: 13px;
    flex-shrink: 0;
}
.consult__list li { padding-left: 0; }
.consult__list li::marker { content: ""; }

/* override the literal "✓ " in HTML text */
.consult__list li {
    font-size: 15.5px;
}

/* ===== Footer ===== */
.footer {
    background: #0b1f1d;
    color: rgba(255, 255, 255, 0.7);
    padding: 80px 0 30px;
    position: relative;
    overflow: hidden;
}
.footer::before {
    content: "";
    position: absolute;
    top: -50%; right: -10%;
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(var(--sh1),  0.18), transparent 60%);
    pointer-events: none;
}
.footer__inner {
    position: relative;
    display: grid;
    grid-template-columns: 1.6fr 1fr 1.2fr 1fr 1fr;
    gap: 36px;
    padding-bottom: 50px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.footer__col { display: flex; flex-direction: column; gap: 12px; }
.footer__col--brand p { color: rgba(255, 255, 255, 0.6); font-size: 14px; max-width: 320px; }
.footer__col h4 { color: #fff; margin-bottom: 6px; font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; }
.footer__col a, .footer__col span { color: rgba(255, 255, 255, 0.65); font-size: 14.5px; transition: color .15s ease; }
.footer__col a:hover { color: var(--teal-300); }

.footer__social { display: flex; gap: 10px; margin-top: 12px; }
.footer__social a {
    width: 40px; height: 40px;
    display: grid; place-items: center;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    color: #fff;
    transition: background .15s ease, transform .15s ease, color .15s ease;
}
.footer__social a svg { width: 20px; height: 20px; display: block; }
.footer__social a:hover { background: var(--brand); color: #fff; transform: translateY(-2px); }

/* Clickable contacts in the footer: teal + bold so they read as links */
.footer__col a.footer__contact {
    color: var(--teal-300);
    font-weight: 700;
}
.footer__col a.footer__contact:hover { color: #fff; }

.footer__bottom {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 30px;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.5);
}
.footer__legal { display: flex; gap: 24px; }
.footer__legal a { color: rgba(255, 255, 255, 0.6); }
.footer__legal a:hover { color: var(--teal-300); }

/* ===== Modal ===== */
.modal {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    overflow-y: auto;             /* fallback на случай высоких диалогов */
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain; /* прокрутка внутри попапа не «цепляет» страницу */
}
.modal.is-open { display: flex; }
/* На мобильных верхний/нижний центр недостаточен — выравниваем к верху,
   уменьшаем отступы и даём диалогу прокрутку (для высоких форм). */
@media (max-width: 640px) {
    .modal {
        align-items: flex-start;
        padding: 20px 12px;
    }
}
.modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(var(--sh-dark),  0.65);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.modal__dialog {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: var(--radius-lg);
    padding: 40px;
    max-width: 460px;
    width: 100%;
    box-shadow: var(--shadow-lg);
    animation: pop .3s ease;
}
@keyframes pop {
    from { transform: scale(0.94) translateY(10px); opacity: 0; }
    to   { transform: scale(1) translateY(0); opacity: 1; }
}
.modal__dialog h3 { font-size: 24px; margin: 12px 0 12px; }
.modal__dialog p { margin-bottom: 22px; font-size: 15px; }
.modal__close {
    position: absolute;
    top: 14px; right: 14px;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--bg-soft);
    border: none;
    font-size: 22px;
    color: var(--ink-2);
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
    line-height: 1;
    /* Стек выше .upop / .modal__dialog содержимого, чтобы крестик всегда
       перехватывал клик/тап (на мобильных скроллящийся .upop иначе перекрывал
       hit-test и закрытие не срабатывало). */
    z-index: 5;
    pointer-events: auto;
}
.modal__close:hover { background: var(--brand-soft); color: var(--brand-dark); }
/* Mobile: чуть крупнее touch-target + лучше видно на тёмном фоне popup */
@media (max-width: 640px) {
    .modal__close {
        width: 44px;
        height: 44px;
        top: 10px;
        right: 10px;
        font-size: 26px;
        background: rgba(255, 255, 255, 0.95);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
    }
}

/* ===== Responsive ===== */
/* ===== Universities page ===== */
.nav a.is-active { color: var(--ink); }
.nav a.is-active::after { width: 100%; }

.uni { cursor: pointer; }
.uni__logo--5 { background: linear-gradient(135deg, #8b5cf6, #6d28d9); }
.uni__logo--6 { background: linear-gradient(135deg, #ec4899, #be185d); }

/* Page background — different rhythm than homepage */
.page-unis { background: var(--bg-soft); }

/* ---------- Hero (включает каталог) ---------- */
.uhero {
    position: relative;
    padding: 40px 0 100px;
    background: #fff;
    border-bottom: 1px solid var(--line);
}
.uhero__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 36px;
    flex-wrap: wrap;
}
.uhero__crumbs {
    font-size: 13px;
    font-weight: 600;
    color: var(--ink-3);
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.uhero__crumbs a { color: var(--brand-dark); }
.uhero__crumbs a:hover { color: var(--brand); }
.uhero__crumbs span { color: var(--ink-3); }

.uhero__stamp {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    background: var(--brand-soft);
    border: 1px solid var(--teal-100);
    border-radius: 999px;
    padding: 8px 18px 8px 8px;
}
.uhero__stamp b {
    display: inline-grid;
    place-items: center;
    width: 40px; height: 40px;
    border-radius: 50%;
    background: var(--brand);
    color: #fff;
    font-weight: 800;
    font-size: 16px;
}
.uhero__stamp span { font-size: 13px; color: var(--ink); font-weight: 600; line-height: 1.3; }

.uhero__head { max-width: 880px; }
.uhero__head h1 {
    margin: 18px 0 22px;
    font-size: clamp(34px, 5vw, 58px);
}
.uhero__head h1 .accent {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.uhero__sub { font-size: 18px; max-width: 760px; }
.uhero__sub strong { color: var(--ink); font-weight: 700; }

.uhero__cta {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 28px;
}

/* Filter — horizontal toolbar */
.ufilter {
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    align-items: end;
    background: var(--bg-soft);
    padding: 18px;
    border-radius: 18px;
    border: 1px solid var(--line);
}
.ufilter > .btn { grid-column: 1 / -1; }
@media (max-width: 760px) {
    .ufilter { grid-template-columns: 1fr; }
}

/* Range slider field — same height as dropdown filters */
.ufilter__field--range {
    background: none;
    border: none;
    padding: 0;
}
.ufilter__field--range > span {
    display: flex;
    align-items: baseline;
    gap: 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 0;
}
.ufilter__field--range > span b {
    font-size: 11px;
    font-weight: 800;
    color: var(--brand-dark);
    letter-spacing: 0.05em;
    text-transform: none;
}
.ufilter__field--range input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 52px;
    background: #fff;
    background-image: linear-gradient(90deg, var(--teal-400), var(--teal-600));
    background-size: calc(100% - 36px) 6px;
    background-position: 18px center;
    background-repeat: no-repeat;
    border: 1.5px solid var(--line);
    border-radius: 14px;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    outline: none;
    cursor: pointer;
}
.ufilter__field--range input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--brand);
    box-shadow: 0 4px 12px rgba(var(--sh1),  0.4);
    cursor: pointer;
    transition: transform .15s ease;
}
.ufilter__field--range input[type="range"]::-webkit-slider-thumb:hover {
    transform: scale(1.15);
}
.ufilter__field--range input[type="range"]::-moz-range-thumb {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--brand);
    box-shadow: 0 4px 12px rgba(var(--sh1),  0.4);
    cursor: pointer;
}
.ufilter__field {
    display: grid;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.ufilter__field select {
    width: 100%;
    height: 52px;
    padding: 0 38px 0 18px;
    font: 600 15px 'Manrope', sans-serif;
    color: var(--ink);
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 14px;
    transition: border-color .15s ease, box-shadow .15s ease;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23115e59' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    cursor: pointer;
}
.ufilter__field select:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 4px var(--brand-ring);
}
.ufilter__result {
    height: 52px;
    padding: 0 22px;
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink-2);
    line-height: 1.3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    text-align: center;
}
.ufilter__result br { display: none; }
.ufilter__result b {
    font-size: 18px;
    font-weight: 800;
    color: var(--brand-dark);
    letter-spacing: -0.01em;
    margin-right: 6px;
}
.ufilter > .btn {
    height: 52px;
    padding: 0 26px;
    border-radius: 14px;
}

/* City chip strip */
.uchips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}
.uchip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 999px;
    padding: 9px 18px;
    font: 600 14px 'Manrope', sans-serif;
    color: var(--ink);
    cursor: pointer;
    transition: border-color .15s ease, transform .15s ease, background .15s ease;
}
.uchip:hover { border-color: var(--teal-300); transform: translateY(-2px); }
.uchip.is-active {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
}
.uchip small {
    display: inline-grid;
    place-items: center;
    min-width: 24px;
    height: 22px;
    padding: 0 6px;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
}
.uchip.is-active small { background: rgba(255,255,255,0.22); color: #fff; }

/* ---------- Catalog (merged into uhero section) ---------- */
.cat-bar {
    margin-top: 22px;
    margin-bottom: 16px;
    min-height: 42px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding-bottom: 12px;
    border-bottom: 1px dashed var(--line-2);
}
.cat-bar__count {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--ink-3);
    text-transform: uppercase;
}
.cat-bar__count b {
    font-size: 16px;
    font-weight: 800;
    color: var(--brand-dark);
    letter-spacing: -0.02em;
    margin-right: 2px;
}
/* Old .cat-bar__reset rule kept for legacy fallback; final styling
   lives in the dedicated block below (with .cat-bar__reset__x). */

/* Grid of university cards */
.cat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.ucat {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 24px 24px 22px;
    display: flex;
    flex-direction: column;
    text-align: left;
    color: inherit;
    font-family: inherit;
    cursor: pointer;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ucat:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: var(--teal-300);
}
.ucat:focus-visible {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 4px var(--brand-ring);
}
.ucat__top {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}
.ucat__top h3 {
    flex: 1;
    margin: 0;
    font-size: 17px;
    line-height: 1.25;
}
.ucat__logo {
    width: 52px; height: 52px;
    display: grid; place-items: center;
    color: #fff;
    font-weight: 800;
    font-size: 12px;
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    letter-spacing: 0.02em;
}
.ucat__city {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-3);
    background: var(--bg-soft);
    border: 1px solid var(--line);
    padding: 5px 12px;
    border-radius: 999px;
    white-space: nowrap;
}
.ucat h3 {
    font-size: 18px;
    margin-bottom: 10px;
    line-height: 1.25;
}
.ucat__sub {
    font-size: 14px;
    color: var(--ink-2);
    line-height: 1.5;
    margin-bottom: 18px;
    flex-grow: 1;
}
.ucat__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: auto;
}
.ucat__tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 5px 11px;
    border-radius: 999px;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border: 1px solid var(--teal-100);
}
.ucat__tag--gold   { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.ucat__tag--green  { background: #dcfce7; color: #166534; border-color: #86efac; }
.ucat__tag--orange { background: #ffedd5; color: #9a3412; border-color: #fdba74; }

/* Dormitory card extras */
.dorm-meta {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    margin: 4px 0 12px;
    font-size: 13px;
    color: var(--ink-3);
}
.dorm-meta__price b {
    font-size: 17px;
    font-weight: 800;
    color: var(--brand-dark);
    letter-spacing: -0.01em;
    margin-right: 2px;
}
.dorm-meta__owner {
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    color: var(--ink);
    font-size: 11.5px;
    text-transform: uppercase;
}

/* Dorm popup */
.dorm-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 22px;
    margin-bottom: 26px;
    padding: 22px 22px 18px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 16px;
}
.dorm-info > div { display: grid; gap: 4px; }
.dorm-info dt {
    font-size: 12px;
    font-weight: 700;
    color: var(--ink-3);
    letter-spacing: 0.04em;
}
.dorm-info dd {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--ink);
    margin: 0;
}

.dorm-rooms {
    display: grid;
    gap: 10px;
    margin-bottom: 26px;
}
.dorm-room {
    display: grid;
    grid-template-columns: 1.2fr auto 1.4fr;
    gap: 18px;
    align-items: center;
    padding: 14px 18px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    transition: border-color .15s ease, background .15s ease;
}
.dorm-room:hover { border-color: var(--teal-300); background: var(--bg-mint); }
.dorm-room__type { font-size: 14.5px; color: var(--ink); }
.dorm-room__type b { font-weight: 700; }
.dorm-room__price {
    font-size: 17px;
    font-weight: 800;
    color: var(--brand-dark);
    letter-spacing: -0.01em;
    white-space: nowrap;
}
.dorm-room__price small {
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-3);
    margin-left: 2px;
}
.dorm-room__note {
    font-size: 13px;
    color: var(--ink-2);
    text-align: right;
}

.dorm-amenities {
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 22px;
    padding: 0;
    margin: 0 0 12px;
}
.dorm-amenities li {
    position: relative;
    padding-left: 26px;
    font-size: 14px;
    color: var(--ink);
    line-height: 1.45;
}
.dorm-amenities li::before {
    content: "✓";
    position: absolute;
    left: 0; top: 1px;
    width: 18px; height: 18px;
    display: grid; place-items: center;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border-radius: 50%;
    font-weight: 800;
    font-size: 10px;
}

/* Empty state */
.cat-empty {
    text-align: center;
    padding: 60px 30px;
    background: #fff;
    border: 1.5px dashed var(--line-2);
    border-radius: 22px;
}
.cat-empty__icon {
    font-size: 44px;
    margin-bottom: 18px;
    opacity: 0.6;
}
.cat-empty h3 { font-size: 20px; margin-bottom: 10px; }
.cat-empty p { font-size: 15px; margin-bottom: 22px; }

/* ---------- University Popup ---------- */
.modal--wide .modal__dialog--xl {
    max-width: 760px;
    width: 100%;
    max-height: 88vh;
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.upop {
    overflow-y: auto;
    padding: 40px 44px;
}
.upop__head {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 22px;
    align-items: stretch;
    padding-bottom: 24px;
    margin-bottom: 24px;
    border-bottom: 1px dashed var(--line-2);
}
.upop__logo {
    width: 68px; height: 68px;
    display: grid; place-items: center;
    color: #fff;
    font-weight: 800;
    font-size: 15px;
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    letter-spacing: 0.02em;
}
.upop__title {
    height: 68px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    min-width: 0;
}
.upop__title h3 {
    font-size: 22px;
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin: 0;
}
/* When the popup has no external-site link, vertically center the title
   to match the icon height (no longer space-between to hug both edges). */
.upop--no-links .upop__title {
    justify-content: center;
}
/* Photo plate variant — used when the source card had a background-image plate.
   Same square footprint as the icon plate, but renders the photo instead. */
.upop__logo--photo {
    background-color: var(--brand-soft);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
/* Company-logo plate — white background with the contained brand logo,
   used in insurance company popups instead of an initials badge. */
.upop__logo--co {
    background: #fff;
    border: 1px solid var(--line);
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
    padding: 10px;
}
.upop__logo--co img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 10px;
}
.upop__site {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--brand-dark);
    padding: 5px 12px;
    background: var(--brand-soft);
    border: 1px solid var(--teal-100);
    border-radius: 999px;
    transition: background .15s ease, color .15s ease;
}
.upop__site:hover { background: var(--brand); color: #fff; }
.upop__site::after {
    content: "↗";
    font-size: 12px;
}

/* Variant without external site links (used on homepage) */
.upop--no-links .upop__site { display: none; }
.upop--no-links .upop__fac-body { padding-bottom: 18px; }

.upop__desc {
    margin-bottom: 26px;
}
.upop__desc p {
    font-size: 15px;
    color: var(--ink-2);
    line-height: 1.65;
    margin-bottom: 12px;
}
.upop__desc p:last-child { margin-bottom: 0; }
.upop__sec-title {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 14px;
}

.upop__faculties {
    display: grid;
    gap: 10px;
}
.upop__fac {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
    transition: background .15s ease, border-color .15s ease;
}
.upop__fac[open] {
    background: #fff;
    border-color: var(--teal-300);
    box-shadow: var(--shadow-sm);
}
.upop__fac > summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px;
    cursor: pointer;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--ink);
}
.upop__fac > summary::-webkit-details-marker { display: none; }
.upop__fac > summary::marker { content: ""; }
.upop__fac > summary i {
    flex-shrink: 0;
    width: 28px; height: 28px;
    display: inline-grid; place-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 50%;
    font-style: normal;
    font-weight: 800;
    font-size: 15px;
    color: var(--brand-dark);
    transition: transform .25s ease, background .15s ease, color .15s ease;
}
.upop__fac[open] > summary i {
    transform: rotate(45deg);
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
}
.upop__fac-body {
    padding: 0 18px 18px;
    font-size: 14px;
}
.upop__fac-meta {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 14px;
    font-size: 14.5px;
    color: var(--ink);
    line-height: 1.4;
}
.upop__fac-meta-icon {
    font-size: 15px;
    line-height: 1;
    margin-right: 4px;
}
.upop__fac-meta-label {
    font-weight: 700;
    color: var(--ink-3);
}
.upop__fac-meta b {
    font-weight: 700;
    color: var(--ink);
}
.upop__fac-body p {
    margin-bottom: 12px;
    color: var(--ink-2);
    line-height: 1.55;
}
.upop__fac-body .upop__site { margin-bottom: 14px; }
.upop__fac-body h5 {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin: 14px 0 8px;
}
.upop__specs {
    list-style: none;
    display: grid;
    gap: 6px;
}
.upop__specs li {
    position: relative;
    padding-left: 20px;
    font-size: 14px;
    color: var(--ink);
    line-height: 1.5;
}
.upop__specs li::before {
    content: "";
    position: absolute;
    left: 4px; top: 8px;
    width: 6px; height: 6px;
    background: var(--brand);
    border-radius: 50%;
}

/* ---------- Bento (lead magnets) ---------- */
.bento { background: #fff; padding: 110px 0; }
.bento__head { text-align: center; max-width: 720px; margin: 0 auto 50px; }
.bento__head h2 { margin-top: 12px; }
.bento__grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 20px;
}
.bento-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    border-radius: 22px;
    padding: 30px 30px 28px;
    border: 1px solid var(--line);
    background: var(--bg-soft);
    font-family: inherit;
    cursor: pointer;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.bento-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: var(--teal-300);
}
.bento-item--lg {
    grid-row: 1 / 3;
    background: linear-gradient(160deg, var(--teal-600) 0%, var(--teal-800) 100%);
    border-color: transparent;
    color: #fff;
    padding: 40px;
}
.bento-item--lg::after {
    content: "";
    position: absolute;
    inset: -40% -40% auto auto;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(var(--sh3), 0.35), transparent 60%);
    pointer-events: none;
}
.bento-item--lg:hover { box-shadow: 0 30px 60px rgba(var(--sh1), 0.34); }
.bento-item--lg h3,
.bento-item--lg p,
.bento-item--lg .bento-item__cta { color: #fff; position: relative; }
.bento-item--lg .bento-item__tag {
    background: rgba(255,255,255,0.16);
    color: #fff;
    border-color: rgba(255,255,255,0.22);
    position: relative;
}

.bento-item__tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border: 1px solid var(--teal-100);
    padding: 6px 12px;
    border-radius: 999px;
    margin-bottom: 18px;
}
.bento-item h3 {
    font-size: 22px;
    margin-bottom: 12px;
    letter-spacing: -0.02em;
}
.bento-item--lg h3 { font-size: 32px; }
.bento-item p {
    color: var(--ink-2);
    font-size: 15px;
    margin-bottom: 22px;
    flex-grow: 1;
}
.bento-item--lg p { color: rgba(255,255,255,0.84); font-size: 16px; max-width: 480px; }

.bento-item__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 700;
    color: var(--brand-dark);
    margin-top: auto;
}
.bento-item__cta i {
    display: inline-block;
    transition: transform .2s ease;
    font-style: normal;
}
.bento-item:hover .bento-item__cta i { transform: translateX(4px); }

/* ---------- How KOVER helps (stepper) ---------- */
.how { padding: 110px 0; background: var(--bg-mint); position: relative; overflow: hidden; }
.how::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(var(--sh1), 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--sh1), 0.06) 1px, transparent 1px);
    background-size: 80px 80px;
    mask-image: radial-gradient(ellipse at 50% 50%, #000 30%, transparent 75%);
    -webkit-mask-image: radial-gradient(ellipse at 50% 50%, #000 30%, transparent 75%);
    pointer-events: none;
}
.how__head {
    position: relative;
    text-align: center;
    max-width: 720px;
    margin: 0 auto 60px;
}
.how__head h2 { margin: 12px 0 14px; }
.how__head p { font-size: 17px; }

.how__steps {
    position: relative;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    counter-reset: step;
}
.how-step {
    position: relative;
    background: #fff;
    border: 1px solid var(--line);
    padding: 28px 26px 30px;
    border-radius: 0;
    transition: background .25s ease, transform .25s ease;
}
.how-step:first-child { border-radius: 22px 0 0 22px; }
.how-step:last-child  { border-radius: 0 22px 22px 0; }
.how-step + .how-step { border-left: none; }
.how-step:hover { background: var(--brand-soft); }
.how-step:hover .how-step__num { color: var(--brand); }

.how-step__num {
    display: inline-block;
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -0.04em;
    color: var(--teal-300);
    line-height: 1;
    margin-bottom: 18px;
    font-variant-numeric: tabular-nums;
    transition: color .25s ease;
}
.how-step h3 { font-size: 17px; margin-bottom: 8px; }
.how-step p { font-size: 14.5px; }

/* ---------- Final CTA (gradient band) ---------- */
.ucta { padding: 110px 0; background: #fff; }
.ucta__band {
    position: relative;
    background:
        radial-gradient(700px 400px at 0% 0%, rgba(var(--sh3), 0.18), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border-radius: 32px;
    padding: 60px;
    color: #fff;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 60px;
    align-items: start;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}
.ucta__band::before {
    content: "";
    position: absolute;
    inset: auto -10% -40% auto;
    width: 420px; height: 420px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    pointer-events: none;
}
.ucta__text h2 { color: #fff; margin: 14px 0 18px; }
.ucta__text > p { color: rgba(255,255,255,0.86); font-size: 17px; margin-bottom: 26px; }
.ucta__text > p b { color: #fff; }
.ucta__list {
    list-style: none;
    display: grid;
    gap: 12px;
}
.ucta__list li {
    position: relative;
    padding-left: 32px;
    color: rgba(255,255,255,0.94);
    font-weight: 500;
    font-size: 15.5px;
}
.ucta__list li::before {
    content: "✓";
    position: absolute;
    left: 0; top: 0;
    width: 22px; height: 22px;
    display: grid; place-items: center;
    background: rgba(255,255,255,0.18);
    border-radius: 50%;
    color: #fff;
    font-weight: 800;
    font-size: 11px;
}

.ucta__form {
    position: relative;
    background: #fff;
    border-radius: 22px;
    padding: 34px;
    display: grid;
    gap: 12px;
    box-shadow: 0 30px 60px rgba(var(--sh-dark), 0.22);
    color: var(--ink);
}
.ucta__form h3 { font-size: 22px; margin-bottom: 8px; }
.ucta__form label {
    display: grid;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink-2);
}
.ucta__form input {
    width: 100%;
    padding: 14px 18px;
    font: 500 15px 'Manrope', sans-serif;
    color: var(--ink);
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 12px;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.ucta__form input:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 4px var(--brand-ring);
}

/* ===== Smart Intensive (specific) ===== */
.page-program--intensive .prog-hero {
    background:
        radial-gradient(700px 500px at 90% 0%, rgba(139, 92, 246, 0.14), transparent 60%),
        linear-gradient(180deg, #fff 0%, #faf5ff 100%);
}
.prog-badge--intensive {
    background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
    color: #fff;
    box-shadow: 0 8px 18px rgba(139, 92, 246, 0.35);
}
.prog-hero__card--intensive {
    background: linear-gradient(160deg, #fff 0%, #f5f3ff 100%);
    border-color: #c4b5fd;
}

.prog-hero__bullets {
    list-style: none;
    margin: 0 0 30px;
    display: grid;
    gap: 12px;
}
.prog-hero__bullets li {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 15px;
    color: var(--ink);
}
.prog-hero__bullets .emo {
    width: 38px; height: 38px;
    display: grid; place-items: center;
    background: #fff;
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--line);
    font-size: 18px;
}
.prog-hero__bullets b { color: var(--ink); font-weight: 800; }

/* Concept block */
.prog-concept { padding: 110px 0; background: #fff; }
.prog-concept__inner {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 60px;
    align-items: center;
}
.prog-concept__text h2 { margin: 12px 0 18px; }
.prog-concept__text p { font-size: 16.5px; margin-bottom: 14px; line-height: 1.6; }
.prog-concept__text p b { color: var(--ink); font-weight: 700; }
.prog-concept__visual {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.prog-concept__stat {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 22px 22px 20px;
    text-align: left;
}
.prog-concept__stat b {
    display: block;
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    margin-bottom: 10px;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.prog-concept__stat span { font-size: 13px; color: var(--ink-2); line-height: 1.4; }

/* Profile tabs */
.prog-profiles { padding: 110px 0; background: var(--bg-soft); }
.prof-tabs {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 8px;
    margin-bottom: 28px;
}
.prof-tab {
    background: transparent;
    border: 1.5px solid transparent;
    border-radius: 12px;
    padding: 14px 10px;
    cursor: pointer;
    text-align: center;
    font-family: inherit;
    color: var(--ink-2);
    transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}
.prof-tab:hover { background: var(--bg-soft); color: var(--ink); }
.prof-tab.is-active {
    background: var(--brand-soft);
    border-color: var(--teal-300);
    color: var(--brand-dark);
}
.prof-tab__emoji { font-size: 22px; line-height: 1; }
.prof-tab__name { font-size: 13.5px; font-weight: 700; letter-spacing: -0.01em; }

.prof-panel { display: none; }
.prof-panel.is-active { display: block; animation: fade .25s ease; }
.prof-panel {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 32px;
}

.prof-panel__head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 22px;
    align-items: center;
    padding-bottom: 22px;
    margin-bottom: 22px;
    border-bottom: 1px dashed var(--line-2);
}
.prof-panel__emoji {
    width: 64px; height: 64px;
    display: grid; place-items: center;
    font-size: 30px;
    background: var(--brand-soft);
    border-radius: 16px;
}
.prof-panel__head h3 { font-size: 22px; margin-bottom: 6px; }
.prof-panel__who { font-size: 14.5px; color: var(--ink-2); }
.prof-panel__hours {
    display: inline-block;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.06em;
    padding: 8px 16px;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    border-radius: 999px;
    white-space: nowrap;
}

.prof-panel__alert {
    background: #fff7ed;
    border: 1px solid #fdba74;
    border-radius: 14px;
    padding: 14px 18px;
    font-size: 14.5px;
    color: #9a3412;
    margin-bottom: 22px;
}
.prof-panel__alert b { color: #7c2d12; font-weight: 800; }

.prof-panel__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-bottom: 24px;
}
.prof-cell {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 20px 22px;
}
.prof-cell--full { grid-column: 1 / -1; }
.prof-cell h4 {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 12px;
}
.prof-cell p { font-size: 14.5px; color: var(--ink); line-height: 1.55; }
.prof-cell p b { color: var(--brand-dark); font-weight: 700; }
.prof-unis { display: flex; flex-wrap: wrap; gap: 8px; }

.prof-panel__cta { margin-top: 8px; }

/* Basic info cards */
.prog-info-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}
.prog-info {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 26px 22px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.prog-info:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--teal-300); }
.prog-info__icon {
    width: 48px; height: 48px;
    display: grid; place-items: center;
    font-size: 22px;
    background: var(--brand-soft);
    border-radius: 12px;
    margin-bottom: 16px;
}
.prog-info h4 {
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: 10px;
    font-weight: 800;
}
.prog-info p { font-size: 14.5px; color: var(--ink); line-height: 1.5; }
.prog-info p b { color: var(--brand-dark); font-weight: 800; font-size: 16px; }

/* Intensive prices (4 cards) */
.int-prices {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
}
.int-price {
    position: relative;
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 22px;
    padding: 30px 28px;
    display: flex;
    flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.int-price:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--teal-300); }
.int-price--featured {
    border-color: var(--teal-300);
    background: linear-gradient(180deg, #fff 0%, var(--bg-mint) 100%);
}
.int-price__tag {
    position: absolute;
    top: -12px; left: 28px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 6px 14px;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    border-radius: 999px;
    box-shadow: 0 6px 14px rgba(var(--sh1),  0.4);
}
.int-price__head { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px dashed var(--line-2); }
.int-price__icon { font-size: 22px; display: block; margin-bottom: 8px; }
.int-price__head h3 { font-size: 20px; margin-bottom: 6px; letter-spacing: -0.01em; }
.int-price__head p { font-size: 13.5px; color: var(--ink-2); }

.int-price__rows { display: grid; gap: 10px; margin-bottom: 22px; }
.int-price__row {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 16px;
    align-items: baseline;
    padding: 14px 16px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 14px;
    transition: background .15s ease, border-color .15s ease;
}
.int-price__row:hover { background: #fff; border-color: var(--teal-300); }
.int-price__row > span { font-size: 14px; color: var(--ink); font-weight: 600; }
.int-price__row b {
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--ink);
}
.int-price__row small {
    grid-column: 1 / -1;
    font-size: 12px;
    color: var(--ink-3);
    margin-top: 4px;
    font-weight: 600;
}
.int-price__row--mid { background: #fef3c7; border-color: #fcd34d; }
.int-price__row--mid b { color: #92400e; }
.int-price__row--mid small { color: #92400e; }
.int-price__row--best { background: #dcfce7; border-color: #86efac; }
.int-price__row--best b { color: #166534; font-size: 26px; }
.int-price__row--best small { color: #166534; font-weight: 700; }

.int-price--custom .int-price__custom {
    flex-grow: 1;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    align-items: center;
    background: var(--bg-soft);
    border: 1px dashed var(--line-2);
    border-radius: 16px;
    padding: 22px;
    margin-bottom: 22px;
}
.int-price__custom-icon {
    width: 56px; height: 56px;
    display: grid; place-items: center;
    font-size: 26px;
    background: #fff;
    border-radius: 14px;
}
.int-price__custom p { font-size: 14.5px; color: var(--ink-2); line-height: 1.55; }
.int-price .btn { margin-top: auto; }

/* Intensive final CTA */
.int-cta {
    padding: 110px 0;
    background: var(--bg-soft);
}
.int-cta__band {
    background:
        radial-gradient(700px 400px at 0% 0%, rgba(var(--sh3), 0.18), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border-radius: 32px;
    padding: 60px;
    color: #fff;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 60px;
    align-items: start;
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    position: relative;
}
.int-cta__text h2 { color: #fff; margin: 14px 0 18px; }
.int-cta__text > p { color: rgba(255,255,255,0.86); font-size: 17px; margin-bottom: 26px; line-height: 1.6; }

/* FAQ section reuses prog-details, prog-acc */
.prog-faq { padding: 110px 0; background: #fff; }
.prog-faq .prog-accordion { max-width: 880px; margin: 0 auto; }

/* ===== Contacts page ===== */
.page-contacts { background: #fff; }

.ct-hero {
    padding: 40px 0 90px;
    background:
        radial-gradient(700px 500px at 95% 10%, rgba(var(--sh1),  0.12), transparent 60%),
        linear-gradient(180deg, #fff 0%, var(--bg-soft) 100%);
}
.ct-hero__head { max-width: 880px; margin: 18px 0 40px; }
.ct-hero__head h1 {
    margin: 18px 0 22px;
    font-size: clamp(34px, 5vw, 58px);
    line-height: 1.12;
    letter-spacing: -0.025em;
}
.ct-hero__head h1 .accent {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.ct-hero__head p {
    font-size: 18px;
    line-height: 1.55;
    max-width: 760px;
}
.ct-hero__head p b { color: var(--ink); font-weight: 700; }

.ct-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}
.ct-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 26px 24px;
    color: var(--ink);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.ct-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--teal-300); }
.ct-card__icon {
    width: 52px; height: 52px;
    display: grid; place-items: center;
    font-size: 26px;
    background: var(--brand-soft);
    border-radius: 14px;
    margin-bottom: 8px;
}
.ct-card__label {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.ct-card__value {
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: var(--ink);
}
.ct-card__hint { font-size: 13px; color: var(--ink-2); }
.ct-card--ig .ct-card__icon {
    background: linear-gradient(45deg, #fbbf24 0%, #f97316 25%, #ec4899 50%, #8b5cf6 75%, #6366f1 100%);
    color: #fff;
}
.ct-card__icon--ig svg { width: 28px; height: 28px; }

/* ============================================================
   IN-POCKET CZECH (/in-pocket-czech) — 7 self-study courses
   in a Telegram bot. Custom components used only on this page.
   ============================================================ */
/* 7 курсов — adaptive grid 3 / 2 / 1 col */
.ipk-courses {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin-top: 4px;
}
.ipk-course {
    position: relative;
    background: #fff;
    border: 1px solid var(--line-2, #e5e7eb);
    border-radius: 20px;
    padding: 28px 26px 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: transform 0.2s ease, box-shadow 0.25s ease, border-color 0.2s ease, background 0.25s ease, color 0.2s ease;
}
/* Hover: вся карточка переключается в teal-gradient (как раньше делал featured-вариант),
   текст становится белым, level-badge — полупрозрачно-белый. */
.ipk-course:hover {
    transform: translateY(-3px);
    background: linear-gradient(160deg, var(--teal-700, #0f766e) 0%, var(--teal-600, #0d9488) 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 22px 44px rgba(var(--sh2),  0.32);
}
.ipk-course:hover h3,
.ipk-course:hover p,
.ipk-course:hover .ipk-course__stats,
.ipk-course:hover .ipk-course__stats b { color: #fff; }
.ipk-course:hover .ipk-course__level {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}
.ipk-course:hover .ipk-course__stats {
    border-top-color: rgba(255, 255, 255, 0.25);
}
.ipk-course__level {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    padding: 5px 12px;
    border-radius: 999px;
    background: var(--teal-50, #f0fdfa);
    color: var(--teal-700, #0f766e);
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.ipk-course h3 {
    margin: 0;
    font-size: 21px;
    line-height: 1.2;
    letter-spacing: -0.01em;
    color: var(--ink);
}
.ipk-course p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.55;
    color: var(--ink-2, #475569);
}
.ipk-course__stats {
    list-style: none;
    margin: 4px 0 0;
    padding: 14px 0 0;
    border-top: 1px dashed var(--line-2, #e5e7eb);
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    font-size: 13px;
    color: var(--ink-3, #64748b);
}
.ipk-course__stats li { display: inline-flex; align-items: baseline; gap: 5px; }
.ipk-course__stats b {
    font-size: 16px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.01em;
}
/* .ipk-course--featured теперь не делает permanent-teal — все карточки
   ведут себя одинаково: белые по умолчанию, teal-gradient на :hover.
   Класс оставлен как no-op для совместимости с разметкой. */
/* Bonus (Разговорный клуб) — dashed teal accent */
.ipk-course--bonus {
    background: var(--teal-50, #f0fdfa);
    border: 1.5px dashed var(--teal-300, #5eead4);
}
.ipk-course--bonus .ipk-course__level {
    background: var(--teal-600, #0d9488);
    color: #fff;
}
.ipk-course--bonus .ipk-course__stats {
    border-top: 0;
    padding-top: 0;
    color: var(--teal-700, #0f766e);
    font-weight: 600;
}
@media (max-width: 960px) {
    .ipk-courses { grid-template-columns: repeat(2, 1fr); gap: 16px; }
}
@media (max-width: 600px) {
    .ipk-courses { grid-template-columns: 1fr; gap: 14px; }
    .ipk-course { padding: 22px 20px 20px; }
}

/* «Личный репетитор» tiles — на этой странице у нас 4 тайла, а .why-row
   по умолчанию рассчитан на 5 — нужен override, иначе пустое 5-е место. */
.page-ipk .why-row { grid-template-columns: repeat(4, 1fr); }
/* Steps на этой странице — на всю ширину контейнера 12-col, без max-width
   ограничения, чтобы плашки занимали всю доступную ширину. */
.page-ipk .steps { max-width: none; }
/* Шаги на всю ширину контейнера (12 колонок); номер — к верху карточки,
   чтобы аккуратно смотреться с раскрывающимся описанием шага. */
.steps--wide { max-width: none; }
.steps--wide .step { align-items: start; }
/* Centered CTA group — под блоками с тайлами и шагами */
.ipk-steps-cta {
    margin: 36px auto 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.ipk-steps-cta__hint {
    font-size: 14px;
    color: var(--ink-3, #64748b);
}
.ipk-steps-cta__hint a {
    color: var(--teal-700, #0f766e);
    font-weight: 700;
    border-bottom: 1px solid rgba(var(--sh2),  0.25);
}
.ipk-steps-cta__hint a:hover { border-color: var(--teal-700, #0f766e); }
@media (max-width: 1000px) {
    .page-ipk .why-row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
    .page-ipk .why-row { grid-template-columns: 1fr; }
}

/* 4-tariff pricing на этой странице (по умолчанию sl-pricing — 3 колонки) */
.page-ipk .sl-pricing { grid-template-columns: repeat(4, 1fr); gap: 18px; }
@media (max-width: 1100px) {
    .page-ipk .sl-pricing { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .page-ipk .sl-pricing { grid-template-columns: 1fr; }
}

/* Примеры видеоуроков — встроенные YouTube-плееры (16:9, lazy-load) */
.ipk-videos {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.ipk-video__frame {
    position: relative;
    aspect-ratio: 16 / 9;
    border-radius: var(--radius);
    overflow: hidden;
    background: #0b1f1d;
    border: 1px solid var(--line);
    box-shadow: 0 14px 30px rgba(var(--sh2),  0.16);
}
.ipk-video__frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}
@media (max-width: 860px) {
    .ipk-videos { grid-template-columns: 1fr; max-width: 480px; margin-inline: auto; }
}

/* CONVERSATION CLUB — sits inside the courses section as a 7th block.
   margin-top матчит .ipk-courses gap (22px), чтобы визуально это была
   одна сетка курсов + клуб «бонусной плашкой». */
.ipk-club {
    position: relative;
    margin-top: 22px;
    padding: 48px clamp(28px, 6vw, 64px);
    border-radius: 28px;
    background:
        radial-gradient(800px 500px at 90% 10%, rgba(var(--sh3),  0.22), transparent 60%),
        linear-gradient(150deg, var(--teal-700, #0f766e) 0%, var(--teal-800, #0a544c) 100%);
    color: #fff;
    box-shadow: 0 30px 64px rgba(var(--sh2),  0.30);
    overflow: hidden;
}
.ipk-club__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.ipk-club__badge-dot {
    display: inline-block;
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--teal-300, #5eead4);
    box-shadow: 0 0 0 4px rgba(var(--sh3),  0.25);
    animation: ipkDot 2.4s ease-in-out infinite;
}
@keyframes ipkDot {
    0%, 100% { box-shadow: 0 0 0 4px rgba(var(--sh3),  0.25); }
    50%      { box-shadow: 0 0 0 8px rgba(var(--sh3),  0.10); }
}
.ipk-club__h {
    color: #fff;
    margin: 0 0 16px;
    font-size: clamp(28px, 3.5vw, 38px);
    line-height: 1.15;
    letter-spacing: -0.02em;
    max-width: 24ch;
}
.ipk-club__h .accent { color: var(--teal-300, #5eead4); }
.ipk-club__lead {
    color: rgba(255, 255, 255, 0.88);
    font-size: 17px;
    line-height: 1.6;
    max-width: 760px;
    margin: 0 0 36px;
}
.ipk-club__lead b { color: #fff; }
.ipk-club__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px 32px;
}
.ipk-club__list li {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 18px;
    padding: 20px 22px;
}
.ipk-club__icon {
    display: inline-block;
    font-size: 22px;
    line-height: 1;
    margin-bottom: 10px;
}
.ipk-club__list h4 {
    color: #fff;
    margin: 0 0 6px;
    font-size: 16.5px;
    line-height: 1.25;
    letter-spacing: -0.01em;
}
.ipk-club__list p {
    color: rgba(255, 255, 255, 0.78);
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
}
.ipk-club__meta {
    margin-top: 36px;
    padding-top: 28px;
    border-top: 1px dashed rgba(255, 255, 255, 0.18);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 22px;
    color: rgba(255, 255, 255, 0.85);
    font-size: 14.5px;
}
.ipk-club__meta-item b {
    color: #fff;
    font-weight: 800;
    margin-right: 6px;
}
.ipk-club__meta-sep { opacity: 0.4; }
.ipk-club__cta {
    margin-top: 32px;
    text-align: center;
}
.ipk-club__btn,
.ipk-club__btn.btn {
    background: #fff;
    color: var(--teal-700, #0f766e);
    border-color: transparent;
    box-shadow: 0 14px 30px rgba(255, 255, 255, 0.18);
}
.ipk-club__btn:hover,
.ipk-club__btn.btn:hover {
    background: var(--teal-50, #f0fdfa);
    color: var(--teal-800, #115e59);
    box-shadow: 0 18px 36px rgba(255, 255, 255, 0.25);
}
@media (max-width: 760px) {
    .ipk-club { padding: 36px 22px; border-radius: 22px; }
    .ipk-club__list { grid-template-columns: 1fr; gap: 12px; }
    .ipk-club__meta { gap: 10px 16px; font-size: 13.5px; }
    .ipk-club__meta-sep { display: none; }
}

/* Sticky bottom CTA — teal theme variant for in-pocket-czech */
body[data-program="ipk"] .sl-sticky {
    background: linear-gradient(135deg, var(--teal-700, #0f766e), var(--teal-600, #0d9488));
}
body[data-program="ipk"] .sl-sticky:not(:has(.sl-price:hover)) .sl-sticky__cta,
body[data-program="ipk"] .sl-sticky__cta.btn--primary {
    background: #fff;
    color: var(--teal-700, #0f766e);
}
body[data-program="ipk"] .sl-sticky__cta:hover,
body[data-program="ipk"] .sl-sticky__cta.btn--primary:hover {
    background: var(--teal-50, #f0fdfa);
    color: var(--teal-800, #115e59);
}

/* ===== Callback CTA блоки на разных страницах ===== */

/* ============================================================
   MULTI-STEP CONSULT FORM на главной (внутри .consult .form--card)
   3 шага: когда / направление / контакты. Стилизована поверх
   тёмной teal-карточки — все опции — белые pill-плашки.
   ============================================================ */
/* Progress-bar убран. Counter теперь в footer-ряду рядом с Back-кнопкой. */
.msform__counter {
    font-size: 12.5px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.72);
    margin: 0;
}
.msform__counter b { color: #fff; font-weight: 800; }
.msform__steps { position: relative; }
.msform__step {
    display: none;
    animation: msformFade 0.32s ease both;
}
.msform__step.is-active { display: block; }
@keyframes msformFade {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
.msform__q {
    text-align: center;
    color: #fff;
    font-size: clamp(22px, 2.4vw, 28px);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin: 0 auto 26px;
    max-width: 640px;
    font-weight: 700;
}
.msform__opts {
    display: grid;
    gap: 12px;
    max-width: 820px;
    margin: 0 auto;
}
/* Год — 3 опции в&nbsp;ряд на десктопе (а не друг под другом). */
.msform__opts--stack { grid-template-columns: repeat(3, 1fr); }
/* Мультивыбор языка — 2 опции в ряд. */
.msform__opts--two { grid-template-columns: repeat(2, 1fr); max-width: 560px; }
/* Подсказка под вопросом для шагов с мультивыбором. */
.msform__hint-multi {
    text-align: center;
    color: rgba(255, 255, 255, 0.82);
    font-size: 14px;
    margin: -16px auto 20px;
}
/* Кнопка «Далее» на шаге с мультивыбором (нет авто-перехода).
   display:flex — делаем блочной (у .btn inline-flex, иначе margin:auto не центрирует);
   ширина по ряду опций (.msform__opts--two = 560), по центру под вариантами. */
.msform__next {
    display: flex;
    width: 100%;
    max-width: 560px;
    margin: 22px auto 0;
}
.msform__opts--grid {
    grid-template-columns: repeat(3, 1fr);
    max-width: 820px;
}
/* В msform всё компактнее — скрываем большую иконку-чат в шапке consult,
   чтобы форма не занимала пол-экрана. */
.msform .consult__icon { display: none; }
.msform .consult__head { margin-bottom: 18px; }
.msform .consult__head h2 { margin-top: 0; }
.msform__opt {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 16px 22px;
    background: rgba(255, 255, 255, 0.97);
    color: var(--ink);
    border: 2px solid transparent;
    border-radius: 14px;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.2s ease, border-color 0.15s ease;
    font: inherit;
    text-align: left;
}
.msform__opt:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 30px rgba(0, 0, 0, 0.18);
    border-color: var(--teal-300, #5eead4);
}
.msform__opt.is-selected {
    border-color: var(--teal-400, #2dd4bf);
    box-shadow: 0 0 0 4px rgba(var(--sh3),  0.35);
}
.msform__opt-title { font-weight: 700; font-size: 16px; color: var(--ink); }
.msform__opt-sub { font-size: 13.5px; color: var(--ink-3, #475569); }
.msform__opts--grid .msform__opt {
    align-items: center;
    text-align: center;
    padding: 18px 14px;
    min-height: 80px;
    justify-content: center;
}

/* Step 3 — контактная форма, label-инпуты становятся белыми внутри teal-карточки */
.msform__step[data-step="3"] {
    max-width: 920px;
    margin: 0 auto;
}

.msform__foot {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 20px;
}
.msform__foot-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;       /* counter справа когда back hidden */
    gap: 12px;
    min-height: 32px;                /* стабильная высота, даже когда back hidden */
}
.msform__foot-row .msform__back { margin-right: auto; }
.msform__foot .form__hint {
    margin: 0;
    text-align: center;
}
.msform__back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    padding: 8px 10px;
    border-radius: 8px;
    transition: color 0.15s ease, background 0.15s ease;
}
.msform__back:hover { color: #fff; background: rgba(255, 255, 255, 0.12); }
.msform__back[hidden] { display: none !important; }

@media (max-width: 640px) {
    .msform__q { font-size: 20px; margin-bottom: 20px; }
    .msform__opts--stack { grid-template-columns: 1fr; }
    .msform__opts--grid { grid-template-columns: repeat(2, 1fr); }
    .msform__foot { flex-direction: column; gap: 10px; }
    .msform__foot .form__hint { text-align: center; }
}
@media (max-width: 420px) {
    .msform__opts--grid { grid-template-columns: 1fr; }
}

/* FAQ CTA — бирюзовый фон как у .consult .form--card, белый текст */
.faq-cta {
    margin: 14px 0 0;
    padding: 22px 28px;
    width: 100%;
    max-width: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(var(--sh3),  0.25), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border: 0;
    border-radius: var(--radius);
    box-shadow: 0 18px 36px rgba(var(--sh2),  0.24);
}
.faq-cta p {
    margin: 0;
    font-size: 16px;
    color: #fff;
    font-weight: 600;
    flex: 1 1 auto;
}
/* faq-cta может стоять внутри .article__body--prose — prose-стили перекрашивают
   заголовок/текст в тёмный; возвращаем белый поверх синего градиента. */
.article__body .faq-cta__text h3,
.article__body .faq-cta__text p { color: #fff; }
.faq-cta .btn,
.faq-cta .btn--primary {
    padding: 12px 22px;
    flex-shrink: 0;
    background: #fff;
    color: var(--teal-700);
    box-shadow: 0 4px 14px rgba(var(--sh-dark),  0.25);
}
.faq-cta .btn:hover,
.faq-cta .btn--primary:hover { background: var(--teal-50); color: var(--teal-800); }
/* On themed pages (data-program) the body[data-program] .btn--primary rule
   has higher specificity and would repaint this white button in the accent
   colour — i.e. blue-on-blue. Re-assert the solid white button so it stays
   readable on the coloured FAQ-CTA bar. */
body[data-program] .faq-cta .btn,
body[data-program] .faq-cta .btn--primary {
    background: #fff;
    color: var(--teal-700);
    box-shadow: 0 4px 14px rgba(var(--sh-dark),  0.25);
}
body[data-program] .faq-cta .btn:hover,
body[data-program] .faq-cta .btn--primary:hover { background: var(--teal-50); color: var(--teal-800); }
@media (max-width: 640px) {
    .faq-cta { flex-direction: column; align-items: stretch; text-align: center; gap: 12px; padding: 22px 20px; }
    .faq-cta .btn { width: 100%; }
}

/* Pricing CTA — после прайсинга */
.pricing-callback {
    margin: 18px auto 0;
    padding: 18px 24px;
    max-width: 720px;
    text-align: center;
    background: rgba(var(--sh1),  0.04);
    border-radius: 14px;
}
.pricing-callback p {
    margin: 0 0 10px;
    font-size: 14.5px;
    color: var(--ink-2);
    font-weight: 600;
}
.pricing-callback .btn { padding: 10px 18px; font-size: 14px; }

/* Sticky CTA: маленькая иконка телефона перед "Записаться" */
.sl-sticky__callback {
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.92);
    width: 40px; height: 40px;
    border-radius: 11px;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.15s ease;
    flex-shrink: 0;
}
.sl-sticky__callback:hover {
    background: rgba(255, 255, 255, 0.22);
    transform: translateY(-2px);
}
@media (max-width: 540px) {
    .sl-sticky__callback { display: none; }
}

/* Footer link «Заказать звонок» */
.footer__contact--callback {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    padding: 6px 12px;
    background: rgba(var(--sh1),  0.12);
    border: 1px solid rgba(var(--sh1),  0.25);
    border-radius: 10px;
    color: var(--teal-300) !important;
    font-weight: 700;
    width: max-content;
    transition: background 0.15s ease, color 0.15s ease;
}
.footer__contact--callback:hover {
    background: rgba(var(--sh1),  0.22);
    color: #fff !important;
}

/* Article sidebar CTA */
.article__sidebar-callback {
    margin: 0 0 24px;
    padding: 20px;
    background: linear-gradient(160deg, var(--teal-50) 0%, var(--teal-100) 100%);
    border: 1px solid var(--teal-200);
    border-radius: 16px;
    text-align: center;
}
.article__sidebar-callback p {
    margin: 0 0 12px;
    font-size: 14px;
    color: var(--ink);
    font-weight: 700;
}

/* «Заказать звонок» — та же высота и border-radius, что у .ct-msg иконок (38×38, radius 11px) */
.ct-callback-btn {
    height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 12px;
    background: var(--teal-50);
    color: var(--teal-700);
    border: 1px solid var(--teal-200);
    border-radius: 11px;
    font: 700 13px 'Manrope', sans-serif;
    cursor: pointer;
    box-shadow: var(--shadow-sm);
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.25s ease;
    margin-left: 6px;
    line-height: 1;
}
.ct-callback-btn:hover {
    background: var(--teal-100);
    color: var(--teal-800);
    border-color: var(--teal-300);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.ct-callback-btn svg { color: var(--teal-700); flex-shrink: 0; }
.ct-callback-btn span { white-space: nowrap; }
.callback-tz {
    display: block;
    font-size: 12px;
    color: var(--ink-3);
    margin-top: 4px;
}
.callback-tz b { color: var(--teal-700); font-weight: 700; }
.modal__dialog--form input[type="datetime-local"] {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 14px 18px;
    border: 1.5px solid var(--line);
    border-radius: 12px;
    font: 500 15px 'Manrope', sans-serif;
    color: var(--ink);
    background: #fff;
}
.modal__dialog--form input[type="datetime-local"]:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 4px var(--brand-ring);
}

/* Stats variant — emphasises the big number */
.ct-cards--stats { margin-top: 8px; }
.ct-card--stat .ct-card__value {
    font-size: clamp(32px, 3.5vw, 44px);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 2px 0 4px;
}
.ct-card--stat .ct-card__value small {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0;
    margin-left: 4px;
    -webkit-text-fill-color: var(--brand-dark);
}

/* Phone card with messengers */
.ct-card--phone a.ct-card__value {
    color: var(--ink);
    transition: color .15s ease;
}
.ct-card--phone a.ct-card__value:hover { color: var(--brand-dark); }
.ct-card__msgs {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}
.ct-msg {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: #fff;
    border-radius: 11px;
    transition: transform .15s ease, box-shadow .25s ease;
    box-shadow: var(--shadow-sm);
}
.ct-msg:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.ct-msg--wa { background: linear-gradient(135deg, #25d366, #128c7e); }
.ct-msg--tg { background: linear-gradient(135deg, #38bdf8, #1d4ed8); }

/* Location */
.ct-location { padding: 110px 0; background: #fff; }
.ct-location__inner {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 48px;
    align-items: stretch;
}
.ct-location__info h2 { margin: 12px 0 18px; font-size: clamp(28px, 3vw, 38px); }
.ct-location__info > p { font-size: 16px; margin-bottom: 32px; }
.ct-location__info > p b { color: var(--ink); }
.ct-info-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    align-items: start;
    padding: 18px 0;
    border-top: 1px solid var(--line);
}
.ct-info-row:first-of-type { border-top: none; }
.ct-info-row__icon {
    width: 48px; height: 48px;
    display: grid; place-items: center;
    font-size: 22px;
    background: var(--brand-soft);
    border-radius: 12px;
}
.ct-info-row h4 { font-size: 15px; margin-bottom: 6px; text-transform: none; letter-spacing: 0; }
.ct-info-row p { font-size: 14.5px; color: var(--ink-2); line-height: 1.55; }
.ct-info-row p b { color: var(--ink); font-weight: 700; }
.ct-info-row__hint { font-size: 13px; color: var(--ink-3); margin-top: 6px; }
.ct-location__info .btn { margin-top: 24px; }

.ct-map {
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid var(--line);
    min-height: 480px;
}

/* Social */
.ct-social { padding: 110px 0; background: var(--bg-soft); }
.ct-social__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.ct-social-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 32px 28px;
    color: var(--ink);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ct-social-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--teal-300); }
.ct-social-card__icon {
    width: 64px; height: 64px;
    display: grid; place-items: center;
    border-radius: 18px;
    color: #fff;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: 0.04em;
    margin-bottom: 20px;
    box-shadow: var(--shadow-sm);
}
.ct-social-card--ig .ct-social-card__icon { background: linear-gradient(135deg, #f59e0b, #ec4899, #8b5cf6); }
.ct-social-card--tg .ct-social-card__icon { background: linear-gradient(135deg, #38bdf8, #2563eb); }
.ct-social-card--yt .ct-social-card__icon { background: linear-gradient(135deg, #ef4444, #b91c1c); }
.ct-social-card h3 { font-size: 19px; margin-bottom: 10px; }
.ct-social-card p { font-size: 14.5px; margin-bottom: 18px; line-height: 1.55; }
.ct-social-card__cta {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--brand-dark);
}

/* Contact form */
.ct-form-section { padding: var(--section-py) 0; background: #fff; }
.ct-form-section__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}
.ct-form-section__text h2 { margin: 12px 0 18px; }
.ct-form-section__text > p { font-size: 17px; margin-bottom: 22px; }
.ct-form-section__list {
    list-style: none;
    display: grid;
    gap: 12px;
}
.ct-form-section__list li {
    position: relative;
    padding-left: 28px;
    font-size: 15px;
    color: var(--ink);
}
.ct-form-section__list li::before {
    content: "✓";
    position: absolute;
    left: 0; top: 0;
    width: 22px; height: 22px;
    display: grid; place-items: center;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border-radius: 50%;
    font-weight: 800;
    font-size: 11px;
}
.form textarea {
    width: 100%;
    padding: 14px 18px;
    font: 500 15px 'Manrope', sans-serif;
    color: var(--ink);
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 12px;
    resize: vertical;
    min-height: 100px;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.form textarea:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 4px var(--brand-ring);
}

/* ===== Program detail pages (smart-light, smart-standard) ===== */
.page-program { background: #fff; }

.prog-hero {
    padding: 40px 0 90px;
    background:
        radial-gradient(700px 500px at 90% 0%, rgba(var(--sh1),  0.14), transparent 60%),
        linear-gradient(180deg, #fff 0%, var(--bg-mint) 100%);
    border-bottom: 1px solid var(--line);
}
.page-program--standard .prog-hero {
    background:
        radial-gradient(700px 500px at 90% 0%, rgba(249, 115, 22, 0.12), transparent 60%),
        linear-gradient(180deg, #fff 0%, var(--bg-soft) 100%);
}
.prog-hero__inner {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 60px;
    align-items: center;
    margin-top: 20px;
}
.prog-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 8px 16px;
    border-radius: 999px;
    margin: 18px 0 22px;
}
.prog-badge--light {
    background: var(--brand-soft);
    color: var(--brand-dark);
    border: 1px solid var(--teal-100);
}
.prog-badge--standard {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    box-shadow: 0 8px 18px rgba(var(--sh1),  0.35);
}
.prog-hero__content h1 { font-size: clamp(32px, 4.6vw, 54px); margin-bottom: 22px; line-height: 1.1; }
.prog-hero__content h1 .accent {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.prog-hero__sub { font-size: 18px; line-height: 1.55; margin-bottom: 32px; max-width: 580px; }

.prog-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 30px;
}
.prog-stat {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 18px 18px 16px;
}
.prog-stat__icon { font-size: 22px; margin-bottom: 8px; }
.prog-stat b {
    display: block;
    font-size: 18px;
    font-weight: 800;
    color: var(--brand-dark);
    letter-spacing: -0.01em;
    margin-bottom: 4px;
}
.prog-stat span {
    display: block;
    font-size: 13px;
    color: var(--ink-2);
    line-height: 1.4;
}

.prog-hero__cta { display: flex; gap: 12px; flex-wrap: wrap; }

.prog-hero__visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.prog-hero__card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 30px 28px;
    width: 100%;
    max-width: 380px;
    box-shadow: var(--shadow-lg);
}
.prog-hero__card--standard {
    background: linear-gradient(160deg, #ffffff 0%, var(--bg-mint) 100%);
    border-color: var(--teal-300);
}
.prog-hero__card-tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 6px 12px;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border-radius: 999px;
    margin-bottom: 18px;
}
.prog-hero__card-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-top: 1px solid var(--line);
    font-size: 14.5px;
}
.prog-hero__card-row:nth-child(2) { border-top: none; }
.prog-hero__card-row b {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.prog-hero__card-row span { color: var(--ink); font-weight: 600; }
.prog-hero__card-row--accent { background: var(--brand-soft); margin: 10px -10px -10px; padding: 14px 10px; border-radius: 12px; border-top: none; }
.prog-hero__card-row--accent span { color: var(--brand-dark); font-weight: 800; }

/* Solution / perks */
.prog-solution { padding: 110px 0; background: #fff; }
.prog-perks {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.prog-perk {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 32px 28px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.prog-perk:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--teal-300); }
.prog-perk__icon {
    width: 60px; height: 60px;
    display: grid; place-items: center;
    font-size: 28px;
    background: var(--brand-soft);
    border-radius: 16px;
    margin-bottom: 20px;
}
.prog-perk h3 { font-size: 18px; margin-bottom: 12px; }
.prog-perk p { font-size: 14.5px; line-height: 1.55; }

/* Parameters table */
.prog-params { padding: 110px 0; background: var(--bg-soft); }
.prog-table {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    overflow: hidden;
}
.prog-table__row {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 30px;
    padding: 22px 30px;
    border-top: 1px solid var(--line);
    align-items: center;
}
.prog-table__row:first-child { border-top: none; }
.prog-table__key {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.prog-table__val { font-size: 15.5px; color: var(--ink); }
.prog-table__val b { color: var(--brand-dark); font-weight: 800; }
.prog-table__val small { display: block; color: var(--ink-2); font-size: 13px; margin-top: 4px; }
.prog-table__val a { color: var(--brand-dark); text-decoration: underline; text-underline-offset: 3px; }

/* Includes */
.prog-includes { padding: 110px 0; background: #fff; }
.prog-includes__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}
.prog-inc {
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 22px;
    padding: 32px 30px;
}
.prog-inc--yes { border-color: var(--teal-300); background: var(--bg-mint); }
.prog-inc--no { border-color: #fecaca; background: #fef2f2; }
.prog-inc h3 { font-size: 18px; margin-bottom: 18px; }
.prog-inc ul { list-style: none; display: grid; gap: 12px; }
.prog-inc ul li { font-size: 15px; line-height: 1.55; color: var(--ink); padding-left: 0; }
.prog-inc ul li b { font-weight: 700; }
.prog-inc--yes ul li b { color: var(--brand-dark); }
.prog-inc--no ul li b { color: #be123c; }
.prog-inc ul li a { color: var(--brand-dark); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

/* Accordion */
.prog-details { padding: 110px 0; background: var(--bg-soft); }
.prog-accordion { display: grid; gap: 12px; max-width: 880px; margin: 0 auto; }
.prog-acc {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
    transition: background .15s ease, border-color .15s ease;
}
.prog-acc[open] { border-color: var(--teal-300); box-shadow: var(--shadow-sm); }
.prog-acc > summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 22px 26px;
    cursor: pointer;
    font-size: 17px;
    font-weight: 700;
    color: var(--ink);
}
.prog-acc > summary::-webkit-details-marker { display: none; }
.prog-acc > summary::marker { content: ""; }
.prog-acc > summary i {
    flex-shrink: 0;
    width: 32px; height: 32px;
    display: inline-grid; place-items: center;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 50%;
    font-style: normal;
    font-weight: 800;
    font-size: 18px;
    color: var(--brand-dark);
    transition: transform .25s ease, background .15s ease, color .15s ease;
}
.prog-acc[open] > summary i {
    transform: rotate(45deg);
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
}
.prog-acc__body {
    padding: 0 26px 24px;
    font-size: 15.5px;
    line-height: 1.65;
}
.prog-acc__body p { color: var(--ink-2); margin-bottom: 12px; }
.prog-acc__body p:last-child { margin-bottom: 0; }
.prog-acc__body b { color: var(--ink); font-weight: 700; }

/* Where you apply */
.prog-where { padding: 110px 0; background: #fff; }
.prog-where__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
}
.prog-where__text h2 { margin: 12px 0 18px; }
.prog-where__text > p { font-size: 17px; margin-bottom: 22px; }
.prog-where__list { list-style: none; display: grid; gap: 14px; margin-bottom: 28px; }
.prog-where__list li {
    position: relative;
    padding-left: 24px;
    font-size: 15px;
    color: var(--ink);
    line-height: 1.55;
}
.prog-where__list li::before {
    content: "";
    position: absolute;
    left: 0; top: 9px;
    width: 12px; height: 12px;
    background: linear-gradient(135deg, var(--teal-400), var(--teal-600));
    border-radius: 50%;
}
.prog-where__list li b { color: var(--ink); font-weight: 700; }
.prog-where__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 26px;
}
.prog-chip {
    display: inline-flex;
    align-items: center;
    padding: 9px 16px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
}
.prog-chip:nth-child(3n) { background: var(--brand-soft); color: var(--brand-dark); border-color: var(--teal-100); }

/* Pricing */
.prog-pricing { padding: 110px 0; background: var(--bg-soft); }
.prog-prices {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    align-items: stretch;
}
.prog-price {
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 22px;
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.prog-price:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--teal-300); }
.prog-price--featured {
    background: linear-gradient(180deg, #fff 0%, var(--bg-mint) 100%);
    border-color: var(--teal-300);
    transform: scale(1.03);
}
.prog-price--featured:hover { transform: scale(1.03) translateY(-6px); }
.prog-price__tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--brand-soft);
    color: var(--brand-dark);
    border: 1px solid var(--teal-100);
    margin-bottom: 18px;
    width: max-content;
}
.prog-price--featured .prog-price__tag {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    border-color: transparent;
}
.prog-price h3 { font-size: 20px; margin-bottom: 14px; }
.prog-price__amount { margin-bottom: 16px; line-height: 1; }
.prog-price__amount b {
    font-size: 40px;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--ink);
}
.prog-price__amount span {
    font-size: 14px;
    color: var(--ink-2);
    margin-left: 8px;
}
.prog-price p { font-size: 14.5px; margin-bottom: 22px; flex-grow: 1; line-height: 1.55; }
.prog-price .btn { margin-top: auto; }

/* Trust / reviews — uses existing .reviews__grid */
.prog-trust { padding: 110px 0; background: #fff; }

/* Lead magnet */
.prog-lead { padding: 80px 0; background: var(--bg-soft); }
.prog-lead__band {
    background:
        radial-gradient(500px 300px at 0% 0%, rgba(var(--sh3), 0.20), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border-radius: 28px;
    padding: 36px 40px;
    color: #fff;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 28px;
    align-items: center;
    box-shadow: var(--shadow-lg);
}
.prog-lead__icon {
    width: 72px; height: 72px;
    display: grid; place-items: center;
    font-size: 32px;
    background: rgba(255,255,255,0.16);
    border-radius: 20px;
}
.prog-lead__text h2 { color: #fff; font-size: 22px; margin: 8px 0 6px; letter-spacing: -0.01em; }
.prog-lead__text p { color: rgba(255,255,255,0.86); font-size: 14.5px; line-height: 1.5; }
.prog-lead__form {
    display: flex;
    gap: 10px;
    align-items: center;
}
.prog-lead__form input {
    padding: 13px 18px;
    font: 500 14.5px 'Manrope', sans-serif;
    background: #fff;
    border: none;
    border-radius: 12px;
    color: var(--ink);
    min-width: 240px;
}
.prog-lead__form input:focus { outline: none; box-shadow: 0 0 0 4px rgba(255,255,255,0.3); }
.prog-lead__form .btn { background: #fff; color: var(--brand-dark); }
.prog-lead__form .btn:hover { background: var(--brand-soft); }

/* Final CTA */
.prog-cta { padding: 110px 0; background: #fff; }
.prog-cta__inner {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 28px;
    padding: 50px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 32px;
    align-items: center;
}
.prog-cta__text h2 { margin-bottom: 10px; font-size: clamp(24px, 2.8vw, 32px); }
.prog-cta__text p { font-size: 16px; color: var(--ink-2); max-width: 640px; }
.btn--lg { padding: 18px 30px; font-size: 16px; }

/* ===== Blog page ===== */
.page-blog { background: var(--bg-soft); }

.blog-filter { grid-template-columns: 1fr 1fr auto; }

.blog-grid { grid-template-columns: repeat(3, 1fr); }

.blog-card {
    padding: 0;
    overflow: hidden;
    background: #fff;
    text-align: left;
    color: inherit;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
}
.blog-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }

.blog-card__cover {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
/* Soft dark gradient over the photo so the "ТЕМА" badge stays readable. */
.blog-card__cover::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(var(--sh-dark),  0.32) 0%, rgba(var(--sh-dark),  0.04) 50%, rgba(var(--sh-dark),  0.45) 100%);
    pointer-events: none;
}
.blog-card__topic {
    position: absolute;
    top: 14px; left: 14px;
    z-index: 1;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 6px 12px;
    background: rgba(255,255,255,0.95);
    color: var(--brand-dark);
    border-radius: 999px;
    backdrop-filter: blur(6px);
}
.blog-card__body { padding: 22px 24px 24px; display: flex; flex-direction: column; flex: 1; }
.blog-card__body h3 { font-size: 17px; line-height: 1.3; margin-bottom: 10px; }
.blog-card__body .ucat__sub { margin-bottom: 16px; flex-grow: 1; }
.blog-card__meta {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink-3);
    letter-spacing: 0.02em;
}

/* Cover variants — тематические фотографии под каждый тип статьи.
   1-6: основные обложки (графика темы). 7-9: запасные для будущих
   статей (городская Прага). Фотографии загружены с Unsplash,
   лицензия — Unsplash License (бесплатно для коммерческого
   использования). */
/* Все обложки — Unsplash photos (CC0 / Unsplash License: бесплатно для коммерческого
   использования, атрибуция не требуется). Каждой статье — своё уникальное фото. */
.blog-cover--higher-education { background-image: url('https://images.unsplash.com/photo-1607237138185-eedd9c632b0b?auto=format&fit=crop&w=1200&q=80'); }   /* кампус, выпускники */
.blog-cover--no-exam          { background-image: url('https://images.unsplash.com/photo-1571260899304-425eee4c7efc?auto=format&fit=crop&w=1200&q=80'); }   /* открытые двери, студенты */
.blog-cover--top-specialties  { background-image: url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1200&q=80'); }   /* карьера, профессии */
.blog-cover--extra-costs      { background-image: url('https://images.unsplash.com/photo-1554224155-6726b3ff858f?auto=format&fit=crop&w=1200&q=80'); }   /* евро монеты */
.blog-cover--prihlaska        { background-image: url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=1200&q=80'); }   /* документы, формы */
.blog-cover--nostrifikace     { background-image: url('https://images.unsplash.com/photo-1576267423048-15c0040fec78?auto=format&fit=crop&w=1200&q=80'); }   /* диплом, печать */
.blog-cover--costs-czech-2026 { background-image: url('https://images.unsplash.com/photo-1554224154-26032ffc0d07?auto=format&fit=crop&w=1200&q=80'); }   /* бюджет, калькулятор */
.blog-cover--vs-countries     { background-image: url('https://images.unsplash.com/photo-1488646953014-85cb44e25828?auto=format&fit=crop&w=1200&q=80'); }   /* Европа, карта */
.blog-cover--charles-medicine { background-image: url('https://images.unsplash.com/photo-1538108149393-fbbd81895907?auto=format&fit=crop&w=1200&q=80'); }   /* медицина, стетоскоп */
.blog-cover--student-work     { background-image: url('https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=1200&q=80'); }   /* студент, работа */

/* Legacy grad-* классы — fallback на новые с похожим темплейтом */
.blog-cover--grad-1 { background-image: url('https://images.unsplash.com/photo-1523050854058-8df90110c9f1?auto=format&fit=crop&w=1200&q=80'); }
.blog-cover--grad-2 { background-image: url('https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=1200&q=80'); }
.blog-cover--grad-3 { background-image: url('https://images.unsplash.com/photo-1554224155-6726b3ff858f?auto=format&fit=crop&w=1200&q=80'); }
.blog-cover--grad-4 { background-image: url('https://images.unsplash.com/photo-1576267423048-15c0040fec78?auto=format&fit=crop&w=1200&q=80'); }
.blog-cover--grad-5 { background-image: url('https://images.unsplash.com/photo-1571260899304-425eee4c7efc?auto=format&fit=crop&w=1200&q=80'); }
.blog-cover--grad-6 { background-image: url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1200&q=80'); }
.blog-cover--grad-1,
.blog-cover--grad-2,
.blog-cover--grad-3,
.blog-cover--grad-4,
.blog-cover--grad-5,
.blog-cover--grad-6,
.blog-cover--grad-7,
.blog-cover--grad-8,
.blog-cover--grad-9 {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* ===== Article page ===== */
.page-article { background: #fff; }
.article { padding: 40px 0 80px; }
.article .uhero__top { margin-bottom: 24px; }

.article__head { margin-bottom: 36px; }
.article__cover {
    position: relative;
    aspect-ratio: 21 / 9;
    border-radius: 24px;
    margin-bottom: 28px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.article__cover::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(var(--sh-dark),  0.32) 0%, rgba(var(--sh-dark),  0.04) 50%, rgba(var(--sh-dark),  0.5) 100%);
}

.article__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink-3);
    margin-bottom: 14px;
    letter-spacing: 0.02em;
}
.article__head h1 {
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.15;
    margin-bottom: 18px;
    letter-spacing: -0.02em;
}
.article__excerpt {
    font-size: 18px;
    color: var(--ink-2);
    line-height: 1.5;
    padding-bottom: 28px;
    border-bottom: 1px dashed var(--line-2);
}

/* 12-col editorial layout: sidebar (4 col, sticky) + body (8 col, ~770px).
   На мобильных схлопывается в одну колонку, sidebar уходит выше body. */
.article__layout {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 40px;
    align-items: start;
}
.article__sidebar {
    grid-column: span 4;
    position: sticky;
    top: 100px;
    /* Ограничиваем высоту высотой viewport (минус sticky-offset и небольшой
       нижний воздух), чтобы share-row и mini-CTA всегда оставались видимыми.
       Если статья короткая и блоки помещаются — max-height не достигается,
       никаких скроллбаров. */
    max-height: calc(100vh - 120px);
    display: flex;
    flex-direction: column;
    gap: 18px;
    overflow: hidden; /* скроллится внутренний ol, не вся плашка */
}
.article__sidebar .btn { margin-top: 6px; }

.article__toc {
    /* В flex-родителе ToC растягивается и забирает свободную высоту,
       а его внутренний ol скроллится при переполнении. Share и CTA
       (flex-shrink:0) остаются на месте. */
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 18px 20px;
    background: var(--teal-50);
    border: 1px solid var(--teal-200);
    border-radius: 16px;
}
.article__toc-label {
    display: block;
    flex-shrink: 0;
    margin-bottom: 10px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal-700);
}
.article__toc ol {
    list-style: none;
    counter-reset: toc;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
    /* Прокрутка только списка заголовков; label сверху, share + CTA снизу
       видны всегда. */
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    /* Тонкий ненавязчивый scrollbar */
    scrollbar-width: thin;
    scrollbar-color: var(--teal-300) transparent;
}
.article__toc ol::-webkit-scrollbar { width: 6px; }
.article__toc ol::-webkit-scrollbar-thumb {
    background: var(--teal-300);
    border-radius: 999px;
}
.article__toc ol::-webkit-scrollbar-track { background: transparent; }
.article__share, .article__sidebar-cta { flex-shrink: 0; }
.article__toc li {
    counter-increment: toc;
    padding-left: 26px;
    position: relative;
    font-size: 13.5px;
    line-height: 1.4;
}
.article__toc li::before {
    content: counter(toc, decimal-leading-zero);
    position: absolute;
    left: 0; top: 1px;
    font-size: 11px;
    font-weight: 800;
    color: var(--teal-700);
    opacity: 0.7;
}
.article__toc a {
    color: var(--ink-2);
    text-decoration: none;
    border: none;
    transition: color .15s ease;
}
.article__toc a:hover { color: var(--teal-700); }

.article__share {
    padding: 16px 20px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
}
.article__share-label {
    display: block;
    margin-bottom: 10px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.article__share-row { display: flex; gap: 10px; }
.article__share-row > * {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 10px;
    color: var(--ink-2);
    cursor: pointer;
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.article__share-row > *:hover {
    background: var(--teal-50);
    border-color: var(--teal-300);
    color: var(--teal-700);
    transform: translateY(-1px);
}
.article__share-copy { font: inherit; }
.article__share-copy.is-copied {
    background: var(--teal-500) !important;
    color: #fff !important;
    border-color: var(--teal-500) !important;
}

.article__sidebar-cta {
    margin-top: 4px;
    text-align: center;
}

/* Унифицированная типографика статей: единый ритм, выделения и
   маркировка во всех материалах блога. */
.article__body {
    grid-column: span 8;
    font-size: 17px;
    line-height: 1.7;
    color: var(--ink);
    /* В 12-col layout колонка ~770px при 1200px container — комфортно
       для чтения. Сбрасываем старый max-width: 740px + margin: auto. */
    max-width: none;
    margin: 0;
}

/* На /privacy и других «легальных» текстовых страницах без сайдбара
   prose-блок занимает все 12 колонок контейнера (полная ширина). */
.page-privacy .article__layout {
    display: block;
}
.page-privacy .article__body--prose {
    max-width: none;
    margin: 0;
}
.page-privacy .article__head {
    max-width: none;
}

/* Заголовки */
.article__body h2 {
    font-size: 26px;
    font-weight: 800;
    margin: 44px 0 14px;
    letter-spacing: -0.012em;
    line-height: 1.25;
    color: var(--ink);
}
.article__body h2:first-child { margin-top: 0; }
.article__body h3 {
    font-size: 19px;
    font-weight: 700;
    margin: 28px 0 10px;
    letter-spacing: -0.005em;
    line-height: 1.3;
    color: var(--ink);
}

/* Параграфы */
.article__body p {
    margin: 0 0 18px;
    color: var(--ink);
}
.article__body p:last-child { margin-bottom: 0; }

/* Лид-параграф (первая фраза, опц.) */
.article__body p.article__lead {
    font-size: 19px;
    line-height: 1.55;
    color: var(--ink);
    font-weight: 500;
    margin-bottom: 24px;
}

/* Inline-выделения и ссылки */
.article__body b,
.article__body strong {
    font-weight: 700;
    color: var(--ink);
}
.article__body em,
.article__body i {
    font-style: italic;
    color: var(--ink-2);
}
.article__body a {
    color: var(--teal-700);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid var(--teal-200);
    transition: color .15s ease, border-color .15s ease;
}
.article__body a:hover {
    color: var(--teal-500);
    border-bottom-color: var(--teal-500);
}

/* Маркированные списки */
.article__body ul {
    list-style: none;
    display: grid;
    gap: 12px;
    margin: 0 0 24px;
    padding: 0;
}
.article__body ul li {
    position: relative;
    padding-left: 30px;
    color: var(--ink);
    line-height: 1.6;
}
.article__body ul li::before {
    content: "";
    position: absolute;
    left: 0; top: 9px;
    width: 16px; height: 16px;
    background: linear-gradient(135deg, var(--teal-400), var(--teal-600));
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(var(--sh1),  0.25);
}
.article__body ul li::after {
    content: "✓";
    position: absolute;
    left: 3px; top: 6px;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

/* Нумерованные списки */
.article__body ol.article__olist {
    list-style: none;
    counter-reset: art-step;
    display: grid;
    gap: 12px;
    margin: 0 0 24px;
    padding: 0;
}
.article__body ol.article__olist li {
    counter-increment: art-step;
    position: relative;
    padding-left: 38px;
    line-height: 1.6;
}
.article__body ol.article__olist li::before {
    content: counter(art-step);
    position: absolute;
    left: 0; top: 4px;
    width: 24px; height: 24px;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

/* Боковая «нота» / callout */
.article__body aside.article__note {
    margin: 24px 0;
    padding: 18px 22px;
    background: var(--teal-50);
    border-left: 4px solid var(--teal-500);
    border-radius: 12px;
    font-size: 15.5px;
    line-height: 1.6;
    color: var(--ink);
}
.article__body aside.article__note b,
.article__body aside.article__note strong { color: var(--teal-700); }

/* Tablet: схлопываем layout в одну колонку, sidebar уходит над body. */
@media (max-width: 960px) {
    .article__layout {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .article__sidebar {
        grid-column: 1;
        position: static;
        max-height: none;       /* отключаем viewport-ограничение на mobile */
        overflow: visible;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 12px;
    }
    .article__sidebar > * {
        flex: 1 1 calc(50% - 6px);
        min-width: 240px;
    }
    /* На mobile ToC не растягивается: высоту определяет содержимое,
       внутренний scrollbar не нужен. */
    .article__toc { flex: 1 1 calc(50% - 6px); }
    .article__toc ol { overflow-y: visible; max-height: none; }
    .article__sidebar-cta { flex-basis: 100%; }
    .article__body { grid-column: 1; max-width: 760px; margin: 0 auto; }
    .article__toc { flex-basis: 100%; }
}

@media (max-width: 640px) {
    .article__body { font-size: 16px; line-height: 1.65; }
    .article__body h2 { font-size: 22px; margin: 32px 0 12px; }
    .article__body h3 { font-size: 17px; margin: 24px 0 8px; }
    .article__body p.article__lead { font-size: 17px; }
    .article__body ul li { padding-left: 26px; }
    .article__body ul li::before { top: 8px; width: 14px; height: 14px; }
    .article__body ul li::after { top: 5px; left: 3px; font-size: 9px; }
    .article__sidebar { flex-direction: column; }
    .article__sidebar > * { flex-basis: 100%; min-width: 0; }
}

.article__cta {
    margin: 60px 0 60px;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 48px;
    align-items: stretch;
    background:
        radial-gradient(700px 400px at 0% 0%, rgba(var(--sh3), 0.22), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border-radius: 28px;
    padding: 52px 56px;
    color: #fff;
    box-shadow: var(--shadow-lg);
    position: relative;
    overflow: hidden;
}
.article__cta::before {
    content: "";
    position: absolute;
    inset: auto -10% -50% auto;
    width: 360px; height: 360px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    pointer-events: none;
}
.article__cta-text {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.article__cta-text h2 {
    color: #fff;
    font-size: clamp(26px, 3vw, 36px);
    line-height: 1.15;
    margin: 14px 0 16px;
    letter-spacing: -0.02em;
}
.article__cta-text p {
    color: rgba(255,255,255,0.88);
    font-size: 17px;
    line-height: 1.55;
    margin-bottom: 24px;
}
.article__cta-text p b { color: #fff; font-weight: 700; }
.article__cta-list {
    list-style: none;
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
}
.article__cta-list li {
    position: relative;
    padding-left: 32px;
    font-size: 15.5px;
    font-weight: 500;
    color: rgba(255,255,255,0.95);
    line-height: 1.45;
}
.article__cta-list li::before {
    content: "✓";
    position: absolute;
    left: 0; top: 0;
    width: 22px; height: 22px;
    display: grid; place-items: center;
    background: rgba(255,255,255,0.18);
    border-radius: 50%;
    color: #fff;
    font-weight: 800;
    font-size: 11px;
}

.article__cta-form {
    position: relative;
    background: #fff;
    border-radius: 22px;
    padding: 32px;
    display: grid;
    gap: 12px;
    box-shadow: 0 30px 60px rgba(var(--sh-dark), 0.22);
    color: var(--ink);
    align-self: center;
    width: 100%;
}
.article__cta-form h3 {
    font-size: 22px;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}
.article__cta-form label {
    display: grid;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink-2);
}
.article__cta-form input {
    width: 100%;
    padding: 14px 18px;
    font: 500 15px 'Manrope', sans-serif;
    color: var(--ink);
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 12px;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.article__cta-form input:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 4px var(--brand-ring);
}

.article__related h3 {
    font-size: 22px;
    margin-bottom: 24px;
    letter-spacing: -0.01em;
}

/* ===== About page ===== */
.page-about { background: #fff; }

/* Stats */
.astats { padding: 110px 0; background: #fff; }
.astats__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.astat {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 32px 26px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.astat:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--teal-300); background: #fff; }
.astat__num {
    font-size: clamp(40px, 4vw, 56px);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
    margin-bottom: 16px;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.astat__num small { font-size: 18px; font-weight: 700; letter-spacing: 0; }
.astat p { font-size: 14.5px; color: var(--ink-2); line-height: 1.5; }

/* Approach */
.approach { padding: 110px 0; background: var(--bg-soft); }
.approach__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.approach-card {
    position: relative;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 32px 26px 30px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.approach-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
    border-color: var(--teal-300);
}
.approach-card__num {
    position: absolute;
    top: 20px; right: 22px;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -0.04em;
    color: var(--teal-200);
    line-height: 1;
}
.approach-card__icon {
    width: 56px; height: 56px;
    display: grid; place-items: center;
    font-size: 26px;
    background: var(--brand-soft);
    border-radius: 14px;
    margin-bottom: 20px;
}
.approach-card h3 { margin-bottom: 12px; font-size: 18px; }
.approach-card p { font-size: 14.5px; line-height: 1.55; }

/* Team */
.team { padding: 110px 0; background: #fff; }
.team__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.team-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.team-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--teal-300); }
.team-card__photo {
    width: 84px; height: 84px;
    display: grid; place-items: center;
    font-size: 40px;
    border-radius: 22px;
    margin-bottom: 20px;
}
.team-card__photo--1 { background: linear-gradient(135deg, #fed7aa, #f97316); }
.team-card__photo--2 { background: linear-gradient(135deg, #bae6fd, #0ea5e9); }
.team-card__photo--3 { background: linear-gradient(135deg, var(--teal-300), var(--teal-600)); }

.team-card__role {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--brand-dark);
    background: var(--brand-soft);
    border: 1px solid var(--teal-100);
    padding: 5px 12px;
    border-radius: 999px;
    margin-bottom: 14px;
    width: max-content;
}
.team-card h3 { font-size: 18px; margin-bottom: 12px; line-height: 1.3; }
.team-card p { font-size: 14.5px; line-height: 1.55; margin-bottom: 16px; }
.team-card__list { list-style: none; display: grid; gap: 8px; }
.team-card__list li {
    position: relative;
    padding-left: 22px;
    font-size: 14px;
    color: var(--ink);
}
.team-card__list li::before {
    content: "";
    position: absolute;
    left: 0; top: 6px;
    width: 12px; height: 12px;
    background: linear-gradient(135deg, var(--teal-400), var(--teal-600));
    border-radius: 50%;
}
.team-card__list li::after {
    content: "✓";
    position: absolute;
    left: 2px; top: 4px;
    color: #fff;
    font-size: 8px;
    font-weight: 800;
}
.team-card--quote {
    background: linear-gradient(160deg, var(--teal-700) 0%, var(--teal-800) 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: var(--shadow-lg);
}
.team-card--quote h3 { color: #fff; }
.team-card--quote .team-card__role { background: rgba(255,255,255,0.16); color: #fff; border-color: rgba(255,255,255,0.2); }
.team-card__quote {
    color: rgba(255,255,255,0.88);
    font-style: italic;
    line-height: 1.6;
    margin: 0;
    position: relative;
    padding-top: 8px;
}
.team-card__quote::before {
    content: "“";
    display: block;
    font-size: 50px;
    line-height: 0.7;
    color: rgba(255,255,255,0.35);
    margin-bottom: 6px;
}

/* Gallery */
.gallery { padding: 110px 0; background: var(--bg-soft); }
.gallery__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 220px 220px;
    gap: 18px;
}
.gallery__item {
    position: relative;
    border-radius: 22px;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    padding: 18px 22px;
    color: #fff;
    box-shadow: var(--shadow-sm);
    transition: transform .25s ease;
}
.gallery__item:hover { transform: translateY(-4px); }
.gallery__item--lg { grid-column: span 2; grid-row: span 2; }
.gallery__item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.55) 100%);
    pointer-events: none;
}
.gallery__label {
    position: relative;
    z-index: 1;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.04em;
}
.gallery__item--g1 { background: linear-gradient(135deg, #5eead4, #0f766e); }
.gallery__item--g2 { background: linear-gradient(135deg, #fde68a, #f59e0b); }
.gallery__item--g3 { background: linear-gradient(135deg, #c4b5fd, #7c3aed); }
.gallery__item--g4 { background: linear-gradient(135deg, #fda4af, #be123c); }
.gallery__item--g5 { background: linear-gradient(135deg, #bae6fd, #0369a1); }

.map-card {
    margin-top: 40px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 24px;
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 26px 30px;
}
.map-card__pin {
    width: 60px; height: 60px;
    display: grid; place-items: center;
    font-size: 28px;
    background: var(--brand-soft);
    border-radius: 16px;
}
.map-card__text h3 { font-size: 18px; margin-bottom: 6px; }
.map-card__text p { font-size: 14.5px; }

/* Documents */
.docs { padding: 110px 0; background: #fff; }
.docs__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.doc-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 30px 26px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    display: flex;
    flex-direction: column;
}
.doc-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: var(--teal-300); }
.doc-card__icon {
    width: 56px; height: 56px;
    display: grid; place-items: center;
    font-size: 26px;
    background: var(--brand-soft);
    border-radius: 14px;
    margin-bottom: 18px;
}
.doc-card h3 { font-size: 17px; margin-bottom: 12px; }
.doc-card p { font-size: 14px; flex-grow: 1; margin-bottom: 16px; line-height: 1.55; }
.doc-card a {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--brand-dark);
}
.doc-card a:hover { color: var(--brand); }

/* About final CTA */
.acta { padding: 110px 0; background: var(--bg-soft); }
.acta__band {
    background:
        radial-gradient(700px 400px at 95% 0%, rgba(var(--sh3), 0.22), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border-radius: 32px;
    padding: 60px;
    color: #fff;
    text-align: center;
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    position: relative;
}
.acta__text h2 { color: #fff; max-width: 720px; margin: 0 auto 16px; }
.acta__text p { color: rgba(255,255,255,0.86); font-size: 17px; max-width: 640px; margin: 0 auto 30px; line-height: 1.55; }
.acta__btns { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.acta__btns .btn--outline { border-color: rgba(255,255,255,0.45); color: #fff; }
.acta__btns .btn--outline:hover { background: #fff; color: var(--brand-dark); border-color: #fff; }

@media (max-width: 1024px) {
    .nav { display: none; }
    .lang__btn { padding: 6px 8px; font-size: 10.5px; }
    .hero {
        min-height: auto;
        max-height: none;
        padding: 50px 0 80px;
    }
    .hero__inner, .quiz__inner, .guide-block__inner, .consult__inner { grid-template-columns: 1fr; gap: 50px; }
    .steps::before { left: 38px; }
    .step { grid-template-columns: 52px 1fr; gap: 16px; padding: 18px 20px; }
    .step__num { width: 42px; height: 42px; font-size: 14px; }
    .step__body h3 { font-size: 18px; }
    .step__body p { font-size: 12.5px; }
    .hero__visual { height: auto; min-height: 460px; max-width: 520px; margin: 0 auto; }
    .hero__photo { min-height: 380px; }
    .why__grid, .reviews__grid { grid-template-columns: repeat(2, 1fr); }
    .unis__grid { grid-template-columns: repeat(3, 1fr); }
    .programs__grid, .payment__grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
    .plan--featured { transform: none; }
    .plan--featured:hover { transform: translateY(-6px); }
    .footer__inner { grid-template-columns: 1fr 1fr; gap: 32px; }

    /* Universities page */
    .ufilter { grid-template-columns: 1fr 1fr; }
    .ufilter__result { grid-column: 1 / 2; }
    .ufilter > .btn { grid-column: 2 / 3; align-self: stretch; }

    .cat-grid { grid-template-columns: repeat(2, 1fr); }
    .catalog__head { flex-direction: column; align-items: flex-start; }

    .bento__grid {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }
    .bento-item--lg { grid-row: auto; }

    .how__steps { grid-template-columns: repeat(2, 1fr); }
    .how-step { border-radius: 0 !important; }
    .how-step:nth-child(1) { border-radius: 22px 0 0 0 !important; }
    .how-step:nth-child(2) { border-radius: 0 22px 0 0 !important; }
    .how-step:nth-child(3) { border-radius: 0 0 0 22px !important; border-top: none; }
    .how-step:nth-child(4) { border-radius: 0 0 22px 0 !important; border-top: none; border-left: none; }

    .ucta__band { grid-template-columns: 1fr; padding: 44px; }

    /* Blog */
    .blog-filter { grid-template-columns: 1fr 1fr; }
    .blog-filter > .btn { grid-column: 1 / -1; }
    .blog-grid { grid-template-columns: repeat(2, 1fr); }
    .article__cta { grid-template-columns: 1fr; gap: 32px; padding: 40px 32px; }

    /* Intensive small */
    .prog-concept__visual { grid-template-columns: 1fr; }
    .prof-tabs { grid-template-columns: repeat(2, 1fr); }
    .prog-info-cards { grid-template-columns: 1fr; }
    .prof-panel { padding: 22px; }
    .int-cta__band { padding: 30px 24px; border-radius: 24px; }

    /* Contacts */
    .ct-cards { grid-template-columns: repeat(2, 1fr); }
    .ct-location__inner { grid-template-columns: 1fr; }
    .ct-map { min-height: 360px; }
    .ct-social__grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
    .ct-form-section__inner { grid-template-columns: 1fr; gap: 40px; }

    /* Program pages */
    .prog-hero__inner { grid-template-columns: 1fr; gap: 40px; }
    .prog-hero__visual { order: -1; }
    .prog-hero__stats { grid-template-columns: 1fr; }
    .prog-perks { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
    .prog-concept__inner { grid-template-columns: 1fr; }
    .prog-info-cards { grid-template-columns: repeat(2, 1fr); }
    .prof-tabs { grid-template-columns: repeat(3, 1fr); }
    .prof-panel__head { grid-template-columns: auto 1fr; }
    .prof-panel__hours { grid-column: 1 / -1; justify-self: start; }
    .prof-panel__grid { grid-template-columns: 1fr; }
    .int-prices { grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
    .int-cta__band { grid-template-columns: 1fr; padding: 44px; }
    .prog-table__row { grid-template-columns: 1fr; gap: 6px; }
    .prog-includes__grid { grid-template-columns: 1fr; }
    .prog-where__inner { grid-template-columns: 1fr; }
    .prog-prices { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
    .prog-price--featured { transform: none; }
    .prog-price--featured:hover { transform: translateY(-6px); }
    .prog-lead__band { grid-template-columns: 1fr; text-align: center; }
    .prog-lead__icon { margin: 0 auto; }
    .prog-lead__form { flex-direction: column; }
    .prog-lead__form input { width: 100%; min-width: 0; }
    .prog-cta__inner { grid-template-columns: 1fr; padding: 36px; }

    /* About */
    .astats__grid { grid-template-columns: repeat(2, 1fr); }
    .approach__grid { grid-template-columns: repeat(2, 1fr); }
    .team__grid { grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
    .gallery__grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: 200px 200px 200px; }
    .gallery__item--lg { grid-column: span 2; grid-row: span 2; }
    .map-card { grid-template-columns: auto 1fr; }
    .map-card .btn { grid-column: 1 / -1; }
    .docs__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
    /* На мобильных весь вертикальный ритм пересчитывается через CSS var.
       Все секции, использующие var(--section-py), сразу уменьшаются. */
    :root { --section-py: 84px; }
    section { padding: var(--section-py) 0; }
    .header__inner { height: 64px; }
    /* Логотип в шапке на мобиле — те же пропорции 18:11 ≈ 1.65 */
    .logo__text { font-size: 16px; color: var(--teal-700); }
    .logo__text small { font-size: 10px; letter-spacing: 0.18em; margin-top: 4px; }
    .logo__mark { width: 36px; height: 36px; font-size: 16px; }
    /* Подвал на мобиле: пропорции те же, акцентный teal-500 на тёмном bg */
    .footer__col--brand .logo--light .logo__text { font-size: 30px; line-height: 1; color: var(--teal-500); }
    .footer__col--brand .logo--light .logo__text small { font-size: 18px; margin-top: 8px; letter-spacing: 0.22em; color: rgba(255, 255, 255, 0.7); }
    .footer__col--brand .logo { gap: 12px; }
    .header__tools { gap: 8px; }
    .header__tools .btn--ghost { display: none; }
    /* В шапке на мобиле прячем кнопки «Заказать звонок» и «Консультация» на ВСЕХ
       сайтах — они остаются в открытом бургер-меню (.nav-drawer__cta). */
    .header__tools .btn--primary { display: none; }
    .lang { padding: 3px; }
    .lang__btn { padding: 6px 7px; font-size: 10px; }

    .hero { padding: 50px 0 80px; }
    /* Приближаем силуэт Праги на мобильном: viewBox 1600 шире viewport-а,
       поэтому при scale > 1 picture обрезается по бокам, но детали (башни,
       шпили) становятся крупнее и заметнее. */
    .hero__silhouette {
        transform: scale(1.6);
        transform-origin: bottom center;
        opacity: 1;
    }
    .hero__silhouette--back { transform: scale(1.6) translateY(2px); }
    .hero__cta { flex-direction: column; align-items: stretch; }
    .hero__cta .btn { width: 100%; }
    .hero__stats { grid-template-columns: 1fr; }
    .hero__stats { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .hero__visual { height: auto; min-height: 420px; }
    .hero__photo { min-height: 320px; }
    .hero__pill { margin: -28px 14px 0; padding: 14px 6px; border-radius: 18px; }
    .hero__pill-item { padding: 0 4px; gap: 2px; }
    .hero__pill-item b { font-size: 24px; }
    .hero__pill-item span { font-size: 11.5px; }
    .hero__photo-tag { font-size: 11.5px; padding: 6px 12px; top: 14px; left: 14px; }
    .why__grid, .reviews__grid { grid-template-columns: 1fr; }
    .unis__grid { grid-template-columns: repeat(2, 1fr); }
    .form--inline { grid-template-columns: 1fr; }
    .form--card { padding: 26px; }
    .footer__inner { grid-template-columns: 1fr; }
    .footer__bottom { flex-direction: column; gap: 14px; text-align: center; }

    /* Contacts page — single-column on mobile */
    .ct-cards { grid-template-columns: 1fr; gap: 14px; }
    .ct-card { padding: 22px 20px; }

    /* Universities page mobile */
    .uhero { padding: 24px 0 60px; }
    .ufilter { grid-template-columns: 1fr; padding: 14px; }
    .ufilter__result { grid-column: 1; }
    .ufilter > .btn { grid-column: 1; }
    .uchips { gap: 8px; }
    .uchip { padding: 7px 14px; font-size: 13px; }

    .uhero { padding: 24px 0 60px; }
    .cat-grid { grid-template-columns: 1fr; gap: 14px; }
    .ucat { padding: 22px 22px 20px; }
    .ucat h3 { font-size: 17px; }
    .cat-bar { flex-direction: column; align-items: flex-start; gap: 6px; margin-top: 28px; }

    .upop { padding: 28px 22px; }
    .upop__head { grid-template-columns: 56px 1fr; gap: 14px; }
    .upop__logo { width: 56px; height: 56px; font-size: 13px; }
    .upop__title { height: 56px; }
    .upop__title h3 { font-size: 18px; }
    .dorm-info { grid-template-columns: 1fr; padding: 16px; }
    .dorm-room { grid-template-columns: 1fr auto; gap: 8px 14px; padding: 14px; }
    .dorm-room__note { grid-column: 1 / -1; text-align: left; }
    .dorm-amenities { grid-template-columns: 1fr; }
    .modal--wide .modal__dialog--xl { max-height: 92vh; }

    .bento { padding: 70px 0; }
    .bento-item--lg { padding: 30px; }
    .bento-item--lg h3 { font-size: 24px; }

    .how { padding: 70px 0; }
    .how__steps { grid-template-columns: 1fr; }
    .how-step { border-radius: 0 !important; border-left: 1px solid var(--line); }
    .how-step:nth-child(1) { border-radius: 22px 22px 0 0 !important; }
    .how-step:nth-child(2) { border-radius: 0 !important; border-top: none; }
    .how-step:nth-child(3) { border-radius: 0 !important; border-top: none; }
    .how-step:nth-child(4) { border-radius: 0 0 22px 22px !important; border-top: none; }

    .ucta { padding: 70px 0; }
    .ucta__band { padding: 30px 24px; border-radius: 24px; }
    .ucta__form { padding: 24px; }

    /* Blog mobile */
    .blog-filter { grid-template-columns: 1fr; }
    .blog-grid { grid-template-columns: 1fr; }
    .article { padding: 24px 0 60px; }

    /* About mobile */
    .astats, .approach, .team, .gallery, .docs, .acta { padding: 70px 0; }
    .astats__grid, .approach__grid, .gallery__grid, .docs__grid { grid-template-columns: 1fr; }
    .gallery__grid { grid-template-rows: auto; }
    .gallery__item, .gallery__item--lg { grid-column: span 1; grid-row: span 1; min-height: 180px; }
    .map-card { grid-template-columns: 1fr; text-align: center; }
    .map-card__pin { margin: 0 auto; }
    .acta__band { padding: 36px 24px; }
}

/* ===== Floating contact widget ===== */
.cwidget {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 999;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 12px;
}
/* Иконка телеграма слева от ИИ-ассистента */
.cwidget__tg {
    width: 60px; height: 60px; border-radius: 50%;
    background: #229ED9; color: #fff;
    display: grid; place-items: center; text-decoration: none;
    box-shadow: 0 14px 32px rgba(34, 158, 217, 0.42);
    transition: transform .25s ease, box-shadow .25s ease;
}
.cwidget__tg:hover { transform: scale(1.06); box-shadow: 0 18px 38px rgba(34, 158, 217, 0.55); }
.cwidget__tg svg { width: 26px; height: 26px; }
.cwidget__toggle {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    box-shadow: 0 14px 32px rgba(var(--sh1),  0.45);
    cursor: pointer;
    position: relative;
    display: grid;
    place-items: center;
    transition: transform .25s ease, box-shadow .25s ease;
}
.cwidget__toggle:hover {
    transform: scale(1.06);
    box-shadow: 0 18px 38px rgba(var(--sh1),  0.55);
}
.cwidget__toggle svg { width: 28px; height: 28px; position: relative; z-index: 1; }
.cwidget__badge {
    position: absolute;
    top: -4px;
    right: -4px;
    background: #fff;
    color: var(--teal-700);
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.06em;
    padding: 3px 7px;
    border-radius: 999px;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.18);
    pointer-events: none;
    z-index: 2;
}
.cwidget__spark {
    position: absolute;
    background: #fff;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0.85;
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.6);
}
.cwidget__spark--a {
    width: 5px;
    height: 5px;
    top: 14px;
    left: 12px;
    animation: cwidgetSpark 2.4s ease-in-out infinite;
}
.cwidget__spark--b {
    width: 3px;
    height: 3px;
    bottom: 14px;
    right: 14px;
    animation: cwidgetSpark 3s ease-in-out infinite 0.8s;
}
@keyframes cwidgetSpark {
    0%, 100% { transform: scale(0.6); opacity: 0.2; }
    50%      { transform: scale(1);   opacity: 1;   }
}
@media (max-width: 540px) {
    .cwidget { right: 16px; bottom: 16px; }
    .cwidget__toggle, .cwidget__tg { width: 54px; height: 54px; }
}

/* Footer Google reviews badge */
.footer__google {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    text-decoration: none;
    color: #fff;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.footer__google:hover {
    background: rgba(255, 255, 255, 0.10);
    border-color: rgba(255, 255, 255, 0.22);
    transform: translateY(-2px);
}
.footer__google-logo {
    width: 28px;
    height: 28px;
    background: #fff;
    border-radius: 50%;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    padding: 4px;
}
.footer__google-logo svg { width: 100%; height: 100%; }
.footer__google-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.2;
}
.footer__google-rating {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.95);
}
.footer__google-rating b {
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -0.01em;
}
.footer__google-stars {
    color: #fbbc05;
    font-size: 12px;
    letter-spacing: 1px;
}
.footer__google-meta {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.65);
    font-weight: 600;
}

/* Video thumbnail review card */
.review__photo--thumb {
    background-size: cover;
    background-position: center;
    background-color: #0f172a;
}
.review--video { cursor: pointer; }
.review--video:hover .review__play {
    transform: translate(-50%, -50%) scale(1.18);
    background: #fff;
    color: var(--teal-600);
}

/* Video modal (YouTube embed) */
.modal--video .modal__dialog--video {
    background: #000;
    padding: 0;
    border-radius: 14px;
    overflow: hidden;
    max-width: 960px;
    width: 92vw;
    box-shadow: 0 32px 70px rgba(0, 0, 0, 0.5);
}
.modal--video .modal__close {
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    top: 12px;
    right: 12px;
    z-index: 5;
}
.modal--video .modal__close:hover { background: rgba(0, 0, 0, 0.8); }
.video-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
}
.video-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Visa route — numbered mini-timeline inside expand block */
.visa-route {
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
    counter-reset: visa;
}
.visa-route::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 14px;
    bottom: 14px;
    width: 2px;
    background: linear-gradient(180deg, var(--teal-300) 0%, var(--teal-200) 60%, transparent 100%);
    z-index: 0;
}
.visa-route__item {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 16px;
    padding: 8px 0 14px;
    position: relative;
    z-index: 1;
    align-items: start;
}
.visa-route__num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    font-weight: 800;
    font-size: 13px;
    display: grid;
    place-items: center;
    box-shadow: 0 4px 10px rgba(var(--sh1),  0.3);
    flex-shrink: 0;
    margin-top: 2px;
}
.visa-route__body h4 {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    margin: 0 0 4px;
    line-height: 1.3;
}
.visa-route__body p {
    font-size: 13px;
    color: var(--ink-2);
    line-height: 1.5;
    margin: 0;
}

/* ===== Chatbot widget ===== */
.chatbot {
    position: fixed;
    right: 24px;
    bottom: 100px;
    width: 360px;
    max-width: calc(100vw - 32px);
    height: 540px;
    max-height: calc(100vh - 140px);
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 28px 70px rgba(15, 23, 42, 0.28);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    opacity: 0;
    transform: translateY(16px) scale(0.96);
    transform-origin: bottom right;
    pointer-events: none;
    transition: opacity .25s ease, transform .25s ease;
}
.chatbot.is-open {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
.chatbot__head {
    padding: 14px 16px;
    background: linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.chatbot__brand { display: flex; align-items: center; gap: 12px; }
.chatbot__avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.25);
    display: grid;
    place-items: center;
    font-weight: 800;
    color: #fff;
    font-size: 15px;
}
.chatbot__brand-text { display: flex; flex-direction: column; gap: 2px; line-height: 1.2; }
.chatbot__brand-text strong { font-size: 14.5px; font-weight: 700; }
.chatbot__status {
    font-size: 11.5px;
    color: rgba(255, 255, 255, 0.78);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.chatbot__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 0 0 rgba(74, 222, 128, 0.6);
    animation: chatbotPulse 1.6s ease-out infinite;
}
@keyframes chatbotPulse {
    0%   { box-shadow: 0 0 0 0 rgba(74, 222, 128, 0.6); }
    100% { box-shadow: 0 0 0 8px rgba(74, 222, 128, 0); }
}
.chatbot__close {
    background: rgba(255, 255, 255, 0.15);
    border: none;
    color: #fff;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: background .2s ease;
}
.chatbot__close:hover { background: rgba(255, 255, 255, 0.28); }
.chatbot__close svg { width: 16px; height: 16px; }

.chatbot__messages {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    background: #f8fafc;
    display: flex;
    flex-direction: column;
    gap: 10px;
    scroll-behavior: smooth;
}
.chatbot__messages::-webkit-scrollbar { width: 6px; }
.chatbot__messages::-webkit-scrollbar-thumb { background: rgba(15, 23, 42, 0.15); border-radius: 3px; }

.chatbot__msg {
    max-width: 80%;
    padding: 10px 14px;
    border-radius: 14px;
    font-size: 14px;
    line-height: 1.45;
    animation: msgIn .25s ease-out;
}
.chatbot__msg--bot {
    background: #fff;
    border: 1px solid var(--line);
    color: var(--ink);
    border-bottom-left-radius: 4px;
    align-self: flex-start;
}
.chatbot__msg--user {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    border-bottom-right-radius: 4px;
    align-self: flex-end;
}
.chatbot__msg a {
    color: inherit;
    text-decoration: underline;
    font-weight: 600;
}
.chatbot__msg--bot a { color: var(--teal-700); }
@keyframes msgIn {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0);   }
}

.chatbot__typing {
    align-self: flex-start;
    background: #fff;
    border: 1px solid var(--line);
    padding: 10px 14px;
    border-radius: 14px;
    border-bottom-left-radius: 4px;
    display: inline-flex;
    gap: 4px;
}
.chatbot__typing i {
    width: 6px;
    height: 6px;
    background: var(--ink-3);
    border-radius: 50%;
    animation: typingDot 1.2s infinite;
}
.chatbot__typing i:nth-child(2) { animation-delay: 0.15s; }
.chatbot__typing i:nth-child(3) { animation-delay: 0.3s; }
@keyframes typingDot {
    0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
    30%           { opacity: 1;   transform: translateY(-3px); }
}

.chatbot__quickreplies {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 16px 0;
    background: #f8fafc;
}
.chatbot__qr {
    background: #fff;
    border: 1px solid var(--teal-300);
    color: var(--teal-700);
    padding: 7px 12px;
    border-radius: 999px;
    font: 600 12.5px 'Manrope', sans-serif;
    cursor: pointer;
    transition: background .2s ease, transform .15s ease;
}
.chatbot__qr:hover {
    background: var(--teal-50);
    transform: translateY(-1px);
}

.chatbot__form {
    display: flex;
    gap: 8px;
    padding: 12px 16px 14px;
    border-top: 1px solid var(--line);
    background: #fff;
}
.chatbot__form input {
    flex: 1;
    padding: 10px 14px;
    border: 1.5px solid var(--line);
    border-radius: 999px;
    font: 500 14px 'Manrope', sans-serif;
    color: var(--ink);
    background: #f8fafc;
    transition: border-color .15s ease;
}
.chatbot__form input:focus {
    outline: none;
    border-color: var(--brand);
    background: #fff;
}
.chatbot__form button {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border: none;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: transform .15s ease, box-shadow .2s ease;
}
.chatbot__form button:hover {
    transform: scale(1.06);
    box-shadow: 0 8px 18px rgba(var(--sh1),  0.4);
}
.chatbot__form button svg { width: 18px; height: 18px; }

@media (max-width: 540px) {
    .chatbot {
        right: 12px;
        bottom: 84px;
        width: calc(100vw - 24px);
        height: 70vh;
    }
}

/* Chatbot inline phone form */
.chatbot__phoneform {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}
.chatbot__phoneform input {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid var(--teal-300);
    border-radius: 10px;
    font: 600 14px 'Manrope', sans-serif;
    color: var(--ink);
    background: #fff;
    transition: border-color .15s ease;
}
.chatbot__phoneform input:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-ring);
}
.chatbot__phoneform--error,
.chatbot__phoneform input.chatbot__phoneform--error {
    border-color: #ef4444;
    background: rgba(239, 68, 68, 0.05);
}
.chatbot__phoneform button {
    width: 100%;
    padding: 11px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    font: 700 14px 'Manrope', sans-serif;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .2s ease;
}
.chatbot__phoneform button:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(var(--sh1),  0.4);
}

/* ===== Visa page ===== */
.visa-page {
    padding: 40px 0 100px;
    background: var(--bg-soft);
}
.visa-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 50px;
}
.visa-stat {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 24px 26px;
    text-align: center;
    box-shadow: 0 6px 22px rgba(15, 23, 42, 0.04);
}
.visa-stat__value {
    display: block;
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 8px;
    line-height: 1;
}
.visa-stat__hint {
    display: block;
    font-size: 14px;
    color: var(--ink-2);
    line-height: 1.4;
}
@media (max-width: 760px) {
    .visa-stats { grid-template-columns: 1fr; }
}

/* Detailed visa route on dedicated page — full width, in style of main page steps */
.visa-route--full {
    max-width: none;
    margin: 0;
    list-style: none;
    padding: 0;
}
.visa-route--full::before {
    left: 60px;
    top: 60px;
    bottom: 60px;
}
.visa-route--full .visa-route__item {
    display: grid;
    grid-template-columns: 68px 1fr;
    gap: 28px;
    padding: 36px 44px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    margin-bottom: 22px;
    position: relative;
    z-index: 1;
    align-items: start;
    transition: box-shadow .35s ease, border-color .35s ease, transform .25s ease;
}
.visa-route--full .visa-route__item:hover {
    background: var(--teal-50);
    border-color: var(--teal-300);
    box-shadow: 0 14px 32px rgba(var(--sh1),  0.14);
    transform: translateY(-2px);
}
.visa-route--full .visa-route__num {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    font-weight: 800;
    font-size: 17px;
    display: grid;
    place-items: center;
    box-shadow: 0 6px 16px rgba(var(--sh1),  0.3);
    flex-shrink: 0;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
    margin: 4px 0 0;
    transition: transform .4s cubic-bezier(.5,0,.3,1.4), background .35s ease, color .35s ease, box-shadow .4s ease;
}
.visa-route--full .visa-route__item:hover .visa-route__num {
    transform: scale(1.1);
    background: #fff;
    color: var(--teal-700);
    text-shadow: none;
    box-shadow: 0 10px 24px rgba(var(--sh1),  0.35), 0 0 0 2px var(--teal-300);
}
.visa-route--full .visa-route__body { padding: 0; }
.visa-route--full .visa-route__body h3 {
    font-size: 21px;
    font-weight: 700;
    margin: 0 0 8px;
    line-height: 1.25;
    color: var(--ink);
}
.visa-route--full .visa-route__body > p {
    font-size: 14px;
    color: var(--ink-2);
    line-height: 1.55;
    margin: 0 0 14px;
}
@media (max-width: 720px) {
    .visa-route--full .visa-route__item {
        grid-template-columns: 52px 1fr;
        gap: 18px;
        padding: 22px 22px;
    }
    .visa-route--full::before { left: 48px; }
    .visa-route--full .visa-route__num { width: 42px; height: 42px; font-size: 15px; }
    .visa-route--full .visa-route__body h3 { font-size: 18px; }
}
.visa-route__list {
    list-style: none;
    padding: 0;
    margin: 0 0 14px;
    display: grid;
    gap: 8px;
}
.visa-route__list li {
    position: relative;
    padding-left: 22px;
    font-size: 14px;
    color: var(--ink);
    line-height: 1.5;
}
.visa-route__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal-400), var(--teal-600));
}
.visa-route__list li::after {
    content: "✓";
    position: absolute;
    left: 3px;
    top: 5px;
    color: #fff;
    font-size: 9px;
    font-weight: 800;
}
.visa-route__time {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--teal-50);
    color: var(--teal-700);
    font-size: 12.5px;
    font-weight: 700;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid var(--teal-100);
}

/* Разворачивающееся описание уровня внутри ступени программы */
.lvl-detail { margin-top: 12px; }
.lvl-detail > summary {
    cursor: pointer;
    list-style: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 700;
    color: var(--brand-dark);
}
.lvl-detail > summary::-webkit-details-marker { display: none; }
.lvl-detail > summary::after {
    content: '';
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .2s ease;
}
.lvl-detail[open] > summary::after { transform: rotate(-135deg); }
.lvl-detail__body { margin-top: 12px; }
.lvl-detail__body ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 8px;
}
.lvl-detail__body li {
    position: relative;
    padding-left: 24px;
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--ink-2);
}
.lvl-detail__body li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 4px;
    width: 15px;
    height: 9px;
    border-left: 2px solid var(--teal-500);
    border-bottom: 2px solid var(--teal-500);
    transform: rotate(-45deg);
}
/* выше по специфичности, чем .visa-route__body p { margin:0 }, иначе отступ съедается */
.lvl-detail .lvl-detail__meta {
    margin: 16px 0 0;
    padding-top: 14px;
    border-top: 1px solid var(--line);
    font-size: 13.5px;
    font-weight: 700;
    color: var(--brand-dark);
}

/* Photo collage on the side of a timeline card — polaroid-style stack */
.visa-route--full .visa-route__item--with-media {
    grid-template-columns: 68px 1fr 260px;
    gap: 28px;
}
.visa-route__media {
    position: relative;
    width: 260px;
    height: 260px;
    align-self: center;
    flex-shrink: 0;
}
.visa-route__media img {
    position: absolute;
    width: 145px;
    height: 145px;
    object-fit: cover;
    border-radius: 14px;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.18);
    background: var(--bg-soft);
    transition: transform .35s ease, box-shadow .35s ease;
}
.visa-route__media img:nth-child(1) { top: 0;    left: 0;    transform: rotate(-6deg);              z-index: 2; }
.visa-route__media img:nth-child(2) { top: 0;    right: 0;   transform: rotate(5deg);               z-index: 1; }
.visa-route__media img:nth-child(3) { bottom: 0; left: 0;    transform: rotate(4deg);               z-index: 1; }
.visa-route__media img:nth-child(4) { bottom: 0; right: 0;   transform: rotate(-7deg);              z-index: 2; }
.visa-route__item--with-media:hover .visa-route__media img:nth-child(1) { transform: rotate(-3deg) translateY(-3px); }
.visa-route__item--with-media:hover .visa-route__media img:nth-child(2) { transform: rotate(8deg)  translateY(-3px); }
.visa-route__item--with-media:hover .visa-route__media img:nth-child(3) { transform: rotate(7deg)  translateY(3px); }
.visa-route__item--with-media:hover .visa-route__media img:nth-child(4) { transform: rotate(-10deg) translateY(3px); }

@media (max-width: 900px) {
    .visa-route--full .visa-route__item--with-media { grid-template-columns: 68px 1fr; }
    .visa-route__media { display: none; }
}
@media (max-width: 720px) {
    .visa-route--full .visa-route__item--with-media { grid-template-columns: 52px 1fr; }
}

/* Visa page CTA */
.visa-cta {
    margin-top: 60px;
    padding: 36px 40px;
    background: linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border-radius: 22px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    flex-wrap: wrap;
    box-shadow: 0 22px 50px rgba(var(--sh2),  0.32);
}
.visa-cta__text h2 {
    font-size: 24px;
    margin: 0 0 8px;
    color: #fff;
    line-height: 1.3;
}
.visa-cta__text p {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.5;
    margin: 0;
    max-width: 560px;
}
.visa-cta .btn {
    background: #fff;
    color: var(--brand-dark);
    flex-shrink: 0;
}
.visa-cta .btn:hover {
    background: #fff;
    box-shadow: 0 18px 36px rgba(255, 255, 255, 0.25);
    color: var(--teal-700);
}
@media (max-width: 720px) {
    .visa-cta { padding: 28px; }
    .visa-cta__text h2 { font-size: 20px; }
}

/* Step "more details" link — appears under condensed visa route.
   Force left-align: parent might be a flex/grid that centers items;
   `align-self: flex-start` keeps the pill against the panel's left edge. */
.step__more-link {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    margin-right: auto;
    color: var(--teal-700);
    font: 700 14px 'Manrope', sans-serif;
    text-decoration: none;
    padding: 8px 14px;
    border: 1.5px solid var(--teal-300);
    border-radius: 12px;
    background: var(--teal-50);
    transition: background .2s ease, transform .2s ease, border-color .2s ease;
}
.step__more-link:hover {
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
    transform: translateY(-2px);
}

/* Universities catalog block on home page */
.unis-catalog {
    background: var(--bg-soft);
    padding-top: 70px;
    padding-bottom: 70px;
}
.unis-catalog__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 18px;
}
.uni-card {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 18px 16px 16px;
    text-decoration: none;
    color: var(--ink);
    transition: transform .25s ease, box-shadow .25s ease, border-color .2s ease;
}
.uni-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.10);
    border-color: var(--teal-300);
}
.uni-card::after {
    content: "↗";
    position: absolute;
    top: 12px;
    right: 12px;
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    color: var(--teal-700);
    font-size: 13px;
    font-weight: 800;
    opacity: 0;
    transition: opacity .2s ease, transform .2s ease;
}
.uni-card:hover::after {
    opacity: 1;
    transform: translate(2px, -2px);
}
.uni-card__logo {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    color: #fff;
    font-weight: 800;
    font-size: 11px;
    display: grid;
    place-items: center;
    box-shadow: var(--shadow-sm);
    margin-bottom: 12px;
    letter-spacing: 0.02em;
}
.uni-card__name {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 8px;
    color: var(--ink);
}
.uni-card__specs {
    font-size: 12px;
    line-height: 1.45;
    color: var(--ink-2);
    margin: 0 0 10px;
    flex: 1;
}
.uni-card__city {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--ink-3);
    margin: 0;
    letter-spacing: 0.02em;
}
.unis-catalog__cta {
    margin-top: 36px;
    display: flex;
    justify-content: center;
}
@media (max-width: 1100px) {
    .unis-catalog__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
    .unis-catalog__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
}
@media (max-width: 420px) {
    .unis-catalog__grid { grid-template-columns: 1fr; }
}

/* Arrows removed site-wide. The .btn--no-arrow class is kept as a harmless no-op
   for back-compat with existing markup that uses it explicitly. */

/* Universities catalog section — distinct background under the hero */
.page-unis .uhero,
.page-blog .uhero { padding: 40px 0 50px; }
.ucatalog-page {
    background: var(--bg-soft);
    padding: 32px 0 100px;
}
.ucatalog-page .ufilter {
    margin-top: 0;
    background: #fff;
    grid-template-columns: repeat(2, 1fr);
}

/* ===== Program detail page (Smart Light / Standard / Intensive) ===== */
.page-program .uhero { padding: 40px 0 50px; }
.prog-page {
    background: var(--bg-soft);
    padding: 60px 0 100px;
}

/* Hero stats — 5 cards (price highlighted) */
.prog-hero__stats {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin-top: 36px;
}
.prog-hero__stat {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 18px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}
.prog-hero__stat-value {
    font-size: clamp(20px, 2.2vw, 28px);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.prog-hero__stat-hint {
    font-size: 12.5px;
    color: var(--ink-2);
    line-height: 1.35;
}
.prog-hero__stat--accent {
    background: linear-gradient(135deg, var(--teal-700), var(--teal-500));
    border-color: transparent;
}
.prog-hero__stat--accent .prog-hero__stat-value {
    -webkit-text-fill-color: #fff;
    background: none;
    font-family: 'Manrope', sans-serif;
    font-style: italic;
}
.prog-hero__stat--accent .prog-hero__stat-hint { color: rgba(255, 255, 255, 0.85); }
@media (max-width: 1100px) {
    .prog-hero__stats { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
    .prog-hero__stats { grid-template-columns: repeat(2, 1fr); }
}

/* Page sections */
.prog-section { margin-bottom: 70px; }
.prog-section > h2 {
    margin: 12px 0 18px;
    font-size: clamp(24px, 2.8vw, 32px);
    line-height: 1.2;
}
.prog-section__lead {
    font-size: 17px;
    color: var(--ink-2);
    line-height: 1.55;
    max-width: 880px;
    margin-bottom: 28px;
}
.prog-section__lead b { color: var(--ink); }

.prog-section__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}
.prog-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 28px 30px;
    box-shadow: 0 6px 22px rgba(15, 23, 42, 0.04);
}
.prog-card h3 {
    font-size: 19px;
    margin-bottom: 14px;
    color: var(--ink);
}
.prog-card p {
    font-size: 14.5px;
    color: var(--ink-2);
    line-height: 1.6;
    margin-bottom: 12px;
}
.prog-card p:last-child { margin-bottom: 0; }
.prog-card p b { color: var(--ink); }
@media (max-width: 820px) {
    .prog-section__grid { grid-template-columns: 1fr; }
}

/* Parameters table */
.prog-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 6px 22px rgba(15, 23, 42, 0.04);
}
.prog-table th,
.prog-table td {
    padding: 18px 26px;
    text-align: left;
    font-size: 15px;
    border-bottom: 1px solid var(--line);
}
.prog-table tr:last-child th,
.prog-table tr:last-child td { border-bottom: none; }
.prog-table th {
    width: 38%;
    color: var(--ink-3);
    font-weight: 600;
    background: var(--bg-soft);
}
.prog-table td { color: var(--ink); }
.prog-table b { color: var(--ink); font-weight: 700; }
.prog-table__hint {
    font-size: 13px;
    color: var(--ink-3);
    font-weight: 500;
}
@media (max-width: 540px) {
    .prog-table th, .prog-table td { padding: 14px 16px; font-size: 13.5px; }
    .prog-table th { width: 42%; }
}

/* Pricing cards */
.pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.pricing-card {
    position: relative;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 28px 26px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 6px 22px rgba(15, 23, 42, 0.04);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.pricing-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.10);
    border-color: var(--teal-200);
}
.pricing-card--featured {
    border-color: var(--teal-300);
    background: linear-gradient(180deg, #fff 0%, var(--teal-50) 100%);
}
.pricing-card--best {
    background:
        radial-gradient(500px 350px at 85% 0%, rgba(var(--sh3),  0.28), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    border-color: transparent;
    color: #fff;
}
.pricing-card__ribbon {
    position: absolute;
    top: -12px;
    right: 22px;
    background: linear-gradient(160deg, #0b1f1d 0%, #0f2e2a 55%, #0a2724 100%);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 7px 14px;
    border-radius: 999px;
    box-shadow: 0 8px 18px rgba(var(--sh-dark),  0.4);
}
.pricing-card__label {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -0.01em;
}
.pricing-card--best .pricing-card__label { color: #fff; }
.pricing-card__discount {
    display: inline-block;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--ink-3);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 18px;
}
.pricing-card--best .pricing-card__discount { color: rgba(255, 255, 255, 0.75); }
.pricing-card__plan {
    font-size: 22px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.02em;
}
.pricing-card--best .pricing-card__plan { color: #fff; }
.pricing-card__plan-alt {
    font-size: 14px;
    color: var(--ink-3);
    margin-bottom: 18px;
}
.pricing-card--best .pricing-card__plan-alt { color: rgba(255, 255, 255, 0.7); }
.pricing-card__total {
    padding: 14px 16px;
    background: var(--bg-soft);
    border-radius: 12px;
    margin-bottom: 14px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.pricing-card--featured .pricing-card__total { background: #fff; border: 1px solid var(--teal-200); }
.pricing-card--best .pricing-card__total {
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
}
.pricing-card__total-value {
    font-size: 24px;
    font-weight: 800;
    color: var(--ink);
}
.pricing-card--best .pricing-card__total-value { color: #fff; }
.pricing-card__total-alt {
    font-size: 13px;
    color: var(--ink-3);
}
.pricing-card--best .pricing-card__total-alt { color: rgba(255, 255, 255, 0.7); }
.pricing-card__save {
    font-size: 16px;
    font-weight: 800;
    color: var(--teal-700);
    text-align: right;
}
.pricing-card__save span {
    font-size: 13px;
    color: var(--ink-3);
    font-weight: 600;
}
.pricing-card--best .pricing-card__save,
.pricing-card--best .pricing-card__save span { color: #fff; }
.pricing-card__save--none {
    color: var(--ink-3);
    font-weight: 600;
    text-align: right;
}
@media (max-width: 980px) {
    .pricing-grid { grid-template-columns: 1fr; }
}

/* Included / Not included */
.incl-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
}
.incl-block {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 28px 30px;
    box-shadow: 0 6px 22px rgba(15, 23, 42, 0.04);
}
.incl-block--in {
    background: linear-gradient(180deg, #ecfdf5 0%, #fff 70%);
    border-color: var(--teal-200);
}
.incl-block h3 {
    font-size: 17px;
    margin-bottom: 18px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ink);
}
.incl-block--in h3 { color: var(--teal-700); }
.incl-block--out h3 { color: var(--ink-3); }
.incl-block ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 14px;
}
.incl-block li {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding-left: 0;
}
.incl-block li b {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
}
.incl-block li span {
    font-size: 13.5px;
    color: var(--ink-2);
    line-height: 1.45;
}
@media (max-width: 820px) {
    .incl-grid { grid-template-columns: 1fr; }
}

/* Plan card — two action buttons */
.plan__actions {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.plan__actions .btn { margin-top: 0; }

/* ===== Nav dropdown (Программы) ===== */
.nav-dropdown {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.nav-dropdown__toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    font-weight: 500;
    line-height: 1;
    color: var(--ink-2);
    transition: color .15s ease;
}
.nav-dropdown__toggle:hover,
.nav-dropdown.is-open .nav-dropdown__toggle {
    color: var(--ink);
}
.nav-dropdown__toggle .arrow {
    width: 12px;
    height: 12px;
    transition: transform .25s ease;
}
.nav-dropdown.is-open .nav-dropdown__toggle .arrow,
.nav-dropdown:hover .nav-dropdown__toggle .arrow {
    transform: rotate(180deg);
}
.nav-dropdown__menu {
    position: absolute;
    top: calc(100% + 6px);
    left: -16px;
    min-width: 220px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 8px;
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
    z-index: 100;
}
.nav-dropdown:hover .nav-dropdown__menu,
.nav-dropdown.is-open .nav-dropdown__menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.nav-dropdown__menu a {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 14px;
    border-radius: 10px;
    text-decoration: none;
    color: var(--ink);
    font-weight: 600;
    font-size: 14.5px;
    line-height: 1.3;
    transition: background .15s ease, color .15s ease;
}
.nav-dropdown__menu a:hover {
    background: var(--teal-50);
    color: var(--teal-700);
}
/* Активный (текущая страница) пункт — акцентный цвет темы (на center он синий). */
.nav-dropdown__menu a.is-active { color: var(--teal-700); background: var(--teal-50); }
/* Пункты выпадашки не должны наследовать подчёркивание-«линию» верхнего nav (.nav a::after) */
.nav-dropdown__menu a::after { content: none; }
.nav-dropdown__menu a small {
    font-size: 12px;
    font-weight: 500;
    color: var(--ink-3);
    letter-spacing: 0;
    text-transform: none;
}
.nav-dropdown__menu a:hover small { color: var(--teal-700); opacity: 0.85; }
/* Вторая (amber) секция — «Курсы английского»: hover в тон жёлтому фону, не teal */
.nav-dropdown__section + .nav-dropdown__section a:hover { background: var(--teal-50); color: var(--teal-700); }
.nav-dropdown__section + .nav-dropdown__section a:hover small { color: var(--teal-700); opacity: 0.85; }

/* ============================================
   PROGRAM PAGE — SMART LIGHT (sl-*)
   ============================================ */

/* HERO — dark with Prague silhouette */
.sl-hero {
    position: relative;
    overflow: hidden;
    padding: 60px 0 90px;
    color: #fff;
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(var(--sh1),  0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(var(--sh3),  0.18), transparent 60%),
        linear-gradient(160deg, #0b1f1d 0%, #0f2e2a 50%, #0a2724 100%);
}
.sl-hero__inner {
    position: relative;
    z-index: 2;
    max-width: 880px;
}
.sl-hero__crumbs {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 22px;
}
.sl-hero__crumbs a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color .2s ease;
}
.sl-hero__crumbs a:hover { color: #fff; }
.sl-hero__crumbs span:not(:last-child) { color: rgba(255, 255, 255, 0.35); }

.sl-hero__badge {
    display: inline-flex;
    align-items: center;
    background: rgba(var(--sh3),  0.15);
    color: var(--teal-300);
    border: 1px solid rgba(var(--sh3),  0.25);
    padding: 7px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 22px;
}
.sl-hero__title {
    font-size: clamp(48px, 8vw, 96px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
    margin: 0 0 26px;
    color: #fff;
}
.sl-hero__title .accent {
    background: linear-gradient(135deg, #5eead4 0%, #2dd4bf 60%, #14b8a6 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sl-hero__title .dot {
    color: var(--teal-400);
    -webkit-text-fill-color: var(--teal-400);
}
.sl-hero__lead {
    font-size: 19px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.85);
    max-width: 700px;
    margin-bottom: 36px;
}

.sl-hero__metrics {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 36px;
}
.sl-hero__metric {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 16px;
    padding: 18px 18px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    backdrop-filter: blur(8px);
}
.sl-hero__metric-value {
    font-size: clamp(22px, 2.4vw, 32px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.02em;
    line-height: 1;
    display: flex;
    align-items: baseline;
    gap: 6px;
}
.sl-hero__metric-value small {
    font-size: 18px;
    color: var(--teal-300);
    font-weight: 700;
}
.sl-hero__metric-unit {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.6);
    font-weight: 600;
    margin-left: -4px;
}
.sl-hero__metric-hint {
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.6);
    margin-top: 4px;
    line-height: 1.35;
}

.sl-hero__cta {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

@media (max-width: 720px) {
    .sl-hero__metrics { grid-template-columns: repeat(2, 1fr); }
}

/* SECTIONS */
.sl-section {
    padding: var(--section-py) 0;
    background: var(--bg-soft);
}
.sl-section--no-top { padding-top: 0; }
.sl-section--no-bottom { padding-bottom: 0; }

/* Consult-секция следует общему правилу --no-top (padding-top: 0), чтобы отступ
   над ней совпадал со всеми другими секциями (раньше тут был лишний padding-top
   → двойной зазор на /insurance и непостоянство между страницами). */
/* .why-kover redeclares padding (for standalone use), which re-adds top padding
   when the section isn't directly after another <section> (e.g. modals sit between).
   Keep --no-top honoured so the inter-section gap stays a single --section-py. */
.why-kover.sl-section--no-top { padding-top: 0; }
.sl-section--light { background: #fff; }
.sl-section--soft { background: var(--bg-soft); }
.sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sl-head {
    text-align: center;
    max-width: 820px;
    margin: 0 auto 50px;
}
.sl-head h2 {
    margin: 14px 0 0;
    font-size: clamp(28px, 3.6vw, 42px);
    line-height: 1.15;
    letter-spacing: -0.02em;
}
.sl-head h2 .accent {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sl-head__sub {
    margin-top: 18px;
    font-size: 17px;
    color: var(--ink-2);
    line-height: 1.55;
}
.sl-head__sub b { color: var(--ink); }

/* WHO IT'S FOR */
.sl-fit {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.sl-fit__card {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 32px 30px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .2s ease;
}
.sl-fit__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.08);
    border-color: var(--teal-300);
}
.sl-fit__icon {
    display: inline-grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--teal-100), var(--teal-200));
    font-size: 28px;
    margin-bottom: 18px;
}
.sl-fit__card h3 {
    font-size: 20px;
    margin-bottom: 10px;
    color: var(--ink);
}
.sl-fit__card p {
    font-size: 14.5px;
    color: var(--ink-2);
    line-height: 1.55;
    margin: 0;
}
@media (max-width: 820px) { .sl-fit { grid-template-columns: 1fr; } }

/* FEATURE GRID */
.sl-features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
.sl-feature {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 28px 28px 30px;
    display: flex;
    flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease, border-color .2s ease;
}
.sl-feature:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.08);
    border-color: var(--teal-200);
}
.sl-feature__icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    color: #fff;
    margin-bottom: 18px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.15);
}
.sl-feature__icon svg { width: 24px; height: 24px; }
.sl-feature h3 {
    font-size: 18px;
    margin-bottom: 10px;
    color: var(--ink);
}
.sl-feature p {
    font-size: 14.5px;
    color: var(--ink-2);
    line-height: 1.55;
    margin: 0;
}
.sl-feature p b { color: var(--ink); }
.sl-feature__more {
    margin-top: auto;
    padding-top: 18px;
    align-self: flex-start;
    font-weight: 700;
    font-size: 14.5px;
    color: var(--teal-700);
    text-decoration: none;
    transition: gap .2s ease, color .2s ease;
}
.sl-feature__more:hover { color: var(--teal-800); }
@media (max-width: 1024px) { .sl-features { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .sl-features { grid-template-columns: 1fr; } }

/* free-courses: карточки курсов в стиле страховых (.sl-feature: бейдж-уровень + спеки внутри) */
.fc-courses { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; align-items: stretch; }
@media (max-width: 720px) { .fc-courses { grid-template-columns: 1fr; } }
/* Акцентная бирюзовая заливка карточек курсов (белый текст, белый бейдж). */
.fc-course {
    background:
        radial-gradient(420px 300px at 85% 0%, rgba(var(--sh3), 0.22), transparent 60%),
        linear-gradient(160deg, var(--teal-500) 0%, var(--teal-700) 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 20px 44px rgba(var(--sh2), 0.30);
}
.fc-course:hover {
    border-color: transparent;
    background:
        radial-gradient(420px 300px at 85% 0%, rgba(var(--sh3), 0.28), transparent 60%),
        linear-gradient(160deg, var(--teal-500) 0%, var(--teal-700) 100%);
    box-shadow: 0 26px 52px rgba(var(--sh2), 0.34);
}
.fc-course h3 { color: #fff; }
.fc-course p { color: rgba(255, 255, 255, 0.88); }
.fc-course .ins-co__more,
.fc-course:hover .ins-co__more { color: #fff; }
.fc-course__badge span { color: var(--teal-700); }
.fc-course__badge span { font-size: 19px; font-weight: 800; letter-spacing: -0.02em; line-height: 1; }
.fc-course__tag {
    display: inline-block;
    font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--ink-3); margin: -4px 0 12px;
}

/* TIMELINE */
.sl-timeline {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
    padding-left: 36px;
}
.sl-timeline::before {
    content: "";
    position: absolute;
    left: 9px;
    top: 12px;
    bottom: 12px;
    width: 2px;
    background: linear-gradient(180deg, var(--teal-400) 0%, var(--teal-200) 70%, transparent 100%);
}
.sl-timeline__item {
    position: relative;
    padding: 0 0 32px;
}
.sl-timeline__item::before {
    content: "";
    position: absolute;
    left: -32px;
    top: 6px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 4px solid var(--teal-500);
    box-shadow: 0 0 0 4px var(--bg-soft);
}
.sl-timeline__item--final::before {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    border-color: var(--teal-700);
}
.sl-timeline__date {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--teal-700);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.sl-timeline__title {
    font-size: 19px;
    font-weight: 700;
    color: var(--ink);
    margin-bottom: 6px;
    line-height: 1.3;
}
.sl-timeline__desc {
    font-size: 14.5px;
    color: var(--ink-2);
    line-height: 1.55;
}

/* PARAMETERS */
.sl-params {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    max-width: 980px;
    margin: 0 auto;
}
.sl-param {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 24px 26px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}
.sl-param__label {
    font-size: 12px;
    font-weight: 700;
    color: var(--ink-3);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.sl-param__value {
    font-size: 17px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -0.01em;
    line-height: 1.3;
}
.sl-param__hint {
    font-size: 13px;
    color: var(--ink-3);
    margin-top: 4px;
    line-height: 1.4;
}
@media (max-width: 760px) { .sl-params { grid-template-columns: 1fr; } }

/* PRICING — same behavior as .plan cards on the main page */
.sl-pricing {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: stretch;
}
/* Один тариф (напр. /level-check) — карточка по центру, не растянута на треть ряда. */
.sl-pricing--single { grid-template-columns: minmax(0, 440px); justify-content: center; }
/* Если тарифов всего два — каждая карточка занимает половину ряда,
   а не треть (иначе третья колонка остаётся пустой). */
/* Раскладка тарифов по их количеству. Только на десктопе (>1024px) — ниже
   срабатывает общий мобильный @media (max-width:1024px) → один столбец.
   2 тарифа → пополам; 4 тарифа → по четверти ряда (на планшете 2×2). */
@media (min-width: 1025px) {
    .sl-pricing:has(.sl-price:nth-child(2):last-child) { grid-template-columns: repeat(2, 1fr); }
    .sl-pricing:has(.sl-price:nth-child(4):last-child) { grid-template-columns: repeat(4, 1fr); gap: 18px; }
}
@media (min-width: 701px) and (max-width: 1024px) {
    .sl-pricing:has(.sl-price:nth-child(4):last-child) { grid-template-columns: repeat(2, 1fr); }
}
.sl-price {
    --sl-bg: #fff;
    --sl-color: var(--ink);
    --sl-color-2: var(--ink-2);
    --sl-meta: var(--ink-3);
    --sl-border: var(--line);
    --sl-divider: var(--line);
    --sl-shadow: none;
    --sl-save-bg: var(--teal-50);
    --sl-save-color: var(--teal-700);
    --sl-bullet: linear-gradient(135deg, var(--teal-400), var(--teal-600));
    --sl-bullet-tick: #fff;

    position: relative;
    background: var(--sl-bg);
    color: var(--sl-color);
    border: 1px solid var(--sl-border);
    border-radius: 22px;
    padding: 34px 30px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-shadow: var(--sl-shadow);
    transition:
        transform .25s ease,
        box-shadow .35s ease,
        border-color .35s ease,
        background .35s ease,
        color .35s ease;
}

/* Default-highlighted (Полностью) + any hovered card lift */
.sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
.sl-price:hover { transform: translateY(-6px); }

/* Default-highlighted + hover state share the dark teal treatment */
.sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
.sl-price:hover {
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(var(--sh3),  0.28), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    --sl-color: #fff;
    --sl-color-2: rgba(255, 255, 255, 0.85);
    --sl-meta: rgba(255, 255, 255, 0.7);
    --sl-border: var(--teal-400);
    --sl-divider: rgba(255, 255, 255, 0.22);
    --sl-shadow: 0 22px 50px rgba(var(--sh2),  0.32);
    --sl-save-bg: rgba(255, 255, 255, 0.18);
    --sl-save-color: #fff;
    --sl-bullet: rgba(255, 255, 255, 0.3);
}
/* kover.center: подсветка тарифной карточки синяя, без зелёного radial/тени */
body.page-kover-center .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body.page-kover-center .sl-price:hover {
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(147, 197, 253, 0.32), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    --sl-shadow: 0 22px 50px rgba(37, 99, 235, 0.30);
}

.sl-price__ribbon {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(160deg, #0b1f1d 0%, #0f2e2a 55%, #0a2724 100%);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 7px 16px;
    border-radius: 999px;
    box-shadow: 0 8px 18px rgba(var(--sh-dark),  0.4);
    white-space: nowrap;
}

.sl-price__head { padding-bottom: 4px; }
.sl-price__name {
    display: block;
    font-size: 22px;
    font-weight: 800;
    color: var(--sl-color);
    letter-spacing: -0.02em;
    margin-bottom: 4px;
}
.sl-price__sub {
    display: block;
    font-size: 12.5px;
    color: var(--sl-meta);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.sl-price__amount {
    padding: 14px 0;
    border-top: 1px solid var(--sl-divider);
    border-bottom: 1px solid var(--sl-divider);
}
.sl-price__big {
    display: block;
    font-size: 38px;
    font-weight: 800;
    color: var(--sl-color);
    line-height: 1;
    letter-spacing: -0.03em;
    margin-bottom: 4px;
}
.sl-price__per {
    font-size: 13px;
    color: var(--sl-meta);
    font-weight: 600;
}
.sl-price__alt {
    font-size: 13px;
    color: var(--sl-meta);
}
.sl-price__total {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 14px;
}
.sl-price__total span { color: var(--sl-meta); font-weight: 600; }
.sl-price__total b {
    font-size: 18px;
    font-weight: 800;
    color: var(--sl-color);
}
.sl-price__total b small {
    font-size: 13px;
    font-weight: 600;
    color: var(--sl-meta);
    margin-left: 4px;
}
.sl-price__save {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 12px 16px;
    background: var(--sl-save-bg);
    border-radius: 12px;
    color: var(--sl-save-color);
    transition: background .35s ease, color .35s ease;
}
.sl-price__save span {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.sl-price__save strong {
    font-size: 18px;
    font-weight: 800;
}
.sl-price__features {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 10px;
}
.sl-price__features li {
    position: relative;
    padding-left: 24px;
    font-size: 14px;
    color: var(--sl-color-2);
    line-height: 1.4;
}
.sl-price__features li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 5px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--sl-bullet);
}
.sl-price__features li::after {
    content: "✓";
    position: absolute;
    left: 3px;
    top: 3px;
    color: var(--sl-bullet-tick);
    font-size: 9px;
    font-weight: 800;
}
.sl-price__features li b { color: var(--sl-color); font-weight: 700; }
.sl-price__features li.sl-price__more {
    padding-left: 0;
    margin-top: 2px;
    font-weight: 700;
    color: var(--sl-color);
}
.sl-price__features li.sl-price__more::before,
.sl-price__features li.sl-price__more::after { content: none; }

@media (max-width: 1024px) {
    .sl-pricing { grid-template-columns: 1fr; gap: 20px; }
}

/* INCLUDED / NOT INCLUDED */
.sl-incl {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.sl-incl__col {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 32px 32px;
    box-shadow: 0 6px 22px rgba(15, 23, 42, 0.04);
}
.sl-incl__col--in {
    background: linear-gradient(180deg, #ecfdf5 0%, #fff 60%);
    border-color: var(--teal-200);
}
/* На kover.center (education-контент before/after-smart) колонка «входит» синяя, не зелёная. */
body.page-kover-center .sl-incl__col--in { background: linear-gradient(180deg, var(--teal-50) 0%, #fff 60%); }
.sl-incl__head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--line);
    margin-bottom: 22px;
}
.sl-incl__head svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
}
.sl-incl__col--in .sl-incl__head svg { color: var(--teal-600); }
.sl-incl__col--out .sl-incl__head svg { color: var(--ink-3); }
.sl-incl__head h3 {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin: 0;
    color: var(--ink);
}
.sl-incl__col--in h3 { color: var(--teal-700); }
.sl-incl__col--out h3 { color: var(--ink-3); }
.sl-incl ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 16px;
}
.sl-incl li {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.sl-incl li b {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
}
.sl-incl li span {
    font-size: 13.5px;
    color: var(--ink-2);
    line-height: 1.5;
}
.sl-incl li span a {
    color: var(--teal-700);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
    transition: color .15s ease;
}
.sl-incl li span a:hover { color: var(--teal-500); }
.sl-incl__hint {
    margin-top: 22px;
    padding: 14px 16px;
    background: var(--bg-soft);
    border-left: 3px solid var(--teal-400);
    border-radius: 10px;
    font-size: 13.5px;
    color: var(--ink-2);
    line-height: 1.55;
}
.sl-incl__hint a { color: var(--teal-700); font-weight: 700; }
@media (max-width: 820px) { .sl-incl { grid-template-columns: 1fr; } }

/* FIELDS / DIRECTIONS */
.sl-fields {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 20px;
}
.sl-field {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 24px 22px;
    text-decoration: none;
    color: var(--ink);
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .2s ease;
    position: relative;
    overflow: hidden;
}
.sl-field::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--c1), var(--c2));
    transition: height .2s ease;
}
.sl-field:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(15, 23, 42, 0.12);
    border-color: transparent;
}
.sl-field:hover::before { height: 100%; opacity: 0.07; }
.sl-field::after {
    content: "";
    position: absolute;
    top: 14px;
    right: 14px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--bg-soft) center/14px 14px no-repeat
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'><path d='M7 17L17 7M9 7h8v8'/></svg>");
    transition: background .2s ease, transform .25s ease, box-shadow .25s ease;
    z-index: 1;
}
.sl-field:hover::after {
    background-color: #fff;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f766e' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'><path d='M7 17L17 7M9 7h8v8'/></svg>");
    transform: translate(2px, -2px);
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.18);
}
.sl-field__icon {
    font-size: 36px;
    line-height: 1;
    margin-bottom: 6px;
}
.sl-field h3 {
    font-size: 17px;
    margin: 0;
    color: var(--ink);
}
.sl-field p {
    font-size: 13px;
    color: var(--ink-2);
    line-height: 1.45;
    margin: 0;
}
.sl-fields-note {
    margin: 40px auto 0;
    max-width: 880px;
    text-align: center;
    font-size: 15px;
    color: var(--ink-2);
    line-height: 1.6;
    padding: 22px 26px;
    background: var(--bg-soft);
    border-radius: 16px;
    border: 1px dashed var(--line-2);
}
.sl-fields-note strong { color: var(--ink); }
@media (max-width: 1024px) { .sl-fields { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .sl-fields { grid-template-columns: 1fr 1fr; } }

/* FINAL CTA (dark) */
.sl-cta {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(var(--sh3),  0.25), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    color: #fff;
    padding: 80px 0;
}
.sl-cta__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    flex-wrap: wrap;
}
.sl-cta__text { max-width: 640px; }
.sl-cta__text h2 {
    font-size: clamp(28px, 3.6vw, 40px);
    margin: 14px 0 14px;
    color: #fff;
    line-height: 1.15;
}
.sl-cta__text p {
    font-size: 17px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.55;
    margin: 0;
}
.sl-cta .btn--white {
    background: #fff;
    color: var(--teal-700);
    font-size: 16px;
    padding: 18px 32px;
    border-color: #fff;
}
.sl-cta .btn--white:hover {
    background: #f0fdfa;
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.2);
    color: var(--teal-700);
}

/* ============================================
   COMPARISON PAGE (/comparison)
   ============================================ */

/* Сравнение программ: тот же hero-padding что и /universities
   (.page-unis), чтобы расстояние от CTA-кнопки до разделительной
   линии совпадало. */
.page-cmp .uhero { padding-bottom: 50px; }

.cmp-section {
    background: var(--bg-soft);
    padding: var(--section-py) 0;
}
.cmp-section--first { padding-top: 20px; }

/* Tabs */
.cmp-tabs {
    display: inline-flex;
    gap: 6px;
    padding: 6px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    margin: 0 auto 36px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
}
.cmp-section--first > .container > .cmp-tabs {
    display: flex;
    width: max-content;
    margin: 0 auto 40px;
}
.cmp-tab {
    border: none;
    background: transparent;
    color: var(--ink-2);
    font: 700 14.5px/1 'Manrope', sans-serif;
    padding: 12px 22px;
    border-radius: 999px;
    cursor: pointer;
    letter-spacing: 0.01em;
    transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
.cmp-tab:hover { color: var(--ink); }
.cmp-tab.is-active {
    background: linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 100%);
    color: #fff;
    box-shadow: 0 8px 22px rgba(var(--sh2),  0.32);
}

.cmp-panel { display: none; }
.cmp-panel.is-active { display: block; animation: cmpFadeIn .25s ease both; }
@keyframes cmpFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.cmp-intro {
    max-width: 820px;
    margin: 0 auto 36px;
    text-align: center;
    color: var(--ink-2);
    font-size: 16px;
    line-height: 1.6;
}
.cmp-intro b { color: var(--ink); font-weight: 700; }
.cmp-note {
    margin: 28px auto 0;
    max-width: 820px;
    text-align: center;
    font-size: 13px;
    color: var(--ink-3);
}

/* === Comparison tables === */
.cmp-table-wrap {
    overflow-x: auto;
    border-radius: 22px;
    border: 1px solid var(--line);
    background: #fff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}
.cmp-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
    color: var(--ink-2);
    table-layout: fixed;
    min-width: 1040px;
}
.cmp-table thead th {
    text-align: left;
    background: var(--bg-soft);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ink-3);
    padding: 14px 8px;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
    line-height: 1.25;
    vertical-align: middle;
}
.cmp-table thead th small {
    display: block;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: var(--ink-3);
    text-transform: none;
    margin-top: 4px;
}
.cmp-table thead th.cmp-table__col--best {
    color: var(--teal-700);
    background: linear-gradient(135deg, var(--teal-50), #fff);
}
.cmp-table thead th.cmp-table__prog-h { width: 16%; }
.cmp-table thead th:nth-child(2) { width: 20%; } /* Куда поступать */
.cmp-table thead th:nth-child(3),
.cmp-table thead th:nth-child(4),
.cmp-table thead th:nth-child(5) { width: 7%; }  /* Всего / Чешский / Платформа */
.cmp-table thead th:nth-child(6) { width: 12%; } /* Профильные */
.cmp-table thead th:nth-child(7) { width: 8%; }  /* До приезда */
.cmp-table thead th:nth-child(8) { width: 11%; } /* При поступлении */
.cmp-table thead th:nth-child(9) { width: 12%; } /* Цена от */

.cmp-table tbody tr {
    border-bottom: 1px solid var(--line);
    transition: background .2s ease;
}
.cmp-table tbody tr:last-child { border-bottom: none; }
.cmp-table tbody tr:hover { background: var(--bg-soft); }

.cmp-table td,
.cmp-table tbody th {
    padding: 14px 10px;
    vertical-align: middle;
    line-height: 1.45;
}
.cmp-table tbody th { text-align: left; }

/* Program-name first column with a colored left bar */
.cmp-table__prog {
    position: relative;
    padding-left: 18px !important;
    font-weight: 700;
}
.cmp-table__prog::before {
    content: "";
    position: absolute;
    left: 0; top: 14px; bottom: 14px;
    width: 4px;
    border-radius: 0 4px 4px 0;
    background: linear-gradient(180deg, var(--prog-c1, var(--teal-400)), var(--prog-c2, var(--teal-700)));
}
.cmp-table__prog a,
.cmp-table__prog > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--ink);
    text-decoration: none;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
}
.cmp-table__prog a:hover { color: var(--prog-c2, var(--teal-700)); }
.cmp-table__open {
    display: inline-block;
    font-size: 13px;
    opacity: 0.7;
    transition: transform .2s ease, opacity .2s ease;
}
.cmp-table__prog a:hover .cmp-table__open { transform: translateX(3px); opacity: 1; }
.cmp-table__prog small {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: var(--ink-3);
    font-weight: 500;
    line-height: 1.3;
}
.cmp-table__prog small.cmp-table__soon {
    display: inline-block;
    margin-top: 6px;
    padding: 3px 8px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    color: var(--ink-3);
    letter-spacing: 0.02em;
}

/* Per-program color bars */
.cmp-table__row--light      { --prog-c1: #5eead4; --prog-c2: #0f766e; }
.cmp-table__row--standard   { --prog-c1: #c4b5fd; --prog-c2: #6d28d9; }
.cmp-table__row--medical    { --prog-c1: #fda4af; --prog-c2: #be123c; }
.cmp-table__row--tech       { --prog-c1: #93c5fd; --prog-c2: #1d4ed8; }
.cmp-table__row--chem       { --prog-c1: #6ee7b7; --prog-c2: #047857; }
.cmp-table__row--humanities { --prog-c1: #fcd34d; --prog-c2: #b45309; }
.cmp-table__row--econ       { --prog-c1: #a5b4fc; --prog-c2: #4338ca; }

/* Numeric / centered cells */
.cmp-table__num {
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.cmp-table__num b { font-size: 15px; color: var(--ink); font-weight: 800; }
.cmp-table__center { text-align: center; }

/* "Цена от" highlighted column */
.cmp-table__price {
    text-align: center;
    font-variant-numeric: tabular-nums;
    background: linear-gradient(135deg, var(--teal-50), #fff);
}
.cmp-table__price b {
    font-size: 14px;
    font-weight: 800;
    color: var(--teal-700);
    white-space: nowrap;
}
.cmp-table tbody tr:hover .cmp-table__price {
    background: linear-gradient(135deg, var(--teal-100, #ccfbf1), #fff);
}

/* Specialty subjects column on the feature table */
.cmp-table__subj {
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.cmp-table__subj b {
    display: block;
    font-size: 15px;
    color: var(--ink);
    font-weight: 800;
}
.cmp-table__subj small {
    display: block;
    margin-top: 3px;
    font-size: 11.5px;
    color: var(--ink-3);
    font-weight: 600;
    line-height: 1.4;
}

/* Pricing cells */
.cmp-table__pay {
    text-align: center;
    font-variant-numeric: tabular-nums;
    padding: 16px 14px !important;
}
.cmp-table__pay b {
    display: block;
    font-size: 16px;
    color: var(--ink);
    font-weight: 800;
    letter-spacing: -0.01em;
}
.cmp-table__pay small {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    color: var(--ink-3);
    font-weight: 600;
}
.cmp-table__total {
    display: block;
    margin-top: 8px;
    font-size: 11.5px;
    color: var(--ink-3);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.cmp-table__save {
    display: inline-block;
    margin-top: 6px;
    padding: 3px 9px;
    background: var(--teal-50);
    color: var(--teal-700);
    font-size: 11.5px;
    font-weight: 800;
    border-radius: 999px;
    letter-spacing: 0.04em;
}

/* Best-deal column highlight */
.cmp-table__pay--best {
    background:
        radial-gradient(260px 180px at 80% 0%, rgba(var(--sh3),  0.18), transparent 60%),
        linear-gradient(160deg, #0f2e2a 0%, #0a2724 100%);
    color: #fff;
}
.cmp-table__pay--best b { color: #fff; }
.cmp-table__pay--best small { color: rgba(255, 255, 255, 0.7); }
.cmp-table__pay--best .cmp-table__total { color: rgba(255, 255, 255, 0.7); }
.cmp-table__pay--best .cmp-table__save {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}
.cmp-table tbody tr:hover .cmp-table__pay--best { background:
    radial-gradient(260px 180px at 80% 0%, rgba(var(--sh3),  0.28), transparent 60%),
    linear-gradient(160deg, #103934 0%, #0c2e2b 100%);
}

/* ✓ / — pill tokens for table cells */
.cmp-ok, .cmp-na {
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-weight: 800;
    font-size: 13px;
}
.cmp-ok {
    background: linear-gradient(135deg, var(--teal-400), var(--teal-600));
    color: #fff;
}
.cmp-na {
    background: var(--bg-soft);
    color: var(--ink-3);
    border: 1px solid var(--line);
}

@media (max-width: 480px) {
    .cmp-tab { padding: 10px 16px; font-size: 13.5px; }
    .cmp-table { font-size: 13.5px; }
    .cmp-table thead th,
    .cmp-table td,
    .cmp-table tbody th { padding: 14px 12px; }
}

/* ============================================
   MOBILE NAV — burger + slide-in drawer
   ============================================ */
.header__burger {
    display: none;
    width: 42px;
    height: 42px;
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 12px;
    cursor: pointer;
    padding: 0;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    flex-shrink: 0;
    transition: background .2s ease, border-color .2s ease;
}
.header__burger:hover { background: var(--bg-soft); border-color: var(--teal-300); }
.header__burger span {
    display: block;
    width: 20px;
    height: 2px;
    background: var(--ink);
    border-radius: 2px;
    transition: transform .25s ease, opacity .2s ease;
}
body.is-menu-open .header__burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.is-menu-open .header__burger span:nth-child(2) { opacity: 0; }
body.is-menu-open .header__burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.nav-drawer {
    position: fixed;
    inset: 0;
    z-index: 999;
    visibility: hidden;
    pointer-events: none;
}
body.is-menu-open .nav-drawer { visibility: visible; pointer-events: auto; }

.nav-drawer__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(var(--sh-dark),  0.55);
    opacity: 0;
    transition: opacity .25s ease;
}
body.is-menu-open .nav-drawer__backdrop { opacity: 1; }

.nav-drawer__panel {
    position: absolute;
    top: 0; right: 0; bottom: 0;
    width: min(360px, 86vw);
    background: #fff;
    box-shadow: -16px 0 40px rgba(15, 23, 42, 0.18);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .3s cubic-bezier(.2,.7,.2,1);
    overflow-y: auto;
    overscroll-behavior: contain; /* прокрутка меню не «цепляет» страницу под ним */
}
body.is-menu-open .nav-drawer__panel { transform: translateX(0); }

.nav-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px;
    border-bottom: 1px solid var(--line);
}
.nav-drawer__close {
    width: 40px;
    height: 40px;
    border: none;
    background: transparent;
    border-radius: 10px;
    cursor: pointer;
    color: var(--ink-2);
    font-size: 28px;
    line-height: 1;
    display: grid;
    place-items: center;
}
.nav-drawer__close:hover { background: var(--bg-soft); color: var(--ink); }

.nav-drawer__nav {
    display: flex;
    flex-direction: column;
    padding: 12px 0;
    flex-grow: 1;
}
.nav-drawer__nav > a,
.nav-drawer__group > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 22px;
    font-size: 16.5px;
    font-weight: 600;
    color: var(--ink);
    text-decoration: none;
    cursor: pointer;
    list-style: none;
    transition: background .15s ease, color .15s ease;
}
.nav-drawer__nav > a:hover,
.nav-drawer__group > summary:hover,
.nav-drawer__nav > a.is-active { background: var(--bg-soft); color: var(--teal-700); }
.nav-drawer__group > summary::-webkit-details-marker { display: none; }
.nav-drawer__group > summary::after {
    content: "";
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    margin-left: 12px;
    transition: transform .2s ease;
    opacity: 0.6;
}
.nav-drawer__group[open] > summary::after { transform: rotate(-135deg); }
.nav-drawer__sub {
    display: flex;
    flex-direction: column;
    padding: 4px 0 10px;
    background: var(--bg-soft);
}
.nav-drawer__sub a {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px 22px 12px 38px;
    text-decoration: none;
    color: var(--ink);
    font-weight: 600;
    font-size: 14.5px;
    line-height: 1.3;
}
.nav-drawer__sub a small {
    font-size: 12px;
    font-weight: 500;
    color: var(--ink-3);
}
.nav-drawer__sub a:hover { background: rgba(var(--sh1),  0.08); color: var(--teal-700); }
.nav-drawer__sub a:hover small { color: var(--teal-700); opacity: 0.85; }
/* Активный пункт мобильного меню — акцентный цвет темы (на center синий, не зелёный). */
.nav-drawer__sub a.is-active { color: var(--teal-700); }

.nav-drawer__cta {
    padding: 18px 22px 24px;
    border-top: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.nav-drawer__cta .btn { width: 100%; }

@media (max-width: 1024px) {
    .header__burger { display: inline-flex; }
    /* На мобиле хедер НЕПРОЗРАЧНЫЙ: контент не «просвечивает» сквозь меню при прокрутке
       (frosted-эффект на десктопе ок, но на телефоне выглядит грязно). padding-top +
       ::before закрывают безопасную зону под статус-баром iOS, если включён viewport-fit=cover. */
    .header {
        background: #fff;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        padding-top: env(safe-area-inset-top, 0px);
    }
    .header::before {
        content: "";
        position: absolute;
        left: 0; right: 0; bottom: 100%;
        height: env(safe-area-inset-top, 0px);
        background: #fff;
    }
}
body.is-menu-open { overflow: hidden; }

/* ============================================
   SMART LIGHT — extra v2 elements
   ============================================ */

/* Reviews — same bg-soft canvas as other sl-sections */
.reviews.sl-section { background: var(--bg-soft); }

/* Pricing — subtle footnote under the cards */
.sl-deadline-note {
    margin: 24px auto 0;
    max-width: 760px;
    text-align: center;
    font-size: 13.5px;
    color: var(--ink-3);
    line-height: 1.55;
}
.sl-deadline-note b { color: var(--ink); font-weight: 700; }
.sl-deadline-note__icon {
    display: inline-block;
    margin-right: 6px;
    font-size: 14px;
    vertical-align: -1px;
    opacity: 0.7;
}

/* "Скачать каталог" CTA under .sl-fields */
.sl-catalog-cta {
    margin-top: 36px;
    text-align: center;
}
.sl-catalog-cta .btn { display: inline-flex; align-items: center; }
.sl-catalog-cta__hint {
    margin: 12px auto 0;
    max-width: 560px;
    font-size: 13.5px;
    color: var(--ink-3);
    line-height: 1.5;
}
@media (max-width: 540px) {
    .sl-catalog-cta .btn {
        width: 100%;
        padding: 14px 16px;
        font-size: 14.5px;
        line-height: 1.3;
        white-space: normal;
        text-align: left;
        justify-content: center;
    }
    .sl-catalog-cta .btn svg { flex-shrink: 0; margin-right: 8px !important; }
}

/* Modal form variant — icon + tighter form */
.modal__dialog--form {
    padding: 36px 32px 32px;
    max-width: 420px;
    text-align: center;
}
.modal__dialog--form h3 { margin: 4px 0 10px; font-size: 22px; }
.modal__dialog--form p {
    margin: 0 0 22px;
    font-size: 14.5px;
    color: var(--ink-2);
    line-height: 1.5;
}
.modal__icon {
    display: inline-grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal-400), var(--teal-700));
    color: #fff;
    margin: 0 auto 6px;
    box-shadow: 0 8px 18px rgba(var(--sh1),  0.32);
}
/* minmax(0,1fr): колонка не раздувается по min-content виджета даты/времени —
   иначе на мобильных поле «Удобное время» вылезало за плашку модалки. */
.modal__dialog--form .form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; text-align: left; }
.modal__dialog--form .form__hint { text-align: center; margin: 6px 0 0; }
body.is-modal-open { overflow: hidden; }
/* overflow:hidden на <body> НЕ запирает вьюпорт (прокруткой управляет корневой
   <html>), поэтому при открытом попапе/меню фон всё равно прокручивался на мобильных.
   Запираем именно <html>. :has(.modal.is-open) покрывает обе модальные системы
   (.modal/[data-modal] и [data-open-modal]); :has(body.is-menu-open) — бургер-меню. */
html:has(.modal.is-open),
html:has(body.is-menu-open) { overflow: hidden; }

/* ==== Pricing-card "Записаться" button — единый стиль .btn--primary сайта ==== */
.sl-price__btn {
    margin-top: auto;
    background: var(--brand);
    color: #fff;
    border: 1.5px solid var(--brand);
    font-weight: 700;
    padding: 13px 18px;
    box-shadow: 0 14px 30px rgba(var(--sh1),  0.34);
    transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.sl-price__btn:hover {
    transform: translateY(-2px);
    background: var(--brand-dark);
    border-color: var(--brand-dark);
    box-shadow: 0 18px 36px rgba(var(--sh1),  0.42);
}
/* When card is on its dark teal state (default-featured or hovered),
   the btn flips: white background, teal text */
.sl-pricing:not(:has(.sl-price:hover)) .sl-price--best .sl-price__btn,
.sl-price:hover .sl-price__btn {
    background: #fff;
    color: var(--teal-700);
    border-color: #fff;
}
.sl-pricing:not(:has(.sl-price:hover)) .sl-price--best .sl-price__btn:hover,
.sl-price:hover .sl-price__btn:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.65);
}

/* ==== Enroll modal — official registration form ==== */
.modal__dialog--enroll {
    max-width: 620px;
    max-height: calc(100vh - 80px);
    padding: 0;
    text-align: left;
    overflow-y: auto;
    overflow-x: hidden;
}
/* На мобильных уменьшаем верхний/нижний отступ модалки, чтобы форма
   помещалась по высоте; .modal align-items: flex-start уже выставлен. */
@media (max-width: 640px) {
    .modal__dialog--enroll {
        max-height: calc(100vh - 40px);
        max-width: 100%;
    }
}
.modal__dialog--enroll .modal__close {
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink);
}
.modal__dialog--enroll .modal__close:hover {
    background: #fff;
    color: var(--teal-700);
}
.enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(var(--sh3),  0.32), transparent 60%),
        linear-gradient(160deg, var(--teal-700) 0%, #0a2724 100%);
    color: #fff;
    padding: 30px 36px 26px;
}
.enroll__kicker {
    display: inline-block;
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 999px;
    margin-bottom: 14px;
}
.enroll__head h3 {
    font-size: 24px;
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    margin: 0 0 10px;
    letter-spacing: -0.01em;
}
.enroll__head p {
    margin: 0;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.5;
}
.enroll-form {
    padding: 26px 36px 30px;
    display: grid;
    gap: 18px;
}
.enroll-form__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
}
.enroll-form__full { grid-column: 1 / -1; }
.enroll-form__latin { grid-column: 1 / -1; margin: -6px 0 0; font-size: 12.5px; line-height: 1.4; color: var(--ink-3); }
.enroll-form .form__hint { text-align: center; margin: 0; }
@media (max-width: 540px) {
    .enroll__head { padding: 24px 22px 22px; }
    .enroll__head h3 { font-size: 20px; }
    .enroll-form { padding: 22px 22px 26px; }
    .enroll-form__grid { grid-template-columns: 1fr; }
}

/* Pricing — strike-through "regular" price next to the discounted total */
.sl-price__total:has(.sl-price__old) {
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 4px 10px;
}
.sl-price__total .sl-price__old {
    color: var(--sl-meta);
    font-size: 14px;
    font-weight: 600;
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
    margin-left: auto;
}

/* FAQ accordion */
.sl-faq {
    display: grid;
    gap: 12px;
}
.sl-faq__item {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 4px 4px 4px 4px;
    transition: border-color .2s ease, box-shadow .25s ease;
}
.sl-faq__item[open] {
    border-color: var(--teal-300);
    box-shadow: 0 10px 28px rgba(var(--sh1),  0.12);
}
.sl-faq__item summary {
    list-style: none;
    cursor: pointer;
    padding: 18px 22px;
    font-size: 16px;
    font-weight: 700;
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    line-height: 1.35;
}
.sl-faq__item summary::-webkit-details-marker { display: none; }
.sl-faq__item summary::after {
    content: "";
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--bg-soft) center/12px 12px no-repeat
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f766e' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
    transition: transform .25s ease, background-color .2s ease;
    flex-shrink: 0;
}
.sl-faq__item[open] summary::after {
    transform: rotate(180deg);
    background-color: var(--teal-50);
}
.sl-faq__body {
    padding: 0 22px 20px;
    color: var(--ink-2);
    font-size: 15px;
    line-height: 1.6;
}
.sl-faq__body p { margin: 0; }
.sl-faq__body a {
    color: var(--teal-700);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
}

/* Form — single-row variant: 4 inputs + send button on one line */
.form--wide .form__grid--row {
    grid-template-columns: 1fr 1fr 1fr 1fr auto;
    align-items: end;
}
.form--wide .form__grid--row .btn {
    grid-column: auto;
    height: 51px;
    padding: 14px 22px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
@media (max-width: 1100px) {
    .form--wide .form__grid--row { grid-template-columns: 1fr 1fr; }
    .form--wide .form__grid--row .btn { grid-column: 1 / -1; width: 100%; justify-content: center; }
}
@media (max-width: 720px) {
    /* Drop the text from the send button when room is tight — keep just the arrow */
    .form--wide .form__grid--row .btn { padding: 14px 18px; }
}
@media (max-width: 540px) {
    .form--wide .form__grid--row { grid-template-columns: 1fr; }
}

/* Sticky bottom CTA bar */
.sl-sticky {
    position: fixed;
    left: 16px;
    right: 100px; /* leave room on the right for the AI chat widget (60px button + 24px gutter + 16px breathing room) */
    bottom: 16px;
    z-index: 90;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px 14px 22px;
    background: linear-gradient(160deg, var(--teal-800, #0f2e2a) 0%, #0a2724 100%);
    color: #fff;
    border-radius: 16px;
    box-shadow: 0 18px 40px rgba(var(--sh-dark),  0.35);
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
    transition: opacity .3s ease, transform .3s ease;
}
/* Нижняя «липкая» CTA-плашка отключена на всех сайтах (по запросу).
   Оставляем только куки-баннер + плавающие иконки ИИ-ассистента и Telegram. */
.sl-sticky { display: none !important; }
.sl-sticky.is-visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.sl-sticky__info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.2;
    min-width: 0;
}
.sl-sticky__info strong {
    font-size: 15.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.01em;
}
.sl-sticky__info span {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.78);
}
.sl-sticky__info b {
    color: var(--teal-300);
    font-weight: 800;
}
.sl-sticky__usp {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    margin: 0;
    padding: 0 16px;
    list-style: none;
    min-width: 0;
}
.sl-sticky__usp li {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.88);
    position: relative;
    padding-left: 18px;
    line-height: 1.2;
    white-space: nowrap;
}
.sl-sticky__usp li::before {
    content: "✓";
    position: absolute;
    left: 0; top: 0;
    color: var(--teal-300);
    font-weight: 800;
}
@media (max-width: 960px) {
    .sl-sticky__usp { display: none; }
}
/* Sticky CTA: always white pill with the current page's dark accent text,
   regardless of body[data-program] .btn--primary overrides */
.sl-sticky .sl-sticky__cta,
.sl-sticky .sl-sticky__cta.btn--primary {
    background: #fff;
    color: var(--teal-700);
    padding: 12px 22px;
    font-size: 14.5px;
    flex-shrink: 0;
    box-shadow: 0 4px 14px rgba(var(--sh-dark),  0.25);
}
.sl-sticky .sl-sticky__cta:hover,
.sl-sticky .sl-sticky__cta.btn--primary:hover {
    background: var(--teal-50);
    color: var(--teal-800);
    box-shadow: 0 8px 22px rgba(var(--sh-dark),  0.35);
}
@media (max-width: 540px) {
    .sl-sticky { left: 8px; right: 82px; bottom: 8px; padding: 12px 14px 12px 16px; }
    .sl-sticky__info strong { font-size: 14.5px; }
    .sl-sticky__info span { font-size: 12px; }
    .sl-sticky__cta { padding: 10px 16px; font-size: 13.5px; }
}


/* ============================================
   SMART STANDARD — violet accent + extra blocks
   ============================================ */

/* Smart Standard — remap the entire teal ramp to violet so every accent
   (buttons, badges, list bullets, hover states, dark feature cards, etc.)
   picks up the program tier color without touching the brand variables. */
body[data-program="standard"] {
    --teal-50:  #f5f3ff;
    --teal-100: #ede9fe;
    --teal-200: #ddd6fe;
    --teal-300: #c4b5fd;
    --teal-400: #a78bfa;
    --teal-500: #8b5cf6;
    --teal-600: #7c3aed;
    --teal-700: #6d28d9;
    --teal-800: #5b21b6;
    /* Re-pin the brand aliases too in case any rule uses var(--brand) in a
       way that doesn't re-resolve through the teal chain */
    --brand:      #8b5cf6;
    --brand-dark: #7c3aed;
    --brand-soft: #f5f3ff;
    --brand-ring: rgba(124, 58, 237, 0.18);
    /* Background tints that bled teal — neutralise into faint violet */
    --bg-soft: #faf9ff;
    --bg-mint: #f5f3ff;
    /* Border/divider tints (default --line is mint-grey #e6efed) — repaint
       to a neutral violet-grey so card outlines and the .btn--ghost border
       don't read teal */
    --line:   #e7e4ef;
    --line-2: #d6d2e3;
}
/* Force the violet on hot interactive surfaces (buttons + lang chips) */
body[data-program="standard"] .btn--primary {
    background: #8b5cf6;
    box-shadow: 0 14px 30px rgba(124, 58, 237, 0.34);
}
body[data-program="standard"] .btn--primary:hover {
    background: #7c3aed;
    box-shadow: 0 18px 36px rgba(124, 58, 237, 0.42);
}
body[data-program="standard"] .btn--outline {
    color: #6d28d9;
    border-color: #c4b5fd;
}
body[data-program="standard"] .btn--outline:hover {
    background: #8b5cf6;
    border-color: #8b5cf6;
    color: #fff;
}
body[data-program="standard"] .btn--secondary:hover {
    border-color: #8b5cf6;
    color: #6d28d9;
}
body[data-program="standard"] .btn--white {
    color: #6d28d9;
}
body[data-program="standard"] .lang__btn.is-active {
    background: #7c3aed;
    color: #fff;
    box-shadow: 0 2px 6px rgba(124, 58, 237, 0.35);
}
body[data-program="standard"] .header__burger:hover {
    border-color: #c4b5fd;
}
/* Mobile drawer accents inherit through vars; explicit fall-back: */
body[data-program="standard"] .nav-drawer__nav > a:hover,
body[data-program="standard"] .nav-drawer__group > summary:hover,
body[data-program="standard"] .nav-drawer__nav > a.is-active {
    color: #6d28d9;
}
body[data-program="standard"] .nav-drawer__sub a:hover {
    background: rgba(139, 92, 246, 0.08);
    color: #6d28d9;
}
/* Form input focus ring */
body[data-program="standard"] .form input:focus,
body[data-program="standard"] .form select:focus,
body[data-program="standard"] .form textarea:focus {
    border-color: #8b5cf6;
    box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.18);
}
/* Hero h1 .accent and section h2 .accent use hard-coded teal hex codes,
   override them with the matching violet gradient on this page. */
body[data-program="standard"] .hero h1 .accent,
body[data-program="standard"] .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #c4b5fd 0%, #a78bfa 60%, #6d28d9 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="standard"] .sl-price__ribbon {
    background: linear-gradient(135deg, #6d28d9 0%, #4c1d95 100%);
}
/* Hero, consult form card, primary buttons and floating widget all use
   hard-coded rgba(var(--sh1),  …) / rgba(var(--sh3),  …) — repaint
   them violet on the Standard page. */
body[data-program="standard"] .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(167, 139, 250, 0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(196, 181, 253, 0.18), transparent 60%),
        linear-gradient(160deg, #1e1235 0%, #2a1758 50%, #1a0e30 100%);
}
body[data-program="standard"] .hero h1 .accent,
body[data-program="standard"] .hero__stat-value {
    background: linear-gradient(135deg, #c4b5fd, #8b5cf6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="standard"] .hero__stat-icon { background: rgba(196, 181, 253, 0.18); }
body[data-program="standard"] .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(196, 181, 253, 0.25), transparent 60%),
        linear-gradient(135deg, #6d28d9 0%, #8b5cf6 100%);
    box-shadow: 0 28px 60px rgba(124, 58, 237, 0.32);
}
body[data-program="standard"] .consult .form--card .btn--primary { color: #6d28d9; }
body[data-program="standard"] .consult .form--card .btn--primary:hover { color: #5b21b6; }
body[data-program="standard"] .btn--primary {
    box-shadow: 0 14px 30px rgba(124, 58, 237, 0.34);
}
body[data-program="standard"] .btn--primary:hover {
    box-shadow: 0 18px 36px rgba(124, 58, 237, 0.42);
}
body[data-program="standard"] .logo__mark { box-shadow: 0 6px 16px rgba(124, 58, 237, 0.4); }
body[data-program="standard"] .lang__btn.is-active { box-shadow: 0 2px 6px rgba(124, 58, 237, 0.35); }
body[data-program="standard"] .visa-route--full .visa-route__num { box-shadow: 0 6px 16px rgba(124, 58, 237, 0.3); }
body[data-program="standard"] .visa-route--full .visa-route__item:hover { box-shadow: 0 14px 32px rgba(124, 58, 237, 0.14); }
body[data-program="standard"] .visa-route--full .visa-route__item:hover .visa-route__num { box-shadow: 0 10px 24px rgba(124, 58, 237, 0.35), 0 0 0 2px var(--teal-300); }
body[data-program="standard"] .cwidget__toggle { box-shadow: 0 14px 32px rgba(124, 58, 237, 0.45); }
body[data-program="standard"] .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(124, 58, 237, 0.55); }
body[data-program="standard"] .footer::before {
    background: radial-gradient(circle, rgba(124, 58, 237, 0.20), transparent 60%);
}
/* Pricing card violet shadow (was hard-coded teal rgba) */
body[data-program="standard"] .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body[data-program="standard"] .sl-price:hover {
    --sl-shadow: 0 22px 50px rgba(124, 58, 237, 0.32);
}
/* Phase 2 divider — keep it violet too on Standard (was hard-coded teal) */
body[data-program="standard"] .sl-phase--alt {
    background: linear-gradient(135deg, rgba(196, 181, 253, 0.18), rgba(124, 58, 237, 0.05));
    border-left-color: #7c3aed;
}
body[data-program="standard"] .sl-phase--alt .sl-phase__num {
    color: #7c3aed;
    box-shadow: 0 4px 10px rgba(124, 58, 237, 0.22);
}
/* "Что входит" green-tinted card → violet tint */
body[data-program="standard"] .sl-incl__col--in {
    background: linear-gradient(180deg, #f5f3ff 0%, #fff 60%);
}
/* Reviews photo placeholder (gradients are per-card via inline styles — leave as is) */
/* sl-vs plate already uses violet inline */
/* Form-card teal nav: kept above */
/* Hero stat front face teal tints */
body[data-program="standard"] .hero__stat-face--front:hover,
body[data-program="standard"] .hero__stat:hover .hero__stat-face--front {
    background: rgba(196, 181, 253, 0.10);
}
/* Buttons-secondary (.btn--secondary uses rgba(255,255,255,...) — already neutral) */
/* Visa-route checkmark bullets: .visa-route__list li::before — uses var ✓ */
/* sl-feature card-3 "Сопровождение поступления" uses inline teal gradient — picks up violet from var override ✓ */
/* sl-fields card "Технические" uses --teal-500/700 inline — also becomes violet ✓ */
/* Hero h1 cursor-blink and other minor accents auto via vars */
body[data-program="standard"] .modal__icon { box-shadow: 0 8px 18px rgba(124, 58, 237, 0.32); }
body[data-program="standard"] .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(196, 181, 253, 0.32), transparent 60%),
        linear-gradient(160deg, #6d28d9 0%, #1e1235 100%);
}
/* The teal bullet in feature list (.sl-feature__icon hard-coded teal in HTML)
   inside Sopровождение поступления → recolor to violet via direct style
   would need HTML edit; left teal in feature-cards since only 1 of 6 used it.
   The card-page-only .plan__row::before circles and the .sl-price__features
   bullets all use var(--teal-…), so already violet through the var remap. */

/* ===================================================================
   kover.center — синяя тема (заменяет бирюзовую на всех страницах сайта).
   Подключается классом .page-kover-center на <body>. Перепинываем teal-шкалу
   и бренд-алиасы на синий + перекрываем места с хард-кодом бирюзового
   (hero-градиент, кнопки, lang-чип, фокус формы, accent-градиенты заголовков,
   карточка consult, свечение футера, тоггл чат-виджета).
   =================================================================== */
body.page-kover-center {
    --teal-50:  #eff6ff;
    --teal-100: #dbeafe;
    --teal-200: #bfdbfe;
    --teal-300: #93c5fd;
    --teal-400: #60a5fa;
    --teal-500: #3b82f6;
    --teal-600: #2563eb;
    --teal-700: #1d4ed8;
    --teal-800: #1e40af;
    --brand:      #3b82f6;
    --brand-dark: #2563eb;
    --brand-soft: #eff6ff;
    --brand-ring: rgba(37, 99, 235, 0.18);
    --bg-soft: #f6f9ff;
    --bg-mint: #eff6ff;
    --line:   #e3e9f4;
    --line-2: #d2dcef;
    /* была teal-зелёная тень — на синюю */
    --shadow-lg: 0 30px 60px rgba(37, 99, 235, 0.22);
    --sh1: 37, 99, 235;    /* blue-600 — синие тени вместо зелёных */
    --sh2: 37, 99, 235;
    --sh3: 147, 197, 253;  /* blue-300 */
    --sh-dark: 15, 23, 42;   /* slate-900 — нейтральная тёмная тень */
    /* ВАЖНО: на kover.center всё синее. Базовые --ink/-2/-3 в education
       зелёно-серые (#0b1f1d/#4b5b59/#8a9694) — на center заголовки и тексты
       из-за этого «зеленят». Переопределяем шкалу на нейтрально-синий slate. */
    --ink:   #0f172a;
    --ink-2: #475569;
    --ink-3: #64748b;
}

/* ===== Avanta clinic — синяя тема (как kover.center, отдельный бренд) ===== */
body.page-avanta {
    --teal-50:  #eff6ff;
    --teal-100: #dbeafe;
    --teal-200: #bfdbfe;
    --teal-300: #93c5fd;
    --teal-400: #60a5fa;
    --teal-500: #3b82f6;
    --teal-600: #2563eb;
    --teal-700: #1d4ed8;
    --teal-800: #1e40af;
    --brand:      #3b82f6;
    --brand-dark: #2563eb;
    --brand-soft: #eff6ff;
    --brand-ring: rgba(37, 99, 235, 0.18);
    --bg-soft: #f6f9ff;
    --bg-mint: #eff6ff;
    --line:   #e3e9f4;
    --line-2: #d2dcef;
    --shadow-lg: 0 30px 60px rgba(37, 99, 235, 0.22);
    --sh1: 37, 99, 235;      /* blue-600 — синие тени */
    --sh2: 37, 99, 235;
    --sh3: 147, 197, 253;    /* blue-300 */
    --sh-dark: 15, 23, 42;   /* нейтральная тёмная тень */
    /* нейтрально-синяя slate-шкала текста */
    --ink:   #0f172a;
    --ink-2: #475569;
    --ink-3: #64748b;
}
body.page-avanta .btn--primary {
    background: #3b82f6;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.34);
}
body.page-avanta .btn--primary:hover {
    background: #2563eb;
    box-shadow: 0 18px 36px rgba(37, 99, 235, 0.42);
}
body.page-avanta .btn--outline {
    color: #1d4ed8;
    border-color: #93c5fd;
}
body.page-avanta .btn--outline:hover {
    background: #3b82f6;
    border-color: #3b82f6;
    color: #fff;
}
body.page-avanta .btn--ghost:hover { background: #0b1530; border-color: #0b1530; }
body.page-avanta .lang__btn.is-active {
    background: #2563eb;
    color: #fff;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.35);
}
body.page-avanta .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(96, 165, 250, 0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(147, 197, 253, 0.18), transparent 60%),
        linear-gradient(160deg, #0b1230 0%, #122a5a 50%, #0a1838 100%);
}
body.page-avanta .hero h1 .accent,
body.page-avanta .hero__stat-value,
body.page-avanta .section-head h2 .accent,
body.page-avanta .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #93c5fd 0%, #60a5fa 60%, #1d4ed8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body.page-avanta .footer { background: #0b1530; }   /* тёмно-синий */
body.page-avanta .footer::before {
    background: radial-gradient(circle, rgba(37, 99, 235, 0.20), transparent 60%);
}

/* ===== Avanta «Приём» — компоненты в стиле insurance ===== */
/* Сетка icon-карточек услуг — 2 колонки (симптомы используют .ins-who = 3 кол) */
.ins-who--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 860px) { .ins-who--2 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .ins-who--2 { grid-template-columns: 1fr; } }
/* Список симптомов/пунктов внутри попапа услуги */
.upop__list { list-style: none; margin: 14px 0; padding: 0; display: grid; gap: 9px; }
.upop__list li { position: relative; padding-left: 24px; font-size: 15.5px; line-height: 1.5; color: var(--ink-2); }
.upop__list li::before { content: ''; position: absolute; left: 3px; top: 8px; width: 7px; height: 7px; border-radius: 50%; background: var(--brand); }
.upop__list li b { color: var(--ink); font-weight: 700; }
.upop__dur { display: inline-block; margin-top: 16px; font-size: 13px; font-weight: 700; color: var(--brand); background: var(--teal-50); border-radius: 999px; padding: 6px 15px; }

/* Карточки-тарифы цен (2–3 карточки со списком «услуга — цена») */
.price-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 900px; margin: 28px auto 0; align-items: start; }
@media (max-width: 760px) { .price-cards { grid-template-columns: 1fr; } }
.price-card { background: #fff; border: 1px solid var(--line); border-radius: 22px; padding: 28px 28px 24px; transition: box-shadow .25s ease, border-color .25s ease, transform .25s ease; }
.price-card:hover { box-shadow: 0 16px 34px rgba(var(--sh-dark), 0.09); border-color: transparent; transform: translateY(-3px); }
.price-card__h { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.price-card__ico { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; background: linear-gradient(135deg, var(--teal-400), var(--teal-700)); color: #fff; }
.price-card__h h3 { font-size: 20px; font-weight: 800; color: var(--ink); margin: 0; }
.price-card__row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 14px 0; border-top: 1px solid var(--line); font-size: 15.5px; }
.price-card__row span { color: var(--ink-2); }
.price-card__row b { color: var(--ink); font-weight: 800; white-space: nowrap; }

body.page-kover-center .btn--primary {
    background: #3b82f6;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.34);
}
body.page-kover-center .btn--primary:hover {
    background: #2563eb;
    box-shadow: 0 18px 36px rgba(37, 99, 235, 0.42);
}
body.page-kover-center .btn--outline {
    color: #1d4ed8;
    border-color: #93c5fd;
}
body.page-kover-center .btn--outline:hover {
    background: #3b82f6;
    border-color: #3b82f6;
    color: #fff;
}
body.page-kover-center .btn--secondary:hover {
    border-color: #3b82f6;
    color: #1d4ed8;
}
body.page-kover-center .btn--white { color: #1d4ed8; }
/* «Заказать звонок» (btn--ghost) при наведении — был тёмно-зелёный (--ink), делаем тёмно-синим */
body.page-kover-center .btn--ghost:hover { background: #0b1530; border-color: #0b1530; }
body.page-kover-center .lang__btn.is-active {
    background: #2563eb;
    color: #fff;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.35);
}
body.page-kover-center .header__burger:hover { border-color: #93c5fd; }
body.page-kover-center .nav-drawer__nav > a:hover,
body.page-kover-center .nav-drawer__group > summary:hover,
body.page-kover-center .nav-drawer__nav > a.is-active { color: #1d4ed8; }
body.page-kover-center .nav-drawer__sub a:hover {
    background: rgba(59, 130, 246, 0.08);
    color: #1d4ed8;
}
body.page-kover-center .form input:focus,
body.page-kover-center .form select:focus,
body.page-kover-center .form textarea:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.18);
}
/* Глобальный --ink остаётся тёмно-бирюзовым; на синем сайте текст в полях
   (особенно значение input[type=date]) читался зеленоватым — перекрашиваем
   в тёмно-синий, чтобы совпадал с темой. */
body.page-kover-center .form input,
body.page-kover-center .form select,
body.page-kover-center .form textarea {
    color: #0b1530;
}
body.page-kover-center .form input::-webkit-datetime-edit { color: #0b1530; }
body.page-kover-center .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(96, 165, 250, 0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(147, 197, 253, 0.18), transparent 60%),
        linear-gradient(160deg, #0b1230 0%, #122a5a 50%, #0a1838 100%);
}
body.page-kover-center .hero h1 .accent,
body.page-kover-center .sl-section .section-head h2 .accent,
body.page-kover-center .hero__stat-value {
    background: linear-gradient(135deg, #93c5fd 0%, #60a5fa 60%, #1d4ed8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body.page-kover-center .hero__stat-icon { background: rgba(147, 197, 253, 0.18); }
/* Силуэт Праги — был teal-зелёный, делаем синим */
body.page-kover-center .hero__silhouette--back { color: rgba(147, 197, 253, 0.10); }
body.page-kover-center .hero__silhouette--front { color: rgba(37, 99, 235, 0.20); }
/* Блог: .blog-grid сам по себе не grid (display задаётся каталогом на других сайтах) */
body.page-kover-center .blog-grid { display: grid; gap: 24px; }
body.page-kover-center .hero__stat-face--front:hover,
body.page-kover-center .hero__stat:hover .hero__stat-face--front {
    background: rgba(147, 197, 253, 0.10);
}
body.page-kover-center .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(147, 197, 253, 0.25), transparent 60%),
        linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
    box-shadow: 0 28px 60px rgba(37, 99, 235, 0.32);
}
body.page-kover-center .consult .form--card .btn--primary { color: #1d4ed8; }
body.page-kover-center .consult .form--card .btn--primary:hover { color: #1e40af; }
body.page-kover-center .logo__mark { box-shadow: 0 6px 16px rgba(37, 99, 235, 0.4); }
body.page-kover-center .footer {
    background: #0b1530;   /* был тёмно-зелёный #0b1f1d → тёмно-синий */
}
body.page-kover-center .footer::before {
    background: radial-gradient(circle, rgba(37, 99, 235, 0.20), transparent 60%);
}
/* Кнопка «Заказать звонок» в футере — была teal-зелёная */
body.page-kover-center .footer__contact--callback {
    background: rgba(37, 99, 235, 0.14);
    border-color: rgba(37, 99, 235, 0.30);
}
body.page-kover-center .footer__contact--callback:hover {
    background: rgba(37, 99, 235, 0.24);
}
body.page-kover-center .cwidget__toggle { box-shadow: 0 14px 32px rgba(37, 99, 235, 0.45); }
body.page-kover-center .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(37, 99, 235, 0.55); }
body.page-kover-center .modal__icon { box-shadow: 0 8px 18px rgba(37, 99, 235, 0.32); }
/* Шапка поп-апа оформления (enroll-стиль) — синяя вместо teal-зелёной */
body.page-kover-center .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(147, 197, 253, 0.32), transparent 60%),
        linear-gradient(160deg, #1d4ed8 0%, #0b1530 100%);
}

/* Phase divider — between two timeline OLs */
.sl-phase {
    display: flex;
    align-items: baseline;
    gap: 14px;
    flex-wrap: wrap;
    padding: 14px 18px;
    background: linear-gradient(135deg, rgba(196, 181, 253, 0.14), rgba(167, 139, 250, 0.05));
    border-left: 4px solid #7c3aed;
    border-radius: 12px;
    margin: 24px 0 22px;
}
.sl-phase--alt {
    background: linear-gradient(135deg, rgba(var(--sh3),  0.15), rgba(var(--sh1),  0.06));
    border-left-color: var(--teal-600);
    margin-top: 36px;
}
.sl-phase__num {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #7c3aed;
    padding: 4px 10px;
    background: #fff;
    border-radius: 999px;
    box-shadow: 0 4px 10px rgba(124, 58, 237, 0.18);
}
.sl-phase--alt .sl-phase__num {
    color: var(--teal-700);
    box-shadow: 0 4px 10px rgba(var(--sh1),  0.22);
}
.sl-phase__title {
    margin: 0;
    font-size: 19px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.01em;
    line-height: 1.2;
}
.sl-phase__date {
    margin-left: auto;
    font-size: 13px;
    font-weight: 700;
    color: var(--ink-3);
    letter-spacing: 0.04em;
}
@media (max-width: 540px) {
    .sl-phase { padding: 12px 14px; }
    .sl-phase__title { font-size: 17px; }
    .sl-phase__date { margin-left: 0; flex-basis: 100%; }
}

/* "Чем отличается от Smart Light" — 4 cards in a 12-col row + delta callout */
.sl-vs-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    margin-bottom: 32px;
}
.sl-vs-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 28px 26px 26px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .2s ease;
    position: relative;
    overflow: hidden;
}
.sl-vs-card::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, #c4b5fd, #6d28d9);
    transition: height .25s ease, opacity .25s ease;
}
.sl-vs-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(124, 58, 237, 0.18);
    border-color: transparent;
}
.sl-vs-card:hover::before { height: 100%; opacity: 0.07; }
.sl-vs-card__icon {
    font-size: 36px;
    line-height: 1;
    margin-bottom: 4px;
}
.sl-vs-card h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: var(--ink);
    line-height: 1.25;
}
.sl-vs-card p {
    margin: 0;
    font-size: 14.5px;
    color: var(--ink-2);
    line-height: 1.55;
}

.sl-vs-delta {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 24px 32px;
    padding: 28px 36px;
    background: linear-gradient(135deg, #6d28d9 0%, #4c1d95 100%);
    border-radius: 22px;
    color: #fff;
    box-shadow: 0 22px 50px rgba(124, 58, 237, 0.32);
}
.sl-vs-delta__text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    white-space: nowrap;
}
.sl-vs-delta__label {
    font-size: 12.5px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.78);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.sl-vs-delta__amount {
    font-size: 36px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.02em;
    line-height: 1;
}
.sl-vs-delta__hint {
    margin: 0;
    font-size: 15px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.55;
}

@media (max-width: 1100px) {
    .sl-vs-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
    .sl-vs-delta {
        grid-template-columns: 1fr;
        padding: 24px 26px;
        text-align: center;
    }
    .sl-vs-delta__text { align-items: center; white-space: normal; }
    .sl-vs-delta__amount { font-size: 32px; }
}
@media (max-width: 540px) {
    .sl-vs-grid { grid-template-columns: 1fr; gap: 14px; }
}

/* ============================================
   SMART INTENSIVE — per-track palette overrides
   ============================================ */
/* intensive-medical (rose) */
body[data-program="intensive-medical"] {
    --teal-50:  #fff1f2;
    --teal-100: #ffe4e6;
    --teal-200: #fecdd3;
    --teal-300: #fda4af;
    --teal-400: #fb7185;
    --teal-500: #f43f5e;
    --teal-600: #e11d48;
    --teal-700: #be123c;
    --teal-800: #9f1239;
    --brand:      #f43f5e;
    --brand-dark: #e11d48;
    --brand-soft: #fff1f2;
    --brand-ring: rgba(244,63,94,0.18);
    --bg-soft: #fef2f3;
    --bg-mint: #fee2e5;
    --line: #e5e3eb;
    --line-2: #d3cfde;
}
body[data-program="intensive-medical"] .hero h1 .accent,
body[data-program="intensive-medical"] .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #fda4af 0%, #f43f5e 60%, #be123c 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-medical"] .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(244,63,94,0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(244,63,94,0.18), transparent 60%),
        linear-gradient(160deg, #1a1118 0%, #2a1f2a 50%, #18121a 100%);
}
body[data-program="intensive-medical"] .hero h1 .accent,
body[data-program="intensive-medical"] .hero__stat-value {
    background: linear-gradient(135deg, #fda4af, #f43f5e);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-medical"] .hero__stat-icon { background: rgba(244,63,94,0.18); }
body[data-program="intensive-medical"] .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(244,63,94,0.25), transparent 60%),
        linear-gradient(135deg, #be123c 0%, #f43f5e 100%);
    box-shadow: 0 28px 60px rgba(244,63,94,0.32);
}
body[data-program="intensive-medical"] .consult .form--card .btn--primary { color: #be123c; }
body[data-program="intensive-medical"] .consult .form--card .btn--primary:hover { color: #9f1239; }
body[data-program="intensive-medical"] .btn--primary {
    background: #f43f5e;
    box-shadow: 0 14px 30px rgba(244,63,94,0.34);
}
body[data-program="intensive-medical"] .btn--primary:hover {
    background: #e11d48;
    box-shadow: 0 18px 36px rgba(244,63,94,0.42);
}
body[data-program="intensive-medical"] .btn--outline { color: #be123c; border-color: #fda4af; }
body[data-program="intensive-medical"] .btn--outline:hover { background: #f43f5e; border-color: #f43f5e; color: #fff; }
body[data-program="intensive-medical"] .btn--secondary:hover { border-color: #f43f5e; color: #be123c; }
body[data-program="intensive-medical"] .btn--white { color: #be123c; }
body[data-program="intensive-medical"] .lang__btn.is-active {
    background: #e11d48;
    color: #fff;
    box-shadow: 0 2px 6px rgba(244,63,94,0.35);
}
body[data-program="intensive-medical"] .header__burger:hover { border-color: #fda4af; }
body[data-program="intensive-medical"] .nav-drawer__nav > a:hover,
body[data-program="intensive-medical"] .nav-drawer__group > summary:hover,
body[data-program="intensive-medical"] .nav-drawer__nav > a.is-active { color: #be123c; }
body[data-program="intensive-medical"] .nav-drawer__sub a:hover { background: rgba(0,0,0,0.04); color: #be123c; }
body[data-program="intensive-medical"] .form input:focus,
body[data-program="intensive-medical"] .form select:focus,
body[data-program="intensive-medical"] .form textarea:focus {
    border-color: #f43f5e;
    box-shadow: 0 0 0 4px rgba(244,63,94,0.18);
}
body[data-program="intensive-medical"] .logo__mark { box-shadow: 0 6px 16px rgba(244,63,94,0.4); }
body[data-program="intensive-medical"] .visa-route--full .visa-route__num { box-shadow: 0 6px 16px rgba(244,63,94,0.3); }
body[data-program="intensive-medical"] .visa-route--full .visa-route__item:hover { box-shadow: 0 14px 32px rgba(244,63,94,0.14); }
body[data-program="intensive-medical"] .visa-route--full .visa-route__item:hover .visa-route__num { box-shadow: 0 10px 24px rgba(244,63,94,0.35), 0 0 0 2px var(--teal-300); }
body[data-program="intensive-medical"] .cwidget__toggle { box-shadow: 0 14px 32px rgba(244,63,94,0.45); }
body[data-program="intensive-medical"] .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(244,63,94,0.55); }
body[data-program="intensive-medical"] .modal__icon { box-shadow: 0 8px 18px rgba(244,63,94,0.32); }
body[data-program="intensive-medical"] .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(244,63,94,0.32), transparent 60%),
        linear-gradient(160deg, #be123c 0%, #1a1118 100%);
}
body[data-program="intensive-medical"] .sl-incl__col--in { background: linear-gradient(180deg, #fff1f2 0%, #fff 60%); }
body[data-program="intensive-medical"] .footer::before { background: radial-gradient(circle, rgba(244,63,94,0.20), transparent 60%); }
body[data-program="intensive-medical"] .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body[data-program="intensive-medical"] .sl-price:hover {
    --sl-shadow: 0 22px 50px rgba(244,63,94,0.32);
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(254,205,211,0.32), transparent 60%),
        linear-gradient(135deg, #be123c 0%, #f43f5e 100%);
}
body[data-program="intensive-medical"] .sl-phase {
    background: linear-gradient(135deg, rgba(244,63,94,0.14), rgba(244,63,94,0.04));
    border-left-color: #e11d48;
}
body[data-program="intensive-medical"] .sl-phase__num { color: #e11d48; box-shadow: 0 4px 10px rgba(244,63,94,0.18); }
body[data-program="intensive-medical"] .sl-phase--alt {
    background: linear-gradient(135deg, rgba(244,63,94,0.18), rgba(244,63,94,0.05));
    border-left-color: #e11d48;
}
body[data-program="intensive-medical"] .sl-phase--alt .sl-phase__num { color: #e11d48; box-shadow: 0 4px 10px rgba(244,63,94,0.22); }
body[data-program="intensive-medical"] .sl-vs-card::before { background: linear-gradient(90deg, #fda4af, #be123c); }
body[data-program="intensive-medical"] .sl-vs-card:hover { box-shadow: 0 22px 50px rgba(244,63,94,0.18); }
body[data-program="intensive-medical"] .sl-vs-delta {
    background: linear-gradient(135deg, #be123c 0%, #9f1239 100%);
    box-shadow: 0 22px 50px rgba(244,63,94,0.32);
}
body[data-program="intensive-medical"] .sl-vs__check { background: linear-gradient(135deg, #fb7185, #be123c); }

/* intensive-tech (blue) */
body[data-program="intensive-tech"] {
    --teal-50:  #eff6ff;
    --teal-100: #dbeafe;
    --teal-200: #bfdbfe;
    --teal-300: #93c5fd;
    --teal-400: #60a5fa;
    --teal-500: #3b82f6;
    --teal-600: #2563eb;
    --teal-700: #1d4ed8;
    --teal-800: #1e40af;
    --brand:      #3b82f6;
    --brand-dark: #2563eb;
    --brand-soft: #eff6ff;
    --brand-ring: rgba(59,130,246,0.18);
    --bg-soft: #f7faff;
    --bg-mint: #ebf2ff;
    --line: #e5e3eb;
    --line-2: #d3cfde;
}
body[data-program="intensive-tech"] .hero h1 .accent,
body[data-program="intensive-tech"] .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #93c5fd 0%, #3b82f6 60%, #1d4ed8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-tech"] .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(59,130,246,0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(59,130,246,0.18), transparent 60%),
        linear-gradient(160deg, #1a1118 0%, #2a1f2a 50%, #18121a 100%);
}
body[data-program="intensive-tech"] .hero h1 .accent,
body[data-program="intensive-tech"] .hero__stat-value {
    background: linear-gradient(135deg, #93c5fd, #3b82f6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-tech"] .hero__stat-icon { background: rgba(59,130,246,0.18); }
body[data-program="intensive-tech"] .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(59,130,246,0.25), transparent 60%),
        linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
    box-shadow: 0 28px 60px rgba(59,130,246,0.32);
}
body[data-program="intensive-tech"] .consult .form--card .btn--primary { color: #1d4ed8; }
body[data-program="intensive-tech"] .consult .form--card .btn--primary:hover { color: #1e40af; }
body[data-program="intensive-tech"] .btn--primary {
    background: #3b82f6;
    box-shadow: 0 14px 30px rgba(59,130,246,0.34);
}
body[data-program="intensive-tech"] .btn--primary:hover {
    background: #2563eb;
    box-shadow: 0 18px 36px rgba(59,130,246,0.42);
}
body[data-program="intensive-tech"] .btn--outline { color: #1d4ed8; border-color: #93c5fd; }
body[data-program="intensive-tech"] .btn--outline:hover { background: #3b82f6; border-color: #3b82f6; color: #fff; }
body[data-program="intensive-tech"] .btn--secondary:hover { border-color: #3b82f6; color: #1d4ed8; }
body[data-program="intensive-tech"] .btn--white { color: #1d4ed8; }
body[data-program="intensive-tech"] .lang__btn.is-active {
    background: #2563eb;
    color: #fff;
    box-shadow: 0 2px 6px rgba(59,130,246,0.35);
}
body[data-program="intensive-tech"] .header__burger:hover { border-color: #93c5fd; }
body[data-program="intensive-tech"] .nav-drawer__nav > a:hover,
body[data-program="intensive-tech"] .nav-drawer__group > summary:hover,
body[data-program="intensive-tech"] .nav-drawer__nav > a.is-active { color: #1d4ed8; }
body[data-program="intensive-tech"] .nav-drawer__sub a:hover { background: rgba(0,0,0,0.04); color: #1d4ed8; }
body[data-program="intensive-tech"] .form input:focus,
body[data-program="intensive-tech"] .form select:focus,
body[data-program="intensive-tech"] .form textarea:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 4px rgba(59,130,246,0.18);
}
body[data-program="intensive-tech"] .logo__mark { box-shadow: 0 6px 16px rgba(59,130,246,0.4); }
body[data-program="intensive-tech"] .visa-route--full .visa-route__num { box-shadow: 0 6px 16px rgba(59,130,246,0.3); }
body[data-program="intensive-tech"] .visa-route--full .visa-route__item:hover { box-shadow: 0 14px 32px rgba(59,130,246,0.14); }
body[data-program="intensive-tech"] .visa-route--full .visa-route__item:hover .visa-route__num { box-shadow: 0 10px 24px rgba(59,130,246,0.35), 0 0 0 2px var(--teal-300); }
body[data-program="intensive-tech"] .cwidget__toggle { box-shadow: 0 14px 32px rgba(59,130,246,0.45); }
body[data-program="intensive-tech"] .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(59,130,246,0.55); }
body[data-program="intensive-tech"] .modal__icon { box-shadow: 0 8px 18px rgba(59,130,246,0.32); }
body[data-program="intensive-tech"] .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(59,130,246,0.32), transparent 60%),
        linear-gradient(160deg, #1d4ed8 0%, #1a1118 100%);
}
body[data-program="intensive-tech"] .sl-incl__col--in { background: linear-gradient(180deg, #eff6ff 0%, #fff 60%); }
body[data-program="intensive-tech"] .footer::before { background: radial-gradient(circle, rgba(59,130,246,0.20), transparent 60%); }
body[data-program="intensive-tech"] .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body[data-program="intensive-tech"] .sl-price:hover {
    --sl-shadow: 0 22px 50px rgba(59,130,246,0.32);
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(191,219,254,0.32), transparent 60%),
        linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
}
body[data-program="intensive-tech"] .sl-phase {
    background: linear-gradient(135deg, rgba(59,130,246,0.14), rgba(59,130,246,0.04));
    border-left-color: #2563eb;
}
body[data-program="intensive-tech"] .sl-phase__num { color: #2563eb; box-shadow: 0 4px 10px rgba(59,130,246,0.18); }
body[data-program="intensive-tech"] .sl-phase--alt {
    background: linear-gradient(135deg, rgba(59,130,246,0.18), rgba(59,130,246,0.05));
    border-left-color: #2563eb;
}
body[data-program="intensive-tech"] .sl-phase--alt .sl-phase__num { color: #2563eb; box-shadow: 0 4px 10px rgba(59,130,246,0.22); }
body[data-program="intensive-tech"] .sl-vs-card::before { background: linear-gradient(90deg, #93c5fd, #1d4ed8); }
body[data-program="intensive-tech"] .sl-vs-card:hover { box-shadow: 0 22px 50px rgba(59,130,246,0.18); }
body[data-program="intensive-tech"] .sl-vs-delta {
    background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
    box-shadow: 0 22px 50px rgba(59,130,246,0.32);
}
body[data-program="intensive-tech"] .sl-vs__check { background: linear-gradient(135deg, #60a5fa, #1d4ed8); }

/* Before Smart (sky-blue — same hues as tech palette) */
body[data-program="before"] {
    --teal-50:  #eff6ff;
    --teal-100: #dbeafe;
    --teal-200: #bfdbfe;
    --teal-300: #93c5fd;
    --teal-400: #60a5fa;
    --teal-500: #3b82f6;
    --teal-600: #2563eb;
    --teal-700: #1d4ed8;
    --teal-800: #1e40af;
    --brand:      #3b82f6;
    --brand-dark: #2563eb;
    --brand-soft: #eff6ff;
    --brand-ring: rgba(59,130,246,0.18);
    --bg-soft: #f7faff;
    --bg-mint: #ebf2ff;
    --line: #e5e3eb;
    --line-2: #d3cfde;
}
body[data-program="before"] .hero h1 .accent,
body[data-program="before"] .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #93c5fd 0%, #3b82f6 60%, #1d4ed8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="before"] .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(59,130,246,0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(59,130,246,0.18), transparent 60%),
        linear-gradient(160deg, #1a1118 0%, #2a1f2a 50%, #18121a 100%);
}
body[data-program="before"] .hero h1 .accent,
body[data-program="before"] .hero__stat-value {
    background: linear-gradient(135deg, #93c5fd, #3b82f6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="before"] .hero__stat-icon { background: rgba(59,130,246,0.18); }
body[data-program="before"] .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(59,130,246,0.25), transparent 60%),
        linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
    box-shadow: 0 28px 60px rgba(59,130,246,0.32);
}
body[data-program="before"] .consult .form--card .btn--primary { color: #1d4ed8; }
body[data-program="before"] .consult .form--card .btn--primary:hover { color: #1e40af; }
body[data-program="before"] .btn--primary {
    background: #3b82f6;
    box-shadow: 0 14px 30px rgba(59,130,246,0.34);
}
body[data-program="before"] .btn--primary:hover {
    background: #2563eb;
    box-shadow: 0 18px 36px rgba(59,130,246,0.42);
}
body[data-program="before"] .btn--outline { color: #1d4ed8; border-color: #93c5fd; }
body[data-program="before"] .btn--outline:hover { background: #3b82f6; border-color: #3b82f6; color: #fff; }
body[data-program="before"] .btn--secondary:hover { border-color: #3b82f6; color: #1d4ed8; }
body[data-program="before"] .btn--white { color: #1d4ed8; }
body[data-program="before"] .lang__btn.is-active {
    background: #2563eb;
    color: #fff;
    box-shadow: 0 2px 6px rgba(59,130,246,0.35);
}
body[data-program="before"] .header__burger:hover { border-color: #93c5fd; }
body[data-program="before"] .nav-drawer__nav > a:hover,
body[data-program="before"] .nav-drawer__group > summary:hover,
body[data-program="before"] .nav-drawer__nav > a.is-active { color: #1d4ed8; }
body[data-program="before"] .nav-drawer__sub a:hover { background: rgba(0,0,0,0.04); color: #1d4ed8; }
body[data-program="before"] .form input:focus,
body[data-program="before"] .form select:focus,
body[data-program="before"] .form textarea:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 4px rgba(59,130,246,0.18);
}
body[data-program="before"] .logo__mark { box-shadow: 0 6px 16px rgba(59,130,246,0.4); }
body[data-program="before"] .visa-route--full .visa-route__num { box-shadow: 0 6px 16px rgba(59,130,246,0.3); }
body[data-program="before"] .visa-route--full .visa-route__item:hover { box-shadow: 0 14px 32px rgba(59,130,246,0.14); }
body[data-program="before"] .visa-route--full .visa-route__item:hover .visa-route__num { box-shadow: 0 10px 24px rgba(59,130,246,0.35), 0 0 0 2px var(--teal-300); }
body[data-program="before"] .cwidget__toggle { box-shadow: 0 14px 32px rgba(59,130,246,0.45); }
body[data-program="before"] .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(59,130,246,0.55); }
body[data-program="before"] .modal__icon { box-shadow: 0 8px 18px rgba(59,130,246,0.32); }
body[data-program="before"] .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(59,130,246,0.32), transparent 60%),
        linear-gradient(160deg, #1d4ed8 0%, #1a1118 100%);
}
body[data-program="before"] .sl-incl__col--in { background: linear-gradient(180deg, #eff6ff 0%, #fff 60%); }
body[data-program="before"] .footer::before { background: radial-gradient(circle, rgba(59,130,246,0.20), transparent 60%); }
body[data-program="before"] .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body[data-program="before"] .sl-price:hover {
    --sl-shadow: 0 22px 50px rgba(59,130,246,0.32);
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(191,219,254,0.32), transparent 60%),
        linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
}
body[data-program="before"] .sl-phase {
    background: linear-gradient(135deg, rgba(59,130,246,0.14), rgba(59,130,246,0.04));
    border-left-color: #2563eb;
}
body[data-program="before"] .sl-phase__num { color: #2563eb; box-shadow: 0 4px 10px rgba(59,130,246,0.18); }
body[data-program="before"] .sl-phase--alt {
    background: linear-gradient(135deg, rgba(59,130,246,0.18), rgba(59,130,246,0.05));
    border-left-color: #2563eb;
}
body[data-program="before"] .sl-phase--alt .sl-phase__num { color: #2563eb; box-shadow: 0 4px 10px rgba(59,130,246,0.22); }
body[data-program="before"] .sl-vs-card::before { background: linear-gradient(90deg, #93c5fd, #1d4ed8); }
body[data-program="before"] .sl-vs-card:hover { box-shadow: 0 22px 50px rgba(59,130,246,0.18); }
body[data-program="before"] .sl-vs-delta {
    background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
    box-shadow: 0 22px 50px rgba(59,130,246,0.32);
}
body[data-program="before"] .sl-vs__check { background: linear-gradient(135deg, #60a5fa, #1d4ed8); }


/* intensive-chem (emerald) */
body[data-program="intensive-chem"] {
    --teal-50:  #ecfdf5;
    --teal-100: #d1fae5;
    --teal-200: #a7f3d0;
    --teal-300: #6ee7b7;
    --teal-400: #34d399;
    --teal-500: #10b981;
    --teal-600: #059669;
    --teal-700: #047857;
    --teal-800: #065f46;
    --brand:      #10b981;
    --brand-dark: #059669;
    --brand-soft: #ecfdf5;
    --brand-ring: rgba(16,185,129,0.18);
    --bg-soft: #f6fdfa;
    --bg-mint: #ebfbf3;
    --line: #e5e3eb;
    --line-2: #d3cfde;
}
body[data-program="intensive-chem"] .hero h1 .accent,
body[data-program="intensive-chem"] .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #6ee7b7 0%, #10b981 60%, #047857 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-chem"] .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(16,185,129,0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(16,185,129,0.18), transparent 60%),
        linear-gradient(160deg, #1a1118 0%, #2a1f2a 50%, #18121a 100%);
}
body[data-program="intensive-chem"] .hero h1 .accent,
body[data-program="intensive-chem"] .hero__stat-value {
    background: linear-gradient(135deg, #6ee7b7, #10b981);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-chem"] .hero__stat-icon { background: rgba(16,185,129,0.18); }
body[data-program="intensive-chem"] .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(16,185,129,0.25), transparent 60%),
        linear-gradient(135deg, #047857 0%, #10b981 100%);
    box-shadow: 0 28px 60px rgba(16,185,129,0.32);
}
body[data-program="intensive-chem"] .consult .form--card .btn--primary { color: #047857; }
body[data-program="intensive-chem"] .consult .form--card .btn--primary:hover { color: #065f46; }
body[data-program="intensive-chem"] .btn--primary {
    background: #10b981;
    box-shadow: 0 14px 30px rgba(16,185,129,0.34);
}
body[data-program="intensive-chem"] .btn--primary:hover {
    background: #059669;
    box-shadow: 0 18px 36px rgba(16,185,129,0.42);
}
body[data-program="intensive-chem"] .btn--outline { color: #047857; border-color: #6ee7b7; }
body[data-program="intensive-chem"] .btn--outline:hover { background: #10b981; border-color: #10b981; color: #fff; }
body[data-program="intensive-chem"] .btn--secondary:hover { border-color: #10b981; color: #047857; }
body[data-program="intensive-chem"] .btn--white { color: #047857; }
body[data-program="intensive-chem"] .lang__btn.is-active {
    background: #059669;
    color: #fff;
    box-shadow: 0 2px 6px rgba(16,185,129,0.35);
}
body[data-program="intensive-chem"] .header__burger:hover { border-color: #6ee7b7; }
body[data-program="intensive-chem"] .nav-drawer__nav > a:hover,
body[data-program="intensive-chem"] .nav-drawer__group > summary:hover,
body[data-program="intensive-chem"] .nav-drawer__nav > a.is-active { color: #047857; }
body[data-program="intensive-chem"] .nav-drawer__sub a:hover { background: rgba(0,0,0,0.04); color: #047857; }
body[data-program="intensive-chem"] .form input:focus,
body[data-program="intensive-chem"] .form select:focus,
body[data-program="intensive-chem"] .form textarea:focus {
    border-color: #10b981;
    box-shadow: 0 0 0 4px rgba(16,185,129,0.18);
}
body[data-program="intensive-chem"] .logo__mark { box-shadow: 0 6px 16px rgba(16,185,129,0.4); }
body[data-program="intensive-chem"] .visa-route--full .visa-route__num { box-shadow: 0 6px 16px rgba(16,185,129,0.3); }
body[data-program="intensive-chem"] .visa-route--full .visa-route__item:hover { box-shadow: 0 14px 32px rgba(16,185,129,0.14); }
body[data-program="intensive-chem"] .visa-route--full .visa-route__item:hover .visa-route__num { box-shadow: 0 10px 24px rgba(16,185,129,0.35), 0 0 0 2px var(--teal-300); }
body[data-program="intensive-chem"] .cwidget__toggle { box-shadow: 0 14px 32px rgba(16,185,129,0.45); }
body[data-program="intensive-chem"] .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(16,185,129,0.55); }
body[data-program="intensive-chem"] .modal__icon { box-shadow: 0 8px 18px rgba(16,185,129,0.32); }
body[data-program="intensive-chem"] .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(16,185,129,0.32), transparent 60%),
        linear-gradient(160deg, #047857 0%, #1a1118 100%);
}
body[data-program="intensive-chem"] .sl-incl__col--in { background: linear-gradient(180deg, #ecfdf5 0%, #fff 60%); }
body[data-program="intensive-chem"] .footer::before { background: radial-gradient(circle, rgba(16,185,129,0.20), transparent 60%); }
body[data-program="intensive-chem"] .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body[data-program="intensive-chem"] .sl-price:hover {
    --sl-shadow: 0 22px 50px rgba(16,185,129,0.32);
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(167,243,208,0.32), transparent 60%),
        linear-gradient(135deg, #047857 0%, #10b981 100%);
}
body[data-program="intensive-chem"] .sl-phase {
    background: linear-gradient(135deg, rgba(16,185,129,0.14), rgba(16,185,129,0.04));
    border-left-color: #059669;
}
body[data-program="intensive-chem"] .sl-phase__num { color: #059669; box-shadow: 0 4px 10px rgba(16,185,129,0.18); }
body[data-program="intensive-chem"] .sl-phase--alt {
    background: linear-gradient(135deg, rgba(16,185,129,0.18), rgba(16,185,129,0.05));
    border-left-color: #059669;
}
body[data-program="intensive-chem"] .sl-phase--alt .sl-phase__num { color: #059669; box-shadow: 0 4px 10px rgba(16,185,129,0.22); }
body[data-program="intensive-chem"] .sl-vs-card::before { background: linear-gradient(90deg, #6ee7b7, #047857); }
body[data-program="intensive-chem"] .sl-vs-card:hover { box-shadow: 0 22px 50px rgba(16,185,129,0.18); }
body[data-program="intensive-chem"] .sl-vs-delta {
    background: linear-gradient(135deg, #047857 0%, #065f46 100%);
    box-shadow: 0 22px 50px rgba(16,185,129,0.32);
}
body[data-program="intensive-chem"] .sl-vs__check { background: linear-gradient(135deg, #34d399, #047857); }

/* intensive-humanities (amber) */
body[data-program="intensive-humanities"] {
    --teal-50:  #fffbeb;
    --teal-100: #fef3c7;
    --teal-200: #fde68a;
    --teal-300: #fcd34d;
    --teal-400: #fbbf24;
    --teal-500: #f59e0b;
    --teal-600: #d97706;
    --teal-700: #b45309;
    --teal-800: #92400e;
    --brand:      #f59e0b;
    --brand-dark: #d97706;
    --brand-soft: #fffbeb;
    --brand-ring: rgba(245,158,11,0.18);
    --bg-soft: #fefcf6;
    --bg-mint: #fef5e3;
    --line: #e5e3eb;
    --line-2: #d3cfde;
}
body[data-program="intensive-humanities"] .hero h1 .accent,
body[data-program="intensive-humanities"] .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #fcd34d 0%, #f59e0b 60%, #b45309 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-humanities"] .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(245,158,11,0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(245,158,11,0.18), transparent 60%),
        linear-gradient(160deg, #1a1118 0%, #2a1f2a 50%, #18121a 100%);
}
body[data-program="intensive-humanities"] .hero h1 .accent,
body[data-program="intensive-humanities"] .hero__stat-value {
    background: linear-gradient(135deg, #fcd34d, #f59e0b);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-humanities"] .hero__stat-icon { background: rgba(245,158,11,0.18); }
body[data-program="intensive-humanities"] .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(245,158,11,0.25), transparent 60%),
        linear-gradient(135deg, #b45309 0%, #f59e0b 100%);
    box-shadow: 0 28px 60px rgba(245,158,11,0.32);
}
body[data-program="intensive-humanities"] .consult .form--card .btn--primary { color: #b45309; }
body[data-program="intensive-humanities"] .consult .form--card .btn--primary:hover { color: #92400e; }
body[data-program="intensive-humanities"] .btn--primary {
    background: #f59e0b;
    box-shadow: 0 14px 30px rgba(245,158,11,0.34);
}
body[data-program="intensive-humanities"] .btn--primary:hover {
    background: #d97706;
    box-shadow: 0 18px 36px rgba(245,158,11,0.42);
}
body[data-program="intensive-humanities"] .btn--outline { color: #b45309; border-color: #fcd34d; }
body[data-program="intensive-humanities"] .btn--outline:hover { background: #f59e0b; border-color: #f59e0b; color: #fff; }
body[data-program="intensive-humanities"] .btn--secondary:hover { border-color: #f59e0b; color: #b45309; }
body[data-program="intensive-humanities"] .btn--white { color: #b45309; }
body[data-program="intensive-humanities"] .lang__btn.is-active {
    background: #d97706;
    color: #fff;
    box-shadow: 0 2px 6px rgba(245,158,11,0.35);
}
body[data-program="intensive-humanities"] .header__burger:hover { border-color: #fcd34d; }
body[data-program="intensive-humanities"] .nav-drawer__nav > a:hover,
body[data-program="intensive-humanities"] .nav-drawer__group > summary:hover,
body[data-program="intensive-humanities"] .nav-drawer__nav > a.is-active { color: #b45309; }
body[data-program="intensive-humanities"] .nav-drawer__sub a:hover { background: rgba(0,0,0,0.04); color: #b45309; }
body[data-program="intensive-humanities"] .form input:focus,
body[data-program="intensive-humanities"] .form select:focus,
body[data-program="intensive-humanities"] .form textarea:focus {
    border-color: #f59e0b;
    box-shadow: 0 0 0 4px rgba(245,158,11,0.18);
}
body[data-program="intensive-humanities"] .logo__mark { box-shadow: 0 6px 16px rgba(245,158,11,0.4); }
body[data-program="intensive-humanities"] .visa-route--full .visa-route__num { box-shadow: 0 6px 16px rgba(245,158,11,0.3); }
body[data-program="intensive-humanities"] .visa-route--full .visa-route__item:hover { box-shadow: 0 14px 32px rgba(245,158,11,0.14); }
body[data-program="intensive-humanities"] .visa-route--full .visa-route__item:hover .visa-route__num { box-shadow: 0 10px 24px rgba(245,158,11,0.35), 0 0 0 2px var(--teal-300); }
body[data-program="intensive-humanities"] .cwidget__toggle { box-shadow: 0 14px 32px rgba(245,158,11,0.45); }
body[data-program="intensive-humanities"] .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(245,158,11,0.55); }
body[data-program="intensive-humanities"] .modal__icon { box-shadow: 0 8px 18px rgba(245,158,11,0.32); }
body[data-program="intensive-humanities"] .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(245,158,11,0.32), transparent 60%),
        linear-gradient(160deg, #b45309 0%, #1a1118 100%);
}
body[data-program="intensive-humanities"] .sl-incl__col--in { background: linear-gradient(180deg, #fffbeb 0%, #fff 60%); }
body[data-program="intensive-humanities"] .footer::before { background: radial-gradient(circle, rgba(245,158,11,0.20), transparent 60%); }
body[data-program="intensive-humanities"] .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body[data-program="intensive-humanities"] .sl-price:hover {
    --sl-shadow: 0 22px 50px rgba(245,158,11,0.32);
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(253,230,138,0.32), transparent 60%),
        linear-gradient(135deg, #b45309 0%, #f59e0b 100%);
}
body[data-program="intensive-humanities"] .sl-phase {
    background: linear-gradient(135deg, rgba(245,158,11,0.14), rgba(245,158,11,0.04));
    border-left-color: #d97706;
}
body[data-program="intensive-humanities"] .sl-phase__num { color: #d97706; box-shadow: 0 4px 10px rgba(245,158,11,0.18); }
body[data-program="intensive-humanities"] .sl-phase--alt {
    background: linear-gradient(135deg, rgba(245,158,11,0.18), rgba(245,158,11,0.05));
    border-left-color: #d97706;
}
body[data-program="intensive-humanities"] .sl-phase--alt .sl-phase__num { color: #d97706; box-shadow: 0 4px 10px rgba(245,158,11,0.22); }
body[data-program="intensive-humanities"] .sl-vs-card::before { background: linear-gradient(90deg, #fcd34d, #b45309); }
body[data-program="intensive-humanities"] .sl-vs-card:hover { box-shadow: 0 22px 50px rgba(245,158,11,0.18); }
body[data-program="intensive-humanities"] .sl-vs-delta {
    background: linear-gradient(135deg, #b45309 0%, #92400e 100%);
    box-shadow: 0 22px 50px rgba(245,158,11,0.32);
}
body[data-program="intensive-humanities"] .sl-vs__check { background: linear-gradient(135deg, #fbbf24, #b45309); }

/* After Smart (amber — same hues as humanities palette) */
body[data-program="after"] {
    --teal-50:  #fffbeb;
    --teal-100: #fef3c7;
    --teal-200: #fde68a;
    --teal-300: #fcd34d;
    --teal-400: #fbbf24;
    --teal-500: #f59e0b;
    --teal-600: #d97706;
    --teal-700: #b45309;
    --teal-800: #92400e;
    --brand:      #f59e0b;
    --brand-dark: #d97706;
    --brand-soft: #fffbeb;
    --brand-ring: rgba(245,158,11,0.18);
    --bg-soft: #fefcf6;
    --bg-mint: #fef5e3;
    --line: #e5e3eb;
    --line-2: #d3cfde;
}
body[data-program="after"] .hero h1 .accent,
body[data-program="after"] .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #fcd34d 0%, #f59e0b 60%, #b45309 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="after"] .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(245,158,11,0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(245,158,11,0.18), transparent 60%),
        linear-gradient(160deg, #1a1118 0%, #2a1f2a 50%, #18121a 100%);
}
body[data-program="after"] .hero h1 .accent,
body[data-program="after"] .hero__stat-value {
    background: linear-gradient(135deg, #fcd34d, #f59e0b);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="after"] .hero__stat-icon { background: rgba(245,158,11,0.18); }
body[data-program="after"] .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(245,158,11,0.25), transparent 60%),
        linear-gradient(135deg, #b45309 0%, #f59e0b 100%);
    box-shadow: 0 28px 60px rgba(245,158,11,0.32);
}
body[data-program="after"] .consult .form--card .btn--primary { color: #b45309; }
body[data-program="after"] .consult .form--card .btn--primary:hover { color: #92400e; }
body[data-program="after"] .btn--primary {
    background: #f59e0b;
    box-shadow: 0 14px 30px rgba(245,158,11,0.34);
}
body[data-program="after"] .btn--primary:hover {
    background: #d97706;
    box-shadow: 0 18px 36px rgba(245,158,11,0.42);
}
body[data-program="after"] .btn--outline { color: #b45309; border-color: #fcd34d; }
body[data-program="after"] .btn--outline:hover { background: #f59e0b; border-color: #f59e0b; color: #fff; }
body[data-program="after"] .btn--secondary:hover { border-color: #f59e0b; color: #b45309; }
body[data-program="after"] .btn--white { color: #b45309; }
body[data-program="after"] .lang__btn.is-active {
    background: #d97706;
    color: #fff;
    box-shadow: 0 2px 6px rgba(245,158,11,0.35);
}
body[data-program="after"] .header__burger:hover { border-color: #fcd34d; }
body[data-program="after"] .nav-drawer__nav > a:hover,
body[data-program="after"] .nav-drawer__group > summary:hover,
body[data-program="after"] .nav-drawer__nav > a.is-active { color: #b45309; }
body[data-program="after"] .nav-drawer__sub a:hover { background: rgba(0,0,0,0.04); color: #b45309; }
body[data-program="after"] .form input:focus,
body[data-program="after"] .form select:focus,
body[data-program="after"] .form textarea:focus {
    border-color: #f59e0b;
    box-shadow: 0 0 0 4px rgba(245,158,11,0.18);
}
body[data-program="after"] .logo__mark { box-shadow: 0 6px 16px rgba(245,158,11,0.4); }
body[data-program="after"] .visa-route--full .visa-route__num { box-shadow: 0 6px 16px rgba(245,158,11,0.3); }
body[data-program="after"] .visa-route--full .visa-route__item:hover { box-shadow: 0 14px 32px rgba(245,158,11,0.14); }
body[data-program="after"] .visa-route--full .visa-route__item:hover .visa-route__num { box-shadow: 0 10px 24px rgba(245,158,11,0.35), 0 0 0 2px var(--teal-300); }
body[data-program="after"] .cwidget__toggle { box-shadow: 0 14px 32px rgba(245,158,11,0.45); }
body[data-program="after"] .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(245,158,11,0.55); }
body[data-program="after"] .modal__icon { box-shadow: 0 8px 18px rgba(245,158,11,0.32); }
body[data-program="after"] .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(245,158,11,0.32), transparent 60%),
        linear-gradient(160deg, #b45309 0%, #1a1118 100%);
}
body[data-program="after"] .sl-incl__col--in { background: linear-gradient(180deg, #fffbeb 0%, #fff 60%); }
body[data-program="after"] .footer::before { background: radial-gradient(circle, rgba(245,158,11,0.20), transparent 60%); }
body[data-program="after"] .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body[data-program="after"] .sl-price:hover {
    --sl-shadow: 0 22px 50px rgba(245,158,11,0.32);
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(253,230,138,0.32), transparent 60%),
        linear-gradient(135deg, #b45309 0%, #f59e0b 100%);
}
body[data-program="after"] .sl-phase {
    background: linear-gradient(135deg, rgba(245,158,11,0.14), rgba(245,158,11,0.04));
    border-left-color: #d97706;
}
body[data-program="after"] .sl-phase__num { color: #d97706; box-shadow: 0 4px 10px rgba(245,158,11,0.18); }
body[data-program="after"] .sl-phase--alt {
    background: linear-gradient(135deg, rgba(245,158,11,0.18), rgba(245,158,11,0.05));
    border-left-color: #d97706;
}
body[data-program="after"] .sl-phase--alt .sl-phase__num { color: #d97706; box-shadow: 0 4px 10px rgba(245,158,11,0.22); }
body[data-program="after"] .sl-vs-card::before { background: linear-gradient(90deg, #fcd34d, #b45309); }
body[data-program="after"] .sl-vs-card:hover { box-shadow: 0 22px 50px rgba(245,158,11,0.18); }
body[data-program="after"] .sl-vs-delta {
    background: linear-gradient(135deg, #b45309 0%, #92400e 100%);
    box-shadow: 0 22px 50px rgba(245,158,11,0.32);
}
body[data-program="after"] .sl-vs__check { background: linear-gradient(135deg, #fbbf24, #b45309); }


/* intensive-economics (indigo) */
body[data-program="intensive-economics"] {
    --teal-50:  #eef2ff;
    --teal-100: #e0e7ff;
    --teal-200: #c7d2fe;
    --teal-300: #a5b4fc;
    --teal-400: #818cf8;
    --teal-500: #6366f1;
    --teal-600: #4f46e5;
    --teal-700: #4338ca;
    --teal-800: #3730a3;
    --brand:      #6366f1;
    --brand-dark: #4f46e5;
    --brand-soft: #eef2ff;
    --brand-ring: rgba(99,102,241,0.18);
    --bg-soft: #f8f8ff;
    --bg-mint: #eef0ff;
    --line: #e5e3eb;
    --line-2: #d3cfde;
}
body[data-program="intensive-economics"] .hero h1 .accent,
body[data-program="intensive-economics"] .sl-section .section-head h2 .accent {
    background: linear-gradient(135deg, #a5b4fc 0%, #6366f1 60%, #4338ca 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-economics"] .hero {
    background:
        radial-gradient(900px 600px at 85% -10%, rgba(99,102,241,0.35), transparent 60%),
        radial-gradient(700px 500px at -10% 40%, rgba(99,102,241,0.18), transparent 60%),
        linear-gradient(160deg, #1a1118 0%, #2a1f2a 50%, #18121a 100%);
}
body[data-program="intensive-economics"] .hero h1 .accent,
body[data-program="intensive-economics"] .hero__stat-value {
    background: linear-gradient(135deg, #a5b4fc, #6366f1);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body[data-program="intensive-economics"] .hero__stat-icon { background: rgba(99,102,241,0.18); }
body[data-program="intensive-economics"] .consult .form--card {
    background:
        radial-gradient(700px 400px at 80% 20%, rgba(99,102,241,0.25), transparent 60%),
        linear-gradient(135deg, #4338ca 0%, #6366f1 100%);
    box-shadow: 0 28px 60px rgba(99,102,241,0.32);
}
body[data-program="intensive-economics"] .consult .form--card .btn--primary { color: #4338ca; }
body[data-program="intensive-economics"] .consult .form--card .btn--primary:hover { color: #3730a3; }
body[data-program="intensive-economics"] .btn--primary {
    background: #6366f1;
    box-shadow: 0 14px 30px rgba(99,102,241,0.34);
}
body[data-program="intensive-economics"] .btn--primary:hover {
    background: #4f46e5;
    box-shadow: 0 18px 36px rgba(99,102,241,0.42);
}
body[data-program="intensive-economics"] .btn--outline { color: #4338ca; border-color: #a5b4fc; }
body[data-program="intensive-economics"] .btn--outline:hover { background: #6366f1; border-color: #6366f1; color: #fff; }
body[data-program="intensive-economics"] .btn--secondary:hover { border-color: #6366f1; color: #4338ca; }
body[data-program="intensive-economics"] .btn--white { color: #4338ca; }
body[data-program="intensive-economics"] .lang__btn.is-active {
    background: #4f46e5;
    color: #fff;
    box-shadow: 0 2px 6px rgba(99,102,241,0.35);
}
body[data-program="intensive-economics"] .header__burger:hover { border-color: #a5b4fc; }
body[data-program="intensive-economics"] .nav-drawer__nav > a:hover,
body[data-program="intensive-economics"] .nav-drawer__group > summary:hover,
body[data-program="intensive-economics"] .nav-drawer__nav > a.is-active { color: #4338ca; }
body[data-program="intensive-economics"] .nav-drawer__sub a:hover { background: rgba(0,0,0,0.04); color: #4338ca; }
body[data-program="intensive-economics"] .form input:focus,
body[data-program="intensive-economics"] .form select:focus,
body[data-program="intensive-economics"] .form textarea:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 4px rgba(99,102,241,0.18);
}
body[data-program="intensive-economics"] .logo__mark { box-shadow: 0 6px 16px rgba(99,102,241,0.4); }
body[data-program="intensive-economics"] .visa-route--full .visa-route__num { box-shadow: 0 6px 16px rgba(99,102,241,0.3); }
body[data-program="intensive-economics"] .visa-route--full .visa-route__item:hover { box-shadow: 0 14px 32px rgba(99,102,241,0.14); }
body[data-program="intensive-economics"] .visa-route--full .visa-route__item:hover .visa-route__num { box-shadow: 0 10px 24px rgba(99,102,241,0.35), 0 0 0 2px var(--teal-300); }
body[data-program="intensive-economics"] .cwidget__toggle { box-shadow: 0 14px 32px rgba(99,102,241,0.45); }
body[data-program="intensive-economics"] .cwidget__toggle:hover { box-shadow: 0 18px 38px rgba(99,102,241,0.55); }
body[data-program="intensive-economics"] .modal__icon { box-shadow: 0 8px 18px rgba(99,102,241,0.32); }
body[data-program="intensive-economics"] .enroll__head {
    background:
        radial-gradient(420px 220px at 80% 0%, rgba(99,102,241,0.32), transparent 60%),
        linear-gradient(160deg, #4338ca 0%, #1a1118 100%);
}
body[data-program="intensive-economics"] .sl-incl__col--in { background: linear-gradient(180deg, #eef2ff 0%, #fff 60%); }
body[data-program="intensive-economics"] .footer::before { background: radial-gradient(circle, rgba(99,102,241,0.20), transparent 60%); }
body[data-program="intensive-economics"] .sl-pricing:not(:has(.sl-price:hover)) .sl-price--best,
body[data-program="intensive-economics"] .sl-price:hover {
    --sl-shadow: 0 22px 50px rgba(99,102,241,0.32);
    --sl-bg:
        radial-gradient(500px 350px at 85% 0%, rgba(199,210,254,0.32), transparent 60%),
        linear-gradient(135deg, #4338ca 0%, #6366f1 100%);
}
body[data-program="intensive-economics"] .sl-phase {
    background: linear-gradient(135deg, rgba(99,102,241,0.14), rgba(99,102,241,0.04));
    border-left-color: #4f46e5;
}
body[data-program="intensive-economics"] .sl-phase__num { color: #4f46e5; box-shadow: 0 4px 10px rgba(99,102,241,0.18); }
body[data-program="intensive-economics"] .sl-phase--alt {
    background: linear-gradient(135deg, rgba(99,102,241,0.18), rgba(99,102,241,0.05));
    border-left-color: #4f46e5;
}
body[data-program="intensive-economics"] .sl-phase--alt .sl-phase__num { color: #4f46e5; box-shadow: 0 4px 10px rgba(99,102,241,0.22); }
body[data-program="intensive-economics"] .sl-vs-card::before { background: linear-gradient(90deg, #a5b4fc, #4338ca); }
body[data-program="intensive-economics"] .sl-vs-card:hover { box-shadow: 0 22px 50px rgba(99,102,241,0.18); }
body[data-program="intensive-economics"] .sl-vs-delta {
    background: linear-gradient(135deg, #4338ca 0%, #3730a3 100%);
    box-shadow: 0 22px 50px rgba(99,102,241,0.32);
}
body[data-program="intensive-economics"] .sl-vs__check { background: linear-gradient(135deg, #818cf8, #4338ca); }


/* Hero kicker badge above h1 (used on Smart Intensive pages) */
.hero__kicker {
    display: inline-block;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 6px 14px;
    border-radius: 999px;
    margin-bottom: 18px;
    border: 1px solid rgba(255, 255, 255, 0.18);
}

/* TOP-3 university cards (Smart Intensive "Куда поступить") */
.sl-uni-section { margin-top: 24px; }
.sl-uni-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin-bottom: 24px;
}
.sl-uni-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 26px 24px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .2s ease;
    position: relative;
    overflow: hidden;
}
.sl-uni-card::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--teal-300), var(--teal-700));
    transition: height .25s ease, opacity .25s ease;
}
.sl-uni-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.10);
    border-color: transparent;
}
.sl-uni-card:hover::before { height: 100%; opacity: 0.07; }
.sl-uni-card__logo {
    display: inline-grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--teal-400), var(--teal-700));
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.01em;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.10);
}
.sl-uni-card__body { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.sl-uni-card__body h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: var(--ink);
    line-height: 1.25;
}
.sl-uni-card__city {
    font-size: 13px;
    font-weight: 700;
    color: var(--teal-700);
    letter-spacing: 0.02em;
}
.sl-uni-card__desc {
    margin: 6px 0 0;
    font-size: 14px;
    color: var(--ink-2);
    line-height: 1.55;
}
.sl-uni-card__programs {
    margin: auto 0 0;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    font-size: 13px;
    color: var(--ink-2);
    line-height: 1.5;
}
.sl-uni-others {
    margin: 16px auto 0;
    padding: 14px 18px;
    background: var(--bg-soft);
    border-left: 3px solid var(--teal-400);
    border-radius: 12px;
    font-size: 13.5px;
    color: var(--ink-2);
    line-height: 1.55;
}
.sl-uni-others b { color: var(--ink); }
@media (max-width: 1024px) {
    .sl-uni-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .sl-uni-grid { grid-template-columns: 1fr; }
}


/* Nested Smart Intensive submenu inside the .nav-dropdown__menu */
.nav-dropdown__expand {
    border-radius: 10px;
}
.nav-dropdown__expand summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 14px;
    border-radius: 10px;
    text-decoration: none;
    color: var(--ink);
    font-weight: 600;
    font-size: 14.5px;
    line-height: 1.3;
    transition: background .15s ease, color .15s ease;
    position: relative;
}
.nav-dropdown__expand summary::-webkit-details-marker { display: none; }
.nav-dropdown__expand summary::after {
    content: "";
    position: absolute;
    right: 14px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--ink-3);
    border-bottom: 2px solid var(--ink-3);
    transform: translateY(-75%) rotate(45deg);
    transition: transform .2s ease;
}
.nav-dropdown__expand[open] summary::after {
    transform: translateY(-25%) rotate(-135deg);
}
.nav-dropdown__expand summary:hover {
    background: var(--teal-50);
    color: var(--teal-700);
}
.nav-dropdown__expand summary small {
    font-size: 12px;
    font-weight: 500;
    color: var(--ink-3);
    letter-spacing: 0;
}
.nav-dropdown__expand summary:hover small { color: var(--teal-700); opacity: 0.85; }
.nav-dropdown__sub {
    display: flex;
    flex-direction: column;
    padding: 4px 0 6px 14px;
    margin-top: 2px;
}
.nav-dropdown__sub a {
    padding: 8px 14px 8px 16px !important;
    font-size: 13.5px !important;
    font-weight: 600;
    border-left: 2px solid var(--line);
    border-radius: 0 8px 8px 0 !important;
    color: var(--ink-2);
    line-height: 1.3;
}
.nav-dropdown__sub a:hover {
    background: var(--teal-50);
    color: var(--teal-700);
    border-left-color: var(--teal-500);
}

/* Mobile drawer nested Smart Intensive submenu (inside .nav-drawer__sub).
   Выравниваем summary один-в-один с соседними `.nav-drawer__sub a`:
   тот же padding-left (38px), та же flex-column для main + small. */
.nav-drawer__nested {
    margin: 0;
    border-left: none;
}
.nav-drawer__nested > summary {
    list-style: none;
    cursor: pointer;
    position: relative;
    padding: 12px 44px 12px 38px;
    font-size: 14.5px;
    font-weight: 600;
    color: var(--ink);
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.3;
}
.nav-drawer__nested > summary::-webkit-details-marker { display: none; }
.nav-drawer__nested > summary small {
    margin: 0;
    font-size: 12px;
    font-weight: 500;
    color: var(--ink-3);
    line-height: 1.3;
}
.nav-drawer__nested > summary::after {
    content: "";
    position: absolute;
    right: 22px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--ink-3);
    border-bottom: 2px solid var(--ink-3);
    transform: translateY(-75%) rotate(45deg);
    transition: transform .2s ease;
}
.nav-drawer__nested[open] > summary::after { transform: translateY(-25%) rotate(-135deg); }
.nav-drawer__nested > a {
    display: block;
    padding: 10px 22px 10px 54px;
    font-size: 13.5px;
    color: var(--ink-2);
    font-weight: 600;
    text-decoration: none;
}
.nav-drawer__nested > a:hover { color: var(--teal-700); background: rgba(0, 0, 0, 0.03); }
.nav-drawer__nested > a.is-active { color: var(--teal-700); }

/* Catalog-download CTA on the universities hero */
.uhero__cta {
    margin-top: 24px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 22px;
}
.uhero__cta .btn {
    display: inline-flex;
    align-items: center;
}
.uhero__cta-hint {
    font-size: 13.5px;
    color: var(--ink-3);
    line-height: 1.5;
}
@media (max-width: 540px) {
    .uhero__cta .btn { width: 100%; justify-content: center; }
}

/* Smart Intensive — "Куда поступить" .sl-field cards use university codes (UK, MUNI…)
   instead of emoji; render the .sl-field__icon as a colored badge */
body[data-program^="intensive-"] .sl-field__icon {
    display: inline-grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--c1, var(--teal-400)), var(--c2, var(--teal-700)));
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.02em;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.10);
    line-height: 1;
}

/* Smart Intensive direction picker modal */
.modal__dialog--picker {
    max-width: 640px;
    max-height: calc(100vh - 40px);
    padding: 0;
    text-align: left;
    overflow: hidden;
    border-radius: 22px;
}
.modal__dialog--picker .modal__close {
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink);
    top: 14px;
    right: 14px;
}
.picker__head {
    padding: 22px 26px 18px;
    background: linear-gradient(160deg, #0f2e2a 0%, #0a2724 100%);
    color: #fff;
}
.picker__kicker {
    display: inline-block;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: 10px;
}
.picker__head h3 {
    font-size: 19px;
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    margin: 0 0 6px;
}
.picker__head p {
    margin: 0;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.45;
}
.picker__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding: 16px 18px 18px;
}
.picker__card {
    --c1: var(--teal-400);
    --c2: var(--teal-700);
    position: relative;
    display: grid;
    grid-template-columns: 38px 1fr;
    align-items: center;
    column-gap: 12px;
    row-gap: 0;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    text-decoration: none;
    color: var(--ink);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    overflow: hidden;
    min-height: 64px;
}
.picker__card::before {
    content: "";
    position: absolute;
    top: 0; bottom: 0; left: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--c1), var(--c2));
}
.picker__card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.10);
    border-color: transparent;
}
.picker__icon {
    grid-row: span 2;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--c1), var(--c2));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 19px;
    line-height: 1;
}
.picker__card h4 {
    grid-column: 2;
    margin: 0;
    font-size: 14.5px;
    font-weight: 800;
    color: var(--ink);
    line-height: 1.2;
}
.picker__card p {
    grid-column: 2;
    margin: 2px 0 0;
    font-size: 11.5px;
    color: var(--ink-3);
    line-height: 1.35;
}
.picker__card p b {
    color: var(--teal-700);
    font-weight: 800;
    font-size: 12.5px;
}
.picker__card--all {
    background: linear-gradient(135deg, var(--bg-soft), #fff);
    border-style: dashed;
}
.picker__card--all::before { display: none; }
.picker__card--all .picker__icon {
    background: #fff;
    color: var(--teal-700);
    border: 1.5px dashed var(--teal-300);
}
@media (max-width: 480px) {
    .modal__dialog--picker { max-width: calc(100vw - 24px); border-radius: 18px; }
    .picker__head { padding: 18px 20px 14px; }
    .picker__head h3 { font-size: 17px; }
    .picker__head p { display: none; }
    .picker__grid { grid-template-columns: 1fr; gap: 8px; padding: 14px 16px 16px; }
    .picker__card { padding: 10px 12px; min-height: 56px; }
    .picker__icon { width: 32px; height: 32px; font-size: 16px; }
}

/* Compact nested timeline inside an expanded .step__expand panel.
   Padding на inner — чтобы тени/glow кружков не клипались
   parent-овским overflow:hidden. */
.step__expand-inner {
    padding: 18px 8px 20px 8px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.step__expand .visa-route {
    margin: 0;
    padding: 4px 0;
    position: relative;
    list-style: none;
    align-self: stretch;
    width: 100%;
}
/* Вертикальная линия между шагами убрана по запросу пользователя. */
.step__expand .visa-route::before { display: none; }
.step__expand .visa-route__item {
    display: grid !important;
    grid-template-columns: 36px 1fr !important;
    gap: 14px !important;
    padding: 6px 0 12px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    transform: none !important;
    position: relative;
    z-index: 1;
    align-items: start !important;
}
.step__expand .visa-route__item:last-child { padding-bottom: 4px !important; }
.step__expand .visa-route__item:hover {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
}
.step__expand .visa-route__num {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700)) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    display: grid !important;
    place-items: center !important;
    box-shadow: 0 3px 8px rgba(var(--sh1),  0.28) !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.18) !important;
    letter-spacing: -0.02em !important;
    transform: none !important;
    flex-shrink: 0;
}
.step__expand .visa-route__item:hover .visa-route__num {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700)) !important;
    color: #fff !important;
    transform: none !important;
    box-shadow: 0 3px 8px rgba(var(--sh1),  0.28) !important;
}
.step__expand .visa-route__body { padding: 0; }
.step__expand .visa-route__body h3,
.step__expand .visa-route__body h4 {
    font-size: 15px;
    font-weight: 700;
    margin: 4px 0 4px;
    color: var(--ink);
    line-height: 1.3;
}
.step__expand .visa-route__body p,
.step__expand .visa-route__body > p {
    margin: 0;
    font-size: 13.5px;
    color: var(--ink-2);
    line-height: 1.5;
}

/* ============================================
   THANKS PAGE / 404 — статусные страницы (success / not-found)
   ============================================ */
.thanks {
    background: var(--bg-soft);
    /* Помещаем карточку в один экран без подвала. Хедер ~80px. */
    min-height: calc(100vh - 80px);
    display: flex;
    align-items: center;
    padding: 32px 0;
}
.thanks .container {
    width: 100%;
}
.thanks__card {
    max-width: 640px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 36px 40px;
    text-align: center;
}
.thanks__card:hover { box-shadow: 0 6px 28px rgba(var(--sh-dark),  0.05); }
.thanks__icon {
    width: 72px;
    height: 72px;
    margin: 0 auto 14px;
    color: var(--teal-600);
    animation: thanksPop .55s cubic-bezier(.34, 1.56, .64, 1) both;
}
.thanks__icon svg { width: 100%; height: 100%; display: block; }
@keyframes thanksPop {
    0%   { transform: scale(0.4); opacity: 0; }
    60%  { transform: scale(1.08); }
    100% { transform: scale(1); opacity: 1; }
}
.thanks__title {
    font-size: 30px;
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 10px;
    color: var(--ink);
    letter-spacing: -0.02em;
}
.thanks__lead {
    font-size: 15px;
    color: var(--ink-2);
    line-height: 1.55;
    margin: 0 auto 22px;
    max-width: 480px;
}
.thanks__list {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-align: left;
}
.thanks__list li {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 12px;
    align-items: center;
    padding: 10px 14px;
    background: var(--bg-soft);
    border-radius: 12px;
}
.thanks__ico {
    width: 32px;
    height: 32px;
    background: #fff;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: 16px;
    box-shadow: 0 1px 4px rgba(var(--sh-dark),  0.06);
}
.thanks__list b {
    display: block;
    font-size: 14px;
    color: var(--ink);
    font-weight: 700;
    margin-bottom: 0;
    line-height: 1.3;
}
.thanks__list p {
    margin: 0;
    font-size: 12.5px;
    color: var(--ink-2);
    line-height: 1.45;
}
.thanks__list p a {
    color: var(--teal-700);
    font-weight: 700;
    text-decoration: none;
}
.thanks__list p a:hover { text-decoration: underline; }
.thanks__actions {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

/* 404 — same shell but with a giant "404" mark and softer copy. */
.thanks--404 .thanks__icon { color: var(--teal-600); }
.thanks__bignum {
    font-size: 120px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin: 0 0 6px;
    animation: thanksPop .55s cubic-bezier(.34, 1.56, .64, 1) both;
}

@media (max-width: 640px) {
    .thanks { min-height: calc(100vh - 64px); padding: 24px 0; }
    .thanks__card { padding: 28px 20px; border-radius: 20px; }
    .thanks__title { font-size: 22px; }
    .thanks__lead { font-size: 13.5px; }
    .thanks__icon { width: 60px; height: 60px; margin-bottom: 10px; }
    .thanks__bignum { font-size: 88px; }
    .thanks__actions .btn { width: 100%; }
}

/* ============================================
   PHONE FIELD WIDGET — country code select + local number
   ============================================ */
.phone-field {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 8px;
    align-items: stretch;
    width: 100%;
}
.phone-field--with-custom {
    grid-template-columns: 130px 90px 1fr;
}
.phone-field__country,
.phone-field__code,
.phone-field__num {
    box-sizing: border-box;
    padding: 13px 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background-color: #fff;
    font: inherit;
    color: var(--ink);
    line-height: 1.2;
    min-width: 0;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.phone-field__country {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    padding: 13px 26px 13px 10px;
    font-size: 13.5px;
    font-weight: 600;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 8" fill="none" stroke="%2364748b" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M1 1l5 5 5-5"/></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 10px 7px;
}
.phone-field__country:focus,
.phone-field__code:focus,
.phone-field__num:focus {
    outline: none;
    border-color: var(--teal-500);
    box-shadow: 0 0 0 3px rgba(var(--sh1),  0.12);
}
.phone-field__code { text-align: center; font-weight: 600; }

/* Inside the dark consult form: parent rule `.consult .form--card select`
   uses the `background:` shorthand which RESETS background-repeat to its
   default (`repeat`) — the chevron SVG then tiles across the whole select.
   We must explicitly re-set repeat/position/size here to override that. */
.consult .form--card .phone-field__country,
.consult .form--card .phone-field__code,
.consult .form--card .phone-field__num {
    background-color: rgba(255, 255, 255, 0.95);
    background-repeat: no-repeat;
    border-color: transparent;
}
.consult .form--card .phone-field__country {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 8" fill="none" stroke="%23334155" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M1 1l5 5 5-5"/></svg>');
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 11px 8px;
}

/* Mobile/tablet: keep horizontal, но код всегда УЖЕ номера.
   Option-лейблы автосокращены до "+420" в JS на этом breakpoint. */
@media (max-width: 720px) {
    .phone-field { grid-template-columns: 95px 1fr; gap: 8px; }
    .phone-field--with-custom { grid-template-columns: 95px 70px 1fr; }
    .phone-field__country {
        padding: 13px 22px 13px 10px;
        font-size: 13px;
        background-position: right 8px center;
    }
}

/* ============================================
   FILTER PANE / CHIPS — blog & universities filtering
   ============================================ */
.filter-pane {
    margin-top: 40px;
    padding: 22px 24px;
    background: linear-gradient(180deg, #fff 0%, var(--bg-soft) 100%);
    border: 1px solid var(--line);
    border-radius: 22px;
    box-shadow: 0 4px 18px rgba(var(--sh-dark),  0.04);
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.filter-pane__group {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.filter-pane__label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-3);
}
/* Visually hide the underlying <select> but keep it focusable
   for the JS sync and screen-readers. */
.sr-only,
.sr-select {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.filter-chip {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border-radius: 999px;
    border: 1.5px solid var(--line);
    background: #fff;
    color: var(--ink);
    font: 600 13.5px 'Manrope', sans-serif;
    line-height: 1.2;
    white-space: nowrap;
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .15s ease, box-shadow .2s ease;
}
.filter-chip:hover {
    border-color: var(--teal-400);
    color: var(--teal-700);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(var(--sh1),  0.10);
}
.filter-chip:focus-visible {
    outline: none;
    border-color: var(--teal-500);
    box-shadow: 0 0 0 3px rgba(var(--sh1),  0.18);
}
.filter-chip.is-active {
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 16px rgba(var(--sh1),  0.32);
}
.filter-chip.is-active:hover {
    color: #fff;
    transform: translateY(-1px);
}
.filter-chip__ico {
    font-size: 14px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
}
.filter-chip__txt {
    display: inline-block;
}

/* Mobile: chips swipe-scroll horizontally so 12 cities don't pile up */
@media (max-width: 640px) {
    .filter-pane { padding: 18px 16px; border-radius: 18px; gap: 14px; }
    .filter-chips {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        margin: 0 -16px;
        padding: 2px 16px;
        scroll-padding: 16px;
    }
    .filter-chips::-webkit-scrollbar { display: none; }
    .filter-chip { flex-shrink: 0; padding: 8px 14px; font-size: 13px; }
}

/* ============================================
   FOOTER — раскрывающийся Smart Intensive
   ============================================ */
.footer__col--programs { position: relative; }
.footer__expand {
    margin: 0;
    width: 100%;
}
.footer__expand summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    color: rgba(255, 255, 255, 0.65);
    font-size: 14.5px;
    font-weight: 400;
    transition: color .15s ease;
    user-select: none;
}
.footer__expand summary::-webkit-details-marker { display: none; }
.footer__expand summary:hover { color: var(--teal-300); }
.footer__chev {
    width: 10px;
    height: 7px;
    transition: transform .2s ease;
    opacity: 0.7;
    flex-shrink: 0;
}
.footer__expand[open] .footer__chev { transform: rotate(180deg); }
.footer__expand-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 0 4px 14px;
    margin-left: 4px;
    border-left: 1px solid rgba(255, 255, 255, 0.12);
}
.footer__expand-body a {
    font-size: 13.5px;
    color: rgba(255, 255, 255, 0.55);
}
.footer__expand-body a:hover { color: var(--teal-300); }

/* Article page: использовать тёмную консультационную плашку
   (как в section.consult), но без section-padding — она внутри
   article__inner и идёт между телом статьи и related. */
.article__consult {
    padding: 0 !important;
    background: transparent !important;
    margin: 36px 0 32px;
}
.article__consult > .form--card { width: 100%; }

/* Mobile: сжимаем отступы у подвала, чтобы разделительная линия
   не была окружена пустотой. */
@media (max-width: 640px) {
    .footer__inner {
        gap: 22px;
        padding-bottom: 24px;
    }
    .footer__col { gap: 10px; }
    .footer__bottom { padding-top: 16px; padding-bottom: 24px; }
    .footer__expand summary { padding: 4px 0; }
    .footer__expand-body { padding: 8px 0 2px 14px; }
}

/* ============================================
   FILTER PILL — компактный dropdown в .cat-bar
   ============================================ */
.cat-bar__filters {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
    /* Pills прижимаются к правому краю строки и слегка заходят за
       границу container-а, чтобы не оставалось «пустого места»
       между ними и правой стороной экрана (на широких viewport
       container ограничен max-width: 1200px, пилюли могли казаться
       сидящими «по центру» правой половины). */
    margin-left: auto;
    margin-right: -12px;
}
@media (max-width: 540px) {
    .cat-bar__filters { margin-right: 0; }
}

.filter-pill { position: relative; display: inline-block; }
.filter-pill__btn {
    appearance: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px 7px 12px;
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 999px;
    font: 600 12.5px 'Manrope', sans-serif;
    color: var(--ink-2);
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    max-width: 200px;
}
.filter-pill__btn:hover {
    border-color: var(--teal-300);
    color: var(--teal-700);
}
.filter-pill.is-filtered .filter-pill__btn {
    background: var(--teal-50);
    border-color: var(--teal-300);
    color: var(--teal-700);
}
/* Префикс «тема:» / «сортировка:» скрыт визуально (оставлен в DOM
   как aria-label для screen-readers, чтобы пилюли были компактнее
   и реально жались к правому краю карточек-сетки. */
.filter-pill__label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}
.filter-pill__current {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.filter-pill__current .filter-pill__ico { font-size: 13px; line-height: 1; flex-shrink: 0; }
.filter-pill__current .filter-pill__txt {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.filter-pill__btn { max-width: 280px; }
.filter-pill__chev {
    width: 9px;
    height: 6px;
    opacity: 0.55;
    transition: transform .2s ease;
    flex-shrink: 0;
}
.filter-pill.is-open .filter-pill__chev { transform: rotate(180deg); }

.filter-pill__menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 220px;
    max-width: 280px;
    max-height: 340px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(var(--sh-dark),  0.12);
    padding: 6px;
    display: none;
    flex-direction: column;
    gap: 2px;
    z-index: 30;
}
.filter-pill.is-open .filter-pill__menu { display: flex; }

.filter-pill__item {
    appearance: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border: none;
    background: transparent;
    border-radius: 9px;
    font: 600 13.5px 'Manrope', sans-serif;
    color: var(--ink);
    text-align: left;
    transition: background .15s ease, color .15s ease;
}
.filter-pill__item:hover { background: var(--bg-soft); }
.filter-pill__item.is-active {
    background: var(--teal-50);
    color: var(--teal-700);
}
.filter-pill__item .filter-pill__ico { font-size: 14px; line-height: 1; flex-shrink: 0; }
.filter-pill__item .filter-pill__txt { flex: 1; }
.filter-pill__tick {
    color: var(--teal-600);
    font-weight: 800;
    font-size: 14px;
}

/* Cat-bar tweaks: allow filter-pills section in right corner */
.cat-bar { flex-wrap: wrap; row-gap: 10px; }
.cat-bar__reset { margin-left: 4px; }

@media (max-width: 640px) {
    /* Mobile layout: count slim row on top, filters row beneath
       with pills left-aligned and the × reset button to the right
       of the last filter pill (order: 99). */
    .cat-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    .cat-bar__count {
        text-align: left;
    }
    .cat-bar__filters {
        display: flex;                /* override inline-flex from desktop */
        justify-content: flex-start;  /* override flex-end from desktop */
        flex-wrap: wrap;
        row-gap: 8px;
        overflow: visible;
        padding: 2px 0;
        margin-left: 0;               /* override margin-left:auto */
        margin-right: 0;
        width: 100%;
    }
    .cat-bar__filters .cat-bar__reset {
        order: 99;                            /* push to end of flex children */
        margin-left: 6px;
        /* mobile filter-pill использует font-size: 12px и padding: 6px 8px 6px 10px,
           поэтому подгоняем reset под точно ту же высоту */
        padding: 6px 10px;
        font-size: 12px;
        gap: 6px;
    }
    .cat-bar__filters .cat-bar__reset__x {
        width: 14px;
        height: 14px;
        font-size: 9px;
    }
    .filter-pill__btn { font-size: 12px; padding: 6px 8px 6px 10px; }
    .filter-pill__menu { min-width: 240px; max-width: 88vw; }
}


/* Step "если вы ещё не в Чехии" badge */
.step__badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    margin-bottom: 8px;
    background: var(--teal-50);
    color: var(--teal-700);
    border: 1px solid var(--teal-200);
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.step__badge::before {
    content: "ℹ";
    font-size: 12px;
    line-height: 1;
}

/* ============================================
   NAV DROPDOWN — секции «Подготовка и поддержка» / «Только поддержка»
   разные фон-цвета (teal vs amber), чтобы блоки чётко читались
   как два разных типа предложений.
   ============================================ */
.nav-dropdown__section {
    display: flex;
    flex-direction: column;
    padding: 10px 0 8px;
    background: linear-gradient(180deg, var(--teal-50) 0%, #ffffff 100%); /* teal-50 → white (на center синий, не зелёный) */
    border-radius: 14px 14px 0 0;
}
.nav-dropdown__section + .nav-dropdown__section {
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1px solid var(--line);
    background: none;       /* сбрасываем повторный фон/скругление базовой секции — */
    border-radius: 0;       /* единый непрерывный список как на kover.center */
}
.nav-dropdown__section--support {
    /* alias — keep selector available, color set above via :nth/+ rule */
}
.nav-dropdown__section--platform {
    /* alias — отдельная подгруппа «Платформа» под «Подготовка и поддержка» */
}
.nav-dropdown__group {
    display: block;
    padding: 2px 14px 6px;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--teal-700);
    opacity: 0.75;
}
.nav-dropdown__section + .nav-dropdown__section .nav-dropdown__group {
    color: var(--teal-700);  /* акцент сайта — без жёлтого */
}
/* Несколько групп в одной секции (center): разделитель над 2-й и далее группой */
.nav-dropdown__group:not(:first-child) { margin-top: 4px; padding-top: 10px; border-top: 1px solid var(--line); }
/* Сворачиваемые группы услуг (JS вешает .nav-dropdown__group--toggle) */
.nav-dropdown__group--toggle { display: flex; align-items: center; justify-content: space-between; gap: 8px; cursor: pointer; user-select: none; transition: opacity .15s ease; }
.nav-dropdown__group--toggle:hover { opacity: 1; }
.nav-dropdown__group--toggle::after {
    content: ""; flex: none; width: 7px; height: 7px; margin: 1px 2px 0 0;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg); opacity: 0.65; transition: transform .2s ease;
}
.nav-dropdown__group--toggle.is-open::after { transform: rotate(-135deg); margin-top: 4px; }
/* Свёрнутые пункты группы (JS ставит [hidden]) — перебиваем display:flex у .nav-dropdown__menu a */
.nav-dropdown__menu [hidden] { display: none !important; }
.nav-drawer__group-label {
    display: block;
    padding: 16px 22px 6px;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--teal-700);
    opacity: 0.75;
    border-top: 1px solid var(--line);
    margin-top: 6px;
}
.nav-drawer__group-label:first-child {
    border-top: none;
    margin-top: 0;
    padding-top: 6px;
}
.nav-drawer__group-label + .nav-drawer__group-label,
.nav-drawer__group-label:nth-of-type(2) {
    color: #b45309;
}

/* Cases dropdown: footer-link «Все кейсы →» */
.nav-dropdown__cases-all {
    margin-top: 6px !important;
    padding-top: 10px !important;
    border-top: 1px dashed var(--line);
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--teal-700) !important;
    text-align: right;
}
.nav-dropdown__cases-all:hover {
    color: var(--teal-500) !important;
}

/* ============================================
   CAT-BAR RESET — «Сбросить ×» pill справа от последнего фильтра.
   Стилизована один-в-один с .filter-pill__btn (та же padding, font,
   border, radius), чтобы все плашки в ряду выглядели одинаково.
   Когда нет активных фильтров, кнопка скрыта через visibility:hidden,
   чтобы место под неё сохранялось и разделительная линия / другие
   элементы не смещались.
   ============================================ */
.cat-bar__reset {
    appearance: none;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 7px 12px;                       /* same vertical rhythm as .filter-pill__btn */
    background: #fff;
    border: 1px solid var(--line);           /* match filter pill border weight */
    border-radius: 999px;
    color: var(--ink-2);
    font: 600 12.5px 'Manrope', sans-serif;  /* match filter pill font */
    line-height: 1;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    flex-shrink: 0;
    white-space: nowrap;
}
.cat-bar__reset__x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    background: var(--bg-soft);
    border-radius: 50%;
    font-size: 10px;
    line-height: 1;
    color: var(--ink-3);
    transition: background .15s ease, color .15s ease;
}
.cat-bar__reset:hover {
    background: var(--teal-50);
    border-color: var(--teal-300);
    color: var(--teal-700);
}
.cat-bar__reset:hover .cat-bar__reset__x {
    background: var(--teal-200);
    color: var(--teal-700);
}
.cat-bar__reset.is-hidden {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

/* ============================================
   CASES — каталог + детальная страница
   ============================================ */
.page-cases { background: var(--bg-soft); }
.page-case { background: #fff; }

/* === Catalog: grid of case cards === */
.cases-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 8px;
}
.case-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 20px;
    overflow: hidden;
    text-decoration: none;
    color: var(--ink);
    transition: transform .25s ease, box-shadow .25s ease, border-color .2s ease;
}
.case-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(15, 23, 42, 0.12);
    border-color: var(--teal-300);
}
.case-card__cover {
    position: relative;
    aspect-ratio: 4 / 5;
    background-size: cover;
    background-position: center;
    background-color: var(--teal-100);
}
.case-card__cover::after {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(var(--sh-dark), 0.0) 50%, rgba(var(--sh-dark), 0.45) 100%);
}
.case-card__direction {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 1;
    padding: 5px 12px;
    background: rgba(255, 255, 255, 0.95);
    color: var(--teal-700);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    backdrop-filter: blur(6px);
}
.case-card__body {
    padding: 20px 22px 22px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1;
}
.case-card__head {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.case-card h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: var(--ink);
}
.case-card__sub {
    margin: 0;
    font-size: 13.5px;
    color: var(--ink-3);
    font-weight: 600;
}
.case-card__facts {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    flex: 1;
}
.case-card__facts > div {
    display: grid;
    gap: 3px;
    padding-top: 12px;
    border-top: 1px dashed var(--line);
}
.case-card__facts dt {
    margin: 0;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.case-card__facts dd {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.4;
    color: var(--ink-2);
}
.case-card__facts dd b {
    color: var(--ink);
    font-weight: 700;
}
.case-card__facts dd span {
    color: var(--ink-3);
    font-size: 12.5px;
}
.case-card__cta {
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    color: var(--teal-700);
    font-size: 13.5px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap .15s ease, color .15s ease;
}
.case-card:hover .case-card__cta { gap: 10px; color: var(--teal-500); }

/* === Detail page === */
.uhero--case { padding-bottom: 0; border-bottom: none; }

/* ============================================
   CASE DETAIL — 12-COL EDITORIAL BENTO
   ============================================ */

/* === HERO — 2 секции: фото слева + карточка с данными справа === */
.case-hero {
    background:
        radial-gradient(800px 500px at 100% 0%, rgba(var(--sh1), 0.08), transparent 60%),
        linear-gradient(180deg, var(--bg-soft) 0%, #fff 100%);
    padding: 32px 0 64px;
    border-bottom: 1px solid var(--line);
}
.case-hero__grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 32px;
    align-items: stretch;
}

/* LEFT: фото с overlay-статусом */
.case-hero__photo {
    position: relative;
    min-height: 540px;
    border-radius: 24px;
    background-size: cover;
    background-position: center;
    background-color: var(--teal-100);
    box-shadow: 0 28px 60px rgba(var(--sh-dark),  0.18);
    overflow: hidden;
}
.case-hero__photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(var(--sh-dark), 0.05) 0%, rgba(var(--sh-dark), 0.30) 100%);
}
.case-hero__status {
    position: absolute;
    top: 22px;
    left: 22px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px 9px 14px;
    background: rgba(255, 255, 255, 0.96);
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--teal-700);
    box-shadow: 0 8px 22px rgba(0,0,0,0.18);
}
.case-hero__status svg { color: var(--teal-500); }

/* RIGHT: карточка с именем и фактами */
.case-hero__card {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 32px 34px 30px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    box-shadow: 0 18px 44px rgba(var(--sh-dark),  0.10);
}
.case-hero__pills {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.case-hero__pill {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.case-hero__pill--field {
    background: var(--teal-50);
    color: var(--teal-700);
    border: 1px solid var(--teal-200);
}
.case-hero__pill--tuition {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fcd34d;
}
.case-hero__name {
    margin: 4px 0 0;
    font-size: clamp(28px, 3.2vw, 36px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--ink);
}
.case-hero__loc {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    font-size: 14.5px;
    color: var(--ink-3);
    font-weight: 600;
}

.case-hero__facts {
    display: grid;
    gap: 0;
    margin: 6px 0 0;
    padding: 0;
}
.case-hero__facts > div {
    display: grid;
    gap: 4px;
    padding: 12px 0;
    border-bottom: 1px dashed var(--line);
}
.case-hero__facts > div:last-child { border-bottom: none; padding-bottom: 0; }
.case-hero__facts dt {
    margin: 0;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ink-3);
}
.case-hero__facts dd {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.45;
    color: var(--ink);
    font-weight: 600;
}
.case-hero__facts dd b { color: var(--teal-700); }
.case-hero__facts dd a {
    color: var(--teal-700);
    border-bottom: 1px solid var(--teal-200);
    text-decoration: none;
}
.case-hero__facts dd a:hover { color: var(--teal-500); border-color: var(--teal-500); }

.case-hero__cta { margin-top: 4px; }

/* === BODY BLOCKS — 12-col editorial grid ===
   Все блоки на одном (белом) фоне, как на главной. Между соседними
   блоками — тонкая разделительная линия, рисуем через ::before на
   самой секции с position:absolute (важно: .container внутри секции
   ОДНОВРЕМЕННО является .case-block__grid, поэтому туда вставлять
   ::before нельзя — он становится grid-item и ломает раскладку). */
.case-block {
    padding: 56px 0;
    position: relative;
}
.case-block + .case-block::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 48px);     /* container padding 24px по бокам */
    max-width: 1152px;             /* container max-width 1200 − 2×24 */
    height: 1px;
    background: var(--line);
}
/* Alt-вариант больше не используется, селектор оставлен на legacy. */
.case-block--alt { background: transparent; }

.case-block__grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 36px;
    align-items: start;
}
.case-block__head {
    grid-column: span 4;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: sticky;
    top: 100px;
}
.case-block__num {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, var(--teal-500), var(--teal-700));
    color: #fff;
    border-radius: 14px;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.02em;
    box-shadow: 0 12px 24px rgba(var(--sh1), 0.32);
}
.case-block__kicker {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    padding: 4px 12px;
    background: var(--teal-50);
    color: var(--teal-700);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.case-block__head h2 {
    margin: 0;
    font-size: clamp(24px, 2.6vw, 32px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: var(--ink);
}
.case-block__body {
    grid-column: span 8;
    font-size: 17px;
    line-height: 1.72;
    color: var(--ink);
}
.case-block__body p { margin: 0 0 16px; }
.case-block__body p:last-child { margin-bottom: 0; }

/* Tag row under prose */
.case-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}
.case-tag {
    padding: 6px 14px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    color: var(--ink-2);
}
.case-tag b { color: var(--teal-700); }

/* Timeline (path by months) — sits inside 8-col body */
.case-timeline {
    list-style: none;
    counter-reset: phase;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 14px;
}
.case-timeline__item {
    position: relative;
    display: grid;
    grid-template-columns: 132px 1fr;
    gap: 22px;
    padding: 20px 22px;
    background: #fff;
    border: 1px solid var(--line);
    border-left: 4px solid var(--teal-500);
    border-radius: 14px;
    box-shadow: 0 6px 18px rgba(var(--sh-dark),  0.04);
    transition: transform .2s ease, box-shadow .2s ease;
}
.case-timeline__item:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(var(--sh-dark),  0.08);
}
.case-timeline__phase {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--teal-700);
}
.case-timeline__phase::before {
    counter-increment: phase;
    content: counter(phase, decimal-leading-zero);
    display: inline-block;
    width: fit-content;
    padding: 2px 8px;
    background: var(--teal-50);
    color: var(--teal-700);
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.10em;
}
.case-timeline__item p {
    margin: 0;
    font-size: 15.5px;
    line-height: 1.6;
    color: var(--ink);
}

/* Result block — bento under 4-col header */
.case-result {
    grid-column: span 8;
    display: grid;
    gap: 24px;
}
.case-result__scores {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
.case-result__score {
    padding: 22px 22px 20px;
    background: linear-gradient(160deg, #fff 0%, var(--teal-50) 100%);
    border: 1px solid var(--teal-200);
    border-radius: 18px;
    box-shadow: 0 10px 24px rgba(var(--sh1), 0.10);
}
.case-result__score-num {
    display: block;
    font-size: clamp(26px, 2.6vw, 34px);
    font-weight: 800;
    color: var(--teal-700);
    letter-spacing: -0.02em;
    line-height: 1;
    margin-bottom: 8px;
}
.case-result__score-lbl {
    display: block;
    font-size: 13px;
    color: var(--ink-2);
    font-weight: 600;
}
.case-result__list {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    margin: 0;
    padding: 0;
}
.case-result__list li {
    padding: 16px 18px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    font-size: 14.5px;
    line-height: 1.4;
    color: var(--ink);
}
.case-result__list li b {
    display: block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: var(--teal-700);
    text-transform: uppercase;
    margin-bottom: 6px;
}

/* Related-head row above other case cards */
.case-related-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 14px;
    border-bottom: 1px dashed var(--line);
}
.case-related-head h2 {
    margin: 0;
    font-size: clamp(22px, 2.4vw, 28px);
    font-weight: 800;
    letter-spacing: -0.015em;
}
.case-related-all {
    font-size: 14px;
    font-weight: 700;
    color: var(--teal-700);
    text-decoration: none;
    border-bottom: 1px solid var(--teal-200);
    transition: color .15s ease, border-color .15s ease;
}
.case-related-all:hover { color: var(--teal-500); border-color: var(--teal-500); }

/* Case CTA — повторяет inline-форму из статей (.article__consult).
   Section прозрачный, форма-карточка несёт цветной gradient сама. */
.case-consult {
    padding: 60px 0;
    background: transparent;
}

@media (max-width: 960px) {
    .cases-grid { grid-template-columns: 1fr 1fr; }
    .case-hero__grid { grid-template-columns: 1fr; gap: 22px; }
    .case-hero__photo { min-height: 320px; aspect-ratio: 16 / 10; }
    .case-block__grid { gap: 24px; }
    .case-block__head {
        grid-column: 1 / -1;
        position: static;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        gap: 14px;
    }
    .case-block__head h2 { width: 100%; }
    .case-block__body { grid-column: 1 / -1; }
    .case-result { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    .cases-grid { grid-template-columns: 1fr; }
    .case-block { padding: 44px 0; }
    .case-block__body { font-size: 16px; }
    .case-block__head h2 { font-size: 22px; }
    .case-hero { padding: 20px 0 36px; }
    .case-hero__photo { min-height: 240px; border-radius: 18px; }
    .case-hero__card { padding: 24px 20px; border-radius: 18px; }
    .case-hero__name { font-size: 24px; }
    .case-timeline__item { grid-template-columns: 1fr; gap: 10px; padding: 18px; }
    .case-result__scores { grid-template-columns: 1fr; }
    .case-result__list { grid-template-columns: 1fr; }
    .case-consult { padding: 40px 0; }
}

/* ============================================
   WHY KOVER — bento на главной (после programs)
   ============================================ */

/* ============================================
   WHY KOVER — компактные 5 плиток в одной строке
   Цель — всё помещается в один экран ноутбука (≥1024×640).
   ============================================ */
.why-kover {
    padding: var(--section-py) 0;
    background: var(--bg-soft);   /* совпадает с .programs / .consult */
}
.section-head--center { text-align: center; max-width: 760px; margin-left: auto; margin-right: auto; }
.section-head__sub { margin: 14px auto 0; font-size: 16px; line-height: 1.5; color: var(--ink-2); max-width: 640px; }

/* ===== KOVER school homepage ===== */
.hero__langs {
    list-style: none;
    margin: 0 0 30px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.hero__langs li {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.22);
    font-weight: 700;
    font-size: 15px;
    color: #fff;
}
.hero__langs-flag { font-size: 18px; line-height: 1; }

.phome-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 22px;
}
.phome-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 26px 24px;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.phome-card:hover {
    transform: translateY(-3px);
    border-color: var(--teal-300);
    box-shadow: var(--shadow-md);
}
.phome-card__icon {
    width: 52px; height: 52px;
    display: grid; place-items: center;
    border-radius: 15px;
    background: var(--teal-50);
    font-size: 26px;
    margin-bottom: 16px;
}
.phome-card h3 { font-size: 18px; line-height: 1.3; margin: 0 0 9px; color: var(--ink); }
.phome-card p { font-size: 14.5px; line-height: 1.55; color: var(--ink-2); margin: 0 0 20px; flex: 1; }
.phome-card .btn { align-self: flex-start; margin-top: auto; }

@media (max-width: 640px) {
    .phome-grid { grid-template-columns: 1fr; gap: 16px; }
    .hero__langs { gap: 9px; }
}

/* ===== Insurance calculator (kover.center /insurance) ===== */
.inscalc {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 26px;
    align-items: stretch;   /* form card matches the price card height */
}
.inscalc__form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px 20px;
    align-content: start;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 30px;
}
.inscalc__field { display: flex; flex-direction: column; gap: 9px; }
.inscalc__field--full { grid-column: 1 / -1; }
/* Компании без тарифной сетки (requestOnly) — прячем поля выбора параметров. */
.inscalc--request .inscalc__form .inscalc__field:not(.inscalc__field--full) { display: none; }
.inscalc__plans { display: flex; flex-wrap: nowrap; gap: 10px; }
@media (max-width: 620px) {
    /* На мобильных плашки страховых переносятся в несколько рядов, без горизонтальной прокрутки. */
    .inscalc__plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
}
.inscalc__plan {
    flex: 1 1 0; min-width: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
    padding: 16px 14px; min-height: 78px;
    border: 1.5px solid var(--line); border-radius: 14px; background: #fff;
    cursor: pointer; font: inherit; text-align: center; color: var(--ink);
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.inscalc__plan:hover { border-color: var(--teal-300); }
.inscalc__plan.is-active { border-color: var(--teal-500); box-shadow: inset 0 0 0 1px var(--teal-500); background: var(--teal-50); }
.inscalc__plan-logo { font-size: 21px; font-weight: 800; line-height: 1; }
.inscalc__plan img { max-height: 38px; max-width: 92%; object-fit: contain; border-radius: 8px; }
.inscalc__plan-name { font-size: 12.5px; font-weight: 600; color: var(--ink-3); }
.inscalc__plan.is-active .inscalc__plan-name { color: var(--teal-700); }
.inscalc__field > label { font-size: 14px; font-weight: 700; color: var(--ink-2); }
.inscalc__field input,
.inscalc__select select {
    width: 100%;
    font: inherit; font-size: 16px;
    padding: 13px 16px;
    border: 1.5px solid var(--line);
    border-radius: 13px;
    background: #fff; color: var(--ink);
    -webkit-appearance: none; appearance: none;
    transition: border-color .15s ease;
}
.inscalc__field input:focus,
.inscalc__select select:focus { outline: none; border-color: var(--teal-400); }
.inscalc__select { position: relative; }
.inscalc__select::after {
    content: ''; position: absolute; right: 16px; top: 50%; width: 12px; height: 8px;
    transform: translateY(-50%); pointer-events: none;
    background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%234b5b59' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
}
.inscalc__field input[type=number] { -moz-appearance: textfield; }
.inscalc__field input[type=number]::-webkit-outer-spin-button,
.inscalc__field input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
/* Кастомный select заменяет нативный — прячем родную стрелку-обёртку. */
.inscalc__select:has(.ksel)::after { display: none; }

/* ===== Custom select (.ksel) — единый дизайн выпадающих списков ===== */
.ksel { position: relative; }
.ksel__native { position: absolute; left: 0; bottom: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ksel__btn {
    width: 100%; display: flex; align-items: center; gap: 10px;
    font: inherit; font-size: 16px; text-align: left;
    padding: 13px 16px; border: 1.5px solid var(--line); border-radius: 13px;
    background: #fff; color: var(--ink); cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.ksel__value { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksel__chev { width: 12px; height: 8px; flex: none; color: var(--ink-3); transition: transform .2s ease; }
.ksel.is-open .ksel__chev { transform: rotate(180deg); }
.ksel__btn:hover { border-color: var(--teal-400); }
.ksel.is-open .ksel__btn { border-color: var(--teal-500); box-shadow: 0 0 0 3px var(--brand-ring); }
.ksel__btn:disabled { opacity: .55; cursor: not-allowed; }
.ksel__list {
    position: absolute; z-index: 60; top: calc(100% + 6px); left: 0; right: 0;
    margin: 0; padding: 6px; list-style: none;
    background: #fff; border: 1px solid var(--line); border-radius: 12px;
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.14);
    max-height: 280px; overflow-y: auto; overscroll-behavior: contain;
}
.ksel__opt { padding: 10px 12px; border-radius: 8px; font-size: 15px; color: var(--ink); cursor: pointer; line-height: 1.3; }
.ksel__opt:hover { background: var(--teal-50); color: var(--teal-700); }
.ksel__opt.is-active { background: var(--teal-50); color: var(--teal-700); font-weight: 700; }
.ksel__opt[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }

.inscalc__result {
    background: linear-gradient(160deg, var(--teal-700), var(--teal-800));
    color: #fff;
    border-radius: 22px;
    padding: 30px 28px;
    display: flex; flex-direction: column;
    text-align: center;
}
.inscalc__result-label { font-size: 14px; font-weight: 600; opacity: .85; }
.inscalc__result-price { font-size: 40px; font-weight: 800; line-height: 1.1; margin: 8px 0 2px; white-space: nowrap; }
.inscalc__result-per { font-size: 14px; opacity: .82; margin-bottom: 18px; min-height: 18px; }
.inscalc__result p { color: #fff; }  /* beat global `p { color: var(--ink-2) }` on the teal card */
.inscalc__result-band { font-size: 14px; line-height: 1.45; margin: 0 0 18px; opacity: .92; min-height: 20px; }
.inscalc__result-note {
    font-size: 13px; line-height: 1.45; margin: 0 0 18px;
    background: rgba(255, 255, 255, 0.16);
    border-radius: 12px; padding: 10px 14px;
}
.inscalc__result-note[hidden] { display: none; }
.inscalc__result-desc { font-size: 13.5px; line-height: 1.5; margin: 2px 0 16px; opacity: .9; }
.inscalc__result .btn { margin-top: auto; }
.inscalc__result .btn--primary { background: #fff; color: var(--teal-800); }
.inscalc__result .btn--primary:hover { background: rgba(255, 255, 255, 0.88); }
.inscalc__result-valid { font-size: 12px; opacity: .7; margin: 14px 0 0; min-height: 16px; }
.inscalc--empty .inscalc__result-price { font-size: 30px; }

.inscalc__disclaimer {
    margin: 22px 0 0;
    font-size: 12.5px; line-height: 1.55; color: var(--ink-3); text-align: center;
}

@media (max-width: 760px) {
    .inscalc { grid-template-columns: 1fr; gap: 18px; }
    .inscalc__form { grid-template-columns: 1fr; padding: 22px; }
    .inscalc__result { position: static; }
    .inscalc__result-price { font-size: 34px; }
}

/* ===== Insurance company cards (kover.center /insurance) ===== */
/* Страховые компании — карточки в стиле .sl-feature, кликабельны (открывают
   модалку insCoN). Плашка-логотип: буква-заглушка (позже — <img> с лого). */
.ins-co { cursor: pointer; display: flex; flex-direction: column; }
.ins-co:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.ins-co__mark span { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; line-height: 1; }
.ins-co__mark img { max-width: 38px; max-height: 38px; object-fit: contain; }
/* Лого заполняет плашку (без белых полей вокруг); плашка скруглена и клиппирует.
   Без обводки по умолчанию; синее кольцо при наведении (как у иконок преимуществ). */
.ins-co__mark--logo { background: #fff; box-shadow: none; overflow: hidden; transition: box-shadow .25s ease, transform .25s ease; }
.ins-co__mark--logo img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 0; }
.ins-co:hover .ins-co__mark--logo { box-shadow: 0 0 0 2px var(--teal-300); transform: scale(1.05); }
.ins-co__mark--wide { width: 130px; padding: 0 12px; }
.ins-co__mark--wide img { max-width: 100%; max-height: 26px; border-radius: 0; }
.ins-co__more {
    margin-top: auto;
    padding-top: 14px;
    font-size: 14px;
    font-weight: 700;
    color: var(--brand-dark);
    transition: color .18s ease;
}
.ins-co:hover .ins-co__more { color: var(--brand); }
/* Буква-логотип внутри модалки (та же плашка .upop__logo) */
.ins-co__logoletter { font-size: 24px; font-weight: 800; color: #fff; letter-spacing: -0.02em; line-height: 1; }
/* Блок «Комплексное страхование» — подзаголовок «Кому нужно» + сетка категорий */
.ins-who__h { text-align: center; font-size: 24px; font-weight: 800; letter-spacing: -0.02em; margin: 6px 0 26px; }
.ins-who__sub { text-align: center; color: var(--ink-3); max-width: 640px; margin: 0 auto 30px; line-height: 1.6; }
/* «Кому нужно» — компактные карточки, открывают поп-ап по клику */
.ins-who { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: start; }
.ins-whoc { display: flex; align-items: center; gap: 14px; padding: 16px 18px; background: #fff; border: 1px solid var(--line); border-radius: 16px; cursor: pointer; font-weight: 700; font-size: 15.5px; color: var(--ink); letter-spacing: -0.01em; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.ins-whoc:hover { border-color: var(--teal-300); box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.ins-whoc:focus-visible { outline: 2px solid var(--teal-400); outline-offset: 2px; }
.ins-whoc__ico { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; background: linear-gradient(135deg, var(--teal-400), var(--teal-700)); color: #fff; }
.ins-whoc__title { flex: 1 1 auto; min-width: 0; }
.ins-whoc__chev { flex: none; color: var(--ink-3); }
@media (max-width: 860px) { .ins-who { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .ins-who { grid-template-columns: 1fr; } .ins-whoc__body { padding-left: 18px; } }
/* 4 мини-карточки в ряд (напр. навыки на /level-check) */
.ins-who--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .ins-who--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .ins-who--4 { grid-template-columns: 1fr; } }
/* Поп-ап оформления страховки (insOrderModal) */
.ins-order__summary {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 14px 16px;
    margin: 0 0 18px;
    display: grid;
    gap: 8px;
    text-align: left;
}
.ins-order__sum-row { display: flex; justify-content: space-between; gap: 16px; font-size: 14px; }
.ins-order__sum-row > span { color: var(--ink-2); }
.ins-order__sum-row > b { color: var(--ink); font-weight: 700; text-align: right; }
.ins-order__sum-row--total { border-top: 1px solid var(--line); padding-top: 9px; margin-top: 2px; }
.ins-order__sum-row--total > b { color: var(--brand-dark); font-size: 17px; }
.ins-order__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 520px) { .ins-order__row { grid-template-columns: 1fr; } }
/* Карточка результата калькулятора: текстовые ссылки под основной кнопкой */
.inscalc__links {
    display: flex; align-items: center; justify-content: center;
    flex-wrap: wrap; gap: 6px 10px; margin-top: 14px;
}
.inscalc__link {
    background: none; border: none; cursor: pointer; font: inherit; padding: 2px 4px;
    color: rgba(255, 255, 255, 0.82); font-size: 14px; font-weight: 600;
    text-decoration: underline; text-underline-offset: 3px;
    transition: color .15s ease;
}
.inscalc__link:hover { color: #fff; }
.inscalc__link[hidden] { display: none; }
.inscalc__links-sep { color: rgba(255, 255, 255, 0.4); }
.inscalc__links-sep[hidden] { display: none; }
/* Карточка результата: структурированные детали полиса + покрытие */
.inscalc__meta {
    width: 100%; margin: 6px 0 18px; padding: 14px 16px;
    background: rgba(255, 255, 255, 0.10); border-radius: 14px;
    display: grid; gap: 12px; text-align: left;
}
.inscalc__meta-group { display: grid; gap: 8px; }
.inscalc__meta-group--cov { padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, 0.18); }
.inscalc__det-row { display: flex; justify-content: space-between; gap: 14px; font-size: 13.5px; align-items: baseline; white-space: nowrap; }
.inscalc__det-row > span { color: rgba(255, 255, 255, 0.72); }
.inscalc__det-row > b { color: #fff; font-weight: 700; text-align: right; }
.inscalc__meta-group--bonus { padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, 0.18); gap: 5px; }
.inscalc__bonus-label { color: rgba(255, 255, 255, 0.72); font-size: 13.5px; }
.inscalc__bonus-val { color: #fff; font-size: 13.5px; line-height: 1.5; font-weight: 600; }
.inscalc__meta-empty { font-size: 15px; line-height: 1.5; margin: 6px 0 14px; }

/* ===== Бесплатный подбор страховки — booking lead-magnet ===== */
.ins-book__sub { max-width: 640px; margin: 12px auto 0; color: var(--ink-3); font-size: 16px; line-height: 1.6; }
/* grid-template-columns: minmax(0,1fr) не даёт колонке раздуться по min-content
   широких детей (скролл дат, телефон) — иначе на мобильных поля вылезали за плашку. */
.ins-book__card { max-width: 920px; margin: 34px auto 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; text-align: left; }
/* Текст согласия под кнопкой брони — по центру (кнопка во всю ширину карточки). */
.ins-book__card .form__hint { text-align: center; }
.ins-book__field { display: grid; gap: 10px; }
.ins-book__label { font-weight: 700; font-size: 15px; color: var(--ink); }
.ins-book__seg { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ins-book__seg-btn,
.ins-book__chip,
.ins-book__date,
.ins-book__slot {
    font: inherit; cursor: pointer; background: #fff; color: var(--ink);
    border: 1.5px solid var(--line); transition: border-color .15s, background .15s, color .15s, box-shadow .15s;
}
.ins-book__seg-btn { padding: 14px 16px; border-radius: var(--r-btn, 12px); font-weight: 600; font-size: 15px; }
.ins-book__seg-btn:hover { border-color: var(--teal-400); }
.ins-book__seg-btn.is-active { border-color: var(--teal-600); background: var(--teal-600); color: #fff; box-shadow: var(--shadow-sm); }
.ins-book__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ins-book__chip { padding: 9px 14px; border-radius: 999px; font-weight: 600; font-size: 14px; color: var(--ink-2); }
.ins-book__chip:hover { border-color: var(--teal-400); }
.ins-book__chip.is-active { border-color: var(--teal-600); background: var(--teal-50, rgba(37, 99, 235, .08)); color: var(--teal-700); }
.ins-book__dates { display: flex; gap: 8px; }
.ins-book__date { flex: 1 1 0; min-width: 0; padding: 10px 4px; border-radius: 14px; text-align: center; display: grid; gap: 2px; }
.ins-book__date b { font-size: 20px; font-weight: 800; line-height: 1; }
.ins-book__date span { font-size: 12px; color: var(--ink-3); }
.ins-book__date:hover { border-color: var(--teal-400); }
.ins-book__date.is-active { border-color: var(--teal-600); background: var(--teal-600); }
.ins-book__date.is-active b, .ins-book__date.is-active span { color: #fff; }
.ins-book__slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 8px; }
/* На ПК все 9 слотов времени (9:00–17:00) помещаются в одну строку. */
@media (min-width: 720px) { .ins-book__slots { grid-template-columns: repeat(9, 1fr); } }
.ins-book__slot { padding: 11px 8px; border-radius: 12px; font-weight: 700; font-size: 15px; text-align: center; }
.ins-book__slot:hover { border-color: var(--teal-400); }
.ins-book__slot.is-active { border-color: var(--teal-600); background: var(--teal-600); color: #fff; box-shadow: var(--shadow-sm); }
.ins-book__slot.is-taken { cursor: not-allowed; background: var(--bg-soft, #f1f4f9); color: var(--ink-4, #9aa3b2); border-color: transparent; display: grid; gap: 1px; line-height: 1.05; }
.ins-book__slot.is-taken > span { text-decoration: line-through; font-weight: 600; font-size: 14px; }
.ins-book__slot.is-taken > i { font-style: normal; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; opacity: .8; }
.ins-book__scarcity { font-size: 12.5px; color: var(--ink-3); line-height: 1.5; margin: 2px 0 0; }
.ins-book__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.ins-book__grid label { display: grid; gap: 6px; }
.ins-book__grid-wide { grid-column: 1 / -1; }
@media (max-width: 768px) {
    .ins-book__dates { overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
    .ins-book__date { flex: 0 0 58px; }
}
@media (max-width: 600px) {
    .ins-book__card { padding: 24px 18px; }
    .ins-book__grid, .ins-book__seg { grid-template-columns: 1fr; }
}
/* Форма записи на всю ширину, 2 колонки: слева формат/дата/время, справа контакты */
.ins-book__card--split {
    max-width: none;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 30px 44px;
    align-items: start;
}
.ins-book__col { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.ins-book__contacts { display: flex; flex-direction: column; gap: 16px; }
.ins-book__contacts label { display: grid; gap: 6px; }
.ins-book__card--split .ins-book__dates { overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.ins-book__card--split .ins-book__date { flex: 0 0 56px; }
.ins-book__card--split .ins-book__slots { grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); }
.ins-book__card--split .form__hint { text-align: left; }
@media (max-width: 860px) {
    .ins-book__card--split { grid-template-columns: 1fr; gap: 22px; }
}

/* ===== Court translations page (tr-*) ===== */
.sl-section__lead { max-width: 720px; margin: 14px auto 0; color: var(--ink-3); font-size: 16px; line-height: 1.65; text-align: center; }
.tr-when-h { text-align: center; font-size: 22px; font-weight: 800; margin: 40px 0 22px; color: var(--ink); }
.tr-uses { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.tr-use { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 22px; display: flex; gap: 14px; align-items: flex-start; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.tr-use:hover { border-color: var(--teal-300); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.tr-use__icon { font-size: 26px; line-height: 1; flex: none; }
.tr-use p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--ink-2); }
.tr-prices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; max-width: 760px; margin: 0 auto; }
.tr-price { background: linear-gradient(160deg, var(--teal-700), var(--teal-800)); color: #fff; border-radius: 22px; padding: 32px 28px; text-align: center; display: grid; gap: 4px; align-content: start; }
.tr-price__val { font-size: 40px; font-weight: 800; line-height: 1.05; }
.tr-price__unit { font-size: 14px; opacity: .82; }
.tr-price__lang { margin-top: 12px; font-size: 15px; font-weight: 600; opacity: .96; }
.tr-price-note { max-width: 720px; margin: 22px auto 0; text-align: center; font-size: 14px; line-height: 1.6; color: var(--ink-3); }
.tr-price-cta { text-align: center; margin-top: 22px; }
@media (max-width: 860px) { .tr-uses { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .tr-uses, .tr-prices { grid-template-columns: 1fr; } }

/* ===== Home services grid (svc-*) ===== */
.svc-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.svc-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 24px 22px; text-decoration: none; color: inherit; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.svc-card:hover { border-color: var(--teal-300); box-shadow: var(--shadow-md); transform: translateY(-3px); }
.svc-card__icon { font-size: 30px; line-height: 1; }
.svc-card__title { margin: 12px 0 6px; font-size: 17px; font-weight: 800; color: var(--ink); }
.svc-card__desc { margin: 0 0 14px; font-size: 14px; line-height: 1.55; color: var(--ink-2); flex: 1 1 auto; }
.svc-card__arrow { color: var(--teal-600); font-weight: 800; font-size: 18px; transition: transform .2s ease; }
.svc-card:hover .svc-card__arrow { transform: translateX(4px); }
@media (max-width: 980px) { .svc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px) { .svc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 460px) { .svc-grid { grid-template-columns: 1fr; } }

/* ===== Reviews — текстовые отзывы из Google Maps ===== */
.reviews__sub { max-width: 620px; margin: 12px auto 0; color: var(--ink-3); font-size: 16px; line-height: 1.6; }
/* Masonry через CSS-колонки — карточки разной высоты пакуются без дыр. */
/* Слайдер в один ряд: горизонтальная прокрутка + одинаковая высота карточек (align-items:stretch). */
.rev-grid {
    /* overflow-x:auto делает overflow-y:auto → тень/подъём карточки при наведении
       обрезаются. Отрицательный margin по&nbsp;бокам + равный padding расширяют зону
       прокрутки на ширину контейнера, не сдвигая карточки, чтобы тень помещалась
       по бокам; запас сверху/снизу — для вертикальной тени. */
    /* БЕЗ бокового bleed: трек = контент-бокс .container → ровно 3 карточки, без
       подглядывания 4-й, первая карточка ровно на контент-крае (как в других блоках).
       Верхний отрицательный margin (-20) гасит padding-top (нужный для тени при
       hover), чтобы отступ «заголовок → карточки» совпадал с другими блоками
       (= margin-bottom у .section-head). scroll-padding-left 0 = padding-left 0 →
       snap отдыхает на scrollLeft 0, стрелка «назад» корректно скрыта в начале.
       Минус: горизонтальная тень крайних карточек слегка подрезается overflow —
       приемлемо ради точного выравнивания (приоритет пользователя). */
    margin: -20px 0 0;
    display: flex; gap: 20px;
    overflow-x: auto; scroll-snap-type: x mandatory;
    padding: 20px 0 40px;
    scroll-padding-left: 0;
    -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
    scrollbar-width: none;
}
.rev-grid::-webkit-scrollbar { display: none; }
.rev-card {
    /* ровно 3 карточки на ширину контейнера — следующая не «подглядывает», листаем стрелками */
    flex: 0 0 calc((100% - 40px) / 3); scroll-snap-align: start;
    display: flex; flex-direction: column;
    background: #fff; border: 1px solid var(--line); border-radius: 18px;
    padding: 22px 22px 20px;
    transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease;
}
@media (max-width: 1100px) { .rev-card { flex-basis: calc((100% - 20px) / 2); } }
/* Мобильная версия: ровно одна карточка на ширину контента, БЕЗ подглядывания
   следующей — листается стрелками (как на десктопе, по просьбе пользователя). */
@media (max-width: 640px)  { .rev-card { flex-basis: 100%; } }
/* На мобиле убираем боковой bleed: слайдер выравнивается по .container, у первой
   и крайней карточек симметричные отступы как у других блоков (тень при hover на
   тач-устройствах не показывается — bleed под неё не нужен). Правый bleed задаётся
   на .reviews__slider (margin-right) и .reviews__grid--slider (padding-right) —
   перекрываем именно их, иначе срабатывает их бо́льшая специфичность. */
@media (max-width: 640px) {
    .rev-grid { margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }
    .reviews .reviews__slider { margin-right: 0; }
    .reviews .reviews__grid--slider { padding-right: 0; }
}
/* тень помещается в padding контейнера (blur 22 < бок. padding 24) — не обрезается */
.rev-card:hover { border-color: var(--teal-300); box-shadow: 0 12px 22px rgba(var(--sh-dark), 0.12); transform: translateY(-2px); }
.rev-card__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.rev-card__avatar {
    width: 44px; height: 44px; border-radius: 50%; flex: none;
    display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 18px;
    background: var(--teal-600);
}
.rev-card:nth-child(4n+2) .rev-card__avatar { background: #6366f1; }
.rev-card:nth-child(4n+3) .rev-card__avatar { background: #f59e0b; }
.rev-card:nth-child(4n+4) .rev-card__avatar { background: #ec4899; }
.rev-card__meta { display: grid; gap: 2px; min-width: 0; }
.rev-card__name { font-weight: 700; font-size: 15px; color: var(--ink); }
.rev-card__stars { color: #fbbc04; font-size: 14px; letter-spacing: 1.5px; line-height: 1; }
.rev-card__g { width: 20px; height: 20px; margin-left: auto; flex: none; }
/* Обрезаем длинные отзывы — карточки в слайдере одинаково высокие и аккуратные. */
.rev-card__text { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 9; line-clamp: 9; -webkit-box-orient: vertical; overflow: hidden; }
.reviews__cta { text-align: center; margin-top: 18px; }

/* Первая карточка-CTA «500+ отзывов на Google» вместо кнопки под слайдером */
.rev-card--cta {
    text-decoration: none;
    align-items: center; justify-content: center; text-align: center; gap: 16px;
    background: linear-gradient(155deg, var(--teal-600), var(--teal-500));
    border-color: transparent; color: #fff;
}
.rev-card--cta:hover { border-color: transparent; }
.rev-cta__g {
    width: 60px; height: 60px; border-radius: 50%; background: #fff;
    display: grid; place-items: center; box-shadow: 0 8px 20px rgba(var(--sh-dark), 0.18);
}
.rev-cta__g svg { width: 32px; height: 32px; }
.rev-cta__rating { display: inline-flex; align-items: center; gap: 10px; line-height: 1; }
.rev-cta__rating b { font-size: 34px; font-weight: 800; letter-spacing: -0.02em; }
.rev-cta__stars { color: #ffd152; font-size: 19px; letter-spacing: 2px; }
.rev-cta__count { font-size: 16px; font-weight: 700; color: rgba(255, 255, 255, 0.92); max-width: 16ch; }
.rev-cta__link {
    margin-top: 4px; font-weight: 700; font-size: 14.5px; color: #fff;
    text-decoration: underline; text-underline-offset: 3px;
}
.rev-card--cta:hover .rev-cta__link { text-decoration: none; }

/* Карта лояльности — список скидок партнёров в поп-апе преимущества */
.loyalty-cats { display: grid; gap: 18px; margin-top: 14px; }
.loyalty-cat h4 {
    display: inline-block;
    font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
    color: var(--brand-dark); background: var(--brand-soft);
    margin: 0 0 14px; padding: 6px 14px; border-radius: 999px;
}
.loyalty-cat ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.loyalty-cat li {
    position: relative; padding-left: 16px;
    font-size: 14px; line-height: 1.5; color: var(--ink-2);
}
.loyalty-cat li::before {
    content: ""; position: absolute; left: 0; top: 8px;
    width: 6px; height: 6px; border-radius: 50%; background: var(--brand);
}
.loyalty-cat li b { color: var(--ink); font-weight: 700; }
@media (min-width: 620px) { .loyalty-cat ul { grid-template-columns: 1fr 1fr; gap: 8px 22px; } }


.why-row {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin-top: 36px;
}

.why-tile {
    display: flex;
    flex-direction: column;
    padding: 22px 20px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    transition: background .35s ease, border-color .35s ease, box-shadow .35s ease, transform .25s ease;
}
/* Hover как у шагов «Как работает Smart» (.visa-route--full .__item:hover):
   светло-тиловый fill, teal-300 border, мягкая тиловая тень, lift -2px.
   Плашка-иконка инвертируется (белый bg + teal текст, scale 1.06). */
.why-tile:hover {
    background: var(--teal-50);
    border-color: var(--teal-300);
    box-shadow: 0 14px 32px rgba(var(--sh1),  0.14);
    transform: translateY(-2px);
}
.why-tile__plate {
    transition: transform .35s cubic-bezier(.5,0,.3,1.4), background .35s ease, color .35s ease, box-shadow .35s ease;
}
.why-tile:hover .why-tile__plate--icon {
    background: #fff;
    color: var(--teal-700);
    transform: scale(1.06);
    box-shadow: 0 8px 20px rgba(var(--sh1),  0.20), 0 0 0 2px var(--teal-300);
}
.why-tile:hover .why-tile__plate--photo {
    transform: scale(1.04);
    box-shadow: 0 10px 24px rgba(var(--sh1),  0.22);
}

.why-tile__top {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
    min-height: 52px;     /* совпадает с высотой .why-tile__plate */
}
/* Единая плашка-верх для всех 5 tile'ов: квадрат 52×52, border-radius 14.
   Варианты различаются только содержимым (.--icon → SVG на бледном фоне,
   .--photo → фотография с background-image). */
.why-tile__plate {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background-size: cover;
    background-position: center top;
    background-color: var(--teal-100);
    overflow: hidden;
}
.why-tile__plate--icon {
    background: var(--teal-50);
    color: var(--teal-700);
}
.why-tile__plate--photo {
    box-shadow: 0 4px 12px rgba(var(--sh-dark), 0.10);
}

.why-tile h3 {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.01em;
    color: var(--ink);
}
.why-tile p {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--ink-2);
}
.why-tile__link {
    margin-top: auto;
    padding-top: 12px;
    color: var(--teal-700);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: color .15s ease;
}
.why-tile__link:hover { color: var(--teal-500); }

/* Стиль плашек — синхронизирован с .step (блок «Как работает наша программа»):
   default — белый фон + line border; hover — teal-50 + teal-300 border + lift. */
.why-tile--teal {
    background: #fff;
    border: 1px solid var(--line);
    transition: background .45s ease, border-color .45s ease, box-shadow .45s ease, transform .25s ease;
}
.why-tile--teal:hover {
    background: var(--teal-50);
    border-color: var(--teal-300);
    box-shadow: 0 14px 32px rgba(var(--sh1),  0.14);
    transform: translateY(-2px);
}
.why-tile--teal .why-tile__plate--icon {
    background: var(--teal-50);
    color: var(--teal-700);
}
.why-tile--teal:hover .why-tile__plate--icon {
    background: #fff;
    transform: scale(1.06);
    box-shadow: 0 8px 20px rgba(var(--sh1),  0.20), 0 0 0 2px var(--teal-300);
}
.why-tile--teal h3 { color: var(--ink); }
.why-tile--teal p { color: var(--ink-2); }
.why-tile--teal p b { color: var(--teal-700); }
.why-tile--teal .why-tile__list li b { color: var(--teal-700); }
.why-tile__more {
    margin-top: auto;
    padding: 10px 0 0;
    background: none;
    border: 0;
    color: var(--teal-700);
    /* НЕ задаём font-family укороченным стеком ('Manrope', sans-serif): стрелки → нет
       в Manrope, она падает на fallback, и обрезанный стек давал sans-serif вместо
       system-ui (как у .sl-feature__more) → «разные символы» стрелок. Наследуем
       полный стек от body (Manrope, system-ui, …), чтобы → совпадала во всех кнопках. */
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    text-align: left;
    align-self: flex-start;
    transition: color .15s ease, transform .15s ease;
}
.why-tile__more:hover {
    color: var(--teal-500);
    transform: translateX(2px);
}

/* WHY detail popup body — стилизован как .upop (университетский попап) */
.why-pop { padding: 0; }
.why-pop__head {
    text-align: center;
    margin-bottom: 24px;
    padding: 28px 8px 0;
}
.why-pop__icon {
    display: inline-grid;
    place-items: center;
    width: 64px; height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal-400), var(--teal-700));
    color: #fff;
    margin: 0 auto 14px;
    box-shadow: 0 8px 22px rgba(var(--sh1),  0.32);
}
.why-pop__head h3 {
    margin: 0 0 10px;
    font-size: 24px;
    letter-spacing: -0.015em;
    color: var(--ink);
}
.why-pop__head p {
    margin: 0;
    font-size: 15.5px;
    line-height: 1.55;
    color: var(--ink-2);
    max-width: 480px;
    margin: 0 auto;
}
.why-pop__list {
    list-style: none;
    margin: 0;
    padding: 0 8px 20px;
    display: grid;
    gap: 12px;
}
.why-pop__list li {
    position: relative;
    padding: 14px 16px 14px 44px;
    background: var(--teal-50);
    border-radius: 14px;
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--ink);
}
.why-pop__list li::before {
    content: "✓";
    position: absolute;
    left: 16px;
    top: 14px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--teal-700);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    display: grid;
    place-items: center;
}
.why-pop__list li b { color: var(--teal-700); }
@media (max-width: 540px) {
    .why-pop__head { padding: 20px 6px 0; }
    .why-pop__head h3 { font-size: 20px; }
    .why-pop__head p { font-size: 14px; }
    .why-pop__list li { padding: 12px 14px 12px 40px; font-size: 13.5px; }
}

.why-tile__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 6px;
}
.why-tile__list li {
    position: relative;
    padding-left: 14px;
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--ink-2);
}
.why-tile__list li::before {
    content: "";
    position: absolute;
    left: 0; top: 7px;
    width: 5px; height: 5px;
    background: var(--teal-500);
    border-radius: 50%;
}
.why-tile__list b {
    color: var(--ink);
    font-weight: 800;
}
.why-tile__list em {
    color: #b45309;
    font-style: normal;
    font-weight: 700;
}

/* === TABLET (≤960): 3 + 2 layout === */
@media (max-width: 960px) {
    .why-row {
        grid-template-columns: repeat(3, 1fr);
        gap: 14px;
    }
}
/* === SMALL TABLET (≤720): 2 кол === */
@media (max-width: 720px) {
    .why-row { grid-template-columns: repeat(2, 1fr); }
}
/* === MOBILE (≤480): 1 кол === */
@media (max-width: 480px) {
    .why-row { grid-template-columns: 1fr; }
}

/* --- Minimal header (только лого + языки, без навигации) --- */
.webinar-header {
    padding: 22px 0;
    border-bottom: 1px solid var(--line);
    background: #fff;
}
.webinar-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

/* ============================================
   FORTUNE WHEEL — /fortune lead-gen page
   ============================================ */
.page-fortune {
    background:
        radial-gradient(800px 600px at 20% 10%, rgba(var(--sh1), 0.18), transparent 60%),
        radial-gradient(700px 500px at 90% 90%, rgba(251,191,36,0.14), transparent 60%),
        radial-gradient(600px 400px at 50% 50%, rgba(var(--sh3), 0.10), transparent 60%),
        linear-gradient(160deg, #ecfdf5 0%, #fff 50%, #fef3c7 100%);
    min-height: 100vh;
    position: relative;
    overflow: hidden;
}
/* Декоративные плавающие «конфетти» круги в фоне */
.page-fortune::before, .page-fortune::after {
    content: '';
    position: fixed;
    pointer-events: none;
    border-radius: 50%;
    filter: blur(40px);
    z-index: 0;
}
.page-fortune::before {
    width: 380px; height: 380px;
    top: -100px; left: -100px;
    background: radial-gradient(circle, rgba(var(--sh3), 0.5), transparent 70%);
    animation: fortuneFloat 18s ease-in-out infinite;
}
.page-fortune::after {
    width: 320px; height: 320px;
    bottom: -100px; right: -80px;
    background: radial-gradient(circle, rgba(251,191,36,0.45), transparent 70%);
    animation: fortuneFloat 22s ease-in-out infinite reverse;
}
@keyframes fortuneFloat {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33%      { transform: translate(60px, 40px) scale(1.1); }
    66%      { transform: translate(-30px, 60px) scale(0.95); }
}
.page-fortune > * { position: relative; z-index: 1; }

/* Главный экран — точно по высоте viewport, без скролла.
   Header сайта ~72px, фоновый страничный padding 12px×2 = 24px,
   итого .fortune занимает оставшееся пространство и центрирует
   контент. */
.fortune {
    min-height: calc(100vh - 72px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 0;
}
/* === LAYOUT: title, stage (chips|wheel|chips), CTA — всё в 1 экран === */
.fortune__layout {
    max-width: 1100px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}
.fortune__head {
    text-align: center;
    max-width: 640px;
}
.fortune__h1 {
    margin: 0 0 4px;
    font-size: clamp(22px, 2.6vw, 28px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--ink);
}
.fortune__h1 .accent {
    background: linear-gradient(135deg, var(--teal-500) 0%, var(--teal-700) 50%, #f59e0b 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
.fortune__sub {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.4;
    color: var(--ink-2);
}
/* === STAGE: chips-left | wheel | chips-right === */
.fortune__stage {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 20px;
    align-items: center;
    width: 100%;
}
.fortune__chips {
    display: flex;
    flex-direction: column;
    gap: 7px;
    width: 100%;
    max-width: 200px;
}
.fortune__chips--left { justify-self: end; }
.fortune__chips--right { justify-self: start; }
/* === CHIPS (плашки с призами по бокам колеса) === */
.fortune-chip {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1.5px solid rgba(255,255,255,0.6);
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--ink);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(var(--sh-dark), 0.06);
}
/* Цветная полоска слева — индикатор партнёра */
.fortune-chip::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: var(--chip-color, var(--teal-700));
}
.fortune-chip:hover {
    transform: translateX(2px);
    background: var(--chip-bg, #fff);
    border-color: var(--chip-color, var(--teal-300));
    box-shadow: 0 8px 18px rgba(var(--sh-dark), 0.10);
}
.fortune__chips--right .fortune-chip:hover { transform: translateX(-2px); }
.fortune-chip__icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    color: var(--chip-color, var(--teal-700));
}
.fortune-chip__name {
    white-space: nowrap;
    line-height: 1.2;
}
/* Highlight winning chip после reveal (золотая пульсация) */
.fortune-chip.is-winner {
    background: linear-gradient(135deg, #fde047, #f59e0b);
    border-color: #d97706;
    color: #422006;
    transform: scale(1.08);
    box-shadow: 0 14px 32px rgba(217,119,6,0.45);
    animation: chipWinPulse 0.8s ease-out;
}
.fortune-chip.is-winner .fortune-chip__icon { color: #7c2d12; }
.fortune-chip.is-winner::before { background: #d97706; }
@keyframes chipWinPulse {
    0%   { transform: scale(1); }
    35%  { transform: scale(1.18); }
    100% { transform: scale(1.08); }
}

/* === Wheel area === */
.fortune__wheel-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    position: relative;
}
.fortune__cta-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
/* Idle glow ring под колесом — attractor для глаза */
.fortune__wheel-glow {
    position: absolute;
    inset: -20px;
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(var(--sh1), 0.45) 0%, transparent 65%),
        radial-gradient(circle, rgba(251,191,36,0.30) 0%, transparent 75%);
    z-index: 0;
    pointer-events: none;
    animation: wheelGlow 2.8s ease-in-out infinite;
    filter: blur(6px);
}
@keyframes wheelGlow {
    0%, 100% { opacity: 0.55; transform: scale(1); }
    50%      { opacity: 0.95; transform: scale(1.06); }
}
.fortune__pointer {
    width: 42px;
    height: 50px;
    color: #f59e0b;                /* amber-500 — контрастнее и заметнее на тиловом обводе */
    margin-bottom: -18px;
    z-index: 2;
    filter: drop-shadow(0 8px 16px rgba(217,119,6,0.50)) drop-shadow(0 0 4px rgba(245,158,11,0.6));
    animation: pointerBounce 1.4s ease-in-out infinite;
}
@keyframes pointerBounce {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-4px); }
}
.fortune__pointer svg { width: 100%; height: 100%; }
.fortune__wheel-wrap {
    position: relative;
    /* Адаптируется к высоте viewport — гарантированно влезает в экран.
       max — наибольший разумный размер, vh — пропорция от высоты экрана. */
    width: min(380px, 56vh, 70vw);
    height: min(380px, 56vh, 70vw);
    border-radius: 50%;
    padding: 10px;
    box-sizing: border-box;
    background:
        radial-gradient(circle at 50% 30%, rgba(255,255,255,0.25), transparent 60%),
        linear-gradient(135deg, var(--teal-700) 0%, var(--teal-500) 50%, var(--teal-700) 100%);
    box-shadow:
        0 32px 70px rgba(var(--sh-dark), 0.30),
        inset 0 0 0 6px rgba(255,255,255,0.20),
        inset 0 -8px 24px rgba(0,0,0,0.15);
}
.fortune__wheel {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #fff;
    transform-origin: center;
    transition: transform 5s cubic-bezier(.17,.67,.32,.99);
}
.fortune__spin-cta {
    min-width: 240px;
    padding: 14px 30px;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.02em;
    background: linear-gradient(135deg, var(--teal-500) 0%, var(--teal-700) 100%);
    border: none;
    border-radius: 999px;
    color: #fff;
    box-shadow:
        0 12px 32px rgba(var(--sh1), 0.40),
        inset 0 -4px 0 rgba(0,0,0,0.15),
        inset 0 0 0 1px rgba(255,255,255,0.20);
    transition: transform .2s ease, box-shadow .2s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.fortune__spin-cta::after {
    /* Shine-блик, бегущий по кнопке для привлечения внимания */
    content: '';
    position: absolute;
    top: 0; left: -120%;
    width: 60%;
    height: 100%;
    background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
    animation: spinCtaShine 3s ease-in-out infinite;
}
@keyframes spinCtaShine {
    0%   { left: -120%; }
    50%  { left: 120%; }
    100% { left: 120%; }
}
.fortune__spin-cta:hover:not(:disabled) {
    transform: translateY(-3px) scale(1.03);
    box-shadow:
        0 18px 40px rgba(var(--sh1), 0.55),
        inset 0 -4px 0 rgba(0,0,0,0.15),
        inset 0 0 0 1px rgba(255,255,255,0.20);
}
.fortune__spin-cta:active:not(:disabled) {
    transform: translateY(-1px) scale(0.99);
}
.fortune__spin-cta:disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}
.fortune__spin-cta:disabled::after { animation: none; opacity: 0; }
.fortune__hint {
    margin: 0;
    font-size: 13px;
    color: var(--ink-3);
    font-weight: 600;
    text-align: center;
}

/* --- MODAL --- */
.fortune-modal {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: grid;
    place-items: center;
    padding: 20px;
}
.fortune-modal[hidden] { display: none; }
.fortune-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(var(--sh-dark), 0.70);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
.fortune-modal__dialog {
    position: relative;
    background: #fff;
    border-radius: 24px;
    padding: 32px 30px;
    max-width: 460px;
    width: 100%;
    box-shadow: 0 32px 80px rgba(0,0,0,0.45);
    animation: fortunePop .35s cubic-bezier(.5,0,.3,1.4);
    max-height: 92vh;
    overflow-y: auto;
}
@keyframes fortunePop {
    from { opacity: 0; transform: scale(0.9); }
    to   { opacity: 1; transform: scale(1); }
}

/* Mystery-gift tile (form view) — нарисованный подарок без раскрытия суммы */
.fortune-modal__mystery {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 22px 18px 18px;
    background: linear-gradient(160deg, var(--teal-50) 0%, #fff 60%, var(--teal-50) 100%);
    border: 1px solid var(--teal-200);
    border-radius: 18px;
    margin-bottom: 22px;
}
.fortune-modal__gift {
    width: 110px;
    height: 110px;
    animation: giftFloat 2.6s ease-in-out infinite;
    filter: drop-shadow(0 8px 16px rgba(15,118,110,0.20));
}
@keyframes giftFloat {
    0%, 100% { transform: translateY(0) rotate(-2deg); }
    50%      { transform: translateY(-6px) rotate(2deg); }
}
.fortune-modal__gift-sparkles {
    animation: sparkleBlink 1.8s ease-in-out infinite;
    transform-origin: center;
}
@keyframes sparkleBlink {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.4; transform: scale(0.9); }
}
.fortune-modal__mystery-text {
    margin: 6px 0 0;
    font-size: 17px;
    font-weight: 800;
    color: var(--teal-700);
    text-align: center;
}
.fortune-modal__mystery-sub {
    margin: 0;
    font-size: 12.5px;
    color: var(--ink-3);
    text-align: center;
}

.fortune-modal__title {
    margin: 0 0 8px;
    font-size: 23px;
    font-weight: 800;
    text-align: center;
    color: var(--ink);
}
.fortune-modal__text {
    margin: 0 0 18px;
    font-size: 14.5px;
    line-height: 1.55;
    color: var(--ink-2);
    text-align: center;
}
.fortune-modal__text a { color: var(--teal-700); }

.fortune-modal__form {
    display: grid;
    gap: 12px;
}
.fortune-modal__field {
    display: grid;
    gap: 4px;
}
.fortune-modal__field > span {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--ink-2);
}
.fortune-modal__field input {
    width: 100%;
    padding: 12px 14px;
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 11px;
    font: 500 15px 'Manrope', sans-serif;
    color: var(--ink);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.fortune-modal__field input:focus {
    outline: none;
    border-color: var(--teal-500);
    box-shadow: 0 0 0 4px rgba(var(--sh1), 0.15);
}

/* Reveal view */
.fortune-modal__confetti {
    display: block;
    text-align: center;
    font-size: 56px;
    margin-bottom: 6px;
    animation: fortunePop .5s cubic-bezier(.5,0,.3,1.6);
}
.fortune-modal__win-label {
    margin: 0;
    text-align: center;
    font-size: 12px;
    font-weight: 800;
    color: var(--ink-3);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.fortune-modal__prize {
    margin: 4px 0 18px;
    text-align: center;
    font-size: clamp(48px, 8vw, 64px);
    font-weight: 800;
    line-height: 1;
    color: var(--teal-700);
    letter-spacing: -0.03em;
}
.fortune-modal__win-text {
    margin: 0 0 22px;
    text-align: center;
    font-size: 14px;
    line-height: 1.55;
    color: var(--ink-2);
}
.fortune-modal__win-text b { color: var(--ink); }
.fortune-modal__cta {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
}
.fortune-modal__cta .btn { flex: 1 1 auto; }

/* --- Tablet — chips wrap below wheel --- */
@media (max-width: 860px) {
    .fortune__stage {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .fortune__chips {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        max-width: 100%;
    }
    .fortune__chips--left { order: 2; }
    .fortune__chips--right { order: 3; }
    .fortune__wheel-area { order: 1; }
}
/* --- Mobile --- */
@media (max-width: 480px) {
    .fortune { min-height: auto; padding: 16px 0 28px; }
    .fortune__layout { gap: 10px; }
    .fortune-chip { padding: 6px 10px; font-size: 11.5px; gap: 6px; }
    .fortune-chip__icon { width: 16px; height: 16px; }
    .fortune-modal { padding: 12px; }
    .fortune-modal__dialog { padding: 26px 22px; }
    .fortune-modal__mystery { padding: 18px 14px 14px; margin-bottom: 18px; }
    .fortune-modal__gift { width: 92px; height: 92px; }
    .fortune-modal__mystery-text { font-size: 15px; }
    .fortune__pointer { width: 36px; height: 42px; margin-bottom: -14px; }
}

/* ============================================
   KOVER center (/kover-center) — site-specific helpers
   ============================================ */
/* Lead paragraph under a centered section head */
.section-head__lead {
    max-width: 640px;
    margin: 14px auto 0;
    color: var(--ink-2);
    font-size: 17px;
    line-height: 1.6;
}
/* Small muted note centered under a block */
.section-note {
    text-align: center;
    margin-top: 24px;
    color: var(--ink-3);
    font-size: 15px;
}
/* Numbered step inside an icon plate (process section) */
.why-tile__plate--icon b {
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
}
/* Consult form: textarea matches the teal-card inputs */
.consult .form--card textarea {
    width: 100%;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--r-btn);
    padding: 12px 14px;
    font: inherit;
    font-size: 15px;
    color: var(--ink);
    resize: vertical;
    min-height: 84px;
}
.consult .form--card textarea::placeholder { color: var(--ink-3); }
.consult .form--card textarea:focus {
    outline: none;
    border-color: var(--teal-400);
    box-shadow: 0 0 0 3px var(--brand-ring, rgba(var(--sh1), 0.18));
}
/* Full-width field inside the 2-col form grid */
.form__field--full { grid-column: 1 / -1; }

/* Contacts block */
.kc-contacts { padding: var(--section-py) 0; background: var(--bg-soft); }
.kc-contacts__grid {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 32px;
    align-items: stretch;
    margin-top: 8px;
}
.kc-contacts__list {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: 18px;
    align-self: center;
}
.kc-contacts__list li { display: flex; flex-direction: column; gap: 4px; }
.kc-contacts__label {
    font-size: 12px; text-transform: uppercase; letter-spacing: .05em;
    color: var(--ink-3); font-weight: 700;
}
.kc-contacts__value { font-size: 18px; color: var(--ink); font-weight: 600; text-decoration: none; }
a.kc-contacts__value:hover { color: var(--teal-600); }
.kc-contacts__map {
    border-radius: var(--r-card);
    overflow: hidden;
    min-height: 320px;
    border: 1px solid var(--line);
}
.kc-contacts__map iframe { width: 100%; height: 100%; min-height: 320px; border: 0; display: block; }
@media (max-width: 760px) {
    .kc-contacts__grid { grid-template-columns: 1fr; }
}

/* ===== Payment page (/payment) ===== */
/* Секция занимает весь экран ниже шапки (header 76px) и центрирует форму */
.pay-section {
    min-height: calc(100vh - 76px);
    min-height: calc(100dvh - 76px);
    display: flex;
    align-items: center;
    padding: 40px 0;
}
.pay-section > .container { width: 100%; }
.pay-wrap { max-width: 620px; margin: 0 auto; }
.pay-section .section-head { margin-bottom: 0; }
.pay-section h1 { font-size: 40px; line-height: 1.1; }
@media (max-width: 640px) {
    .pay-section { min-height: calc(100vh - 64px); min-height: calc(100dvh - 64px); padding: 28px 0; }
    .pay-section h1 { font-size: 28px; }
}
.pay-form {
    margin-top: 24px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 28px;
}
.pay-form__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
    margin-bottom: 20px;
}
.pay-form label {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink-2);
}
.pay-form input {
    width: 100%;
    padding: 14px 16px;
    border: 1.5px solid var(--line);
    border-radius: 14px;
    font: inherit;
    font-size: 15px;
    color: var(--ink);
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.pay-form input::placeholder { color: var(--ink-3); }
.pay-form input:focus {
    outline: none;
    border-color: var(--teal-500);
    box-shadow: 0 0 0 3px rgba(var(--sh1),  0.15);
}
/* Сумма + выбор валюты (Kč / €) в одной строке */
.pay-amount { display: flex; gap: 8px; }
.pay-amount__input { flex: 1 1 auto; width: auto; min-width: 0; -moz-appearance: textfield; appearance: textfield; }
/* убираем нативные стрелки вверх-вниз у поля суммы */
.pay-amount__input::-webkit-outer-spin-button,
.pay-amount__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pay-amount__cur {
    flex: 0 0 auto;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 14px 40px 14px 16px;
    border: 1.5px solid var(--line);
    border-radius: 14px;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%2364748b' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 12px 8px;
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.pay-amount__cur::-ms-expand { display: none; }
.pay-amount__cur:focus {
    outline: none;
    border-color: var(--teal-500);
    box-shadow: 0 0 0 3px rgba(var(--sh1),  0.15);
}
.pay-form__submit { margin-top: 4px; }
.pay-form__secure {
    margin-top: 14px;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--ink-3);
    text-align: center;
}
.pay-form__msg--error {
    margin-top: 12px;
    font-size: 13.5px;
    font-weight: 600;
    color: #dc2626;
    text-align: center;
}
@media (max-width: 560px) {
    .pay-form { padding: 20px; }
    .pay-form__grid { grid-template-columns: 1fr; }
}

/* ===== Individual lessons: calculator + tariff cards (/individual) ===== */
.calc {
    max-width: 820px;
    margin: 0 auto 32px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 32px;
}
.calc__controls {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 26px 40px;
    align-items: start;
    margin-bottom: 26px;
}
.calc__field-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 14px;
    font-weight: 600;
    color: var(--ink-2);
    margin-bottom: 14px;
}
.calc__lessons-val { font-size: 22px; font-weight: 800; color: var(--teal-700); }
.calc__range {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 8px;
    border-radius: 999px;
    background: var(--line);
    outline: none;
    cursor: pointer;
}
.calc__range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--teal-500);
    border: 3px solid #fff;
    box-shadow: 0 1px 5px rgba(var(--sh-dark),  0.25);
    cursor: pointer;
}
.calc__range::-moz-range-thumb {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--teal-500);
    border: 3px solid #fff;
    box-shadow: 0 1px 5px rgba(var(--sh-dark),  0.25);
    cursor: pointer;
}
.calc__range-scale {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: var(--ink-3);
    margin-top: 8px;
}
.calc__toggle {
    display: inline-flex;
    border: 1.5px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
}
.calc__opt {
    padding: 12px 22px;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    color: var(--ink-2);
    background: #fff;
    border: none;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.calc__opt + .calc__opt { border-left: 1.5px solid var(--line); }
.calc__opt.is-active { background: var(--teal-500); color: #fff; }
.calc__result {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    padding: 22px 24px;
    background: var(--bg-soft);
    border-radius: 18px;
}
.calc__res-item { display: flex; flex-direction: column; gap: 6px; }
.calc__res-item > span { font-size: 13px; color: var(--ink-3); }
.calc__res-item > strong { font-size: 23px; font-weight: 800; color: var(--ink); }
.calc__res-item--total > strong { color: var(--teal-700); }
.calc__tier-name { letter-spacing: 0.04em; }
.calc__note { margin: 18px 0 20px; font-size: 13px; line-height: 1.5; color: var(--ink-3); text-align: center; }
/* calculator shown inside a popup — clean header + consistent padding */
#calcModal .modal__dialog--xl { padding: 36px 40px; overflow-y: auto; }
.calc-modal__title { margin: 0 0 6px; font-size: 24px; font-weight: 800; color: var(--ink); }
.calc-modal__lead { margin: 0 0 26px; font-size: 14.5px; line-height: 1.55; color: var(--ink-2); }
#calcModal .calc { max-width: none; margin: 0; padding: 0; border: none; box-shadow: none; background: none; }
.calc__cta { margin-bottom: 0; }

/* tariff cards reuse the .sl-price card chrome (teal hover highlight + button flip) */
.ind-tariffs .sl-price__name { color: var(--teal-700); }
.ind-tariffs .sl-price:hover .sl-price__name,
.ind-tariffs:not(:has(.sl-price:hover)) .sl-price--best .sl-price__name { color: #fff; }
.ind-tariff__prices { margin-top: 2px; }
.ind-tariff__label { display: block; font-size: 11.5px; font-weight: 700; color: var(--sl-meta); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 10px; }
.ind-tariff__prices ul { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.ind-tariff__prices li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 14.5px; color: var(--sl-color-2); }
.ind-tariff__prices b { font-size: 16px; font-weight: 800; color: var(--sl-color); white-space: nowrap; }
.ind-tariffs__note { margin-top: 22px; text-align: center; font-size: 13.5px; color: var(--ink-3); }

@media (max-width: 640px) {
    .calc { padding: 22px; }
    .calc__controls { grid-template-columns: 1fr; gap: 22px; }
    .calc__result { grid-template-columns: 1fr; gap: 14px; text-align: center; }
    .calc__res-item { align-items: center; }
    #calcModal .modal__dialog--xl { padding: 26px 20px; }
}