*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:'Inter',sans-serif;
    background:#f6f6f6;
    color:#13233b;
    overflow-x:hidden;
}

.container{
    width:90%;
    max-width:1400px;
    margin:auto;
}


/* =====================================================
   HERO
===================================================== */

.hero{
    min-height:700px;
    height:min(780px, 86vh);
    background:url('../HeroImagens/HeroHome.png') center/cover no-repeat;
    position:relative;
}

.overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        to right,
        rgba(0,0,0,0.70),
        rgba(0,0,0,0.10)
    );
}

.hero-content{
    position:relative;
    z-index:2;
    height:100%;
    display:flex;
    align-items:center;
}

.hero-text{
    max-width:650px;
    color:white;
}

.hero-text h1{
    font-size:clamp(48px,5vw,70px);
    line-height:1.04;
    margin-bottom:30px;
    font-weight:800;
}

.hero-text p{
    max-width:610px;
    font-size:clamp(18px,1.6vw,24px);
    line-height:1.65;
    color:#f2f2f2;
}

.hero-line{
    width:140px;
    height:4px;
    background:#16c2b6;
    margin-top:40px;
}


/* =====================================================
   3 CARDS PRINCIPAIS
===================================================== */

.cards-section{
    margin-top:-60px;
    position:relative;
    z-index:5;
}

.cards-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}

.feature-card{
    background:white;
    border-radius:15px;

    /* REDUZIDO */
    padding:22px 22px 20px;

    text-align:center;

    box-shadow:
        0 12px 28px rgba(0,0,0,0.07);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.feature-card:hover{
    transform:translateY(-4px);

    box-shadow:
        0 16px 32px rgba(0,0,0,0.10);
}

.feature-card img{
    width:65px;
    height:auto;
    margin-bottom:10px;
}

.feature-card h3{
    font-size:17px;
    margin-bottom:10px;
    line-height:1.3;
}

.feature-card p{
    color:#666;

    /* REDUZIDO */
    font-size:14px;
    line-height:1.6;

    margin:0 auto;
    max-width:320px;
}


/* =====================================================
   BOTÃO SAIBA MAIS
===================================================== */

.btn-saiba-mais{
    display:inline-block;

    /* REDUZIDO */
    padding:10px 18px;

    background:#dfe8de;
    color:#006b57;

    text-decoration:none;

    font-size:11px;
    font-weight:600;

    border-radius:50px;

    transition:0.3s ease;

    margin-top:13px;
}

.btn-saiba-mais:hover{
    background:#cfdccc;
}


/* =====================================================
   ÍCONES
===================================================== */

.feature-icon{
    width:70px;
    height:70px;

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    margin:auto;
    margin-bottom:18px;

    font-size:30px;
}

.purple{
    background:#efe6ff;
    color:#8a72db;
}

.green{
    background:#dffbf7;
    color:#17b9ad;
}


/* =====================================================
   ESTATÍSTICAS
===================================================== */

.stats{
    padding:50px 0 30px;
}

.stats-grid{
    background:white;

    border-radius:20px;

    padding:42px;

    display:grid;
    grid-template-columns:repeat(4,1fr);

    gap:20px;
    text-align:center;

    box-shadow:
        0 10px 30px rgba(0,0,0,0.04);
}

.stat-item span{
    font-size:48px;
    font-weight:800;
    color:#18c3b6;
}

.stat-item p{
    margin-top:10px;
    font-size:15px;
}


/* =====================================================
   TRATAMENTOS
===================================================== */

.treatments{
    padding:40px 0 50px;
}

.title-row{
    display:flex;

    justify-content:space-between;
    align-items:flex-end;

    gap:50px;

    margin-bottom:50px;
}

.title-row small{
    color:#57A695;

    letter-spacing:4px;

    font-weight:700;

    font-size:12px;
}

.title-row h2{
    font-size:clamp(36px,4vw,50px);

    margin-top:15px;

    max-width:750px;

    line-height:1.15;
}

.title-row p{
    max-width:420px;

    line-height:1.8;

    color:#666;

    font-size:15px;
}


/* =====================================================
   GRID DOS 6 CARDS
===================================================== */

.treatments-grid{
    display:grid;

    grid-template-columns:repeat(3,1fr);

    /* REDUZIDO */
    gap:22px;
}


/* =====================================================
   CARDS DE TRATAMENTO
===================================================== */

.treatment-card{
    background:white;

    border-radius:18px;

    overflow:hidden;

    box-shadow:
        0 10px 25px rgba(0,0,0,0.06);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;

    text-decoration: none;
    color: inherit;
    display: block;
}

.treatment-card:hover{
    transform:translateY(-5px);

    box-shadow:
        0 15px 30px rgba(0,0,0,0.10);
}


/* IMAGEM REDUZIDA */

.treatment-card img{
    width:100%;

    /* ANTES: 260px */
    height:190px;

    object-fit:cover;

    display:block;
}


/* CONTEÚDO REDUZIDO */

.treatment-content{

    /* ANTES: 28px */
    padding:20px;
}

.treatment-content h3{

    /* ANTES: 28px */
    font-size:21px;

    line-height:1.25;

    margin-bottom:8px;
}

.treatment-content p{
    color:#666;

    font-size:14px;

    line-height:1.5;
}


/* =====================================================
   RESPONSIVIDADE
===================================================== */

@media(max-width:1200px){


    .hero-text h1{
        font-size:56px;
    }

    .cards-grid,
    .stats-grid,
    .treatments-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .title-row{
        display:grid;
        grid-template-columns:1fr;
    }

}


/* =====================================================
   TABLET / CELULAR
===================================================== */

@media(max-width:700px){

    .hero{
        min-height:620px;
        height:auto;
        padding:130px 0 90px;
        background-position:58% center;
    }

    .hero-text h1{
        font-size:42px;
        line-height:1.08;
    }

    .hero-text p{
        font-size:18px;
    }

    .cards-section{
        margin-top:-30px;
    }

    .cards-grid,
    .stats-grid,
    .treatments-grid{
        grid-template-columns:1fr;
    }

    .feature-card{
        padding:22px 20px;
    }

    .stats{
        padding:50px 0;
    }

    .stats-grid{
        padding:30px;
    }

    .stat-item{
        text-align:center;
    }

    .title-row h2{
        font-size:36px;
    }

    .title-row{
        gap:25px;
        margin-bottom:35px;
    }

    .treatments{
        padding:65px 0;
    }

    .treatment-card img{
        height:200px;
    }

}


/* =====================================================
   FOOTER
===================================================== */

.footer{
    background:#13233b;

    color:#d1d5db;

    padding:90px 0 0;

    font-size:15px;
}

.footer-grid{
    display:grid;

    grid-template-columns:
        1.2fr 1fr 1fr 1fr;

    gap:60px;

    padding-bottom:60px;
}

.footer-brand h3{
    margin-top:25px;

    font-size:22px;

    line-height:1.4;

    font-weight:600;

    color:#ffffff;
}

.footer-logo{
    width:220px;

    filter:brightness(0) invert(1);
}

.footer-contact{
    margin-top:30px;
}

.footer-contact p{
    margin-bottom:15px;

    font-size:16px;

    color:#e5e7eb;

    display:flex;

    align-items:center;

    gap:10px;
}

.footer-contact-icon{
    color:#16c2b6;

    flex-shrink:0;
}

.socials{
    margin-top:30px;

    display:flex;

    gap:12px;
}

.socials a{
    width:44px;
    height:44px;

    border-radius:50%;

    background:rgba(255,255,255,0.08);

    display:flex;

    justify-content:center;
    align-items:center;

    color:#ffffff;

    transition:
        all 0.3s cubic-bezier(
            0.4,
            0,
            0.2,
            1
        );

    text-decoration:none;
}

.socials a:hover{
    background:#16c2b6;

    color:#13233b;

    transform:translateY(-3px);
}

.socials svg{
    transition:transform 0.3s;
}

.socials a:hover svg{
    transform:scale(1.1);
}

.footer-column{
    display:flex;

    flex-direction:column;
}

.footer-column h4{
    font-size:16px;

    text-transform:uppercase;

    letter-spacing:1px;

    margin-bottom:20px;

    color:#16c2b6;

    font-weight:700;
}

.footer-column a{
    text-decoration:none;

    color:#9ca3af;

    margin-bottom:12px;

    font-size:15px;

    transition:
        color 0.25s ease;

    line-height:1.4;
}

.footer-column a:hover{
    color:#ffffff;

    padding-left:2px;
}

.space-top{
    margin-top:35px;
}

.footer-bottom{
    border-top:
        1px solid rgba(
            255,
            255,
            255,
            0.1
        );

    padding:30px 0;

    margin-top:20px;

    color:#9ca3af;

    font-size:14px;
}

.footer-bottom-flex{
    display:flex;

    justify-content:space-between;

    align-items:center;

    flex-wrap:wrap;

    gap:20px;
}

.footer-bottom-links{
    display:flex;

    gap:25px;
}

.footer-bottom-links a{
    color:#9ca3af;

    text-decoration:none;

    transition:
        color 0.25s ease;
}

.footer-bottom-links a:hover{
    color:#ffffff;
}


/* =====================================================
   FOOTER RESPONSIVO
===================================================== */

@media(max-width:1100px){

    .footer-grid{
        grid-template-columns:1fr;

        gap:40px;

        padding-bottom:40px;
    }

    .footer-bottom-flex{
        flex-direction:column;

        align-items:flex-start;
    }

}

/* Item de rodapé ainda sem página própria */
.footer-link-disabled{
    color:inherit;
    font:inherit;
}


/* =========================================================
   PADRÃO TIPOGRÁFICO GLOBAL — 2026-09
   Hierarquia unificada em todo o site.
========================================================= */
body, button, input, textarea, select {
    font-family: 'Inter', sans-serif !important;
}

/* Título principal / Hero */
h1,
.hero h1,
.hero-content h1,
.hero-text h1,
.hero-texto h1 {
    font-size: clamp(42px, 4.6vw, 60px) !important;
    line-height: 1.08 !important;
    font-weight: 700 !important;
}

/* Títulos de seção */
section h2,
.section-title,
.titulo-secao {
    font-size: clamp(28px, 3vw, 38px) !important;
    line-height: 1.18 !important;
    font-weight: 700 !important;
}

/* Subtítulos / títulos de cards */
section h3,
.card h3 {
    font-size: 22px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}

/* Texto corrido */
section p,
section li {
    font-size: 16px !important;
    line-height: 1.7 !important;
}

/* Texto de apoio do Hero */
.hero p,
.hero-content p,
.hero-text p,
.hero-texto p {
    font-size: 18px !important;
    line-height: 1.65 !important;
}

@media (max-width: 768px) {
    h1, .hero h1, .hero-content h1, .hero-text h1, .hero-texto h1 {
        font-size: clamp(34px, 9vw, 44px) !important;
    }
    section h2, .section-title, .titulo-secao {
        font-size: 28px !important;
    }
    section h3, .card h3 {
        font-size: 20px !important;
    }
    section p, section li {
        font-size: 16px !important;
    }
    .hero p, .hero-content p, .hero-text p, .hero-texto p {
        font-size: 17px !important;
    }
}


/* Tipografia compacta dos cards da Home */
:is(.card,[class*="-card"],[class*="card-"]) :is(h2,h3,h4){
    font-size:1.08rem !important;
    line-height:1.3 !important;
}
:is(.card,[class*="-card"],[class*="card-"]) :is(h5,h6,.subtitulo,.subtitle){
    font-size:.88rem !important;
    line-height:1.4 !important;
}
:is(.card,[class*="-card"],[class*="card-"]) p{
    font-size:.94rem !important;
    line-height:1.55 !important;
}
@media (max-width:768px){
    :is(.card,[class*="-card"],[class*="card-"]) :is(h2,h3,h4){font-size:1rem !important;}
    :is(.card,[class*="-card"],[class*="card-"]) p{font-size:.9rem !important;}
}