/* ==========================================================================
   LegoMax — ХЭЛЛОУИН-ОФОРМЛЕНИЕ (добавлено 30.09.2026)

   Как работает:
   • Inline-скрипт в <head> index.html ставит на <html> класс .hw-on
     (и data-halloween="on"), если сейчас сезон (1 окт – 2 ноя) и посетитель
     не выключил оформление кнопкой-тыквой в шапке. Выбор хранится
     в localStorage (ключ lm_halloween = on/off).
   • Хэллоуин строится ПОВЕРХ тёмной темы: пока он включён, скрипт ставит
     data-theme-applied="dark", поэтому все контрастные правки тёмной темы
     работают, а этот файл лишь перекрашивает «уголь» в «ночной фиолетовый»
     и добавляет декор (тыквы, летучие мыши, паутина, призрак).
   • Все правила — под префиксом :root.hw-on. Без класса файл ничего не
     меняет, кроме скрытия декоративных элементов.
   • Анимации отключаются при prefers-reduced-motion.
   • Предпросмотр вне сезона: https://legomax96.ru/?halloween=1
     (выключить предпросмотр: ?halloween=0).
   • Отключить совсем: в index.html поменять HW_FROM/HW_TO или удалить
     подключение halloween.css и кнопку #hwToggle.
   ========================================================================== */

/* Декор по умолчанию скрыт — появляется только в режиме Хэллоуина */
.hw-deco, .hw-layer { display: none; }
.hw-toggle[hidden] { display: none !important; }

/* ---------- Кнопка-тыква в шапке ---------- */
.hw-toggle { position: relative; }
.hw-toggle .theme-toggle-icon { width: 28px; height: 28px; }
.hw-toggle .theme-toggle-icon svg { width: 28px; height: 28px; }
/* Выключено — тыква «потухшая» (ч/б); включено — яркая, с оранжевым свечением */
.hw-toggle:not([aria-pressed="true"]) .theme-toggle-icon svg { filter: grayscale(.7); opacity: .85; }
.hw-toggle:not([aria-pressed="true"]):hover .theme-toggle-icon svg { filter: none; opacity: 1; }
:root.hw-on .hw-toggle {
  background: #2A1845;
  box-shadow: 0 0 0 2px #FF8C1A, 0 0 16px rgba(255, 140, 26, 0.6);
}
:root.hw-on .hw-toggle:hover { background: #3A2260; }
/* Пока Хэллоуин включён, переключатель светлой/тёмной темы не нужен */
:root.hw-on #themeToggle { display: none; }

/* ---------- Палитра: ночь, тыква, фиолет, «слизь» ---------- */
:root.hw-on {
  --c-ink: #F3EEF8;
  --c-ink-soft: #CDC2DD;
  --c-ink-mute: #A396B8;
  --c-headline: #FFF4E6;
  --c-orange: #FF8C1A;
  --c-orange-deep: #E8700A;
  --c-lime: #A4E03A;
  --c-lime-bg: #6A34B0;
  --c-green: #5DBB45;
  --c-green-deep: #479A33;
  --c-teal: #9B7BF0;        /* бирюзу заменяем на «ведьмин» фиолетовый */
  --c-teal-deep: #7E5CE0;
  --sh-sm: 0 2px 8px rgba(0, 0, 0, 0.5);
  --sh-md: 0 8px 24px rgba(10, 0, 25, 0.6);
  --sh-lg: 0 20px 48px rgba(10, 0, 25, 0.7);
}

/* ---------- Перекраска «угольных» оттенков тёмной темы в фиолетовые
   (сгенерировано из правил тёмной темы styles.css / index.html) ---------- */
:root.hw-on { --c-white: #1E1629; --c-cream: #1E1629; --c-line: #3A2C4E; --c-line-soft: #251B31; --c-dark: #0D0914; --c-dark-soft: #1A1324; }
:root.hw-on body { background: #150F1E; }
:root.hw-on .site-header { background: rgba(21, 15, 30, 0.92); }
:root.hw-on .site-footer { background: #0D0914; }
:root.hw-on .course-card-arrow { color: #150F1E; }
:root.hw-on .pathway-step-card { background: #1E1629; }
:root.hw-on .pathway-group-label span { background: #1E1629; border-color: #3A2C4E; }
:root.hw-on .pathway-group-kids   span { background: color-mix(in oklab, var(--c-lime)   30%, #150F1E); }
:root.hw-on .pathway-group-school span { background: color-mix(in oklab, var(--c-orange) 25%, #150F1E); }
:root.hw-on .pathway-group-teens  span { background: color-mix(in oklab, var(--c-teal)   25%, #150F1E); }
:root.hw-on .course-card-placeholder { background: #1E1629; border: 1px solid #3A2C4E; }
:root.hw-on .course-theme-lime { background: linear-gradient(180deg, rgba(155, 203, 58, 0.18) 0%, #1E1629 70%); }
:root.hw-on .course-theme-green { background: linear-gradient(180deg, rgba(63, 155, 77, 0.20)  0%, #1E1629 70%); }
:root.hw-on .course-theme-orange { background: linear-gradient(180deg, rgba(242, 165, 58, 0.20) 0%, #1E1629 70%); }
:root.hw-on .course-theme-teal { background: linear-gradient(180deg, rgba(46, 189, 183, 0.20) 0%, #1E1629 70%); }
:root.hw-on .course-card-ph-age { color: #150F1E; }
:root.hw-on .review-avatar { color: #150F1E; }
:root.hw-on .btn-outline:hover { color: #150F1E; }
:root.hw-on .cookie-banner button { color: #150F1E; }
:root.hw-on input,
:root.hw-on select,
:root.hw-on textarea { border-color: #3A2C4E; }
:root.hw-on .teacher-mini-founder { background: #1E1629; }
:root.hw-on .teacher-mini-more-btn:hover { color: #150F1E; }
:root.hw-on .founder { background: #1E1629; }
:root.hw-on .founder-hero { background:
    radial-gradient(ellipse at top right,
      rgba(155, 203, 58, 0.22) 0%,
      transparent 60%),
    #1E1629; }
:root.hw-on .founder-more { border-top-color: #3A2C4E; }
:root.hw-on .founder-more summary { background: #1A1324; }
:root.hw-on .founder-more summary:hover { background: color-mix(in oklab, var(--c-lime) 15%, #1A1324); }
:root.hw-on .founder-more[open] .founder-more-icon { color: #150F1E; }
:root.hw-on .founder-extra { background: #1A1324 !important; }
:root.hw-on .founder-principle { background: #1A1324; border: 1px solid #3A2C4E; }
:root.hw-on .founder-principle-num { color: #150F1E; }
:root.hw-on .founder-modal-content { background: #1E1629; }
:root.hw-on .founder-modal-header { background:
    radial-gradient(ellipse at top right,
      rgba(155, 203, 58, 0.22) 0%,
      transparent 60%),
    #1E1629; border-bottom: 1px solid #3A2C4E; }
:root.hw-on .founder-modal-badge { color: #150F1E; }
:root.hw-on .founder-modal-portrait { utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'><g fill='none' stroke='%23F39A1F' stroke-width='1.2' opacity='0.30'><path d='M20 14v12M14 20h12'/></g></svg>"),
    linear-gradient(135deg,
      color-mix(in oklab, var(--c-lime) 35%, #150F1E) 0%,
      color-mix(in oklab, var(--c-lime) 18%, #150F1E) 100%); }
:root.hw-on .founder-modal-principles li { background: #1A1324; border: 1px solid #3A2C4E; }
:root.hw-on .founder-modal-principles li::before,
:root.hw-on .founder-modal-pnum { color: #150F1E; }
:root.hw-on .founder-modal-extra { background: #1A1324 !important; }
:root.hw-on .founder-modal-cta { background: #1A1324; border-top-color: #3A2C4E; }
:root.hw-on .ring-card { background: #1E1629; }
:root.hw-on .ring-track { stroke: #3A2C4E; }
:root.hw-on .stats-hero-divider { background: #3A2C4E; }
:root.hw-on .why-parents-section { background: #1A1324; }
:root.hw-on .why-parents-card,
:root.hw-on .why-parent-card { background: #1E1629; border-color: #3A2C4E; }
:root.hw-on .privacy-toc { background: #1E1629; border-color: #3A2C4E; }
:root.hw-on .privacy-contacts { background: #1A1324; border: 1px solid #3A2C4E; }
:root.hw-on .privacy-footer-meta { border-top-color: #3A2C4E; }
:root.hw-on { --c-white: #1E1629; --c-cream: #1E1629; --c-line: #3A2C4E; --c-line-soft: #251B31; --c-dark: #0D0914; --c-dark-soft: #1A1324; }
:root.hw-on body { background: #150F1E; }
:root.hw-on .hero,
:root.hw-on .page-hero { background: #1A1324; }
:root.hw-on .site-header { background: rgba(21, 15, 30,0.92); border-bottom-color: #3A2C4E; }
:root.hw-on .site-footer { background: #0D0914; }
:root.hw-on .course-card-arrow { color: #150F1E; }
:root.hw-on .pathway-step-card { background: #1E1629; }
:root.hw-on .course-card-placeholder { background: #1E1629; border: 1px solid #3A2C4E; }
:root.hw-on .course-theme-lime { background: linear-gradient(180deg, rgba(155,203,58,0.18) 0%, #1E1629 70%); }
:root.hw-on .course-theme-green { background: linear-gradient(180deg, rgba(63,155,77,0.20)  0%, #1E1629 70%); }
:root.hw-on .course-theme-orange { background: linear-gradient(180deg, rgba(242,165,58,0.20) 0%, #1E1629 70%); }
:root.hw-on .course-theme-teal { background: linear-gradient(180deg, rgba(46,189,183,0.20) 0%, #1E1629 70%); }
:root.hw-on .course-card-ph-age { color: #150F1E; }
:root.hw-on .cookie-banner button { color: #150F1E; }
:root.hw-on input,
:root.hw-on textarea,
:root.hw-on select { border-color: #3A2C4E; }
:root.hw-on .review-avatar { color: #150F1E; }
:root.hw-on .founder-modal { background: #1E1629; }
:root.hw-on .privacy-toc { background: #1E1629; border-color: #3A2C4E; }
:root.hw-on .privacy-contacts { background: #1A1324; border: 1px solid #3A2C4E; }
:root.hw-on .why-parents-section { background: #1A1324; }
:root.hw-on .why-parents-card { background: #1E1629; border-color: #3A2C4E; }
/* ---------- Точечная доводка ---------- */
:root.hw-on body {
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(155, 123, 240, 0.12), transparent 60%),
    radial-gradient(900px 500px at -10% 40%, rgba(255, 140, 26, 0.06), transparent 60%),
    #150F1E;
}
:root.hw-on ::selection { background: #FF8C1A; color: #1A0E26; }
:root.hw-on .btn-primary { box-shadow: 0 8px 24px rgba(255, 140, 26, 0.35); }
:root.hw-on .main-nav a.active { background: #FF8C1A; color: #1A0E26; }
:root.hw-on .hero-kicker-dot { background: #FF8C1A; box-shadow: 0 0 10px #FF8C1A; }

/* HERO: фон — ночное небо со звёздами */
:root.hw-on .hero {
  background:
    radial-gradient(2px 2px at 12% 18%, rgba(255,255,255,.7), transparent 60%),
    radial-gradient(1.5px 1.5px at 28% 72%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(2px 2px at 46% 10%, rgba(255,255,255,.6), transparent 60%),
    radial-gradient(1.5px 1.5px at 58% 86%, rgba(255,255,255,.45), transparent 60%),
    radial-gradient(2px 2px at 92% 58%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 70% 30%, rgba(255,255,255,.4), transparent 60%),
    linear-gradient(180deg, #1B1230 0%, #150F1E 100%);
}
/* Овал за маскотом: фиолетовый с оранжевыми «плюсиками» */
:root.hw-on .hero-visual-bg.bg-crosses {
  background-color: #5B2C9E;
  background-image:
    radial-gradient(circle at 70% 25%, rgba(255, 170, 60, 0.35), transparent 45%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'><g fill='none' stroke='%23FF8C1A' stroke-width='1.2' opacity='0.45'><path d='M20 14v12M14 20h12'/></g></svg>");
  box-shadow: 0 0 80px rgba(155, 123, 240, 0.35);
}
:root.hw-on .hero-mascot img { filter: drop-shadow(0 20px 40px rgba(255, 140, 26, 0.25)); }
:root.hw-on .hero-bubble { border-color: #FF8C1A; box-shadow: 0 0 24px rgba(255, 140, 26, 0.35); }
:root.hw-on .hero-badge { background: #9B7BF0; }

/* Фирменные значки hero — в хэллоуин-цветах */
:root.hw-on .deco-gear  { color: #9B7BF0; }
:root.hw-on .deco-brick { color: #FF8C1A; }
:root.hw-on .deco-chip  { color: #A4E03A; }
:root.hw-on .deco-plus  { color: #FF8C1A; }
:root.hw-on .deco-star  { color: #FFD34D; opacity: 0.5; }

/* Декор внутри hero (разметка — в pages.js, блок .hw-deco) */
:root.hw-on .hw-deco { display: block; position: absolute; pointer-events: none; }
:root.hw-on .hw-deco svg { width: 100%; height: 100%; display: block; }
:root.hw-on .hw-moon {
  top: -2%; left: -4%; width: 110px; height: 110px; z-index: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 36%, #FFF6D8 0%, #FFE39A 55%, #F4C45C 100%);
  box-shadow: 0 0 40px rgba(255, 227, 154, 0.55), 0 0 120px rgba(255, 227, 154, 0.25);
}
:root.hw-on .hw-moon::before, :root.hw-on .hw-moon::after {
  content: ''; position: absolute; border-radius: 50%; background: rgba(214, 160, 60, 0.28);
}
:root.hw-on .hw-moon::before { width: 22px; height: 22px; top: 30%; left: 55%; }
:root.hw-on .hw-moon::after  { width: 14px; height: 14px; top: 60%; left: 30%; }
:root.hw-on .hw-pumpkin-hero { bottom: 0; right: 12%; width: 26%; aspect-ratio: 1; z-index: 3; filter: drop-shadow(0 10px 20px rgba(0,0,0,.45)); }
:root.hw-on .hw-bat-a { top: 16%; left: 48%; width: 70px; height: 34px; color: #2A1845; z-index: 3; }
:root.hw-on .hw-bat-b { top: 4%;  left: 20%; width: 46px; height: 22px; color: #2A1845; z-index: 3; }
:root.hw-on .hero-bg-deco .hw-deco { opacity: .9; }
:root.hw-on .hw-bat-c { top: 20%; left: 24%; width: 54px; height: 26px; color: #9B7BF0; opacity: .55 !important; }
:root.hw-on .hw-pumpkin-small { top: 74%; left: 47%; width: 44px; height: 44px; }
:root.hw-on .hw-candy { top: 42%; right: 4%; width: 46px; height: 46px; }

/* ---------- Фиксированный слой: паутина, паук, летучие мыши, призрак ---------- */
:root.hw-on .hw-layer { display: block; position: fixed; inset: 0; pointer-events: none; z-index: 30; overflow: hidden; }
.hw-layer > * { position: absolute; }
.hw-layer svg { width: 100%; height: 100%; display: block; }
.hw-web { top: 0; left: 0; width: 170px; height: 170px; color: rgba(230, 220, 255, 0.28); }
.hw-spider { top: 0; left: 118px; width: 24px; height: 150px; transform-origin: top center; }
.hw-ghost { left: 18px; bottom: 22px; width: 64px; height: 72px; filter: drop-shadow(0 8px 18px rgba(155, 123, 240, 0.45)); opacity: .92; }
.hw-fly { top: 22%; left: -120px; width: 64px; height: 30px; color: #120A1E; }
.hw-fly-2 { top: 58%; width: 44px; height: 21px; color: #2A1845; }

/* ---------- Цветные баннеры (CTA) на фиолетовом — светлый текст ---------- */
:root.hw-on .bg-crosses,
:root.hw-on .bg-crosses-teal {
  background-color: #4E2690;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'><g fill='none' stroke='%23FF8C1A' stroke-width='1.2' opacity='0.4'><path d='M20 14v12M14 20h12'/></g></svg>");
}
:root.hw-on .bg-crosses h1, :root.hw-on .bg-crosses h2, :root.hw-on .bg-crosses h3,
:root.hw-on .bg-crosses-teal h1, :root.hw-on .bg-crosses-teal h2, :root.hw-on .bg-crosses-teal h3 { color: #FFF4E6; }
:root.hw-on .bg-crosses p, :root.hw-on .bg-crosses-teal p { color: rgba(255, 244, 230, 0.88); }
:root.hw-on .why-parents-teaser {
  background: linear-gradient(135deg, #2A1B40 0%, #1E1629 100%);
  border-color: #3A2C4E;
}

/* ---------- Лестница курсов, карточки, секции ---------- */
:root.hw-on .pathway-list::before {
  background: repeating-linear-gradient(180deg, #FF8C1A 0 14px, transparent 14px 26px);
}
:root.hw-on .pathway-step-card:hover,
:root.hw-on .course-card:hover {
  box-shadow: 0 0 0 1px rgba(255, 140, 26, 0.55), 0 12px 32px rgba(255, 140, 26, 0.18);
}
/* Паутинка в углу карточек курса */
:root.hw-on .course-card-placeholder { position: relative; }
:root.hw-on .course-card-placeholder::after {
  content: ''; position: absolute; top: 0; right: 0; width: 64px; height: 64px; pointer-events: none;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160' fill='none' stroke='%23E6DCFF' stroke-width='2.2' opacity='0.35'><g transform='translate(160 0) scale(-1 1)'><path d='M0 0L200 14M0 0L188 68M0 0L158 123M0 0L112 166M0 0L62 190M0 0L14 200M56 4Q51 11 57 21Q45 25 44 34Q35 38 34 50Q23 46 17 53Q10 51 4 60M84 6Q77 17 86 31Q69 37 67 52Q53 58 51 76Q35 70 26 80Q15 77 6 91M115 8Q104 23 117 43Q94 51 91 71Q72 78 70 103Q47 96 36 110Q20 105 9 124M144 10Q131 29 147 53Q117 64 113 89Q90 98 87 129Q59 120 44 137Q25 132 11 156'/></g></svg>") no-repeat top right / contain;
  border-top-right-radius: inherit;
}
:root.hw-on .eyebrow { color: #FF8C1A; }
:root.hw-on .accent-hand { color: #FF8C1A; text-shadow: 0 0 18px rgba(255, 140, 26, 0.35); }

/* Гирлянда из тыкв и мышек над футером */
:root.hw-on .site-footer { position: relative; }
:root.hw-on .site-footer::before {
  content: ''; position: absolute; left: 0; right: 0; top: -22px; height: 44px; pointer-events: none;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='44' viewBox='0 0 160 44'><path d='M0 6 Q40 22 80 6 T160 6' fill='none' stroke='%23B9A6E6' stroke-width='1.5' opacity='.6'/><g transform='translate(28 12)'><path d='M12 5c-1.2-1-3.3-1.2-5-.2C4 6.3 3.4 9 4 11.6c.5 2.4 2.3 4.4 4.6 4.7.9.1 1.8-.1 2.6-.5.8.4 1.7.6 2.6.5 2.3-.3 4.1-2.3 4.6-4.7.6-2.6 0-5.3-3-6.8-1.7-1-3.8-.8-5 .2z' fill='%23FF8C1A'/><path d='M12 5V2' stroke='%235DBB45' stroke-width='2' stroke-linecap='round'/><path d='M8 9.5l1.6-1.6 1.6 1.6zM12.8 9.5l1.6-1.6 1.6 1.6zM8.2 12.2q3.8 2.8 7.6 0' fill='%233A1A00' stroke='%233A1A00' stroke-width='.8'/></g><g transform='translate(100 10)' fill='%239B7BF0'><path d='M16 6 L14.5 3 L14 6 Q8 3 1 4 Q4 6 5 10 Q7 8 9.5 9.5 Q11 7.5 13 9.5 Q14.5 8.5 16 12.5 Q17.5 8.5 19 9.5 Q21 7.5 22.5 9.5 Q25 8 27 10 Q28 6 31 4 Q24 3 18 6 L17.5 3 Z'/></g></svg>") repeat-x left top / 160px 44px;
}

/* ---------- Мобильные ---------- */
/* Узкие экраны: когда в шапке появляется вторая круглая кнопка (тыква),
   чуть ужимаем отступы, чтобы шапка не вылезала за ширину экрана. */
@media (max-width: 420px) {
  .header-cta:has(#hwToggle:not([hidden])) { gap: 6px; }
  .header-cta:has(#hwToggle:not([hidden])) .theme-toggle { width: 34px; height: 34px; }
  .header-cta:has(#hwToggle:not([hidden])) .btn { padding: 10px 12px; font-size: 12px; }
  .site-header-inner:has(#hwToggle:not([hidden])) { gap: 12px; }
}
@media (max-width: 860px) {
  :root.hw-on .hw-moon { width: 72px; height: 72px; top: 0; left: 0; }
  :root.hw-on .hw-bat-c, :root.hw-on .hw-pumpkin-small, :root.hw-on .hw-candy { display: none; }
  .hw-web { width: 110px; height: 110px; }
  .hw-spider { left: 76px; height: 110px; }
  .hw-ghost { display: none; }  /* на телефоне перекрывал бы текст */
}

/* ---------- Анимации (только если пользователь не просил их убрать) ---------- */
@media (prefers-reduced-motion: no-preference) {
  :root.hw-on .hw-fly   { animation: hwFly 26s linear infinite; }
  :root.hw-on .hw-fly-2 { animation: hwFly2 34s linear infinite; animation-delay: -12s; }
  :root.hw-on .hw-ghost { animation: hwGhost 5s ease-in-out infinite; }
  :root.hw-on .hw-spider { animation: hwSpider 6s ease-in-out infinite; }
  :root.hw-on .hw-bat-a, :root.hw-on .hw-bat-b, :root.hw-on .hw-bat-c { animation: hwFlap .5s ease-in-out infinite alternate; }
  :root.hw-on .hw-pumpkin-hero { animation: hwWobble 4s ease-in-out infinite; transform-origin: bottom center; }
  :root.hw-on .hw-moon { animation: hwGlow 6s ease-in-out infinite; }
}
@keyframes hwFly {
  0%   { transform: translate(0, 0); }
  25%  { transform: translate(calc(25vw + 30px), -40px); }
  50%  { transform: translate(calc(50vw + 60px), 10px); }
  75%  { transform: translate(calc(75vw + 90px), -30px); }
  100% { transform: translate(calc(100vw + 240px), 0); }
}
@keyframes hwFly2 {
  0%   { transform: translate(calc(100vw + 240px), 0) scaleX(-1); }
  50%  { transform: translate(50vw, -50px) scaleX(-1); }
  100% { transform: translate(0, 0) scaleX(-1); }
}
@keyframes hwGhost { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-12px) rotate(3deg); } }
@keyframes hwSpider { 0%, 100% { transform: translateY(-18px); } 50% { transform: translateY(0); } }
@keyframes hwFlap { from { transform: scaleY(1); } to { transform: scaleY(.72); } }
@keyframes hwWobble { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg); } }
@keyframes hwGlow { 0%, 100% { box-shadow: 0 0 40px rgba(255,227,154,.55), 0 0 120px rgba(255,227,154,.25); } 50% { box-shadow: 0 0 60px rgba(255,227,154,.7), 0 0 160px rgba(255,227,154,.35); } }

/* Печать — без декора */
@media print { .hw-layer, .hw-deco { display: none !important; } }