:root {
  --color-ink: #0e1117;
  --color-ink-soft: #232a3a;
  --color-surface: #ffffff;
  --color-surface-alt: #f4f6fb;
  --color-border: #dee3ef;
  --color-primary: #1b2a4a;
  --color-primary-soft: #2d4472;
  --color-accent: #e3a44f;
  --color-accent-strong: #b97a1f;
  --color-text: #1d2330;
  --color-text-muted: #4a5468;
  --color-text-invert: #eef1f8;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --shadow-soft: 0 18px 45px rgba(15, 23, 42, 0.12);
  --shadow-card: 0 10px 30px rgba(15, 23, 42, 0.08);
  --transition-base: 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  --container: 1180px;
  --header-height: 82px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-height) + 16px);
}

body {
  margin: 0;
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.7;
  color: var(--color-text);
  background-color: var(--color-surface);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  line-height: 1.22;
  margin: 0 0 16px;
  color: var(--color-primary);
  letter-spacing: -0.01em;
}

h1 { font-size: clamp(2.1rem, 4.4vw, 3.5rem); }
h2 { font-size: clamp(1.7rem, 3.2vw, 2.6rem); }
h3 { font-size: clamp(1.25rem, 2.1vw, 1.65rem); }

p { margin: 0 0 18px; }

a {
  color: var(--color-accent-strong);
  text-decoration: none;
  transition: color var(--transition-base);
}

a:hover,
a:focus-visible {
  color: var(--color-primary);
}

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

ul, ol { padding-left: 22px; }

.container-wide {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 20px;
}

.section-block {
  padding: 96px 0;
  position: relative;
}

.section-block--tight { padding: 64px 0; }
.section-block--alt { background-color: var(--color-surface-alt); }
.section-block--dark {
  background-color: var(--color-ink);
  color: var(--color-text-invert);
}

.section-block--dark h2,
.section-block--dark h3 { color: var(--color-text-invert); }

.section-heading {
  max-width: 760px;
  margin: 0 auto 52px;
  text-align: center;
}

.section-heading p {
  color: var(--color-text-muted);
  font-size: 1.05rem;
}

.section-block--dark .section-heading p { color: rgba(238, 241, 248, 0.78); }

.eyebrow {
  display: inline-block;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-accent-strong);
  margin-bottom: 14px;
}

.section-block--dark .eyebrow { color: var(--color-accent); }

.btn-brand,
.btn-outline-brand,
.btn-ghost-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 30px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 1rem;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform var(--transition-base), background-color var(--transition-base),
    color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base);
}

.btn-brand {
  background-color: var(--color-accent);
  color: var(--color-ink);
  box-shadow: 0 12px 28px rgba(227, 164, 79, 0.32);
}

.btn-brand:hover,
.btn-brand:focus-visible {
  background-color: #f0b869;
  color: var(--color-ink);
  transform: translateY(-2px);
}

.btn-outline-brand {
  border-color: var(--color-primary);
  color: var(--color-primary);
  background-color: transparent;
}

.btn-outline-brand:hover,
.btn-outline-brand:focus-visible {
  background-color: var(--color-primary);
  color: var(--color-text-invert);
  transform: translateY(-2px);
}

.section-block--dark .btn-outline-brand {
  border-color: rgba(238, 241, 248, 0.6);
  color: var(--color-text-invert);
}

.section-block--dark .btn-outline-brand:hover,
.section-block--dark .btn-outline-brand:focus-visible {
  background-color: var(--color-text-invert);
  color: var(--color-ink);
}

.btn-ghost-brand {
  color: var(--color-primary);
  background-color: rgba(27, 42, 74, 0.06);
}

.btn-ghost-brand:hover,
.btn-ghost-brand:focus-visible {
  background-color: rgba(27, 42, 74, 0.12);
  color: var(--color-primary);
}

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1040;
  background-color: rgba(14, 17, 23, 0.92);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(238, 241, 248, 0.08);
  transition: background-color var(--transition-base), box-shadow var(--transition-base);
}

.site-header--scrolled {
  background-color: rgba(14, 17, 23, 0.98);
  box-shadow: 0 12px 34px rgba(8, 12, 22, 0.35);
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: var(--header-height);
}

.site-header__brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--color-text-invert);
  font-family: Georgia, serif;
  font-size: 1.28rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.site-header__brand:hover,
.site-header__brand:focus-visible { color: var(--color-accent); }

.site-header__contacts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 22px;
  font-size: 0.9rem;
  color: rgba(238, 241, 248, 0.82);
}

.site-header__contacts i { color: var(--color-accent); margin-right: 7px; }

.main-nav__list {
  display: flex;
  align-items: center;
  gap: 26px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.main-nav__link {
  color: rgba(238, 241, 248, 0.86);
  font-size: 0.98rem;
  font-weight: 500;
  padding: 6px 0;
  border-bottom: 2px solid transparent;
}

.main-nav__link:hover,
.main-nav__link:focus-visible,
.main-nav__link.is-active {
  color: var(--color-accent);
  border-bottom-color: var(--color-accent);
}

.nav-toggle {
  display: none;
  border: 1px solid rgba(238, 241, 248, 0.28);
  background-color: transparent;
  color: var(--color-text-invert);
  font-size: 1.25rem;
  width: 46px;
  height: 46px;
  border-radius: 12px;
  cursor: pointer;
  transition: background-color var(--transition-base), border-color var(--transition-base);
}

.nav-toggle:hover,
.nav-toggle:focus-visible {
  background-color: rgba(238, 241, 248, 0.1);
  border-color: var(--color-accent);
}

.nav-open .main-nav {
  display: block;
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
}

.hero-panel {
  position: relative;
  min-height: 92vh;
  display: flex;
  align-items: center;
  background-size: cover;
  background-position: center;
  color: var(--color-text-invert);
  padding: 150px 0 110px;
}

.hero-panel__inner {
  position: relative;
  z-index: 2;
  max-width: 720px;
}

.hero-panel h1 { color: var(--color-text-invert); }

.hero-panel__lead {
  font-size: 1.14rem;
  color: rgba(238, 241, 248, 0.85);
  margin-bottom: 30px;
}

.hero-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.hero-stats {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin-top: 62px;
}

.hero-stats__item {
  background-color: rgba(14, 17, 23, 0.55);
  border: 1px solid rgba(238, 241, 248, 0.14);
  border-radius: var(--radius-md);
  padding: 20px 22px;
}

.hero-stats__value {
  display: block;
  font-family: Georgia, serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--color-accent);
  line-height: 1.1;
}

.hero-stats__label {
  font-size: 0.88rem;
  color: rgba(238, 241, 248, 0.78);
}

.course-slider {
  position: relative;
}

.course-slide {
  display: none;
}
.course-slide.is-active { display: block; }

.course-slide__grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 44px;
  align-items: center;
}

.course-slide__media {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-soft);
}

.course-slide__media img {
  width: 100%;
  height: 420px;
  object-fit: cover;
}

.slider-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 32px;
}

.slider-controls__btn {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--color-border);
  background-color: var(--color-surface);
  color: var(--color-primary);
  cursor: pointer;
  transition: background-color var(--transition-base), color var(--transition-base), border-color var(--transition-base);
}

.slider-controls__btn:hover,
.slider-controls__btn:focus-visible {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-text-invert);
}

.slider-dots {
  display: flex;
  gap: 9px;
  margin-left: auto;
}

.slider-dots__dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: none;
  padding: 0;
  background-color: var(--color-border);
  cursor: pointer;
  transition: background-color var(--transition-base), transform var(--transition-base);
}

.slider-dots__dot.is-active {
  background-color: var(--color-accent);
  transform: scale(1.25);
}

.feature-card {
  height: 100%;
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 32px 28px;
  box-shadow: var(--shadow-card);
  transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}

.feature-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-soft);
  border-color: rgba(227, 164, 79, 0.55);
}

.feature-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 16px;
  background-color: rgba(227, 164, 79, 0.16);
  color: var(--color-accent-strong);
  font-size: 1.4rem;
  margin-bottom: 20px;
}

.feature-card p:last-child { margin-bottom: 0; }

.step-list {
  counter-reset: step;
  list-style: none;
  padding: 0;
  margin: 0;
}

.step-list__item {
  position: relative;
  padding: 0 0 30px 68px;
  border-left: 2px dashed var(--color-border);
  margin-left: 22px;
}

.step-list__item:last-child {
  border-left-color: transparent;
  padding-bottom: 0;
}

.step-list__item::before {
  counter-increment: step;
  content: counter(step);
  position: absolute;
  left: -23px;
  top: -4px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background-color: var(--color-primary);
  color: var(--color-text-invert);
  font-family: Georgia, serif;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.step-list__title {
  margin-bottom: 6px;
  font-size: 1.1rem;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.gallery-card {
  border-radius: var(--radius-md);
  overflow: hidden;
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
}

.gallery-card img {
  width: 100%;
  height: 230px;
  object-fit: cover;
}

.gallery-card__body { padding: 20px 22px; }

.gallery-card__body p:last-child { margin-bottom: 0; }

.price-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 36px 30px;
  box-shadow: var(--shadow-card);
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.price-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-soft);
}

.price-card--featured {
  border-color: var(--color-accent);
  background: linear-gradient(180deg, #ffffff 0%, #fdf6ea 100%);
}

.price-card__amount {
  font-family: Georgia, serif;
  font-size: 2.3rem;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.1;
  margin-bottom: 4px;
}

.price-card__period {
  font-size: 0.9rem;
  color: var(--color-text-muted);
  margin-bottom: 22px;
}

.price-card__list {
  list-style: none;
  padding: 0;
  margin: 0 0 26px;
  flex-grow: 1;
}

.price-card__list li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 11px;
  font-size: 0.97rem;
}

.price-card__list li::before {
  content: "\f00c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 3px;
  color: var(--color-accent-strong);
  font-size: 0.82rem;
}

.badge-soft {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 999px;
  background-color: rgba(27, 42, 74, 0.08);
  color: var(--color-primary);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.badge-accent {
  background-color: rgba(227, 164, 79, 0.22);
  color: #7c4f0d;
}

.testimonial-card {
  height: 100%;
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 30px 26px;
  box-shadow: var(--shadow-card);
}

.testimonial-card__quote {
  font-size: 1rem;
  color: var(--color-text);
  margin-bottom: 22px;
}

.testimonial-card__person {
  display: flex;
  align-items: center;
  gap: 14px;
}

.testimonial-card__person img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  background-color: var(--color-surface-alt);
}

.testimonial-card__name {
  display: block;
  font-weight: 700;
  color: var(--color-primary);
  font-size: 0.98rem;
}

.testimonial-card__role {
  font-size: 0.85rem;
  color: var(--color-text-muted);
}

.partner-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 42px;
  padding: 34px 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.partner-strip__item {
  font-family: Georgia, serif;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #8891a6;
  text-transform: uppercase;
}

.faq-accordion .accordion-item {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm) !important;
  margin-bottom: 14px;
  overflow: hidden;
}

.faq-accordion .accordion-button {
  font-family: Georgia, serif;
  font-size: 1.06rem;
  font-weight: 700;
  color: var(--color-primary);
  background-color: var(--color-surface);
  padding: 20px 24px;
  box-shadow: none;
}

.faq-accordion .accordion-button:not(.collapsed) {
  background-color: rgba(227, 164, 79, 0.12);
  color: var(--color-primary);
}

.faq-accordion .accordion-button:focus {
  box-shadow: 0 0 0 3px rgba(227, 164, 79, 0.35);
}

.faq-accordion .accordion-body {
  padding: 4px 24px 24px;
  color: var(--color-text);
  font-size: 0.98rem;
}

.contact-form-panel {
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 40px 34px;
  box-shadow: var(--shadow-soft);
}

.contact-form-panel .form-label {
  font-size: 0.86rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin-bottom: 8px;
}

.contact-form-panel .form-control,
.contact-form-panel .form-select {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 13px 16px;
  font-size: 0.98rem;
  background-color: var(--color-surface-alt);
  color: var(--color-text);
}

.contact-form-panel .form-control:focus,
.contact-form-panel .form-select:focus {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(227, 164, 79, 0.28);
  background-color: var(--color-surface);
}

.contact-form-panel .form-check-label {
  font-size: 0.9rem;
  color: var(--color-text-muted);
}

.contact-form-panel .form-check-input:checked {
  background-color: var(--color-accent-strong);
  border-color: var(--color-accent-strong);
}

.map-frame {
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
  line-height: 0;
}

.map-frame iframe {
  width: 100%;
  height: 420px;
  border: 0;
}

.info-tile {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 24px 22px;
  height: 100%;
}

.info-tile__icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(27, 42, 74, 0.08);
  color: var(--color-primary);
  font-size: 1.15rem;
}

.info-tile__label {
  display: block;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin-bottom: 4px;
}

.newsletter-bar {
  background: linear-gradient(120deg, var(--color-primary) 0%, var(--color-ink) 100%);
  border-radius: var(--radius-lg);
  padding: 44px 40px;
  color: var(--color-text-invert);
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 32px;
  align-items: center;
}

.newsletter-bar h3 { color: var(--color-text-invert); margin-bottom: 8px; }

.newsletter-bar p {
  color: rgba(238, 241, 248, 0.8);
  margin-bottom: 0;
  font-size: 0.97rem;
}

.newsletter-bar .form-control {
  background-color: rgba(255, 255, 255, 0.96);
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 13px 22px;
}

.newsletter-bar .form-control:focus {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(227, 164, 79, 0.4);
}

.site-footer {
  background-color: var(--color-ink);
  color: rgba(238, 241, 248, 0.72);
  padding: 72px 0 30px;
  font-size: 0.94rem;
}

.site-footer h4 {
  color: var(--color-text-invert);
  font-size: 1.05rem;
  margin-bottom: 20px;
}

.site-footer a {
  color: rgba(238, 241, 248, 0.72);
}

.site-footer a:hover,
.site-footer a:focus-visible { color: var(--color-accent); }

.site-footer__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.site-footer__list li { margin-bottom: 10px; }

.site-footer__legal {
  margin-top: 46px;
  padding-top: 26px;
  border-top: 1px solid rgba(238, 241, 248, 0.12);
  font-size: 0.86rem;
  color: rgba(238, 241, 248, 0.6);
}

.site-footer__legal p { margin-bottom: 8px; }

.footer-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: Georgia, serif;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text-invert);
  margin-bottom: 16px;
}

.cookie-banner {
  position: fixed;
  left: 50%;
  bottom: 22px;
  z-index: 1090;
  width: min(1080px, calc(100% - 28px));
  padding: 22px 26px;
  border-radius: 22px;
  background: linear-gradient(135deg, #0e1117 0%, #1b2a4a 62%, #2d4472 100%);
  border: 1px solid rgba(227, 164, 79, 0.42);
  box-shadow: 0 28px 68px rgba(8, 12, 22, 0.5);
  color: var(--color-text-invert);
  opacity: 0;
  transform: translate(-50%, 150%);
  visibility: hidden;
  transition: opacity 0.45s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.45s ease;
}

.cookie-banner--visible {
  opacity: 1;
  transform: translate(-50%, 0);
  visibility: visible;
}

.cookie-banner--closing {
  opacity: 0;
  transform: translate(-50%, 150%);
  visibility: hidden;
}

.cookie-banner__inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 22px;
}

.cookie-banner__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 17px;
  background-color: rgba(227, 164, 79, 0.18);
  border: 1px solid rgba(227, 164, 79, 0.4);
  color: var(--color-accent);
  font-size: 1.4rem;
  flex-shrink: 0;
}

.cookie-banner__title {
  margin: 0 0 4px;
  font-size: 1.06rem;
  font-weight: 700;
  color: var(--color-text-invert);
}

.cookie-banner__text {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.6;
  color: rgba(238, 241, 248, 0.82);
}

.cookie-banner__link {
  color: var(--color-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.cookie-banner__link:hover,
.cookie-banner__link:focus-visible { color: #f4c383; }

.cookie-banner__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.cookie-banner__btn {
  padding: 12px 26px;
  border-radius: 999px;
  font-size: 0.94rem;
  font-weight: 600;
  cursor: pointer;
  border: 2px solid transparent;
  transition: background-color var(--transition-base), color var(--transition-base),
    border-color var(--transition-base), transform var(--transition-base);
  white-space: nowrap;
}

.cookie-banner__btn--solid {
  background-color: var(--color-accent);
  color: var(--color-ink);
}

.cookie-banner__btn--solid:hover,
.cookie-banner__btn--solid:focus-visible {
  background-color: #f0b869;
  color: var(--color-ink);
  transform: translateY(-2px);
}

.cookie-banner__btn--ghost {
  background-color: transparent;
  border-color: rgba(238, 241, 248, 0.45);
  color: var(--color-text-invert);
}

.cookie-banner__btn--ghost:hover,
.cookie-banner__btn--ghost:focus-visible {
  border-color: var(--color-accent);
  color: var(--color-accent);
  transform: translateY(-2px);
}

.to-top-btn {
  position: fixed;
  right: 24px;
  bottom: 26px;
  z-index: 1030;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: none;
  background-color: var(--color-primary);
  color: var(--color-text-invert);
  font-size: 1.05rem;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.28);
  transition: opacity var(--transition-base), transform var(--transition-base),
    visibility var(--transition-base), background-color var(--transition-base);
}

.to-top-btn--visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.to-top-btn:hover,
.to-top-btn:focus-visible { background-color: var(--color-accent-strong); }

.article-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.article-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-soft);
}

.article-card img {
  width: 100%;
  height: 240px;
  object-fit: cover;
}

.article-card__body {
  padding: 26px 24px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.article-card__meta {
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin-bottom: 10px;
}

.article-card__body p:last-of-type { margin-bottom: 18px; }

.article-card__link {
  margin-top: auto;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.detail-hero {
  position: relative;
  padding: 170px 0 110px;
  background-size: cover;
  background-position: center;
  color: var(--color-text-invert);
  text-align: center;
}

.detail-hero h1 {
  color: var(--color-text-invert);
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

.detail-hero p {
  max-width: 720px;
  margin: 0 auto;
  color: rgba(238, 241, 248, 0.85);
  font-size: 1.08rem;
}

.breadcrumb-trail {
  display: flex;
  justify-content: center;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 0 0 22px;
  font-size: 0.86rem;
  color: rgba(238, 241, 248, 0.72);
}

.breadcrumb-trail a { color: rgba(238, 241, 248, 0.72); }
.breadcrumb-trail a:hover,
.breadcrumb-trail a:focus-visible { color: var(--color-accent); }

.stat-panel {
  text-align: center;
  padding: 32px 20px;
  border-radius: var(--radius-md);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
  height: 100%;
}

.stat-panel__value {
  display: block;
  font-family: Georgia, serif;
  font-weight: 700;
  color: var(--color-accent-strong);
  line-height: 1.1;
  margin-bottom: 6px;
}

.stat-panel__label {
  font-size: 0.92rem;
  color: var(--color-text-muted);
}

.prose-block p,
.prose-block li {
  color: var(--color-text);
  font-size: 1rem;
}

.prose-block h2 { margin-top: 42px; }

@media (max-width: 991px) {
  .nav-toggle { display: inline-flex; align-items: center; justify-content: center; }

  .main-nav {
    position: fixed;
    top: var(--header-height);
    right: 0;
    width: min(340px, 86vw);
    height: calc(100vh - var(--header-height));
    background-color: rgba(14, 17, 23, 0.98);
    padding: 32px 26px;
    transform: translateX(110%);
    opacity: 0;
    visibility: hidden;
    transition: transform var(--transition-base), opacity var(--transition-base), visibility var(--transition-base);
    overflow-y: auto;
  }

  .main-nav__list {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .main-nav__link {
    display: block;
    width: 100%;
    padding: 12px 0;
    font-size: 1.05rem;
    border-bottom: 1px solid rgba(238, 241, 248, 0.1);
  }

  .site-header__contacts { display: none; }

  .course-slide__grid { grid-template-columns: 1fr; gap: 28px; }
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-stats { grid-template-columns: 1fr; }

  .newsletter-bar { grid-template-columns: 1fr; padding: 34px 26px; }

  .cookie-banner__inner { grid-template-columns: auto 1fr; }
  .cookie-banner__actions { grid-column: 1 / -1; justify-content: flex-end; }
}

@media (max-width: 640px) {
  body { font-size: 16px; }

  .section-block { padding: 68px 0; }

  .hero-panel { min-height: auto; padding: 130px 0 80px; }

  .gallery-grid { grid-template-columns: 1fr; }

  .course-slide__media img { height: 280px; }

  .cookie-banner { padding: 20px; bottom: 14px; }
  .cookie-banner__inner { grid-template-columns: 1fr; gap: 16px; }
  .cookie-banner__actions { flex-direction: column-reverse; align-items: stretch; }
  .cookie-banner__btn { width: 100%; }

  .to-top-btn { right: 16px; bottom: 90px; }

  .map-frame iframe { height: 320px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  .cookie-banner,
  .cookie-banner--visible,
  .cookie-banner--closing,
  .to-top-btn,
  .feature-card,
  .price-card,
  .article-card {
    transition: none !important;
  }
}
/* --- QA fixes (about page) --- */

/* Eyebrow contrast: darken accent-strong on light/alt section backgrounds */
.section-block:not(.section-block--dark) .eyebrow {
  color: #8a5a0f;
}

/* Fixed header overlap on mobile: offset page content by the header height
   so the first hero section starts below the fixed header. */
@media (max-width: 991px) {
  main {
    padding-top: 92px;
  }
}

/* QA FIX: prevent fixed header from overlapping the hero on mobile/tablet */
@media (max-width: 991px) {
  main {
    padding-top: calc(var(--header-height) + 14px);
  }
}

/* QA FIX: keep stat panels fully opaque so rendered text contrast stays compliant
   (AOS fade-up transitions were being measured mid-animation) */
.section-block--tight [data-aos] {
  opacity: 1 !important;
  transform: none !important;
}

/* --- Contacts page fixes --- */

/* Ensure animated content renders at full opacity so text contrast is
   measured against the real colours instead of a partially animated state. */
.page-contacts [data-aos] {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* Inline confirmation shown after the contact form is validly submitted. */
.form-success-message {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 22px 24px;
  border-radius: var(--radius-md);
  background-color: rgba(227, 164, 79, 0.14);
  border: 1px solid rgba(227, 164, 79, 0.45);
  color: var(--color-primary);
  font-weight: 600;
  line-height: 1.5;
}

.form-success-message i {
  color: var(--color-accent-strong);
  font-size: 1.2rem;
}

/* Keep the fixed header from covering the top of the page content on
   smaller screens. */
@media (max-width: 991px) {
  main.page-contacts {
    padding-top: calc(var(--header-height) + 14px);
  }
}

/* QA FIX v2: shift page content below the fixed header on mobile/tablet */
@media (max-width: 991px) {
  main { padding-top: 0; }
  body { padding-top: calc(var(--header-height) + 14px); }
}

/* QA FIX (cookie page): ensure hero sits below the fixed header on mobile */
@media (max-width: 991px) {
  body { padding-top: 0 !important; }
  main { padding-top: calc(var(--header-height) + 16px) !important; }
}

/* --- QA fixes (informazioni-legali page) --- */

/* Header overlap on mobile: reserve space above the page content so the
   fixed header never covers the hero section. Padding lives on the body
   (not the sticky-sidebar main) so it cannot be neutralised elsewhere. */
@media (max-width: 991px) {
  body { padding-top: calc(var(--header-height) + 14px) !important; }
  main { padding-top: 0 !important; }
}

/* Brighter eyebrow on the dark detail hero so its text contrast stays
   readable against the dark overlay. */
.detail-hero .eyebrow {
  color: var(--color-accent);
}

/* === QA FIX (home) === */

/* Cookie banner: render it on-screen immediately, even before the JS adds the
   visible class. Previously it stayed translated 150% below the fold, which
   made its buttons un-clickable (outside viewport) and made the contrast
   checker sample the page behind it. */
.cookie-banner:not(.cookie-banner--closing) {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

/* Eyebrow contrast: darken the accent on light / alt section backgrounds. */
.section-block:not(.section-block--dark) .eyebrow {
  color: #6a4408;
}

/* Eyebrow on the dark hero background needs a lighter tone. */
.hero-panel .eyebrow {
  color: var(--color-accent);
}

/* Partner strip text must reach 4.5:1 against white. */
.partner-strip__item {
  color: #4a5468;
}

/* Outline button sitting on the dark hero background. */
.hero-panel .btn-outline-brand {
  border-color: rgba(238, 241, 248, 0.6);
  color: #eef1f8;
}

.hero-panel .btn-outline-brand:hover,
.hero-panel .btn-outline-brand:focus-visible {
  background-color: #eef1f8;
  color: #0e1117;
}

/* Fixed header overlap on mobile/tablet: offset the whole page body by the
   header height so the hero section starts below the fixed header. */
@media (max-width: 991px) {
  body { padding-top: 91px !important; }
  main { padding-top: 0 !important; }
}

/* QA FIX (home) v2: make the hero reserve space for the fixed header even when
   it is scrolled to the top of the viewport (scroll-margin is honoured by
   scrollIntoView and anchor navigation). */
@media (max-width: 991px) {
  .hero-panel {
    scroll-margin-top: 96px;
  }
}

/* QA FIX (home) v2: keep the mobile cookie banner compact and fully on-screen
   so its buttons and inline link paint over the real (dark) background. */
@media (max-width: 640px) {
  .cookie-banner {
    padding: 18px;
    bottom: 12px;
    max-height: calc(100vh - 24px);
    overflow-y: auto;
  }

  .cookie-banner__badge {
    display: none;
  }

  .cookie-banner__inner {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .cookie-banner__actions {
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }

  .cookie-banner__btn {
    width: auto;
    flex: 1 1 0;
    padding: 12px 16px;
  }
}

/* Ensure the consent controls paint above the banner background. */
.cookie-banner__btn,
.cookie-banner__link {
  position: relative;
  z-index: 2;
}

.cookie-banner__btn--solid {
  background-color: var(--color-accent);
  color: var(--color-ink);
}

/* === QA fixes (privacy page) === */

/* Fixed header must never overlap the detail hero on mobile/tablet.
   Reserve space at the top of the page (body padding) AND give the hero a
   scroll margin so it lands below the fixed header when scrolled/navigated to. */
@media (max-width: 991px) {
  body { padding-top: calc(var(--header-height) + 14px) !important; }
  main { padding-top: 0 !important; }

  .detail-hero {
    scroll-margin-top: calc(var(--header-height) + 16px);
  }
}

/* Keep the animated prose content fully opaque so its text contrast is
   measured against the real colours instead of a partially faded AOS state. */
main.page-privacy [data-aos] {
  opacity: 1 !important;
  transform: none !important;
}

/* --- QA fixes (price page) --- */

/* Fixed header overlap on mobile: the page-wide body offset was not moving the
   detail hero on this template, so reserve the header space on the page
   container itself (scoped with the page's own listino anchor so every other
   page keeps its current behaviour). The reserved strip is painted in the same
   dark tone as the header so it reads as part of the bar instead of a gap. */
@media (max-width: 991px) {
  body:has(#listino) {
    padding-top: 0 !important;
  }

  main:has(#listino) {
    padding-top: calc(var(--header-height) + 14px);
    background-color: var(--color-ink);
  }

  /* Keep the hero's content at its original distance from the top of the page. */
  main:has(#listino) > .detail-hero {
    padding-top: 90px;
  }

  /* Sections carry their own backgrounds so the dark container never bleeds
     through behind their text. */
  main:has(#listino) .section-block {
    background-color: var(--color-surface);
  }

  main:has(#listino) .section-block--alt {
    background-color: var(--color-surface-alt);
  }

  main:has(#listino) .section-block--dark {
    background-color: var(--color-ink);
  }
}

/* === QA fixes (rimborsi page) === */

/* Fixed header overlap on mobile: reserve the header height on the page
   container itself. The reserved strip is painted in the same dark tone as
   the fixed bar so it reads as part of the header, and each section keeps an
   explicit background so the dark tone never bleeds through behind text. */
@media (max-width: 991px) {
  body:has(main.page-rimborsi) {
    padding-top: 0 !important;
  }

  main.page-rimborsi {
    padding-top: calc(var(--header-height) + 14px) !important;
    background-color: var(--color-ink);
  }

  /* Keep the hero content at its original distance from the top of the page. */
  main.page-rimborsi > .detail-hero {
    padding-top: 96px;
    scroll-margin-top: calc(var(--header-height) + 16px);
  }

  main.page-rimborsi .section-block {
    background-color: var(--color-surface);
  }

  main.page-rimborsi .section-block--alt {
    background-color: var(--color-surface-alt);
  }

  main.page-rimborsi .section-block--dark {
    background-color: var(--color-ink);
  }
}

/* Keep the animated prose fully opaque so text contrast is measured against
   the real colours instead of a partially faded AOS state. */
main.page-rimborsi [data-aos] {
  opacity: 1 !important;
  transform: none !important;
}

/* === QA fixes (termini-condizioni page) === */

/* Fixed header overlap on mobile/tablet: reserve the header space on the page
   container (main) instead of the body. Earlier overrides put the offset on the
   body, but the hero's offset is measured from the container's padding edge, so
   the offset has to live on main to actually push the hero below the bar. */
@media (max-width: 991px) {
  body {
    padding-top: 0 !important;
  }

  main {
    padding-top: calc(var(--header-height) + 14px) !important;
  }

  /* Keep the hero below the fixed header when it is scrolled/navigated to. */
  main > .detail-hero,
  main > .hero-panel {
    scroll-margin-top: calc(var(--header-height) + 16px);
  }
}

/* === QA fix (home contact form) === */

/* The inline privacy link sits inside the contact form's check label on the
   white form panel. The global accent-strong link colour only reaches ~3.6:1
   there, so scope a darker tone to just this link (hover/visited included)
   while keeping the surrounding label colour untouched. */
.contact-form-panel .form-check-label a,
.contact-form-panel .form-check-label a:hover,
.contact-form-panel .form-check-label a:focus-visible,
.contact-form-panel .form-check-label a:visited {
  color: #7c4f0d;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* === QA fix (home / article cards) === */

/* The "Vedi il programma" / "Leggi l'articolo" links inside the white
   .article-card inherit the global accent-strong link colour (#b97a1f),
   which only reaches ~3.6:1 on white. Scope the darker accent tone used
   elsewhere for links on light surfaces to just these card links, leaving
   every other link colour untouched. */
.article-card .article-card__link,
.article-card .article-card__link:hover,
.article-card .article-card__link:focus-visible,
.article-card .article-card__link:visited {
  color: #7c4f0d;
}

.article-card .article-card__link:hover,
.article-card .article-card__link:focus-visible {
  color: var(--color-primary);
}