/* ===========================================================================
   PRODUZZA — SITE.CSS v5
   Linguagem inspirada na Apple: preto puro e cinza-claro #F5F5F7,
   Montserrat (fonte da identidade) em semibold com espaçamento justo,
   frase de apoio em cinza dentro do título, uma única cor de destaque
   (o rosa-coral do logo) e muito espaço.
   =========================================================================== */

@font-face{
    font-family:"Montserrat";
    src:url("../assets/fonts/montserrat/montserrat-latin.woff2") format("woff2");
    font-weight:100 900;
    font-style:normal;
    font-display:swap;
}

:root{
    --black:#000000;
    --graphite:#1D1D1F;
    --light:#F5F5F7;
    --white:#FFFFFF;

    --ink:#1D1D1F;
    --gray:#6E6E73;
    --gray-dark:#86868B;
    --hairline:#D2D2D7;
    --hairline-dark:#424245;

    --accent:#E4335A;
    --accent-hover:#CC2A4E;
    --accent-on-dark:#FF5C7C;
    --grad-text:linear-gradient(95deg, #EC2F5A 0%, #F56E59 55%, #FB9F5A 100%);

    --whatsapp:#25D366;

    --font:"Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    --radius:28px;
    --radius-sm:18px;

    --nav-h:56px;
    --container:1180px;

    --ease:cubic-bezier(.2, .8, .2, 1);
}

/* ---------- Base ---------- */

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

html{
    scroll-behavior:smooth;
    -webkit-text-size-adjust:100%;
}

body{
    font-family:var(--font);
    font-size:17px;
    line-height:1.55;
    letter-spacing:-.005em;
    color:var(--ink);
    background:var(--white);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    overflow-x:hidden;
}

img,
svg,
picture{
    display:block;
    max-width:100%;
}

a{
    color:inherit;
}

button,
input{
    font:inherit;
    color:inherit;
    letter-spacing:inherit;
    border:none;
    background:none;
}

button{
    cursor:pointer;
}

ul,
ol{
    list-style:none;
}

::selection{
    background:var(--accent);
    color:#fff;
}

:focus-visible{
    outline:2px solid var(--accent);
    outline-offset:3px;
    border-radius:6px;
}

.container{
    width:min(100% - 48px, var(--container));
    margin-inline:auto;
}

.icon{
    width:22px;
    height:22px;
    flex-shrink:0;
    fill:none;
    stroke:currentColor;
    stroke-width:1.6;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.icon-lg{
    width:36px;
    height:36px;
    stroke-width:1.4;
}

.pz-skip{
    position:absolute;
    left:16px;
    top:-80px;
    z-index:3000;
    padding:10px 16px;
    border-radius:10px;
    background:var(--ink);
    color:#fff;
    font-weight:600;
    text-decoration:none;
}

.pz-skip:focus{
    top:16px;
}

section[id]{
    scroll-margin-top:var(--nav-h);
}

/* ---------- Tipografia ---------- */

h1,
h2,
h3{
    font-weight:600;
    letter-spacing:-.03em;
    color:var(--ink);
    text-wrap:balance;
}

h1 span,
h2 span{
    color:var(--gray);
}

.eyebrow{
    color:var(--accent);
    font-size:17px;
    font-weight:600;
    letter-spacing:-.01em;
}

.section{
    padding:130px 0;
}

.section-head{
    max-width:820px;
    margin:0 auto 64px;
    text-align:center;
}

.section-title{
    margin-top:10px;
    font-size:clamp(34px, 4.4vw, 56px);
    line-height:1.08;
}

.section-lead{
    margin:22px auto 0;
    max-width:680px;
    color:var(--gray);
    font-size:20px;
    line-height:1.5;
    font-weight:500;
}

.fine-print{
    margin-top:18px;
    color:var(--gray);
    font-size:14px;
    font-weight:500;
}

/* ---------- Superfícies ---------- */

.light{
    background:var(--light);
}

.dark{
    background:var(--black);
    color:var(--gray-dark);
}

.dark h1,
.dark h2,
.dark h3{
    color:#F5F5F7;
}

.dark h1 span,
.dark h2 span,
.dark .section-lead,
.dark .fine-print{
    color:var(--gray-dark);
}

.dark .eyebrow{
    color:var(--accent-on-dark);
}

/* ---------- Botões e links ---------- */

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:11px 22px;
    border-radius:980px;
    background:var(--accent);
    color:#fff;
    font-size:15px;
    font-weight:600;
    letter-spacing:-.01em;
    line-height:1.2;
    text-align:center;
    text-decoration:none;
    transition:background .2s ease, transform .2s ease;
}

.btn:hover{
    background:var(--accent-hover);
}

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

.btn-lg{
    padding:16px 30px;
    font-size:17px;
}

.btn-sm{
    padding:7px 15px;
    font-size:13px;
}

.link-more{
    display:inline-flex;
    align-items:center;
    gap:4px;
    color:var(--accent);
    font-size:17px;
    font-weight:600;
    text-decoration:none;
}

.link-more::after{
    content:"›";
    font-size:1.3em;
    line-height:1;
    transform:translateY(-1px);
    transition:transform .2s ease;
}

.link-more:hover{
    text-decoration:underline;
    text-underline-offset:3px;
}

.link-more:hover::after{
    transform:translate(2px, -1px);
}

.dark .link-more{
    color:var(--accent-on-dark);
}

.section-actions{
    margin-top:56px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:20px 32px;
}

.section-actions-left{
    justify-content:flex-start;
    margin-top:40px;
}

/* ---------- Navbar ---------- */

.nav{
    position:fixed;
    inset:0 0 auto;
    z-index:1000;
    height:var(--nav-h);
    background:rgba(0,0,0,.78);
    backdrop-filter:saturate(180%) blur(20px);
    -webkit-backdrop-filter:saturate(180%) blur(20px);
    transition:box-shadow .3s ease;
}

.nav.is-scrolled{
    box-shadow:0 1px 0 rgba(255,255,255,.08);
}

.nav-inner{
    height:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

.nav-logo img{
    height:34px;
    width:auto;
}

.nav-menu{
    display:flex;
    gap:34px;
}

.nav-menu a{
    color:#D2D2D7;
    font-size:13px;
    font-weight:500;
    text-decoration:none;
    transition:color .2s ease;
}

.nav-menu a:hover{
    color:#fff;
}

/* ---------- Hero (foto cinematográfica à direita, texto à esquerda) ---------- */

.text-gradient,
h1 .text-gradient,
h2 .text-gradient,
.dark h1 .text-gradient,
.dark h2 .text-gradient{
    background:var(--grad-text);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.hero{
    position:relative;
    min-height:min(100svh, 920px);
    display:flex;
    align-items:center;
    padding:calc(var(--nav-h) + 48px) 0 72px;
    overflow:hidden;
    isolation:isolate;
}

.hero-media{
    position:absolute;
    top:var(--nav-h);
    right:max(0px, calc((100vw - var(--container)) / 2 - 80px));
    bottom:0;
    width:min(52%, 760px);
    z-index:-2;
    display:flex;
    align-items:flex-end;
    justify-content:center;
}

/* Luz da marca atrás da Betina: ela "sai" do fundo */

.hero-halo{
    position:absolute;
    left:50%;
    top:44%;
    width:115%;
    aspect-ratio:1;
    transform:translate(-50%, -50%);
    border-radius:50%;
    background:radial-gradient(circle, rgba(236,47,90,.42) 0%, rgba(245,110,89,.20) 28%, rgba(254,182,90,.07) 48%, transparent 66%);
    filter:blur(10px);
    animation:halo-breathe 7s ease-in-out infinite;
}

.hero-ring{
    position:absolute;
    left:50%;
    top:40%;
    width:78%;
    aspect-ratio:1;
    transform:translate(-50%, -50%);
    border-radius:50%;
    border:1px solid rgba(255,255,255,.07);
    box-shadow:inset 0 0 80px rgba(236,47,90,.08);
}

@keyframes halo-breathe{
    0%, 100%{ opacity:.85; transform:translate(-50%, -50%) scale(1); }
    50%{ opacity:1; transform:translate(-50%, -50%) scale(1.05); }
}

.hero-media picture{
    position:relative;
    width:100%;
    height:100%;
}

.hero-media img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:50% 100%;
    filter:drop-shadow(0 0 28px rgba(236,47,90,.22)) drop-shadow(0 30px 60px rgba(0,0,0,.5));
    -webkit-mask-image:linear-gradient(0deg, transparent 0%, #000 16%);
    mask-image:linear-gradient(0deg, transparent 0%, #000 16%);
    animation:hero-zoom 1.8s var(--ease) both;
}

@keyframes hero-zoom{
    from{ transform:scale(1.06); opacity:0; }
    to{ transform:none; opacity:1; }
}

.hero-glow{
    position:absolute;
    z-index:-1;
    left:-12%;
    bottom:-30%;
    width:70vw;
    height:70vw;
    max-width:900px;
    max-height:900px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(236,47,90,.22) 0%, rgba(245,110,89,.10) 35%, transparent 65%);
    filter:blur(20px);
    pointer-events:none;
}

.hero-inner{
    width:min(100% - 48px, var(--container));
}

.hero-copy{
    max-width:560px;
    animation:hero-in 1.1s var(--ease) .15s both;
}

@keyframes hero-in{
    from{ transform:translateY(24px); opacity:0; }
    to{ transform:none; opacity:1; }
}

.hero-title{
    margin-top:16px;
    font-size:clamp(38px, 4.3vw, 62px);
    line-height:1.06;
    letter-spacing:-.035em;
}

.hero-title span{
    display:block;
}

.hero-lead{
    margin-top:24px;
    max-width:500px;
    color:#A1A1A6;
    font-size:19px;
    font-weight:500;
    line-height:1.5;
}

.hero-actions{
    margin-top:36px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:18px 28px;
}

.hero-signature{
    margin-top:48px;
    padding-left:16px;
    border-left:2px solid var(--accent);
    color:var(--gray-dark);
    font-size:14px;
    font-weight:500;
    line-height:1.45;
}

.hero-signature strong{
    display:block;
    color:#F5F5F7;
    font-size:16px;
    font-weight:600;
}

.hero-scroll{
    position:absolute;
    left:50%;
    bottom:26px;
    width:26px;
    height:42px;
    margin-left:-13px;
    border:1.5px solid rgba(255,255,255,.35);
    border-radius:20px;
}

.hero-scroll::after{
    content:"";
    position:absolute;
    left:50%;
    top:9px;
    width:3px;
    height:8px;
    margin-left:-1.5px;
    border-radius:2px;
    background:#fff;
    animation:scroll-hint 1.8s ease-in-out infinite;
}

@keyframes scroll-hint{
    0%{ transform:translateY(0); opacity:0; }
    30%{ opacity:1; }
    100%{ transform:translateY(14px); opacity:0; }
}

/* ---------- Números ---------- */

.stats{
    padding:72px 0 96px;
}

.stats-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:24px;
    text-align:center;
}

.stat strong{
    display:block;
    font-size:clamp(38px, 4.2vw, 56px);
    font-weight:600;
    letter-spacing:-.04em;
    line-height:1;
}

.stat span{
    display:block;
    margin:12px auto 0;
    max-width:200px;
    font-size:15px;
    font-weight:500;
    line-height:1.4;
}

/* ---------- Tiles / bento ---------- */

.tile{
    border-radius:var(--radius);
    background:var(--white);
    padding:40px;
}

.section:not(.light):not(.dark) .tile{
    background:var(--light);
}

.tile-gray{
    background:var(--light);
}

.tile.tile-dark,
.section:not(.light):not(.dark) .tile.tile-dark{
    background:var(--graphite);
    color:var(--gray-dark);
}

.tile-dark h3{
    color:#F5F5F7;
}

.bento{
    display:grid;
    gap:20px;
}

.bento-3{
    grid-template-columns:repeat(3, 1fr);
}

.problem-card .icon-lg{
    color:var(--accent);
}

.problem-card h3{
    margin-top:28px;
    font-size:22px;
}

.problem-card p{
    margin-top:10px;
    color:var(--gray);
    font-size:17px;
    font-weight:500;
}

/* ---------- Listas com fio ---------- */

.hairline-list li{
    display:block;
    padding:18px 0;
    border-top:1px solid var(--hairline);
    font-size:17px;
    font-weight:500;
    line-height:1.5;
}

.hairline-list li:first-child{
    border-top:none;
    padding-top:0;
}

.tile-dark .hairline-list li,
.dark .hairline-list li{
    border-color:var(--hairline-dark);
}

.hairline-list strong{
    color:inherit;
    font-weight:600;
}

.tile-dark .hairline-list strong{
    color:#F5F5F7;
}

.muted-list{
    color:var(--gray);
}

.check-list li,
.x-list li{
    display:flex;
    gap:12px;
}

.check-list .icon{
    color:var(--accent);
    stroke-width:2.2;
    margin-top:1px;
}

.x-list{
    color:var(--gray);
}

.x-list .icon{
    color:var(--gray-dark);
    stroke-width:2;
    margin-top:1px;
}

/* ---------- Antes x Depois / Para quem é ---------- */

.compare{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.compare-col h3,
.fit-card h3{
    margin-bottom:26px;
    font-size:24px;
}

/* ---------- Simulador ---------- */

.calc{
    background:var(--white);
}

.calc-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    align-items:stretch;
}

.calc-controls{
    display:grid;
    gap:30px;
    padding:44px;
    border-radius:var(--radius);
    background:var(--light);
}

.calc-field{
    display:block;
}

.calc-label{
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:16px;
    font-size:16px;
    font-weight:600;
}

.calc-label output{
    flex-shrink:0;
    color:var(--accent);
    font-size:20px;
    font-weight:700;
    letter-spacing:-.02em;
    font-variant-numeric:tabular-nums;
}

.calc-field small{
    display:block;
    margin-top:8px;
    color:var(--gray);
    font-size:13px;
    font-weight:500;
}

.calc-field input[type="range"]{
    --fill:20%;
    width:100%;
    height:28px;
    margin-top:10px;
    background:transparent;
    -webkit-appearance:none;
    appearance:none;
    cursor:pointer;
}

.calc-field input[type="range"]::-webkit-slider-runnable-track{
    height:6px;
    border-radius:6px;
    background:linear-gradient(90deg, #EC2F5A, #F56E59 var(--fill), #DADADF var(--fill));
}

.calc-field input[type="range"]::-moz-range-track{
    height:6px;
    border-radius:6px;
    background:#DADADF;
}

.calc-field input[type="range"]::-moz-range-progress{
    height:6px;
    border-radius:6px;
    background:linear-gradient(90deg, #EC2F5A, #F56E59);
}

.calc-field input[type="range"]::-webkit-slider-thumb{
    -webkit-appearance:none;
    width:26px;
    height:26px;
    margin-top:-10px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 2px 10px rgba(0,0,0,.18), 0 0 0 1px rgba(0,0,0,.04);
    transition:transform .2s ease;
}

.calc-field input[type="range"]:active::-webkit-slider-thumb{
    transform:scale(1.12);
}

.calc-field input[type="range"]::-moz-range-thumb{
    width:26px;
    height:26px;
    border:none;
    border-radius:50%;
    background:#fff;
    box-shadow:0 2px 10px rgba(0,0,0,.18);
}

.calc-result{
    position:relative;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    padding:44px;
    border-radius:var(--radius);
    background:var(--black);
    color:var(--gray-dark);
    isolation:isolate;
}

.calc-result-glow{
    position:absolute;
    z-index:-1;
    right:-30%;
    top:-40%;
    width:120%;
    height:120%;
    background:radial-gradient(circle, rgba(236,47,90,.35) 0%, rgba(245,110,89,.14) 35%, transparent 62%);
}

.calc-result-label{
    color:#F5F5F7;
    font-size:17px;
    font-weight:600;
}

.calc-result-big{
    margin-top:14px;
    color:#fff;
    font-size:clamp(64px, 7vw, 96px);
    font-weight:700;
    letter-spacing:-.05em;
    line-height:1;
    font-variant-numeric:tabular-nums;
}

.calc-result-big small{
    color:var(--gray-dark);
    font-size:20px;
    font-weight:600;
    letter-spacing:-.01em;
}

.calc-result-row{
    margin:32px 0 36px;
    padding-top:28px;
    border-top:1px solid var(--hairline-dark);
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.calc-result-row span{
    display:block;
    font-size:14px;
    font-weight:500;
}

.calc-result-row strong{
    display:block;
    margin-top:6px;
    color:#F5F5F7;
    font-size:clamp(26px, 2.6vw, 34px);
    font-weight:700;
    letter-spacing:-.03em;
    line-height:1.1;
    font-variant-numeric:tabular-nums;
}

.calc-result-row small{
    font-size:13px;
    font-weight:500;
}

.calc-result .btn{
    margin-top:auto;
}

.calc-note{
    margin-top:14px;
    font-size:12px;
    font-weight:500;
    text-align:center;
}

.btn-block{
    width:100%;
}

/* ---------- Método (etapas acendem com a rolagem) ---------- */

.method{
    position:relative;
    overflow:hidden;
    isolation:isolate;
}

.method-aura,
.final-aura{
    position:absolute;
    z-index:-1;
    border-radius:50%;
    pointer-events:none;
    filter:blur(30px);
}

.method-aura{
    right:-20%;
    top:10%;
    width:900px;
    height:900px;
    background:radial-gradient(circle, rgba(236,47,90,.18) 0%, rgba(254,182,90,.08) 40%, transparent 65%);
}

.method-layout{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:72px;
    align-items:start;
}

.method-sticky{
    position:sticky;
    top:calc(var(--nav-h) + 80px);
}

.method-big{
    display:block;
    font-size:clamp(120px, 15vw, 210px);
    font-weight:700;
    letter-spacing:-.07em;
    line-height:.85;
    font-variant-numeric:tabular-nums;
}

.method-bar{
    margin-top:32px;
    height:3px;
    border-radius:3px;
    background:var(--graphite);
    overflow:hidden;
}

.method-bar i{
    display:block;
    width:16.6%;
    height:100%;
    border-radius:3px;
    background:var(--grad-text);
    transition:width .6s var(--ease);
}

.method-sticky p{
    margin-top:18px;
    color:#F5F5F7;
    font-size:24px;
    font-weight:600;
    letter-spacing:-.02em;
}

.method-list{
    display:grid;
    gap:16px;
}

.method-step{
    padding:34px 36px;
    border-radius:var(--radius);
    background:var(--graphite);
    opacity:.38;
    transform:scale(.97);
    transition:opacity .5s var(--ease), transform .5s var(--ease), box-shadow .5s var(--ease);
}

.method-step.is-active{
    opacity:1;
    transform:none;
    box-shadow:inset 0 0 0 1px rgba(245,110,89,.35);
}

.method-num{
    display:block;
    color:var(--accent-on-dark);
    font-size:15px;
    font-weight:700;
    letter-spacing:.02em;
}

.method-step h3{
    margin-top:12px;
    display:flex;
    align-items:baseline;
    gap:10px;
    font-size:26px;
}

.tag{
    color:var(--accent-on-dark);
    font-size:13px;
    font-style:normal;
    font-weight:600;
    letter-spacing:0;
}

.method-step p{
    margin-top:10px;
    font-size:17px;
    font-weight:500;
}

/* ---------- Resultados ---------- */

.results{
    display:grid;
    grid-template-columns:1.1fr 1fr;
    gap:20px;
}

.case-main{
    display:flex;
    flex-direction:column;
    padding:48px;
}

.case-label{
    color:var(--accent-on-dark);
    font-size:15px;
    font-weight:600;
}

.case-main h3{
    margin-top:12px;
    max-width:420px;
    font-size:26px;
    line-height:1.2;
}

.case-main-number{
    margin-top:auto;
    padding-top:48px;
    font-size:clamp(88px, 10vw, 136px);
    font-weight:700;
    letter-spacing:-.06em;
    line-height:.9;
    background:var(--grad-text);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.case-main p:last-child{
    margin-top:16px;
    max-width:380px;
    font-size:17px;
    font-weight:500;
}

.case-metrics{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.case-metrics .tile{
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    min-height:200px;
    padding:32px;
}

.case-metrics strong{
    font-size:clamp(34px, 3.6vw, 48px);
    font-weight:600;
    letter-spacing:-.04em;
    line-height:1;
}

.case-metrics p{
    margin-top:10px;
    color:var(--gray);
    font-size:15px;
    font-weight:500;
}

.results-quote{
    margin:80px auto 0;
    max-width:860px;
    text-align:center;
}

.results-quote p{
    font-size:clamp(22px, 2.6vw, 32px);
    font-weight:600;
    letter-spacing:-.03em;
    line-height:1.3;
    text-wrap:balance;
}

.results-quote cite{
    display:block;
    margin-top:18px;
    color:var(--gray);
    font-size:15px;
    font-style:normal;
    font-weight:500;
}

/* ---------- Depoimentos ---------- */

.testimonial{
    display:grid;
    grid-template-columns:minmax(0, 340px) 1fr;
    align-items:center;
    gap:72px;
    margin:80px auto 0;
    max-width:980px;
    padding:28px 72px 28px 28px;
    border-radius:var(--radius);
    background:var(--white);
}

.testimonial-video{
    position:relative;
    aspect-ratio:9 / 16;
    border-radius:var(--radius-sm);
    overflow:hidden;
    background:var(--graphite);
}

.testimonial-video video{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.testimonial-play{
    position:absolute;
    left:50%;
    bottom:24px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:12px 20px 12px 14px;
    border:0;
    border-radius:999px;
    background:rgba(29, 29, 31, .62);
    -webkit-backdrop-filter:blur(14px) saturate(160%);
    backdrop-filter:blur(14px) saturate(160%);
    color:var(--white);
    font:600 15px/1 var(--font);
    white-space:nowrap;
    cursor:pointer;
    transform:translateX(-50%);
    transition:background .3s var(--ease), transform .3s var(--ease);
}

.testimonial-play:hover{
    background:rgba(29, 29, 31, .8);
    transform:translateX(-50%) scale(1.03);
}

.testimonial-play svg{
    flex:none;
    width:32px;
    height:32px;
    padding:7px 6px 7px 8px;
    border-radius:50%;
    background:var(--white);
    color:var(--ink);
}

.testimonial-play small{
    margin-left:4px;
    color:rgba(255, 255, 255, .62);
    font-size:13px;
    font-weight:500;
}

.testimonial.is-playing .testimonial-play{
    display:none;
}

.testimonial-body blockquote{
    margin-top:16px;
}

.testimonial-body blockquote p{
    font-size:clamp(22px, 2.4vw, 30px);
    font-weight:600;
    letter-spacing:-.03em;
    line-height:1.3;
    color:var(--ink);
    text-wrap:balance;
}

.testimonial-body blockquote p:first-child::before{
    content:"“";
    display:block;
    margin-bottom:8px;
    font-size:72px;
    line-height:.6;
    background:var(--grad-text);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.testimonial-body .testimonial-close{
    margin-top:18px;
    color:var(--gray);
    font-size:clamp(18px, 1.8vw, 22px);
}

.testimonial + .testimonial{
    margin-top:20px;
}

.testimonial-facts{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
    margin-top:28px;
}

.testimonial-facts dt{
    font-size:clamp(28px, 3vw, 38px);
    font-weight:600;
    letter-spacing:-.04em;
    line-height:1;
    background:var(--grad-text);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.testimonial-facts dd{
    margin-top:8px;
    color:var(--gray);
    font-size:14px;
    font-weight:500;
    line-height:1.4;
}

.testimonial-body figcaption{
    margin-top:32px;
    padding-top:24px;
    border-top:1px solid var(--hairline);
}

.testimonial-body figcaption strong{
    display:block;
    color:var(--ink);
    font-size:17px;
    font-weight:600;
}

.testimonial-body figcaption span{
    display:block;
    margin-top:4px;
    color:var(--gray);
    font-size:15px;
    font-weight:500;
}

@media (max-width:860px){
    .testimonial{
        grid-template-columns:1fr;
        gap:32px;
        margin-top:56px;
        padding:20px 20px 36px;
    }

    .testimonial-video{
        width:100%;
        max-width:340px;
        margin:0 auto;
    }

    .testimonial-body{
        padding:0 8px;
    }

    .testimonial-body blockquote p{
        text-wrap:pretty;
    }
}

/* ---------- Quem somos ---------- */

.about{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    align-items:center;
    gap:88px;
}

.about-photo picture,
.diagnosis-photo picture{
    border-radius:var(--radius);
    overflow:hidden;
    aspect-ratio:4 / 5;
    background:#8C929E;
}

.about-photo img,
.diagnosis-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.about-copy .section-lead{
    margin-left:0;
}

.about-list{
    margin-top:40px;
}

.about-list li{
    padding:20px 0;
    border-top:1px solid var(--hairline);
}

.about-list h3{
    font-size:19px;
}

.about-list p{
    margin-top:6px;
    color:var(--gray);
    font-size:16px;
    font-weight:500;
}

.about-signature{
    padding-top:22px;
    border-top:1px solid var(--hairline);
    color:var(--gray);
    font-size:14px;
    font-weight:500;
}

.about-signature strong{
    display:block;
    color:var(--ink);
    font-size:20px;
    font-weight:600;
    letter-spacing:-.02em;
}

/* ---------- Diagnóstico ---------- */

.diagnosis-box{
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    align-items:center;
    gap:88px;
}

.diagnosis-list{
    margin-top:40px;
}

.diagnosis-list li{
    display:block;
    color:var(--gray-dark);
}

.diagnosis-list strong{
    display:block;
    margin-bottom:2px;
    color:#F5F5F7;
    font-size:19px;
}

/* ---------- FAQ ---------- */

.faq{
    max-width:860px;
}

.faq .section-head{
    margin-bottom:40px;
}

.faq-item{
    border-bottom:1px solid var(--hairline);
}

.faq-item:first-child{
    border-top:1px solid var(--hairline);
}

.faq-item summary{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:24px;
    padding:26px 0;
    font-size:20px;
    font-weight:600;
    letter-spacing:-.02em;
    cursor:pointer;
    list-style:none;
}

.faq-item summary::-webkit-details-marker{
    display:none;
}

.faq-item summary::after{
    content:"";
    flex-shrink:0;
    width:11px;
    height:11px;
    border-right:1.5px solid var(--gray);
    border-bottom:1.5px solid var(--gray);
    transform:translateY(-3px) rotate(45deg);
    transition:transform .3s var(--ease);
}

.faq-item[open] summary::after{
    transform:translateY(3px) rotate(-135deg);
}

.faq-item p{
    padding:0 48px 28px 0;
    color:var(--gray);
    font-size:17px;
    font-weight:500;
    line-height:1.6;
}

.faq-more{
    margin-top:40px;
    text-align:center;
    color:var(--gray);
    font-weight:500;
}

/* ---------- CTA final ---------- */

.final-cta{
    padding:150px 0 140px;
    text-align:center;
}

.final-title{
    max-width:900px;
    margin:0 auto;
    font-size:clamp(38px, 5.4vw, 72px);
    line-height:1.06;
    letter-spacing:-.04em;
}

.final-title span{
    display:block;
}

.final-cta .section-actions{
    margin-top:44px;
}

/* ---------- Footer ---------- */

.footer{
    padding:56px 0 36px;
    background:var(--light);
    color:var(--gray);
    font-size:13px;
    font-weight:500;
}

.footer-grid{
    display:grid;
    grid-template-columns:1.6fr 1fr 1fr;
    gap:40px;
    padding-bottom:36px;
    border-bottom:1px solid var(--hairline);
}

.footer-brand img{
    height:32px;
    width:auto;
}

.footer-brand p{
    margin-top:16px;
    max-width:360px;
    line-height:1.6;
}

.footer-col{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.footer-col h2{
    margin-bottom:4px;
    color:var(--ink);
    font-size:13px;
    letter-spacing:-.01em;
}

.footer-col a{
    color:#424245;
    text-decoration:none;
}

.footer-col a:hover{
    text-decoration:underline;
}

.footer-bottom{
    margin-top:20px;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:10px;
    font-size:12px;
}

/* ---------- WhatsApp e barra fixa ---------- */

.whatsapp-float{
    position:fixed;
    right:24px;
    bottom:24px;
    z-index:1500;
    display:flex;
    align-items:center;
    justify-content:center;
    width:54px;
    height:54px;
    border-radius:50%;
    background:rgba(29,29,31,.86);
    backdrop-filter:saturate(180%) blur(20px);
    -webkit-backdrop-filter:saturate(180%) blur(20px);
    color:var(--whatsapp);
    box-shadow:0 10px 30px rgba(0,0,0,.25);
    transition:transform .25s var(--ease);
}

.whatsapp-float:hover{
    transform:scale(1.06);
}

.whatsapp-float svg{
    width:28px;
    height:28px;
    fill:currentColor;
}

.sticky-cta{
    display:none;
}

/* ---------- Animações ---------- */

.js-reveal{
    opacity:0;
    transform:translateY(30px);
    transition:opacity .9s var(--ease), transform .9s var(--ease);
}

.js-reveal.is-visible{
    opacity:1;
    transform:none;
}

.js-delay-1{ transition-delay:.04s; }
.js-delay-2{ transition-delay:.08s; }
.js-delay-3{ transition-delay:.12s; }
.js-delay-4{ transition-delay:.16s; }
.js-delay-5{ transition-delay:.20s; }

@media (prefers-reduced-motion: reduce){
    *,
    *::before,
    *::after{
        animation:none !important;
        transition:none !important;
        scroll-behavior:auto !important;
    }

    .js-reveal{
        opacity:1 !important;
        transform:none !important;
    }
}

/* ===========================================================================
   WIZARD
   =========================================================================== */

body.is-modal-open{
    overflow:hidden;
}

.wizard-overlay{
    position:fixed;
    inset:0;
    z-index:2000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(0,0,0,.55);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    opacity:0;
    visibility:hidden;
    transition:opacity .3s ease, visibility .3s ease;
}

.wizard-overlay.is-open{
    opacity:1;
    visibility:visible;
}

.wizard-modal{
    position:relative;
    width:min(100%, 580px);
    max-height:calc(100dvh - 48px);
    overflow-y:auto;
    padding:48px;
    border-radius:var(--radius);
    background:#fff;
    box-shadow:0 30px 90px rgba(0,0,0,.35);
    transform:translateY(16px) scale(.98);
    transition:transform .35s var(--ease);
}

.wizard-overlay.is-open .wizard-modal{
    transform:none;
}

.wizard-close{
    position:absolute;
    top:18px;
    right:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    border-radius:50%;
    background:var(--light);
    color:var(--gray);
}

.wizard-close:hover{
    color:var(--ink);
}

.wizard-close .icon{
    width:18px;
    height:18px;
    stroke-width:2;
}

.wizard-header span{
    display:block;
    color:var(--accent);
    font-size:14px;
    font-weight:600;
}

.wizard-progress{
    width:100%;
    height:4px;
    margin:18px 0 10px;
    border-radius:4px;
    background:#E8E8ED;
    overflow:hidden;
}

.wizard-progress-bar{
    width:14%;
    height:100%;
    border-radius:4px;
    background:var(--accent);
    transition:width .4s var(--ease);
}

.wizard-header small{
    color:var(--gray);
    font-size:13px;
    font-weight:500;
}

.wizard-body{
    margin-top:32px;
    min-height:220px;
}

.wizard-question{
    display:block;
    margin-bottom:24px;
    color:var(--ink);
    font-size:28px;
    font-weight:600;
    letter-spacing:-.03em;
    line-height:1.15;
}

.wizard-hint{
    margin:-12px 0 20px;
    color:var(--gray);
    font-size:15px;
    font-weight:500;
}

.wizard-input{
    width:100%;
    height:56px;
    padding:0 18px;
    border-radius:14px;
    background:var(--light);
    border:1px solid var(--hairline);
    color:var(--ink);
    font-size:17px;
    font-weight:500;
    transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.wizard-input:focus{
    outline:none;
    background:#fff;
    border-color:var(--accent);
    box-shadow:0 0 0 4px rgba(228,51,90,.12);
}

.wizard-input.is-error{
    border-color:#E30000;
    box-shadow:0 0 0 4px rgba(227,0,0,.08);
}

.wizard-options{
    display:grid;
    gap:10px;
}

.wizard-option{
    width:100%;
    padding:17px 20px;
    border-radius:14px;
    background:var(--light);
    border:1px solid transparent;
    color:var(--ink);
    text-align:left;
    font-size:16px;
    font-weight:600;
    transition:border-color .2s ease, background .2s ease, color .2s ease;
}

.wizard-option:hover{
    border-color:var(--hairline);
}

.wizard-option.is-selected{
    border-color:var(--accent);
    background:#FFF2F5;
    color:var(--accent-hover);
}

.wizard-consent{
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin-top:16px;
    color:var(--gray);
    font-size:14px;
    font-weight:500;
    line-height:1.5;
    cursor:pointer;
}

.wizard-consent input{
    flex-shrink:0;
    width:20px;
    height:20px;
    margin-top:1px;
    accent-color:var(--accent);
    cursor:pointer;
}

.wizard-consent.is-error{
    color:#E30000;
}

.wizard-error{
    min-height:22px;
    margin-top:10px;
    color:#E30000;
    font-size:14px;
    font-weight:500;
}

.wizard-honeypot{
    position:absolute;
    left:-9999px;
    width:1px;
    height:1px;
    opacity:0;
}

.wizard-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    margin-top:28px;
}

.wizard-back{
    color:var(--accent);
    font-size:15px;
    font-weight:600;
}

.wizard-back.is-hidden{
    visibility:hidden;
}

.wizard-next{
    padding:14px 26px;
    font-size:16px;
}

.wizard-next.is-loading{
    pointer-events:none;
    opacity:.8;
}

.wizard-spinner{
    display:inline-block;
    width:15px;
    height:15px;
    margin-right:8px;
    border:2px solid rgba(255,255,255,.4);
    border-top-color:#fff;
    border-radius:50%;
    animation:wizard-spin .8s linear infinite;
    vertical-align:-2px;
}

@keyframes wizard-spin{
    to{ transform:rotate(360deg); }
}

.wizard-note{
    margin-top:22px;
    color:var(--gray);
    font-size:12px;
    font-weight:500;
    text-align:center;
}

.wizard-alert{
    margin-top:16px;
    padding:14px 16px;
    border-radius:14px;
    background:#FFF2F2;
    color:#A30000;
    font-size:15px;
    font-weight:500;
    line-height:1.5;
}

.wizard-alert a{
    color:#A30000;
    font-weight:600;
}

.wizard-success{
    text-align:center;
}

.wizard-success h3{
    font-size:32px;
    line-height:1.1;
}

.wizard-success > p{
    margin-top:12px;
    color:var(--gray);
    font-weight:500;
}

.wizard-steps{
    margin:24px 0 4px;
    text-align:left;
    font-size:15px;
    font-weight:500;
    line-height:1.5;
}

.wizard-steps li{
    padding:14px 0;
    border-top:1px solid var(--hairline);
}

.wizard-steps li:first-child{
    border-top:none;
}

.wizard-steps strong{
    color:var(--accent);
    margin-right:4px;
}

.wizard-whatsapp{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    margin-top:20px;
    padding:15px 22px;
    border-radius:980px;
    background:var(--whatsapp);
    color:#fff;
    font-weight:600;
    text-decoration:none;
    transition:filter .2s ease;
}

.wizard-whatsapp:hover{
    filter:brightness(.95);
}

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

@media (max-width:1068px){
    .section{
        padding:110px 0;
    }


    .about,
    .diagnosis-box{
        gap:56px;
    }
}

@media (max-width:900px){
    .nav-menu{
        display:none;
    }

    .bento-3{
        grid-template-columns:repeat(2, 1fr);
    }

    .stats-grid{
        grid-template-columns:repeat(2, 1fr);
        row-gap:48px;
    }

    .compare,
    .results,
    .about,
    .diagnosis-box{
        grid-template-columns:1fr;
    }

    .about-photo,
    .diagnosis-photo{
        width:min(100%, 440px);
        margin-inline:auto;
    }

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

    .footer-brand{
        grid-column:1 / -1;
    }
}

@media (max-width:640px){
    body{
        font-size:16px;
    }

    .container{
        width:min(100% - 32px, var(--container));
    }

    .section{
        padding:80px 0;
    }

    .section-head{
        margin-bottom:40px;
    }

    .section-lead{
        font-size:17px;
    }

    .hero-actions .btn,
    .section-actions .btn{
        width:100%;
    }

    .section-actions{
        flex-direction:column;
        gap:18px;
    }

    .section-actions-left{
        align-items:stretch;
        text-align:center;
    }

    .section-actions-left .link-more{
        justify-content:center;
    }

    .stats{
        padding:56px 0 72px;
    }

    .bento-3{
        grid-template-columns:1fr;
    }

    .tile,
    .method-step,
    .case-main{
        padding:30px 26px;
    }

    .problem-card{
        display:grid;
        grid-template-columns:44px 1fr;
        column-gap:18px;
    }

    .problem-card .icon-lg{
        grid-row:span 2;
        width:44px;
        height:44px;
        padding:10px;
        border-radius:13px;
    }

    .problem-card h3{
        margin-top:0;
        font-size:19px;
    }

    .problem-card p{
        margin-top:4px;
        font-size:15px;
    }

    .method-step h3{
        margin-top:18px;
    }

    .case-metrics{
        gap:12px;
    }

    .case-metrics .tile{
        min-height:150px;
        padding:22px 20px;
    }

    .results-quote{
        margin-top:56px;
    }

    .faq-item summary{
        font-size:17px;
        padding:22px 0;
    }

    .faq-item p{
        padding-right:0;
        font-size:16px;
    }

    .final-cta{
        padding:100px 0 96px;
    }

    .footer{
        padding-bottom:110px;
    }

    .footer-grid{
        grid-template-columns:1fr;
        gap:28px;
    }

    .whatsapp-float{
        display:none;
    }

    .sticky-cta{
        position:fixed;
        left:0;
        right:0;
        bottom:0;
        z-index:1500;
        display:flex;
        gap:10px;
        padding:10px 16px calc(10px + env(safe-area-inset-bottom));
        background:rgba(29,29,31,.82);
        backdrop-filter:saturate(180%) blur(20px);
        -webkit-backdrop-filter:saturate(180%) blur(20px);
        transform:translateY(110%);
        transition:transform .4s var(--ease);
    }

    .sticky-cta.is-visible{
        transform:none;
    }

    .sticky-cta .btn{
        flex:1;
        padding:14px 18px;
        font-size:16px;
    }

    .sticky-whatsapp{
        display:flex;
        align-items:center;
        justify-content:center;
        width:50px;
        flex-shrink:0;
        border-radius:980px;
        background:rgba(255,255,255,.1);
        color:var(--whatsapp);
    }

    .sticky-whatsapp svg{
        width:26px;
        height:26px;
        fill:currentColor;
    }

    .wizard-overlay{
        padding:10px;
        align-items:flex-end;
    }

    .wizard-modal{
        padding:34px 22px 24px;
        max-height:calc(100dvh - 20px);
        border-radius:22px;
    }

    .wizard-body{
        margin-top:26px;
        min-height:0;
    }

    .wizard-question{
        font-size:24px;
    }

    .wizard-footer{
        flex-direction:column-reverse;
        align-items:stretch;
    }

    .wizard-next{
        width:100%;
    }

    .wizard-success h3{
        font-size:28px;
    }
}

/* ---------- Cor e luz (menos monocromático) ---------- */

.final-cta{
    position:relative;
    overflow:hidden;
    isolation:isolate;
}

.final-aura{
    left:50%;
    top:55%;
    width:1100px;
    height:700px;
    transform:translate(-50%, -50%);
    background:radial-gradient(ellipse, rgba(236,47,90,.30) 0%, rgba(245,110,89,.14) 35%, rgba(254,182,90,.05) 55%, transparent 70%);
}

.problem-card{
    transition:transform .4s var(--ease), box-shadow .4s var(--ease);
}

.problem-card:hover{
    transform:translateY(-6px);
    box-shadow:0 24px 50px rgba(0,0,0,.08);
}

.problem-card .icon-lg{
    width:52px;
    height:52px;
    padding:12px;
    border-radius:16px;
    background:linear-gradient(135deg, rgba(236,47,90,.12), rgba(254,182,90,.18));
}

.results-quote p::before{
    content:"“";
    display:block;
    margin-bottom:8px;
    font-size:72px;
    line-height:.6;
    background:var(--grad-text);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

.results-quote p{
    quotes:none;
}

/* ---------- Responsivo das seções novas ---------- */

@media (max-width:900px){
    .calc-grid,
    .method-layout{
        grid-template-columns:1fr;
    }

    .method-sticky{
        display:none;
    }

    .method-step{
        opacity:1;
        transform:none;
    }
}

@media (max-width:860px){
    .hero{
        min-height:0;
        display:block;
        padding:0 0 64px;
    }

    .hero-media{
        position:relative;
        width:100%;
        height:50svh;
        min-height:340px;
        max-height:480px;
        margin-top:var(--nav-h);
        z-index:0;
        overflow:hidden;
    }

    .hero-media{
        top:auto;
        right:auto;
    }

    .hero-media img{
        object-position:50% 100%;
        -webkit-mask-image:linear-gradient(0deg, transparent 0%, #000 28%);
        mask-image:linear-gradient(0deg, transparent 0%, #000 28%);
    }

    .hero-halo{
        top:48%;
        width:130%;
    }

    .hero-ring{
        width:88%;
    }

    .hero-glow{
        left:-40%;
        bottom:-10%;
        width:140vw;
        height:140vw;
    }

    .hero-inner{
        position:relative;
        margin-top:-70px;
    }

    .hero-copy{
        max-width:none;
        text-align:center;
    }

    .hero-lead{
        margin-inline:auto;
    }

    .hero-actions{
        flex-direction:column;
        gap:18px;
    }

    .hero-actions .btn{
        width:100%;
    }

    .hero-signature,
    .hero-scroll{
        display:none;
    }
}

@media (max-width:640px){
    .hero-title{
        font-size:36px;
    }

    .hero-lead{
        font-size:17px;
    }

    .calc-controls,
    .calc-result{
        padding:30px 24px;
    }

    .calc-result-row{
        gap:12px;
    }

    .calc-result-row strong{
        font-size:22px;
        white-space:nowrap;
    }

    .method-step{
        padding:28px 26px;
    }

    .method-step h3{
        font-size:22px;
    }
}

/* ===========================================================================
   LP ODONTOLOGIA DO SONO (/sono)
   Só classes novas: nada aqui altera a home.
   =========================================================================== */

/* Selo do diagnóstico prioritário (frase normal, sem caixa alta) */

.sono-seal{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-top:24px;
    padding:10px 16px;
    border:1px solid rgba(255,92,124,.45);
    border-radius:14px;
    background:rgba(236,47,90,.08);
    color:#F5F5F7;
    font-size:14px;
    font-weight:600;
    line-height:1.35;
    text-align:left;
}

.sono-seal .icon{
    width:18px;
    height:18px;
    color:var(--accent-on-dark);
}

/* Indicação do professor */

.endorse{
    max-width:920px;
    margin:0 auto;
    display:grid;
    grid-template-columns:132px 1fr;
    gap:40px;
    align-items:start;
}

.endorse-avatar{
    width:132px;
    height:132px;
    border-radius:50%;
    overflow:hidden;
    display:grid;
    place-items:center;
    background:var(--graphite);
    color:#F5F5F7;
    font-size:40px;
    font-weight:600;
    letter-spacing:-.03em;
}

.endorse-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.endorse blockquote p{
    font-size:clamp(22px, 2.4vw, 30px);
    font-weight:600;
    letter-spacing:-.03em;
    line-height:1.3;
    color:var(--ink);
    text-wrap:balance;
}

.endorse figcaption{
    margin-top:22px;
    padding-left:16px;
    border-left:2px solid var(--accent);
    color:var(--gray);
    font-size:15px;
    font-weight:500;
    line-height:1.45;
}

.endorse figcaption strong{
    display:block;
    color:var(--ink);
    font-size:17px;
    font-weight:600;
}

/* Grade de 2 colunas (oportunidade) */

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

/* Nota de responsabilidade (saúde) */

.care-note{
    max-width:820px;
    margin:56px auto 0;
    padding-left:20px;
    border-left:2px solid var(--accent);
    color:var(--gray);
    font-size:16px;
    font-weight:500;
    line-height:1.55;
}

.care-note strong{
    color:var(--ink);
    font-weight:600;
}

/* Aviso de que os depoimentos são de clínicas em geral */

.results-disclaimer{
    max-width:680px;
    margin:-36px auto 56px;
    text-align:center;
    color:var(--gray);
    font-size:15px;
    font-weight:500;
}

@media (max-width:860px){
    .sono-seal{
        text-align:left;
    }
}

@media (max-width:640px){
    .endorse{
        grid-template-columns:1fr;
        gap:24px;
        text-align:center;
    }

    .endorse-avatar{
        width:104px;
        height:104px;
        margin:0 auto;
        font-size:32px;
    }

    .endorse figcaption{
        display:inline-block;
        text-align:left;
    }

    .bento-2{
        grid-template-columns:1fr;
    }

    .results-disclaimer{
        margin-top:-24px;
    }
}

/* Título do hero mais longo (/sono): menor no desktop para o CTA ficar na dobra */

.hero-title-long{
    font-size:clamp(34px, 3.4vw, 50px);
}
