/* artvoic: один файл → кастомный CSS Elementor/темы. Токены :root — для всех блоков. */

:root {
  --artvoic-bg: #050505;
  --artvoic-accent: #00ffd1;
  /* Фиолетовый акцент (До/После, волна about-author) */
  --artvoic-accent-purple: #6c63ff;
  --artvoic-text: #ffffff;
  --artvoic-text-muted: rgba(255, 255, 255, 0.82);
  --artvoic-text-soft: rgba(255, 255, 255, 0.9);
  --artvoic-font-body: "Montserrat", system-ui, sans-serif;
  --artvoic-font-display: "Unbounded", "Montserrat", sans-serif;
  /* Второй экран: холоднее hero (изумруд → электрик / индиго), бесшовный стык за счёт общего базового тона */
  --directions-hub-base: #050508;
  /* Третий экран «Об авторе»: чуть глубже/нейтральнее, мягкий переход с directions-hub */
  --about-author-base: #06060e;
  /* «Социальное доказательство»: тот же тон, что «об авторе», но светлее — заметнее тело секции */
  --social-proof-base: #0c0c1e;
  /* Футер: стык с social-proof, глубже к «дну» страницы */
  --site-footer-base: #050510;
  --site-footer-deep: #020208;
  /* Лендинг курса: «Узнай себя» — верх стыкуется с низом hero-course (полоса волны → тот же тон, что --directions-hub-base) */
  --course-audience-base: #08091c;
  /* Следующий виджет после «Узнай себя» (тариф, программа): общий фон для бесшовного низа волны */
  --course-after-audience-base: #070817;
  /* Программа курса (таймлайн модулей) — стык после блока результатов */
  --course-program-base: #060a1b;
  /* Тарифы — тело секции; стык сверху с низом #course-pocket-studio (там же --course-pocket-surface) */
  --course-pricing-base: #06060f;
  /* FAQ курса — чуть глубже pricing, без резкого контраста */
  --course-faq-base: #070713;
  --course-pocket-surface: #0a0a0c;
  /* Волны между секциями курса (бирюза/электрик, стык с палитрой акцента) */
  --course-bridge-wave: #1e9fc4;
  --course-bridge-wave-soft: rgba(0, 214, 232, 0.48);
  /* Лендинг детского курса: бесшовные стыки секций */
  --kids-hero-base: #030206;
  --kids-results-base: #070819;
  --kids-program-base: #060b1e;
  --kids-mentor-base: #08071c;
  --kids-faq-base: #070716;
  --kids-pricing-base: #060511;
  /* Страница «Стоимость услуг» (виджет #price-services) */
  --price-services-base: #070716;
  /* Детский + очный взрослый интенсив (#intensivkids-*, #intensiv-msk-*) — мягкие индиго-стыки */
  --intensiv-kids-hero-base: #04040b;
  --intensiv-kids-mid: #070819;
  --intensiv-kids-deep: #050510;
  /* Страница «Учебный материал» (#wp-el-materials) */
  --materials-deep: #050510;
  --materials-base: #060a1b;
  /* Страница тарифа «Самостоятельный» (/independent) */
  --independent-base: #06060f;
  --independent-deep: #050508;
  --independent-accent: #00ffd1;
  --independent-purple: #6c63ff;
  --independent-gold: #e8c872;
  --independent-coral: #ff6b8a;
}

/* --- artvoic: холст страницы (Astra/Elementor #fff → тёмный; только лендинги и прайс) --- */

body:has(:is(
  #hero-dubbing,
  #directions-hub,
  #about-author,
  #social-proof,
  #hero-course,
  #kids-hero,
  #imx-hero,
  #pco-hero,
  #course-audience,
  #course-after-audience,
  #course-program,
  #course-how-learning,
  #course-pricing,
  #course-faq,
  #price-services,
  #wp-el-materials,
  #webinars-hero,
  #webinars-player,
  #webinars-schedule,
  #independent-hero,
  #independent-freedom,
  #independent-feedback,
  #independent-early,
  #independent-pricing,
  #independent-program,
  #independent-terms,
  #independent-final
)) {
  margin: 0;
  background-color: var(--artvoic-bg);
  color: var(--artvoic-text);
  overflow-x: clip;
}

html:has(:is(
  #hero-dubbing,
  #directions-hub,
  #about-author,
  #social-proof,
  #hero-course,
  #kids-hero,
  #imx-hero,
  #pco-hero,
  #course-audience,
  #course-after-audience,
  #course-program,
  #course-how-learning,
  #course-pricing,
  #course-faq,
  #price-services,
  #wp-el-materials,
  #webinars-hero,
  #webinars-player,
  #webinars-schedule,
  #independent-hero,
  #independent-freedom,
  #independent-feedback,
  #independent-early,
  #independent-pricing,
  #independent-program,
  #independent-terms,
  #independent-final
)) {
  background-color: var(--artvoic-bg);
}

/* «Стоимость»: aurora hero — под шапкой и в зазорах Elementor */
body:has(#price-services)::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 48% 44% at 16% 28%, rgba(0, 255, 209, 0.2), transparent 55%),
    radial-gradient(ellipse 38% 48% at 92% 12%, rgba(120, 255, 230, 0.11), transparent 48%),
    radial-gradient(ellipse 52% 40% at 78% 88%, rgba(0, 255, 209, 0.12), transparent 52%),
    radial-gradient(ellipse 58% 52% at 48% 52%, rgba(0, 140, 150, 0.16), transparent 58%),
    radial-gradient(circle at 10% 10%, rgba(0, 255, 209, 0.08) 0%, transparent 42%);
}

body:has(#price-services) .site-content,
body:has(#price-services) .ast-container,
body:has(#price-services).ast-separate-container,
body:has(#price-services) #content,
body:has(#price-services) .entry-content,
.elementor-page:has(#price-services),
.elementor-page:has(#price-services) .e-con,
.elementor-section:has(#price-services),
.e-con:has(#price-services) {
  background-color: transparent !important;
  background-image: none !important;
}

.elementor-section:has(#price-services),
.e-con:has(#price-services) {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}

.elementor-widget-html:has(#price-services),
.elementor-widget-html:has(#price-services) > .elementor-widget-container,
.elementor-widget-container:has(#price-services) {
  --display: block;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: visible;
}

/* Локальное превью / вложенный <body> в HTML-виджете Elementor */
.elementor-widget-html body:has(#price-services),
.elementor-widget-container body:has(#price-services) {
  position: relative;
  margin: 0;
  background-color: var(--artvoic-bg);
  color: var(--artvoic-text);
}

.elementor-widget-html body:has(#price-services)::before,
.elementor-widget-container body:has(#price-services)::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 48% 44% at 16% 28%, rgba(0, 255, 209, 0.2), transparent 55%),
    radial-gradient(ellipse 38% 48% at 92% 12%, rgba(120, 255, 230, 0.11), transparent 48%),
    radial-gradient(ellipse 52% 40% at 78% 88%, rgba(0, 255, 209, 0.12), transparent 52%),
    radial-gradient(ellipse 58% 52% at 48% 52%, rgba(0, 140, 150, 0.16), transparent 58%);
}

/* Полноэкранные секции под фиксированной шапкой — фон секции, а не пустой body */
@media (max-width: 768px) {
  body:has(#site-header) :is(#hero-dubbing, #hero-course, #kids-hero, #imx-hero, #pco-hero, #price-services, #webinars-hero, #independent-hero) {
    margin-top: calc(-1 * var(--site-header-bar-h, 5rem));
    padding-top: var(--site-header-bar-h, 5rem);
  }
}