/* =====================================================
   KYLE TRAVELS — MODO CINEMATOGRÁFICO
   Camada de cenas fixa (vídeo/imagem) + rolagem 3D
   Carregado depois do CSS original: só sobrescreve o visual,
   nenhuma funcionalidade é alterada.
   ===================================================== */

/* ---------- Camada fixa de cenas (fundo) ---------- */
#cinema-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background: #06121f;
    pointer-events: none;
}

#cinema-bg .scene {
    position: absolute;
    inset: -6%;                 /* margem para parallax sem bordas */
    opacity: 0;
    will-change: opacity, transform;
}

#cinema-bg .scene.is-first { opacity: 1; }

#cinema-bg .scene video,
#cinema-bg .scene img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform-origin: center center;
    will-change: transform;
}

/* Vinheta cinematográfica + legibilidade do texto */
#cinema-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at center, rgba(4, 10, 18, 0) 45%, rgba(4, 10, 18, 0.55) 100%),
        linear-gradient(180deg, rgba(4, 10, 18, 0.35) 0%, rgba(4, 10, 18, 0.15) 30%, rgba(4, 10, 18, 0.15) 70%, rgba(4, 10, 18, 0.5) 100%);
    pointer-events: none;
}

/* ---------- Conteúdo acima do fundo ---------- */
body.cinema-on { background: transparent; }
body.cinema-on .navbar { z-index: 1000; }
body.cinema-on main,
body.cinema-on section,
body.cinema-on footer {
    position: relative;
    z-index: 1;
}

/* Hero vira janela transparente para o vídeo */
body.cinema-on .hero {
    background: none !important;
    min-height: 100vh;
}
body.cinema-on .hero .hero-content {
    background: rgba(0, 0, 0, 0.55);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    border-radius: 20px;
    padding: clamp(2rem, 5vw, 4rem) clamp(1.5rem, 4vw, 3.5rem);
    max-width: 800px;
    margin: 0 auto;
}
body.cinema-on .hero h1 {
    font-size: clamp(2.4rem, 6vw, 4.6rem);
    letter-spacing: 0.01em;
    line-height: 1.08;
    color: #ffffff !important;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.8);
}
body.cinema-on .hero p {
    color: rgba(255, 255, 255, 0.95) !important;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.7);
}
body.cinema-on .hero .btn {
    text-shadow: none;
}

/* Seções translúcidas: o Brasil passa por trás */
body.cinema-on .widget-section,
body.cinema-on .about,
body.cinema-on .services,
body.cinema-on .tours,
body.cinema-on .documents,
body.cinema-on .location,
body.cinema-on .certification,
body.cinema-on .contact,
body.cinema-on .testimonials,
body.cinema-on .cvc-flights {
    background: transparent !important;
    background-color: transparent !important;
    padding-top: clamp(4rem, 10vh, 7rem);
    padding-bottom: clamp(4rem, 10vh, 7rem);
}

/* Scrim escuro atrás do conteúdo de cada seção para legibilidade */
body.cinema-on section > .container,
body.cinema-on .widget-section > .container,
body.cinema-on .about > .container,
body.cinema-on .services > .container,
body.cinema-on .tours > .container,
body.cinema-on .documents > .container,
body.cinema-on .location > .container,
body.cinema-on .certification > .container,
body.cinema-on .contact > .container,
body.cinema-on .testimonials > .container,
body.cinema-on .cvc-flights > .container {
    background: rgba(6, 14, 26, 0.82) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.15);
    backdrop-filter: blur(12px) saturate(1.15);
    border-radius: 20px;
    padding: clamp(1.6rem, 4vw, 3rem) !important;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.35);
}

/* Cards internos (contato, serviços, docs, etc): fundo escuro, texto branco */
body.cinema-on .contact-card,
body.cinema-on .contact-info-card,
body.cinema-on .service-card,
body.cinema-on .document-card,
body.cinema-on .testimonial-card,
body.cinema-on .cert-card,
body.cinema-on .schedule-card,
body.cinema-on .contact .contact-grid > div,
body.cinema-on .contact .schedule,
body.cinema-on .contact .hours-grid,
body.cinema-on .cine-panel {
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 14px;
    color: #ffffff !important;
}
body.cinema-on .contact-card *,
body.cinema-on .contact-info-card *,
body.cinema-on .contact .contact-grid *,
body.cinema-on .contact .schedule *,
body.cinema-on .contact .hours-grid * {
    color: rgba(255, 255, 255, 0.95) !important;
}

/* Títulos de seção sobre o cenário */
body.cinema-on .cine-eyebrow {
    display: inline-block;
    color: #ffd9a0;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    margin-bottom: 0.6rem;
    text-shadow: 0 1px 12px rgba(0, 0, 0, 0.8);
}

/* TODOS os títulos h2 dentro de seções: branco forte */
body.cinema-on section h2,
body.cinema-on section > .container > h2,
body.cinema-on .widget-header h2,
body.cinema-on section h2.cine-title {
    color: #ffffff !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.9), 0 0 40px rgba(0, 0, 0, 0.5);
}

/* TODOS os subtítulos e parágrafos: branco legível */
body.cinema-on section p,
body.cinema-on section .section-subtitle,
body.cinema-on .widget-header p,
body.cinema-on .about p,
body.cinema-on .about .about-content,
body.cinema-on .certification p,
body.cinema-on .certification span,
body.cinema-on .documents p,
body.cinema-on .location p,
body.cinema-on .location span,
body.cinema-on .contact p,
body.cinema-on .contact span {
    color: rgba(255, 255, 255, 0.93) !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.7);
}

/* Labels e textos menores */
body.cinema-on section label,
body.cinema-on section h3,
body.cinema-on section h4,
body.cinema-on .service-card h3,
body.cinema-on .service-card p,
body.cinema-on .testimonial-card p,
body.cinema-on .testimonial-card span,
body.cinema-on .document-card h3,
body.cinema-on .document-card p {
    color: rgba(255, 255, 255, 0.92) !important;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
}

/* Links dentro do conteúdo cinematográfico */
body.cinema-on section a:not(.btn):not(.nav-link):not([href*="wa.me"]) {
    color: #7dd3fc !important;
}
body.cinema-on section .btn {
    text-shadow: none;
}

/* Elementos revelados na rolagem */
body.cinema-on .cine-reveal {
    opacity: 0;
    transform: translateY(48px);
}
body.cinema-on.cinema-ready .cine-reveal { /* JS anima; isto evita flash */ }

/* Footer sólido para leitura */
body.cinema-on footer {
    background: rgba(6, 14, 24, 0.92);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/* ---------- Fallbacks ---------- */
/* Sem JS ou reduced-motion: site volta ao normal */
@media (prefers-reduced-motion: reduce) {
    #cinema-bg { display: none !important; }
    body.cinema-on { background-color: var(--bg-light, #f8fafc); }
    body.cinema-on .cine-reveal { opacity: 1; transform: none; }
    body.cinema-on .hero {
        background: linear-gradient(180deg, rgba(15, 23, 42, 0.55) 0%, rgba(15, 23, 42, 0.35) 50%, rgba(20, 184, 166, 0.45) 100%),
            url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=1920&q=80') center/cover;
    }
    body.cinema-on .widget-section,
    body.cinema-on .about,
    body.cinema-on .services,
    body.cinema-on .tours,
    body.cinema-on .documents,
    body.cinema-on .location,
    body.cinema-on .certification,
    body.cinema-on .contact,
    body.cinema-on .testimonials,
    body.cinema-on .cvc-flights {
        background: #ffffff !important;
    }
    body.cinema-on section > .container > h2,
    body.cinema-on .widget-header h2 { color: inherit !important; text-shadow: none !important; }
    body.cinema-on section p,
    body.cinema-on section span,
    body.cinema-on section label,
    body.cinema-on section h3,
    body.cinema-on section h4,
    body.cinema-on .section-subtitle,
    body.cinema-on .widget-header p { color: inherit !important; text-shadow: none !important; }
    body.cinema-on section a:not(.btn):not(.nav-link) { color: inherit !important; }
    body.cinema-on .widget-section > .container,
    body.cinema-on .about > .container,
    body.cinema-on .services > .container,
    body.cinema-on .tours > .container,
    body.cinema-on .documents > .container,
    body.cinema-on .location > .container,
    body.cinema-on .certification > .container,
    body.cinema-on .contact > .container,
    body.cinema-on .testimonials > .container,
    body.cinema-on .cvc-flights > .container {
        background: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        box-shadow: none;
        border-radius: 0;
        padding: 0;
    }
}

/* Mobile: mantém cenas (imagens leves), reduz blur para performance */
@media (max-width: 768px) {
    body.cinema-on .cine-panel {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        background: rgba(255, 255, 255, 0.12);
        border-radius: 14px;
    }
    body.cinema-on .widget-section > .container,
    body.cinema-on .about > .container,
    body.cinema-on .services > .container,
    body.cinema-on .tours > .container,
    body.cinema-on .documents > .container,
    body.cinema-on .location > .container,
    body.cinema-on .certification > .container,
    body.cinema-on .contact > .container,
    body.cinema-on .testimonials > .container,
    body.cinema-on .cvc-flights > .container {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        background: rgba(6, 14, 26, 0.80);
        padding: clamp(1rem, 3vw, 2rem);
    }
    #cinema-bg .scene { inset: -3%; }
}