*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: auto; }
#oferta { scroll-margin-top: 100px; }
body { font-family: 'Inter', sans-serif; background-color: #050b17; color: white; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.floating-cta { position: fixed; z-index: 1000; right: 24px; bottom: 24px; }
.floating-cta[hidden] { display: none; }
.floating-cta-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 54px; padding: 12px 24px; border-radius: 999px;
  background: #0077ff; color: #fff; font-size: 14px; font-weight: 800;
  text-decoration: none; box-shadow: 0 10px 28px rgba(0, 82, 190, .32);
}
.floating-cta-button:hover { background: #0066e0; }
.floating-cta-button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 767px) {
  .floating-cta { left: 0; right: 0; bottom: 0; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(5, 11, 23, .94); box-shadow: 0 -5px 24px rgba(0, 0, 0, .2); }
  .floating-cta-button { width: 100%; min-height: 50px; }
  body:has(.floating-cta:not([hidden])) #notif-popup { bottom: calc(76px + env(safe-area-inset-bottom)) !important; }
}
.cta-pulse { animation: cta-pulse 2.4s ease-in-out infinite; transform-origin: center; }
.cta-pulse:hover, .cta-pulse:focus-visible { animation-play-state: paused; scale: 1.035; }
@keyframes cta-pulse {
  0%, 100% { scale: 1; }
  50% { scale: 1.035; }
}
@media (prefers-reduced-motion: reduce) {
  .cta-pulse { animation: none; }
  .cta-pulse:hover, .cta-pulse:focus-visible { scale: 1; }
}
    
    .text-gradient-primary { color: #0070f3; }
    .text-gradient-gold { background: linear-gradient(90deg, #c8a700, #f5c518 60%, #c8a700); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
    .bg-radial-hero { background: #050b17; }
    .tb-grid-bg { background-image: linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px); background-size: 92px 92px; }
    .animate-notif-slide-in { animation: notifSlideIn 0.5s ease-out forwards; }
    .animate-notif-slide-out { animation: notifSlideOut 0.5s ease-in forwards; }
    @keyframes notifSlideIn { from { transform: translateX(-110%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
    @keyframes notifSlideOut { from { transform: translateX(0); opacity: 1; } to { transform: translateX(-110%); opacity: 0; } }


/* Evita que o navegador tente compensar mudanças de layout durante o CTA. */
html.cta-scrolling,
html.cta-scrolling body { overflow-anchor: none; }

/* Reserva espaço para imagens lazy-load que ficam antes da oferta.
   Assim a posição da seção #oferta não muda enquanto o usuário desce. */
#testimonials { padding-top: 64px !important; padding-bottom: 64px !important; }
#testimonials h2 { margin-bottom: 26px !important; }
#testimonials #test-dots { margin-top: 18px !important; }
#test-slider, #test-slider > div { min-height: 406px; }
#test-slider img { max-height: 390px !important; }

/* Faixa contínua das páginas de amostra. Os dois conjuntos iguais fecham o loop sem salto. */
.samples-viewport { width: 100%; }
#samples-slider.samples-track {
  display: flex;
  width: max-content;
  animation: samples-flow 28s linear infinite;
  will-change: transform;
}
.samples-set {
  display: flex;
  align-items: center;
  gap: 18px;
  flex: none;
  padding-right: 18px;
}
.sample-page {
  display: block;
  width: auto;
  max-width: none;
  height: 500px;
  border-radius: 12px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, .3);
}
#bonuses-container {
  max-width: 780px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid #d7e6fa;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(0, 63, 140, .1);
  text-align: left;
}
.bonus-collage { display: block; width: 100%; height: auto; }
.bonus-list { list-style: none; margin: 0; padding: 22px 34px 28px; background: #0b1628; }
.bonus-list li {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 15px 0;
  border-bottom: 1px solid #e5edf7;
  color: #f5c518;
  font-size: 18px;
  font-weight: 650;
  line-height: 1.3;
}
.bonus-list li:last-child { border-bottom: 0; }
.bonus-gift { flex: none; font-size: 22px; line-height: 1; }
#ideal-para h2 {
  font-size: clamp(12px, 3.5vw, 44px) !important;
  white-space: nowrap;
}
@keyframes samples-flow { to { transform: translate3d(-50%, 0, 0); } }
@media (prefers-reduced-motion: reduce) {
  #samples-slider.samples-track { animation: none; }
}

/* =========================================================
   RESPONSIVIDADE / MOBILE
   Mantém o desktop intacto e deixa a página mais compacta
   em celulares, reduzindo altura e mudanças de layout.
   ========================================================= */
img { max-width: 100%; height: auto; }
#promo-banner { position: absolute; }

/* Título e arte visíveis na primeira tela, mantendo o hero centralizado. */
@media (min-width: 768px) {
  #hero { padding-top: clamp(68px, 8svh, 88px) !important; }
  #hero > div:nth-of-type(1) { padding-bottom: 0 !important; }
  #hero h1 {
    font-size: clamp(28px, min(2.9vw, 5svh), 38px) !important;
    line-height: 1.04 !important;
  }
  #hero > div:nth-of-type(2) {
    width: min(100%, 66svh, 700px);
    margin-top: clamp(8px, 1.4svh, 16px) !important;
  }
  #hero > div:nth-of-type(3) {
    padding-top: 12px !important;
    padding-bottom: 48px !important;
  }
  #hero p {
    font-size: clamp(15px, 1.4vw, 17px) !important;
    line-height: 1.45 !important;
  }
  #hero .mt-9 { margin-top: 14px; }
}

@media (max-width: 767px) {
  html { scroll-padding-top: 0; }
  #oferta { scroll-margin-top: 24px; }

  #hero {
    min-height: auto !important;
    padding-top: clamp(56px, 7svh, 68px) !important;
  }
  #hero > div:nth-of-type(1) {
    padding-left: 18px !important;
    padding-right: 18px !important;
    padding-bottom: 0 !important;
  }
  #hero > div:nth-of-type(2) {
    width: min(85vw, 320px);
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-top: 8px !important;
  }
  #hero > div:nth-of-type(3) {
    padding-left: 18px !important;
    padding-right: 18px !important;
    padding-top: 12px !important;
    padding-bottom: 48px !important;
  }
  #hero h1 {
    font-size: clamp(21px, 5.7vw, 26px) !important;
    line-height: 1.06 !important;
  }
  #hero h1 br { display: none; }
  #hero p {
    font-size: 15px !important;
    line-height: 1.55 !important;
  }
  #hero .btn-oferta {
    min-height: 46px;
    height: 46px !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
    font-size: 13px !important;
  }

  /* Espaçamento vertical das seções */
  #recursos,
  #trusted-by,
  #recursos-detalhe,
  #testimonials,
  #oferta,
  #garantia {
    padding-top: 54px !important;
    padding-bottom: 54px !important;
  }
  #faq {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  #testimonials { padding-top: 36px !important; padding-bottom: 36px !important; }

  /* Títulos */
  #recursos h2,
  #trusted-by h2,
  #recursos-detalhe h2,
  #testimonials h2,
  #oferta .oferta-titulo,
  #faq h2,
  #garantia h2 {
    font-size: clamp(26px, 7.5vw, 32px) !important;
    line-height: 1.1 !important;
  }
  #recursos h2,
  #recursos-detalhe h2,
  #testimonials h2 { margin-bottom: 22px !important; }

  /* Cards de benefícios */
  #recursos article {
    padding: 22px 18px !important;
    border-radius: 20px !important;
  }
  #recursos article > div:first-child {
    width: 56px !important;
    height: 56px !important;
    margin-bottom: 16px !important;
  }
  #recursos article h3 { font-size: 18px !important; margin-bottom: 8px !important; }
  #recursos article p { font-size: 14px !important; line-height: 1.55 !important; }

  /* Amostras e depoimentos: ocupam menos altura */
  #testimonials .overflow-hidden {
    margin-left: 38px !important;
    margin-right: 38px !important;
  }
  #test-slider,
  #test-slider > div {
    min-height: 356px !important;
  }
  #test-slider img {
    max-height: 340px !important;
    width: auto !important;
    object-fit: contain;
  }
  #trusted-by .mt-14 { margin-top: 32px !important; }
  #trusted-by .mt-10 { margin-top: 26px !important; }
  #samples-slider.samples-track { animation-duration: 19s; }
  .sample-page { height: 340px; }

  .bonus-list { padding: 14px 20px 20px; }
  .bonus-list li { gap: 12px; padding: 13px 0; font-size: 15px; }

  /* Oferta */
  #oferta > div > .text-center { margin-bottom: 28px !important; }
  #oferta .pricing-packages-grid { gap: 24px !important; }
  #oferta .pricing-packages-grid > div {
    padding: 22px 18px !important;
    border-radius: 22px !important;
  }
  #oferta #pacote-basico { margin-top: 0 !important; }
  #oferta .text-\[48px\] { font-size: 42px !important; }
  #oferta .text-\[3\.5rem\] { font-size: 46px !important; }
  #oferta .pricing-packages-grid img[alt="Pacote Completo"] { max-width: 260px !important; }
  #oferta .min-h-\[60px\] {
    min-height: 52px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    font-size: 15px !important;
  }

  /* Popup do pacote básico: preserva o layout compacto original */
  #discount-popup { padding: 14px !important; }
  #discount-popup > div {
    width: 100% !important; max-width: 440px !important; max-height: 95vh !important;
    padding: 24px 16px 20px !important; border-radius: 16px !important; overflow-y: auto !important;
  }
  #discount-popup h2 { font-size: 18px !important; line-height: 1.1 !important; margin-bottom: 6px !important; }
  #discount-popup #popup-list { display: grid !important; grid-template-columns: 1fr !important; gap: 6px !important; }
  #discount-popup #popup-list > div { padding: 0 !important; margin: 0 !important; border-radius: 0 !important; min-height: 0 !important; }
  #discount-popup img[alt="Pack Completo"] { width: 90px !important; max-width: 90px !important; }

  /* FAQ */
  #faq .grid { gap: 26px !important; }
  #faq button { padding: 17px 16px !important; }

  /* Garantia */
  #garantia { gap: 0; }
  #garantia img { width: 130px !important; }
  #garantia > div { gap: 18px !important; }
  #garantia p { font-size: 14px !important; line-height: 1.6 !important; }
  #garantia .btn-oferta {
    padding: 15px 24px !important;
    font-size: 13px !important;
  }

  /* Rodapé mais compacto */
  footer { padding-top: 28px !important; padding-bottom: 28px !important; }
  footer > div > div { padding: 24px 10px 20px !important; }
  footer p { font-size: 13px !important; line-height: 1.6 !important; }

  /* Notificação não pode ultrapassar a largura da tela */
  #notif-popup {
    width: min(230px, calc(100vw - 20px)) !important;
    left: 10px !important;
  }
}

@media (max-width: 380px) {
  #promo-banner { font-size: 12px !important; padding: 8px 10px !important; }
  #hero { padding-top: 56px !important; }
  #hero h1 { font-size: 22px !important; }
  #hero p { font-size: 14px !important; }
  #test-slider, #test-slider > div { min-height: 316px !important; }
  #test-slider img { max-height: 300px !important; }
  #samples-slider.samples-track { animation-duration: 17s; }
  .sample-page { height: 300px; }
}

/* Full-color brand logos */
.brand-marquee .brand-marquee-set img{opacity:1;filter:none}

/* Problem x solution section */
.brand-marquee{position:relative;width:100%;height:92px;display:flex;align-items:center;overflow:hidden;background:#f8fafc;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}.brand-marquee-track{display:flex;width:max-content;animation:brand-marquee-scroll 42s linear infinite;will-change:transform}.brand-marquee:hover .brand-marquee-track{animation-play-state:paused}.brand-marquee-set{display:flex;align-items:center;gap:44px;padding-right:44px;flex-shrink:0}.brand-marquee-set img{display:block;width:58px;height:42px;object-fit:contain;opacity:.76;filter:grayscale(1);transition:opacity .2s ease,filter .2s ease,transform .2s ease}.brand-marquee-set img:hover{opacity:1;filter:grayscale(0);transform:scale(1.08)}.brand-marquee-fade{position:absolute;z-index:2;top:0;bottom:0;width:90px;pointer-events:none}.brand-marquee-fade-left{left:0;background:linear-gradient(90deg,#f8fafc,transparent)}.brand-marquee-fade-right{right:0;background:linear-gradient(270deg,#f8fafc,transparent)}@keyframes brand-marquee-scroll{to{transform:translateX(-50%)}}@media(max-width:640px){.brand-marquee{height:76px}.brand-marquee-set{gap:32px;padding-right:32px}.brand-marquee-set img{width:48px;height:34px}.brand-marquee-fade{width:48px}}@media(prefers-reduced-motion:reduce){.brand-marquee-track{animation:none}.brand-marquee{overflow-x:auto}.brand-marquee-fade{display:none}}

.problem-solution-section{background:#fff;padding:clamp(64px,8vw,104px) 24px;border-bottom:1px solid #e2e8f0;color:#0f172a}.problem-solution-wrap{width:min(1120px,100%);margin:0 auto}.problem-solution-heading{max-width:980px;margin:0 auto 48px;text-align:center}.problem-solution-equation{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 22px;font-size:clamp(27px,4vw,48px);font-weight:900;letter-spacing:-.045em;line-height:1.08}.equation-less{color:#dc2626}.equation-more{color:#2563eb}.equation-money{color:#16a34a;display:inline-flex;align-items:center;gap:8px}.problem-solution-heading p{max-width:780px;margin:26px auto 0;color:#334155;font-size:clamp(16px,1.6vw,19px);line-height:1.7;font-weight:500}.problem-solution-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.comparison-card{border-radius:24px;padding:clamp(26px,4vw,42px);box-shadow:0 18px 45px rgba(15,23,42,.07)}.comparison-card-negative{background:#f8fafc;border:1px solid #fee2e2}.comparison-card-positive{background:#fff;border:2px solid #0b1f33;box-shadow:0 20px 55px rgba(15,23,42,.14)}.comparison-label{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:8px 14px;margin-bottom:26px;text-transform:uppercase;letter-spacing:.07em;font-size:12px;font-weight:800}.comparison-label span{font-size:19px;line-height:1}.comparison-label-negative{background:#fee2e2;color:#dc2626}.comparison-label-positive{background:#dbeafe;color:#1d4ed8}.comparison-card ul{display:grid;gap:17px;margin:0;padding:0;list-style:none}.comparison-card li{display:flex;align-items:flex-start;gap:12px;font-size:clamp(15px,1.5vw,17px);line-height:1.48;font-weight:650}.comparison-card li span{flex:0 0 23px;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;margin-top:1px;color:#fff;font-size:15px;font-weight:900}.comparison-card-negative li span{background:#ef4444}.comparison-card-positive li span{background:#16a34a}.problem-outcomes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:28px}.problem-outcomes article{padding:24px;border:1px solid #e2e8f0;border-radius:18px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.05)}.problem-outcomes article>span{display:grid;place-items:center;width:36px;height:36px;margin-bottom:16px;border-radius:10px;background:#eaf2ff;color:#006ee6;font-size:12px;font-weight:900}.problem-outcomes strong{display:block;margin-bottom:7px;font-size:17px;color:#0f172a}.problem-outcomes p{margin:0;color:#475569;font-size:14px;line-height:1.55}@media(max-width:760px){.problem-solution-section{padding:58px 18px}.problem-solution-heading{margin-bottom:34px}.problem-solution-equation{flex-direction:column;gap:9px}.problem-solution-grid,.problem-outcomes{grid-template-columns:1fr}.comparison-card{border-radius:20px}.problem-outcomes{margin-top:18px}}