/* Общая тема автошкол поверх Bootstrap 5.3.
   Цвета и шрифты конкретной школы переопределяются в brand/static/css/theme.css */

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("../vendor/montserrat/montserrat-cyrillic-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("../vendor/montserrat/montserrat-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --va-red: #c8161d;
  --va-orange: #f26b1d;
  --va-amber: #fbb034;
  --va-primary: var(--va-orange);
  --va-primary-rgb: 242, 107, 29;
  --va-primary-hover: #dc5a10;
  --va-primary-active: #c94f0b;
  --va-on-primary: #fff;
  --va-on-gradient: #fff;
  --va-accent: var(--va-amber);
  --va-accent-soft: #fff4ec;
  --va-glow-1: rgba(242, 107, 29, .28);
  --va-glow-2: rgba(200, 22, 29, .25);
  --va-font-heading: var(--bs-font-sans-serif);
  --va-heading-style: normal;
  --va-dark: #12141a;
  --va-dark-rgb: 18, 20, 26;
  --va-dark-2: #1b1e26;
  --va-surface: #f5f6f8;
  --va-gradient: linear-gradient(100deg, var(--va-red) 0%, var(--va-orange) 55%, var(--va-amber) 100%);
  --va-radius: 1.25rem;
  --va-shadow: 0 .75rem 2rem rgba(18, 20, 26, .08);

  --bs-font-sans-serif: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --bs-body-color: #23262f;
  --bs-primary: var(--va-primary);
  --bs-primary-rgb: var(--va-primary-rgb);
  --bs-link-color: var(--va-primary-active);
  --bs-link-color-rgb: var(--va-primary-rgb);
  --bs-link-hover-color: var(--va-red);
  --bs-link-hover-color-rgb: 200, 22, 29;
  --bs-border-radius: .75rem;
  --bs-border-radius-lg: 1rem;
  --bs-focus-ring-color: rgba(var(--va-primary-rgb), .35);
}

body { -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, .h1, .h2, .h3, .display-5, .display-6 {
  font-family: var(--va-font-heading); font-style: var(--va-heading-style); font-weight: 800; letter-spacing: -.02em;
}
.h4, .h5, .h6, h5, h6 { font-weight: 700; }
.section { padding-block: clamp(3.5rem, 7vw, 6rem); }
.section-sm { padding-block: clamp(2.5rem, 5vw, 4rem); }
.bg-surface { background: var(--va-surface); }
.bg-va-dark { background: var(--va-dark); color: #e9ebf0; }
.eyebrow {
  display: inline-block; font-size: .75rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--va-primary); margin-bottom: .75rem;
}
.text-accent { color: var(--va-accent) !important; }
.text-gradient {
  background: var(--va-gradient); -webkit-background-clip: text; background-clip: text;
  color: transparent;
}
.skip-link { position: absolute; left: -999px; top: .5rem; z-index: 2000; }
.skip-link:focus { left: .5rem; }

/* Кнопки */
.btn { font-weight: 600; border-radius: 50rem; padding: .7rem 1.5rem; }
.btn-lg { padding: .9rem 2rem; }
.btn-sm { padding: .4rem 1rem; }
.btn-primary {
  --bs-btn-color: var(--va-on-primary); --bs-btn-hover-color: var(--va-on-primary); --bs-btn-active-color: var(--va-on-primary);
  --bs-btn-bg: var(--va-primary); --bs-btn-border-color: var(--va-primary);
  --bs-btn-hover-bg: var(--va-primary-hover); --bs-btn-hover-border-color: var(--va-primary-hover);
  --bs-btn-active-bg: var(--va-primary-active); --bs-btn-active-border-color: var(--va-primary-active);
  --bs-btn-disabled-bg: var(--va-primary); --bs-btn-disabled-border-color: var(--va-primary);
  --bs-btn-focus-shadow-rgb: var(--va-primary-rgb);
}
.btn-gradient {
  color: var(--va-on-gradient); border: 0; background: var(--va-gradient); background-size: 150% 100%;
  transition: background-position .3s ease, transform .15s ease, box-shadow .3s ease;
  box-shadow: 0 .5rem 1.5rem rgba(var(--va-primary-rgb), .35);
}
.btn-gradient:hover, .btn-gradient:focus-visible {
  color: var(--va-on-gradient); background-position: 100% 0; transform: translateY(-1px);
}
.btn-outline-light { --bs-btn-hover-color: var(--va-dark); }

/* Верхняя полоса и шапка */
.topbar { background: var(--va-dark); color: #aab0bd; font-size: .8125rem; }
.topbar a { color: #d7dbe3; text-decoration: none; }
.topbar a:hover { color: #fff; }
.site-header { background: rgba(var(--va-dark-rgb), .96); backdrop-filter: saturate(160%) blur(10px); }
.site-header .navbar-brand img { height: 52px; width: auto; max-width: 46vw; object-fit: contain; }
.footer-logo { height: 72px; width: auto; max-width: 100%; object-fit: contain; }
.site-header .nav-link { color: #e3e6ec; font-weight: 600; font-size: .95rem; }
.site-header .nav-link:hover, .site-header .nav-link.active, .site-header .nav-link:focus { color: #fff; }
.site-header .nav-link.active { box-shadow: inset 0 -2px 0 var(--va-primary); }
.site-header .header-phone { color: #fff; font-weight: 700; text-decoration: none; white-space: nowrap; }
.site-header .header-phone small { display: block; font-weight: 500; color: #9aa1af; font-size: .7rem; }
.dropdown-menu { --bs-dropdown-link-active-bg: var(--va-primary); --bs-dropdown-link-active-color: var(--va-on-primary); border: 0; box-shadow: var(--va-shadow); border-radius: 1rem; padding: .5rem; }
.dropdown-item { border-radius: .6rem; padding: .5rem .85rem; white-space: normal; }
.dropdown-sveden { min-width: min(36rem, 92vw); }
@media (min-width: 992px) {
  .dropdown-sveden .dropdown-sveden-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 .25rem; }
}
@media (max-width: 991.98px) {
  .site-header .navbar-collapse { max-height: calc(100vh - 80px); overflow-y: auto; padding-bottom: 1rem; }
  .site-header .dropdown-menu { background: var(--va-dark-2); box-shadow: none; }
  .site-header .dropdown-item { color: #d7dbe3; }
  .site-header .dropdown-item:hover { background: rgba(255, 255, 255, .06); color: #fff; }
}

/* Hero */
.hero {
  position: relative; overflow: hidden; color: #fff;
  background:
    radial-gradient(60rem 30rem at 85% 10%, var(--va-glow-1), transparent 60%),
    radial-gradient(40rem 25rem at 0% 100%, var(--va-glow-2), transparent 60%),
    var(--va-dark);
  padding-block: clamp(3rem, 7vw, 6rem) clamp(3rem, 6vw, 5rem);
}
.hero h1 { font-size: clamp(2rem, 4.6vw, 3.6rem); line-height: 1.08; }
.hero .lead { color: #c5cad4; }
.hero-car { width: 100%; height: auto; filter: drop-shadow(0 2rem 2rem rgba(0, 0, 0, .5)); }
.hero-points li { display: flex; gap: .6rem; align-items: center; margin-bottom: .5rem; color: #dfe3ea; }
.hero-points i { color: var(--va-accent); }
.hero-form { background: #fff; color: var(--bs-body-color); border-radius: var(--va-radius); box-shadow: 0 2rem 4rem rgba(0, 0, 0, .35); }

/* Карточки */
.card-va {
  border: 0; border-radius: var(--va-radius); background: #fff; box-shadow: var(--va-shadow);
  transition: transform .2s ease, box-shadow .2s ease; height: 100%;
}
a.card-va:hover, .card-va.card-hover:hover { transform: translateY(-4px); box-shadow: 0 1.25rem 2.5rem rgba(18, 20, 26, .14); }
.feature-icon {
  width: 3.5rem; height: 3.5rem; border-radius: 1rem; display: inline-grid; place-items: center;
  font-size: 1.6rem; color: var(--va-on-gradient); background: var(--va-gradient); margin-bottom: 1.25rem;
}

/* Цены / курсы */
.course-card { overflow: hidden; display: flex; flex-direction: column; }
.course-card .course-media { text-decoration: none; position: relative; aspect-ratio: 16 / 10; background: #e9ebef; overflow: hidden; }
.course-card .course-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.course-card:hover .course-media img { transform: scale(1.04); }
.course-badge {
  position: absolute; left: 1rem; top: 1rem; min-width: 3rem; height: 3rem; padding-inline: .6rem;
  border-radius: .9rem; display: grid; place-items: center; font-weight: 800; font-size: 1.15rem;
  color: var(--va-on-gradient); background: var(--va-gradient); box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .25);
}
.course-media-placeholder {
  display: grid; place-items: center; width: 100%; height: 100%; color: rgba(255, 255, 255, .92);
  background: radial-gradient(18rem 12rem at 80% 0%, var(--va-glow-1), transparent 70%), var(--va-dark);
  font-family: var(--va-font-heading); font-style: var(--va-heading-style); font-weight: 800;
  font-size: clamp(3.5rem, 9vw, 5.5rem); letter-spacing: -.02em; line-height: 1;
}
.course-media-placeholder span { background: var(--va-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }
.course-card .card-body { display: flex; flex-direction: column; padding: 1.5rem; }
.course-price { font-size: 1.6rem; font-weight: 800; color: var(--va-dark); }
.course-price small { font-size: .9rem; font-weight: 600; color: #6c7280; }
.check-list { list-style: none; padding: 0; margin: 0; }
.check-list li { position: relative; padding-left: 1.6rem; margin-bottom: .45rem; }
.check-list li::before {
  content: "\F26E"; font-family: "bootstrap-icons"; position: absolute; left: 0; top: 0;
  color: var(--va-primary); font-weight: 700;
}

/* Цифры */
.stat-value { font-size: clamp(2.5rem, 6vw, 4.25rem); font-weight: 800; line-height: 1; }

/* Отзывы — горизонтальная лента */
.scroller {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 1fr); gap: 1.5rem;
  overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin;
  padding: .75rem .75rem 1.5rem; margin: -.75rem -.75rem 0;
}
@media (min-width: 992px) { .scroller { grid-auto-columns: calc((100% - 3rem) / 3); } }
.scroller > * { scroll-snap-align: start; }
.review-card blockquote { font-size: .95rem; }
.review-avatar {
  width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0;
  background: var(--va-gradient); color: var(--va-on-gradient); font-weight: 700;
}
.review-text-clamp { display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; }

/* Галерея */
.gallery-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
@media (min-width: 768px) { .gallery-grid { grid-template-columns: repeat(4, 1fr); } }
.gallery-grid figure { margin: 0; border-radius: 1rem; overflow: hidden; position: relative; aspect-ratio: 4 / 3; }
.gallery-grid img { width: 100%; height: 100%; object-fit: cover; }
.gallery-grid figcaption {
  position: absolute; inset: auto 0 0 0; padding: .6rem .8rem; font-size: .8rem; font-weight: 600; color: #fff;
  background: linear-gradient(transparent, rgba(0, 0, 0, .7));
}

/* Баннер ДОПОГ / CTA */
.banner {
  border-radius: calc(var(--va-radius) * 1.5); overflow: hidden; position: relative; color: #fff;
  background: var(--va-dark);
}
.banner-gradient { background: var(--va-gradient); color: var(--va-on-gradient); }
.banner-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .3; }
.banner:has(.banner-img)::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(var(--va-dark-rgb), .92) 0%, rgba(var(--va-dark-rgb), .55) 70%, rgba(var(--va-dark-rgb), .2) 100%); }
.banner > .banner-body { position: relative; z-index: 1; }
.banner .text-white-50 { color: rgba(255, 255, 255, .78) !important; }

/* Внутренние страницы */
.page-head { background: var(--va-dark); color: #fff; padding-block: 2.5rem; }
.page-head h1 { font-size: clamp(1.6rem, 3.4vw, 2.6rem); margin: 0; }
.breadcrumb { --bs-breadcrumb-divider-color: #8a90a0; --bs-breadcrumb-item-active-color: #aab0bd; font-size: .85rem; margin-bottom: .75rem; }
.breadcrumb a { color: #d7dbe3; text-decoration: none; }
.breadcrumb a:hover { color: #fff; }
.prose { font-size: 1.02rem; line-height: 1.7; }
.prose h2, .prose h3 { margin-top: 2rem; margin-bottom: 1rem; }
.prose table { width: 100%; margin-bottom: 1.5rem; border-collapse: collapse; font-size: .95rem; }
.prose td, .prose th { border: 1px solid #dfe2e8; padding: .65rem .85rem; vertical-align: top; }
.prose tr:nth-child(odd) td { background: #fafbfc; }
.prose img { max-width: 100%; height: auto; border-radius: .5rem; }
.prose figure { margin: 0 0 1rem; }
.table-scroll { overflow-x: auto; }

.doc-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.doc-item {
  display: flex; gap: 1rem; align-items: center; padding: .9rem 1.1rem; border-radius: 1rem;
  background: #fff; border: 1px solid #e6e8ed; text-decoration: none; color: inherit;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.doc-item:hover { border-color: var(--va-primary); box-shadow: var(--va-shadow); color: inherit; }
.doc-item .bi { font-size: 1.75rem; color: var(--va-primary-active); flex-shrink: 0; }
.doc-item .doc-meta { font-size: .78rem; color: #6c7280; }

.side-nav .list-group-item { border: 0; border-radius: .75rem !important; margin-bottom: .2rem; font-size: .9rem; font-weight: 500; }
.side-nav .list-group-item.active { background: var(--va-primary); color: var(--va-on-primary); }
.side-nav .list-group-item:not(.active):hover { background: var(--va-surface); }

.accordion { --bs-accordion-active-bg: var(--va-accent-soft); --bs-accordion-active-color: var(--va-dark); --bs-accordion-btn-focus-box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color); }
.accordion-button { font-weight: 600; }

/* Подвал */
.site-footer { background: var(--va-dark); color: #aab0bd; font-size: .92rem; }
.site-footer h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .12em; color: #fff; margin-bottom: 1.25rem; }
.site-footer a { color: #d7dbe3; text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.site-footer .footer-bottom { border-top: 1px solid rgba(255, 255, 255, .08); font-size: .8rem; }

/* Формы */
.form-control, .form-select { border-radius: .75rem; padding: .75rem 1rem; }
.form-control:focus, .form-select:focus { border-color: var(--va-primary); box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color); }
.form-check-input:checked { background-color: var(--va-primary); border-color: var(--va-primary); }
.hp-field { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.form-note { font-size: .75rem; color: #6c7280; }

.mobile-cta { display: none; }
@media (max-width: 767.98px) {
  .mobile-cta {
    display: flex; position: fixed; z-index: 1030; left: 0; right: 0; bottom: 0; gap: .5rem; padding: .6rem;
    background: rgba(var(--va-dark-rgb), .96); padding-bottom: calc(.6rem + env(safe-area-inset-bottom));
  }
  .mobile-cta .btn { flex: 1; }
  body { padding-bottom: 4.5rem; }
}

/* Версия для слабовидящих */
html.a11y { font-size: 125%; }
html.a11y body, html.a11y .bg-surface, html.a11y .card-va, html.a11y .doc-item { background: #fff !important; color: #000 !important; }
html.a11y .hero, html.a11y .page-head, html.a11y .site-header, html.a11y .topbar, html.a11y .site-footer, html.a11y .bg-va-dark, html.a11y .banner, html.a11y .mobile-cta {
  background: #000 !important; color: #fff !important;
}
html.a11y .hero .lead, html.a11y .hero-points li { color: #fff !important; }
html.a11y .text-gradient { color: inherit; background: none; }
html.a11y img { filter: grayscale(1); }
html.a11y a { text-decoration: underline !important; }
html.a11y .btn-gradient, html.a11y .feature-icon, html.a11y .course-badge, html.a11y .review-avatar { background: #000 !important; color: #fff !important; border: 2px solid #fff; }
html.a11y *:focus-visible { outline: 3px solid #ff0 !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}