* { -webkit-tap-highlight-color: transparent; box-sizing: border-box; }
        html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
        html { scroll-behavior: smooth; }
        body { -webkit-font-smoothing: antialiased; }

/* Fallbacks for custom Tailwind CDN colors. Keep these aligned with tailwind.config. */
.text-gold-500 { color: #e5c87a; }
.text-gold-600 { color: #c9a84c; }
.text-gold-700 { color: #b38b36; }
.text-gold-800 { color: #916a21; }
.text-dark-950 { color: #05080d; }
.text-dark-900 { color: #0a0f18; }
.text-dark-800 { color: #0d1420; }
.text-dark-700 { color: #111c2e; }
.text-dark-600 { color: #162033; }
.text-slate2-300 { color: #cbd5e1; }
.text-slate2-400 { color: #64748b; }
.text-slate2-500 { color: #475569; }
.bg-gold-50 { background-color: rgba(229, 200, 122, 0.12); }
.bg-gold-500 { background-color: #e5c87a; }
.bg-gold-600 { background-color: #c9a84c; }
.bg-gold-700 { background-color: #b38b36; }
.bg-gold-600\/10 { background-color: rgba(201, 168, 76, 0.10); }
.bg-gold-600\/15 { background-color: rgba(201, 168, 76, 0.15); }
.bg-gold-600\/20 { background-color: rgba(201, 168, 76, 0.20); }
.bg-gold-600\/30 { background-color: rgba(201, 168, 76, 0.30); }
.bg-dark-950 { background-color: #05080d; }
.bg-dark-900 { background-color: #0a0f18; }
.bg-dark-800 { background-color: #0d1420; }
.bg-dark-700 { background-color: #111c2e; }
.bg-dark-600 { background-color: #162033; }
.border-gold-500 { border-color: #e5c87a; }
.border-gold-600 { border-color: #c9a84c; }
.border-gold-600\/20 { border-color: rgba(201, 168, 76, 0.20); }
.hover\:text-gold-500:hover { color: #e5c87a; }
.hover\:border-gold-600\/50:hover { border-color: rgba(201, 168, 76, 0.50); }
.hover\:border-gold-600:hover { border-color: #c9a84c; }


        .reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.16,1,0.3,1); }
        .reveal.active { opacity: 1; transform: translateY(0); }
        .delay-1 { transition-delay: 0.1s; } .delay-2 { transition-delay: 0.2s; } .delay-3 { transition-delay: 0.3s; }

        .hero-section { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; overflow: hidden; background:#0a0f18; }
        .hero-bg {
            position: absolute; inset: 0; z-index: 1;
            background-image:
                linear-gradient(90deg, rgba(10,15,24,0.94) 0%, rgba(10,15,24,0.80) 28%, rgba(10,15,24,0.42) 60%, rgba(10,15,24,0.50) 100%),
                linear-gradient(180deg, rgba(10,15,24,0.08) 0%, rgba(10,15,24,0.08) 44%, rgba(10,15,24,0.42) 100%),
                url('../assets/img/banner-carro-desktop.webp');
            background-size: cover;
            background-position: 72% 52%;
            background-repeat: no-repeat;
        }

        .hero-bg::before {
            content: ""; position:absolute; inset:0; opacity:.04;
            background-image:
                linear-gradient(rgba(229,200,122,.12) 1px, transparent 1px),
                linear-gradient(90deg, rgba(229,200,122,.12) 1px, transparent 1px);
            background-size: 52px 52px;
        }
        .hero-fade-bottom { position: absolute; bottom: 0; left: 0; right: 0; height: 160px; z-index: 3; background: linear-gradient(to top, #0a0f18 0%, transparent 100%); pointer-events: none; }

        .text-gold { background: linear-gradient(135deg, #e5c87a 0%, #c9a84c 52%, #b38b36 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
        .gold-line { background: linear-gradient(90deg, transparent, #c9a84c, transparent); }
        .glass { background: rgba(255,255,255,0.06); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.1); }
        .glass-strong { background: rgba(255,255,255,0.085); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border: 1px solid rgba(255,255,255,0.14); }
        .dark-card { background: linear-gradient(180deg, rgba(255,255,255,0.075), rgba(255,255,255,0.035)); border: 1px solid rgba(255,255,255,0.11); }


        .problem-context-section {
            isolation: isolate;
            background-color: #0a0f18;
        }
        .problem-context-section::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 0;
            background-image: url('../assets/img/problem-client-bg.jpg');
            background-size: cover;
            background-position: 72% 52%;
            background-repeat: no-repeat;
            opacity: 0.58;
            filter: saturate(0.86) contrast(1.08) brightness(0.82);
            transform: scale(1.02);
        }
        .problem-context-section::after {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
            pointer-events: none;
            background:
                linear-gradient(90deg, rgba(10,15,24,0.96) 0%, rgba(10,15,24,0.84) 34%, rgba(10,15,24,0.58) 66%, rgba(10,15,24,0.74) 100%),
                radial-gradient(circle at 78% 42%, rgba(201,168,76,0.18), transparent 34%);
        }
        .problem-context-overlay { z-index: 2; opacity: 0.58; mix-blend-mode: multiply; }
        .problem-context-glow { z-index: 3; }
        .problem-context-section .glass-strong {
            background: rgba(255,255,255,0.095);
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
        }

        .section-bg-problem-client { --section-bg-image: url('../assets/img/problem-client-bg.jpg'); }
        .section-bg-oficina { --section-bg-image: url('../assets/img/oficina-bg.webp'); }
        .section-bg-carro-defeito { --section-bg-image: url('../assets/img/carro-defeito-bg.webp'); }


        .signals-section {
            isolation: isolate;
        }
        .signals-section::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 0;
            background:
                linear-gradient(90deg, rgba(248,250,252,0.97) 0%, rgba(248,250,252,0.93) 44%, rgba(248,250,252,0.78) 100%),
                url('../assets/img/oficina-bg.webp');
            background-size: cover;
            background-position: 82% center;
            background-repeat: no-repeat;
            opacity: 0.92;
        }
        .signals-section::after {
            content: "";
            position: absolute;
            right: -9rem;
            top: 4rem;
            width: min(42vw, 34rem);
            height: min(42vw, 34rem);
            z-index: 0;
            border-radius: 999px;
            background: radial-gradient(circle, rgba(201,168,76,0.14), transparent 62%);
            pointer-events: none;
        }
        .signals-section .card-lift {
            background: rgba(255,255,255,0.92);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
        }

        .final-cta-section {
            isolation: isolate;
            background-color: #0a0f18;
        }
        .final-cta-section::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 0;
            background-image: url('../assets/img/carro-defeito-bg.webp');
            background-size: cover;
            background-position: 68% 54%;
            background-repeat: no-repeat;
            opacity: 0.42;
            filter: saturate(0.84) contrast(1.08) brightness(0.72);
        }
        .final-cta-section::after {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
            pointer-events: none;
            background:
                linear-gradient(90deg, rgba(10,15,24,0.90), rgba(10,15,24,0.72) 52%, rgba(10,15,24,0.92)),
                linear-gradient(180deg, rgba(10,15,24,0.82), rgba(10,15,24,0.40) 44%, rgba(10,15,24,0.86));
        }
        .final-cta-overlay { z-index: 2; opacity: 0.62; mix-blend-mode: multiply; }

        .cta-gold {
            position: relative;
            background: linear-gradient(135deg, #c9a84c 0%, #e5c87a 50%, #c9a84c 100%);
            background-size: 200% 100%;
            color: #0a0f18; font-weight: 800;
            transition: transform 0.3s ease, box-shadow 0.3s ease, background-position .6s ease;
            overflow: hidden;
        }
        .cta-gold:hover { transform: translateY(-2px); box-shadow: 0 18px 45px rgba(201,168,76,0.26); background-position: 100% 0; }
        .btn-shine::after { content: ''; position: absolute; top: 0; left: 0; width: 52%; height: 100%; background: linear-gradient(to right, transparent, rgba(255,255,255,0.62), transparent); transform: translateX(-150%) skewX(-20deg); animation: shineGPU 3.6s infinite; }
        @keyframes shineGPU { 0%, 52% { transform: translateX(-150%) skewX(-20deg); } 100% { transform: translateX(260%) skewX(-20deg); } }

        .card-lift { transition: transform 0.35s ease, box-shadow 0.35s ease, border-color .35s ease; }
        .card-lift:hover { transform: translateY(-8px); box-shadow: 0 24px 60px rgba(0,0,0,0.14); }
        .icon-bounce { transition: transform 0.3s ease; }
        .card-lift:hover .icon-bounce { transform: scale(1.12) rotate(-3deg); }


        .hero-copy-panel {
            background: linear-gradient(180deg, rgba(8,12,20,0.52), rgba(8,12,20,0.30));
            border: 1px solid rgba(255,255,255,0.08);
            backdrop-filter: blur(7px);
            -webkit-backdrop-filter: blur(7px);
            border-radius: 2rem;
            padding: 1.4rem;
            box-shadow: 0 20px 60px rgba(0,0,0,0.22);
        }

        .hero-copy-panel h1,
        .hero-copy-panel p,
        .hero-copy-panel span,
        .hero-copy-panel strong {
            text-shadow: 0 2px 16px rgba(0,0,0,0.38);
        }

        .hero-subtitle-strong {
            color: rgba(255,255,255,0.96);
            font-weight: 500;
        }

        .hero-description-strong {
            color: rgba(255,255,255,0.90);
        }

        .nav-scrolled { background: rgba(10,15,24,0.97); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 4px 30px rgba(0,0,0,0.5); }
        .mobile-menu { transform: translateX(100%); transition: transform 0.35s cubic-bezier(0.16,1,0.3,1); }
        .mobile-menu.open { transform: translateX(0); }

        .faq-body { max-height: 0; overflow: hidden; transition: max-height 0.4s cubic-bezier(0.16,1,0.3,1); }
        .faq-arrow { transition: transform 0.3s ease; }
        .faq-open .faq-arrow { transform: rotate(180deg); }

        @keyframes pulse-ring { 0%{transform:scale(0.8);opacity:0.58} 80%,100%{transform:scale(1.5);opacity:0} }
        .pulse-ring::before { content:''; position:absolute; inset:0; border-radius:50%; background:#25D366; animation:pulse-ring 2s infinite; z-index:0; }

        @media (max-width: 1023px) {
            .hero-section {
                min-height: 100svh;
                align-items: flex-start;
            }
            .hero-bg {
                background-image:
                    linear-gradient(180deg, rgba(10,15,24,0.88) 0%, rgba(10,15,24,0.72) 28%, rgba(10,15,24,0.48) 58%, rgba(10,15,24,0.90) 100%),
                    linear-gradient(90deg, rgba(10,15,24,0.86), rgba(10,15,24,0.30), rgba(10,15,24,0.78)),
                    url('../assets/img/banner-carro-mobile.webp');
                background-size: cover;
                background-position: center 34%;
            }
            .hero-bg::after {
                content: "";
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 48%;
                background: linear-gradient(to top, rgba(10,15,24,0.96), transparent);
                pointer-events: none;
            }
            .problem-context-section::before {
                background-position: 67% center;
                opacity: 0.42;
                filter: saturate(0.82) contrast(1.06) brightness(0.72) blur(0.5px);
            }
            .signals-section::before {
                background:
                    linear-gradient(180deg, rgba(248,250,252,0.98) 0%, rgba(248,250,252,0.94) 52%, rgba(248,250,252,0.98) 100%),
                    url('../assets/img/oficina-bg.webp');
                background-position: 70% center;
                opacity: 0.74;
            }
            .signals-section::after { opacity: 0.55; }
            .final-cta-section::before {
                background-image: url('../assets/img/banner-carro-mobile.webp');
                background-position: center 58%;
                opacity: 0.34;
                filter: saturate(0.80) contrast(1.06) brightness(0.62) blur(0.35px);
            }
            .final-cta-section::after {
                background: linear-gradient(180deg, rgba(10,15,24,0.94) 0%, rgba(10,15,24,0.76) 44%, rgba(10,15,24,0.95) 100%);
            }
            .problem-context-section::after {
                background: linear-gradient(180deg, rgba(10,15,24,0.94) 0%, rgba(10,15,24,0.84) 48%, rgba(10,15,24,0.94) 100%);
            }
            .problem-context-overlay { opacity: 0.68; }
            .hero-copy-panel {
                padding: 1rem;
                border-radius: 1.4rem;
                background: linear-gradient(180deg, rgba(8,12,20,0.62), rgba(8,12,20,0.34));
            }
            .hero-section > .relative.z-10 {
                width: 100% !important;
                max-width: 100vw !important;
                display: flex !important;
                flex-direction: column !important;
                align-items: center !important;
                justify-content: center !important;
                text-align: center !important;
                padding-left: 1rem !important;
                padding-right: 1rem !important;
                margin-left: 0 !important;
                margin-right: 0 !important;
            }
            .hero-section > .relative.z-10 > div {
                width: 100% !important;
                max-width: 100% !important;
                justify-self: center !important;
            }
        }

        @media (max-width: 768px) {
            .hero-section {
                align-items: flex-start !important;
                justify-content: flex-start !important;
            }
            .hero-section > .relative.z-10,
            .hero-content,
            .hero-inner {
                padding-top: 72px !important;
            }
            .hero-section > .relative.z-10::before {
                min-height: 0 !important;
            }
            .hero-copy-panel {
                margin-top: 0 !important;
            }
        }
        @media (max-width: 640px) {
            .hero-section {
                min-height: auto;
            }
            .hero-section > .relative.z-10 {
                padding-top: 72px !important;
                padding-bottom: 1.75rem !important;
                gap: 0.5rem !important;
            }
            .hero-section > .relative.z-10::before {
                content: "";
                display: block;
                width: 100%;
                min-height: 0 !important;
                pointer-events: none;
            }
            .hero-copy-panel {
                margin-top: 0 !important;
                background: linear-gradient(180deg, rgba(8,12,20,0.76), rgba(8,12,20,0.50));
                box-shadow: 0 18px 50px rgba(0,0,0,0.34);
            }
            .hero-bg {
                background-size: cover;
                background-position: center bottom;
            }
            .hero-section > .relative.z-10 > div:nth-child(2) {
                margin-top: 0 !important;
            }

            .problem-context-section .glass-strong,
            .final-cta-section .reveal {
                backdrop-filter: blur(14px);
                -webkit-backdrop-filter: blur(14px);
            }
            .hero-title { font-size: 2.35rem !important; line-height: 1.10 !important; }
        }

        @media (hover: none) and (pointer: coarse) and (max-width: 480px) {
            .hero-copy-panel {
                transform: translateY(-0.75rem);
            }
        }