/* CSS especifico da pagina — extraido do bundle consolidado para evitar cascata cruzada. */
:root{
  --paper:#F7F7F3;
  --paper-alt:#EFEFE9;
  --card:#FFFFFF;
  --ink:#16222C;
  --ink-2:#43525D;
  --ink-3:#6B7780;
  --ink-4:#98A2A9;
  --line:#DEE0D8;
  --line-soft:#E9EAE3;
  --green:#0E6B4D;
  --green-hover:#0A553D;
  --green-soft:#EAF4EF;
  --bronze:#8C5A1C;
  --bronze-soft:#FBF4E8;
  --red-sober:#8E2B3C;
  --red-soft:#F9EDEF;
  --dark:#101B24;
  --serif:'Source Serif 4', Georgia, serif;
  --sans:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --radius:10px;
  --radius-lg:14px;
  --shadow-sm:0 1px 2px rgba(22,34,44,.05);
  --shadow-md:0 6px 24px rgba(22,34,44,.07);
  --shadow-lg:0 18px 55px rgba(22,34,44,.12);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  padding-bottom:0;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.container{width:100%;max-width:1080px;margin:0 auto;padding:0 22px}
.col-text{max-width:640px;margin:0 auto}
.col-wide{max-width:820px;margin:0 auto}
.text-center{text-align:center}
section{padding:56px 0}
@media (min-width:768px){section{padding:88px 0}}
.section-alt{background:var(--paper-alt)}
.section-tight{padding:40px 0}
.h-spacer{margin-top:26px}
h1,h2,h3{font-family:var(--serif);color:var(--ink);font-weight:600;letter-spacing:-.015em}
h1{font-size:clamp(32px,8.4vw,42px);line-height:1.18;margin-bottom:22px}
@media (min-width:768px){h1{font-size:clamp(48px,5vw,60px);line-height:1.08;letter-spacing:-.02em}}
h2{font-size:clamp(25px,6.2vw,31px);line-height:1.22}
@media (min-width:768px){h2{font-size:clamp(34px,3.6vw,42px);line-height:1.18}}
h3{font-size:clamp(19px,2vw,22px);line-height:1.3}
p{color:var(--ink-2);margin-bottom:18px;font-size:17px;line-height:1.68}
p:last-child{margin-bottom:0}
@media (min-width:768px){p{font-size:18px}}
ul,ol{padding-left:0}
strong{color:var(--ink)}
em{color:var(--ink)}
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--bronze);margin-bottom:18px;
}
.eyebrow::before{content:"";width:22px;height:1.5px;background:var(--bronze)}
.hero{padding:64px 0 48px;text-align:center;position:relative;overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:-40px -20px auto auto;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(14,107,77,.07),transparent 62%);pointer-events:none;
}
@media (min-width:768px){.hero{padding:104px 0 80px}}
.hero-inner{max-width:790px;margin:0 auto;position:relative;z-index:1}
.hero .lead{font-size:18px;color:var(--ink-2);max-width:630px;margin:0 auto 8px}
@media (min-width:768px){.hero .lead{font-size:20px}}
.hero-subnote{font-size:15.5px;color:var(--ink-3);margin:18px auto 0;max-width:620px}
.badge-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:26px 0 4px}
.badge{
  display:inline-flex;align-items:center;gap:7px;
  font-size:12.5px;font-weight:700;color:var(--ink-2);
  background:var(--card);border:1px solid var(--line);border-radius:999px;
  padding:7px 14px;letter-spacing:.01em;box-shadow:var(--shadow-sm);
}
.badge::before{content:"";width:14px;height:14px;border-radius:50%;flex-shrink:0;background-color:var(--green);background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2010%2010'%3E%3Cpath%20d='M2%205.3L4%207.3L8%202.7'%20fill='none'%20stroke='%23ffffff'%20stroke-width='1.6'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:9px 9px}
.cta{
  display:flex;width:100%;align-items:center;justify-content:center;
  background:var(--green);color:#fff;font-size:16.5px;font-weight:700;
  padding:17px 28px;border-radius:9px;min-height:56px;text-align:center;line-height:1.3;
  transition:background .18s ease, transform .12s ease;
  box-shadow:0 2px 0 rgba(10,85,61,.35);
}
.cta:hover{background:var(--green-hover)}
.cta:active{transform:translateY(1px);box-shadow:none}
@media (min-width:480px){.cta{display:inline-flex;width:auto}}
.cta-secondary{
  display:flex;width:100%;align-items:center;justify-content:center;
  background:transparent;border:1.5px solid var(--ink-3);color:var(--ink-2);
  font-size:15.5px;font-weight:700;padding:13px 20px;border-radius:9px;min-height:48px;
  text-align:center;line-height:1.3;transition:all .15s ease;
}
.cta-secondary:hover{background:var(--card);border-color:var(--ink-2);color:var(--ink)}
@media (min-width:480px){.cta-secondary{display:inline-flex;width:auto}}
.btn-refuse{display:inline-block;font-size:15px;color:var(--ink-3);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--ink-4);padding:10px 4px;transition:color .15s ease}
.btn-refuse:hover{color:var(--ink-2)}
.cta-group{margin-top:34px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.cta-group.center{align-items:center;text-align:center}
.cta-helper{font-size:14.5px;color:var(--ink-3);margin:0}
.cta-note{font-size:13.5px;color:var(--ink-4);margin-top:10px}
.img-frame{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);margin:40px auto 0;max-width:820px;overflow:hidden;box-shadow:var(--shadow-md)}
.img-frame img{width:100%;height:auto;background:var(--paper-alt)}
.img-frame-caption{font-size:14px;color:var(--ink-3);padding:14px 18px;border-top:1px solid var(--line-soft);text-align:center}
.img-frame.is-paper{padding:12px;background:#fff}
.img-frame.is-paper .img-frame-caption{margin:0 -12px -12px}
.pullquote{
  font-family:var(--serif);font-size:21px;line-height:1.45;color:var(--ink);
  font-style:italic;border-left:3px solid var(--bronze);padding:6px 0 6px 22px;margin:30px 0;
}
@media (min-width:768px){.pullquote{font-size:25px;padding-left:26px}}
.list-soft{list-style:none;margin:26px 0}
.list-soft li{position:relative;padding:11px 0 11px 24px;border-bottom:1px solid var(--line-soft);color:var(--ink-2);font-size:17px;line-height:1.55}
.list-soft li:last-child{border-bottom:none}
.list-soft li::before{content:"";position:absolute;left:0;top:21px;width:10px;height:1.5px;background:var(--bronze)}
.checklist{list-style:none;margin:28px 0}
.checklist li{position:relative;padding:13px 0 13px 36px;color:var(--ink);font-size:17px;line-height:1.55;border-bottom:1px solid var(--line-soft)}
.checklist li:last-child{border-bottom:none}
.checklist li::before{content:"";position:absolute;left:0;top:17px;width:18px;height:18px;border-radius:50%;background:var(--green-soft);border:1.5px solid var(--green)}
.checklist li::after{content:"";position:absolute;left:5px;top:22px;width:8px;height:4px;border-left:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(-45deg)}
.list-not{list-style:none;margin:28px 0}
.list-not li{position:relative;padding:13px 0 13px 34px;color:var(--ink-2);font-size:17px;line-height:1.55;border-bottom:1px solid var(--line-soft)}
.list-not li:last-child{border-bottom:none}
.list-not li::before{content:"✕";position:absolute;left:2px;top:13px;font-size:14px;font-weight:700;color:var(--red-sober)}
.cards-numbers{display:grid;grid-template-columns:1fr;gap:18px;margin-top:44px}
@media (min-width:720px){.cards-numbers{grid-template-columns:1fr 1fr;gap:22px}}
.card-number{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px 22px;box-shadow:var(--shadow-sm)}
@media (min-width:768px){.card-number{padding:30px 28px}}
.card-number-num{font-family:var(--serif);font-size:44px;font-weight:500;color:var(--bronze);line-height:1;margin-bottom:14px}
.card-number h3{font-family:var(--sans);font-size:19px;font-weight:700;margin-bottom:12px;line-height:1.3}
.card-number p{font-size:16px;line-height:1.6}
.cards-alternatives{display:grid;grid-template-columns:1fr;gap:16px;margin-top:38px}
@media (min-width:768px){.cards-alternatives{grid-template-columns:1fr 1fr;gap:20px}}
.card-alt{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow-sm)}
.card-alt h3{font-family:var(--sans);font-size:18.5px;font-weight:700;margin-bottom:10px}
.card-alt p{font-size:15.5px;line-height:1.6}
.for-whom{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:30px 24px;margin:32px 0;box-shadow:var(--shadow-sm)}
@media (min-width:768px){.for-whom{padding:38px}}
.for-whom-intro{font-family:var(--serif);font-size:19px;color:var(--ink);font-weight:600;margin-bottom:6px}
.for-whom-divider{height:1px;background:var(--line);margin:26px 0;border:none}
.cards-materials{display:grid;grid-template-columns:1fr;gap:16px;margin-top:44px}
@media (min-width:640px){.cards-materials{grid-template-columns:1fr 1fr;gap:20px}}
.card-material{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px 22px;box-shadow:var(--shadow-sm)}
.card-material.is-wide{grid-column:1/-1}
.card-material img{width:100%;max-width:190px;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:8px;border:1px solid var(--line);margin:0 0 18px;background:var(--paper-alt)}
.card-material .doc-icon{width:26px;height:32px;border:1.5px solid var(--ink-4);border-radius:2px;margin-bottom:16px;position:relative}
.card-material .doc-icon::before{content:"";position:absolute;inset:9px 5px auto 5px;height:1.5px;background:var(--ink-4);box-shadow:0 6px 0 var(--ink-4),0 12px 0 var(--ink-4)}
.card-material h3{font-family:var(--sans);font-size:18.5px;font-weight:700;margin-bottom:10px;line-height:1.3}
.card-material p{font-size:15.5px;line-height:1.6}
.card-material .tag-bonus{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--bronze);background:var(--bronze-soft);border-radius:4px;padding:3px 8px;margin-bottom:12px}
.box-limits{background:var(--amber-soft);border-left:3px solid var(--bronze);border-radius:0 var(--radius) var(--radius) 0;padding:26px 22px;margin:32px 0}
@media (min-width:768px){.box-limits{padding:34px}}
.box-limits-title{font-family:var(--serif);font-size:20px;font-weight:700;margin-bottom:16px;color:var(--ink)}
.offer-wrap{display:grid;grid-template-columns:1fr;gap:30px;align-items:center;margin-top:44px}
@media (min-width:860px){.offer-wrap{grid-template-columns:1fr 0.88fr;gap:42px}.offer-wrap .img-frame{margin-top:0}.offer{margin-top:0}}
.offer{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:32px 22px;max-width:540px;margin:44px auto 0;box-shadow:var(--shadow-lg);text-align:center}
@media (min-width:768px){.offer{padding:46px 40px}}
.offer-label{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px}
.offer-title{font-family:var(--serif);font-size:24px;line-height:1.25;font-weight:700;margin-bottom:24px;color:var(--ink)}
.offer-price{font-size:48px;font-weight:800;color:var(--ink);line-height:1;letter-spacing:-.02em;margin:6px 0}
.offer-price-note{font-size:14px;color:var(--ink-3)}
.offer-divider{height:1px;background:var(--line);margin:26px 0;border:none}
.offer-includes{text-align:left;list-style:none;max-width:390px;margin:0 auto}
.offer-includes li{position:relative;padding:8px 0 8px 24px;color:var(--ink-2);font-size:15px;line-height:1.5}
.offer-includes li::before{content:"";position:absolute;left:0;top:15px;width:12px;height:6px;border-left:1.5px solid var(--green);border-bottom:1.5px solid var(--green);transform:rotate(-45deg)}
.offer-cta-wrap{margin-top:30px;display:flex;flex-direction:column;gap:12px}
.offer-cta-wrap .cta,.offer-cta-wrap .cta-secondary{width:100%}
.guarantee{background:var(--green-soft);border:1px solid rgba(14,107,77,.25);border-radius:var(--radius-lg);padding:30px 24px;max-width:650px;margin:0 auto;display:flex;gap:18px;align-items:flex-start}
@media (min-width:768px){.guarantee{padding:36px 34px}}
.guarantee-seal{width:54px;height:54px;border-radius:50%;flex-shrink:0;border:2px solid var(--green);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-weight:700;color:var(--green);font-size:17px;background:var(--card)}
.guarantee h3{font-family:var(--sans);font-size:18px;margin-bottom:8px;font-weight:700}
.guarantee p{font-size:15.5px;line-height:1.6}
.summary-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:30px 24px;max-width:650px;margin:40px auto 0;box-shadow:var(--shadow-sm)}
@media (min-width:768px){.summary-card{padding:40px 38px}}
.summary-card h3{margin-bottom:18px}
.summary-card ol{padding-left:22px;margin:24px 0;color:var(--ink-2)}
.summary-card li{padding:8px 0;line-height:1.55}
.summary-cta-wrap{margin-top:28px;display:flex;flex-direction:column;gap:12px;align-items:center}.summary-cta-wrap .cta{width:100%}
@media (min-width:480px){.summary-cta-wrap .cta{width:auto}}
.faq-list{max-width:720px;margin:40px auto 0}.faq-item{border-bottom:1px solid var(--line)}.faq-item:first-child{border-top:1px solid var(--line)}.faq-question{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 4px;text-align:left;font-size:16.5px;font-weight:600;color:var(--ink);line-height:1.4}.faq-icon{position:relative;width:16px;height:16px;flex-shrink:0}.faq-icon::before,.faq-icon::after{content:"";position:absolute;background:var(--ink-3);transition:transform .2s ease}.faq-icon::before{left:0;top:7px;width:16px;height:2px}.faq-icon::after{left:7px;top:0;width:2px;height:16px}.faq-item.is-open .faq-icon::after{transform:scaleY(0)}.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease}.faq-answer-inner{padding:0 4px 22px}.faq-answer-inner p{font-size:16px}
.final-cta-card{max-width:720px;margin:0 auto;text-align:center;background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:34px 22px;box-shadow:var(--shadow-md)}
@media (min-width:768px){.final-cta-card{padding:46px 38px}}
.final-note{font-size:14.5px;color:var(--ink-3);margin:14px 0 6px}
.legal-zone{background:var(--paper-alt);border-top:1px solid var(--line);padding:48px 0 0}.legal-note,.guarantee-note,.support-note{max-width:680px;margin:0 auto;padding:0 22px 28px;text-align:center}.legal-note p,.guarantee-note p,.support-note p{font-size:13.5px;color:var(--ink-3);line-height:1.6;margin-bottom:8px}.support-note a{color:var(--ink-2);text-decoration:underline;text-underline-offset:2px}.legal-divider{height:1px;background:var(--line);max-width:120px;margin:0 auto 28px;border:none}.footer{background:var(--paper-alt);text-align:center;padding:8px 22px 44px}.footer p{font-size:13px;color:var(--ink-4);margin-bottom:6px}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:12px 16px;transform:translateY(110%);transition:transform .25s ease}.sticky-cta.is-visible{transform:translateY(0)}.sticky-cta .cta{width:100%;min-height:52px;font-size:16px}@media (min-width:900px){.sticky-cta{display:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none !important;animation:none !important}html{scroll-behavior:auto}}


/* ============================================================
   COMPLEMENTOS — DETECTOR / DOWNSELL FRONT
============================================================ */
.hero.is-detector{
  background:linear-gradient(180deg,var(--paper),var(--paper-alt));
}
.hero.is-detector .lead{max-width:680px}
.zone-list{display:grid;grid-template-columns:1fr;gap:16px;margin-top:40px}
.zone{display:flex;gap:16px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-sm)}
.zone-dot{width:18px;height:18px;border-radius:50%;flex-shrink:0;margin-top:5px;border:1px solid rgba(22,34,44,.08)}
.zone-green .zone-dot{background:var(--green)}
.zone-amber .zone-dot{background:#8A6210}
.zone-red .zone-dot{background:var(--red-sober)}
.zone h3{font-family:var(--sans);font-size:18px;font-weight:800;margin-bottom:6px;color:var(--ink)}
.zone p{font-size:16px;line-height:1.6;margin-bottom:0}
.detector-grid{display:grid;grid-template-columns:1fr;gap:34px;align-items:center;margin-top:44px}
@media (min-width:900px){.detector-grid{grid-template-columns:1.05fr .95fr;gap:46px}.detector-grid .img-frame{margin-top:0}}
.img-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.img-card img{width:100%;height:auto;background:var(--paper-alt)}
.img-card figcaption{font-size:13.5px;color:var(--ink-3);line-height:1.5;padding:13px 15px;border-top:1px solid var(--line-soft);text-align:center}
.offer.is-detector{max-width:620px}
.offer.is-detector .offer-price{color:var(--ink)}
.compliance-note{max-width:760px;margin:34px auto 0;background:var(--amber-soft);border-left:3px solid var(--bronze);border-radius:0 var(--radius) var(--radius) 0;padding:24px 22px}
.compliance-note p{font-size:15.5px;line-height:1.6;margin-bottom:0;color:var(--ink-2)}
@media (min-width:768px){.compliance-note{padding:30px 32px}}


/* ============================================================
   CORRECAO ETAPA 3/3 — GUARDA VISUAL FINAL
   Objetivo: impedir distorcao de imagens e reduzir conflito de CSS
   apos a separacao dos estilos por tipo de pagina.
============================================================ */
img,
picture img,
figure img,
.card-material img,
.img-frame img,
.img-card img,
.offer-wrap img,
.product-thumb img,
.product-mini img,
.kit-card img,
.order-product img,
.order-thumb img,
.bump-thumb img{
  max-width:100%;
  height:auto !important;
  aspect-ratio:auto;
  object-fit:contain;
}
.card-material img{
  width:100%;
  max-width:190px;
  max-height:none !important;
  display:block;
}
.img-frame img,
.img-card img{
  width:100%;
  display:block;
}
.order-thumb img,
.bump-thumb img{
  width:100%;
  height:100% !important;
  object-fit:cover;
}

@media (max-width:899px){body{padding-bottom:84px}}

.js-sticky-trigger{}

/* ============================================================
   ETAPA 5 — ACABAMENTO DESIGN/MOBILE
   Ajustes de leitura apos aplicacao das copies finais.
============================================================ */
.hero p{
  max-width:680px;
  margin-left:auto;
  margin-right:auto;
}
.hero .checklist,
.hero .list-soft,
.hero .list-not{
  max-width:600px;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
}
.hero .cta-group + .cta-group,
.cta-group + .cta-group{
  margin-top:12px;
}
.hero .img-frame.hero-visual{
  max-width:520px;
  margin-top:36px;
}
.hero .img-frame.hero-visual img{
  width:100%;
  height:auto;
}
.proof-visual{
  margin-top:30px;
  margin-bottom:30px;
}
.sticky-cta{
  padding-left:16px;
  padding-right:16px;
  padding-bottom:calc(12px + env(safe-area-inset-bottom));
}
.sticky-cta .cta{
  max-width:720px;
  margin:0 auto;
  white-space:normal;
}
@media (max-width:899px){
  section{padding:48px 0;}
  .hero{padding:54px 0 44px;}
  .container{padding-left:20px;padding-right:20px;}
  .badge-row{gap:7px;margin-top:22px;}
  .badge{font-size:12px;padding:6px 11px;}
  .cta,.cta-secondary{width:100%;}
  .img-frame-caption{font-size:12.5px;line-height:1.5;}
}
@media (max-width:420px){
  h1{font-size:clamp(30px,8.2vw,36px);}
  h2{font-size:clamp(24px,6.2vw,29px);}
  p{font-size:16.5px;line-height:1.64;}
  .checklist li,.list-soft li,.list-not li{font-size:16px;}
}



/* ============================================================
   ETAPA 11 — SISTEMA DE IMAGENS / CAPAS
   Objetivo: reduzir capas que dominam a tela, padronizar mockups
   e dar presenca proporcional sem excesso no mobile.
============================================================ */
.hero .img-frame.hero-visual{
  max-width:clamp(270px, 78vw, 360px);
  margin-top:30px;
}
.hero .img-frame.hero-visual .img-frame-caption{
  max-width:520px;
  margin:0 auto;
  padding-left:18px;
  padding-right:18px;
}
.offer-wrap .img-frame.is-paper,
.offer-wrap .img-frame{
  max-width:clamp(250px, 74vw, 340px);
  margin-left:auto;
  margin-right:auto;
}
.cards-materials{
  gap:18px;
}
.card-material{
  padding:26px 22px 24px;
}
.card-material img{
  width:min(100%, 210px);
  max-width:210px;
  margin:0 auto 16px;
}
.card-material.is-wide img{
  max-width:240px;
}
@media (min-width:768px){
  .hero .img-frame.hero-visual{
    max-width:420px;
  }
  .offer-wrap .img-frame.is-paper,
  .offer-wrap .img-frame{
    max-width:380px;
  }
  .card-material img{
    max-width:220px;
  }
  .card-material.is-wide img{
    max-width:250px;
  }
}
@media (max-width:899px){
  .hero .img-frame.hero-visual{
    margin-top:28px;
  }
  .hero .img-frame.hero-visual .img-frame-caption{
    font-size:13px;
    line-height:1.55;
  }
}
@media (max-width:420px){
  .hero .img-frame.hero-visual{
    max-width:min(100%, 340px);
  }
  .offer-wrap .img-frame.is-paper,
  .offer-wrap .img-frame{
    max-width:min(100%, 320px);
  }
  .card-material img{
    max-width:200px;
  }
}


/* ============================================================
   ETAPA 12 — CARDS DE MATERIAIS / PROPORÇÃO INTERNA
   Objetivo: dar acabamento editorial aos cards com capa,
   reduzindo área morta, alinhando mídia/título/texto e melhorando
   o ritmo dos cards empilhados no mobile.
============================================================ */
.cards-materials{
  gap:22px;
  align-items:stretch;
}
.card-material{
  display:flex;
  flex-direction:column;
  min-height:100%;
  padding:24px 22px 25px;
}
.card-material img{
  flex:0 0 auto;
  margin:0 auto 18px;
  border-radius:10px;
  box-shadow:0 10px 26px rgba(22,34,44,.07);
}
.card-material h3{
  margin-top:0;
  margin-bottom:9px;
}
.card-material p{
  margin-bottom:0;
}
.card-material .tag-bonus,
.card-material .doc-icon{
  flex:0 0 auto;
}
.card-material .tag-bonus{
  align-self:flex-start;
  margin-bottom:14px;
}
.card-material .doc-icon{
  margin-bottom:18px;
}
.card-material.is-wide{
  max-width:100%;
}
.card-material.is-wide img{
  margin-left:auto;
  margin-right:auto;
}
@media (max-width:639px){
  .cards-materials{
    gap:22px;
    margin-top:36px;
  }
  .card-material{
    padding:24px 22px 26px;
  }
  .card-material img + h3{
    margin-top:1px;
  }
  .card-material h3{
    font-size:18.5px;
    line-height:1.28;
  }
  .card-material p{
    font-size:15.7px;
    line-height:1.62;
  }
}
@media (min-width:640px){
  .cards-materials{
    gap:22px;
  }
  .card-material{
    padding:26px 24px 27px;
  }
}
@media (min-width:900px){
  .cards-materials{
    gap:24px;
  }
  .card-material{
    padding:28px 26px 30px;
  }
}


/* ============================================================
   ETAPA 13 — RITMO VERTICAL DAS PÁGINAS
   Objetivo: melhorar a cadência editorial entre grupos visuais,
   texto de fechamento, explicação e CTAs, sem alterar conteúdo.
============================================================ */
.flow-after{
  margin-top:34px;
}
.cards-numbers + .flow-after,
.cards-alternatives + .flow-after,
.cards-materials + .flow-after,
.zone-list + .flow-after,
.checklist + .flow-after,
.list-soft + .flow-after,
.list-not + .flow-after,
.module-list + .flow-after,
.img-frame + .flow-after,
.proof-visual + .flow-after{
  margin-top:38px;
}
.col-text > .box-limits,
.col-wide > .box-limits{
  margin-top:34px;
  margin-bottom:34px;
}
.box-limits + .checklist,
.box-limits + .list-soft,
.box-limits + .list-not{
  margin-top:22px;
}
.cta-group{
  margin-top:38px;
}
.offer-cta-wrap{
  margin-top:34px;
}
.cta-helper{
  margin-top:2px;
}
.cta-note,
.final-note{
  margin-top:14px;
}
.img-frame{
  margin-top:44px;
  margin-bottom:0;
}
.proof-visual{
  margin-top:38px;
  margin-bottom:36px;
}
.quote-card,
.simple-card,
.summary-card,
.for-whom,
.preview-note,
.preview-warning{
  margin-top:38px;
}
.faq-list{
  margin-top:44px;
}
.final-cta-card{
  margin-top:8px;
}
.offer-wrap{
  margin-top:50px;
}
.guarantee{
  margin-top:4px;
}
section + section{
  scroll-margin-top:24px;
}
@media (max-width:899px){
  .flow-after{
    margin-top:30px;
  }
  .cards-numbers + .flow-after,
  .cards-alternatives + .flow-after,
  .cards-materials + .flow-after,
  .zone-list + .flow-after,
  .checklist + .flow-after,
  .list-soft + .flow-after,
  .list-not + .flow-after,
  .module-list + .flow-after,
  .img-frame + .flow-after,
  .proof-visual + .flow-after{
    margin-top:34px;
  }
  .cta-group{
    margin-top:34px;
  }
  .img-frame{
    margin-top:36px;
  }
  .proof-visual{
    margin-top:34px;
    margin-bottom:32px;
  }
  .quote-card,
  .simple-card,
  .summary-card,
  .for-whom,
  .preview-note,
  .preview-warning{
    margin-top:34px;
  }
  .faq-list{
    margin-top:38px;
  }
  .offer-wrap{
    margin-top:44px;
  }
}
@media (min-width:900px){
  .col-text > p + .checklist,
  .col-text > p + .list-soft,
  .col-text > p + .list-not,
  .col-wide > p + .cards-materials,
  .col-wide > p + .cards-numbers,
  .col-wide > p + .cards-alternatives{
    margin-top:34px;
  }
}


/* ============================================================
   ETAPA 14 — FIM DE PÁGINA + STICKY CTA
   Objetivo: calibrar a cauda visual das páginas com barra fixa,
   evitar espaço morto no final do scroll e manter o CTA mobile
   sem cobrir conteúdo.
============================================================ */
.legal-zone{
  margin-top:34px;
  padding-top:40px;
}
.legal-note,
.guarantee-note,
.support-note{
  padding-bottom:24px;
}
.legal-divider{
  margin-bottom:24px;
}
.footer{
  padding-bottom:calc(34px + env(safe-area-inset-bottom));
}
.final-cta-card + .legal-zone,
.summary-card + .legal-zone,
.guarantee + .legal-zone{
  margin-top:42px;
}
.sticky-cta{
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  box-shadow:0 -10px 26px rgba(22,34,44,.10);
}
.sticky-cta .cta{
  min-height:50px;
  font-size:15.5px;
}
@media (max-width:899px){
  body{
    padding-bottom:76px;
  }
  .legal-zone{
    margin-top:28px;
    padding-top:34px;
  }
  .legal-note,
  .guarantee-note,
  .support-note{
    padding-bottom:20px;
  }
  .legal-divider{
    margin-bottom:20px;
  }
  .footer{
    padding-top:4px;
    padding-bottom:calc(28px + env(safe-area-inset-bottom));
  }
  section:last-of-type{
    padding-bottom:42px;
  }
  .final-cta-card + .legal-zone,
  .summary-card + .legal-zone,
  .guarantee + .legal-zone{
    margin-top:34px;
  }
}
@media (min-width:900px){
  body{
    padding-bottom:0;
  }
  .sticky-cta{
    display:none;
  }
  .footer{
    padding-bottom:40px;
  }
}


/* ============================================================
   ETAPA 15 — LEGAL, GARANTIA E RODAPÉ
   Objetivo: reduzir sensação de parede de texto no fechamento,
   separar melhor aviso legal/garantia/suporte e deixar o rodapé
   mais editorial sem alterar conteúdo.
============================================================ */
.guarantee{
  position:relative;
  box-shadow:0 10px 30px rgba(14,107,77,.06);
}
.guarantee::before{
  content:"";
  position:absolute;
  left:0;
  top:24px;
  bottom:24px;
  width:3px;
  border-radius:999px;
  background:rgba(14,107,77,.35);
}
.guarantee h3{
  line-height:1.28;
}
.guarantee p{
  max-width:520px;
}
.legal-zone{
  background:
    linear-gradient(180deg, rgba(255,255,255,.42), rgba(239,239,233,.92)),
    var(--paper-alt);
  border-top:1px solid var(--line);
}
.legal-zone .legal-note,
.legal-zone .guarantee-note,
.legal-zone .support-note{
  max-width:720px;
  background:rgba(255,255,255,.52);
  border:1px solid rgba(222,224,216,.78);
  border-radius:14px;
  padding:20px 22px;
  margin:0 auto 16px;
  text-align:left;
  box-shadow:0 1px 2px rgba(22,34,44,.025);
}
.legal-zone .support-note{
  background:rgba(234,244,239,.58);
  border-color:rgba(14,107,77,.16);
}
.legal-zone .legal-note p,
.legal-zone .guarantee-note p,
.legal-zone .support-note p{
  max-width:none;
  margin-bottom:8px;
  font-size:13px;
  line-height:1.62;
}
.legal-zone .legal-note p:last-child,
.legal-zone .guarantee-note p:last-child,
.legal-zone .support-note p:last-child{
  margin-bottom:0;
}
.legal-zone .support-note a{
  font-weight:600;
  color:var(--green-hover);
  text-decoration-thickness:1px;
}
.legal-divider{
  max-width:92px;
  opacity:.72;
}
.footer{
  border-top:1px solid rgba(222,224,216,.72);
  margin-top:10px;
}
.footer p{
  max-width:680px;
  margin-left:auto;
  margin-right:auto;
  line-height:1.55;
}
@media (max-width:899px){
  .guarantee{
    gap:14px;
  }
  .guarantee::before{
    top:18px;
    bottom:18px;
  }
  .guarantee-seal{
    width:48px;
    height:48px;
    font-size:15px;
  }
  .legal-zone .legal-note,
  .legal-zone .guarantee-note,
  .legal-zone .support-note{
    padding:18px 18px;
    margin-left:20px;
    margin-right:20px;
    border-radius:12px;
  }
  .legal-zone .legal-note p,
  .legal-zone .guarantee-note p,
  .legal-zone .support-note p{
    font-size:12.7px;
    line-height:1.6;
  }
  .footer{
    margin-top:6px;
  }
  .footer p{
    font-size:12.2px;
  }
}
@media (min-width:900px){
  .legal-zone .legal-note,
  .legal-zone .guarantee-note,
  .legal-zone .support-note{
    padding:22px 26px;
  }
}


/* ============================================================
   ETAPA 18 — ESPAÇAMENTO MOBILE DAS PÁGINAS DE VENDA
   Objetivo: corrigir espaços verticais ainda excessivos no mobile,
   especialmente hero → primeira seção, transições entre seções e
   distância antes dos eyebrows, sem mexer em conteúdo ou lógica.
============================================================ */
@media (max-width:899px){
  section{
    padding-top:40px;
    padding-bottom:40px;
  }

  .hero{
    padding-bottom:34px;
  }

  .hero + section,
  header.hero + section{
    padding-top:38px;
  }

  section.section-alt + section,
  section + section.section-alt{
    padding-top:42px;
  }

  .section-tight{
    padding-top:32px;
    padding-bottom:32px;
  }

  .eyebrow{
    margin-bottom:14px;
  }

  .container > .col-text > .eyebrow:first-child,
  .container > .col-wide > .eyebrow:first-child{
    margin-top:0;
  }

  h2{
    margin-bottom:12px;
  }

  h2 + p,
  .eyebrow + h2 + p{
    margin-top:0;
  }

  .cards-numbers,
  .cards-alternatives,
  .cards-materials,
  .zone-list,
  .module-list{
    margin-top:32px;
  }

  .box-limits,
  .for-whom,
  .summary-card,
  .simple-card,
  .quote-card,
  .preview-note,
  .preview-warning{
    margin-top:30px;
  }

  .col-text > p + p,
  .col-wide > p + p{
    margin-top:4px;
  }

  .flow-after{
    margin-top:26px;
  }

  .cards-numbers + .flow-after,
  .cards-alternatives + .flow-after,
  .cards-materials + .flow-after,
  .zone-list + .flow-after,
  .checklist + .flow-after,
  .list-soft + .flow-after,
  .list-not + .flow-after,
  .module-list + .flow-after{
    margin-top:28px;
  }

  .cta-group{
    margin-top:30px;
  }

  .offer-wrap{
    margin-top:38px;
  }

  .img-frame{
    margin-top:32px;
  }

  .proof-visual{
    margin-top:30px;
    margin-bottom:28px;
  }
}

@media (max-width:420px){
  section{
    padding-top:38px;
    padding-bottom:38px;
  }

  .hero{
    padding-bottom:32px;
  }

  .hero + section,
  header.hero + section{
    padding-top:36px;
  }

  .cards-numbers,
  .cards-alternatives,
  .cards-materials,
  .zone-list,
  .module-list{
    margin-top:30px;
  }

  .box-limits,
  .for-whom,
  .summary-card,
  .simple-card,
  .quote-card,
  .preview-note,
  .preview-warning{
    margin-top:28px;
  }
}


/* ============================================================
   ETAPA 19 — ALINHAMENTO EDITORIAL DE TEXTOS LONGOS
   Objetivo: impedir que parágrafos explicativos longos fiquem
   centralizados no mobile, preservando centralização em heros,
   CTAs, notas curtas, ofertas e rodapés.
============================================================ */
.editorial-copy{
  max-width:620px;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
}
.col-wide > .editorial-copy,
.col-text > .editorial-copy{
  text-align:left;
}
@media (max-width:899px){
  .editorial-copy{
    max-width:100%;
    text-align:left !important;
  }
}


/* ============================================================
   ETAPA 20 — CARDS E CAIXAS NO MOBILE
   Objetivo: refinar padding interno, respiro de entrada/saída e
   proporção dos cards/caixas em telas pequenas, sem alterar HTML.
============================================================ */
@media (max-width:899px){
  .card-number,
  .card-alt,
  .card-material,
  .module-item,
  .zone,
  .for-whom,
  .summary-card,
  .simple-card,
  .quote-card,
  .final-cta-card{
    border-radius:12px;
  }

  .card-number{
    padding:24px 22px;
  }

  .card-number-num{
    font-size:40px;
    margin-bottom:12px;
  }

  .card-number h3,
  .card-alt h3,
  .card-material h3,
  .module-item h3{
    margin-bottom:8px;
  }

  .card-number p,
  .card-alt p,
  .card-material p,
  .module-item p,
  .zone p{
    line-height:1.6;
  }

  .card-alt,
  .module-item,
  .zone{
    padding:22px 20px;
  }

  .card-material{
    padding:23px 20px 24px;
  }

  .box-limits,
  .preview-warning{
    padding:22px 20px;
    margin-top:28px;
    margin-bottom:28px;
  }

  .box-limits-title{
    margin-bottom:12px;
  }

  .for-whom,
  .summary-card,
  .simple-card,
  .quote-card,
  .final-cta-card{
    padding:26px 22px;
  }

  .offer{
    padding:30px 22px;
  }

  .guarantee{
    padding:26px 22px;
  }

  .guarantee-seal{
    width:46px;
    height:46px;
  }

  .cards-numbers,
  .cards-alternatives,
  .cards-materials,
  .zone-list,
  .module-list{
    gap:18px;
  }

  .checklist,
  .list-soft,
  .list-not{
    margin-top:22px;
    margin-bottom:22px;
  }

  .checklist li,
  .list-soft li,
  .list-not li{
    padding-top:11px;
    padding-bottom:11px;
  }

  .offer-divider{
    margin-top:22px;
    margin-bottom:22px;
  }

  .offer-title{
    margin-bottom:20px;
  }

  .offer-cta-wrap{
    margin-top:28px;
  }
}

@media (max-width:420px){
  .card-number,
  .card-alt,
  .card-material,
  .module-item,
  .zone{
    padding-left:18px;
    padding-right:18px;
  }

  .box-limits,
  .preview-warning,
  .for-whom,
  .summary-card,
  .simple-card,
  .quote-card,
  .final-cta-card,
  .offer,
  .guarantee{
    padding-left:18px;
    padding-right:18px;
  }

  .card-number-num{
    font-size:38px;
  }

  .zone{
    gap:13px;
  }
}


/* ============================================================
   NOVA ETAPA 1 — HIERARQUIA DE IMAGENS E CAPAS
   Detector: capa vertical menor e provas separadas do hero.
============================================================ */
.hero .img-frame.hero-visual{
  max-width:280px;
  margin-top:24px;
}
.img-frame.proof-visual{
  max-width:330px;
}
.img-frame.is-paper:not(.hero-visual):not(.proof-visual){
  max-width:230px;
}
.offer-wrap .img-frame.is-paper,
.offer-wrap .img-frame{
  max-width:240px;
}
@media (max-width:899px){
  .hero .img-frame.hero-visual{
    max-width:246px;
    margin-top:20px;
  }
  .img-frame.proof-visual{
    max-width:300px;
  }
  .img-frame.is-paper:not(.hero-visual):not(.proof-visual),
  .offer-wrap .img-frame.is-paper,
  .offer-wrap .img-frame{
    max-width:218px;
  }
}
@media (max-width:420px){
  .hero .img-frame.hero-visual{
    max-width:234px;
  }
}


/* ============================================================
   NOVA ETAPA 2 — TOPO E TRANSIÇÃO HERO → PRIMEIRA SEÇÃO
   Objetivo: reduzir a demora visual para a página começar no mobile,
   encurtando a passagem entre imagem/legenda do hero e o primeiro bloco.
============================================================ */
@media (max-width:899px){
  .hero{
    padding-bottom:24px;
  }

  .hero .img-frame.hero-visual{
    margin-bottom:0;
  }

  .hero .img-frame.hero-visual .img-frame-caption{
    padding-top:12px;
    padding-bottom:12px;
  }

  header.hero + section,
  .hero + section,
  .hero + section.section-alt,
  #bloco-2{
    padding-top:28px;
  }

  #bloco-2 .eyebrow{
    margin-top:0;
    margin-bottom:13px;
  }

  #bloco-2 h2{
    margin-top:0;
  }

  #bloco-2 .cards-numbers,
  #bloco-2 .cards-alternatives,
  #bloco-2 .cards-materials,
  #bloco-2 .zone-list,
  #bloco-2 .module-list{
    margin-top:30px;
  }
}

@media (max-width:420px){
  .hero{
    padding-bottom:22px;
  }

  header.hero + section,
  .hero + section,
  .hero + section.section-alt,
  #bloco-2{
    padding-top:26px;
  }

  #bloco-2 .eyebrow{
    margin-bottom:12px;
  }
}

@media (min-width:900px){
  header.hero + section,
  .hero + section,
  #bloco-2{
    padding-top:72px;
  }
}


/* ============================================================
   NOVA ETAPA 3 — TIPOGRAFIA EDITORIAL
   Objetivo: melhorar leitura entre título e texto, reduzir
   centralização indevida e dar cadência mais editorial aos blocos.
============================================================ */
.editorial-copy{
  max-width:620px;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
}
.col-text > .editorial-copy,
.col-wide > .editorial-copy{
  text-align:left;
}
h2 + p,
h3 + p{
  margin-top:12px;
}
.eyebrow + h2{
  margin-top:0;
}
.eyebrow + h2 + p{
  margin-top:14px;
}
.box-limits-title + p,
.for-whom-intro + p,
.simple-card h3 + p,
.summary-card h3 + p,
.final-cta-card h3 + p,
.card-number h3 + p,
.card-alt h3 + p,
.card-material h3 + p,
.module-item h3 + p,
.zone h3 + p{
  margin-top:10px;
}
@media (max-width:899px){
  .editorial-copy{
    max-width:100%;
    text-align:left !important;
  }
  h2 + p,
  h3 + p{
    margin-top:10px;
  }
  .eyebrow + h2 + p{
    margin-top:12px;
  }
  .box-limits-title + p,
  .for-whom-intro + p,
  .simple-card h3 + p,
  .summary-card h3 + p,
  .final-cta-card h3 + p,
  .card-number h3 + p,
  .card-alt h3 + p,
  .card-material h3 + p,
  .module-item h3 + p,
  .zone h3 + p{
    margin-top:9px;
  }
}


/* ============================================================
   NOVA ETAPA 4 — CARDS, CAIXAS E FECHAMENTOS
   Objetivo: reduzir peso de cards/caixas no mobile e transformar
   frases de fechamento em notas editoriais controladas, sem HTML.
============================================================ */
.flow-after{
  max-width:620px;
  margin-left:auto;
  margin-right:auto;
  line-height:1.62;
}
.flow-after.text-center{
  max-width:560px;
}
.cards-numbers + .flow-after,
.cards-alternatives + .flow-after,
.cards-materials + .flow-after,
.zone-list + .flow-after,
.checklist + .flow-after,
.list-soft + .flow-after,
.list-not + .flow-after,
.module-list + .flow-after{
  margin-top:24px;
}
.card-number{
  padding:25px 22px;
}
.card-number-num{
  font-size:38px;
  margin-bottom:10px;
}
.card-number h3{
  margin-bottom:8px;
}
.card-number p{
  line-height:1.55;
}
.box-limits,
.preview-warning{
  padding:22px 20px;
  margin-top:26px;
  margin-bottom:26px;
}
.box-limits-title{
  margin-bottom:10px;
}
.for-whom,
.summary-card,
.simple-card,
.quote-card,
.final-cta-card{
  padding:28px 24px;
}
.card-alt,
.module-item,
.zone{
  padding:22px 20px;
}
.card-material{
  padding-top:22px;
  padding-bottom:23px;
}
.offer{
  padding-top:30px;
  padding-bottom:32px;
}
.guarantee{
  padding-top:26px;
  padding-bottom:26px;
}
@media (max-width:899px){
  .flow-after{
    max-width:100%;
    margin-top:24px;
    font-size:15.8px;
    line-height:1.58;
  }
  .flow-after.text-center{
    max-width:92%;
  }
  .cards-numbers + .flow-after,
  .cards-alternatives + .flow-after,
  .cards-materials + .flow-after,
  .zone-list + .flow-after,
  .checklist + .flow-after,
  .list-soft + .flow-after,
  .list-not + .flow-after,
  .module-list + .flow-after{
    margin-top:22px;
  }
  .card-number{
    padding:21px 19px;
  }
  .card-number-num{
    font-size:34px;
    margin-bottom:8px;
  }
  .card-number h3{
    margin-bottom:7px;
  }
  .card-number p{
    font-size:15.5px;
    line-height:1.52;
  }
  .cards-numbers{
    gap:16px;
  }
  .box-limits,
  .preview-warning{
    padding:19px 18px;
    margin-top:24px;
    margin-bottom:24px;
  }
  .box-limits-title{
    margin-bottom:9px;
    font-size:18px;
    line-height:1.28;
  }
  .for-whom,
  .summary-card,
  .simple-card,
  .quote-card,
  .final-cta-card{
    padding:23px 19px;
  }
  .card-alt,
  .module-item,
  .zone{
    padding:19px 18px;
  }
  .card-material{
    padding:21px 18px 22px;
  }
  .offer{
    padding:28px 19px 30px;
  }
  .guarantee{
    padding:23px 19px;
  }
}
@media (max-width:420px){
  .flow-after.text-center{
    max-width:96%;
  }
  .card-number{
    padding:20px 18px;
  }
  .card-number-num{
    font-size:32px;
  }
  .box-limits,
  .preview-warning,
  .for-whom,
  .summary-card,
  .simple-card,
  .quote-card,
  .final-cta-card,
  .offer,
  .guarantee{
    padding-left:17px;
    padding-right:17px;
  }
}


/* ============================================================
   NOVA ETAPA 5 — CONSOLIDAÇÃO VISUAL FINAL DO CSS
   Objetivo: estabilizar a hierarquia mobile depois das rodadas
   de refinamento, evitando que regras genéricas voltem a inflar
   imagens, seções, cards ou textos.
============================================================ */

/* Guardrails gerais: imagem nunca vira banner por acidente */
.hero .img-frame.hero-visual,
.img-frame.proof-visual,
.offer-wrap .img-frame,
.offer-wrap .img-frame.is-paper,
.img-frame.is-paper:not(.hero-visual):not(.proof-visual){
  margin-left:auto;
  margin-right:auto;
}

.hero .img-frame.hero-visual img,
.img-frame.proof-visual img,
.offer-wrap .img-frame img,
.img-frame.is-paper img{
  height:auto !important;
  object-fit:contain;
}

/* Separação final entre imagem decorativa/produto e prova visual */
.hero .img-frame.hero-visual{
  box-shadow:var(--shadow-sm);
}

.img-frame.proof-visual{
  box-shadow:var(--shadow-md);
}

.offer-wrap .img-frame,
.offer-wrap .img-frame.is-paper{
  box-shadow:var(--shadow-sm);
}

/* Cadência editorial final */
.eyebrow + h2{
  margin-bottom:0;
}

h2 + p,
.eyebrow + h2 + p{
  margin-top:13px;
}

.col-text > p,
.col-wide > p{
  max-width:640px;
}

.col-text > .editorial-copy,
.col-wide > .editorial-copy{
  max-width:620px;
}

/* Fechamentos: não deixar parecer texto perdido */
.flow-after{
  color:var(--ink-2);
}

.flow-after.text-center{
  margin-left:auto;
  margin-right:auto;
}

/* Cards e caixas: consistência final */
.card-number,
.card-alt,
.card-material,
.module-item,
.zone,
.box-limits,
.preview-warning,
.for-whom,
.summary-card,
.simple-card,
.quote-card,
.final-cta-card,
.offer,
.guarantee{
  overflow:hidden;
}

.cards-numbers,
.cards-alternatives,
.cards-materials,
.zone-list,
.module-list{
  align-items:stretch;
}

/* Legal: preservar fechamento sem excesso */
.legal-zone{
  clear:both;
}

@media (max-width:899px){
  /* Topo e início da página */
  .hero{
    padding-top:48px;
    padding-bottom:30px;
  }

  .hero + section,
  header.hero + section{
    padding-top:34px;
  }

  section{
    padding-top:38px;
    padding-bottom:38px;
  }

  /* Tamanho final das capas verticais: trava contra expansão */
  .hero .img-frame.hero-visual{
    max-height:none;
  }

  .hero .img-frame.hero-visual img{
    max-height:360px;
    width:auto;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
  }

  /* Provas visuais podem ser maiores, mas não dominam a tela */
  .img-frame.proof-visual img{
    max-height:390px;
    width:auto;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
  }

  /* Imagens de oferta/capa secundária ficam menores que provas */
  .offer-wrap .img-frame img,
  .offer-wrap .img-frame.is-paper img,
  .img-frame.is-paper:not(.hero-visual):not(.proof-visual) img{
    max-height:330px;
    width:auto;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
  }

  /* Cards de material não podem virar hero */
  .card-material img{
    max-height:260px;
    width:auto;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
  }

  /* Tipografia e blocos */
  .eyebrow{
    margin-bottom:12px;
  }

  h2 + p,
  .eyebrow + h2 + p{
    margin-top:12px;
  }

  .col-text > p,
  .col-wide > p,
  .editorial-copy{
    max-width:100%;
  }

  .cards-numbers,
  .cards-alternatives,
  .cards-materials,
  .zone-list,
  .module-list{
    margin-top:28px;
    gap:16px;
  }

  .flow-after{
    margin-top:22px;
  }

  .cards-numbers + .flow-after,
  .cards-alternatives + .flow-after,
  .cards-materials + .flow-after,
  .zone-list + .flow-after,
  .checklist + .flow-after,
  .list-soft + .flow-after,
  .list-not + .flow-after,
  .module-list + .flow-after{
    margin-top:22px;
  }

  .box-limits,
  .preview-warning,
  .for-whom,
  .summary-card,
  .simple-card,
  .quote-card,
  .final-cta-card{
    margin-top:24px;
    margin-bottom:24px;
  }

  .cta-group{
    margin-top:28px;
  }
}

@media (max-width:420px){
  .hero{
    padding-top:44px;
    padding-bottom:28px;
  }

  .hero + section,
  header.hero + section{
    padding-top:32px;
  }

  section{
    padding-top:36px;
    padding-bottom:36px;
  }

  .hero .img-frame.hero-visual img{
    max-height:340px;
  }

  .img-frame.proof-visual img{
    max-height:370px;
  }

  .offer-wrap .img-frame img,
  .offer-wrap .img-frame.is-paper img,
  .img-frame.is-paper:not(.hero-visual):not(.proof-visual) img{
    max-height:310px;
  }

  .card-material img{
    max-height:240px;
  }
}


/* ============================================================
   CORREÇÃO DE IMAGENS — ETAPA 1
   Detector: hero menor; prova horizontal preservada; capa repetida reduzida.
============================================================ */
.hero .img-frame.hero-visual{
  max-width:224px !important;
  margin-top:18px !important;
}
.hero .img-frame.hero-visual img{
  width:auto !important;
  max-width:100% !important;
  max-height:314px !important;
}
.img-frame.proof-visual{
  max-width:310px !important;
}
.img-frame.proof-visual img{
  max-height:286px !important;
}
.img-frame.is-paper:not(.hero-visual):not(.proof-visual){
  max-width:194px !important;
}
.img-frame.is-paper:not(.hero-visual):not(.proof-visual) img{
  max-height:250px !important;
}
.offer-wrap .img-frame,
.offer-wrap .img-frame.is-paper{
  max-width:194px !important;
}
.offer-wrap .img-frame img,
.offer-wrap .img-frame.is-paper img{
  max-height:250px !important;
}
@media (max-width:899px){
  .hero .img-frame.hero-visual{max-width:208px !important;}
  .hero .img-frame.hero-visual img{max-height:290px !important;}
  .img-frame.proof-visual{max-width:286px !important;}
  .img-frame.proof-visual img{max-height:266px !important;}
  .img-frame.is-paper:not(.hero-visual):not(.proof-visual),
  .offer-wrap .img-frame,
  .offer-wrap .img-frame.is-paper{max-width:184px !important;}
  .img-frame.is-paper:not(.hero-visual):not(.proof-visual) img,
  .offer-wrap .img-frame img,
  .offer-wrap .img-frame.is-paper img{max-height:236px !important;}
}
@media (max-width:420px){
  .hero .img-frame.hero-visual{max-width:198px !important;}
  .hero .img-frame.hero-visual img{max-height:276px !important;}
}


/* ============================================================
   CORREÇÃO DE IMAGENS — ETAPA 2
   Objetivo: quando a mesma capa vertical aparece de novo na
   página, ela deixa de se comportar como prova principal e vira
   apoio visual menor.
============================================================ */
.img-frame.repeated-cover{
  box-shadow:var(--shadow-sm) !important;
  opacity:.96;
}

.img-frame.proof-cover-repeat{
  max-width:168px !important;
  margin-top:22px !important;
  margin-bottom:22px !important;
}

.img-frame.proof-cover-repeat img{
  width:auto !important;
  max-width:100% !important;
  max-height:218px !important;
  object-fit:contain !important;
}

.img-frame.secondary-cover-repeat{
  max-width:162px !important;
  margin-top:20px !important;
  margin-bottom:20px !important;
}

.img-frame.secondary-cover-repeat img{
  width:auto !important;
  max-width:100% !important;
  max-height:210px !important;
  object-fit:contain !important;
}

/* Em blocos de oferta, capa repetida deve apoiar a decisão, não virar segunda hero. */
.offer-wrap .img-frame.repeated-cover,
.offer-wrap .img-frame.proof-cover-repeat,
.offer-wrap .img-frame.secondary-cover-repeat{
  max-width:156px !important;
}

.offer-wrap .img-frame.repeated-cover img,
.offer-wrap .img-frame.proof-cover-repeat img,
.offer-wrap .img-frame.secondary-cover-repeat img{
  max-height:202px !important;
}

/* Provas horizontais reais continuam com presença maior. */
.img-frame.proof-visual:not(.proof-cover-repeat) img{
  object-fit:contain !important;
}

@media (max-width:899px){
  .img-frame.proof-cover-repeat{
    max-width:154px !important;
    margin-top:20px !important;
    margin-bottom:20px !important;
  }

  .img-frame.proof-cover-repeat img{
    max-height:200px !important;
  }

  .img-frame.secondary-cover-repeat{
    max-width:150px !important;
    margin-top:18px !important;
    margin-bottom:18px !important;
  }

  .img-frame.secondary-cover-repeat img{
    max-height:194px !important;
  }

  .offer-wrap .img-frame.repeated-cover,
  .offer-wrap .img-frame.proof-cover-repeat,
  .offer-wrap .img-frame.secondary-cover-repeat{
    max-width:146px !important;
  }

  .offer-wrap .img-frame.repeated-cover img,
  .offer-wrap .img-frame.proof-cover-repeat img,
  .offer-wrap .img-frame.secondary-cover-repeat img{
    max-height:188px !important;
  }
}

@media (max-width:420px){
  .img-frame.proof-cover-repeat{
    max-width:146px !important;
  }

  .img-frame.proof-cover-repeat img{
    max-height:188px !important;
  }

  .img-frame.secondary-cover-repeat{
    max-width:142px !important;
  }

  .img-frame.secondary-cover-repeat img{
    max-height:184px !important;
  }

  .offer-wrap .img-frame.repeated-cover,
  .offer-wrap .img-frame.proof-cover-repeat,
  .offer-wrap .img-frame.secondary-cover-repeat{
    max-width:138px !important;
  }

  .offer-wrap .img-frame.repeated-cover img,
  .offer-wrap .img-frame.proof-cover-repeat img,
  .offer-wrap .img-frame.secondary-cover-repeat img{
    max-height:178px !important;
  }
}


/* ============================================================
   CORREÇÃO DE IMAGENS — ETAPA 3
   Ajuste cirúrgico do Detector: hero compacto, prova horizontal
   preservada e capa repetida mínima.
============================================================ */
body.page-detector .hero .img-frame.hero-visual{
  max-width:206px !important;
  margin-top:16px !important;
}
body.page-detector .hero .img-frame.hero-visual img{
  max-height:288px !important;
}
body.page-detector .img-frame.proof-visual:not(.proof-cover-repeat){
  max-width:292px !important;
}
body.page-detector .img-frame.proof-visual:not(.proof-cover-repeat) img{
  max-height:262px !important;
}
body.page-detector .img-frame.repeated-cover{
  max-width:146px !important;
}
body.page-detector .img-frame.repeated-cover img{
  max-height:188px !important;
}
@media (max-width:899px){
  body.page-detector .hero .img-frame.hero-visual{
    max-width:188px !important;
  }
  body.page-detector .hero .img-frame.hero-visual img{
    max-height:264px !important;
  }
  body.page-detector .img-frame.proof-visual:not(.proof-cover-repeat){
    max-width:270px !important;
  }
  body.page-detector .img-frame.proof-visual:not(.proof-cover-repeat) img{
    max-height:244px !important;
  }
  body.page-detector .img-frame.repeated-cover{
    max-width:136px !important;
  }
  body.page-detector .img-frame.repeated-cover img{
    max-height:176px !important;
  }
}
@media (max-width:420px){
  body.page-detector .hero .img-frame.hero-visual{
    max-width:178px !important;
  }
}


/* ============================================================
   CORREÇÃO DE IMAGENS — ETAPA 4
   Objetivo: impedir que imagens de oferta, cards e blocos finais
   virem novos heros. Capas verticais nesses contextos passam a
   funcionar como thumbnail de apoio, não como peça dominante.
============================================================ */

/* Cards de material: capa pequena, editorial, sem dominar o card */
.card-material img{
  width:auto !important;
  max-width:126px !important;
  max-height:174px !important;
  margin:0 auto 16px !important;
  display:block !important;
  object-fit:contain !important;
}

/* Blocos de oferta: imagem apoia a decisão, não concorre com o CTA */
.offer-wrap .img-frame,
.offer-wrap .img-frame.is-paper,
.offer-wrap .img-frame.repeated-cover,
.offer-wrap .img-frame.secondary-cover-repeat,
.offer-wrap .img-frame.proof-cover-repeat{
  max-width:132px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

.offer-wrap .img-frame img,
.offer-wrap .img-frame.is-paper img,
.offer-wrap .img-frame.repeated-cover img,
.offer-wrap .img-frame.secondary-cover-repeat img,
.offer-wrap .img-frame.proof-cover-repeat img{
  width:auto !important;
  max-width:100% !important;
  max-height:170px !important;
  object-fit:contain !important;
}

/* Blocos finais e cards auxiliares: imagem sempre secundária */
.final-cta-card img,
.summary-card img,
.simple-card img,
.delivery-card img,
.use-card img{
  width:auto !important;
  max-width:104px !important;
  max-height:142px !important;
  margin:0 auto 14px !important;
  display:block !important;
  object-fit:contain !important;
}

/* Capas repetidas em qualquer bloco final ficam ainda menores */
.final-cta-card .repeated-cover,
.summary-card .repeated-cover,
.simple-card .repeated-cover,
.delivery-card .repeated-cover,
.use-card .repeated-cover{
  max-width:96px !important;
}

/* Figuras repetidas fora do hero: garantir escala de apoio */
.img-frame.secondary-cover-repeat,
.img-frame.proof-cover-repeat{
  max-width:142px !important;
}

.img-frame.secondary-cover-repeat img,
.img-frame.proof-cover-repeat img{
  max-height:184px !important;
}

/* Evita sombra/peso excessivo em imagem pequena de apoio */
.offer-wrap .img-frame,
.card-material img,
.final-cta-card img,
.summary-card img,
.simple-card img,
.delivery-card img,
.use-card img{
  box-shadow:var(--shadow-sm);
}

@media (max-width:899px){
  .card-material img{
    max-width:112px !important;
    max-height:154px !important;
    margin-bottom:14px !important;
  }

  .offer-wrap .img-frame,
  .offer-wrap .img-frame.is-paper,
  .offer-wrap .img-frame.repeated-cover,
  .offer-wrap .img-frame.secondary-cover-repeat,
  .offer-wrap .img-frame.proof-cover-repeat{
    max-width:118px !important;
  }

  .offer-wrap .img-frame img,
  .offer-wrap .img-frame.is-paper img,
  .offer-wrap .img-frame.repeated-cover img,
  .offer-wrap .img-frame.secondary-cover-repeat img,
  .offer-wrap .img-frame.proof-cover-repeat img{
    max-height:152px !important;
  }

  .final-cta-card img,
  .summary-card img,
  .simple-card img,
  .delivery-card img,
  .use-card img{
    max-width:92px !important;
    max-height:126px !important;
    margin-bottom:12px !important;
  }

  .img-frame.secondary-cover-repeat,
  .img-frame.proof-cover-repeat{
    max-width:126px !important;
  }

  .img-frame.secondary-cover-repeat img,
  .img-frame.proof-cover-repeat img{
    max-height:164px !important;
  }
}

@media (max-width:420px){
  .card-material img{
    max-width:104px !important;
    max-height:144px !important;
  }

  .offer-wrap .img-frame,
  .offer-wrap .img-frame.is-paper,
  .offer-wrap .img-frame.repeated-cover,
  .offer-wrap .img-frame.secondary-cover-repeat,
  .offer-wrap .img-frame.proof-cover-repeat{
    max-width:110px !important;
  }

  .offer-wrap .img-frame img,
  .offer-wrap .img-frame.is-paper img,
  .offer-wrap .img-frame.repeated-cover img,
  .offer-wrap .img-frame.secondary-cover-repeat img,
  .offer-wrap .img-frame.proof-cover-repeat img{
    max-height:142px !important;
  }

  .final-cta-card img,
  .summary-card img,
  .simple-card img,
  .delivery-card img,
  .use-card img{
    max-width:84px !important;
    max-height:116px !important;
  }

  .img-frame.secondary-cover-repeat,
  .img-frame.proof-cover-repeat{
    max-width:118px !important;
  }

  .img-frame.secondary-cover-repeat img,
  .img-frame.proof-cover-repeat img{
    max-height:154px !important;
  }
}
