:root{
  --red:#f4261f;
  --yellow:#FFC602;
  --dark:#050505;
  --text:#181818;
  --muted:#777;
  --base-width:1440;
  --initial-page-scale:1;
}

@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-VariableFont_opsz,wght.ttf") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-Italic-VariableFont_opsz,wght.ttf") format("woff2");
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px;background:#fff}
body{margin:0;overflow-x:hidden;background:#fff; font-family: "Inter", sans-serif;color:var(--text)}
a{text-decoration:none;color:inherit}
#page-stage{position:relative;width:100%;overflow:visible;background:#fff}
#page-canvas{position:relative;width:1440px;height:auto;min-height:0;transform-origin:top left;background:#fff;overflow:visible}



#inicio,
#como-funciona,
#comparacao,
#recursos,
#impacto,
#cta,
#duvidas,
#parceiros{
  scroll-margin-top:96px;
}

/* HERO */
.hero-section{position:relative;height:858px;background:transparent;color:#fff;overflow:hidden}
.hero-scene{position:absolute;left:0;top:0px;width:1440px;height:873px;background-image:url('../img/hero-scene.jpg');background-size:1440px 889px;background-position:center top;background-repeat:no-repeat}
.hero-left-shield{position:absolute;left:0;top:85px;width:770px;height:773px;background:linear-gradient(90deg,rgba(0,0,0,.985) 0%,rgba(0,0,0,.965) 50%,rgba(0,0,0,.78) 78%,rgba(0,0,0,.08) 100%);z-index:1}
.top-nav{
  position:fixed;
  z-index:10000;
  top:0;
  left:50%;
  width:min(1270px,calc(100vw - 40px));
  height:86px;
  display:flex;
  align-items:center;
  color:#fff;
  background:transparent;
  transform:translateX(-50%);
  isolation:isolate;
  transition:
    height .38s ease,
    background-color .38s ease,
    box-shadow .38s ease;
}
.top-nav::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  background:transparent;
  box-shadow:none;
  transform:translateX(-50%);
  transition:
    background-color .38s ease,
    box-shadow .38s ease;
}

.top-nav.is-scrolled{
  height:66px;
  background:var(--red);
  box-shadow:0 7px 22px rgba(0,0,0,.16);
}

.top-nav.is-scrolled::before{
  background:var(--red);
  box-shadow:0 7px 22px rgba(0,0,0,.16);
}
.brand{
  position:relative;
  display:block;
  width:164px;
  height:57px;
  flex:0 0 164px;
}
.brand-logo{
  position:absolute;
  inset:0;
  display:block;
  width:164px;
  height:57px;
  object-fit:contain;
  object-position:left center;
  transition:opacity .30s ease;
}
.brand-logo-top{opacity:1}
.brand-logo-scrolled{opacity:0}
.top-nav.is-scrolled .brand-logo-top{opacity:0}
.top-nav.is-scrolled .brand-logo-scrolled{opacity:1}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:38px;white-space:nowrap}
.nav-links a{
  font-size:14px;
  font-weight:700;
  line-height:1;
  color:#fff;
  transition:color .24s ease;
}
.nav-links a.is-active,
.nav-links a[aria-current="page"]{
  color:#fff000;
}
.nav-cta{margin-left:52px;width:185px;height:46px;border-radius:9px;background:var(--yellow);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#fff}
.hero-copy{position:absolute;z-index:5;left:173px;top:205px;width:650px}
.eyebrow{color:var(--yellow);font-size:15px;font-weight:800;letter-spacing:.04em;line-height:1}
.section-kicker{color:var(--red);font-size:15px;font-weight:800;letter-spacing:.04em;line-height:1}
.hero-copy h1{margin:26px 0 28px;font-size:63px;line-height:1.02;letter-spacing:-2.2px;font-weight:800;color:#fff}
.hero-copy p{margin:0;color:#fff;font-size:22px;line-height:1.55;font-weight:400}
.hero-actions{display:flex;gap:20px;margin-top:32px}
.hero-button{width:232px;height:63px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;color:#fff}
.hero-button.primary{background:var(--red);border:2px solid var(--red)}
.hero-button.secondary{background:rgba(0,0,0,.16);border:2px solid rgba(255,255,255,.75)}
.store-buttons{
  display:flex;
  align-items:center;
  gap:14px;
  width:354px;
  margin-top:34px;
}
.store-button{
  position:relative;
  z-index:1;
  display:block;
/*  width:170px;*/
  flex:0 0 170px;
  border-radius:18px;
  line-height:0;
  isolation:isolate;
  transition:transform .22s ease;
}
.store-button::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:7px 8px;
  border-radius:16px;
  background:rgba(255,255,255,.42);
  opacity:0;
  filter:blur(13px);
  transform:scale(.92);
  transition:opacity .22s ease,transform .22s ease;
  pointer-events:none;
}
.store-button img{
  position:relative;
  z-index:1;
  display:block;
  width:250px;
  height:auto;
  object-fit:contain;
}
@media (hover:hover) and (pointer:fine){
  .store-button:hover{
    transform:translateY(-2px);
  }
  .store-button:hover::before{
    opacity:1;
    transform:scale(1.06);
  }
}
.store-button:focus-visible{
  outline:2px solid rgba(255,255,255,.9);
  outline-offset:4px;
}
.hero-phone{position:absolute;z-index:4;left:785px;top:78px;height:660px;object-fit:fill}

/* FLOATING FOUR-COLUMN STRIP */
.features-strip{position:absolute;z-index:20;left:165px;top:823px;width:1110px;height:214px;background:#fff;border-radius:26px;box-shadow:0 18px 48px rgba(0,0,0,.09);display:grid;grid-template-columns:repeat(4,1fr);padding:34px 50px 28px}
.features-strip article{padding-left:14px}
.mini-icon{width:48px;height:48px;border-radius:50%;background:#fff4f3;display:flex;align-items:center;justify-content:center;color:var(--red);font-size:27px;margin-bottom:18px}
.features-strip h3{margin:0 0 12px;font-size:18px;line-height:1.1;font-weight:700}
.features-strip p{margin:0;color:#707070;font-size:15px;line-height:1.5}

/* HOW */
.how-section{position:relative;height:942px;background:#F7F7F7;overflow:hidden}
.how-copy{position:absolute;left:164px;top:264px;width:420px}
.section-kicker{font-size:15px}
.how-copy h2{margin:20px 0 34px;font-size:46px;line-height:1.04;letter-spacing:-1.2px;font-weight:800}
.how-copy h2 span{color:var(--red)}
.steps{list-style:none;margin:0;padding:0;position:relative}
.steps:before{content:"";position:absolute;left:29px;top:34px;width:1px;height:312px;background:#f4b2ae}
.steps li{position:relative;display:flex;align-items:flex-start;gap:24px;height:104px}
.step-number{position:relative;z-index:2;flex:0 0 59px;width:59px;height:59px;border:2px solid #f6d3d0;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--red);font-size:22px;font-weight:700}
.steps h3{margin:4px 0 8px;font-size:17px;line-height:1.1;font-weight:700}
.steps p{margin:0;color:#676767;font-size:15px;line-height:1.5}
.more-link{display:inline-flex;align-items:center;gap:17px;margin-top:16px;color:var(--red);font-size:12px;font-weight:800}
.process-visual{
  position:absolute;
  left:487px;
  top:324px;
  width:772px;
/*  height:682px;*/
  display:block;
}
.process-visual img{
  display:block;
  width:100%;
/*  height:100%;*/
  object-fit:fill;
}

/* COMPARE */
.compare-section{position:relative;height:465px;background:linear-gradient(90deg,#f7f9fc 0%,#f2f5f9 50%,#f8fafc 100%)}
.compare-copy{position:absolute;left:164px;top:92px;width:430px}
.compare-copy h2{margin:20px 0 28px;font-size:43px;line-height:1.05;letter-spacing:-1.1px;font-weight:800}
.compare-copy p{margin:0;color:#4e4e4e;font-size:15px;line-height:1.6}
.compare-cards{position:absolute;left:616px;top:49px;width:640px;height:263px;display:flex;align-items:center}
.compare-card{position:relative;width:293px;height:263px;border-radius:20px;background:rgba(255,255,255,.93);box-shadow:0 14px 40px rgba(73,88,111,.08);padding:32px 34px}
.compare-card h3{margin:0 0 23px;font-size:17px;line-height:1.1;font-weight:700}
.compare-card .muted{display:block;color:#a0a0a0;font-size:12px;margin-bottom:12px}
.compare-card strong{display:block;font-size:36px;line-height:1;font-weight:800;letter-spacing:-1px}
.compare-card strong.green{color:#17a53b}
.card-bottom{position:absolute;left:34px;bottom:31px;display:flex;flex-direction:column;gap:6px}
.card-bottom b{font-size:12px}.card-bottom small{font-size:11px;color:#999}
.card-icon{position:absolute;right:25px;bottom:25px;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:31px}
.card-icon.neutral{color:#525457;background:#f7f8fa}
.card-icon.success{color:#24b04d;background:#f0fff4}
.vs-circle{position:relative;z-index:3;margin:0 -5px;width:78px;height:78px;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px;font-weight:800;box-shadow:0 11px 22px rgba(244,38,31,.25)}

/* BENEFITS */
.benefits-section{position:relative;height:453px;background:#fff;text-align:center;padding-top:53px}
.centered{text-align:center}
.benefits-section h2{margin:20px 0 0;font-size:38px;line-height:1.05;letter-spacing:-1px;font-weight:800}
.benefits-grid{position:absolute;left:126px;top:160px;width:1188px;display:grid;grid-template-columns:repeat(6,1fr);gap:0}
.benefits-grid article{text-align:center}
.benefits-grid article>span{width:75px;height:75px;border-radius:50%;margin:0 auto 19px;background:#fff5f4;color:var(--red);display:flex;align-items:center;justify-content:center;font-size:34px}
.benefits-grid h3{margin:0 0 12px;font-size:14px;line-height:1.1;font-weight:700}
.benefits-grid p{margin:0;color:#777;font-size:14px;line-height:1.5}

/* IMPACT / PARALLAX */
.impact-section{position:relative;height:372px;color:#fff;background-image:url('../img/impact-bg.jpg');background-position:center;background-size:cover;background-repeat:no-repeat;background-attachment:fixed;overflow:hidden}
.impact-overlay{position:absolute;inset:0;background:rgba(0,0,0,.48)}
.impact-copy{position:absolute;z-index:2;left:164px;top:77px;width:500px}
.impact-copy h2{margin:25px 0 23px;font-size:44px;line-height:1.05;letter-spacing:-1px;font-weight:800}
.impact-copy p{margin:0;font-size:15px;line-height:1.65;color:#fff}
.impact-stats{position:absolute;z-index:2;left:670px;top:116px;width:616px;display:grid;grid-template-columns:repeat(3,1fr);column-gap:35px}
.impact-stats div{display:flex;flex-direction:column}
.impact-stats strong{font-size:44px;line-height:1;font-weight:900;white-space:nowrap}
.impact-stats span{margin-top:0px;font-size:18px;white-space:nowrap;text-align: center;}

/* CTA */
.cta-section{position:relative;height:376px;background:#f4261f;color:#fff;overflow:visible}
.cta-phone{position:absolute;z-index:3;left:168px;top:-99px;width:475px;height:475px;object-fit:fill}
.cta-copy{position:absolute;left:654px;top:43px;width:620px}
.cta-kicker{font-size:16px;line-height:1;font-weight:800;color:#FFE50A;margin-bottom:22px}
.cta-copy h2{margin:0 0 24px;font-size:42px;line-height:1.06;letter-spacing:-1px;font-weight:800}
.cta-copy img{display:block;width:354px;height:66px;object-fit:contain}

/* Botões das lojas na chamada final */
.cta-copy .store-buttons{
  width:560px;
  margin-top:20px;
  gap:18px;
  justify-content:flex-start;
}
.cta-copy .store-button{
  width:255px;
  max-width:none;
  flex:0 0 255px;
}
.cta-copy .store-button img{
  width:255px;
  max-width:255px;
  height:auto;
  object-fit:contain;
}

/* FOOTER */
.site-footer{height:61px;display:flex;align-items:center;position:relative;padding:0 157px;background:#fff;color:#555;font-size:13px}
.site-footer>span{width:400px}
.site-footer nav{position:absolute;left:650px;display:flex;gap:46px}
.site-footer nav a{color:#3f3f3f}
.socials{margin-left:auto;display:flex;align-items:center;gap:27px;font-size:15px;color:#111}

@media (max-width:700px){
  .impact-section{background-attachment:scroll}
}

/* Ajustes finais de proporção conforme a captura de referência 834 × 1886 */
.hero-left-shield{
  width:748px;
  background:linear-gradient(90deg,rgba(0,0,0,.995) 0%,rgba(0,0,0,.985) 76%,rgba(0,0,0,.72) 92%,rgba(0,0,0,.10) 100%);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px)
}
.hero-copy:before{
  content:"";position:absolute;z-index:-1;left:-30px;top:-35px;width:625px;height:515px;
/*  background:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.47) 73%,rgba(0,0,0,0));*/
  filter:blur(8px)
}
.features-strip{top:793px}
.how-copy{top:240px;width:472px}
.process-visual{top:234px}
.compare-copy{top:121px}
.compare-cards{top:78px}
.benefits-section{padding-top:82px}
.benefits-grid{top:189px}
.impact-section{
  background-image:url('../img/impact-exact.jpg');
  background-size:1440px 372px;
  background-position:center center;
  background-repeat:no-repeat;
  background-attachment:fixed
}
.impact-section:before{
  content:"";position:absolute;inset:0;z-index:0;
  background:url('../img/impact-exact.jpg') center/1440px 372px no-repeat
}
.impact-overlay{z-index:1;background:rgba(0,0,0,.08)}
.impact-copy:before{
  content:"";position:absolute;z-index:-1;left:-24px;top:-18px;width:510px;height:235px;
  background:rgba(1,14,7,.28);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)
}
.impact-stats{left:686px}
.impact-stats:before{
  content:"";position:absolute;z-index:-1;left:-25px;top:-20px;width:660px;height:145px;
  background:rgba(1,14,7,.22);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)
}

/* Refinamento de acabamento visual */
.hero-scene{background-image:url('../img/hero-scene-soft.jpg')}
.hero-left-shield{
  width:805px;
  background:linear-gradient(90deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.48) 55%,rgba(0,0,0,.20) 82%,rgba(0,0,0,0) 100%);
  -webkit-backdrop-filter:none;backdrop-filter:none
}
/*.hero-copy:before{background:linear-gradient(90deg,rgba(0,0,0,.44),rgba(0,0,0,.18) 72%,rgba(0,0,0,0));filter:blur(12px)}*/
.hero-copy h1{font-size:48px}
.how-copy{z-index:3}
.process-visual{z-index:1}
.impact-section{background-image:url('../img/impact-clean.jpg');background-size:1440px 372px}
.impact-section:before{background:url('../img/impact-clean.jpg') center/1440px 372px no-repeat}
.impact-overlay{background:rgba(0,0,0,.08)}
.impact-copy:before,.impact-stats:before{display:none}
/*.cta-phone{top:0;height:223px}*/
.cta-copy h2{font-size:40px}

/* Microajustes de alinhamento da composição principal */
.hero-copy{top:125px}
.hero-copy h1{margin-bottom:33px}
.hero-actions{margin-top:36px}
.hero-phone{top:85px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 17%,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 17%,#000 100%)}
.impact-overlay{background:rgba(0,0,0,.08)}

/* PARALLAX REAL — camada fixa fora do elemento escalado */
#impact-parallax-bg {
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0;
  clip-path:inset(100% 0 0 0);
  -webkit-clip-path:inset(100% 0 0 0);
  background-color:#0b180e;
  background-image:url('../img/impact-bg.jpg');
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  transition:none;
  will-change:opacity,clip-path;
}

/* O canvas usa transform: scale(). Por isso, o fundo fixo precisa ficar fora dele. */
#page-stage {
  z-index: 1;
  background: transparent;
}

#page-canvas {
  background: transparent;
}

.impact-section {
  position: relative;
  height: 422px;
  color: #ffffff;
  background: transparent !important;
  overflow: hidden;
  isolation: isolate;
}

.impact-section::before {
  content: none !important;
  display: none !important;
  background: none !important;
}

.impact-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 0, 0, 0.08);
  pointer-events: none;
}

.impact-copy,
.impact-stats {
  z-index: 2;
}


/* PARALLAX — SEÇÃO COMPARAÇÃO */
#compare-parallax-bg {
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0;
  clip-path:inset(100% 0 0 0);
  -webkit-clip-path:inset(100% 0 0 0);
  background-color:#eef1f5;
  background-image:url('../img/hero-scene-soft.jpg');
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  filter:saturate(.82) brightness(1.14);
  transform:translate3d(0,0,0) scale(1.08);
  transition:none;
  will-change:transform,opacity,clip-path;
}

.compare-section {
  position: relative;
  height: 465px;
  background: transparent !important;
  overflow: hidden;
  isolation: isolate;
}

.compare-section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,.24) 0%,
      rgba(0,0,0,.17) 43%,
      rgba(0,0,0,.10) 100%);
  -webkit-backdrop-filter: blur(1px);
  backdrop-filter: blur(1px);
}

.compare-copy,
.compare-cards {
  z-index: 2;
}

@media (max-width: 700px) {
  #compare-parallax-bg {
    inset:0;
    background-position:62% center;
    filter:saturate(.78) brightness(1.12);
  }

  .compare-section::before {
    background: rgba(0,0,0,.20);
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px);
  }
}

@media (prefers-reduced-motion: reduce) {
  #compare-parallax-bg {
    transform: none !important;
    transition: none;
  }
}

/* Botão do menu mobile — invisível no layout desktop */
.menu-toggle{
  display:none;
  width:44px;
  height:44px;
  padding:10px;
  border:0;
  border-radius:0;
  outline:0;
  background:transparent;
  box-shadow:none;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
}
.menu-toggle:hover,
.menu-toggle:active,
.menu-toggle:focus{
  background:transparent;
  box-shadow:none;
}
.menu-toggle:focus-visible{
  outline:2px solid rgba(255,255,255,.72);
  outline-offset:2px;
}
.menu-toggle span{
  display:block;
  width:24px;
  height:2px;
  margin:5px 0;
  border-radius:2px;
  background:#fff;
  transition:transform .2s ease,opacity .2s ease;
}



/* Navegação fixa em telas intermediárias sem apertar ou cortar os links */
@media (min-width:1101px) and (max-width:1399px){
  .top-nav{width:calc(100vw - 36px)}
  .brand{width:150px;height:52px;flex-basis:150px}
  .brand-logo{width:150px;height:52px}
  .nav-links{gap:18px}
  .nav-links a{font-size:13px}
  .nav-cta{width:165px;margin-left:24px;font-size:11px}
}

/* Layout mobile real: não reduz a página desktop inteira */
@media (max-width:1100px){
  html{scroll-padding-top:84px}
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  body{font-size:16px}

  #impact-parallax-bg{display:none!important}
  #page-stage{
    width:100%;
    height:auto!important;
    overflow:visible;
    background:#fff;
  }
  #page-canvas{
    width:100%;
    height:auto;
    min-height:0;
    overflow:visible;
    transform:none!important;
    background:#fff;
  }

  /* Navegação */
  .top-nav{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:76px;
    padding:10px 20px;
    justify-content:space-between;
    background:transparent;
    transform:none;
  }
  .top-nav.is-scrolled{
    height:66px;
    background:var(--red);
  }
  .top-nav::before{display:none}
  .brand{
    width:128px;
    height:45px;
    flex:0 0 128px;
  }
  .brand-logo{
    width:128px;
    height:45px;
  }
  .menu-toggle{display:block;position:relative;z-index:30;margin-left:auto}
  .menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-toggle.is-open span:nth-child(2){opacity:0}
  .menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav-links{
    display:none;
    position:absolute;
    z-index:25;
    top:76px;
    left:14px;
    right:14px;
    margin:0;
    padding:14px;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    white-space:normal;
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    background:#111;
    box-shadow:0 18px 42px rgba(0,0,0,.38);
  }
  .top-nav.is-scrolled .nav-links{
    top:66px;
  }
  .nav-links.is-open{display:flex}
  .nav-links a{
    display:block;
    padding:14px 12px;
    font-size:15px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .nav-links a:last-child{border-bottom:0}
  .nav-cta{display:none}

  /* Hero */
  .hero-section{
    height:auto;
    min-height:0;
    padding-top:76px;
    padding-bottom:18px;
    background:linear-gradient(90deg,#64170f 0%,#a82016 34%,#db261c 68%,#f4261f 100%);
  }
  .hero-scene{
    top:0px;
    left:0;
    width:100%;
    height:calc(100% - 0px);
    background-size:cover;
    background-position:64% center;
    opacity:.6;
  }
  .hero-left-shield{
    top:76px;
    width:100%;
    height:calc(100% - 76px);
    background:linear-gradient(180deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.68) 47%,rgba(0,0,0,.34) 72%,rgba(0,0,0,.55) 100%);
  }
  .hero-copy{
    position:relative;
    z-index:5;
    left:auto;
    top:auto;
    width:auto;
    padding:32px 22px 0;
    text-align:left;
  }
  .hero-copy:before{display:none}
  .eyebrow,.section-kicker{font-size:14px;line-height:1.35}
  .hero-copy h1{
    margin:18px 0 22px;
    font-size:clamp(40px,12vw,58px);
    line-height:1.02;
    letter-spacing:-1.5px;
  }
  .hero-copy p{
    max-width:580px;
    font-size:19px;
    line-height:1.58;
  }
  .hero-copy p br,
  .how-copy p br,
  .compare-copy p br,
  .benefits-grid p br,
  .impact-copy p br{display:none}
  .hero-actions{
    width:100%;
    margin-top:28px;
    gap:12px;
  }
  .hero-button{
    flex:1 1 0;
    width:auto;
    height:54px;
    font-size:14px;
  }
  .store-buttons{
    width:min(100%,360px);
    margin-top:26px;
    gap:12px;
  }
  .store-button{
    width:calc(50% - 6px);
    flex:0 1 calc(50% - 6px);
    max-width:170px;
  }
  .hero-phone{
    position:relative;
    z-index:4;
    display:block;
    left:auto;
    top:auto;
    width:min(100%,520px);
    max-width:none;
    height:auto;
/*    margin:18px -16% -36px auto;*/
    object-fit:contain;
    -webkit-mask-image:none;
    mask-image:none;
  }

  /* Diferenciais */
  .features-strip{
    position:relative;
    z-index:10;
    left:auto;
    top:auto;
    width:calc(100% - 28px);
    height:auto;
    margin:-8px auto 0;
    padding:26px 20px;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:28px 18px;
    border-radius:20px;
    margin-top: -30px;
  }
  .features-strip article{padding-left:0;text-align:center}
  .mini-icon{margin:0 auto 12px}
  .features-strip h3{font-size:16px;margin-bottom:8px}
  .features-strip p{font-size:15px;line-height:1.5}

  /* Como funciona */
  .how-section{
    display:flex;
    flex-direction:column;
    height:auto;
    padding:74px 20px 42px;
    overflow:hidden;
  }
  .how-copy{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    max-width:640px;
    margin:0 auto;
  }
  .how-copy h2{
    margin:14px 0 30px;
    font-size:38px;
    line-height:1.08;
  }
  .steps:before{left:25px;top:30px;height:calc(100% - 72px)}
  .steps li{height:auto;min-height:104px;gap:18px;padding-bottom:18px}
  .step-number{flex-basis:52px;width:52px;height:52px;font-size:19px}
  .steps h3{font-size:18px;margin-top:2px}
  .steps p{font-size:16px;line-height:1.55}
  .more-link{font-size:12px;margin-top:8px}
  .process-visual{
    position:relative;
    left:auto;
    top:auto;
    order:2;
    width:100%;
    max-width:none;
    height:auto;
    margin:18px -25% -10px;
  }
  .process-visual img{
    display:block;
    width:100%;
    height:auto;
    object-fit:contain;
  }

  /* Comparação */
  .compare-section{
    height:auto;
    padding:58px 20px 62px;
  }
  .compare-copy{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    max-width:620px;
    margin:0 auto 34px;
  }
  .compare-copy h2{margin:14px 0 20px;font-size:36px;line-height:1.08}
  .compare-copy p{font-size:16px;line-height:1.6}
  .compare-cards{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    height:auto;
    max-width:440px;
    margin:0 auto;
    flex-direction:column;
  }
  .compare-card{
    width:100%;
    height:235px;
    padding:28px 26px;
  }
  .compare-card h3{font-size:18px;margin-bottom:18px}
  .compare-card .muted{font-size:13px}
  .compare-card strong{font-size:38px}
  .card-bottom{left:26px;bottom:26px}
  .card-bottom b{font-size:13px}.card-bottom small{font-size:12px}
  .vs-circle{
    flex:0 0 62px;
    width:62px;
    height:62px;
    margin:-7px 0;
    font-size:17px;
  }

  /* Benefícios */
  .benefits-section{
    height:auto;
    padding:62px 18px 58px;
  }
  .benefits-section h2{margin:14px auto 40px;font-size:34px;line-height:1.1;max-width:560px}
  .benefits-grid{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    max-width:660px;
    margin:0 auto;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:38px 18px;
  }
  .benefits-grid article>span{width:68px;height:68px;margin-bottom:15px;font-size:30px}
  .benefits-grid h3{font-size:15px;margin-bottom:8px}
  .benefits-grid p{font-size:15px;line-height:1.5}

  /* Impacto */
  .impact-section{
    display:block;
    height:auto;
    min-height:0;
    padding:58px 22px;
    background-image:linear-gradient(rgba(0,0,0,.08),rgba(0,0,0,.08)),url('../img/impact-bg.jpg')!important;
    background-size:cover!important;
    background-position:center!important;
  }
  .impact-overlay{display:none}
  .impact-copy{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    max-width:620px;
    margin:0 auto;
  }
  .impact-copy h2{margin:16px 0 20px;font-size:37px;line-height:1.08}
  .impact-copy p{font-size:16px;line-height:1.65}
  .impact-stats{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    max-width:620px;
    margin:38px auto 0;
    grid-template-columns:1fr;
    gap:28px;
  }
  .impact-stats div{align-items:flex-start}
  .impact-stats strong{font-size:36px;white-space:normal}
  .impact-stats span{margin-top:8px;font-size:16px;white-space:normal}

  /* Chamada final */
  .cta-section{
    display:flex;
    flex-direction:column-reverse;
    height:auto;
    overflow:hidden;
    padding:50px 20px 0;
    text-align:center;
  }
  .cta-copy{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    max-width:620px;
    margin:0 auto;
  }
  .cta-kicker{font-size:11px;margin-bottom:16px}
  .cta-copy h2{font-size:34px;line-height:1.1;margin-bottom:22px}
  .cta-copy img{width:min(100%,320px);height:auto;margin:0 auto}
  .cta-copy .store-buttons{
    width:100%;
    margin-top:22px;
    align-items:center;
    justify-content:center;
    gap:12px;
  }
  .cta-copy .store-button{
    width:250px;
    max-width:100%;
    flex:0 0 auto;
  }
  .cta-copy .store-button img{
    width:100%;
    max-width:250px;
    height:auto;
    margin:0;
  }
  .cta-phone{
    position:relative;
    left:auto;
    top:auto;
    width:min(125%,520px);
    height:auto;
    margin:24px auto -2px;
    object-fit:contain;
  }

  /* Rodapé */
  .site-footer{
    height:auto;
    min-height:0;
    padding:30px 20px;
    flex-direction:column;
    gap:22px;
    text-align:center;
    font-size:15px;
  }
  .site-footer>span{width:auto}
  .site-footer nav{
    position:relative;
    left:auto;
    flex-direction:column;
    gap:14px;
  }
  .socials{margin-left:0;gap:25px;font-size:19px}
}

@media (max-width:700px){
  .store-buttons{
    width:100%;
    flex-direction:column;
    align-items:center;
    gap:12px;
  }
  .store-button{
    width:250px;
    max-width:100%;
    flex:0 0 auto;
  }
  .store-button img{
    width:100%;
    max-width:250px;
    height:auto;
  }
}

@media (max-width:420px){
  .hero-copy{padding-left:18px;padding-right:18px}
  .hero-actions{flex-direction:column}
  .hero-button{flex:none;width:100%}
  .features-strip{grid-template-columns:1fr;padding-left:24px;padding-right:24px}
  .benefits-grid{grid-template-columns:1fr}
  .compare-card{height:228px}
}

/* O parallax fixo da comparação é exclusivo do desktop.
   No mobile a própria seção usa o fundo estático e o layout empilhado. */
@media (max-width:1100px){
  #compare-parallax-bg{display:none!important;opacity:0!important}
  .compare-section{
    background:
      linear-gradient(rgba(0,0,0,.20),rgba(0,0,0,.20)),
      url('../img/hero-scene-soft.jpg') 62% center/cover no-repeat!important;
  }
}

/* =========================================================
   ENTRADA DOS ELEMENTOS DURANTE A ROLAGEM
   ========================================================= */
html.reveal-enabled .reveal-item{
  opacity:0;
  transform:translate3d(0,46px,0);
  transition:
    opacity .72s cubic-bezier(.22,.61,.36,1),
    transform .82s cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--reveal-delay,0ms);
  will-change:opacity,transform;
}

html.reveal-enabled .reveal-item.reveal-left{
  transform:translate3d(-58px,0,0);
}

html.reveal-enabled .reveal-item.reveal-right{
  transform:translate3d(58px,0,0);
}

html.reveal-enabled .reveal-item.reveal-up{
  transform:translate3d(0,46px,0);
}

html.reveal-enabled .reveal-item.reveal-scale{
  transform:translate3d(0,28px,0) scale(.96);
}

html.reveal-enabled .reveal-item.is-visible{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}

/* Evita que o hover dos botões interfira na animação do bloco. */
html.reveal-enabled .store-buttons.reveal-item{
  will-change:opacity,transform;
}

@media (max-width:1100px){
  html.reveal-enabled .reveal-item{
    transform:translate3d(0,30px,0);
    transition-duration:.64s,.72s;
  }

  html.reveal-enabled .reveal-item.reveal-left{
    transform:translate3d(-30px,0,0);
  }

  html.reveal-enabled .reveal-item.reveal-right{
    transform:translate3d(30px,0,0);
  }

  html.reveal-enabled .reveal-item.reveal-scale{
    transform:translate3d(0,22px,0) scale(.97);
  }

  html.reveal-enabled .reveal-item.is-visible{
    transform:translate3d(0,0,0) scale(1);
  }
}

@media (prefers-reduced-motion:reduce){
  html.reveal-enabled .reveal-item,
  html.reveal-enabled .reveal-item.reveal-left,
  html.reveal-enabled .reveal-item.reveal-right,
  html.reveal-enabled .reveal-item.reveal-up,
  html.reveal-enabled .reveal-item.reveal-scale{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}


/* O rodapé permanece visível: ele fica no limite máximo da rolagem
   e não deve receber deslocamento inicial do efeito reveal. */
html.reveal-enabled .site-footer .reveal-item{
  opacity:1!important;
  transform:none!important;
  transition:none!important;
}


/* AJUSTE FINAL — NOVA IMAGEM DO PARALLAX DE IMPACTO */
#impact-parallax-bg{
  background-color:#f4261f;
  background-image:url('../img/impact-bg.jpg')!important;
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
}

.impact-overlay{
  background:rgba(0,0,0,.48)!important;
}

.impact-copy,
.impact-stats{
  text-shadow:0 2px 8px rgba(0,0,0,.28);
}

@media (max-width:1100px){
  .impact-section{
    background-image:
      linear-gradient(rgba(0,0,0,.08),rgba(0,0,0,.08)),
      url('../img/impact-bg.jpg')!important;
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
  }
}


/* AJUSTE FINAL — PARALLAX DA COMPARAÇÃO COM OVERLAY PRETO LEVE */
.compare-copy h2,
.compare-copy p{
  color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.34);
}

.compare-card h3,
.compare-card .muted,
.compare-card strong,
.compare-card .card-bottom{
  text-shadow:none;
}

@media (max-width:1100px){
  .compare-copy h2,
  .compare-copy p{
    color:#fff;
  }
}


/* =========================================================
   ALTURA TOTAL LIVRE — O CONTEÚDO DEFINE O TAMANHO DA PÁGINA
   ========================================================= */
#page-stage{
  overflow:visible;
}

#page-canvas{
  height:auto!important;
  min-height:0;
  overflow:visible;
}



/* Evita a faixa branca antes do JavaScript carregar */
@media (min-width:1101px){
  #page-stage{
    width:100%;
    overflow:hidden;
  }

  #page-canvas{
    transform:scale(var(--initial-page-scale));
    transform-origin:top left;
  }
}

/* =========================================================
   RECORTE EXATO DOS PARALLAXES
   Cada fundo fixed só aparece dentro da respectiva section.
   ========================================================= */
@media (min-width:1101px){
  #compare-parallax-bg,
  #impact-parallax-bg{
    clip-path:inset(100% 0 0 0);
    -webkit-clip-path:inset(100% 0 0 0);
  }
}


/* =========================================================
   BOTÃO FIXO — IR PARA O TOPO
   ========================================================= */
.back-to-top{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:9999;
  width:46px;
  height:46px;
  padding:0;
  border:1px solid rgba(255,255,255,.22);
  border-radius:50%;
  outline:0;
  background:rgba(12,12,12,.76);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:19px;
  line-height:1;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(0,10px,0);
  box-shadow:0 7px 22px rgba(0,0,0,.22);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  cursor:pointer;
  transition:
    opacity .22s ease,
    visibility .22s ease,
    transform .22s ease,
    background .22s ease,
    border-color .22s ease;
}

.back-to-top.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate3d(0,0,0);
}

.back-to-top:hover{
  background:rgba(244,38,31,.92);
  border-color:rgba(255,255,255,.42);
}

.back-to-top:focus-visible{
  outline:2px solid rgba(244,38,31,.95);
  outline-offset:3px;
}

.back-to-top i{
  display:block;
  line-height:1;
}

@media (max-width:1100px){
  .back-to-top{
    right:16px;
    bottom:16px;
    width:42px;
    height:42px;
    font-size:18px;
  }
}

@media (prefers-reduced-motion:reduce){
  .back-to-top{
    transition:none;
  }
}


/* =========================================================
   MENU TRANSPARENTE NO TOPO
   O vermelho abaixo vem do próprio fundo do hero.
   ========================================================= */
.top-nav:not(.is-scrolled){
  background:transparent!important;
  box-shadow:none!important;
}

.top-nav:not(.is-scrolled)::before{
  background:transparent!important;
  box-shadow:none!important;
}




/* REMOVE COMPLETAMENTE O DEGRADÊ ESCURO DO HERO */
.hero-left-shield{
  background:transparent!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* =========================================================
   IMPACTO CENTRALIZADO + CONTADORES PROGRESSIVOS
   ========================================================= */
@media (min-width:1101px){
  .impact-section{
    height:522px;
  }

  .impact-copy{
    left:0;
    right:0;
    top:98px;
    width:900px;
    margin:0 auto;
    text-align:center;
  }

  .impact-copy h2{
    margin:18px 0 16px;
  }

  .impact-copy p{
    margin-left:auto;
    margin-right:auto;
  }

  .impact-stats{
    left:0;
    right:0;
    top:350px;
    width:900px;
    margin:0 auto;
    grid-template-columns:repeat(3,minmax(0,1fr));
    column-gap:34px;
    text-align:center;
  }

  .impact-stats div{
    align-items:center;
    justify-content:flex-start;
  }

  .impact-stats strong{
    width:100%;
    text-align:center;
  }

  .impact-stats span{
    width:100%;
    text-align:center;
  }
}

.impact-counter{
  font-variant-numeric:tabular-nums;
}

@media (max-width:1100px){
  .impact-copy{
    text-align:center;
  }

  .impact-stats{
    text-align:center;
  }

  .impact-stats div{
    align-items:center;
  }

  .impact-stats strong,
  .impact-stats span{
    width:100%;
    text-align:center;
  }
}


/* =========================================================
   CONTATO - PARALLAX REAL COM FUNDO FIXO
   Imagem: img/contact-bg.jpg
   ========================================================= */
#contact-parallax-bg{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:0;
  clip-path:inset(100% 0 0 0);
  -webkit-clip-path:inset(100% 0 0 0);
  background-color:#171717;
  background-image:url('../img/contact-bg.jpg');
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  transition:none;
  will-change:opacity,clip-path;
}

.contact-parallax-section{
  position:relative;
  height:390px;
  color:#fff;
  background:transparent!important;
  overflow:hidden;
  isolation:isolate;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.contact-parallax-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.55);
  pointer-events:none;
}

.contact-parallax-copy{
  position:relative;
  z-index:2;
  width:min(820px,calc(100% - 80px));
  margin:0 auto;
  text-shadow:0 2px 10px rgba(0,0,0,.38);
}

.contact-kicker{
  margin-bottom:16px;
  color:var(--yellow);
  font-size:14px;
  font-weight:800;
  letter-spacing:.08em;
  line-height:1;
}

.contact-parallax-copy h2{
  margin:0 0 30px;
  font-size:44px;
  line-height:1;
  font-weight:800;
  letter-spacing:-1px;
}

.contact-parallax-copy p{
  margin:0 0 8px;
  color:#fff;
  font-size:22px;
  line-height:1.45;
  font-weight:600;
}

.contact-parallax-copy a{
  display:inline-block;
  color:var(--yellow);
  font-size:27px;
  line-height:1.3;
  font-weight:800;
  transition:opacity .22s ease,transform .22s ease;
}

.contact-parallax-copy a:hover{
  opacity:.9;
  transform:translateY(-1px);
}

@media (min-width:1101px){
  #contact-parallax-bg{
    clip-path:inset(100% 0 0 0);
    -webkit-clip-path:inset(100% 0 0 0);
  }
}

@media (max-width:1100px){
  #contact-parallax-bg{
    display:none!important;
    opacity:0!important;
  }

  .contact-parallax-section{
    height:auto;
    min-height:360px;
    padding:72px 22px;
    background:
      linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),
      url('../img/contact-bg.jpg') center/cover no-repeat!important;
  }

  .contact-parallax-overlay{
    display:none;
  }

  .contact-parallax-copy{
    width:100%;
    max-width:620px;
  }

  .contact-parallax-copy h2{
    margin-bottom:24px;
    font-size:38px;
  }

  .contact-parallax-copy p{
    font-size:18px;
  }

  .contact-parallax-copy a{
    font-size:23px;
    overflow-wrap:anywhere;
  }
}

@media (max-width:420px){
  .contact-parallax-section{
    min-height:330px;
    padding:60px 18px;
  }

  .contact-parallax-copy h2{
    font-size:34px;
  }

  .contact-parallax-copy p{
    font-size:17px;
  }

  .contact-parallax-copy a{
    font-size:20px;
  }
}