/* ═══════════════════════════════════════════════════════════════
   ПРОСТОЙ РИТМ — публичные светлая и тёмная темы
   Этот слой загружается только для общего CMS-шаблона.
═══════════════════════════════════════════════════════════════ */

html[data-theme="light"] {
  color-scheme: light;
  --pr-bg: #f5f5f2;
  --pr-surface: #ffffff;
  --pr-surface-raised: #efefeb;
  --pr-surface-soft: #e7e7e2;
  --pr-text: #191919;
  --pr-text-soft: #666762;
  --pr-border: rgba(25, 25, 25, .12);
  --pr-border-strong: rgba(25, 25, 25, .23);
  --pr-accent: #e8861e;
  --pr-accent-hover: #f09625;
  --pr-link: #2869df;
  --pr-success: #208653;
  --pr-danger: #ba3d36;
  --pr-header: rgba(255, 255, 255, .94);
  --pr-shadow: 0 12px 34px rgba(28, 27, 24, .09);
  --pr-focus: #2869df;

  /* Совместимость с текущими страницами и их CSS-переменными. */
  --black: #191714;
  --dark: #ffffff;
  --card: #ffffff;
  --light: #f5f5f2;
  --light-card: #ffffff;
  --light-card2: #efefeb;
  --text: #191919;
  --text2: #666762;
  --accent: #e8861e;
  --white: #191919;
  --muted: #666762;
  --border: rgba(25, 25, 25, .12);
  --border-l: rgba(25, 25, 25, .12);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --pr-bg: #0c0e11;
  --pr-surface: #171a1f;
  --pr-surface-raised: #22262e;
  --pr-surface-soft: #2b3039;
  --pr-text: #f7f4ee;
  --pr-text-soft: #a7abb3;
  --pr-border: rgba(255, 255, 255, .11);
  --pr-border-strong: rgba(255, 255, 255, .23);
  --pr-accent: #ff7a16;
  --pr-accent-hover: #ff8f36;
  --pr-link: #67a0ff;
  --pr-success: #4bd18b;
  --pr-danger: #ff8077;
  --pr-header: rgba(12, 14, 17, .94);
  --pr-shadow: 0 16px 42px rgba(0, 0, 0, .34);
  --pr-focus: #ffad65;

  --black: #191714;
  --dark: #171a1f;
  --card: #22262e;
  --light: #0c0e11;
  --light-card: #171a1f;
  --light-card2: #22262e;
  --text: #f7f4ee;
  --text2: #a7abb3;
  --accent: #ff7a16;
  --white: #f7f4ee;
  --muted: #a7abb3;
  --border: rgba(255, 255, 255, .11);
  --border-l: rgba(255, 255, 255, .11);
}

html[data-theme] {
  background: var(--pr-bg);
}

html[data-theme] body {
  background: var(--pr-bg);
  color: var(--pr-text);
}

html[data-theme] body,
html[data-theme] header,
html[data-theme] footer,
html[data-theme] .mobile-menu,
html[data-theme] .nav-dropdown-menu,
html[data-theme] .section-light,
html[data-theme] .sec-light,
html[data-theme] .section-dark,
html[data-theme] .sale-light,
html[data-theme] .sale-dark,
html[data-theme] .course-card,
html[data-theme] .review-card,
html[data-theme] .faq-item,
html[data-theme] .c-card,
html[data-theme] .card-light,
html[data-theme] .weby-card,
html[data-theme] .weby-form-wrap,
html[data-theme] .weby-modal__inner {
  transition:
    background-color .19s ease,
    border-color .19s ease,
    color .19s ease,
    box-shadow .19s ease;
}

/* ── Переключатель темы ─────────────────────────────────────── */
.pr-theme-switch {
  position: relative;
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  width: 82px;
  min-width: 82px;
  height: 44px;
  padding: 4px;
  border: 1px solid var(--pr-border);
  border-radius: 999px;
  background: var(--pr-surface-raised);
  color: var(--pr-text-soft);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.pr-theme-switch::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 35px;
  height: 34px;
  border-radius: 999px;
  background: var(--pr-surface);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .16);
  transition: transform .19s ease, background-color .19s ease;
}

html[data-theme="dark"] .pr-theme-switch::before {
  transform: translateX(37px);
  background: var(--pr-accent);
}

.pr-theme-switch__option {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
}

.pr-theme-switch__option svg {
  width: 19px;
  height: 19px;
}

html[data-theme="light"] .pr-theme-switch__option--light,
html[data-theme="dark"] .pr-theme-switch__option--dark {
  color: var(--pr-text);
}

html[data-theme="dark"] .pr-theme-switch__option--dark {
  color: #191714;
}

.pr-theme-switch:hover {
  border-color: var(--pr-border-strong);
}

.pr-theme-mobile {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  margin-top: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--pr-border);
}

.pr-theme-mobile__label {
  font-size: 15px;
  font-weight: 700;
  color: var(--pr-text);
}

.pr-theme-mobile__state {
  font-size: 13px;
  color: var(--pr-text-soft);
}

/* ── Фокус и базовые интерактивные состояния ───────────────── */
html[data-theme] :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--pr-focus);
  outline-offset: 3px;
}

html[data-theme] :is(button, input, select, textarea):disabled,
html[data-theme] [aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .5;
}

html[data-theme] .pr-article a:not(.btn):not(.pr-btn):not(.pr-cta),
html[data-theme] .pr-text a:not(.btn):not(.pr-btn):not(.pr-cta),
html[data-theme] main a.pr-link {
  color: var(--pr-link);
  text-decoration-color: color-mix(in srgb, var(--pr-link) 45%, transparent);
  text-underline-offset: 3px;
}

/* ── Шапка и меню ───────────────────────────────────────────── */
html[data-theme] header {
  background: var(--pr-header);
  border-bottom-color: var(--pr-border);
}

html[data-theme] .logo img,
html[data-theme] .footer-logo {
  filter: none;
}

html[data-theme] nav a {
  color: var(--pr-text-soft);
}

html[data-theme] nav a:hover,
html[data-theme] nav a.active {
  color: var(--pr-text);
}

html[data-theme] .nav-dropdown-menu {
  background: var(--pr-surface);
  border-color: var(--pr-border);
  box-shadow: var(--pr-shadow);
}

html[data-theme] .nav-dropdown-menu a {
  color: var(--pr-text-soft);
}

html[data-theme] .nav-dropdown-menu a:hover {
  color: var(--pr-text);
}

html[data-theme] .mobile-menu {
  background: color-mix(in srgb, var(--pr-bg) 97%, transparent);
}

html[data-theme] .burger {
  border-color: var(--pr-border);
}

html[data-theme] .burger span {
  background: var(--pr-text);
}

html[data-theme] .mm-link,
html[data-theme] .mm-sub {
  color: var(--pr-text-soft);
  border-bottom-color: var(--pr-border);
}

html[data-theme] .mm-link:hover,
html[data-theme] .mm-sub:hover {
  color: var(--pr-text);
}

/* ── Кнопки, фильтры и поля ─────────────────────────────────── */
html[data-theme] .btn-accent,
html[data-theme] .pr-btn--accent,
html[data-theme] .pr-cta,
html[data-theme] .pr-newsletter-form__btn {
  background: var(--pr-accent);
  color: #191714;
}

html[data-theme] .btn-accent:hover,
html[data-theme] .pr-btn--accent:hover,
html[data-theme] .pr-cta:hover,
html[data-theme] .pr-newsletter-form__btn:hover {
  background: var(--pr-accent-hover);
}

html[data-theme] .btn-outline,
html[data-theme] .btn-transparent,
html[data-theme] .pr-btn--outline {
  background: transparent;
  color: var(--pr-text);
  border-color: var(--pr-border-strong);
}

html[data-theme] .btn-outline:hover,
html[data-theme] .btn-transparent:hover,
html[data-theme] .pr-btn--outline:hover {
  border-color: var(--pr-text-soft);
}

html[data-theme] .btn-black {
  background: #191714;
  color: #f7f4ee;
}

html[data-theme] :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  textarea,
  select
) {
  background: var(--pr-surface);
  color: var(--pr-text);
  border-color: var(--pr-border-strong);
}

html[data-theme] :where(input, textarea)::placeholder {
  color: var(--pr-text-soft);
  opacity: .82;
}

html[data-theme] :where(input, textarea, select):focus {
  border-color: var(--pr-focus);
}

html[data-theme] .filter-btn,
html[data-theme] .genre-btn,
html[data-theme] .sale-filter__btn,
html[data-theme] .sale-filter-btn {
  background: var(--pr-surface-raised);
  color: var(--pr-text-soft);
  border-color: var(--pr-border);
}

html[data-theme] :is(.filter-btn, .genre-btn, .sale-filter__btn, .sale-filter-btn):hover {
  color: var(--pr-text);
  border-color: var(--pr-border-strong);
}

html[data-theme] :is(.filter-btn, .genre-btn, .sale-filter__btn, .sale-filter-btn).active {
  background: var(--pr-accent);
  color: #191714;
  border-color: var(--pr-accent);
}

html[data-theme] progress {
  accent-color: var(--pr-accent);
}

/* ── Основные поверхности и типовые карточки ───────────────── */
html[data-theme] .section-light,
html[data-theme] .sec-light,
html[data-theme] .sale-light {
  background: var(--pr-bg);
  color: var(--pr-text);
}

html[data-theme] .section-dark,
html[data-theme] .sale-dark {
  background: var(--pr-surface);
  color: var(--pr-text);
}

html[data-theme] :is(
  .course-card,
  .review-card,
  .faq-item,
  .card-light,
  .c-card,
  .stat-card,
  .why-item,
  .program-card,
  .pr-related,
  .bidx-card,
  .ind-card,
  .quiz-option
) {
  background: var(--pr-surface);
  color: var(--pr-text);
  border-color: var(--pr-border);
}

html[data-theme] :is(
  .course-card,
  .review-card,
  .faq-item,
  .card-light,
  .c-card,
  .bidx-card,
  .ind-card
):hover {
  background: var(--pr-surface-raised);
  border-color: color-mix(in srgb, var(--pr-accent) 55%, var(--pr-border));
  box-shadow: var(--pr-shadow);
}

html[data-theme] :is(
  .course-card,
  .review-card,
  .faq-item,
  .c-card,
  .why-item,
  .program-card,
  .bidx-card,
  .ind-card
) :is(h2, h3, h4, strong) {
  color: var(--pr-text);
}

html[data-theme] :is(
  .course-card,
  .review-card,
  .faq-item,
  .c-card,
  .why-item,
  .program-card,
  .bidx-card,
  .ind-card
) :is(p, li, small, .c-desc, .c-meta, .course-meta, .review-meta) {
  color: var(--pr-text-soft);
}

html[data-theme] .pr-article,
html[data-theme] .pr-text,
html[data-theme] .pr-heading,
html[data-theme] .pr-breadcrumbs,
html[data-theme] .breadcrumb {
  color: var(--pr-text);
}

html[data-theme] :is(.pr-article, .pr-text) :is(p, li, figcaption),
html[data-theme] .pr-breadcrumbs,
html[data-theme] .breadcrumb {
  color: var(--pr-text-soft);
}

html[data-theme] :is(.pr-breadcrumbs, .breadcrumb) a:hover {
  color: var(--pr-link);
}

html[data-theme="light"] body .pr-article {
  color: var(--pr-text);
}

html[data-theme="light"] body .pr-article :is(h1, h2, h3) {
  color: var(--pr-text) !important;
}

html[data-theme="light"] body .pr-article :is(p, ul, ol, li, td) {
  color: var(--pr-text);
}

html[data-theme="light"] body .pr-article :is(strong, b, th) {
  color: var(--pr-text);
}

html[data-theme="light"] body .pr-article a {
  color: var(--pr-link);
}

html[data-theme="light"] body .pr-article code {
  background: var(--pr-surface-raised);
  color: var(--pr-success);
}

html[data-theme="light"] body .pr-article :is(pre, th) {
  background: var(--pr-surface-raised);
}

html[data-theme="light"] body .pr-article :is(th, td) {
  border-color: var(--pr-border);
}

html[data-theme="light"] body .pr-article hr {
  border-top-color: var(--pr-border);
}

html[data-theme="light"] body .pr-article blockquote {
  color: var(--pr-text-soft);
  background: color-mix(in srgb, var(--pr-success) 8%, transparent);
}

html[data-theme] table {
  background: var(--pr-surface);
  color: var(--pr-text);
  border-color: var(--pr-border);
}

html[data-theme] :is(th, td) {
  border-color: var(--pr-border);
}

html[data-theme] th {
  background: var(--pr-surface-raised);
}

/* ── Hero и медиаповерхности ────────────────────────────────── */
html[data-theme] .page-hero:not(.has-photo) {
  background-color: var(--pr-surface);
  color: var(--pr-text);
}

html[data-theme="light"] .page-hero:not(.has-photo) {
  background-image:
    linear-gradient(rgba(25, 25, 25, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(25, 25, 25, .045) 1px, transparent 1px);
  background-size: 40px 40px;
}

html[data-theme] :is(.hero, .page-hero.has-photo, .course-hero, .weby-page-bg) {
  color: #f7f4ee;
}

html[data-theme] :is(.hero, .page-hero.has-photo, .course-hero, .weby-page-bg)
  :is(h1, h2, h3, p, .section-title, .breadcrumb, .breadcrumb a, .stat-label) {
  color: inherit;
}

html[data-theme] :is(.hero, .page-hero.has-photo, .course-hero) .btn-outline {
  color: #f7f4ee;
  border-color: rgba(255, 255, 255, .32);
}

html[data-theme="light"] body .hero.hero {
  color: var(--pr-text);
}

html[data-theme="light"] body .hero.hero :is(h1, h2, h3, .hero-title) {
  color: var(--pr-text);
}

html[data-theme="light"] body .hero.hero :is(p, .hero-subtitle, .stat-label) {
  color: var(--pr-text-soft);
}

html[data-theme="light"] body .hero.hero .btn-outline {
  color: var(--pr-text);
  border-color: var(--pr-border-strong);
}

html[data-theme="light"] body .hero.hero .hero-photo-area::after {
  background-image: linear-gradient(
    to right,
    rgba(245, 245, 242, 1) 0%,
    rgba(245, 245, 242, .95) 28%,
    rgba(245, 245, 242, .34) 62%,
    transparent 100%
  );
}

html[data-theme="dark"] .hero::after,
html[data-theme="dark"] .page-hero.has-photo::after {
  content: "";
  position: absolute;
  inset: auto -12% -45% 38%;
  height: 65%;
  background: radial-gradient(circle, rgba(255, 122, 22, .15), transparent 68%);
  pointer-events: none;
  z-index: 1;
}

html[data-theme] .system-visual,
html[data-theme] .program-card.featured {
  background: #191714;
  color: #f7f4ee;
}

html[data-theme] .system-visual :is(h2, h3, h4, strong),
html[data-theme] .program-card.featured :is(h2, h3, h4, strong) {
  color: #f7f4ee;
}

/* Видео остаётся нейтральной тёмной медиаповерхностью в обеих темах. */
html[data-theme] .pr-video-facade,
html[data-theme] .pr-video-stub {
  background-color: #101216;
  color: #f7f4ee;
  border-color: rgba(255, 255, 255, .15);
}

html[data-theme] .pr-access-closed {
  background: var(--pr-surface) !important;
  color: var(--pr-text) !important;
  border-color: var(--pr-border-strong) !important;
}

html[data-theme] .pr-access-closed > div:last-child {
  color: var(--pr-text-soft) !important;
}

/* ── Вебинары, формы, модалки и служебные сообщения ─────────── */
html[data-theme] .weby-card {
  background: var(--pr-surface);
  color: var(--pr-text);
  border-color: var(--pr-border);
  box-shadow: var(--pr-shadow);
}

html[data-theme] .weby-card__body h3 {
  color: var(--pr-text) !important;
}

html[data-theme] .weby-card__body p {
  color: var(--pr-text-soft) !important;
}

html[data-theme] .weby-form-wrap {
  background: var(--pr-surface);
  color: var(--pr-text);
  border: 1px solid var(--pr-border);
  box-shadow: var(--pr-shadow);
}

html[data-theme] .weby-form input,
html[data-theme] .weby-form select {
  background: var(--pr-surface-raised);
  color: var(--pr-text);
  border-color: var(--pr-border-strong);
}

html[data-theme] .weby-card__announce {
  background: var(--pr-surface-raised);
  color: var(--pr-text-soft);
}

html[data-theme] .weby-modal__inner {
  background: var(--pr-surface);
  color: var(--pr-text);
  border: 1px solid var(--pr-border);
}

html[data-theme] .weby-modal__close {
  background: var(--pr-surface-raised);
  color: var(--pr-text);
}

html[data-theme] .weby-modal__close:hover {
  background: var(--pr-surface-soft);
}

html[data-theme="light"] body .contact-wrap,
html[data-theme="light"] body .contact-social-block {
  color: var(--pr-text);
}

html[data-theme="light"] body .contact-lead,
html[data-theme="light"] body .contact-form label,
html[data-theme="light"] body .contact-social-sub,
html[data-theme="light"] body .contact-lessons-cta__text,
html[data-theme="light"] body .contact-soc__handle {
  color: var(--pr-text-soft);
}

html[data-theme="light"] body .contact-lessons-cta {
  color: var(--pr-text);
  background: linear-gradient(135deg, rgba(232, 134, 30, .13), rgba(232, 134, 30, .04));
  border-color: rgba(232, 134, 30, .38);
}

html[data-theme="light"] body .contact-form input,
html[data-theme="light"] body .contact-form textarea,
html[data-theme="light"] body .contact-soc {
  background: var(--pr-surface);
  color: var(--pr-text);
  border-color: var(--pr-border-strong);
}

html[data-theme="light"] body .contact-form input::placeholder,
html[data-theme="light"] body .contact-form textarea::placeholder {
  color: var(--pr-text-soft);
}

html[data-theme="light"] body .contact-form input:focus,
html[data-theme="light"] body .contact-form textarea:focus {
  background: var(--pr-surface);
  border-color: var(--pr-focus);
}

html[data-theme="light"] body .contact-soc__arrow {
  color: var(--pr-text-soft);
}

html[data-theme] :is(.weby-form-msg.ok, .success, .is-success) {
  color: var(--pr-success);
}

html[data-theme] :is(.weby-form-msg.err, .error, .is-error) {
  color: var(--pr-danger);
}

/* Промо сохраняют собственный цветовой смысл, но получают тему окружения. */
html[data-theme="dark"] .pr-promo:not(.pr-promo--sale):not(.pr-promo--yellow):not(.pr-promo--blue) {
  box-shadow: 0 14px 42px rgba(255, 122, 22, .18), 0 18px 48px rgba(0, 0, 0, .48);
}

/* ── Подвал ─────────────────────────────────────────────────── */
html[data-theme] footer {
  background: var(--pr-surface);
  color: var(--pr-text);
  border-color: var(--pr-border);
}

html[data-theme] .footer-top,
html[data-theme] .footer-legal {
  border-color: var(--pr-border);
}

html[data-theme] :is(
  .footer-brand p,
  .footer-contact,
  .footer-col h4,
  .footer-col li a,
  .footer-legal
) {
  color: var(--pr-text-soft);
}

html[data-theme] :is(.footer-contact, .footer-col li a):hover {
  color: var(--pr-text);
}

html[data-theme] .social {
  background: var(--pr-surface-raised);
  color: var(--pr-text-soft);
  border-color: var(--pr-border);
}

html[data-theme] .social:hover {
  color: var(--pr-accent);
  border-color: var(--pr-accent);
}

html[data-theme] .back-to-top {
  background: var(--pr-accent);
  color: #191714;
}

@media (max-width: 1100px) and (min-width: 769px) {
  .header-wrap {
    gap: 14px;
    padding-left: 20px;
    padding-right: 20px;
  }

  nav a {
    padding-left: 8px;
    padding-right: 8px;
    font-size: 14px;
  }

  .header-right {
    gap: 8px;
  }

  .header-right .btn {
    padding: 11px 14px;
    font-size: 12px;
  }

  .pr-theme-switch {
    width: 74px;
    min-width: 74px;
  }

  .pr-theme-switch::before {
    width: 31px;
  }

  html[data-theme="dark"] .pr-theme-switch::before {
    transform: translateX(35px);
  }

  .pr-theme-switch__option {
    width: 30px;
  }
}

@media (min-width: 1101px) {
  .pr-theme-mobile {
    display: none;
  }
}

@media (max-width: 1100px) {
  .header-wrap nav,
  .header-right {
    display: none;
  }

  .burger {
    display: flex;
  }

  .mobile-menu {
    display: block;
  }
}

@media (max-width: 768px) {
  .header-wrap {
    min-height: 72px;
  }

  .logo img {
    height: 42px;
  }

  .mobile-menu {
    padding-top: 82px;
  }
}

@media (max-width: 390px) {
  .header-wrap {
    padding-left: 16px;
    padding-right: 16px;
  }

  .logo img {
    height: 38px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme] body,
  html[data-theme] header,
  html[data-theme] footer,
  html[data-theme] .mobile-menu,
  html[data-theme] .nav-dropdown-menu,
  html[data-theme] .section-light,
  html[data-theme] .sec-light,
  html[data-theme] .section-dark,
  html[data-theme] .sale-light,
  html[data-theme] .sale-dark,
  html[data-theme] .course-card,
  html[data-theme] .review-card,
  html[data-theme] .faq-item,
  html[data-theme] .c-card,
  html[data-theme] .card-light,
  html[data-theme] .weby-card,
  html[data-theme] .weby-form-wrap,
  html[data-theme] .weby-modal__inner,
  .pr-theme-switch::before {
    transition: none;
  }
}