/*
 * KursMap — макет публичной части и лендинг главной (EM-007.1).
 *
 * Источник — design/assets/landing.css (EM-003b, после правок Д-1…Д-8)
 * с правками Д-9…Д-14 из design/review-landing.md. Отличия от прототипа —
 * только там, где реальная разметка другая:
 *   - секции блоков H-* — это `<section data-link-zone data-link-block>`
 *     зоны ядра без внутренних `div`: ширину содержимого задаёт отступ
 *     самой секции (`--edu-band-pad`), а не `.digi-wrap`;
 *   - «каталог в цифрах» и числа центров на плитках не выводятся, пока
 *     нет счётчиков из базы.
 * Значения — только токены `--digi-*` темы и `--edu-*` проекта
 * (resources/css/tokens.css). Mobile-first: 30em, 40em, 48em, 64em, 80em.
 */

/* ================================================================ макет */

/* Отступ, который выравнивает содержимое полноширинной секции по .digi-wrap. */
:root { --edu-band-pad: max(var(--digi-space-4), calc((100% - var(--digi-width)) / 2 + var(--digi-space-4))); }

.digi-header { position: relative; z-index: 20; }

/* G-NAV-2 «Направления», G-NAV-3 «Города» — раскрывающиеся списки шапки.
   Все ссылки в HTML, `<details>` открывается без JS; панель лежит поверх
   страницы (position: absolute), поэтому открытие не двигает макет. */
.edu-catnav [data-digi-zone="nav"] { display: flex; flex-wrap: wrap; gap: var(--digi-space-1); }
.edu-catnav__menu > summary {
    display: inline-flex;
    align-items: center;
    gap: var(--digi-space-2);
    min-height: 2.75rem;
    padding-inline: var(--digi-space-3);
    border-radius: var(--digi-radius-sm);
    cursor: pointer;
    list-style: none;
    color: var(--digi-color-fg);
}
.edu-catnav__hubs { display: flex; flex-wrap: wrap; gap: var(--digi-space-1); margin: 0; padding: 0; list-style: none; }
/* G-NAV-1 «Учебные центры», «Репетиторы» — ссылки верхнего уровня, вид как у summary, без стрелки. */
.edu-catnav__hubs a {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding-inline: var(--digi-space-3);
    border-radius: var(--digi-radius-sm);
    color: var(--digi-color-fg);
    font-weight: 600;
    text-decoration: none;
}
.edu-catnav__hubs a:hover { background: var(--digi-color-surface); }
.edu-catnav__menu > summary::-webkit-details-marker { display: none; }
.edu-catnav__menu > summary::after {
    content: "";
    width: .45em;
    height: .45em;
    border-inline-end: 2px solid currentColor;
    border-block-end: 2px solid currentColor;
    transform: translateY(-.15em) rotate(45deg);
    transition: transform .15s ease;
}
.edu-catnav__menu[open] > summary::after { transform: translateY(.1em) rotate(-135deg); }
.edu-catnav__menu > summary:hover,
.edu-catnav__menu[open] > summary { background: var(--digi-color-surface); }
.edu-catnav__menu > summary h2 { margin: 0; font: inherit; font-weight: 600; }
.edu-catnav__menu > ul {
    position: absolute;
    inset-inline: 0;
    top: 100%;
    margin: 0;
    list-style: none;
    padding: var(--digi-space-4) var(--edu-band-pad) var(--digi-space-6);
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
    gap: 0 var(--digi-space-6);
    background: var(--digi-color-bg);
    border-block: 1px solid var(--digi-color-border);
    box-shadow: var(--edu-shadow-lg);
}
.edu-catnav__menu > ul a {
    display: block;
    padding-block: var(--digi-space-2);
    color: var(--digi-color-fg);
    text-decoration: none;
    overflow-wrap: anywhere;
}
.edu-catnav__menu > ul a:hover { color: var(--digi-color-primary); text-decoration: underline; }

@media (max-width: 47.99em) {
    .edu-catnav { order: 4; width: 100%; }
    .edu-catnav__menu > summary,
    .edu-catnav__hubs a { padding-inline: var(--digi-space-2); }
    .edu-catnav__menu > ul { grid-template-columns: minmax(0, 1fr); max-height: 70vh; overflow-y: auto; }
}

/* Подвал: G-FOOT-1…3 колонками. */
.digi-footer [data-digi-zone="footer"] {
    flex: 1 1 36rem;
    display: grid;
    gap: var(--digi-space-6);
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
}
.digi-footer [data-digi-zone="footer"] h2 {
    margin: 0 0 var(--digi-space-2);
    font-size: var(--digi-text-small);
    font-weight: 700;
    color: var(--digi-color-fg);
}
.digi-footer [data-digi-zone="footer"] ul { list-style: none; margin: 0; padding: 0; }
.digi-footer [data-digi-zone="footer"] li + li { margin-top: var(--digi-space-1); }
.digi-footer [data-digi-zone="footer"] a { text-decoration: none; }
.digi-footer [data-digi-zone="footer"] a:hover { text-decoration: underline; }

/* Пагинатор: разрыв окна номеров (EM-009 Д-5+), не ссылка. */
.edu-pagination__gap { align-self: center; padding-inline: var(--digi-space-1); color: var(--digi-color-muted); }

/* ================================================================ лендинг главной */

.edu-lp-main {
    padding-block: 0;
    /* звезда в декоративной мини-карточке ярче, чем в карточке выдачи */
    --edu-star: #d97706;
}
@media (prefers-color-scheme: dark) { .edu-lp-main { --edu-star: #fbbf24; } }

/* Полноширинная секция: свои блоки лендинга и секции зоны content_end. */
.edu-lp-band,
.edu-lp-main > [data-digi-zone="content_end"] > section {
    padding-block: var(--digi-space-12);
    padding-inline: var(--edu-band-pad);
}
.edu-lp-main > [data-digi-zone="content_end"] > [data-link-block="H-3"] { background: var(--digi-color-surface); }

/* ---------------------------------------------------------------- hero */
.edu-lp-hero {
    position: relative;
    overflow: hidden;
    background: var(--edu-hero-bg);
    padding-block: var(--digi-space-8) var(--digi-space-12);
}
.edu-lp-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(22rem 16rem at 10% 20%, color-mix(in srgb, var(--edu-glow-1) 35%, transparent), transparent 70%),
        radial-gradient(20rem 18rem at 95% 25%, color-mix(in srgb, var(--edu-glow-3) 35%, transparent), transparent 70%),
        radial-gradient(26rem 14rem at 55% 105%, color-mix(in srgb, var(--edu-glow-2) 30%, transparent), transparent 70%);
}
.edu-lp-hero__inner { position: relative; }
.edu-lp-hero__text { position: relative; z-index: 1; }
.edu-lp-eyebrow {
    display: inline-flex;
    margin: 0;
    padding: var(--digi-space-1) var(--digi-space-3);
    border-radius: 999px;
    background: var(--edu-surface-raised);
    color: var(--edu-accent);
    font-size: .8125rem;
    font-weight: 600;
    box-shadow: var(--edu-shadow-lg);
}
.edu-lp-h1 {
    font-size: clamp(2rem, 1.25rem + 3.6vw, 3.5rem);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.025em;
    text-wrap: balance;
    overflow-wrap: anywhere;
    margin: var(--digi-space-4) 0;
}
/* Д-11: маркер тоньше и не заходит на следующую строку. */
.edu-lp-accent {
    color: var(--edu-accent);
    background: linear-gradient(transparent 66%, color-mix(in srgb, var(--edu-accent) 20%, transparent) 0 90%, transparent 0);
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}
.edu-lp-hero__lead {
    font-size: var(--digi-text-lead);
    color: color-mix(in srgb, var(--digi-color-muted) 60%, var(--digi-color-fg));
    max-width: 38rem;
    margin: 0 0 var(--digi-space-6);
}
.edu-lp-search .edu-search {
    border: 1px solid transparent;
    border-radius: var(--edu-radius-lg);
    background:
        linear-gradient(var(--edu-surface-raised), var(--edu-surface-raised)) padding-box,
        linear-gradient(135deg, var(--edu-glow-1), var(--edu-glow-3)) border-box;
    box-shadow: var(--edu-shadow-lg);
    padding: var(--digi-space-4);
}
.edu-lp-search .edu-search button { min-height: 3.25rem; font-weight: 700; }
.edu-lp-quick {
    margin-top: var(--digi-space-4);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--digi-space-2);
}
.edu-lp-quick__label {
    margin: 0;
    font-size: var(--digi-text-small);
    font-weight: 400;
    color: var(--digi-color-muted);
}
.edu-lp-quick .edu-chip { background: var(--edu-surface-raised); }

/* «Каталог в цифрах» (HomeStats::facts): только реальные числа; нет данных — полосы нет. */
.edu-lp-facts {
    position: relative;
    z-index: 1;
    list-style: none;
    padding: 0;
    margin: var(--digi-space-8) 0 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--digi-space-4);
}
.edu-lp-fact { margin: 0; }
.edu-lp-fact__num {
    display: block;
    font-size: clamp(1.5rem, 1.2rem + 1vw, 2.25rem);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.025em;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.edu-lp-fact__label { color: var(--digi-color-muted); font-size: var(--digi-text-small); }
.edu-lp-fact:nth-child(2n) {
    border-inline-start: 1px solid var(--digi-color-border);
    padding-inline-start: var(--digi-space-4);
}
@media (min-width: 48em) {
    .edu-lp-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .edu-lp-fact:nth-child(4n + 1) { border-inline-start: 0; padding-inline-start: 0; }
    .edu-lp-fact:nth-child(4n + 3),
    .edu-lp-fact:nth-child(4n + 4) {
        border-inline-start: 1px solid var(--digi-color-border);
        padding-inline-start: var(--digi-space-4);
    }
}
@media (min-width: 64em) {
    .edu-lp-facts { grid-column: 1 / -1; grid-row: 2; }
}

.edu-lp-hero__art { display: none; }
.edu-lp-float {
    position: absolute;
    margin: 0;
    display: inline-flex;
    gap: var(--digi-space-2);
    align-items: center;
    padding: var(--digi-space-2) var(--digi-space-3);
    border-radius: var(--digi-radius);
    background: var(--edu-surface-raised);
    box-shadow: var(--edu-shadow-lg);
    font-size: var(--digi-text-small);
    font-weight: 600;
    white-space: nowrap;
}
.edu-lp-float--1 { inset: var(--digi-space-6) auto auto -1.5rem; color: var(--digi-color-success); }
/* Д-14: мини-карточка цены — с иконкой, как соседние. */
.edu-lp-float--2 { inset: 50% -1rem auto auto; transform: translateY(-50%); }
.edu-lp-float--2 svg { color: var(--digi-color-primary); }
/* Д-10: оранжевая только звезда, текст — обычный. */
.edu-lp-float--3 { inset: auto auto var(--digi-space-6) var(--digi-space-6); color: var(--digi-color-fg); }
.edu-lp-float--3 svg { color: var(--edu-star); }
.edu-lp-dots {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    color: var(--digi-color-border);
    opacity: .5;
    mask-image: radial-gradient(ellipse at 70% 30%, #000, transparent 70%);
    pointer-events: none;
}

/* ---------------------------------------------------------------- заголовки секций */
.edu-lp-h2 {
    font-size: clamp(1.5rem, 1.15rem + 1.6vw, 2.25rem);
    font-weight: 750;
    line-height: 1.15;
    letter-spacing: -0.015em;
    text-wrap: balance;
    margin: 0 0 var(--digi-space-2);
}
.edu-lp-h3 { font-size: 1.25rem; line-height: 1.25; margin: 0 0 var(--digi-space-2); }
.edu-lp-lead { color: var(--digi-color-muted); max-width: 38rem; margin: 0; }
.edu-lp-head { margin-block-end: var(--digi-space-6); }

/* ---------------------------------------------------------------- H-2 направления */
.edu-lp-cats {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: var(--digi-space-3);
    grid-template-columns: minmax(0, 1fr);
}
.edu-lp-cats > li { display: grid; }
.edu-lp-cat {
    display: grid;
    grid-template-columns: 3.5rem minmax(0, 1fr);
    align-items: center;
    gap: var(--digi-space-3);
    padding: var(--digi-space-3);
    border-radius: var(--edu-radius-lg);
    text-decoration: none;
    color: var(--digi-color-fg);
    background: var(--edu-cat-bg);
    border: 1px solid transparent;
    transition: transform .15s ease, box-shadow .15s ease;
}
.edu-lp-cat:hover { transform: translateY(-2px); box-shadow: var(--edu-shadow-lg); }
.edu-lp-cat:focus-visible { outline-offset: 2px; }
.edu-lp-cat--t1 { --edu-cat-bg: var(--edu-tint-1-bg); --edu-cat-ink: var(--edu-tint-1-ink); }
.edu-lp-cat--t2 { --edu-cat-bg: var(--edu-tint-2-bg); --edu-cat-ink: var(--edu-tint-2-ink); }
.edu-lp-cat--t3 { --edu-cat-bg: var(--edu-tint-3-bg); --edu-cat-ink: var(--edu-tint-3-ink); }
.edu-lp-cat--t4 { --edu-cat-bg: var(--edu-tint-4-bg); --edu-cat-ink: var(--edu-tint-4-ink); }
.edu-lp-cat--t5 { --edu-cat-bg: var(--edu-tint-5-bg); --edu-cat-ink: var(--edu-tint-5-ink); }
.edu-lp-cat--t6 { --edu-cat-bg: var(--edu-tint-6-bg); --edu-cat-ink: var(--edu-tint-6-ink); }
.edu-lp-cat--t7 { --edu-cat-bg: var(--edu-tint-7-bg); --edu-cat-ink: var(--edu-tint-7-ink); }
.edu-lp-cat--t8 { --edu-cat-bg: var(--edu-tint-8-bg); --edu-cat-ink: var(--edu-tint-8-ink); }
.edu-lp-cat > picture { display: block; line-height: 0; }
.edu-lp-cat__img {
    display: block;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: var(--digi-radius);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent), linear-gradient(transparent, #000 10%, #000 90%, transparent);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent), linear-gradient(transparent, #000 10%, #000 90%, transparent);
    mask-composite: intersect;
}
/* Направление без своей картинки: мягкий круг его оттенка, чужую картинку не ставим. */
.edu-lp-cat__img--none {
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--edu-cat-ink) 30%, transparent), color-mix(in srgb, var(--edu-cat-ink) 10%, transparent) 70%);
    -webkit-mask-image: none;
    mask-image: none;
    transform: scale(.8);
}
.edu-lp-cat__name {
    font-weight: 650;
    font-size: 1rem;
    line-height: 1.3;
    overflow-wrap: normal;
    word-break: normal;
}

@media (min-width: 30em) {
    .edu-lp-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--digi-space-4); }
    .edu-lp-cat {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: var(--digi-space-2);
        padding: var(--digi-space-4);
        text-align: center;
    }
    .edu-lp-cat__img { width: 6rem; height: 6rem; }
}

/* Число центров на плитке (H-2) — вне ссылки (анкор = текст бэкенда, FE-12), поверх плитки
   в той же ячейке сетки; клик проходит сквозь него в ссылку. */
.edu-lp-cats > li > .edu-lp-cat,
.edu-lp-cats > li > .edu-lp-cat__count { grid-area: 1 / 1; }
.edu-lp-cat__count {
    position: relative;
    z-index: 1;
    align-self: center;
    justify-self: end;
    margin-inline-end: var(--digi-space-3);
    font-size: var(--digi-text-small);
    font-weight: 600;
    color: var(--edu-cat-ink);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    pointer-events: none;
    transition: transform .15s ease;
}
.edu-lp-cats__item--counted > .edu-lp-cat { padding-inline-end: 7rem; }
.edu-lp-cats > li:hover > .edu-lp-cat__count { transform: translateY(-2px); }
@media (min-width: 30em) {
    .edu-lp-cat__count { align-self: end; justify-self: center; margin: 0 0 var(--digi-space-4); }
    .edu-lp-cats__item--counted > .edu-lp-cat { padding-inline-end: var(--digi-space-4); padding-bottom: calc(var(--digi-space-4) + 1.75rem); }
}

/* ---------------------------------------------------------------- H-3 регионы */
.edu-lp-regions {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: var(--digi-space-3);
    grid-template-columns: minmax(0, 1fr);
}
.edu-lp-region {
    display: grid;
    align-content: start;
    gap: var(--digi-space-3);
    padding: var(--digi-space-4);
    border-radius: var(--digi-radius);
    background: var(--edu-surface-raised);
    border: 1px solid var(--digi-color-border);
}
.edu-lp-region__name {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 650;
    line-height: 1.3;
    overflow-wrap: normal;
}
.edu-lp-region__name a { color: var(--digi-color-fg); text-decoration: none; }
.edu-lp-region__name a:hover { color: var(--digi-color-primary); text-decoration: underline; }
.edu-lp-region__cities,
.edu-lp-verified {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--digi-space-2);
}
.edu-lp-region__cities a,
.edu-lp-verified a {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: var(--digi-space-2) var(--digi-space-3);
    border: 1px solid var(--digi-color-border);
    border-radius: 999px;
    background: var(--digi-color-bg);
    color: var(--digi-color-fg);
    font-size: var(--digi-text-small);
    text-decoration: none;
}
.edu-lp-region__cities a:hover,
.edu-lp-verified a:hover { border-color: var(--digi-color-primary); color: var(--digi-color-primary); }
/* Регион из одного города (столица): вся карточка — ссылка на город. */
.edu-lp-region--link { position: relative; align-content: center; }
.edu-lp-region--link .edu-lp-region__name a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.edu-lp-region--link:hover { border-color: var(--digi-color-primary); }
.edu-lp-region__count {
    margin: calc(-1 * var(--digi-space-2)) 0 0;
    color: var(--digi-color-muted);
    font-size: var(--digi-text-small);
    font-variant-numeric: tabular-nums;
}

@media (min-width: 40em) {
    .edu-lp-regions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 64em) {
    .edu-lp-regions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---------------------------------------------------------------- доверие + H-6 */
.edu-lp-trust {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--digi-space-8);
    display: grid;
    gap: var(--digi-space-4);
}
.edu-lp-trust__item {
    padding: var(--digi-space-6);
    border-radius: var(--edu-radius-lg);
    background: var(--digi-color-surface);
}
.edu-lp-trust__item h3 { margin: var(--digi-space-3) 0 var(--digi-space-1); font-size: 1.0625rem; }
.edu-lp-trust__item p { color: var(--digi-color-muted); margin: 0; overflow-wrap: anywhere; }
.edu-lp-trust__icon {
    width: 2.75rem;
    height: 2.75rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
}
.edu-lp-trust__icon--edu-tint-1 { background: var(--edu-tint-1-bg); color: var(--edu-tint-1-ink); }
.edu-lp-trust__icon--edu-tint-2 { background: var(--edu-tint-2-bg); color: var(--edu-tint-2-ink); }
.edu-lp-trust__icon--edu-tint-3 { background: var(--edu-tint-3-bg); color: var(--edu-tint-3-ink); }
.edu-lp-trust__icon--edu-tint-8 { background: var(--edu-tint-8-bg); color: var(--edu-tint-8-ink); }
.edu-lp-trust:last-child { margin-bottom: 0; }
[data-link-block="H-6"] > p { margin: 0 0 var(--digi-space-4); }
@media (min-width: 48em) { .edu-lp-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 80em) { .edu-lp-trust { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------------------------------------------------------------- CTA: помощь + H-9 */
.edu-lp-cta { display: grid; gap: var(--digi-space-4); }
/* Доверие и CTA на одном фоне: между ними один шаг секции, а не два. */
.edu-lp-main > [data-digi-zone="content_end"] > .edu-lp-cta { padding-block-start: 0; }
.edu-lp-cta__card,
.edu-lp-cta > [data-link-block="H-9"] {
    border-radius: var(--edu-radius-lg);
    padding: var(--digi-space-8) var(--digi-space-6);
}
.edu-lp-cta .edu-lp-h2 { margin-block: 0 var(--digi-space-3); font-size: clamp(1.375rem, 1.1rem + 1vw, 1.75rem); line-height: 1.2; }
.edu-lp-cta p { max-width: 36rem; margin: 0; }
.edu-lp-cta__card--help {
    position: relative;
    overflow: hidden;
    color: var(--edu-cta-fg);
    background: linear-gradient(135deg, var(--edu-cta-from), var(--edu-cta-to));
}
.edu-lp-cta__card--help::before {
    content: "";
    position: absolute;
    inset: -25% -10% auto 35%;
    height: 140%;
    background: radial-gradient(circle at center, color-mix(in srgb, var(--edu-glow-2) 30%, transparent), transparent 68%);
    pointer-events: none;
}
.edu-lp-cta__card--help > * { position: relative; }
.edu-lp-cta > [data-link-block="H-9"] {
    background: var(--digi-color-surface);
    border: 1px solid var(--digi-color-border);
}
.edu-lp-cta__actions {
    list-style: none;
    padding: 0;
    margin: var(--digi-space-6) 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--digi-space-4);
}
.edu-lp-cta__actions .digi-button { white-space: normal; }
@media (min-width: 64em) {
    .edu-lp-cta { grid-template-columns: 5fr 7fr; }
    .edu-lp-cta--single { grid-template-columns: minmax(0, 1fr); }
}

/* ---------------------------------------------------------------- популярные запросы (H-4, H-5, H-8) */
.edu-lp-links {
    border-top: 1px solid var(--digi-color-border);
    padding-block: var(--digi-space-8) var(--digi-space-12);
    display: grid;
    gap: var(--digi-space-6);
}
.edu-lp-links > h2 { margin-bottom: 0; }
.edu-lp-links h3 { margin: 0 0 var(--digi-space-2); font-size: 1.0625rem; }
.edu-lp-links ul { list-style: none; padding: 0; margin: 0; }
/* Д-13: подчёркивание спокойнее, на hover — полное. */
.edu-lp-links a {
    color: var(--digi-color-fg);
    line-height: 2.2;
    overflow-wrap: anywhere;
    text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
    text-underline-offset: .2em;
}
.edu-lp-links a:hover { color: var(--digi-color-primary); text-decoration-color: currentColor; }
@media (min-width: 48em) {
    .edu-lp-links { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
    .edu-lp-links > h2 { grid-column: 1 / -1; }
}

/* ---------------------------------------------------------------- широкий экран */
@media (min-width: 48em) {
    .edu-lp-hero::before {
        background:
            radial-gradient(38rem 26rem at 10% 20%, color-mix(in srgb, var(--edu-glow-1) 35%, transparent), transparent 70%),
            radial-gradient(34rem 28rem at 95% 25%, color-mix(in srgb, var(--edu-glow-3) 35%, transparent), transparent 70%),
            radial-gradient(44rem 22rem at 55% 105%, color-mix(in srgb, var(--edu-glow-2) 30%, transparent), transparent 70%);
    }
    .edu-lp-search .edu-search { padding: var(--digi-space-6); grid-template-columns: 3fr 2fr auto; }
}

@media (min-width: 64em) {
    .edu-lp-hero { padding-block: var(--edu-space-16) var(--edu-space-20); }
    .edu-lp-hero__inner {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        align-items: center;
    }
    .edu-lp-hero__text { grid-column: 1 / span 7; grid-row: 1; }
    .edu-lp-hero__art {
        display: block;
        position: relative;
        z-index: 1;
        grid-column: 8 / span 5;
        grid-row: 1;
        aspect-ratio: 3 / 2;
        border-radius: var(--edu-radius-lg);
        box-shadow: var(--edu-shadow-lg);
        background: var(--edu-surface-raised) image-set(url("lp/hero-1120.avif") type("image/avif"), url("lp/hero-1120.webp") type("image/webp")) center / cover no-repeat;
    }
    .edu-lp-cats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .edu-lp-cat__name { font-size: 1.0625rem; }
    .edu-lp-band,
    .edu-lp-main > [data-digi-zone="content_end"] > section { padding-block: var(--edu-space-20); }
    .edu-lp-main > [data-digi-zone="content_end"] > .edu-lp-cta { padding-block-start: 0; }
    .edu-lp-links { padding-block: var(--digi-space-12) var(--edu-space-16); }
}

/* ---------------------------------------------------------------- тёмная тема */
@media (prefers-color-scheme: dark) {
    .edu-lp-cat { border-color: var(--digi-color-border); }
    .edu-lp-cat__img { filter: brightness(.92); -webkit-mask-image: none; mask-image: none; }
    .edu-lp-hero::before {
        background:
            radial-gradient(22rem 16rem at 10% 20%, color-mix(in srgb, var(--edu-glow-1) 22%, transparent), transparent 70%),
            radial-gradient(20rem 18rem at 95% 25%, color-mix(in srgb, var(--edu-glow-3) 22%, transparent), transparent 70%),
            radial-gradient(26rem 14rem at 55% 105%, color-mix(in srgb, var(--edu-glow-2) 20%, transparent), transparent 70%);
    }
}
@media (prefers-color-scheme: dark) and (min-width: 48em) {
    .edu-lp-hero::before {
        background:
            radial-gradient(38rem 26rem at 10% 20%, color-mix(in srgb, var(--edu-glow-1) 22%, transparent), transparent 70%),
            radial-gradient(34rem 28rem at 95% 25%, color-mix(in srgb, var(--edu-glow-3) 22%, transparent), transparent 70%),
            radial-gradient(44rem 22rem at 55% 105%, color-mix(in srgb, var(--edu-glow-2) 20%, transparent), transparent 70%);
    }
}
@media (prefers-color-scheme: dark) and (min-width: 64em) {
    .edu-lp-hero__art {
        background-image:
            linear-gradient(color-mix(in srgb, var(--edu-hero-bg) 14%, transparent), color-mix(in srgb, var(--edu-hero-bg) 14%, transparent)),
            image-set(url("lp/hero-1120.avif") type("image/avif"), url("lp/hero-1120.webp") type("image/webp"));
        box-shadow: 0 0 0 1px var(--digi-color-border), 0 24px 64px -20px color-mix(in srgb, var(--edu-glow-1) 55%, transparent);
    }
}

@media (prefers-reduced-motion: reduce) {
    .edu-lp-cat, .edu-lp-cat__count, .edu-catnav__menu > summary::after { transition: none; }
    .edu-lp-cat:hover, .edu-lp-cats > li:hover > .edu-lp-cat__count { transform: none; }
}

/* ================================================================ выдача (EM-007.2) */
/* Карточка без колонки действий: заявки и телефоны — EM-008, пустую колонку 13rem не держим. */
.edu-card--plain { grid-template-areas: "logo id" "body body"; }
@media (min-width: 40em) {
    .edu-card--plain { grid-template-columns: 4rem minmax(0, 1fr); grid-template-areas: "logo id" "logo body"; }
}
.edu-card__brand { margin: var(--digi-space-1) 0 0; font-size: var(--digi-text-small); }
.edu-card__brand a { color: var(--digi-color-fg); }
.edu-card__chips { display: flex; flex-wrap: wrap; gap: var(--digi-space-1) var(--digi-space-3); list-style: none; margin: 0; padding: 0; font-size: var(--digi-text-small); }
.edu-card--selected { border-color: var(--digi-color-primary); box-shadow: 0 0 0 1px var(--digi-color-primary); }

.edu-filters label.edu-filters__text { flex-direction: column; align-items: stretch; gap: var(--digi-space-1); text-align: start; }
.edu-sort__apply[hidden], .edu-notice[hidden] { display: none; }
.edu-filters input[type="search"] {
    width: 100%; min-height: 2.75rem; font: inherit; padding: 0 var(--digi-space-2);
    border: 1px solid var(--digi-color-border); border-radius: var(--digi-radius-sm);
    background: var(--digi-color-bg); color: var(--digi-color-fg);
}
.edu-sort__note { margin: calc(-1 * var(--digi-space-2)) 0 var(--digi-space-4); }

/* Вид «Карта»: фильтры — листом и на широком экране, чтобы карте хватило ширины. */
.edu-listing--map { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 64em) {
    .edu-listing--map .edu-filters-open { display: inline-flex; }
    .edu-listing--map .edu-filters { display: none; position: static; }
    .edu-listing--map .edu-filters:target {
        display: block; position: fixed; inset: 0 auto 0 0; width: 24rem; z-index: 50;
        overflow-y: auto; padding: var(--digi-space-4) var(--digi-space-6) 0; box-shadow: var(--digi-shadow);
    }
    .edu-listing--map .edu-filters__close { display: inline-flex; }
    .edu-listing--map .edu-filters__foot { position: sticky; bottom: 0; background: var(--digi-color-bg); padding-bottom: var(--digi-space-4); grid-template-columns: 1fr 1fr; }
}

.edu-map-panel { display: grid; gap: var(--digi-space-3); align-content: start; min-width: 0; }
.edu-map-panel > .edu-notice { margin: 0; }
.edu-map-panel__counts { margin: 0; color: var(--digi-color-muted); font-size: var(--digi-text-small); }
.edu-map-panel__h { margin: 0; font-size: 1rem; }
.edu-map-points { display: grid; gap: var(--digi-space-2); margin: 0; padding-inline-start: var(--digi-space-6); }
.edu-map-points li { padding-inline-start: var(--digi-space-1); }
.edu-map-points li.is-selected { font-weight: 600; }
.edu-map-points__name { display: block; font-weight: 600; overflow-wrap: anywhere; }
.edu-map-points__place,
.edu-map-points__coords { display: block; color: var(--digi-color-muted); font-size: var(--digi-text-small); }
.edu-map-points__coords { font-variant-numeric: tabular-nums; }

.edu-map { touch-action: none; cursor: grab; user-select: none; }
@media (max-width: 39.999em) { .edu-map { height: 50vh; } }
.edu-map:active { cursor: grabbing; }
.edu-map__layer, .edu-map__tiles, .edu-map__pins { position: absolute; inset: 0; }
.edu-map__tiles img { position: absolute; display: block; width: 256px; height: 256px; max-width: none; }
p.edu-map__attrib { margin: 0; z-index: 4; }
.edu-map__zoom { position: absolute; top: var(--digi-space-3); inset-inline-end: var(--digi-space-3); z-index: 5; display: grid; gap: 1px; box-shadow: var(--digi-shadow); border-radius: var(--digi-radius-sm); overflow: hidden; }
.edu-map__zoom-btn { width: 2.75rem; height: 2.75rem; border: 0; background: var(--digi-color-bg); color: var(--digi-color-fg); font: inherit; font-size: 1.25rem; cursor: pointer; }
.edu-map__zoom-btn:hover { background: var(--digi-color-surface); }
@media (min-width: 64em) { .edu-map-layout .edu-map-panel { position: sticky; top: var(--digi-space-4); } }

/* Блоки перелинковки под выдачей (FE-1): секция с заголовком, список ссылок колонками. */
section.edu-links { columns: auto; margin-block: var(--digi-space-8); }
section.edu-links > h2 { font-size: 1.25rem; line-height: var(--digi-line-tight); margin: 0 0 var(--digi-space-4); }
section.edu-links > ul { columns: 2 12rem; gap: var(--digi-space-6); list-style: none; margin: 0; padding: 0; }
section.edu-links > ul > li { padding-block: var(--digi-space-1); break-inside: avoid; }

/* Profile pages (EM-007.3): the offer head has no logo column — the same stack, its own gap below. */
.edu-offer-head { margin-bottom: var(--digi-space-6); }
.edu-offer-head .edu-tags { margin-top: var(--digi-space-1); }
.edu-usp { margin: 0 0 var(--digi-space-4); }
.edu-profile > div > .edu-section:first-child { margin-top: 0; }
/* The offer price and its phone come before the facts on a phone (the sticky lead bar is EM-008). */
@media (max-width: 63.99em) { .edu-offer-box { order: -1; } }

/* Lead forms of the contact box (EM-007.4, design lead.html): the core form markup (`digi-form`,
   `data-digi-form-*`) inside a disclosure per form; the core's title is the summary here. */
.edu-lead-slot, .edu-lead-forms { display: grid; gap: var(--digi-space-2); min-width: 0; }
.edu-lead-form { min-width: 0; }
.edu-lead-form > summary { list-style: none; }
.edu-lead-form > summary::-webkit-details-marker { display: none; }
.edu-lead-form[open] > summary { margin-bottom: var(--digi-space-3); }
/* audit EM-009 Д-16: without JS the sticky bar and PRG lead to `#edu-lead-forms`; while it is the
   target and no form of it is open, the first form shows its body — no second tap. A browser
   without `::details-content` drops this rule and keeps the plain disclosure. */
.edu-lead-slot:target:not(:has(.edu-lead-form[open])) .edu-lead-form:first-of-type > summary { margin-bottom: var(--digi-space-3); }
.edu-lead-slot:target:not(:has(.edu-lead-form[open])) .edu-lead-form:first-of-type::details-content { display: block; content-visibility: visible; }
.edu-lead-form__body { display: grid; gap: var(--digi-space-2); }
.edu-lead-form__note { margin: 0; font-size: var(--digi-text-small); color: var(--digi-color-muted); }
.edu-lead-form .digi-form { margin: 0; padding: 0; max-width: none; background: transparent; gap: var(--digi-space-3); }
.edu-lead-form [data-digi-form-title] { display: none; }
.edu-lead-form .digi-form label { font-size: var(--digi-text-small); }
.edu-lead-form .digi-form textarea { min-height: 5rem; }
.edu-lead-form .digi-form [aria-invalid="true"] { border-color: var(--digi-color-error); border-width: 2px; }
.edu-lead-form [data-digi-form-error] { display: block; margin-top: var(--digi-space-1); color: var(--digi-color-error); font-size: var(--digi-text-small); }
.edu-lead-form [data-digi-form-failed], .edu-lead-form [data-digi-form-sent] {
    margin: 0; padding: var(--digi-space-3); font-weight: 600;
    border: 1px solid var(--digi-color-border); border-inline-start: 4px solid var(--digi-color-error);
    border-radius: var(--digi-radius-sm); background: var(--digi-color-bg);
}
.edu-lead-form [data-digi-form-sent] { border-inline-start-color: var(--digi-color-success); }
/* the consent: checkbox first, the text and the policy link beside it, the error under them */
.edu-lead-form [data-digi-form-field="consent"] { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: var(--digi-space-1) var(--digi-space-2); align-items: start; }
.edu-lead-form [data-digi-form-field="consent"] input { grid-column: 1; grid-row: 1; width: 1.25rem; height: 1.25rem; margin: .1rem 0 0; accent-color: var(--digi-color-primary); }
.edu-lead-form [data-digi-form-field="consent"] label { grid-column: 2; grid-row: 1; margin: 0; font-weight: 400; }
.edu-lead-form [data-digi-form-field="consent"] > :not(input):not(label) { grid-column: 2; }
.edu-lead-form__policy { font-size: var(--digi-text-small); }
.edu-lead-form .digi-form button[type="submit"] { align-self: stretch; width: 100%; min-height: 3rem; }
.edu-lead-form[data-state="sending"] button[type="submit"] { cursor: progress; opacity: .7; }
.edu-lead-form__btn[disabled], .edu-lead-form .digi-form button[disabled] { cursor: not-allowed; opacity: .55; }
/* the offer page is the course already: its own field is not asked again */
.edu-lead-forms[data-page="course_offer"] [data-digi-form-field="course"] { display: none; }

/* «Сообщить об ошибке» (EM-008.5, design report.html): a quiet disclosure at the end of the content
   over the core form `correction` (`digi-form`, `data-digi-form-*`); the core's title is the summary.
   The same states as the lead forms: error on a field, a notice (422 «обновите страницу», 429, a
   network failure), closed (503), sent — the last one in the live region `__status`. */
.edu-report-slot { margin-top: var(--digi-space-8); padding-top: var(--digi-space-4); border-top: 1px solid var(--digi-color-border); }
.edu-report-form { min-width: 0; max-width: var(--digi-width-text); }
.edu-report-form > summary { list-style: none; display: inline-flex; align-items: center; }
.edu-report-form > summary::-webkit-details-marker { display: none; }
.edu-report-form[open] > summary { margin-bottom: var(--digi-space-3); }
.edu-report-form__body { display: grid; gap: var(--digi-space-3); }
.edu-report-form .digi-form { margin: 0; padding: 0; max-width: none; background: transparent; gap: var(--digi-space-3); }
.edu-report-form [data-digi-form-title] { display: none; }
.edu-report-form .digi-form label { font-size: var(--digi-text-small); }
.edu-report-form .digi-form fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.edu-report-form .digi-form legend { padding: 0; margin-bottom: var(--digi-space-2); font-weight: 600; font-size: var(--digi-text-small); }
.edu-report-form .digi-form input[type="radio"], .edu-report-form .digi-form input[type="checkbox"] { width: 1.25rem; height: 1.25rem; margin: 0; accent-color: var(--digi-color-primary); flex: none; }
.edu-report-form .digi-form textarea { min-height: 5rem; }
.edu-report-form .digi-form [aria-invalid="true"] { border-color: var(--digi-color-error); border-width: 2px; }
.edu-report-form [data-digi-form-error] { display: block; margin-top: var(--digi-space-1); color: var(--digi-color-error); font-size: var(--digi-text-small); }
.edu-report-form [data-digi-form-failed], .edu-report-form [data-digi-form-sent], .edu-report-form__status:not(:empty) {
    margin: 0; padding: var(--digi-space-3); font-weight: 600;
    border: 1px solid var(--digi-color-border); border-inline-start: 4px solid var(--digi-color-error);
    border-radius: var(--digi-radius-sm); background: var(--digi-color-bg);
}
.edu-report-form [data-digi-form-sent], .edu-report-form[data-state="sent"] .edu-report-form__status { border-inline-start-color: var(--digi-color-success); }
.edu-report-form[data-state="sending"] .edu-report-form__status { border-inline-start-color: var(--digi-color-border); font-weight: 400; }
.edu-report-form__status:empty { display: none; }
.edu-report-form [data-digi-form-field="consent"] { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: var(--digi-space-1) var(--digi-space-2); align-items: start; }
.edu-report-form [data-digi-form-field="consent"] input { grid-column: 1; grid-row: 1; margin-top: .1rem; }
.edu-report-form [data-digi-form-field="consent"] label { grid-column: 2; grid-row: 1; margin: 0; font-weight: 400; }
.edu-report-form [data-digi-form-field="consent"] > :not(input):not(label) { grid-column: 2; }
.edu-report-form .digi-form button[type="submit"] { align-self: start; min-height: 2.75rem; }
.edu-report-form[data-state="sending"] button[type="submit"] { cursor: progress; opacity: .7; }
.edu-report-form .digi-form button[disabled] { cursor: not-allowed; opacity: .55; }
@media (max-width: 39.99em) { .edu-report-form .digi-form button[type="submit"] { align-self: stretch; width: 100%; min-height: 3rem; } }

/* Sticky lead bar of a profile on a phone (EM-007, design `.edu-sticky-cta` in edu.css): here it sits
   in the flow at the end of the content and `position: sticky` keeps it at the bottom of the screen —
   no body class and no reserved padding (the layout is shared), and at the end of the page it never
   lies over the footer. Hidden from 64em (edu.css). While the forms are on screen `site.js` sets
   `data-state="hidden"`: out of sight and out of the tab order, its place kept (no jump). */
.edu-sticky-cta {
    position: sticky; inset-inline: auto; grid-template-columns: minmax(0, 1fr);
    margin: var(--digi-space-6) calc(-1 * var(--digi-space-4)) 0;
}
.edu-sticky-cta[data-state="hidden"] { visibility: hidden; }
