/* =====================================================
   EVENT-SKILL.RU — 3D-СКИН «СЦЕНА» (theme-3d)
   Накладывается поверх style.css. Всё под .theme-3d,
   чтобы не влиять на основной index.php.
   Концепция: тёмный зал, лучи-прожекторы, парящие
   стеклянные панели с глубиной и наклоном за курсором.
   ===================================================== */

/* ---------- Переопределение токенов на тёмную тему ---------- */
.theme-3d {
    --brand: #FF6A2C;
    --brand-hover: #FF824D;
    --brand-soft: rgba(255,106,44,.14);
    --gold: #E3C485;
    --ink: #F3F5FA;
    --ink-2: #C9D0DD;
    --ink-3: #9AA4B4;
    --muted: #818B9C;
    --line: rgba(255,255,255,.10);
    --line-2: rgba(255,255,255,.06);
    --bg: #07080F;
    --bg-soft: #0B0D16;
    --bg-soft-2: #0E1019;
    --success: #34D399;
    --success-soft: rgba(52,211,153,.12);

    --shadow-sm: 0 2px 8px rgba(0,0,0,.5);
    --shadow: 0 12px 30px rgba(0,0,0,.5);
    --shadow-lg: 0 36px 70px -24px rgba(0,0,0,.75);
    --shadow-cta: 0 12px 34px rgba(255,106,44,.45);

    background: var(--bg);
    color: var(--ink-2);
}

/* ---------- Базовый фон страницы ---------- */
.theme-3d {
    background:
        radial-gradient(1200px 700px at 80% -5%, rgba(255,106,44,.10), transparent 60%),
        radial-gradient(900px 600px at 0% 10%, rgba(120,90,255,.08), transparent 55%),
        linear-gradient(180deg, #07080F 0%, #090B14 40%, #07080F 100%);
    background-attachment: fixed;
}

/* ---------- Анимированный 3D-фон: орбы-прожекторы + сетка ---------- */
.t3d-bg {
    position: fixed; inset: 0; z-index: -1;
    pointer-events: none; overflow: hidden;
    will-change: transform;
}

.t3d-orb {
    position: absolute; border-radius: 50%;
    filter: blur(70px); opacity: .55;
    mix-blend-mode: screen;
}
.t3d-orb-1 {
    width: 540px; height: 540px; top: -120px; left: -80px;
    background: radial-gradient(circle, rgba(255,106,44,.55), transparent 70%);
    animation: t3dDrift1 18s ease-in-out infinite;
}
.t3d-orb-2 {
    width: 620px; height: 620px; top: 30%; right: -160px;
    background: radial-gradient(circle, rgba(120,90,255,.40), transparent 70%);
    animation: t3dDrift2 22s ease-in-out infinite;
}
.t3d-orb-3 {
    width: 480px; height: 480px; bottom: -120px; left: 25%;
    background: radial-gradient(circle, rgba(227,196,133,.30), transparent 70%);
    animation: t3dDrift3 26s ease-in-out infinite;
}
@keyframes t3dDrift1 { 50% { transform: translate(60px, 50px) scale(1.1); } }
@keyframes t3dDrift2 { 50% { transform: translate(-70px, 40px) scale(1.08); } }
@keyframes t3dDrift3 { 50% { transform: translate(40px, -50px) scale(1.12); } }

/* Перспективная сетка-пол как на сцене */
.t3d-grid {
    position: absolute; left: -10%; right: -10%; bottom: -2%; height: 48%;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 64px 64px;
    transform: perspective(420px) rotateX(62deg);
    transform-origin: bottom center;
    mask-image: linear-gradient(to top, rgba(0,0,0,.6), transparent 75%);
    -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,.6), transparent 75%);
    opacity: .5;
}

/* ---------- Шапка ---------- */
.theme-3d .header {
    background: rgba(8,10,18,.72);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    border-bottom: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
.theme-3d .nav-link { color: var(--ink-2); }
.theme-3d .nav-link:hover { color: #fff; }
.theme-3d .logo-text, .theme-3d .header-phone { color: var(--ink); }

/* ---------- Секции: прозрачные, фон даёт тело страницы ---------- */
.theme-3d .section { background: transparent; }
.theme-3d section.section-lead,
.theme-3d .section-for-whom { background: transparent; }
/* тонкая световая линия-разделитель сверху каждой секции */
.theme-3d .section + .section::before { content: none; }

/* ---------- Hero ---------- */
.theme-3d .hero {
    background:
        radial-gradient(900px 500px at 78% 20%, rgba(255,106,44,.12), transparent 60%),
        transparent;
}
.theme-3d .hero-eyebrow {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    color: var(--ink);
    backdrop-filter: blur(10px);
}
.theme-3d .hero-title { color: var(--ink); text-shadow: 0 2px 30px rgba(0,0,0,.5); }
.theme-3d .hero-title span {
    background: linear-gradient(100deg, #FF6A2C, #FFB07A 60%, #E3C485);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
    text-shadow: 0 0 40px rgba(255,106,44,.4);
}
.theme-3d .hero-lead { color: var(--ink-2); }

/* Стеклянные панели (общий приём для всех «белых» карточек) */
.theme-3d .hero-cta-card,
.theme-3d .hero-trust-row,
.theme-3d .hero-features-grid,
.theme-3d .card,
.theme-3d .pricing-card,
.theme-3d .teacher-card,
.theme-3d .review-card,
.theme-3d .benefit-card,
.theme-3d .step-card,
.theme-3d .faq-item {
    background: linear-gradient(160deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
    backdrop-filter: blur(22px) saturate(140%);
    -webkit-backdrop-filter: blur(22px) saturate(140%);
    border: 1px solid rgba(255,255,255,.12);
    box-shadow:
        0 30px 60px -24px rgba(0,0,0,.7),
        inset 0 1px 0 rgba(255,255,255,.10);
}
.theme-3d .hero-cta-card {
    box-shadow:
        0 40px 80px -28px rgba(0,0,0,.8),
        0 0 0 1px rgba(255,106,44,.10),
        inset 0 1px 0 rgba(255,255,255,.12);
}

.theme-3d .hero-cta-price-now { color: #fff; text-shadow: 0 2px 24px rgba(255,106,44,.25); }
.theme-3d .hero-cta-price-old { color: var(--muted); }
.theme-3d .hero-cta-price-sub strong { color: #fff; }
.theme-3d .hero-cta-zero { color: var(--success); }
.theme-3d .trust-num { color: #fff; }
.theme-3d .trust-divider { background: rgba(255,255,255,.12); }
.theme-3d .hero-features-grid li { color: var(--ink-2); }

/* Видео-постер: рамка с подсветкой и глубиной */
.theme-3d .hero-media-frame {
    box-shadow:
        0 50px 90px -30px rgba(0,0,0,.85),
        0 0 0 1px rgba(255,255,255,.08),
        0 0 60px rgba(255,106,44,.15);
}

/* ---------- Кнопки ---------- */
.theme-3d .btn-cta,
.theme-3d .btn-primary,
.theme-3d .btn-lg.btn-cta {
    background: linear-gradient(135deg, #FF6A2C, #FF8A3D);
    box-shadow: 0 14px 36px rgba(255,106,44,.5), inset 0 1px 0 rgba(255,255,255,.3);
}
.theme-3d .btn-cta:hover,
.theme-3d .btn-primary:hover {
    box-shadow: 0 18px 46px rgba(255,106,44,.62), inset 0 1px 0 rgba(255,255,255,.35);
    transform: translateY(-2px);
}
.theme-3d .btn-ghost,
.theme-3d .btn-secondary,
.theme-3d .btn-outline {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.16);
    color: var(--ink);
    backdrop-filter: blur(10px);
}
.theme-3d .btn-ghost:hover,
.theme-3d .btn-secondary:hover { background: rgba(255,255,255,.12); }

/* ---------- Заголовки секций ---------- */
.theme-3d .section-title { color: var(--ink); }
.theme-3d .section-title span { color: var(--brand); }
.theme-3d .section-lead, .theme-3d .section-header .section-lead { color: var(--ink-3); }
.theme-3d .section-eyebrow {
    background: rgba(255,106,44,.12);
    border: 1px solid rgba(255,106,44,.25);
    color: #FFB07A;
}

/* ---------- Программа / модули ---------- */
.theme-3d .module-card,
.theme-3d .program-module,
.theme-3d .accordion-item {
    background: linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: var(--shadow);
}
.theme-3d .module-card *, .theme-3d .accordion-item * { color: inherit; }

/* ---------- Пуллиты / иконки-галочки ---------- */
.theme-3d .check-icon, .theme-3d .feature-check svg { color: var(--success); }

/* ---------- Тарифы ---------- */
.theme-3d .pricing-card-featured {
    border-color: rgba(255,106,44,.5);
    box-shadow:
        0 40px 80px -26px rgba(0,0,0,.8),
        0 0 0 1px rgba(255,106,44,.35),
        0 0 50px rgba(255,106,44,.18);
}
.theme-3d .pricing-card-ribbon { background: linear-gradient(135deg, #FF6A2C, #E3C485); color: #1a1206; }
.theme-3d .pricing-card-price { color: #fff; }
.theme-3d .pricing-card-old-price { color: var(--muted); }
.theme-3d .pricing-card-features li { color: var(--ink-2); }
.theme-3d .pricing-card-image::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(180deg, transparent 40%, rgba(7,8,15,.55));
}

/* ---------- Слайдеры: стрелки ---------- */
.theme-3d .reviews-arrow,
.theme-3d .works-arrow,
.theme-3d .pricing-arrow,
.theme-3d .teachers-arrow {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.16);
    color: #fff;
    backdrop-filter: blur(10px);
}
.theme-3d .reviews-arrow:hover,
.theme-3d .works-arrow:hover,
.theme-3d .pricing-arrow:hover,
.theme-3d .teachers-arrow:hover { background: var(--brand); border-color: var(--brand); }

/* ---------- Отзывы ---------- */
.theme-3d .review-text { color: var(--ink-2); }
.theme-3d .review-author-name { color: #fff; }
.theme-3d .review-avatar {
    background: linear-gradient(135deg, rgba(255,106,44,.3), rgba(120,90,255,.3));
    color: #fff;
}
.theme-3d .review-stars { color: var(--gold); }

/* ---------- Эксперты ---------- */
.theme-3d .teacher-name { color: #fff; }
.theme-3d .teacher-image { background: rgba(255,255,255,.04); }

/* ---------- Цифры/статы ---------- */
.theme-3d .section-works { }
.theme-3d .works-portfolio-link a {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.16);
    color: var(--ink);
}
.theme-3d .works-portfolio-link a:hover { border-color: var(--brand); color: #fff; }

/* ---------- FAQ ---------- */
.theme-3d .faq-question { color: var(--ink); }
.theme-3d .faq-answer { color: var(--ink-3); }

/* ---------- Тёмные секции (для кого / консультация) усиление ---------- */
.theme-3d .section-for-whom,
.theme-3d section.section-lead {
    border-top: 1px solid rgba(255,255,255,.06);
    border-bottom: 1px solid rgba(255,255,255,.06);
}

/* ---------- Лайтбокс плеера ---------- */
.theme-3d .works-lightbox-backdrop { background: rgba(3,4,8,.9); }

/* ---------- Подвал ---------- */
.theme-3d .footer {
    background: #05060B;
    border-top: 1px solid rgba(255,255,255,.08);
    color: var(--ink-3);
}
.theme-3d .footer a { color: var(--ink-2); }
.theme-3d .footer a:hover { color: var(--brand); }

/* ---------- Стеклянная Play-кнопка hero/галереи на тёмном фоне ---------- */
.theme-3d .hero-video-play,
.theme-3d .work-card-play {
    border-color: rgba(255,255,255,.5);
    box-shadow: 0 10px 34px rgba(0,0,0,.5), inset 0 1px 1px rgba(255,255,255,.55), 0 0 30px rgba(255,106,44,.25);
}

/* =====================================================
   3D-механика: наклон, появление, перспектива
   ===================================================== */
.theme-3d .t3d-tilt {
    transform-style: preserve-3d;
    transition: transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .25s var(--t);
    will-change: transform;
}
.theme-3d .t3d-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .7s var(--t), transform .7s var(--t);
}
.theme-3d .t3d-reveal.t3d-in {
    opacity: 1;
    transform: none;
}

/* ---------- Доступность: уважение к reduced-motion ---------- */
@media (prefers-reduced-motion: reduce) {
    .theme-3d .t3d-orb { animation: none; }
    .theme-3d .t3d-reveal { opacity: 1; transform: none; transition: none; }
    .theme-3d .t3d-tilt { transition: none; }
}

/* ---------- Мобайл: смягчаем тяжёлые тени/блюр для производительности ---------- */
@media (max-width: 768px) {
    .t3d-orb { filter: blur(50px); opacity: .45; }
    .t3d-grid { display: none; }
    .theme-3d .hero-cta-card,
    .theme-3d .pricing-card,
    .theme-3d .teacher-card,
    .theme-3d .review-card { backdrop-filter: blur(14px); }
}

/* ============================================================
   ИСПРАВЛЕНИЯ v2 — светлое-на-светлом
   --ink использовался в базе и как тёмный фон секций, поэтому
   после переопределения токена они инвертировались. Чиним.
   ============================================================ */

/* Секции, где --ink был тёмным ФОНОМ — возвращаем тёмный явным цветом */
.theme-3d .cta-section { background: #090B14; }
.theme-3d .timer-bar {
    background: rgba(10,12,20,.55);
    border-top: 1px solid rgba(255,255,255,.07);
    border-bottom: 1px solid rgba(255,255,255,.07);
}

/* Пропущенные светлые карточки → стеклянные */
.theme-3d .for-whom-card,
.theme-3d .program-module,
.theme-3d .lead-form,
.theme-3d .hero-floating-card,
.theme-3d .module-card {
    background: linear-gradient(160deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
    backdrop-filter: blur(22px) saturate(140%);
    -webkit-backdrop-filter: blur(22px) saturate(140%);
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 30px 60px -24px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.10);
}
.theme-3d .for-whom-title,
.theme-3d .lead-form-title { color: #fff; }
.theme-3d .for-whom-text { color: var(--ink-3); }

/* Карточка-CTA «Открываете своё агентство» (04) — тёмно-оранжевое стекло */
.theme-3d .for-whom-card-cta {
    background: linear-gradient(160deg, rgba(255,106,44,.22), rgba(255,106,44,.04)) !important;
    border-color: rgba(255,106,44,.5);
    box-shadow: 0 30px 60px -24px rgba(0,0,0,.7), 0 0 44px rgba(255,106,44,.16);
}

/* Strip-секция (иконки-преимущества) → прозрачная */
.theme-3d .strip-section { background: transparent; }
.theme-3d .strip-text strong { color: #fff; }
.theme-3d .strip-icon { background: rgba(255,106,44,.16); }

/* Форма консультации */
.theme-3d .lead-form-eyebrow {
    background: rgba(255,106,44,.14);
    border: 1px solid rgba(255,106,44,.25);
    color: #FFB07A;
}
.theme-3d .lead-form-subtitle { color: var(--ink-3); }
.theme-3d .form-input {
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.14);
    color: #fff;
}
.theme-3d .form-input::placeholder { color: var(--muted); }
.theme-3d .form-input:focus {
    background: rgba(255,255,255,.08);
    border-color: var(--brand);
    box-shadow: 0 0 0 3px rgba(255,106,44,.18);
}

/* Нижняя липкая панель → тёмное стекло */
.theme-3d .sticky-cta {
    background: rgba(10,12,20,.86);
    backdrop-filter: saturate(160%) blur(16px);
    -webkit-backdrop-filter: saturate(160%) blur(16px);
    border-top: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 -12px 34px rgba(0,0,0,.55);
}
.theme-3d .sticky-cta-price { color: #fff; }
.theme-3d .sticky-cta-label { color: var(--muted); }

/* Мобильное выпадающее меню → тёмное */
.theme-3d .nav.is-open {
    background: rgba(10,12,20,.97);
    backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.10);
}

/* Орбы-прожекторы — заметнее, чтобы «зал со светом» читался */
.t3d-orb-1 { opacity: .75; filter: blur(58px); }
.t3d-orb-2 { opacity: .68; }
.t3d-orb-3 { opacity: .6; }

/* Доп. световой луч-прожектор в hero (по центру сверху) */
.theme-3d .hero::after {
    content: ''; position: absolute; z-index: 0;
    top: -10%; left: 50%; width: 70%; height: 120%;
    transform: translateX(-50%);
    background: radial-gradient(ellipse 50% 40% at 50% 0%, rgba(255,106,44,.18), transparent 70%);
    pointer-events: none;
}
.theme-3d .hero > * { position: relative; z-index: 1; }

/* Блок гарантии — тёмно-зелёное стекло, читаемый светлый текст */
.theme-3d .guarantee-block {
    background: linear-gradient(160deg, rgba(16,185,129,.16) 0%, rgba(16,185,129,.04) 100%);
    border: 1px solid rgba(52,211,153,.35);
    box-shadow: 0 30px 60px -24px rgba(0,0,0,.7), 0 0 50px rgba(16,185,129,.12), inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
}
.theme-3d .guarantee-eyebrow { color: #34D399; }
.theme-3d .guarantee-title { color: #fff; }
.theme-3d .guarantee-text { color: var(--ink-2); }

/* ============================================================
   ИСПРАВЛЕНИЯ v3 — лого/бейдж + видимость прожекторов
   ============================================================ */

/* Лого и бейдж «15 лет» — использовали var(--ink) как тёмный фон */
.theme-3d .logo-icon {
    background: linear-gradient(135deg, #FF6A2C, #FF8E5A);
    color: #fff;
    box-shadow: 0 6px 18px rgba(255,106,44,.4);
}
.theme-3d .about-experience-badge {
    background: linear-gradient(160deg, rgba(22,24,36,.94), rgba(12,14,22,.94));
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: var(--shadow-lg), 0 0 44px rgba(255,106,44,.18);
}
.theme-3d .about-experience-label { color: rgba(255,255,255,.7); }

/* Фон: убираем статичные радиалы (они заглушали орбы) и сетку-«линию» */
.theme-3d { background: #06070D; }
.t3d-grid { display: none !important; }

/* Прожекторы — яркие и крупные, чтобы их реально было видно */
.t3d-orb { mix-blend-mode: screen; filter: blur(80px); opacity: .9; }
.t3d-orb-1 {
    width: 640px; height: 640px; top: -140px; left: -100px;
    background: radial-gradient(circle, rgba(255,120,50,.95), transparent 66%);
}
.t3d-orb-2 {
    width: 700px; height: 700px; top: 28%; right: -200px;
    background: radial-gradient(circle, rgba(150,110,255,.8), transparent 66%);
}
.t3d-orb-3 {
    width: 580px; height: 580px; bottom: -160px; left: 22%;
    background: radial-gradient(circle, rgba(240,200,130,.7), transparent 66%);
}