/**
 * AUTOESCOLA FUSION + FSN EXAMES TOXICOLÓGICOS
 * Agency-Grade Master Design System (Amarelo, Preto & Branco)
/**
 * AUTOESCOLA FUSION + FSN EXAMES TOXICOLÓGICOS
 * Agency-Grade Master Design System (Amarelo, Preto & Branco)
 * Cores Oficiais: Amarelo (#F59E0B / #FFC107), Preto (#0A192F / #111827), Branco (#FFFFFF)
 *
 * Fontes (Outfit + Inter + DM Serif Display) carregadas via <link> nos layouts
 * para evitar @import render-blocking.
 */

:root {    /* Autoescola Fusion - Paleta Oficial 60-30-10 (Branco, Preto-Chumbo e Amarelo Dourado) */
    --fusion-primary: #F5B301;
    --fusion-primary-hover: #E0A800;
    --fusion-primary-light: #FFFBEB;
    --fusion-secondary: #1A1A1A;
    --fusion-secondary-light: #2D3748;
    --fusion-dark: #1A1A1A;
    --fusion-yellow: #FFC107;
    --fusion-yellow-hover: #E0A800;
    
    /* FSN Exames Toxicológicos - Paleta Clínica Esmeralda & Teal */
    --fsn-primary: #0D9488;
    --fsn-primary-hover: #0F766E;
    --fsn-primary-light: #CCFBF1;
    --fsn-secondary: #064E3B;
    --fsn-accent: #10B981;
    --fsn-slate: #0F172A;

    /* Neutros e Superfícies Elevadas (60% Branco / Off-White) */
    --surface-default: #FFFFFF;
    --surface-raised: rgba(255, 255, 255, 0.95);
    --surface-glass: rgba(255, 255, 255, 0.85);
    --surface-dark-glass: rgba(26, 26, 26, 0.85);

    --color-dark: #1A1A1A;
    --color-dark-muted: #2D3748;
    --color-body: #1A1A1A;
    --color-muted: #4B5563;
    --color-light: #FAFAFA;
    --color-surface: #FFFFFF;
    --color-border: rgba(26, 26, 26, 0.08);
    --color-border-hover: rgba(245, 179, 1, 0.5);

    /* Bordas Iluminadas com Relevo Interno (Inner Stroke) */
    --border-glow-light: inset 0 1px 1px rgba(255, 255, 255, 0.9), inset 0 0 0 1px rgba(15, 23, 42, 0.07);
    --border-glow-dark: inset 0 1px 1px rgba(255, 255, 255, 0.18), inset 0 0 0 1px rgba(255, 255, 255, 0.1);
    --border-glow-gold: inset 0 1px 1px rgba(255, 255, 255, 0.6), inset 0 0 0 1px rgba(245, 158, 11, 0.35);
    --border-glow-teal: inset 0 1px 1px rgba(255, 255, 255, 0.6), inset 0 0 0 1px rgba(13, 148, 136, 0.35);

    /* Cores de Feedback */
    --color-success: #10B981;
    --color-warning: #F59E0B;
    --color-danger: #EF4444;
    --color-info: #0284C7;
    --color-whatsapp: #25D366;
    --color-whatsapp-dark: #1EBE5D;

    /* Tipografia & Tracking Hiper-Moderno */
    --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-display: 'DM Serif Display', Georgia, 'Times New Roman', serif;
    --tracking-tightest: -0.04em;
    --tracking-tight: -0.025em;

    /* Sombras Premium em Camadas (Ambient + Key Light) */
    --shadow-xs: 0 1px 2px 0 rgba(10, 25, 47, 0.04);
    --shadow-sm: 0 4px 12px -2px rgba(10, 25, 47, 0.06), 0 2px 4px -1px rgba(10, 25, 47, 0.03);
    --shadow-md: 0 14px 28px -6px rgba(10, 25, 47, 0.08), 0 6px 12px -2px rgba(10, 25, 47, 0.04);
    --shadow-lg: 0 24px 44px -8px rgba(10, 25, 47, 0.12), 0 10px 20px -4px rgba(10, 25, 47, 0.05);
    --shadow-xl: 0 36px 70px -15px rgba(10, 25, 47, 0.16), 0 16px 32px -6px rgba(10, 25, 47, 0.08);
    --shadow-glow-fusion: 0 12px 36px -6px rgba(245, 158, 11, 0.45);
    --shadow-glow-fsn: 0 12px 36px -6px rgba(13, 148, 136, 0.45);

    /* Raios de Arredondamento */
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-bento: 24px;
    --radius-2xl: 24px;
    --radius-xl: 28px;
    --radius-3xl: 32px;
    --radius-full: 9999px;

    /* Transições com Física Elástica (Bounce Physics) */
    --transition-fast: 0.15s cubic-bezier(0.16, 1, 0.3, 1);
    --transition-smooth: 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    --transition-bounce: 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Reset e Base Global */
*, *::before, *::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body {
    font-family: var(--font-sans);
    color: var(--color-body);
    background-color: var(--color-light);
    line-height: 1.65;
    font-size: 1rem;
    overflow-x: hidden;
}

h1, .h1, .display-1, .display-2, .display-3, .display-4 {
    font-family: var(--font-heading);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.03em;
}

h2, .h2, .display-5, .display-6 {
    font-family: var(--font-heading);
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: -0.02em;
}

h3, .h3 {
    font-family: var(--font-heading);
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: -0.015em;
}

h4, .h4 {
    font-family: var(--font-heading);
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -0.01em;
}

h5, .h5 {
    font-family: var(--font-heading);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -0.005em;
}

h6, .h6 {
    font-family: var(--font-heading);
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0;
}

.font-heading {
    font-family: var(--font-heading);
}

.font-sans {
    font-family: var(--font-sans);
}

.font-display {
    font-family: var(--font-display);
}

/* ==========================================================================
   REGRA MASTER DE CONTRASTE: TEXTOS CLAROS EM FUNDOS ESCUROS & HERO
   ========================================================================== */
.text-white,
.text-white h1, .text-white h2, .text-white h3, .text-white h4, .text-white h5, .text-white h6,
.bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4, .bg-dark h5, .bg-dark h6,
.fusion-hero h1, .fusion-hero h2, .fusion-hero h3, .fusion-hero h4, .fusion-hero h5, .fusion-hero h6,
.fsn-hero h1, .fsn-hero h2, .fsn-hero h3, .fsn-hero h4, .fsn-hero h5, .fsn-hero h6,
.fusion-dark-section h1, .fusion-dark-section h2, .fusion-dark-section h3, .fusion-dark-section h4,
[style*="background: linear-gradient"] h1,
[style*="background: linear-gradient"] h2,
[style*="background: linear-gradient"] h3,
[style*="background: linear-gradient"] h4,
[style*="background:#064E3B"] h1,
[style*="background:#064E3B"] h2,
[style*="background:#064E3B"] h3,
[style*="background:#064E3B"] h4,
[style*="background: #064E3B"] h1,
[style*="background: #064E3B"] h2,
[style*="background: #064E3B"] h3,
[style*="background: #064E3B"] h4,
[style*="background: #0A192F"] h1,
[style*="background: #0A192F"] h2,
[style*="background: #0A192F"] h3,
[style*="background: #0A192F"] h4 {
    color: #FFFFFF !important;
}

.fusion-hero .highlight-gradient,
.highlight-gradient {
    color: #F5B301 !important;
    background: linear-gradient(120deg, #FBBF24 0%, #F59E0B 55%, #D97706 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.fusion-hero p.lead,
.fusion-hero p,
.fsn-hero p.lead,
.fsn-hero p,
.bg-dark p,
.text-white p,
.fusion-dark-section p,
[style*="background: linear-gradient"] p,
[style*="background: #064E3B"] p,
[style*="background: #0A192F"] p {
    color: rgba(255, 255, 255, 0.92) !important;
}

.fusion-hero .text-muted,
.bg-dark .text-muted,
.fsn-hero .text-muted,
.fusion-dark-section .text-muted,
[style*="background: linear-gradient"] .text-muted,
[style*="background: #064E3B"] .text-muted,
[style*="background: #0A192F"] .text-muted {
    color: rgba(255, 255, 255, 0.75) !important;
}

/* Badges sobre fundos escuros */
.bg-dark .badge-fusion,
.fusion-hero .badge-fusion,
.fsn-hero .badge-fusion,
[style*="background: linear-gradient"] .badge-fusion,
[style*="background: #0A192F"] .badge-fusion {
    background: rgba(245, 179, 1, 0.2) !important;
    color: #FFC107 !important;
    border: 1px solid rgba(245, 179, 1, 0.5) !important;
}

h1, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
    letter-spacing: var(--tracking-tightest) !important;
    line-height: 1.06;
    font-weight: 900;
}

p {
    margin-bottom: 1rem;
}

a {
    color: var(--fusion-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover {
    color: var(--fusion-primary-hover);
}

/* Gradientes de Texto de Agência */
.gradient-text-fusion {
    background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.gradient-text-fsn {
    background: linear-gradient(135deg, #0D9488 0%, #10B981 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

/* Card Premium Engine (Relevo 3D Macio + Física Elástica) */
.premium-card {
    background: var(--surface-default);
    box-shadow: var(--shadow-sm), var(--border-glow-light);
    border-radius: var(--radius-xl);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    transition: all var(--transition-bounce);
    position: relative;
    border: none;
}

.premium-card:hover {
    transform: translateY(-6px) scale(1.01);
    box-shadow: var(--shadow-xl), var(--border-glow-gold);
}

.premium-card-teal:hover {
    box-shadow: var(--shadow-xl), var(--border-glow-teal);
}

/* Utilitários Tipográficos */
.fw-black { font-weight: 900 !important; }
.fw-extrabold { font-weight: 800 !important; }
.tracking-tight { letter-spacing: var(--tracking-tight) !important; }
.tracking-tightest { letter-spacing: var(--tracking-tightest) !important; }
.tracking-wide { letter-spacing: 0.05em !important; }

/* Botões Oficiais Fusion (Amarelo, Preto e Branco) */
.btn {
    font-family: var(--font-sans);
    font-weight: 700;
    padding: 0.75rem 1.6rem;
    border-radius: var(--radius-full);
    transition: all var(--transition-smooth);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: none;
    cursor: pointer;
    text-decoration: none;
    position: relative;
    overflow: hidden;
}

.btn:active {
    transform: scale(0.98);
}

.btn-fusion {
    background: #F5B301;
    color: #1A1A1A !important;
    font-weight: 800;
    box-shadow: 0 8px 24px -4px rgba(245, 179, 1, 0.4);
}

.btn-fusion:hover {
    background: #E0A800;
    color: #1A1A1A !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 30px -4px rgba(245, 179, 1, 0.55);
}

.btn-fsn {
    background: linear-gradient(135deg, #0D9488 0%, #0F766E 100%);
    color: #FFFFFF !important;
    font-weight: 700;
    box-shadow: var(--shadow-glow-fsn);
}

.btn-fsn:hover {
    background: linear-gradient(135deg, #0F766E 0%, #115E59 100%);
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 35px -4px rgba(13, 148, 136, 0.55);
}

.btn-whatsapp {
    background: linear-gradient(135deg, #25D366 0%, #1EBE5D 100%);
    color: #FFFFFF !important;
    font-weight: 700;
    box-shadow: 0 8px 24px -4px rgba(37, 211, 102, 0.4);
}

.btn-whatsapp:hover {
    background: linear-gradient(135deg, #1EBE5D 0%, #16A34A 100%);
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 28px -2px rgba(37, 211, 102, 0.55);
}

.btn-outline-whatsapp {
    background: #FFFFFF;
    color: #15803D !important;
    border: 2px solid #25D366;
    font-weight: 700;
    box-shadow: var(--shadow-sm);
}

.btn-outline-whatsapp:hover {
    background: #25D366;
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -3px rgba(37, 211, 102, 0.4);
}

.btn-outline-fusion {
    background: transparent;
    color: #1A1A1A !important;
    border: 2px solid #F5B301;
    font-weight: 700;
}

.btn-outline-fusion:hover {
    background: #F5B301;
    color: #1A1A1A !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px -4px rgba(245, 179, 1, 0.4);
}

.btn-outline-white {
    background: rgba(255, 255, 255, 0.08);
    color: #FFFFFF !important;
    border: 1.5px solid rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(8px);
}

.btn-outline-white:hover {
    background: #FFFFFF;
    color: var(--color-dark) !important;
    border-color: #FFFFFF;
    transform: translateY(-2px);
}

/* Badges e Pílulas Modernas */
.agency-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.85rem;
    border-radius: var(--radius-full);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.badge-fusion {
    background: #FFFBEB;
    color: #1A1A1A !important;
    border: 1px solid rgba(245, 179, 1, 0.4);
    font-weight: 800;
}

.badge-fsn {
    background: #CCFBF1;
    color: #0F766E !important;
    border: 1px solid rgba(13, 148, 136, 0.35);
    font-weight: 800;
}

.badge-verified {
    background: #DCFCE7;
    color: #15803D;
    border: 1px solid rgba(22, 163, 74, 0.2);
}

.badge-glass,
.badge.bg-white.bg-opacity-10,
.badge.bg-white.bg-opacity-15,
.badge.bg-white.bg-opacity-20,
.badge.bg-white.bg-opacity-25 {
    background: rgba(255, 255, 255, 0.15) !important;
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Cards com Estilo de Agência */
.agency-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 2rem;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-smooth);
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.agency-card:hover {
    border-color: var(--color-border-hover);
    box-shadow: var(--shadow-xl);
    transform: translateY(-5px);
}

/* Ícones em Destaque */
.icon-box {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 1.25rem;
    transition: all var(--transition-bounce);
}

.icon-box-fusion {
    background: linear-gradient(135deg, #FEF3C7 0%, #FDE68A 100%);
    color: #B45309;
    border: 1px solid rgba(245, 158, 11, 0.3);
}

.icon-box-fsn {
    background: linear-gradient(135deg, #CCFBF1 0%, #99F6E4 100%);
    color: #0D9488;
    border: 1px solid rgba(13, 148, 136, 0.2);
}

/* Dual Brand Topbar */
.dual-brand-topbar {
    background: #0A192F !important;
    color: #94A3B8 !important;
    font-size: 0.82rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.brand-switch-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.85rem;
    border-radius: var(--radius-full);
    background: rgba(255, 255, 255, 0.1);
    color: #E2E8F0 !important;
    font-weight: 600;
    font-size: 0.75rem;
    transition: all var(--transition-fast);
}

.brand-switch-pill:hover {
    background: rgba(255, 255, 255, 0.2);
    color: #FFFFFF !important;
}

.brand-switch-pill.active {
    background: #F59E0B !important;
    color: #111827 !important;
    font-weight: 800 !important;
    box-shadow: 0 0 14px rgba(245, 158, 11, 0.55), inset 0 1px 1px rgba(255, 255, 255, 0.4);
}

.brand-switch-pill.active-fsn {
    background: #0D9488 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    box-shadow: 0 0 14px rgba(13, 148, 136, 0.55), inset 0 1px 1px rgba(255, 255, 255, 0.4);
}

/* ==========================================================================
   NAVBAR PRINCIPAL — SLEEK DARK FROSTED GLASS (AGENCY IDENTITY)
   ========================================================================== */
.agency-navbar {
    background: rgba(10, 15, 29, 0.95) !important;
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    padding: 0.75rem 0;
    position: sticky;
    top: 0;
    z-index: 1030;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
    transition: background 0.3s ease, padding 0.3s ease;
}

.agency-navbar.scrolled {
    background: rgba(10, 15, 29, 0.98) !important;
    padding: 0.55rem 0 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

.agency-navbar .nav-link {
    font-family: var(--font-sans);
    font-weight: 600;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.85) !important;
    padding: 0.45rem 0.85rem !important;
    border-radius: 9999px;
    background: transparent !important;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.agency-navbar .nav-link:hover {
    color: #FFFFFF !important;
    background: rgba(255, 255, 255, 0.1) !important;
}

.agency-navbar .nav-link.active {
    color: #FBBF24 !important;
    background: rgba(245, 165, 36, 0.12) !important;
    border-bottom: 2px solid #F59E0B !important;
    font-weight: 700 !important;
}

.agency-navbar .nav-link .badge {
    font-size: 0.65rem;
    font-weight: 800;
}

.agency-navbar .nav-link.active .badge {
    background: rgba(245, 165, 36, 0.25) !important;
    color: #FBBF24 !important;
}

/* Stacking Context para Seções Hero */
.fusion-hero,
.fsn-hero {
    position: relative;
    overflow: hidden;
}

.fusion-hero-bg-media,
.fsn-hero-bg-media {
    position: absolute;
    inset: 0;
    z-index: 1 !important;
}

.fusion-hero-overlay,
.fsn-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 2 !important;
    pointer-events: none;
}

.fusion-hero .container,
.fsn-hero .container,
.fusion-hero .z-index-2,
.z-index-2 {
    position: relative;
    z-index: 10 !important;
}

/* ==========================================================================
   TRUST BARRA DE CONFIANÇA & CONEXÃO REGIONAL (ALTO CONTRASTE)
   ========================================================================== */
.trust-bar-section {
    background: #FFFFFF !important;
    color: #1A1A1A !important;
    padding: 1.25rem 0 !important;
    border-top: 1px solid rgba(15, 23, 42, 0.08) !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    position: relative;
    z-index: 10;
}

.trust-bar-section strong,
.trust-bar-section .text-dark {
    color: #1A1A1A !important;
    font-weight: 700;
}

.trust-bar-section small,
.trust-bar-section .text-muted {
    color: #475569 !important;
    font-weight: 500;
}

/* Floating WhatsApp Button */
.whatsapp-floating-widget {
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 1050;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.whatsapp-pill-label {
    background: #FFFFFF;
    color: #111827;
    font-weight: 700;
    font-size: 0.82rem;
    padding: 0.4rem 0.85rem;
    border-radius: var(--radius-full);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.12);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.whatsapp-floating-btn {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(135deg, #25D366 0%, #1EBE5D 100%);
    color: #FFFFFF !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.9rem;
    box-shadow: 0 10px 25px -3px rgba(37, 211, 102, 0.5);
    transition: all var(--transition-smooth);
    animation: pulse-whatsapp 2.5s infinite;
}

.whatsapp-floating-btn:hover {
    transform: scale(1.08) rotate(5deg);
    box-shadow: 0 15px 35px -2px rgba(37, 211, 102, 0.6);
}

@keyframes pulse-whatsapp {
    0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.6); }
    70% { box-shadow: 0 0 0 16px rgba(37, 211, 102, 0); }
    100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

/* Footer Profissional com Ambient Glow */
.agency-footer {
    position: relative;
    background: #0A192F;
    color: #94A3B8;
    padding: 5rem 0 2.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

.agency-footer::before {
    content: '';
    position: absolute;
    top: -40%;
    left: 50%;
    transform: translateX(-50%);
    width: 70%;
    height: 100%;
    background: radial-gradient(ellipse at center, rgba(245, 158, 11, 0.14) 0%, transparent 70%);
    pointer-events: none;
}

.agency-footer h5 {
    color: #FFFFFF;
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 1.25rem;
}

.agency-footer a {
    color: #94A3B8;
    text-decoration: none;
    transition: color var(--transition-fast);
}

.agency-footer a:hover {
    color: #F59E0B;
}

.agency-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.4);
    padding-top: 1.75rem;
    margin-top: 3.5rem;
    font-size: 0.85rem;
}

/* Mobile Bottom Sticky Action Bar (Visível apenas em Mobile) */
.mobile-bottom-bar {
    display: none !important;
}

@media (max-width: 767.98px) {
    /* Oculta a bolinha flutuante no mobile para eliminar redundância e despoluir a tela */
    .whatsapp-floating-widget {
        display: none !important;
    }

    .mobile-bottom-bar {
        display: flex !important;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: #FFFFFF;
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
        padding: 0.65rem 1rem;
        gap: 0.5rem;
        z-index: 1040;
        border-top: 1px solid rgba(15, 23, 42, 0.08);
    }
}

/* Tipografia: display-7 (usado em cards hero do bento grid) */
.display-7 {
    font-size: clamp(1.45rem, 2.6vw, 2rem) !important;
    font-weight: 800 !important;
    letter-spacing: var(--tracking-tightest) !important;
    line-height: 1.15 !important;
}

/* Larguras máximas utilitárias */
.max-w-700 { max-width: 700px !important; }
.max-w-600 { max-width: 600px !important; }
.max-w-500 { max-width: 500px !important; }

/* Texto com entrelinha confortável */
.leading-relaxed { line-height: 1.7 !important; }
.leading-snug { line-height: 1.4 !important; }

/* Hover branco em links de footer/áreas escuras */
.hover-white { transition: color var(--transition-fast) !important; }
.hover-white:hover { color: #FFFFFF !important; }

/* Cor teal utilitária (Bootstrap não fornece .text-teal) */
.text-teal { color: #0D9488 !important; }
.bg-teal { background-color: #0D9488 !important; }
.border-teal { border-color: #0D9488 !important; }

/* Botão outline teal (usado no header do painel admin) */
.btn-outline-teal {
    background: #FFFFFF;
    color: #0D9488 !important;
    border: 1.5px solid #0D9488 !important;
    font-weight: 700;
    box-shadow: var(--shadow-xs);
    transition: all var(--transition-smooth);
}
.btn-outline-teal:hover {
    background: #0D9488;
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -4px rgba(13, 148, 136, 0.45);
}

/* Card com destaque dourado (featured-card usado na home) */
.featured-card {
    position: relative;
    border: 1.5px solid rgba(245, 158, 11, 0.4) !important;
    box-shadow: var(--shadow-md), var(--border-glow-gold) !important;
}
.featured-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 4px;
    background: linear-gradient(90deg, transparent, #F59E0B, transparent);
    border-radius: 0 0 4px 4px;
    z-index: 2;
}

/* Botões sociais do footer */
.footer-social-links { margin-top: 0.25rem; }

.footer-social-btn {
    width: 42px;
    height: 42px;
    border-radius: var(--radius-full);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #E2E8F0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    transition: all var(--transition-bounce);
}
.footer-social-btn:hover {
    background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%);
    border-color: #F59E0B;
    color: #111827 !important;
    transform: translateY(-4px);
    box-shadow: var(--shadow-glow-fusion);
}

/* =========================================================
   FAQ INTERATIVO — DESTAQUES, TOAST E MICRO-INTERAÇÕES
   ========================================================= */

/* Destaque dos termos buscados */
.faq-highlight {
    background: rgba(245, 158, 11, 0.28);
    color: #92400E;
    padding: 0 0.15em;
    border-radius: 4px;
    font-weight: 700;
    box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.25);
}

/* Toast flutuante de link copiado */
.faq-toast-message {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translate(-50%, 16px);
    background: #0A192F;
    color: #FFFFFF;
    font-weight: 700;
    font-size: 0.9rem;
    padding: 0.85rem 1.5rem;
    border-radius: var(--radius-full);
    box-shadow: var(--shadow-xl), 0 0 0 1px rgba(245, 158, 11, 0.35);
    z-index: 1200;
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-bounce);
    white-space: nowrap;
}
.faq-toast-message.visible {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

/* Flash de destaque ao abrir item via deep link */
.faq-item-target-highlight {
    animation: faq-target-glow 2.6s ease-out;
    border-radius: var(--radius-md);
}
@keyframes faq-target-glow {
    0% { box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.55), var(--shadow-lg); }
    100% { box-shadow: var(--shadow-sm), var(--border-glow-light); }
}

/* Micro-feedback tátil de clique nos filtros */
.btn-press-active {
    transform: scale(0.96) !important;
}

/* Pulso ao clicar em busca rápida */
.tag-clicked-pulse {
    animation: tag-pulse 0.3s ease;
}
@keyframes tag-pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.08); }
    100% { transform: scale(1); }
}

/* =========================================================
   SCROLL REVEAL — ANIMAÇÕES DE ENTRADA (AGENCY GRADE)
   ========================================================= */

.js-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}
.js-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.js-reveal-delay-1 { transition-delay: 0.08s; }
.js-reveal-delay-2 { transition-delay: 0.16s; }
.js-reveal-delay-3 { transition-delay: 0.24s; }
.js-reveal-delay-4 { transition-delay: 0.32s; }

@media (prefers-reduced-motion: reduce) {
    .js-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* Seleção de texto com a identidade da marca */
::selection {
    background: rgba(245, 158, 11, 0.3);
    color: #0A192F;
}

/* Foco visível acessível em links e botões */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(245, 158, 11, 0.55);
    outline-offset: 2px;
    border-radius: 6px;
}

/* Botão Voltar ao Topo */
.btn-scroll-top {
    position: fixed;
    bottom: 90px;
    right: 24px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #0A192F;
    color: #F59E0B;
    border: 2px solid #F59E0B;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    box-shadow: 0 8px 24px rgba(10, 25, 47, 0.25);
    cursor: pointer;
    z-index: 1020;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn-scroll-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.btn-scroll-top:hover {
    background: #F59E0B;
    color: #0A192F;
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(245, 158, 11, 0.4);
}

@media (max-width: 767.98px) {
    .btn-scroll-top {
        bottom: 75px;
        right: 16px;
        width: 38px;
        height: 38px;
        font-size: 1rem;
    }
}

/* =========================================================
   BENTO GRID 2.0 (ACTIVE GRID SYSTEM & TACTILE GLASSMORPHISM)
   ========================================================= */

/* 1. Container Bento Grid Principal */
.bento-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1.5rem;
    align-items: stretch;
    width: 100%;
    position: relative;
}

/* 2. Bento Card Base (Agency Glassmorphism & Relevo Tátil) */
.bento-card {
    grid-column: span 4;
    grid-row: span 1;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: var(--surface-raised);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-radius: var(--radius-bento, 24px);
    border: 1px solid rgba(255, 255, 255, 0.7);
    box-shadow: var(--shadow-sm), var(--border-glow-light);
    padding: 2rem;
    overflow: hidden;
    isolation: isolate;
    transition: transform var(--transition-bounce), box-shadow var(--transition-smooth), border-color var(--transition-fast);
    text-decoration: none;
    color: inherit;
}

/* Efeito Shimmer / Reflexo de Luz Especular (Inner Stroke Sweep) */
.bento-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -140%;
    width: 80%;
    height: 100%;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.38) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: skewX(-25deg);
    transition: left 0.85s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
    z-index: 2;
}

/* Micro-interação de Elevação Elástica com Border Glow */
.bento-card:hover {
    transform: translateY(-6px) scale(1.008);
    box-shadow: var(--shadow-xl), var(--border-glow-gold);
    border-color: rgba(245, 158, 11, 0.45);
}

.bento-card:hover::before {
    left: 150%;
}

.bento-card:active {
    transform: translateY(-2px) scale(0.995);
}

/* 3. Variações de Hierarquia e Dimensão Bento Grid */
.bento-card-hero {
    grid-column: span 8;
    grid-row: span 2;
}

.bento-card-tall {
    grid-column: span 4;
    grid-row: span 2;
}

.bento-card-wide {
    grid-column: span 6;
    grid-row: span 1;
}

.bento-card-wide-8 {
    grid-column: span 8;
    grid-row: span 1;
}

.bento-card-full {
    grid-column: span 12;
    grid-row: span 1;
}

/* Classes Utilitárias de Span & Linha */
.bento-span-3 { grid-column: span 3; }
.bento-span-4 { grid-column: span 4; }
.bento-span-5 { grid-column: span 5; }
.bento-span-6 { grid-column: span 6; }
.bento-span-7 { grid-column: span 7; }
.bento-span-8 { grid-column: span 8; }
.bento-span-9 { grid-column: span 9; }
.bento-span-12 { grid-column: span 12; }
.bento-row-1 { grid-row: span 1; }
.bento-row-2 { grid-row: span 2; }

/* 4. Variações Temáticas de Alto Padrão */
.bento-card-dark {
    background: linear-gradient(145deg, #0A192F 0%, #112240 100%);
    color: #F8FAFC;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 12px 36px -4px rgba(0, 0, 0, 0.4), var(--border-glow-dark);
}

.bento-card-dark h1, .bento-card-dark h2, .bento-card-dark h3, 
.bento-card-dark h4, .bento-card-dark h5, .bento-card-dark h6 {
    color: #FFFFFF !important;
}

.bento-card-dark .text-muted {
    color: #94A3B8 !important;
}

.bento-card-dark::before {
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(245, 158, 11, 0.22) 40%,
        rgba(255, 255, 255, 0.28) 50%,
        rgba(255, 255, 255, 0) 100%
    );
}

.bento-card-dark:hover {
    box-shadow: 0 24px 55px -10px rgba(0, 0, 0, 0.6), var(--border-glow-gold);
    border-color: rgba(245, 158, 11, 0.5);
}

.bento-card-teal {
    background: linear-gradient(145deg, rgba(204, 251, 241, 0.55) 0%, #FFFFFF 100%);
    border: 1px solid rgba(13, 148, 136, 0.2);
    box-shadow: var(--shadow-sm), var(--border-glow-teal);
}

.bento-card-teal:hover {
    box-shadow: var(--shadow-xl), var(--border-glow-teal);
    border-color: rgba(13, 148, 136, 0.5);
}

.bento-card-teal::before {
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(13, 148, 136, 0.25) 50%,
        rgba(255, 255, 255, 0) 100%
    );
}

.bento-card-gold {
    background: linear-gradient(145deg, rgba(254, 243, 199, 0.6) 0%, #FFFFFF 100%);
    border: 1px solid rgba(245, 158, 11, 0.25);
    box-shadow: var(--shadow-sm), var(--border-glow-gold);
}

.bento-card-gold:hover {
    box-shadow: var(--shadow-xl), 0 0 25px rgba(245, 158, 11, 0.35);
    border-color: rgba(245, 158, 11, 0.65);
}

.bento-card-glass {
    background: rgba(255, 255, 255, 0.72) !important;
    backdrop-filter: blur(24px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.75) !important;
    box-shadow: 0 8px 32px 0 rgba(10, 25, 47, 0.07), inset 0 1px 2px rgba(255, 255, 255, 0.95) !important;
}

/* 5. Glassmorphism Tátil e Refinado (Classes Utilitárias) */
.glass-tactile {
    background: rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(24px) saturate(190%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(190%) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    box-shadow: 0 10px 35px -5px rgba(10, 25, 47, 0.08), inset 0 1.5px 2px rgba(255, 255, 255, 1), inset 0 -1px 1px rgba(15, 23, 42, 0.04) !important;
}

.glass-tactile-dark {
    background: rgba(10, 25, 47, 0.82) !important;
    backdrop-filter: blur(24px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0 14px 40px -5px rgba(0, 0, 0, 0.4), inset 0 1px 1px rgba(255, 255, 255, 0.2) !important;
}

/* 6. Micro-interações de Elevação Elástica & Bordas Iluminadas */
.elastic-lift {
    transition: transform var(--transition-bounce), box-shadow var(--transition-smooth), border-color var(--transition-fast) !important;
}

.elastic-lift:hover {
    transform: translateY(-6px) scale(1.01) !important;
    box-shadow: var(--shadow-xl) !important;
}

.elastic-lift:active {
    transform: translateY(-2px) scale(0.99) !important;
}

.border-glow {
    position: relative;
    transition: all var(--transition-smooth);
}

.border-glow:hover {
    box-shadow: var(--shadow-xl), var(--border-glow-gold);
    border-color: rgba(245, 158, 11, 0.5) !important;
}

.border-glow-teal:hover {
    box-shadow: var(--shadow-xl), var(--border-glow-teal);
    border-color: rgba(13, 148, 136, 0.5) !important;
}

.inner-stroke-glow {
    box-shadow: inset 0 1.5px 1.5px 0 rgba(255, 255, 255, 0.95), inset 0 -1px 1px 0 rgba(15, 23, 42, 0.05) !important;
}

/* 7. Responsividade Total Mobile (Stacking Perfeito < 768px) */
@media (max-width: 991.98px) {
    .bento-grid {
        grid-template-columns: repeat(6, 1fr);
        gap: 1.25rem;
    }
    .bento-card-hero {
        grid-column: span 6;
        grid-row: auto;
    }
    .bento-card-tall {
        grid-column: span 6;
        grid-row: auto;
    }
    .bento-card-wide {
        grid-column: span 6;
        grid-row: auto;
    }
    .bento-card-wide-8 {
        grid-column: span 6;
        grid-row: auto;
    }
    .bento-card {
        grid-column: span 3;
        grid-row: auto;
    }
    .bento-span-3, .bento-span-4, .bento-span-5, .bento-span-6, 
    .bento-span-7, .bento-span-8, .bento-span-9, .bento-span-12 {
        grid-column: span 6;
        grid-row: auto;
    }
}

@media (max-width: 767.98px) {
    .bento-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 1rem !important;
        width: 100% !important;
    }
    .bento-card, 
    .bento-card-hero, 
    .bento-card-tall, 
    .bento-card-wide,
    .bento-card-wide-8,
    .bento-card-full,
    .bento-span-3, .bento-span-4, .bento-span-5, .bento-span-6, 
    .bento-span-7, .bento-span-8, .bento-span-9, .bento-span-12 {
        grid-column: span 1 !important;
        grid-row: auto !important;
        width: 100% !important;
        min-height: auto !important;
        padding: 1.5rem 1.25rem !important;
        border-radius: 20px !important;
    }
    @media (hover: none) {
        .bento-card:hover {
            transform: none !important;
        }
    }
}

/* =========================================================
   BENTO GRID 2.0 & SERVICE CARDS MASTER DEFINITIONS
   ========================================================= */

.bento-grid-v2 {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1.5rem;
    align-items: stretch;
    width: 100%;
}

.bento-card-v2 {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #FFFFFF;
    border-radius: var(--radius-bento, 24px);
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 4px 20px -4px rgba(10, 25, 47, 0.05);
    padding: 2.25rem;
    overflow: hidden;
    transition: transform var(--transition-bounce), box-shadow var(--transition-smooth), border-color var(--transition-fast);
}

.bento-card-v2:hover {
    transform: translateY(-6px) scale(1.008);
    box-shadow: 0 24px 50px -12px rgba(10, 25, 47, 0.14);
    border-color: rgba(245, 158, 11, 0.4);
}

.bento-card-v2.bento-hero { grid-column: span 8; }
.bento-card-v2.bento-tall-dark { grid-column: span 4; }
.bento-card-v2.bento-wide { grid-column: span 6; }
.bento-card-v2.bento-standard { grid-column: span 4; }

.service-card-v2 {
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 4px 20px -4px rgba(10, 25, 47, 0.05);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    overflow: hidden;
    transition: transform var(--transition-bounce), box-shadow var(--transition-smooth), border-color var(--transition-fast);
}

.service-card-v2:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 45px -12px rgba(10, 25, 47, 0.16);
    border-color: rgba(245, 165, 36, 0.35);
}

.fleet-tabs-nav {
    display: inline-flex;
    background: #F1F5F9;
    padding: 0.35rem;
    border-radius: var(--radius-full);
    gap: 0.35rem;
}

.fleet-tab-btn {
    border: none;
    background: transparent;
    color: #64748B;
    font-size: 0.88rem;
    font-weight: 700;
    padding: 0.65rem 1.4rem;
    border-radius: var(--radius-full);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.fleet-tab-btn.active {
    background: #0A192F;
    color: #FFFFFF;
    box-shadow: 0 4px 14px -2px rgba(10, 25, 47, 0.3);
}

.cnh-step-card-v2 {
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 4px 18px -4px rgba(10, 25, 47, 0.05);
    padding: 2rem 1.5rem;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform var(--transition-bounce), box-shadow var(--transition-smooth);
}

.cnh-step-card-v2:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px -12px rgba(10, 25, 47, 0.14);
}

/* Acessibilidade: Skip Link (pular para o conteúdo) */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 2000;
    background: #0A192F;
    color: #FFF;
    padding: 0.75rem 1.5rem;
    border-radius: 0 0 12px 0;
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
}
.skip-link:focus {
    left: 0;
    color: #FFF;
}

/* ==========================================================================
   FAQ & DÚVIDAS FREQUENTES: BOTÕES TÁTEIS, CATEGORIAS & TAGS
   ========================================================================== */
.faq-category-pills-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.faq-category-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.15rem;
    background: #FFFFFF;
    color: #1A1A1A;
    border: 1.5px solid rgba(26, 26, 26, 0.12);
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.faq-category-pill:hover {
    background: #FFFBEB;
    border-color: #F5B301;
    color: #1A1A1A;
    transform: translateY(-1px);
}

.faq-category-pill.active {
    background: #1A1A1A;
    color: #FFFFFF !important;
    border-color: #1A1A1A;
    box-shadow: 0 4px 14px rgba(26, 26, 26, 0.25);
}

.faq-category-pill.active i {
    color: #F5B301;
}

.faq-category-pill .category-pill-counter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.15rem 0.55rem;
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: 9999px;
    background: rgba(26, 26, 26, 0.08);
    color: #1A1A1A;
}

.faq-category-pill.active .category-pill-counter {
    background: #F5B301;
    color: #1A1A1A;
}

/* FAQ Tags Rápidas de Busca Popular */
.faq-quick-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    background: #F8FAFC;
    color: #334155;
    border: 1px solid rgba(26, 26, 26, 0.08);
    border-radius: 9999px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.faq-quick-tag:hover {
    background: #FFFBEB;
    border-color: #F5B301;
    color: #1A1A1A;
    transform: scale(1.03);
}

.faq-input-group {
    border-radius: 16px;
    overflow: hidden;
    border: 1.5px solid rgba(26, 26, 26, 0.12);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.faq-input-group:focus-within {
    border-color: #F5B301;
    box-shadow: 0 0 0 4px rgba(245, 179, 1, 0.15);
}

.btn-faq-clear {
    background: none;
    border: none;
    color: #94A3B8;
    cursor: pointer;
    font-size: 1rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
}

.btn-faq-clear:hover {
    color: #EF4444;
}

.faq-kbd-badge {
    background: #F1F5F9;
    color: #64748B;
    border: 1px solid #CBD5E1;
    border-radius: 6px;
    padding: 0.1rem 0.45rem;
    font-size: 0.75rem;
    font-family: monospace;
}