/* ============================================
   STYLE.CSS — Duplafor Cuidados Automotivos
   Estrutura: Base → Layout → Componentes → Seções → Utilitários → Responsivo
   ============================================ */

/* ========== 1. BASE / VARIÁVEIS ========== */
:root{
    /* Neutros */
    --cor-branco: #ffffff;
    --cor-preto: #0b0f19;
    --cor-texto: #1f2937;
    --cor-texto-claro: #6b7280;
    --cor-borda: rgba(17, 24, 39, 0.12);

    /* Tipografia */
    --fonte-principal: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    --fonte-titulo: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    --fonte-base: 16px;
    --linha-altura: 1.65;

    /* Layout */
    --container-max: 1200px;
    --container-padding: 20px;
    --navbar-height: 74px;

    /* Espaçamentos */
    --xs: 8px;
    --sm: 16px;
    --md: 24px;
    --lg: 40px;
    --xl: 60px;
    --xxl: 80px;

    /* Sombras */
    --sombra-leve: 0 2px 8px rgba(0,0,0,0.08);
    --sombra-media: 0 6px 18px rgba(0,0,0,0.12);
    --sombra-forte: 0 10px 28px rgba(0,0,0,0.16);

    /* Transições */
    --transicao: all .3s ease;
    --transicao-rapida: all .15s ease;

    /* Bordas */
    --radius: 10px;
    --radius-lg: 14px;
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; font-size: var(--fonte-base); }
body{
    font-family: var(--fonte-principal);
    color: var(--cor-texto);
    line-height: var(--linha-altura);
    background: var(--cor-branco);
    overflow-x:hidden;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; transition: var(--transicao); }
button{ font-family:inherit; }
input, textarea{ font-family:inherit; font-size: 1rem; }

/* ========== 2. UTILITÁRIOS ========== */
.container{
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}
.text-center{ text-align:center; }
.mt-md{ margin-top: var(--md); }
.mb-md{ margin-bottom: var(--md); }
.sr-only{
    position:absolute !important;
    width:1px;height:1px;
    padding:0;margin:-1px;
    overflow:hidden;clip:rect(0,0,0,0);
    white-space:nowrap;border:0;
}

/* ========== 3. TIPOGRAFIA ========== */
h1,h2,h3,h4{
    font-family: var(--fonte-titulo);
    line-height: 1.15;
    color: var(--cor-preto);
}
p{ margin-bottom: var(--sm); color: var(--cor-texto); }
.section-head{ margin-bottom: 44px; }
.section-title{
    font-size: 2.25rem;
    letter-spacing: -0.02em;
    margin-bottom: 12px;
}
.section-title::after{
    content:'';
    display:block;
    width: 62px;
    height: 4px;
    margin: 14px auto 0;
    border-radius: 99px;
    background: linear-gradient(90deg, var(--cor-primaria), var(--cor-destaque));
}
.section-subtitle{
    max-width: 760px;
    margin: 0 auto;
    color: var(--cor-texto-claro);
    font-size: 1.06rem;
}

/* ========== 4. BOTÕES ========== */
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap: 10px;
    padding: 12px 22px;
    border-radius: 999px;
    font-weight: 600;
    border: 2px solid transparent;
    cursor:pointer;
    user-select:none;
    transition: var(--transicao);
    white-space: nowrap;
}
.btn-primary{
    background: linear-gradient(135deg, var(--cor-primaria), #b50322);
    color: var(--cor-branco);
    box-shadow: var(--sombra-media);
}
.btn-primary:hover{ transform: translateY(-2px); box-shadow: var(--sombra-forte); }
.btn-outline{
    background: transparent;
    color: var(--cor-preto);
    border-color: rgba(17,24,39,0.18);
}
.btn-outline:hover{
    border-color: rgba(17,24,39,0.30);
    background: rgba(17,24,39,0.04);
}

/* ========== 5. NAVBAR ========== */
.navbar{
    position: fixed;
    top:0;left:0;right:0;
    height: var(--navbar-height);
    z-index: 1000;
    background: rgba(255,255,255,0.92);
    backdrop-filter: saturate(160%) blur(10px);
    border-bottom: 1px solid rgba(17,24,39,0.06);
    transition: var(--transicao);
}
.navbar.scrolled{
    background: rgba(255,255,255,0.98);
    box-shadow: var(--sombra-leve);
}
.nav-wrapper{
    height: var(--navbar-height);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 18px;
}
.logo{
    display:flex;
    align-items:center;
    gap: 10px;
    min-width: 240px;
    flex-shrink:0;
}
.logo-img{ width:44px; height:44px; }
.logo-text{
    font-family: var(--fonte-titulo);
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.2;
}
.nav-menu{
    display:flex;
    align-items:center;
    justify-content:center;
    gap: 22px;
    list-style:none;
    flex: 1;
}
.nav-link{
    font-weight: 600;
    color: rgba(17,24,39,0.82);
    position:relative;
    padding: 8px 0;
}
.nav-link::after{
    content:'';
    position:absolute;
    left:0; bottom:2px;
    width:0;
    height: 2px;
    background: linear-gradient(90deg, var(--cor-primaria), var(--cor-destaque));
    border-radius: 99px;
    transition: var(--transicao);
}
.nav-link:hover{ color: var(--cor-preto); }
.nav-link:hover::after,
.nav-link.active::after{ width:100%; }
.btn-cta{ padding: 10px 18px; }
.btn-cta-desktop{ display:inline-flex; }
.nav-cta{ display:none; }

.hamburger{
    display:none;
    width: 44px; height: 44px;
    border-radius: 12px;
    border: 1px solid rgba(17,24,39,0.12);
    background: rgba(255,255,255,0.75);
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap: 5px;
}
.hamburger .bar{
    width: 22px;
    height: 2px;
    background: rgba(17,24,39,0.88);
    border-radius: 99px;
    transition: var(--transicao);
}
.hamburger.active .bar:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.hamburger.active .bar:nth-child(2){ opacity: 0; transform: scaleX(0.5); }
.hamburger.active .bar:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

/* Compensar navbar fixa */
#inicio{ padding-top: calc(var(--navbar-height) + 16px); }

/* ========== 6. SEÇÕES (BASE) ========== */
section{ padding: var(--xxl) 0; }
.servicos-section,
.faq-section{ background: var(--cor-clara); }

/* ========== 7. HERO (banner proporcional) ========== */
.hero{
    min-height: 100vh;
    max-height: 800px; /* obrigatório */
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    background-image: url("../images/banner.svg");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    overflow:hidden;
}
.hero-overlay{
    position:absolute;
    inset:0;
    background: linear-gradient(90deg, rgba(15, 23, 42, 0.82) 0%, rgba(15, 23, 42, 0.55) 55%, rgba(15, 23, 42, 0.35) 100%);
}
.hero-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 36px;
    align-items:center;
}
.hero-content{ color: var(--cor-branco); }
.hero-kicker{
    display:inline-flex;
    align-items:center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.18);
    margin-bottom: 16px;
    color: rgba(255,255,255,0.90);
    font-weight: 600;
    font-size: .95rem;
}
.hero-title{
    font-size: 3rem;
    color: var(--cor-branco);
    letter-spacing: -0.02em;
    margin-bottom: 12px;
}
.hero-subtitle{
    color: rgba(255,255,255,0.90);
    font-size: 1.1rem;
    max-width: 640px;
}
.hero-actions{
    display:flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 20px;
}
.hero-actions .btn-outline{
    color: rgba(255,255,255,0.92);
    border-color: rgba(255,255,255,0.28);
    background: rgba(255,255,255,0.06);
}
.hero-actions .btn-outline:hover{
    border-color: rgba(255,255,255,0.40);
    background: rgba(255,255,255,0.10);
}
.hero-points{
    list-style:none;
    display:grid;
    gap: 8px;
    margin-top: 22px;
    color: rgba(255,255,255,0.88);
    font-weight: 600;
}
.hero-points i{ color: var(--cor-destaque); }

.hero-card{
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(255,255,255,0.55);
    border-radius: var(--radius-lg);
    box-shadow: var(--sombra-forte);
    padding: 22px 22px 18px;
}
.hero-card h3{
    font-size: 1.25rem;
    margin-bottom: 8px;
}
.hero-card-text{ color: var(--cor-texto-claro); margin-bottom: 14px; }
.hero-card-links{ display:grid; gap: 10px; }
.hero-link{
    display:flex;
    align-items:center;
    gap: 10px;
    padding: 12px 12px;
    border-radius: 12px;
    background: rgba(17,24,39,0.03);
    border: 1px solid rgba(17,24,39,0.08);
    font-weight: 600;
}
.hero-link i{ color: var(--cor-primaria); }
.hero-card-badges{
    margin-top: 14px;
    display:flex;
    flex-wrap: wrap;
    gap: 10px;
}
.hero-card-badges span{
    display:inline-flex;
    align-items:center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 999px;
    background: rgba(245, 158, 11, 0.10);
    border: 1px solid rgba(245, 158, 11, 0.28);
    color: rgba(17,24,39,0.85);
    font-weight: 700;
    font-size: .92rem;
}
.hero-card-badges i{ color: var(--cor-destaque); }

/* ========== 8. SOBRE ========== */
.sobre-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items:center;
}
.sobre-texto p{ color: rgba(17,24,39,0.86); }
.sobre-missao{
    margin-top: 18px;
    padding: 16px 18px;
    border-radius: var(--radius);
    border: 1px solid var(--cor-borda);
    background: rgba(17,24,39,0.02);
}
.sobre-missao h3{
    margin-bottom: 8px;
    font-size: 1.15rem;
}
.sobre-imagem{
    position:relative;
    width:100%;
}
.sobre-imagem img{
    width:100%;
    height:auto;
    max-height: 500px; /* obrigatório */
    object-fit: cover; /* obrigatório */
    object-position:center; /* obrigatório */
    border-radius: var(--radius-lg);
    box-shadow: var(--sombra-forte);
    border: 1px solid rgba(17,24,39,0.10);
}

/* ========== 9. SERVIÇOS ========== */
.servicos-grid{
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 22px;
    margin-top: 40px;
}
.servico-card{
    background: var(--cor-branco);
    border-radius: var(--radius-lg);
    padding: 24px 22px;
    box-shadow: var(--sombra-media);
    border: 1px solid rgba(17,24,39,0.08);
    border-top: 4px solid var(--cor-primaria);
    transition: var(--transicao);
}
.servico-card:hover{
    transform: translateY(-5px);
    box-shadow: var(--sombra-forte);
    border-top-color: var(--cor-destaque);
}
.servico-icone{
    width: 52px;height:52px;
    border-radius: 14px;
    display:flex;
    align-items:center;
    justify-content:center;
    background: rgba(217, 4, 41, 0.10);
    color: var(--cor-primaria);
    margin-bottom: 14px;
    font-size: 1.35rem;
}
.servico-titulo{ font-size: 1.2rem; margin-bottom: 8px; }
.servico-desc{ color: var(--cor-texto-claro); margin-bottom: 0; }

/* ========== 10. DIFERENCIAIS ========== */
.valores-grid{
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 18px;
    margin-top: 36px;
}
.valor-card{
    background: var(--cor-branco);
    border-radius: var(--radius-lg);
    padding: 20px 20px;
    border: 1px solid rgba(17,24,39,0.08);
    box-shadow: var(--sombra-leve);
    transition: var(--transicao);
}
.valor-card:hover{ transform: translateY(-4px); box-shadow: var(--sombra-media); }
.valor-icone{
    width: 48px;height:48px;
    border-radius: 14px;
    display:flex;
    align-items:center;
    justify-content:center;
    background: rgba(245, 158, 11, 0.14);
    color: rgba(17,24,39,0.92);
    margin-bottom: 12px;
}
.valor-titulo{ font-size: 1.05rem; margin-bottom: 6px; }
.valor-desc{ color: var(--cor-texto-claro); margin-bottom: 0; }

/* ========== 11. ESTATÍSTICAS ========== */
.estatisticas-section{
    background: linear-gradient(135deg, rgba(31,41,55,1) 0%, rgba(15,23,42,1) 55%, rgba(31,41,55,1) 100%);
    color: var(--cor-branco);
}
.stats-grid{
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 26px;
    text-align:center;
}
.stat-item{
    padding: 20px 16px;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.06);
}
.stat-numero{
    font-family: var(--fonte-titulo);
    font-weight: 800;
    font-size: 2.6rem;
    letter-spacing: -0.02em;
    color: var(--cor-destaque);
}
.stat-label{
    margin-top: 6px;
    color: rgba(255,255,255,0.88);
    font-weight: 600;
}

/* ========== 12. DEPOIMENTOS (carrossel) ========== */
.depoimentos-carousel{
    position: relative;
    max-width: 860px;
    margin: 0 auto;
    padding: 0 60px;
}
.depoimentos-wrapper{
    position: relative;
    min-height: 320px;
}
.depoimento-card{
    display:none;
    text-align:center;
    padding: 34px 28px;
    background: var(--cor-branco);
    border-radius: var(--radius-lg);
    border: 1px solid rgba(17,24,39,0.08);
    box-shadow: var(--sombra-media);
}
.depoimento-card.active{ display:block; animation: fadeIn .45s ease; }
.depoimento-texto{
    font-size: 1.05rem;
    font-style: italic;
    color: rgba(17,24,39,0.85);
    line-height: 1.75;
    margin-bottom: 18px;
}
.depoimento-nome{ color: rgba(17,24,39,0.92); }

/* Avatares - sempre redondos */
.depoimento-avatar{
    width: 86px;
    height: 86px;
    margin: 0 auto 18px;
    border-radius: 50%;
    overflow:hidden;
    border: 4px solid rgba(245, 158, 11, 0.90);
    box-shadow: 0 6px 16px rgba(0,0,0,0.18);
}
.depoimento-avatar img{
    width:100%;
    height:100%;
    object-fit: cover;
    object-position:center;
}

.carousel-btn{
    position:absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;height:44px;
    border-radius: 50%;
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(17,24,39,0.10);
    box-shadow: var(--sombra-leve);
    display:flex;
    align-items:center;
    justify-content:center;
    color: rgba(17,24,39,0.85);
    transition: var(--transicao);
}
.carousel-btn:hover{
    transform: translateY(-50%) scale(1.05);
    box-shadow: var(--sombra-media);
}
.carousel-prev{ left: 8px; }
.carousel-next{ right: 8px; }
.carousel-dots{
    margin-top: 16px;
    display:flex;
    justify-content:center;
    gap: 10px;
}
.carousel-dot{
    width: 10px;
    height: 10px;
    border-radius: 999px;
    border: 0;
    background: rgba(17,24,39,0.20);
}
.carousel-dot.active{
    background: linear-gradient(90deg, var(--cor-primaria), var(--cor-destaque));
    width: 22px;
}

@keyframes fadeIn{
    from{ opacity:0; transform: translateY(10px); }
    to{ opacity:1; transform: translateY(0); }
}

/* ========== 13. FAQ ========== */
.faq-container{
    max-width: 860px;
    margin: 0 auto;
}
.faq-item{
    border: 1px solid rgba(17,24,39,0.12);
    border-radius: var(--radius);
    background: var(--cor-branco);
    overflow:hidden;
    margin-bottom: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
.faq-question{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 12px;
    padding: 18px 18px;
    text-align:left;
    font-weight: 700;
    font-size: 1.02rem;
    color: rgba(17,24,39,0.92);
    background: transparent;
    border:0;
    cursor:pointer;
}
.faq-question i{ transition: var(--transicao); color: rgba(17,24,39,0.55); }
.faq-item.active .faq-question i{ transform: rotate(180deg); }
.faq-answer{
    max-height: 0;
    overflow:hidden;
    transition: max-height .3s ease;
}
.faq-answer p{
    padding: 0 18px 18px;
    margin: 0;
    color: var(--cor-texto-claro);
}

/* ========== 14. CONTATO ========== */
.contato-grid{
    display:grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 30px;
    align-items:start;
    margin-top: 34px;
}
.contato-info{
    display:grid;
    gap: 16px;
}
.info-card{
    background: var(--cor-branco);
    border: 1px solid rgba(17,24,39,0.08);
    border-radius: var(--radius-lg);
    padding: 18px 18px;
    box-shadow: var(--sombra-leve);
}
.info-card i{
    color: var(--cor-primaria);
    font-size: 1.15rem;
    margin-bottom: 10px;
}
.info-card h4{
    font-size: 1.05rem;
    margin-bottom: 6px;
}
.info-card p{ margin-bottom: 6px; color: rgba(17,24,39,0.82); }
.info-muted{
    font-size: .95rem;
    color: var(--cor-texto-claro);
}
.info-muted a{
    color: rgba(17,24,39,0.88);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.contato-form{
    background: var(--cor-branco);
    border: 1px solid rgba(17,24,39,0.08);
    border-radius: var(--radius-lg);
    padding: 22px 22px;
    box-shadow: var(--sombra-media);
}
.form-group{ margin-bottom: 14px; }
.form-group label{
    display:block;
    font-weight: 700;
    margin-bottom: 6px;
    color: rgba(17,24,39,0.86);
}
.form-group input,
.form-group textarea{
    width:100%;
    padding: 12px 12px;
    border: 1px solid rgba(17,24,39,0.18);
    border-radius: 12px;
    background: rgba(17,24,39,0.02);
    outline:none;
    transition: var(--transicao);
}
.form-group input:focus,
.form-group textarea:focus{
    border-color: rgba(245, 158, 11, 0.60);
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.12);
    background: var(--cor-branco);
}
.form-group input.error,
.form-group textarea.error{ border-color: rgba(217, 4, 41, 0.75); }
.field-error{
    margin-top: 6px;
    font-size: .95rem;
    color: rgba(217, 4, 41, 0.92);
}
.hp-field{
    position:absolute;
    left:-10000px;
    width:1px;height:1px;
    opacity:0;
    pointer-events:none;
}
.form-status{
    margin-top: 14px;
    border-radius: 12px;
    padding: 12px 14px;
    display:none;
    font-weight: 600;
}
.form-status.show{ display:block; }
.form-status.success{
    background: rgba(16, 185, 129, 0.14);
    border: 1px solid rgba(16, 185, 129, 0.28);
    color: rgba(5, 150, 105, 1);
}
.form-status.error{
    background: rgba(217, 4, 41, 0.10);
    border: 1px solid rgba(217, 4, 41, 0.20);
    color: rgba(217, 4, 41, 0.92);
}

/* ========== 15. FOOTER ========== */
.footer{
    background: linear-gradient(135deg, rgba(17,24,39,1) 0%, rgba(15,23,42,1) 60%, rgba(17,24,39,1) 100%);
    color: rgba(255,255,255,0.92);
    padding: 60px 0 26px;
    margin-top: 70px;
}
.footer-grid{
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 28px;
    margin-bottom: 26px;
}
.footer-logo{
    display:flex;
    align-items:center;
    gap: 12px;
    font-family: var(--fonte-titulo);
    font-weight: 800;
    font-size: 1.06rem;
    margin-bottom: 14px;
}
.footer-logo img{
    width: 40px;
    height: 40px;
    filter: drop-shadow(0 6px 14px rgba(0,0,0,0.35));
}
.footer-desc{ color: rgba(255,255,255,0.78); }
.footer-title{
    color: rgba(255,255,255,0.92);
    font-weight: 800;
    margin-bottom: 12px;
    font-size: 1.02rem;
}
.footer-links li{ margin-bottom: 10px; }
.footer-links a{
    color: rgba(255,255,255,0.78);
}
.footer-links a:hover{ color: var(--cor-destaque); padding-left: 4px; }
.footer-contact{ list-style:none; }
.footer-contact li{
    display:flex;
    gap: 10px;
    margin-bottom: 12px;
    color: rgba(255,255,255,0.78);
}
.footer-contact i{ color: var(--cor-destaque); margin-top: 3px; }
.footer-contact a:hover{ color: var(--cor-destaque); }
.footer-map{ margin-top: 8px; border-color: rgba(255,255,255,0.22); color: rgba(255,255,255,0.90); }
.footer-map:hover{ border-color: rgba(255,255,255,0.36); }

.footer-social{ display:flex; gap: 10px; flex-wrap: wrap; }
.social-link{
    width: 40px;height:40px;
    border-radius: 50%;
    background: rgba(255,255,255,0.10);
    display:flex;
    align-items:center;
    justify-content:center;
    color: rgba(255,255,255,0.90);
    transition: var(--transicao);
}
.social-link:hover{
    transform: translateY(-3px);
    background: rgba(245, 158, 11, 0.22);
    color: var(--cor-destaque);
}
.footer-newsletter{
    display:flex;
    gap: 8px;
    margin-top: 12px;
}
.footer-newsletter input{
    flex:1;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.06);
    color: rgba(255,255,255,0.92);
}
.footer-newsletter input::placeholder{ color: rgba(255,255,255,0.55); }
.footer-newsletter button{
    width: 46px;height: 44px;
    border-radius: 12px;
    background: rgba(245, 158, 11, 0.92);
    border: 0;
    color: rgba(17,24,39,0.92);
}
.footer-newsletter button:hover{ filter: brightness(1.05); }
.footer-divider{
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
    margin: 22px 0 18px;
}
.footer-bottom{
    text-align:center;
    color: rgba(255,255,255,0.68);
    font-size: .95rem;
}
.footer-legal a{ color: rgba(255,255,255,0.75); }
.footer-legal a:hover{ color: var(--cor-destaque); }
.footer-legal span{ margin: 0 8px; opacity: .7; }
.footer-disclaimer{ margin-top: 10px; font-size: .82rem; opacity: .85; }

/* ========== 16. WHATSAPP + SCROLL TOP ========== */
.whatsapp-float{
    position: fixed;
    right: 22px;
    bottom: 22px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #25d366;
    color: #ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow: var(--sombra-forte);
    z-index: 999;
    transition: var(--transicao);
    animation: pulse 2.2s infinite;
}
.whatsapp-float:hover{ transform: scale(1.06); filter: brightness(1.02); }

.scroll-top{
    position: fixed;
    right: 22px;
    bottom: 92px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(17,24,39,0.92);
    color: rgba(255,255,255,0.92);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow: var(--sombra-media);
    opacity:0;
    visibility:hidden;
    transform: translateY(8px);
    transition: var(--transicao);
    z-index: 998;
}
.scroll-top.visible{
    opacity:1;
    visibility:visible;
    transform: translateY(0);
}
.scroll-top:hover{ filter: brightness(1.05); }

@keyframes pulse{
    0%{ box-shadow: 0 0 0 0 rgba(37,211,102,0.65), var(--sombra-forte); }
    70%{ box-shadow: 0 0 0 18px rgba(37,211,102,0.0), var(--sombra-forte); }
    100%{ box-shadow: 0 0 0 0 rgba(37,211,102,0.0), var(--sombra-forte); }
}

/* ========== 17. ANIMAÇÕES AO SCROLL ========== */
.animate-on-scroll{ opacity:0; transform: translateY(16px); }
.animate-on-scroll.animated{ opacity:1; transform: translateY(0); transition: all .55s ease; }

/* ========== 18. PÁGINAS LEGAIS ========== */
.legal-hero{
    padding-top: calc(var(--navbar-height) + 26px);
    padding-bottom: 26px;
    background: radial-gradient(1200px 500px at 10% 0%, rgba(217,4,41,0.12), transparent 55%),
                radial-gradient(900px 500px at 90% 0%, rgba(245,158,11,0.14), transparent 55%),
                linear-gradient(180deg, rgba(17,24,39,0.03), transparent);
    border-bottom: 1px solid rgba(17,24,39,0.06);
}
.legal-hero h1{
    font-size: 2.2rem;
    margin-bottom: 8px;
}
.legal-updated{
    color: var(--cor-texto-claro);
    margin-bottom: 0;
}
.legal-content{
    padding: 30px 0 70px;
}
.legal-content h2{
    font-size: 1.35rem;
    margin-top: 18px;
    margin-bottom: 10px;
}
.legal-content ul{
    padding-left: 18px;
    margin: 10px 0 18px;
    color: rgba(17,24,39,0.86);
}
.legal-content li{ margin-bottom: 8px; }
.legal-content a{
    color: rgba(17,24,39,0.90);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ========== 19. RESPONSIVO ========== */
@media (max-width: 1024px){
    .hero{ max-height: 700px; background-attachment: scroll; }
    .hero-grid{ grid-template-columns: 1fr; }
    .hero-card{ max-width: 520px; }
    .sobre-grid{ grid-template-columns: 1fr; gap: 30px; }
    .contato-grid{ grid-template-columns: 1fr; }
}

@media (max-width: 768px){
    :root{ --container-padding: 16px; --navbar-height: 66px; }
    .logo{ min-width: unset; }
    .logo-text{ font-size: .98rem; }

    .nav-menu{
        position: fixed;
        top: 0;
        right: -110%;
        width: min(320px, 86vw);
        height: 100vh;
        padding: 86px 18px 18px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 12px;
        background: rgba(255,255,255,0.98);
        box-shadow: -10px 0 30px rgba(0,0,0,0.14);
        border-left: 1px solid rgba(17,24,39,0.08);
        transition: right .28s ease;
        z-index: 1000;
    }
    .nav-menu.active{ right: 0; }
    .nav-link{ width:100%; padding: 10px 0; }
    .nav-link::after{ bottom: 4px; }
    .btn-cta-desktop{ display:none; }
    .hamburger{ display:flex; }
    .nav-cta{ display:block; width:100%; margin-top: 6px; }
    .nav-cta .btn{ width:100%; justify-content:center; }

    .depoimentos-carousel{ padding: 0 44px; }
    .carousel-prev{ left: 0; }
    .carousel-next{ right: 0; }
}

@media (max-width: 480px){
    .section-title{ font-size: 1.8rem; }
    .hero{ max-height: 600px; min-height: 70vh; }
    .hero-title{ font-size: 2.15rem; }
    .depoimento-card{ padding: 28px 18px; }
    .whatsapp-float{ width: 58px; height: 58px; right: 16px; bottom: 16px; }
    .scroll-top{ width: 50px; height: 50px; right: 16px; bottom: 88px; }
}