:root{
  --navy:#0b3660; --navy-d:#072a52; --navy-dd:#041a36; --navy-l:#144d73;
  --yellow:#fdd110; --yellow-d:#d9ae00; --ink:#111111; --text:#1d2533; --muted:#5a6578;
  --paper:#f5f7fb; --line:#dfe5ee; --white:#fff; --green:#25d366;
  --r:22px; --r-s:14px; --shadow:0 18px 50px -20px rgba(7,26,53,.35);
  --font:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wrap:1180px; --gut:20px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;font-family:var(--font);color:var(--text);background:var(--paper);line-height:1.55;font-size:17px;overflow-x:hidden}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--yellow);color:var(--ink);padding:10px 16px;border-radius:10px;z-index:100;font-weight:800}
.skip:focus{left:8px}

/* tipografia */
h1,h2,h3{font-family:var(--font);line-height:1.04;margin:0;letter-spacing:-.02em}
.display{font-weight:900;font-style:italic;font-stretch:112%;text-transform:uppercase}
h2.display{font-size:clamp(2rem,6.2vw,3.6rem)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--navy)}
.eyebrow::before{content:"";width:22px;height:4px;border-radius:2px;background:var(--yellow);box-shadow:0 0 0 1px rgba(0,0,0,.05)}
.lead{font-size:clamp(1.02rem,2.4vw,1.18rem);color:var(--muted);max-width:56ch}
.hl{color:var(--yellow)}
.hl-b{background:linear-gradient(transparent 58%,var(--yellow) 58% 92%,transparent 92%);padding:0 .08em}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 24px;border-radius:999px;font-weight:800;font-size:1rem;text-decoration:none;border:0;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s}
.btn svg{width:22px;height:22px;flex:none}
.btn-zap{background:var(--yellow);color:var(--ink);box-shadow:0 10px 0 -2px var(--yellow-d),0 18px 30px -12px rgba(253,209,16,.55)}
.btn-zap:hover{transform:translateY(-2px)}
.btn-zap:active{transform:translateY(3px);box-shadow:0 5px 0 -2px var(--yellow-d)}
.btn-ghost{background:rgba(255,255,255,.08);color:#fff;border:1.5px solid rgba(255,255,255,.28)}
.btn-ghost:hover{background:rgba(255,255,255,.16)}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-d)}
.btn-line{background:#fff;color:var(--navy);border:1.5px solid var(--line)}
.btn-line:hover{border-color:var(--navy)}

/* faixa zebrada (assinatura da marca) */
.hazard{height:26px;background:repeating-linear-gradient(-45deg,var(--yellow) 0 22px,var(--ink) 22px 44px);position:relative;z-index:2}
.hazard.thin{height:12px}

/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(7,26,53,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:66px;gap:16px}
.brand{display:flex;align-items:center;text-decoration:none}
.brand img{height:34px;width:auto}
.nav{display:none;gap:26px}
.nav a{color:#d7e2f3;text-decoration:none;font-weight:700;font-size:.95rem}
.nav a:hover{color:#fff}
.top .btn{min-height:42px;padding:0 16px;font-size:.92rem;box-shadow:none}
.top .btn span.lg{display:none}
@media (min-width:900px){.nav{display:flex}.top .btn span.lg{display:inline}}

/* hero */
.hero{position:relative;color:#fff;background:
  radial-gradient(1200px 600px at 75% 20%,rgba(20,77,115,.75),transparent 60%),
  radial-gradient(800px 500px at 10% 100%,rgba(253,209,16,.10),transparent 60%),
  linear-gradient(180deg,var(--navy-dd),var(--navy-d) 55%,var(--navy));overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(ellipse at 70% 40%,#000 0,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000 0,transparent 70%);pointer-events:none}
.hero .wrap{position:relative;display:grid;gap:8px;padding-top:34px}
.hero-copy{position:relative;z-index:2}
.hero h1{font-size:clamp(2.5rem,10.5vw,4.7rem);font-weight:900;font-style:italic;font-stretch:112%;text-transform:uppercase;letter-spacing:-.025em;line-height:.95}
.hero h1 .hl{display:block}
.hero .lead{color:#c5d3ea;margin:18px 0 26px}
.chip{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#e6eefb;padding:7px 14px 7px 10px;border-radius:999px;font-size:.84rem;font-weight:700;margin-bottom:18px}
.chip .dot{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(37,211,102,.22)}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.ctas .btn{flex:1 1 220px}
.price-tag{display:inline-flex;align-items:baseline;gap:8px;margin-top:22px;background:#fff;color:var(--ink);padding:10px 16px;border-radius:12px;transform:rotate(-2deg);box-shadow:var(--shadow);font-weight:800}
.price-tag small{font-size:.78rem;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.price-tag b{font-size:1.5rem;font-style:italic;color:var(--navy)}
.hero-trust{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:26px;color:#b9c8e2;font-size:.9rem;font-weight:600}
.hero-trust span{display:inline-flex;align-items:center;gap:8px}
.hero-trust svg{width:18px;height:18px;color:var(--yellow)}
.stage{position:relative;width:100%}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .8s ease}
.stage.is-live canvas{opacity:1}
.stage .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .8s ease}
.stage.is-live .poster{opacity:0}
.hero-stage{height:min(92vw,440px);margin:6px calc(var(--gut) * -1) 0;cursor:grab}
@media (min-width:980px){
  .hero .wrap{grid-template-columns:1.02fr 1fr;align-items:center;min-height:min(86vh,760px);padding-top:0}
  .hero-stage{height:min(80vh,700px);margin:0 -70px 0 -20px}
}

/* seções */
section{scroll-margin-top:70px}
.sec{padding:84px 0}
.sec-head{display:grid;gap:14px;margin-bottom:38px}
.sec-head p{margin:0}
.dark{background:var(--navy-d);color:#fff}
.dark .eyebrow{color:var(--yellow)}
.dark .lead{color:#b9c8e2}

/* categorias */
.cats{display:grid;gap:18px}
.cat{position:relative;background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);display:grid}
.cat .stage{height:250px;background:radial-gradient(circle at 50% 70%,#e9f0fb,#d6e2f3 70%)}
.cat .stage .poster{object-fit:cover}
.cat-badge{position:absolute;top:16px;left:16px;z-index:2;width:62px;height:62px;border-radius:16px;background:var(--navy);color:var(--yellow);display:grid;place-items:center;font-weight:900;font-style:italic;font-size:2.1rem;box-shadow:0 6px 0 var(--navy-dd)}
.cat-body{padding:22px 22px 26px}
.cat h3{font-size:1.5rem;font-weight:900;font-style:italic;text-transform:uppercase;color:var(--navy)}
.cat p{color:var(--muted);margin:8px 0 16px}
.cat ul{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:8px}
.cat li{display:flex;gap:10px;align-items:flex-start;font-weight:600}
.cat li::before{content:"";flex:none;margin-top:6px;width:12px;height:12px;border-radius:3px;background:var(--yellow);box-shadow:inset 0 0 0 3px var(--navy)}
.cat .btn{width:100%}
.more{display:grid;gap:12px;margin-top:18px}
.mini{display:flex;gap:16px;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:var(--r-s);padding:16px 18px;text-decoration:none;transition:border-color .2s,transform .2s}
.mini:hover{border-color:var(--navy);transform:translateY(-2px)}
.mini .ic{flex:none;width:48px;height:48px;border-radius:12px;background:var(--paper);display:grid;place-items:center;color:var(--navy)}
.mini .ic svg{width:26px;height:26px}
.mini b{display:block;color:var(--ink);font-size:1.02rem}
.mini span{color:var(--muted);font-size:.92rem}
@media (min-width:760px){.cats{grid-template-columns:1fr 1fr}.cat .stage{height:300px}.more{grid-template-columns:repeat(3,1fr)}}

/* passo a passo */
.steps-grid{display:grid;gap:0}
.steps-stage{position:sticky;top:66px;z-index:3;height:min(40vh,300px);margin:0 calc(var(--gut) * -1);background:linear-gradient(180deg,#cfe0f5,#e7eff9);border-bottom:4px solid var(--yellow)}
.steps{list-style:none;margin:0;padding:24px 0 0;display:grid;gap:14px;counter-reset:s}
.step{position:relative;background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.12);border-radius:var(--r);padding:22px 22px 22px 84px;min-height:150px;transition:background .35s,border-color .35s,transform .35s}
.step::before{counter-increment:s;content:counter(s);position:absolute;left:20px;top:20px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-style:italic;font-size:1.35rem;background:rgba(255,255,255,.1);color:#fff;transition:background .35s,color .35s}
.step h3{font-size:1.22rem;font-weight:800;margin-bottom:6px}
.step p{margin:0;color:#b9c8e2}
.steps-pad{height:26vh}
.step.is-on{background:#fff;border-color:#fff;transform:translateX(4px)}
.step.is-on h3{color:var(--navy)}.step.is-on p{color:var(--muted)}
.step.is-on::before{background:var(--yellow);color:var(--ink)}
.step .light{position:absolute;right:18px;top:24px;width:12px;height:12px;border-radius:50%;background:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 30%,transparent)}
@media (min-width:980px){
  .steps-grid{grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}
  .steps-stage{top:100px;height:min(74vh,620px);margin:0;border-radius:var(--r);border:0;box-shadow:var(--shadow);overflow:hidden}
  .steps{padding:8vh 0 0;gap:16vh}
  .step{min-height:0;padding-block:28px}
  .step:not(.is-on){opacity:.6}
  .steps-pad{height:34vh}
}

/* diferenciais */
.feats{display:grid;gap:14px}
.feat{background:#fff;border-radius:var(--r);padding:26px;box-shadow:0 1px 0 var(--line);border:1.5px solid var(--line)}
.feat .ic{width:54px;height:54px;border-radius:14px;background:var(--navy);color:var(--yellow);display:grid;place-items:center;margin-bottom:16px}
.feat .ic svg{width:28px;height:28px}
.feat h3{font-size:1.18rem;font-weight:800;color:var(--ink);margin-bottom:6px}
.feat p{margin:0;color:var(--muted)}
@media (min-width:760px){.feats{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.feats{grid-template-columns:repeat(4,1fr)}}

/* avaliações */
.reviews{display:grid;gap:22px;align-items:center;background:#fff;border-radius:28px;padding:30px 24px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.reviews::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:var(--yellow);opacity:.18}
.score{display:flex;align-items:center;gap:18px}
.score .num{font-size:4.2rem;font-weight:900;font-style:italic;color:var(--navy);line-height:1}
.stars{display:flex;gap:3px;color:var(--yellow)}
.stars svg{width:24px;height:24px}
.score small{display:block;color:var(--muted);font-weight:700;margin-top:4px}
.gbadge{display:inline-flex;align-items:center;gap:8px;font-weight:800;color:var(--ink)}
.gbadge svg{width:22px;height:22px}
.rev-actions{display:flex;flex-wrap:wrap;gap:12px;position:relative;z-index:1}
.rev-actions .btn{flex:1 1 220px}
@media (min-width:900px){.reviews{grid-template-columns:auto 1fr auto;padding:40px 44px;gap:40px}}

/* local */
.local{display:grid;gap:18px}
.map{border-radius:var(--r);overflow:hidden;min-height:320px;background:#dfe7f2;box-shadow:var(--shadow);position:relative}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.info{background:var(--navy-d);color:#fff;border-radius:var(--r);padding:28px;display:grid;gap:22px;align-content:start}
.info h3{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);font-weight:800;margin-bottom:8px}
.info p{margin:0;color:#dbe5f5}
.info a{color:#fff;font-weight:700}
.hours{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.hours li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed rgba(255,255,255,.14);padding-bottom:6px;color:#dbe5f5}
.hours b{color:#fff}
@media (min-width:900px){.local{grid-template-columns:1.5fr 1fr}.map{min-height:460px}}

/* faq */
.faq{display:grid;gap:12px;max-width:860px}
.faq details{background:#fff;border:1.5px solid var(--line);border-radius:var(--r-s);transition:border-color .2s}
.faq details[open]{border-color:var(--navy)}
.faq summary{list-style:none;cursor:pointer;padding:20px 56px 20px 20px;font-weight:800;color:var(--ink);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:20px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 7v10M7 12h10' stroke='%230f1520' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0;padding:0 20px 20px;color:var(--muted)}

/* cta final */
.final{background:var(--yellow);color:var(--ink);text-align:center;padding:72px 0}
.final h2{font-size:clamp(2.1rem,7vw,4rem)}
.final p{max-width:52ch;margin:14px auto 26px;font-weight:600}
.final .btn-navy{min-height:60px;padding:0 30px;font-size:1.08rem}

/* rodapé */
.foot{background:var(--navy-dd);color:#9fb2d0;padding:44px 0 110px;font-size:.92rem}
.foot .wrap{display:grid;gap:22px}
.foot img{height:30px;width:auto}
.foot a{color:#dbe5f5;text-decoration:none;font-weight:700}
.foot a:hover{text-decoration:underline}
.foot .row{display:flex;flex-wrap:wrap;gap:10px 22px}
.foot .by{border-top:1px solid rgba(255,255,255,.1);padding-top:18px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}
@media (min-width:760px){.foot{padding-bottom:44px}}

/* zap flutuante (mobile) */
.fab{position:fixed;right:16px;bottom:16px;z-index:60;width:60px;height:60px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;box-shadow:0 12px 28px -8px rgba(0,0,0,.45);transform:translateY(120px);transition:transform .35s ease}
.fab.show{transform:none}
.fab svg{width:32px;height:32px}

/* placeholder visível (o que o Pedro precisa preencher) */
.ph{background:#fff3c4;color:#6b4e00;border:1px dashed #d4a300;border-radius:6px;padding:0 6px;font-weight:700;font-style:normal}

/* revelar ao rolar */
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}
.no-js .rv{opacity:1;transform:none}

/* hero mobile: ilustração logo abaixo do título, acima da dobra */
@media (max-width:979px){
  .hero .wrap{gap:0;padding-bottom:30px}
  .hero-copy{display:contents}
  .hero .chip{order:1;justify-self:start}
  .hero h1{order:2}
  .hero-stage{order:3;height:min(78vw,330px);margin:4px calc(var(--gut) * -1) -6px}
  .hero .lead{order:4;margin-top:4px}
  .hero .ctas{order:5}
  .hero .price-tag{order:6;justify-self:start}
  .hero-trust{order:7}
}