/* =========================================================================
   css/style.css — O Manual da Empreendedora Lucrativa (Landing Page)
   HTML5 + CSS3 puro, sem frameworks. Organizado por seção.
   ========================================================================= */

/* ---------- 1. Tokens ---------- */
:root{
  --bg:#FFF8ED;
  --primary:#FF66C4;
  --secondary:#E94DAF;
  --white:#FFFFFF;
  --dark:#2E2A2C;
  --text:#3A3335;
  --text-muted:#7A7176;
  --border:#F0E2D0;
  --success:#27AE60;
  --success-bg:#E3F5EA;

  --radius-sm:12px; --radius-md:20px; --radius-lg:28px; --radius-xl:36px;
  --shadow-sm:0 8px 24px -14px rgba(60,30,40,.16);
  --shadow-md:0 20px 48px -20px rgba(60,30,40,.20);
  --shadow-lg:0 34px 70px -24px rgba(60,30,40,.28);
  --shadow-primary:0 18px 38px -12px rgba(233,77,175,.45);
  --ease:cubic-bezier(.16,1,.3,1);
  --container:1180px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:16.5px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{ font-family:'Poppins',sans-serif; margin:0; color:var(--dark); letter-spacing:-.3px; }
p{ margin:0; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; height:auto; display:block; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; }
::selection{ background:var(--primary); color:#fff; }
:focus-visible{ outline:2.5px solid var(--secondary); outline-offset:3px; }
@media (prefers-reduced-motion: reduce){ *{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; } }

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--dark); color:#fff; padding:12px 20px;
  z-index:1000; border-radius:0 0 10px 0;
}
.skip-link:focus{ left:0; }

.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }
.container-narrow{ max-width:760px; }
.ico{ width:16px; height:16px; flex:0 0 auto; }
.ico-lg{ width:34px; height:34px; color:var(--secondary); margin-bottom:16px; }

/* ---------- 2. Reveal on scroll (IntersectionObserver via JS) ---------- */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.in-view{ opacity:1; transform:translateY(0); }

/* ---------- 3. Announcement + Header ---------- */
.announce{
  background:var(--secondary); color:#fff; text-align:center; font-family:'Poppins',sans-serif;
  font-weight:600; font-size:13.5px; padding:10px 16px;
}
.site-header{
  position:sticky; top:0; z-index:50; background:rgba(255,248,237,.92); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border);
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; padding:14px 24px; }

/* ---------- Marca "Empreendedora Lucrativa" ----------
   Reaproveita a coroa minimalista e a combinação de fontes (negrito +
   script) da capa do eBook. Usada no header e no rodapé. */
.brand-mark{ display:inline-flex; align-items:center; gap:8px; }
.brand-mark .crown{ width:20px; height:14px; color:var(--secondary); flex:0 0 auto; }
.brand-mark .word{ display:inline-flex; align-items:baseline; gap:5px; line-height:1; }
.brand-mark .word .main{ font-family:'Poppins',sans-serif; font-weight:800; font-size:12.5px; letter-spacing:1.1px; color:var(--dark); }
.brand-mark .word .script{ font-family:'Alex Brush',cursive; font-size:23px; color:var(--secondary); }
.brand-mark-footer .word .main{ color:#fff; }

/* ---------- 4. Buttons ---------- */
.btn{
  font-family:'Poppins',sans-serif; font-weight:700; font-size:14.5px; border:none; border-radius:100px;
  padding:14px 26px; display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer;
  transition:transform .16s var(--ease), box-shadow .16s ease, filter .16s ease;
}
.btn:active{ transform:scale(.97); }
.btn-primary{ background:linear-gradient(135deg,var(--primary),var(--secondary)); color:#fff; box-shadow:var(--shadow-primary); }
.btn-primary:hover{ filter:brightness(1.05); transform:translateY(-1px); }
.btn-white{ background:#fff; color:var(--secondary); }
.btn-white:hover{ transform:translateY(-1px); }
.btn-sm{ padding:10px 18px; font-size:13px; }
.btn-lg{ padding:17px 34px; font-size:16px; }
.btn-block{ width:100%; }

/* ---------- 5. Hero ---------- */
.hero{ position:relative; overflow:hidden; padding:72px 0 60px; }
.blob{ position:absolute; border-radius:50%; z-index:0; pointer-events:none; }
.blob-a{ width:520px; height:520px; background:var(--primary); opacity:.10; top:-220px; right:-160px; }
.blob-b{ width:380px; height:380px; background:var(--secondary); opacity:.08; bottom:-180px; left:-150px; }
.hero-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1.05fr .95fr; gap:60px; align-items:center; }
.eyebrow{
  display:inline-block; font-family:'Poppins',sans-serif; font-weight:700; font-size:12.5px;
  letter-spacing:1.4px; text-transform:uppercase; color:var(--secondary);
}
.hero h1{ font-size:46px; font-weight:800; line-height:1.12; margin:16px 0 18px; }
.hero h1 span{ color:var(--primary); }
.hero-sub{ font-size:17px; color:var(--text-muted); max-width:520px; margin-bottom:18px; line-height:1.7; }
.hero-highlight{
  display:inline-block; font-size:14.5px; font-weight:600; color:var(--secondary);
  background:#FDEAF4; border:1px solid #FBD9EE; border-radius:100px; padding:10px 18px;
  margin-bottom:26px; max-width:520px; line-height:1.5;
}
.hero-highlight b{ font-weight:800; }
.trust-list{ display:flex; flex-wrap:wrap; gap:18px; margin-top:26px; }
.trust-list li{ display:flex; align-items:center; gap:7px; font-size:13.5px; font-weight:600; color:var(--text); }
.trust-list .ico{ color:var(--success); }

.hero-visual{ position:relative; }
.hero-cover{ border-radius:18px; box-shadow:var(--shadow-lg); position:relative; z-index:1; }
.floating-card{
  position:absolute; background:#fff; border-radius:16px; box-shadow:var(--shadow-md); padding:13px 16px;
  display:flex; align-items:center; gap:10px; font-family:'Poppins',sans-serif; z-index:2;
}
.floating-card b{ display:block; font-size:13px; }
.floating-card span{ font-size:11px; color:var(--text-muted); font-weight:500; }
.fc-ico{ font-size:20px; }
.floating-card-1{ top:14%; right:-8%; }
.floating-card-2{ bottom:8%; left:-10%; }

/* ---------- 6. Section base ---------- */
.section{ padding:88px 0; }
.section-alt{ background:var(--white); }
.section-head{ text-align:center; max-width:680px; margin:0 auto 48px; }
.section-head h2{ font-size:32px; font-weight:800; margin:14px 0 10px; }
.section-desc{ font-size:15.5px; color:var(--text-muted); }
.lede{ font-size:16px; color:var(--text-muted); margin-top:16px; line-height:1.75; }

/* ---------- 7. Problema ---------- */
.problem-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.problem-card{
  background:var(--white); border-radius:var(--radius-md); padding:28px 24px; box-shadow:var(--shadow-sm);
  transition:transform .2s var(--ease), box-shadow .2s ease;
}
.problem-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.problem-card p{ font-size:15px; font-weight:600; color:var(--text); line-height:1.5; }

/* ---------- 8. Solução ---------- */
.solucao-grid{ display:grid; grid-template-columns:1fr .85fr; gap:56px; align-items:center; }
.solucao-img{ border-radius:22px; box-shadow:var(--shadow-lg); max-width:320px; margin:0 auto; }

/* ---------- 9. Oferta (value stack) ---------- */
.offer-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:28px; }
.offer-card{
  background:var(--white); border-radius:var(--radius-md); padding:28px 24px; box-shadow:var(--shadow-sm); text-align:left;
  display:flex; flex-direction:column; transition:transform .2s var(--ease), box-shadow .2s ease;
}
.offer-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.offer-ico{ font-size:30px; margin-bottom:14px; }
.offer-card h3{ font-size:16.5px; margin-bottom:8px; }
.offer-card p{ font-size:13.5px; color:var(--text-muted); line-height:1.55; flex:1; }
.offer-value{ margin-top:16px; font-family:'Poppins',sans-serif; font-weight:700; font-size:13.5px; color:var(--secondary); }
.offer-value s{ color:#b3a8ac; }

.offer-bonus{
  display:flex; align-items:center; gap:16px; background:var(--white); border:1.5px dashed var(--secondary);
  border-radius:var(--radius-md); padding:18px 22px; margin-bottom:28px;
}
.offer-bonus-ico{ font-size:28px; }
.offer-bonus b{ display:block; font-size:14.5px; }
.offer-bonus span{ font-size:13px; color:var(--text-muted); }

.offer-total{
  max-width:520px; margin:0 auto; background:var(--white); border-radius:var(--radius-lg);
  padding:34px 36px; box-shadow:var(--shadow-md); text-align:center;
}
.offer-total-row{ display:flex; justify-content:space-between; align-items:baseline; padding:8px 0; font-weight:600; font-size:15px; }
.offer-total-old{ font-family:'Poppins',sans-serif; font-weight:700; color:#b3a8ac; text-decoration:line-through; }
.offer-total-final{ border-top:1.5px dashed var(--border); margin-top:6px; padding-top:16px; }
.offer-total-price{ font-family:'Poppins',sans-serif; font-weight:800; font-size:30px; color:var(--secondary); }
.offer-total-note{ font-size:13px; color:var(--text-muted); margin-top:10px; }
.offer-total .btn{ margin-top:18px; }

/* ---------- 10. Demonstração ---------- */
.demo-grid{ display:grid; grid-template-columns:1.1fr 1fr 1fr; grid-auto-rows:auto; gap:20px; }
.demo-item{ margin:0; background:var(--bg); border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-sm); }
.demo-item img{ width:100%; height:auto; display:block; }
.demo-item figcaption{ text-align:center; font-size:12.5px; font-weight:700; color:var(--text-muted); padding:12px; font-family:'Poppins',sans-serif; }
.demo-item-tall{ grid-row:span 2; }

/* ---------- 11. Benefícios ---------- */
.benefit-list{ max-width:640px; margin:0 auto; display:flex; flex-direction:column; gap:4px; }
.benefit-list li{
  display:flex; align-items:center; gap:14px; padding:16px 4px; font-size:16px; font-weight:600;
  border-bottom:1px solid var(--border);
}
.benefit-list li:last-child{ border-bottom:none; }
.benefit-list .check{
  width:28px; height:28px; border-radius:50%; background:var(--success-bg); color:var(--success);
  display:flex; align-items:center; justify-content:center; font-size:14px; flex:0 0 auto;
}

/* ---------- 12. Para quem é ---------- */
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.tag-card{
  background:var(--bg); border:1.5px solid var(--border); border-radius:100px; padding:16px 12px;
  text-align:center; font-weight:700; font-size:14px; color:var(--secondary);
}

/* ---------- 13. Garantia ---------- */
.guarantee-card{
  display:flex; align-items:center; gap:34px; background:linear-gradient(135deg,#FFFFFF,#FFF3F9);
  border:1.5px solid var(--border); border-radius:var(--radius-xl); padding:40px 44px; box-shadow:var(--shadow-sm);
}
.guarantee-seal{
  flex:0 0 auto; width:120px; height:120px; border-radius:50%; background:var(--white); box-shadow:var(--shadow-md);
  display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:32px; gap:2px;
}
.guarantee-seal span{ font-family:'Poppins',sans-serif; font-weight:800; font-size:13px; color:var(--secondary); }
.guarantee-card h2{ font-size:24px; margin-bottom:10px; }
.guarantee-card p{ font-size:15px; color:var(--text-muted); line-height:1.7; max-width:560px; }

/* ---------- 14. FAQ ---------- */
.faq-list{ display:flex; flex-direction:column; gap:12px; }
.faq-item{ background:var(--white); border-radius:14px; padding:4px 22px; box-shadow:var(--shadow-sm); }
.faq-item summary{
  list-style:none; cursor:pointer; padding:18px 0; font-family:'Poppins',sans-serif; font-weight:700; font-size:15.5px;
  display:flex; justify-content:space-between; align-items:center; gap:14px;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item .chev{ color:var(--secondary); transition:transform .2s ease; flex:0 0 auto; }
.faq-item[open] .chev{ transform:rotate(180deg); }
.faq-a{ padding:0 0 20px; color:var(--text-muted); font-size:14.5px; line-height:1.7; }

/* ---------- 15. CTA final ---------- */
.final-cta{
  text-align:center; background:linear-gradient(160deg,var(--secondary),var(--primary)); border-radius:var(--radius-xl);
  padding:60px 40px; color:#fff; box-shadow:var(--shadow-lg);
}
.final-cta h2{ color:#fff; font-size:30px; margin:12px 0 14px; }
.final-cta p{ max-width:560px; margin:0 auto 26px; opacity:.92; font-size:15.5px; line-height:1.7; }
.final-cta-price{ display:flex; align-items:baseline; justify-content:center; gap:14px; margin-bottom:12px; }
.final-cta-price .offer-total-old{ color:rgba(255,255,255,.7); }
.final-cta-price .offer-total-price{ color:#fff; font-size:36px; }
.final-cta-bonus-note{ font-size:13px; opacity:.9; margin-bottom:24px; }
.final-cta-trust{ margin-top:20px; font-size:12.5px; opacity:.85; }

/* ---------- 16. Rodapé ---------- */
.site-footer{ background:var(--dark); color:#cfc7ca; padding:52px 0 26px; font-size:13.5px; }
.footer-grid{ display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; padding-bottom:30px; }
.brand-footer{ color:#fff; margin-bottom:10px; }
.footer-desc{ max-width:320px; color:#a89fa3; line-height:1.6; }
.footer-links{ display:flex; gap:56px; flex-wrap:wrap; }
.footer-links h4{ color:#fff; font-size:13px; margin-bottom:12px; }
.footer-links a{ display:block; color:#a89fa3; margin-bottom:8px; transition:color .15s ease; }
.footer-links a:hover{ color:#fff; }
.footer-disclaimer{ border-top:1px solid #443f42; padding-top:20px; color:#878083; font-size:11.5px; line-height:1.7; }

/* ---------- 17. Sticky CTA (mobile) ---------- */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:60; background:#fff; box-shadow:0 -10px 30px -14px rgba(0,0,0,.25);
  padding:12px 18px; display:none; align-items:center; justify-content:space-between; gap:14px;
  transform:translateY(100%); transition:transform .3s var(--ease);
}
.sticky-cta.show{ transform:translateY(0); }
.sticky-price{ font-family:'Poppins',sans-serif; font-weight:800; color:var(--secondary); font-size:18px; }

/* ---------- 18. Responsivo ---------- */
@media (max-width:960px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-visual{ order:-1; max-width:320px; margin:0 auto 12px; }
  .hero h1{ font-size:34px; }
  .problem-grid{ grid-template-columns:1fr 1fr; }
  .offer-grid{ grid-template-columns:1fr 1fr; }
  .solucao-grid{ grid-template-columns:1fr; }
  .solucao-grid > div:last-child{ order:-1; }
  .demo-grid{ grid-template-columns:1fr 1fr; }
  .demo-item-tall{ grid-row:span 1; grid-column:span 2; }
  .grid-4{ grid-template-columns:1fr 1fr; }
  .guarantee-card{ flex-direction:column; text-align:center; padding:34px 26px; }
  .floating-card{ display:none; }
}
@media (max-width:600px){
  .section{ padding:60px 0; }
  .problem-grid,.offer-grid,.demo-grid,.grid-4{ grid-template-columns:1fr; }
  .demo-item-tall{ grid-column:span 1; }
  .section-head h2, .hero h1{ font-size:26px; }
  .final-cta{ padding:44px 24px; }
  .sticky-cta{ display:flex; }
  body{ padding-bottom:74px; }
  .header-inner .btn-sm{ padding:9px 14px; font-size:12px; }
}