:root {
    --bg: #f7f4ee;
    --surface: #fffdf8;
    --border: #e3dccd;
    --text: #1d1b16;
    --muted: #5d584e;
    --primary: #0066ff;
    --primary-dark: #004fd6;
    --pro: #7a4cff;
    --verified: #0aa06e;
    --star: #ff6b00;
    --danger: #d6312b;
    --marigold: #ffc95c;
    --marigold-dark: #f0b42e;
    --amber-ink: #946400;
    --coral: #ff6452;
    --iris: #5b4fe8;
    --teal: #12a594;
    --plum: #8b5cf6;
    --sky: #2f9bff;
    --radius: 14px;
    --r-lg: 14px;
    --r-full: 999px;
    --shadow: 0 8px 24px rgba(29, 27, 22, .07);
    --shadow-hover: 0 14px 32px rgba(29, 27, 22, .12);
    --font-display: "Wix Madefor Display", sans-serif;
    --font-body: "Manrope", sans-serif;
    --font-mono: "Roboto Mono", monospace;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.5;
    color: var(--text);
    background: var(--surface);
    -webkit-font-smoothing: antialiased;
}

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
    outline: 2px solid var(--marigold);
    outline-offset: 2px;
}

img { max-width: 100%; height: auto; }

.container { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
@media (max-width: 640px) { .container { padding: 0 20px; } }

/* ---------- Шапка ---------- */
.site-header {
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    position: sticky;
    top: 0;
    z-index: 20;
}
.header-inner { display: flex; align-items: center; gap: 28px; height: 84px; }
.logo { font-family: var(--font-display); font-size: 25px; font-weight: 900; color: #945c04; letter-spacing: -.02em; display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.logo:hover { text-decoration: none; }
.logo--footer { font-size: 25px; }
.logo-img { height: 34px; width: auto; flex-shrink: 0; }
.catalog-drop { position: relative; }
.catalog-drop__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 13px;
    color: var(--text);
    background-color: transparent;
    border: 1px solid var(--border);
    border-radius: var(--r-full);
    cursor: pointer;
    padding: 10px 18px;
}
.catalog-drop__btn:hover { color: var(--text); border-color: var(--text); }
.catalog-drop__btn svg { width: 14px; height: 14px; transition: transform .15s ease; }
.catalog-drop.open .catalog-drop__btn svg { transform: rotate(180deg); }
.catalog-drop__menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 260px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-hover);
    padding: 10px;
    display: none;
    flex-direction: column;
    gap: 2px;
}
.catalog-drop.open .catalog-drop__menu { display: flex; }
.dd-link { display: block; padding: 8px 12px; border-radius: 10px; color: var(--text); font-size: 14px; font-weight: 500; }
.dd-link:hover { background: var(--bg); text-decoration: none; }
.dd-link--main { font-weight: 700; color: var(--text); }
.dd-group { margin-top: 4px; }
.dd-group__title {
    font-family: var(--font-mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--muted);
    padding: 8px 12px 4px;
}
@media (max-width: 900px) {
    .catalog-drop { display: none; }
    .header-inner { height: 72px; gap: 16px; }
    .header-search, .header-add, .header-compare, .header-account { display: none; }
    .header-menu-toggle { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 42px; width: 42px; height: 42px; padding: 0; border: 1px solid var(--border); border-radius: var(--r-full); background: var(--surface); color: var(--text); cursor: pointer; }
    .header-menu-toggle:hover { border-color: var(--text); }
    .header-menu-toggle__icon { display: flex; width: 16px; flex-direction: column; gap: 4px; }
    .header-menu-toggle__icon i { display: block; height: 1px; background: currentColor; }
}
.header-search {
    position: relative;
    margin-left: auto;
    display: flex;
    align-items: stretch;
    flex: 1;
    max-width: 520px;
    min-width: 0;
    height: 42px;
    border: 1px solid var(--border);
    border-radius: var(--r-full);
    background: var(--surface);
    overflow: hidden;
}
.header-search:hover,
.header-search:focus-within { border-color: var(--text); }
.header-add { color: var(--text); }
.header-add:hover { border-color: var(--text); text-decoration: none; }
.header-compare {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 42px;
    box-sizing: border-box;
    padding: 0 16px;
    border: 1px solid var(--border);
    border-radius: var(--r-full);
    color: var(--text);
    font-weight: 600;
    font-size: 13px;
    white-space: nowrap;
}
.header-compare:hover { border-color: var(--text); text-decoration: none; }
.header-compare__icon { width: 16px; height: 16px; flex-shrink: 0; }
.header-compare__count {
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--marigold);
    color: var(--text);
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.header-account {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 42px;
    box-sizing: border-box;
    padding: 0 14px;
    border: 1px solid var(--border);
    border-radius: var(--r-full);
    color: var(--text);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}
.header-account:hover { border-color: var(--text); text-decoration: none; }
.header-account svg { width: 17px; height: 17px; }
.header-register { color: var(--text); font-size: 14px; font-weight: 700; white-space: nowrap; }
.header-register:hover { color: var(--primary); }
@media (max-width: 900px) {
    .header-compare__label { display: none; }
    .header-compare { padding: 10px 12px; }
    .header-account span { display: none; }
    .header-account { padding: 10px 12px; }
    .header-add { padding: 10px 11px; }
}
@media (max-width: 480px) {
    .header-inner { gap: 8px; }
    .header-compare { display: inline-flex; padding: 9px; }
    .header-search { gap: 6px; }
    .header-search input { padding: 0 12px; }
    .header-search button { padding: 10px 12px; }
    .header-search { display: none; }
    .header-register { font-size: 12px; }
    .header-add { padding: 9px 10px; }
}
.header-search input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    border-radius: 0;
    padding: 0 16px;
    font-family: var(--font-body);
    font-size: 13px;
    background: transparent;
    color: var(--text);
}
.btn-dark { background: #6f4f3a; color: #fff; }
.btn-dark:hover { background: #5d4130; color: #fff; }

.header-search__submit {
    flex: 0 0 auto;
    align-self: stretch;
    padding: 0 16px;
    border: 0;
    border-left: 1px solid var(--border);
    border-radius: 0;
    background: var(--surface);
    color: var(--text);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.header-search__submit:hover { background: var(--bg); color: var(--text); }

.header-menu-toggle { display: none; }
.mobile-menu { display: none; border-top: 1px solid var(--border); background: var(--surface); }
.mobile-menu.is-open { display: block; }
.mobile-menu__inner { padding-top: 16px; padding-bottom: 20px; }
.mobile-menu__search { display: flex; height: 42px; border: 1px solid var(--border); border-radius: var(--r-full); overflow: hidden; }
.mobile-menu__search input { flex: 1; min-width: 0; border: 0; outline: 0; padding: 0 14px; background: transparent; color: var(--text); font: inherit; font-size: 13px; }
.mobile-menu__search button { padding: 0 16px; border: 0; border-left: 1px solid var(--border); background: transparent; color: var(--text); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.mobile-menu__search button:hover { background: var(--bg); }
.mobile-menu__nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
.mobile-menu__nav a { padding: 12px 0; border-bottom: 1px solid var(--border); color: var(--text); font-size: 13px; font-weight: 600; }
.mobile-menu__categories { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.mobile-menu__categories span { width: 100%; color: var(--muted); font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.mobile-menu__categories a { color: var(--muted); font-size: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (max-width: 900px) {
    .header-inner { justify-content: space-between; }
    .site-header .header-inner > .catalog-drop,
    .site-header .header-inner > .header-compare,
    .site-header .header-inner > .header-search,
    .site-header .header-inner > .header-add,
    .site-header .header-inner > .header-account { display: none; }
    .header-menu-toggle { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 42px; width: 42px; height: 42px; padding: 0; border: 1px solid var(--border); border-radius: var(--r-full); background: var(--surface); color: var(--text); cursor: pointer; }
    .header-menu-toggle:hover { border-color: var(--text); }
    .header-menu-toggle__icon { display: flex; width: 16px; flex-direction: column; gap: 4px; }
    .header-menu-toggle__icon i { display: block; height: 1px; background: currentColor; }
}

@media (max-width: 480px) {
    .header-search input { padding: 0 12px; }
    .header-search__submit { padding: 0 12px; }
}

/* ---------- Хиро ---------- */
.hero { padding: 72px 0 56px; display: grid; grid-template-columns: 1fr 360px; gap: 24px 56px; align-items: center; }
.hero__left { min-width: 0; }
.hero__right { min-width: 0; }
.hero h1 {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(34px, 5vw, 52px);
    line-height: 1.12;
    margin: 0 0 18px;
    max-width: 820px;
    letter-spacing: -.03em;
    text-wrap: balance;
}
.hero__sub { color: var(--muted); font-size: 18px; margin: 0; max-width: 600px; }
@property --marker-a {
    syntax: '<number>';
    inherits: false;
    initial-value: 0;
}
.hero__sub-part {
    --marker-a: 0;
    color: var(--muted);
    background-image: linear-gradient(rgba(255, 201, 92, var(--marker-a)), rgba(255, 201, 92, var(--marker-a)));
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 0% 100%;
    transition: color .35s ease;
}
.hero__sub-part.on { color: var(--text); }

.search-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 8px 8px 8px 22px;
    max-width: 600px;
    margin: 0 0 28px;
}
.search-bar input {
    border: none;
    outline: none;
    flex: 1;
    min-width: 0;
    font-family: var(--font-body);
    font-size: 15px;
    background: transparent;
}

.route { position: relative; padding: 26px 26px 24px 34px; }
.route::before {
    content: "";
    position: absolute;
    top: 19px;
    bottom: -56px;
    left: 40.5px;
    border-left: 2px dashed var(--border);
}
.route-step { position: relative; z-index: 1; padding: 0 0 30px 38px; }
.route-step:last-child { padding-bottom: 0; }
.route-step::before { content: none; }
.route-dot {
    position: absolute;
    top: 3px;
    left: 0;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: var(--marigold);
    box-shadow: 0 0 0 4px rgba(255, 201, 92, .22);
    transition: background .35s ease, box-shadow .35s ease;
}
.route-step:not(.on) .route-dot { background: var(--border); box-shadow: none; }
.route-step .route-label,
.route-step .route-sub { transition: color .35s ease, opacity .35s ease; }
.route-step:not(.on) .route-label { color: var(--muted); }
.route-step:not(.on) .route-sub { opacity: .55; }
.route-cursor {
    position: absolute;
    top: 0;
    left: 0;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: var(--marigold);
    box-shadow: 0 0 0 4px rgba(255, 201, 92, .28);
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    will-change: transform;
}
.route-label { font-size: 13px; font-weight: 700; }
.route-sub { font-size: 12px; color: var(--muted); margin-top: 2px; }
@media (max-width: 960px) { .hero { grid-template-columns: 1fr; gap: 32px; } .route { max-width: 460px; } }
@media (max-width: 640px) { .route { display: none; } }

/* ---------- Секции ---------- */
.section { padding: 56px 0; }
@media (min-width: 960px) { .section { padding: 64px 0; } }
.hero + .section { padding-top: 16px; }
.section + .section { padding-top: 24px; }
.section--line { border-top: 2px dashed var(--border); }
.hero + .section--line { padding-top: 52px; }
.section + .section--line { padding-top: 44px; }
.section__title { font-family: var(--font-display); font-size: 26px; font-weight: 700; margin: 0 0 24px; letter-spacing: -.02em; }
.section__title--sm { font-size: 18px; margin-top: 24px; }

.section-head-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.section-head-row h2 { margin: 0; }

.toggle { display: flex; gap: 8px; }
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-left: auto; min-width: 0; }
.toolbar--stack { flex-direction: column; align-items: stretch; }
.toolbar__sort { display: inline-flex; }
.pill {
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 14px;
    line-height: 1.5;
    border-radius: var(--r-full);
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    padding: 10px 18px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: nowrap;
}
.pill:hover { border-color: var(--text); }
.pill--active { background: var(--bg); color: var(--text); border-color: var(--border); }
.pill--active:hover { border-color: var(--text); }
.toggle .pill svg { width: 14px; height: 14px; flex-shrink: 0; }
.price-toggle { display: flex; flex-wrap: wrap; gap: 8px; }
.price-toggle .pill { position: relative; padding: 8px 18px; }
.price-toggle .pill input { position: absolute; inset: 0; margin: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.price-toggle .pill span { position: relative; }
.price-toggle .pill:has(input:checked) { border-color: var(--primary); background: var(--primary); color: #fff; }
.price-toggle .pill:has(input:checked):hover { border-color: var(--primary); }
.price-toggle .pill input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: 3px; border-radius: 2px; }
.sort-drop { position: relative; }
.sort-drop__btn { background-color: transparent; display: inline-flex; align-items: center; gap: 6px; padding: 10px 18px; font-size: 15px; }
.sort-drop__btn:hover { color: var(--text); }
.sort-drop__btn svg { width: 13px; height: 13px; flex-shrink: 0; transition: transform .15s ease; }
.sort-drop.open .sort-drop__btn svg { transform: rotate(180deg); }
.sort-drop__menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 220px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-hover);
    padding: 10px;
    display: none;
    flex-direction: column;
    gap: 2px;
    z-index: 30;
}
.sort-drop.open .sort-drop__menu { display: flex; }
.sort-drop__opt {
    display: block;
    width: 100%;
    text-align: left;
    padding: 8px 12px;
    border-radius: 10px;
    border: none;
    background: none;
    cursor: pointer;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--text);
}
.sort-drop__opt:hover { background: var(--bg); }
.sort-drop__opt--active { font-weight: 700; }
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.page-title { font-family: var(--font-display); font-size: 26px; margin: 8px 0 12px; letter-spacing: -.02em; }

h1, h2, h3, h4 { font-family: var(--font-display); }

/* ---------- Сетка и карточки ---------- */
.grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .grid { grid-template-columns: repeat(3, 1fr); } }

.grid--list { grid-template-columns: 1fr; }
.grid--list .school-card {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 24px;
    padding: 18px 24px;
}
.grid--list .school-card__top { order: 1; flex: 1 1 auto; min-width: 240px; }
.grid--list .school-card__rating { order: 2; margin-left: auto; }
.grid--list .school-card__btn { order: 3; width: auto; margin: 0; flex-shrink: 0; }
.grid--list .school-card__desc { order: 4; flex: 1 1 100%; min-height: 0; }
.grid--list .school-card__meta { order: 5; flex: 1 1 100%; }
.grid--list .course-card { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px 20px; padding: 18px 24px; }
.grid--list .course-card .card__title { flex: 1 1 40%; min-width: 260px; }
.grid--list .course-card .rating { flex: 0 0 auto; }
.grid--list .course-card .card__desc { flex: 1 1 100%; min-height: 0; }
.grid--list .course-card .course-card__meta { flex: 1 1 auto; }
.grid--list .course-card .course-card__price { margin-left: auto; }
.grid--list .course-card .btn { width: auto; }
.grid--list .course-card .course-card__actions { flex: 0 0 auto; margin-left: auto; margin-top: 0; }
.grid--list .course-card .course-card__actions .course-card__cta { flex: 0 0 auto; }
@media (max-width: 760px) {
    .grid--list .school-card { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
    .grid--list .school-card__top,
    .grid--list .school-card__rating,
    .grid--list .school-card__desc,
    .grid--list .school-card__meta,
    .grid--list .school-card__btn { order: 0; flex: 0 0 auto; min-width: 0; margin-left: 0; }
    .grid--list .school-card__btn { width: 100%; }
    .grid--list .course-card { flex-direction: column; align-items: stretch; }
    .grid--list .course-card .card__title { flex: 1 1 auto; min-width: 0; }
    .grid--list .course-card .course-card__price { margin-left: 0; }
    .grid--list .course-card .course-card__actions { width: 100%; margin-left: 0; }
    .grid--list .course-card .btn { width: 100%; }
}

.card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.card--center { max-width: 560px; margin: 60px auto; text-align: center; align-items: center; }
.card__title { font-family: var(--font-display); font-size: 17px; margin: 0; }
.card__title a { color: var(--text); }
.card__title a:hover { color: var(--primary); }
.card__desc { color: var(--muted); font-size: 15px; margin: 0; flex-grow: 1; }

/* ---------- Рейтинг ---------- */
.rating { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); }
.rating__stars { color: var(--star); letter-spacing: 1px; font-size: 13px; }
.rating__half { position: relative; display: inline-block; letter-spacing: 0; }
.rating__half-fill { position: absolute; left: 0; top: 0; width: var(--fill, 50%); overflow: hidden; white-space: nowrap; }
.rating b { color: var(--text); }
.rating--empty { color: var(--muted); font-size: 14px; }

/* ---------- Бейджи ---------- */
.badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.badge svg { width: 16px; height: 16px; flex-shrink: 0; }
.badge--pro svg { width: 17px; height: 17px; }
.badge--pro { color: var(--pro); }
.badge--verified { color: var(--verified); }
.b--top { color: var(--pro); }
.b--verified { color: var(--verified); }

/* ---------- Карточка школы ---------- */
.school-card { padding: 24px; gap: 12px; transition: border-color .2s ease; }
.school-card:hover { border-color: var(--text); }
.school-card__avatar--logo { object-fit: contain; background: var(--surface); }
.school-profile__brand { display: flex; align-items: center; gap: 14px; }
.school-profile__logo { width: 72px; height: 72px; object-fit: contain; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.school-logo-preview { width: 256px; height: 256px; margin-bottom: 16px; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.school-logo-preview img { width: 100%; height: 100%; object-fit: contain; }
.course-card:hover { border-color: var(--text); }
.school-card__top { display: flex; align-items: center; gap: 14px; }
.school-card__avatar {
    width: 48px;
    height: 48px;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 24px;
    color: #fff;
    flex-shrink: 0;
}
.school-card__name { font-family: var(--font-display); font-weight: 600; font-size: 17px; margin: 0; line-height: 1.25; }
.school-card__name a { color: var(--text); }
.school-card__name a:hover { color: var(--primary); }
.school-card__badges { display: flex; gap: 4px; margin-top: 4px; }
.school-card__badges .b {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.school-card__badges .b.b--first { margin-left: 0; }
.school-card__badges .b svg { width: 20px; height: 20px; }
.school-card__rating { font-size: 13px; color: var(--muted); }
.school-card__desc { color: var(--muted); font-size: 14px; line-height: 1.5; margin: 0; min-height: 63px; }
.school-card__meta { display: flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 12px; color: var(--muted); flex-wrap: wrap; }
.meta-pill { background: transparent; border: 1px solid var(--border); border-radius: var(--r-full); padding: 4px 10px; }
.school-card__price { font-family: var(--font-body); font-weight: 600; font-size: 16px; color: var(--text); margin-left: auto; white-space: nowrap; cursor: help; }
.school-card__btn {
    width: 100%;
    justify-content: center;
    margin-top: auto;
    background: var(--marigold);
    color: var(--text);
    box-shadow: var(--shadow);
}
.school-card__btn:hover { background: var(--marigold); color: var(--text); box-shadow: var(--shadow-hover); }

.course-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 14px; color: var(--muted); }
.course-card__school { color: var(--muted); font-size: 14px; display: inline-flex; align-items: center; gap: 6px; }
.course-card__school-link { color: inherit; }
.course-card__school-link:hover { color: var(--primary); }
.course-card__school--lg { color: var(--text); font-size: 16px; font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; border-radius: 6px; padding: 3px 6px; margin: -3px -6px; }
.course-card__school--lg:hover { background: var(--bg); text-decoration: none; }
.course-card__school--lg:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.course-card__school-logo { width: 20px; height: 20px; object-fit: contain; border-radius: 4px; background: var(--surface); flex-shrink: 0; }
.course-card__school-avatar {
    width: 22px;
    height: 22px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 14px;
    color: #fff;
    flex-shrink: 0;
}
.school-profile__logo--letter {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 36px;
    color: #fff;
}
.course-card__school--lg .course-card__school-avatar { width: 28px; height: 28px; font-size: 16px; border-radius: 7px; }
.course-card__school--lg .course-card__school-logo { width: 28px; height: 28px; }
.course-card__school--lg .b { width: 24px; height: 24px; }
.course-card__school .b {
    width: 17px;
    height: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: -4px;
    margin-left: 4px;
}
.course-card__school .b.b--first { margin-left: 8px; }
.course-card__school .b svg { width: 17px; height: 17px; }

[data-tip] { position: relative; }
[data-tip]:hover::after {
    content: attr(data-tip);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--bg);
    color: var(--text);
    border: 1px solid var(--border);
    padding: 4px 9px;
    border-radius: 6px;
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
    font-family: var(--font-body);
    box-shadow: var(--shadow);
    pointer-events: none;
    z-index: 20;
}
.course-card__price { display: flex; align-items: baseline; gap: 8px; }

.course-card__actions { display: grid; grid-template-columns: 1fr; gap: 8px; margin-top: auto; }
.course-card__actions .course-card__cta { width: 100%; }
.compare-toggle { width: 100%; }
.compare-toggle__icon { width: 16px; height: 16px; flex-shrink: 0; }
.compare-toggle.is-active { background: var(--marigold); color: var(--text); border-color: var(--marigold); box-shadow: var(--shadow); }
.compare-toggle.is-active:hover { background: var(--marigold-dark); color: var(--text); box-shadow: var(--shadow-hover); }

/* ---------- Цены ---------- */
.price { font-family: var(--font-body); font-weight: 600; color: var(--text); white-space: nowrap; }
.price-period { display: inline-block; margin-left: 6px; color: var(--muted); font-size: 13px; font-weight: 500; white-space: nowrap; }
.price--current { color: var(--amber-ink); }
.price--old { color: var(--muted); font-weight: 400; }
.price--lg { font-size: 22px; }

/* ---------- Кнопки ---------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: var(--r-full);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
    border: 1px solid transparent;
    cursor: pointer;
    text-align: center;
    white-space: nowrap;
    transition: transform .15s ease, box-shadow .15s ease;
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn--primary { background: var(--marigold); color: var(--text); box-shadow: var(--shadow); }
.btn--primary:hover { background: var(--marigold-dark); color: var(--text); box-shadow: var(--shadow-hover); }
.btn--ghost { background: transparent; color: var(--text); border-color: var(--border); }

/* ---------- Направления (route-map) ---------- */
.route-map {
    position: relative;
    display: flex;
    height: 236px;
    margin: 28px 0 4px;
}
.route-map::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    border-top: 2px dashed var(--border);
}
.stop {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    padding: 0;
    font-family: inherit;
    cursor: pointer;
    color: inherit;
    text-decoration: none;
}
.stop:hover { text-decoration: none; }
.stop__stem {
    position: absolute;
    left: 50%;
    width: 2px;
    height: 16px;
    background: var(--border);
    transform: translateX(-50%);
}
.stop.above .stop__stem { bottom: 50%; }
.stop.below .stop__stem { top: 50%; }
.stop__dot {
    position: absolute;
    top: calc(50% + 1px);
    left: 50%;
    transform: translate(-50%, -50%);
    width: var(--size, 18px);
    height: var(--size, 18px);
    border-radius: 50%;
    background: var(--bg);
    border: 2px solid var(--accent);
    z-index: 2;
    transition: width .15s ease, height .15s ease;
}
.stop__label {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 118px;
    text-align: center;
    line-height: 1.25;
}
.stop.above .stop__label { bottom: calc(50% + 20px); }
.stop.below .stop__label { top: calc(50% + 20px); }
.stop__name {
    display: block;
    font-weight: 600;
    font-size: 14.5px;
    color: var(--text);
    transition: color .15s ease;
}
.stop__count {
    display: block;
    font-size: 11px;
    color: var(--muted);
    margin-top: 4px;
}
.stop:hover .stop__dot { width: calc(var(--size, 14px) + 6px); height: calc(var(--size, 14px) + 6px); }
.stop:hover .stop__name { color: var(--accent); }

.stop--c0, .leaders--c0 { --accent: #5b4fe8; }
.stop--c1, .leaders--c1 { --accent: #2f9bff; }
.stop--c2, .leaders--c2 { --accent: #e6488b; }
.stop--c3, .leaders--c3 { --accent: #ff6b00; }
.stop--c4, .leaders--c4 { --accent: #0d9488; }
.stop--c5, .leaders--c5 { --accent: #16a34a; }
.stop--c6, .leaders--c6 { --accent: #9333ea; }
.stop--c7, .leaders--c7 { --accent: #d68910; }
.stop--c8, .leaders--c8 { --accent: #5b6c7d; }

@media (max-width: 760px) {
    .route-map {
        flex-direction: column;
        height: auto;
        gap: 0;
    }
    .route-map::before {
        left: 15px;
        right: auto;
        top: 8px;
        bottom: 8px;
        border-top: none;
        border-left: 2px dashed var(--border);
    }
    .stop { justify-content: flex-start; padding: 14px 0 14px 40px; }
    .stop__stem { display: none; }
    .stop__dot {
        position: absolute;
        left: 16px;
        top: calc(50% + 1px);
        transform: translate(-50%, -50%);
        margin: 0;
    }
    .stop__label { position: static; transform: none; width: auto; text-align: left; }
    .stop.above .stop__label,
    .stop.below .stop__label { position: static; }
}

/* ---------- Лидеры по направлениям ---------- */
.section--leaders { position: relative; }
.section--leaders::before {
    content: "";
    position: absolute;
    top: -2px;
    bottom: 0;
    left: calc(50% - min(470px, 50%) + 237px);
    border-left: 2px dashed var(--border);
}
.leaders {
    position: relative;
    max-width: 940px;
    margin: 28px auto 0;
    display: grid;
    gap: 14px;
}
.leaders__row {
    display: grid;
    grid-template-columns: 200px 76px minmax(0, 1fr);
    align-items: center;
    gap: 0;
}
.leaders__name {
    justify-self: end;
    text-align: right;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 15px;
    line-height: 1.3;
    color: var(--text);
    padding-right: 16px;
}
.leaders__name:hover { color: var(--primary); text-decoration: none; }
.leaders__spine {
    position: relative;
    height: 84px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.leaders__spine::before,
.leaders__spine::after {
    content: "";
    position: absolute;
    top: calc(50% - 1px);
    border-top: 2px dashed var(--border);
}
.leaders__spine::before { left: 0; right: 50%; }
.leaders__spine::after { left: 50%; right: 0; }
.leaders__dot {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -8px 0 0 -8px;
    z-index: 1;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--bg);
    border: 2px solid var(--accent);
}
.leaders__card { min-width: 0; }
.leaders__card .school-card {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px 22px;
    padding: 16px 22px;
}
.leaders__card .school-card__top { flex: 1 1 auto; min-width: 0; }
.leaders__card .school-card__rating { flex: 0 0 auto; margin-left: auto; }
.leaders__card .school-card__meta { flex: 0 0 auto; flex-wrap: nowrap; }
.leaders__card .school-card__price { margin-left: 0; }
@media (max-width: 760px) {
    .leaders__row { grid-template-columns: 1fr; gap: 10px; }
    .section--leaders::before { display: none; }
    .leaders__name { justify-self: start; text-align: left; }
    .leaders__spine { display: none; }
    .leaders__card .school-card { flex-wrap: wrap; }
    .leaders__card .school-card__rating { margin-left: 0; }
    .leaders__card .school-card__meta { flex-wrap: wrap; }
}

/* ---------- Хлебные крошки ---------- */
.breadcrumbs { margin: 14px 0 16px; }
.breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; font-size: 14px; color: var(--muted); }
.breadcrumbs li + li::before { content: "›"; margin: 0 8px 0 2px; color: var(--muted); }
.breadcrumbs a { color: var(--text); border-radius: 6px; padding: 3px 6px; margin: -3px -6px; }
.breadcrumbs a:hover { background: var(--bg); color: var(--text); text-decoration: none; }
.breadcrumbs a:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

/* ---------- Каталог ---------- */
.catalog-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 0 0 40px; }
@media (min-width: 860px) { .catalog-layout { grid-template-columns: 250px 1fr; align-items: start; } }

.filters { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; }
.filters__title { font-size: 16px; margin: 0 0 12px; }
.filters form { display: flex; flex-direction: column; gap: 10px; }
.field { display: flex; flex-direction: column; gap: 4px; }
.field label { font-size: 13px; color: var(--muted); }
.field select, .field input {
    width: 100%;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: 15px;
    background: var(--surface);
}
.checkbox { display: flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; }

.filter-select { position: relative; }
.filter-select__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--surface);
    font-family: var(--font-body);
    font-size: 15px;
    color: var(--text);
    cursor: pointer;
    text-align: left;
}
.filter-select__btn:hover { border-color: var(--text); }
.filter-select__btn svg { width: 14px; height: 14px; flex-shrink: 0; transition: transform .15s ease; }
.filter-select.open .filter-select__btn svg { transform: rotate(180deg); }
.filter-select__menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    min-width: 100%;
    z-index: 30;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-hover);
    padding: 10px;
    display: none;
    flex-direction: column;
    gap: 2px;
}
.filter-select.open .filter-select__menu { display: flex; }

.catalog-list__head { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: flex-end; margin-bottom: 14px; }
.catalog-list__head .page-title { margin: 0; }
.catalog-list__sort { margin-left: auto; }
.catalog-list__sort form { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--muted); }
.catalog-list__sort select { min-width: 0; max-width: 100%; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); font-size: 14px; }

.subcats { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; }
.subcats a {
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    font-size: 14px;
}
.subcats a.is-active, .subcats a:hover { border-color: var(--primary); color: var(--primary); }

/* ---------- Карточка школы/курса ---------- */
.school-profile, .course-profile { padding: 22px; }
.school-profile__head, .course-profile__head { display: flex; flex-wrap: wrap; gap: 16px; justify-content: space-between; align-items: flex-start; }
.school-profile__badges { display: inline-flex; gap: 4px; margin: 0 0 0 2px; align-self: center; }
.school-profile__badges .b {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.school-profile__badges .b.b--first { margin-left: 0; }
.school-profile__badges .b svg { width: 20px; height: 20px; }
.course-profile__school .school-profile__badges { margin-left: 2px; }
.course-profile__school .school-profile__badges .b { width: 20px; height: 20px; margin-left: 0; }
.course-profile__school .school-profile__badges .b svg { width: 20px; height: 20px; }
.school-profile__facts, .course-profile__facts { display: flex; flex-wrap: wrap; gap: 12px 32px; margin: 14px 0 6px; padding: 0; }
.school-profile__facts div, .course-profile__facts div { display: flex; gap: 8px; }
.school-profile__facts dt, .course-profile__facts dt { color: var(--muted); font-size: 14px; margin: 0; }
.school-profile__facts dd, .course-profile__facts dd { margin: 0; font-size: 15px; font-weight: 500; }
.course-profile__school { margin: 0 0 4px; font-size: 15px; }
.course-profile__price { margin-top: 12px; }
.promo-banner {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
    margin-top: 16px; padding: 12px 16px;
    border: 1px dashed var(--amber-ink); border-radius: var(--radius);
    background: var(--amber-ink); color: #fff;
}
.promo-banner__label { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; opacity: .85; }
.promo-banner__code { font-family: var(--font-mono); font-size: 18px; letter-spacing: .04em; }
.promo-banner__desc { font-size: 14px; }
.promo-banner__until { margin-left: auto; font-size: 13px; opacity: .85; }
@media (max-width: 640px) { .promo-banner__until { margin-left: 0; width: 100%; } }
.course-profile__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch; }
.course-profile__actions .compare-toggle { width: auto; }
@media (max-width: 640px) { .course-profile__actions { width: 100%; } .course-profile__actions .btn { width: 100%; } }
.course-profile-section { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); }
.course-profile-section h3 { margin: 16px 0 6px; font-size: 16px; }
.course-feature-list { display: flex; flex-wrap: wrap; gap: 8px; }
.course-feature-list span { padding: 7px 11px; border-radius: var(--r-full); background: #edf3ec; color: #346538; font-size: 13px; font-weight: 600; }
.course-teachers { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.course-teachers article { padding: 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg); }
.course-teachers h3 { margin: 0 0 4px; font-size: 17px; }
.course-teachers span { color: var(--muted); font-size: 13px; }
.course-teachers p { margin: 10px 0 0; font-size: 14px; }
.school-profile-section { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); }
.school-profile-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 0; }
.school-profile-stats div { padding: 14px; border-radius: 10px; background: var(--bg); }
.school-profile-stats dt { color: var(--muted); font-size: 12px; }
.school-profile-stats dd { margin: 5px 0 0; font-size: 18px; font-weight: 700; }
.school-feature-list { display: flex; flex-wrap: wrap; gap: 8px; }
.school-feature-list span { padding: 7px 11px; border-radius: var(--r-full); background: #edf3ec; color: #346538; font-size: 13px; font-weight: 600; }
.school-profile-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.school-contact-list { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.school-faq { display: grid; gap: 10px; }
.school-faq details { padding: 16px 18px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.school-faq summary { cursor: pointer; font-weight: 700; }
.school-faq .prose { margin-top: 12px; }
.account-form-section { display: grid; gap: 16px; margin: 0; padding: 20px; border: 1px solid var(--border); border-radius: var(--r-lg); }
.account-form-section legend { padding: 0 8px; font-family: var(--font-display); font-size: 18px; font-weight: 700; }
.account-form-pair { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.course-teacher-row { display: grid; grid-template-columns: .8fr .8fr 1.4fr; gap: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.account-field__hint { margin: 0; color: var(--muted); font-size: 13px; }
@media (max-width: 640px) { .school-profile-columns, .account-form-pair { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .course-teacher-row { grid-template-columns: 1fr; } }

.prose { color: var(--text); }
.prose h1 { font-size: 26px; margin: 0 0 14px; }
.prose h2 { font-size: 19px; margin: 22px 0 8px; }
.prose p { margin: 0 0 12px; }
.prose ul { margin: 0 0 12px; padding-left: 22px; }
.prose li { margin: 4px 0; }

.tag-list { display: flex; flex-wrap: wrap; gap: 8px; }
.tag {
    padding: 5px 12px;
    border-radius: 999px;
    background: transparent;
    border: 1px solid var(--border);
    font-size: 14px;
    color: var(--text);
}
.tag:hover { border-color: var(--accent); color: var(--accent); }
.tag--active { background: var(--accent); border-color: var(--accent); color: #fff; }
.tag--sub { background: transparent; font-size: 13px; }

/* ---------- Специализации ---------- */
.spec-pills { margin: 14px 0 10px; }

/* ---------- Отзывы ---------- */
.reviews { display: flex; flex-direction: column; gap: 14px; }
.review { margin: 0; padding: 16px 18px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.review__head { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin-bottom: 6px; }
.review__author { font-weight: 600; }
.review p { margin: 0 0 6px; }
.review__date { color: var(--muted); font-size: 13px; }
.review__reply { margin-top: 10px; padding: 10px 12px; background: var(--bg); border-radius: 8px; font-size: 14px; }
.review-verified { display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; padding: 4px 8px; border-radius: var(--r-full); background: #edf3ec; color: #346538; font-size: 11px; font-weight: 700; }
.review-criteria { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 20px; margin: 12px 0; padding: 12px; border-radius: 9px; background: var(--bg); }
.review-criteria div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.review-criteria dt { color: var(--muted); font-size: 12px; }
.review-criteria dd { margin: 0; color: var(--text); font-family: var(--font-mono); font-size: 12px; font-weight: 600; }

/* ---------- Авторизация и личный кабинет ---------- */
.auth-page { min-height: 68vh; display: grid; place-items: center; padding: 48px 0 72px; }
.auth-card { width: min(100%, 480px); padding: 32px; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); box-shadow: 0 24px 70px rgba(29, 27, 22, .06); }
.auth-card--wide { width: min(100%, 540px); }
.submission-chooser .auth-card--wide { width: min(100%, 760px); }
.submission-chooser__roles, .submission-chooser__objects {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.submission-choice {
    position: relative;
    display: flex;
    min-height: 190px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--bg);
    color: var(--text);
    transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.submission-choice:hover { border-color: var(--primary); box-shadow: 0 14px 32px rgba(29, 27, 22, .08); color: var(--text); text-decoration: none; transform: translateY(-2px); }
.submission-choice--accent { background: var(--marigold); border-color: var(--marigold); }
.submission-choice strong { font-family: var(--font-display); font-size: 24px; line-height: 1.1; }
.submission-choice > span:not(.submission-choice__eyebrow):not(.submission-choice__arrow) { max-width: 290px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.submission-choice--accent > span:not(.submission-choice__eyebrow):not(.submission-choice__arrow) { color: var(--text); }
.submission-choice__eyebrow { color: var(--amber-ink); font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.submission-choice__arrow { position: absolute; right: 22px; bottom: 20px; font-size: 24px; line-height: 1; }
.submission-chooser__back { display: inline-block; margin-top: 20px; color: var(--muted); font-size: 13px; }
@media (max-width: 640px) {
    .submission-chooser__roles, .submission-chooser__objects { grid-template-columns: 1fr; }
    .submission-choice { min-height: 150px; padding: 20px; }
}
.auth-card__intro { margin-bottom: 24px; }
.auth-card__marker, .account-hero__label, .account-review__kind {
    display: block;
    color: var(--amber-ink);
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
}
.auth-card h1 { margin: 7px 0 8px; font-size: clamp(30px, 6vw, 42px); letter-spacing: -.035em; line-height: 1.08; }
.auth-card__intro p, .review-compose__hint { margin: 0; color: var(--muted); }
.account-form { display: flex; flex-direction: column; gap: 16px; }
.account-field { display: flex; flex-direction: column; gap: 7px; }
.account-field > span, .rating-input legend { font-size: 13px; font-weight: 600; color: var(--muted); }
.account-field input, .account-field textarea, .account-field select {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--bg);
    color: var(--text);
    font: inherit;
    transition: border-color .2s cubic-bezier(.16, 1, .3, 1), background .2s cubic-bezier(.16, 1, .3, 1);
}
.account-field input:focus, .account-field textarea:focus, .account-field select:focus { border-color: var(--text); background: var(--surface); }
.account-field textarea { resize: vertical; line-height: 1.6; }
.account-field small { color: var(--muted); font-size: 12px; }
.account-check { display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: start; font-size: 13px; color: var(--muted); cursor: pointer; }
.account-check input { width: 17px; height: 17px; margin: 2px 0 0; accent-color: var(--amber-ink); }
.registration-captcha { margin: 0; padding: 14px; border: 1px solid var(--border); border-radius: 10px; }
.registration-captcha legend { padding: 0 5px; font-size: 13px; font-weight: 700; color: var(--muted); }
.registration-captcha p { margin: 0 0 10px; font-size: 13px; color: var(--muted); }
.registration-captcha__choices { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.registration-captcha__choices label { position: relative; cursor: pointer; }
.registration-captcha__choices input { position: absolute; opacity: 0; }
.registration-captcha__choices img { display: block; width: 64px; height: 64px; border: 2px solid transparent; border-radius: 9px; transition: border-color .15s ease, transform .15s ease; }
.registration-captcha__choices label:hover img, .registration-captcha__choices input:checked + img { border-color: var(--text); transform: translateY(-2px); }
.registration-captcha__choices input:focus-visible + img { outline: 2px solid var(--marigold); outline-offset: 2px; }
.account-form__submit { width: 100%; margin-top: 4px; }
.auth-card__switch { margin: 20px 0 0; padding-top: 18px; border-top: 1px solid var(--border); color: var(--muted); font-size: 14px; text-align: center; }
.auth-card__note, .auth-card__intro-text { color: var(--muted); font-size: 13px; }
.form-message { margin: 0 0 18px; padding: 12px 14px; border-radius: 9px; font-size: 14px; }
.form-message--error { background: #fdebea; color: #8f2925; }
.form-message--success { background: #edf3ec; color: #346538; }

.account-page { padding: 38px 0 64px; }
.account-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 30px 0 28px; border-bottom: 1px solid var(--border); }
.account-hero h1 { margin: 6px 0 2px; font-size: clamp(34px, 6vw, 54px); letter-spacing: -.04em; line-height: 1; }
.account-hero p { margin: 8px 0 0; color: var(--muted); }
.account-page > .form-message { margin-top: 22px; }
.verification-banner, .account-shortcut { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 20px; padding: 16px 18px; border-radius: var(--r-lg); background: #fbf3db; color: #765400; }
.verification-banner > div, .account-shortcut > div { display: flex; flex-direction: column; gap: 2px; }
.verification-banner span, .account-shortcut span { font-size: 13px; }
.account-shortcut { background: #edf3ec; color: #346538; }
.account-section { padding-top: 34px; }
.account-section__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 18px; margin-bottom: 20px; }
.account-section__head > div { display: flex; align-items: baseline; gap: 12px; }
.account-section__head h2 { margin: 0; font-size: 24px; }
.account-section__count { color: var(--amber-ink); font-family: var(--font-mono); font-size: 13px; }
.account-empty { padding: 44px; border: 1px dashed #c9bea8; border-radius: var(--r-lg); background: rgba(255, 253, 248, .5); text-align: center; }
.account-empty h3 { margin: 0 0 6px; }
.account-empty p { margin: 0; color: var(--muted); }
.account-reviews { display: grid; gap: 12px; }
.account-review { padding: 22px; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); }
.account-review__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.account-review h3 { margin: 4px 0 0; font-size: 18px; }
.account-review h3 a { color: var(--text); }
.account-review p { margin: 12px 0 8px; line-height: 1.6; }
.account-review time { color: var(--muted); font-size: 12px; }
.review-note { margin: 10px 0 0 !important; color: var(--muted); font-size: 12px; }
.review-note--verified { color: #346538; font-weight: 700; }
.review-rejection { padding: 10px 12px; border-radius: 8px; background: #fdebea; color: #8f2925; font-size: 13px; }
.evidence-form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.evidence-form label { color: var(--muted); font-size: 12px; }
.evidence-form input { display: block; margin-top: 5px; max-width: 100%; }
.complaint-box { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border); }
.complaint-box summary { color: var(--muted); font-size: 13px; cursor: pointer; }
.complaint-box .account-form { margin-top: 12px; }

.admin-page { padding: 36px 0 64px; }
.admin-section { margin-top: 34px; }
.admin-section h2 { margin: 0 0 14px; }
.admin-item { margin-bottom: 12px; padding: 20px; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); }
.admin-item__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.admin-item__head > div { display: flex; flex-direction: column; }
.admin-item__head span, .admin-meta { color: var(--muted); font-size: 12px; }
.admin-item blockquote { margin: 12px 0; padding: 12px; border-left: 3px solid var(--marigold); background: var(--bg); }
.admin-decision { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; }
.admin-decision input { flex: 1 1 220px; min-width: 0; padding: 11px 13px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg); font: inherit; }
.account-review__rating { display: flex; align-items: center; gap: 9px; margin-top: 12px; }
.account-review__rating-value { color: var(--text); font-family: var(--font-display); font-size: 18px; font-weight: 700; }
.account-review__stars { display: inline-flex; color: #d7cdbb; font-size: 18px; letter-spacing: 2px; }
.account-review__star { position: relative; display: inline-block; }
.account-review__star--full { color: var(--star); }
.account-review__star--partial > span { position: absolute; inset: 0 auto 0 0; width: var(--fill); overflow: hidden; color: var(--star); white-space: nowrap; }
.account-review__rating-label { color: var(--muted); font-size: 12px; }
.review-status { display: inline-flex; padding: 5px 9px; border-radius: var(--r-full); font-size: 11px; font-weight: 700; white-space: nowrap; }
.review-status--pending { background: #fbf3db; color: #8b6200; }
.review-status--approved { background: #edf3ec; color: #346538; }
.review-status--rejected { background: #fdebea; color: #8f2925; }

.school-cabinet {
    display: grid;
    grid-template-columns: minmax(240px, 280px) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.school-cabinet > .account-hero,
.school-cabinet > .form-message {
    grid-column: 1 / -1;
}

.school-cabinet .cabinet-nav {
    position: sticky;
    top: 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--surface);
}

.school-cabinet .cabinet-nav__link {
    display: block;
    padding: 13px 14px;
    border-radius: 14px;
    color: var(--text);
    transition: background .2s cubic-bezier(.16, 1, .3, 1), transform .2s cubic-bezier(.16, 1, .3, 1), border-color .2s cubic-bezier(.16, 1, .3, 1);
}

.school-cabinet .cabinet-nav__link:hover {
    text-decoration: none;
    background: var(--bg);
    transform: translateX(2px);
}

.school-cabinet .cabinet-nav__link.is-active {
    background: #fbf3db;
    color: var(--text);
    font-weight: 700;
}

.school-cabinet > .account-section {
    min-width: 0;
}

.school-cabinet .account-hero {
    padding-top: 0;
}

.school-cabinet__hero-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
}

.school-cabinet__hero-actions .school-switch label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.school-cabinet__hero-actions .school-switch select {
    min-width: 220px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface);
    font: inherit;
}

.school-cabinet .account-section {
    padding-top: 0;
}

.review-compose { max-width: 720px; margin: 0 auto; padding: 32px 0 64px; }
.review-compose__back { display: inline-block; margin-bottom: 16px; color: var(--muted); font-size: 14px; }
.review-compose__card { padding: 30px; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); }
.review-compose__card h1 { margin: 7px 0 8px; font-size: clamp(28px, 5vw, 40px); letter-spacing: -.03em; }
.review-compose__hint { margin-bottom: 24px; }
.rating-input { margin: 0; padding: 0; border: 0; }
.rating-input__options { display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; margin-top: 6px; }
.rating-input input { position: absolute; opacity: 0; pointer-events: none; }
.rating-input label { color: #d7cdbb; font-size: 34px; line-height: 1; cursor: pointer; transition: color .15s cubic-bezier(.16, 1, .3, 1), transform .15s cubic-bezier(.16, 1, .3, 1); }
.rating-input label:hover, .rating-input label:hover ~ label, .rating-input input:checked ~ label { color: var(--star); }
.rating-input input:focus-visible + label { outline: 2px solid var(--marigold); outline-offset: 2px; }
.rating-input label:active { transform: scale(.92); }
.criteria-rating { display: grid; gap: 0; border-top: 1px solid var(--border); }
.criteria-rating__intro { padding: 18px 0 12px; }
.criteria-rating__intro h2 { margin: 0 0 3px; font-size: 18px; }
.criteria-rating__intro p { margin: 0; color: var(--muted); font-size: 13px; }
.rating-input--row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.rating-input--row legend { float: left; width: auto; }
.rating-input--row .rating-input__options { flex-shrink: 0; margin: 0; }
.rating-input--row label { font-size: 27px; }

.section__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-bottom: 14px; }
.section__head .section__title { margin: 0; }

@media (max-width: 640px) {
    .auth-page { min-height: auto; padding: 24px 0 42px; }
    .auth-card, .review-compose__card { padding: 22px; }
    .account-hero { align-items: flex-start; flex-direction: column; }
    .account-section__head { align-items: stretch; flex-direction: column; }
    .account-section__head .btn { width: 100%; }
    .account-empty { padding: 30px 20px; }
    .account-review__top { flex-direction: column; gap: 12px; }
    .verification-banner, .account-shortcut { align-items: stretch; flex-direction: column; }
    .admin-item__head { flex-direction: column; }
    .admin-decision .btn { width: 100%; }
    .admin-decision__actions { flex-direction: column; }
    .review-criteria { grid-template-columns: 1fr; }
    .rating-input--row { align-items: flex-start; flex-direction: column; gap: 8px; }
}

/* ---------- Админ-панель ---------- */
.admin-page { max-width: none; }
.admin-hero-actions { display: flex; align-items: center; gap: 16px; }

.admin-workspace {
    display: grid;
    grid-template-columns: minmax(210px, 230px) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
    margin-top: 28px;
}

.admin-sidebar {
    position: sticky;
    top: 24px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--surface);
}

.admin-sidebar__title {
    margin-bottom: 14px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.admin-tabs {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.admin-tabs__link {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 13px 14px;
    border: 1px solid transparent;
    border-radius: 14px;
    color: var(--text);
    background: transparent;
    transition: border-color .2s cubic-bezier(.16, 1, .3, 1), background .2s cubic-bezier(.16, 1, .3, 1), transform .2s cubic-bezier(.16, 1, .3, 1);
}

.admin-tabs__link:hover {
    text-decoration: none;
    border-color: var(--border);
    background: var(--bg);
    transform: translateX(2px);
}

.admin-tabs__link.is-active {
    border-color: var(--marigold);
    background: #fbf3db;
}

.admin-tabs__link--muted {
    color: var(--muted);
    cursor: default;
}

.admin-tabs__link--muted:hover {
    border-color: transparent;
    background: transparent;
    transform: none;
}

.admin-tabs__link span {
    font-size: 15px;
    font-weight: 700;
}

.admin-tabs__link small {
    color: var(--muted);
    font-size: 12px;
}

.admin-content { min-width: 0; }
.admin-panel + .admin-panel { margin-top: 22px; }

@media (max-width: 960px) {
    .admin-workspace { grid-template-columns: 1fr; }
    .admin-sidebar { position: static; padding: 12px; }
    .admin-sidebar__title { margin: 2px 4px 8px; }
    .admin-tabs {
        flex-direction: row;
        gap: 6px;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: thin;
    }
    .admin-tabs__link { min-width: max-content; padding: 10px 12px; }
}

.admin-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--surface);
}

.admin-toolbar__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.admin-search {
    min-width: min(100%, 280px);
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg);
    font: inherit;
}

.admin-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border: 1px solid var(--border);
    border-radius: var(--r-full);
    background: var(--bg);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.admin-pill--good { background: #edf3ec; border-color: #d7e6d4; color: #346538; }
.admin-pill--warn { background: #fbf3db; border-color: #eddba5; color: #8b6200; }
.admin-pill--bad { background: #fdebea; border-color: #f2c8c4; color: #8f2925; }
.admin-pill--muted { background: var(--surface); color: var(--muted); }

.admin-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--surface);
}

.admin-table {
    width: 100%;
    min-width: 840px;
    border-collapse: collapse;
    font-size: 14px;
}

.admin-table th,
.admin-table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.admin-table th {
    background: var(--bg);
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.admin-table tr:last-child td { border-bottom: 0; }
.admin-table tbody tr { transition: background .16s cubic-bezier(.16, 1, .3, 1); }
.admin-table tbody tr:hover { background: rgba(251, 243, 219, .32); }

.admin-table--fit { min-width: 0; table-layout: auto; }
.admin-table--fit .admin-table__title { min-width: 0; }
.admin-table--fit .admin-table__title b { word-break: break-word; }
.admin-table--fit .admin-table__metric { white-space: normal; }
.admin-table--fit .admin-code-details { max-width: 340px; min-width: 0; overflow: hidden; }
.admin-table--fit .admin-code-details summary { max-width: 100%; }

.admin-setting-edit { display: flex; align-items: center; gap: 8px; min-width: 0; }
.admin-setting-edit .admin-search { flex: 1 1 auto; width: 100%; max-width: 420px; min-width: 0; padding: 7px 10px; font-size: 13px; }
.admin-setting-edit textarea.admin-search { resize: vertical; }

.admin-log-details {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 8px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg);
}

.admin-log-details__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    font-size: 12px;
}

.admin-log-details__row span { color: var(--muted); font-family: var(--font-mono); white-space: nowrap; }
.admin-log-details__row b { color: var(--text); font-weight: 600; word-break: break-word; text-align: right; }

.admin-log-tech summary { cursor: pointer; list-style: none; }
.admin-log-tech summary::-webkit-details-marker { display: none; }
.admin-log-tech summary::after { content: '▸'; margin-left: 6px; color: var(--muted); font-size: 11px; }
.admin-log-tech[open] summary::after { content: '▾'; }
.admin-log-tech__body {
    margin-top: 4px;
    color: var(--muted);
    font-family: var(--font-mono);
    font-size: 12px;
    word-break: break-all;
}

.admin-log-tech__body span {
    display: block;
    color: var(--text);
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 600;
}

.admin-table__title {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 220px;
}

.admin-table__title b { color: var(--text); font-size: 15px; }
.admin-table__title span, .admin-table__muted { color: var(--muted); font-size: 12px; }
.admin-table__title .school-card__avatar { color: #fff; font-size: 24px; }
.admin-table__metric { font-family: var(--font-mono); font-size: 13px; white-space: nowrap; }
.admin-table__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-table__actions .btn { padding: 8px 10px; font-size: 12px; }
.admin-table__code { max-width: 420px; font-family: var(--font-mono); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.admin-code-details { max-width: 520px; }
.admin-code-details summary {
    max-width: 520px;
    color: var(--muted);
    font-family: var(--font-mono);
    font-size: 12px;
    line-height: 1.5;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}
.admin-code-details[open] summary {
    margin-bottom: 8px;
    color: var(--text);
    white-space: normal;
}
.admin-code-details pre {
    max-height: 260px;
    margin: 0;
    padding: 12px;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--bg);
    color: var(--text);
    font-family: var(--font-mono);
    font-size: 12px;
    line-height: 1.5;
    white-space: pre-wrap;
    word-break: break-word;
}

.admin-queue { display: flex; flex-direction: column; gap: 24px; }

.admin-review {
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--surface);
}

.admin-review__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.admin-review__head h3 {
    margin: 4px 0 0;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
}

.admin-review__type {
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--r-full);
    background: var(--marigold);
    color: var(--text);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.admin-review__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin-bottom: 16px;
    color: var(--muted);
    font-size: 13px;
}

.admin-review__meta b {
    font-weight: 600;
    color: var(--text);
}

.admin-review__text {
    padding: 16px;
    margin-bottom: 20px;
    border-left: 3px solid var(--border);
    background: var(--bg);
    border-radius: 4px;
}

.admin-review__text p {
    margin: 0;
    line-height: 1.6;
}

.admin-decision {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.admin-decision__field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.admin-decision__field label {
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
}

.admin-decision__field textarea,
.admin-decision__field select {
    padding: 10px 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
    resize: vertical;
}

.admin-decision__field textarea:focus,
.admin-decision__field select:focus {
    outline: 2px solid var(--marigold);
    outline-offset: 0;
    border-color: var(--marigold);
}

.admin-decision__actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.admin-verification {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
}

.admin-verification__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.admin-verification__head h4 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.admin-verification__file {
    padding: 4px 10px;
    border-radius: 6px;
    background: var(--bg);
    color: var(--muted);
    font-family: var(--font-mono);
    font-size: 12px;
}

.admin-verification__links {
    display: inline-flex;
    gap: 8px;
    flex-wrap: wrap;
}

.admin-complaint {
    padding: 24px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--surface);
}

.admin-complaint__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.admin-complaint__head h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
}

.admin-complaint__date {
    color: var(--muted);
    font-size: 13px;
}

.admin-complaint__reason {
    margin-bottom: 16px;
}

.admin-complaint__reason b {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
}

.admin-complaint__reason p {
    margin: 0;
    padding: 12px;
    background: #fef2f2;
    border-left: 3px solid #dc2626;
    border-radius: 4px;
    line-height: 1.6;
}

.admin-complaint__review {
    margin-bottom: 20px;
}

.admin-complaint__review b {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
}

.admin-complaint__review blockquote {
    margin: 0;
    padding: 12px;
    background: var(--bg);
    border-left: 3px solid var(--border);
    border-radius: 4px;
    line-height: 1.6;
}

.admin-assign {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.admin-assign__form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 600px;
}

.admin-assign__fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.admin-assign__hint {
    padding: 16px;
    background: var(--bg);
    border-left: 3px solid var(--marigold);
    border-radius: 4px;
}

.admin-assign__hint p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.6;
}

@media (max-width: 640px) {
    .admin-assign__fields {
        grid-template-columns: 1fr;
    }
}

/* ---------- Модальное окно ---------- */
.modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.modal__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    animation: fadeIn 0.2s ease-out;
}

.modal__content {
    position: relative;
    max-width: 480px;
    width: 100%;
    padding: 32px;
    background: var(--surface);
    border-radius: var(--r-lg);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    text-align: center;
    animation: slideUp 0.3s ease-out;
}

.modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--muted);
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.modal__close:hover {
    background: var(--bg);
    color: var(--text);
}

.modal__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: var(--marigold);
    color: var(--text);
}

.modal__content h2 {
    margin: 0 0 12px;
    font-size: 24px;
    font-weight: 600;
}

.modal__content > p {
    margin: 0 0 24px;
    color: var(--muted);
    line-height: 1.6;
}

.modal__actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-bottom: 16px;
}

.modal__actions form {
    margin: 0;
}

.modal__hint {
    margin: 0;
    padding-top: 16px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    font-size: 13px;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 640px) {
    .modal__content {
        padding: 24px;
    }
    
    .modal__actions {
        flex-direction: column;
    }
    
    .modal__actions .btn {
        width: 100%;
    }
}

/* ---------- Админ: статистика ---------- */
.admin-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 16px;
    margin-bottom: 32px;
}

.admin-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px 16px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--surface);
    text-align: center;
}

.admin-stat__value {
    font-family: var(--font-display);
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 6px;
}

.admin-stat__label {
    font-size: 12px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
}

/* ---------- Админ: фильтры ---------- */
.admin-filters {
    margin-bottom: 24px;
    padding: 20px;
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    background: var(--bg);
}

.admin-filters__row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.admin-filter {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.admin-filter span {
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.admin-filter input,
.admin-filter select {
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    font-family: inherit;
    font-size: 14px;
}

.admin-filter input:focus,
.admin-filter select:focus {
    outline: 2px solid var(--marigold);
    outline-offset: 0;
    border-color: var(--marigold);
}

.admin-filters__actions {
    display: flex;
    gap: 12px;
}

@media (max-width: 900px) {
    .admin-filters__row {
        grid-template-columns: 1fr 1fr;
    }

    .admin-workspace {
        grid-template-columns: 1fr;
    }

    .admin-sidebar {
        position: static;
    }

    .school-cabinet {
        grid-template-columns: 1fr;
    }

    .school-cabinet .cabinet-nav {
        position: static;
    }
}

@media (max-width: 640px) {
    .admin-filters__row {
        grid-template-columns: 1fr;
    }
    
    .admin-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .school-cabinet__hero-actions {
        align-items: stretch;
        width: 100%;
    }

    .school-cabinet__hero-actions .school-switch select {
        width: 100%;
        min-width: 0;
    }
}

/* ---------- Пагинация ---------- */
.pagination { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 20px 0; }
.pagination__link {
    padding: 6px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    color: var(--text);
    font-size: 14px;
}
.pagination__link:hover { border-color: var(--primary); color: var(--primary); text-decoration: none; }
.pagination__link--current { background: var(--marigold); border-color: var(--marigold); color: var(--text); }
.pagination__dots { color: var(--muted); }

.empty { color: var(--muted); padding: 20px 0; }
.search-count { color: var(--muted); }

/* ---------- Сравнение курсов ---------- */
.compare { padding: 38px 0 56px; }
.compare__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 32px; margin-bottom: 28px; }
.compare__head .page-title { margin: 0; }
.compare__intro { margin: 8px 0 0; color: var(--muted); }
.compare__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; color: var(--muted); font-size: 14px; }
.compare__count { color: var(--muted); }
.compare__max { opacity: .7; }
.compare-scroll { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); box-shadow: 0 18px 50px rgba(29, 27, 22, .05); scrollbar-color: var(--marigold) var(--bg); }
.compare-table { border-collapse: collapse; width: 100%; min-width: 760px; font-size: 14px; }
.compare-table th, .compare-table td { border: 0; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 16px 18px; text-align: left; vertical-align: top; }
.compare-table tr:last-child th, .compare-table tr:last-child td { border-bottom: 0; }
.compare-table th:last-child, .compare-table td:last-child { border-right: 0; }
.compare-table__label { width: 190px; color: var(--muted); background: var(--bg); font-weight: 600; }
.compare-table__course { min-width: 240px; padding: 22px 44px 22px 18px !important; position: relative; background: #fffaf0; }
.compare-table__name { display: block; font-family: var(--font-display); font-size: 16px; font-weight: 700; line-height: 1.3; margin: 0 0 4px; }
.compare-table__school a { color: var(--muted); font-size: 13px; }
.compare-table__remove {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 26px;
    height: 26px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--muted);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.compare-table__remove:hover { background: var(--bg); color: var(--danger); }
.compare-table__desc { color: var(--muted); line-height: 1.5; }
.compare-table__na { color: var(--muted); }
.compare-table__section th, .compare-table__section td { padding-top: 10px; padding-bottom: 10px; background: var(--marigold); color: var(--text); font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.compare-table__actions td { background: #fffaf0; }
.compare-table__actions .btn { width: 100%; white-space: nowrap; }
.compare-empty { max-width: 520px; margin: 0; align-items: flex-start; }
.compare-empty__text { font-family: var(--font-display); font-size: 18px; font-weight: 700; margin: 0; }
.compare-empty__hint { color: var(--muted); margin: 0; }

.compare-toast {
    position: fixed;
    left: 50%;
    bottom: 28px;
    transform: translateX(-50%) translateY(12px);
    background: var(--text);
    color: var(--surface);
    padding: 12px 20px;
    border-radius: var(--r-full);
    font-size: 14px;
    box-shadow: var(--shadow-hover);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
    z-index: 100;
}
.compare-toast.is-show { opacity: 1; transform: translateX(-50%) translateY(0); }

@media (min-width: 761px) {
    .compare-table__label, .compare-table__section th { position: sticky; left: 0; z-index: 2; }
    .compare-table thead .compare-table__label { z-index: 3; }
}
@media (max-width: 760px) {
    .compare { padding: 24px 0 36px; }
    .compare__head { align-items: flex-start; margin-bottom: 22px; }
    .compare__head .btn { width: 100%; }
    .compare-scroll { margin-right: -20px; border-radius: var(--r-lg) 0 0 var(--r-lg); border-right: 0; }
    .compare-table { min-width: max-content; }
    .compare-table__label { width: 138px; min-width: 138px; }
    .compare-table__course { width: 220px; min-width: 220px; }
    .compare-table th, .compare-table td { padding: 14px; }
    .compare-toast { width: calc(100% - 40px); text-align: center; }
}

/* ---------- Подвал ---------- */
.site-footer { background: #1c1a15; color: #cfc9bd; margin-top: 64px; }
.footer-inner { display: grid; grid-template-columns: 1fr; gap: 24px; padding: 36px 16px 20px; }
@media (min-width: 720px) { .footer-inner { grid-template-columns: 1.4fr 1fr 1fr; } }
.footer-col h3 { font-size: 15px; color: #fff; margin: 0 0 10px; }
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-col li { margin: 6px 0; }
.footer-col a { color: #cfc9bd; }
.footer-col a:hover { color: var(--marigold); }
.footer-col p { margin: 10px 0 0; font-size: 14px; }
.footer-col .logo--footer { color: #fff; }
.footer-bottom { border-top: 1px solid #2f2b22; padding: 14px 16px; font-size: 13px; color: #a49e90; }

/* ---------- Появление при скролле ---------- */
.js .reveal { opacity: 0; transform: translateY(10px); transition: opacity .5s ease, transform .5s ease; }
.js .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    .js .reveal { opacity: 1; transform: none; transition: none; }
}
