/* ===================================================================
   PAPO DE MADRASTA — design tokens
   Cor:   magenta #E1006B (marca) · berry #4A0E2E (texto sobre claro)
          blush #FFF1F7 (fundo) · pale #F6C7DD (forma secundária)
          cream #FFFDFB (cartão) · gold #C79A3D (acento raro, luxo contido)
   Tipo:  Fraunces (display, serifada, peso variável) + Playball (script,
          ecoa o logo) + Manrope (interface / corpo)
   Assinatura: motivo de "bolhas de fala sobrepostas" do logo, usado como
          moldura de citação, divisor pontilhado e cantos de cartão.
=================================================================== */

:root{
  --magenta: #E1006B;
  --magenta-deep: #A80051;
  --magenta-soft: #FF4E9B;
  --berry: #4A0E2E;
  --blush: #FFF1F7;
  --blush-2: #FFE4F0;
  --pale: #F6C7DD;
  --cream: #FFFDFB;
  --ink: #3A2530;
  --ink-soft: #7A5F6C;
  --gold: #C79A3D;
  --line: rgba(74,14,46,0.12);

  --serif: "Fraunces", "Iowan Old Style", serif;
  --script: "Playball", cursive;
  --sans: "Manrope", -apple-system, "Segoe UI", sans-serif;

  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 10px;
  --shadow-card: 0 18px 40px -22px rgba(74,14,46,0.35);
  --container: 1180px;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--sans);
  color: var(--ink);
  background: var(--cream);
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration:none; }
h1,h2,h3{ font-family: var(--serif); color: var(--berry); margin:0 0 .4em; line-height:1.08; font-weight:600; }
p{ margin:0 0 1em; color: var(--ink-soft); line-height:1.7; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

.grain{
  position: fixed; inset:0; pointer-events:none; z-index: 999;
  opacity:.035; mix-blend-mode:multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.eyebrow{
  font: 700 .72rem/1 var(--sans); letter-spacing:.14em; text-transform:uppercase;
  color: var(--magenta-soft); margin:0 0 .9em;
}
.eyebrow--dark{ color: var(--magenta); }

.btn{
  display:inline-flex; align-items:center; gap:.5em;
  padding: .9em 1.6em; border-radius: 999px; font: 700 .95rem/1 var(--sans);
  cursor:pointer; border: 1.5px solid transparent; transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn:hover{ transform: translateY(-2px); }
.btn-primary{ background: var(--magenta); color:#fff; box-shadow: 0 14px 26px -12px rgba(225,0,107,.55); }
.btn-primary:hover{ background: var(--magenta-deep); }
.btn-ghost{ background: transparent; color: var(--berry); border-color: var(--berry); }
.btn-ghost:hover{ background: var(--berry); color:#fff; }
.btn-outline{ background: transparent; color: var(--magenta); border-color: var(--magenta); }
.btn-outline:hover{ background: var(--magenta); color:#fff; }

.link-arrow{ font-weight:700; color: var(--magenta); display:inline-block; }
.link-arrow:hover{ color: var(--magenta-deep); }

/* ============ NAV ============ */
.nav{
  position: sticky; top:0; z-index: 50;
  background: rgba(255,253,251,.86); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.nav-inner{
  max-width: var(--container); margin:0 auto; padding: .7rem 1.5rem;
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
}
.brand-mark{ height: 44px; width:auto; border-radius: 10px; }
.nav-links{ display:flex; gap:1.8rem; font-weight:600; font-size:.92rem; color: var(--berry); }
.nav-links a:hover{ color: var(--magenta); }
.nav-cta{
  background: var(--berry); color:#fff; padding:.6em 1.3em; border-radius:999px;
  font-weight:700; font-size:.88rem; white-space:nowrap;
}
.nav-cta:hover{ background: var(--magenta); }
@media (max-width: 780px){ .nav-links{ display:none; } }

/* ============ HERO ============ */
.hero{
  position:relative; overflow:hidden;
  padding: 6.5rem 1.5rem 5rem;
  background:
    radial-gradient(60% 55% at 82% 8%, var(--blush-2) 0%, transparent 60%),
    radial-gradient(50% 45% at 10% 95%, var(--pale) 0%, transparent 60%),
    var(--blush);
  text-align:center;
}
.hero-bubbles{ position:absolute; inset:0; z-index:0; }
.hero-bubbles .b{ position:absolute; border-radius:999px; opacity:.5; }
.b1{ width:220px; height:220px; background: var(--pale); top:-60px; left:-60px; }
.b2{ width:140px; height:140px; background: var(--blush-2); bottom:10%; right:6%; }
.b3{ width:70px; height:70px; background: var(--magenta-soft); opacity:.18; bottom:18%; left:8%; }

.hero-inner{ position:relative; z-index:1; max-width: 760px; margin:0 auto; }
.hero-title{ font-size: clamp(2.6rem, 6vw, 4.6rem); letter-spacing:-.01em; }
.hero-title .script{ font-family: var(--script); font-weight:400; color: var(--magenta); font-size: 1.12em; display:inline-block; transform: rotate(-2deg) translateY(.05em); }
.hero-sub{ font-size: 1.12rem; max-width: 560px; margin: 0 auto 2rem; }
.hero-sub-accent{ color: #D7263D; font-weight: 700; }
.hero-actions{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; margin-bottom: 2.6rem; }
.hero-social{ font-size:.85rem; color: var(--ink-soft); }
.hero-social span{ display:block; margin-bottom:.6em; letter-spacing:.04em; }
.social-row{ display:flex; gap:1.4rem; justify-content:center; flex-wrap:wrap; font-weight:700; color: var(--berry); }
.social-row a{ border-bottom: 2px solid transparent; padding-bottom:2px; }
.social-row a:hover{ border-color: var(--magenta); color: var(--magenta); }

/* ============ AD SLOTS — discretos ============ */
.ad-slot{ max-width: var(--container); margin: 0 auto; padding: 0 1.5rem; }
.ad-slot .ad-label{
  display:block; text-align:center; font: 700 .62rem/1 var(--sans);
  letter-spacing:.18em; text-transform:uppercase; color: var(--ink-soft);
  opacity:.55; margin-bottom:.5rem;
}
.ad-slot--strip{ margin-top: 3rem; margin-bottom: -1rem; }
.ad-slot--strip .ad-body{
  min-height: 90px; border-radius: var(--radius-sm);
  overflow: hidden;
  display:flex; align-items:center; justify-content:center;
}
.ad-slot--native{
  margin: 1rem auto 2.5rem; padding: 1.3rem; border-radius: var(--radius-md);
  background: var(--blush);
}
.ad-slot--native .ad-body{ min-height: 100px; overflow: hidden; }

/* ============ MINHA HISTÓRIA ============ */
.historia{ padding: 6rem 1.5rem; background: var(--cream); }
.historia-inner{
  max-width: var(--container); margin:0 auto; display:grid;
  grid-template-columns: .85fr 1.15fr; gap: 4rem; align-items:center;
}
.historia-media{ position:relative; }
.photo-frame{
  border-radius: var(--radius-lg); overflow:hidden; aspect-ratio: 4/5;
  background: linear-gradient(155deg, var(--pale), var(--blush-2));
  box-shadow: var(--shadow-card);
  position:relative;
}
.photo-placeholder{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  color: var(--magenta-deep); font-family: var(--serif); font-style:italic; font-size:1.1rem; opacity:.55;
}
.photo-real{ width:100%; height:100%; object-fit: cover; object-position: center 25%; }
.quote-bubble{
  position:absolute; left: -1.5rem; bottom: -1.8rem; max-width: 260px;
  background: #fff; padding: 1.3rem 1.5rem; border-radius: 22px 22px 22px 4px;
  box-shadow: var(--shadow-card); border: 1px solid var(--line);
}
.quote-bubble p{ margin:0; font-family: var(--serif); font-style: italic; color: var(--berry); font-size: .98rem; }
.historia-text h2{ font-size: clamp(2rem, 3.6vw, 2.8rem); }
.historia-text p{ font-size: 1.02rem; }

@media (max-width: 900px){
  .historia-inner{ grid-template-columns: 1fr; gap: 3.5rem; }
  .quote-bubble{ position:static; margin-top: 1.4rem; max-width:none; }
}

/* ============ ARTIGOS ============ */
.artigos{ padding: 5rem 1.5rem 2rem; background: var(--blush); }
.section-head{ max-width: var(--container); margin: 0 auto 2.6rem; text-align:left; }
.section-head h2{ font-size: clamp(1.9rem, 3.4vw, 2.6rem); }
.section-sub{ max-width: 560px; }
.section-head--light .eyebrow{ color: var(--magenta-soft); }
.section-head--light h2{ color: #fff; }

.post-grid{
  max-width: var(--container); margin: 0 auto; display:grid;
  grid-template-columns: repeat(3, 1fr); gap: 1.6rem;
}
.post-grid:has(.post-card--feature){ grid-template-columns: 1.6fr 1fr 1fr; }
.post-card{
  background: var(--cream); border-radius: var(--radius-md); overflow:hidden;
  box-shadow: var(--shadow-card); display:flex; flex-direction:column;
  transition: transform .22s ease, box-shadow .22s ease; position:relative;
  border: 1px solid var(--line);
}
.post-card:hover{ transform: translateY(-5px); }
.post-card--feature{ grid-row: span 2; }
.post-tag{
  position:absolute; top: 1rem; left:1rem; z-index:2; background: var(--magenta);
  color:#fff; font: 700 .68rem/1 var(--sans); padding:.45em .8em; border-radius:999px; letter-spacing:.05em;
}
.post-thumb{ aspect-ratio: 16/10; background-size: cover; background-position: center; }
.post-card--feature .post-thumb{ aspect-ratio: 16/13; }
.post-thumb--1{ background: linear-gradient(140deg, #F6C7DD, #E1006B); }
.post-thumb--2{ background: linear-gradient(140deg, #FFE4F0, #FF8FC0); }
.post-thumb--3{ background: linear-gradient(140deg, #F6C7DD, #C79A3D33, #E1006B); }
.post-thumb--4{ background: linear-gradient(140deg, #FFD3E6, #A80051); }
.post-thumb--5{ background: linear-gradient(140deg, #F6C7DD, #7A5F6C); }
.post-thumb--6{ background: linear-gradient(140deg, #FFE4F0, #E1006B); }
.post-content{ padding: 1.4rem 1.5rem 1.7rem; }
.post-meta{ font: 700 .72rem/1 var(--sans); letter-spacing:.06em; text-transform:uppercase; color: var(--magenta); }
.post-content h3{ font-size: 1.15rem; margin-top:.6em; margin-bottom:0; }
.post-card--feature .post-content h3{ font-size: 1.5rem; }
.post-card--feature .post-content p{ margin-top:.6em; font-size:.95rem; }

.post-grid--single{ grid-template-columns: 1fr; max-width: 640px; }
.post-grid--single .post-thumb{ aspect-ratio: 21/9; }

.artigos-cta{ max-width: var(--container); margin: 2.6rem auto 4rem; text-align:center; }

@media (max-width: 900px){
  .post-grid, .post-grid:has(.post-card--feature){ grid-template-columns: 1fr 1fr; }
  .post-card--feature{ grid-column: span 2; grid-row: auto; }
}
@media (max-width: 620px){
  .post-grid, .post-grid:has(.post-card--feature){ grid-template-columns: 1fr; }
  .post-card--feature{ grid-column: auto; }
}

/* ============ JORNADA SEJA ESSÊNCIA ============ */
.jornada{ padding: 5.5rem 1.5rem; background: var(--cream); }
.jornada-inner{
  max-width: var(--container); margin:0 auto; display:grid;
  grid-template-columns: 1.15fr .85fr; gap: 4rem; align-items:center;
}
.jornada-text h2{ font-size: clamp(2rem, 3.6vw, 2.8rem); }
.jornada-text p{ font-size: 1.03rem; max-width: 480px; }
.jornada-list{ list-style:none; margin: 0 0 2rem; padding:0; display:flex; flex-direction:column; gap:.7rem; }
.jornada-list li{
  font-weight:700; color: var(--berry); font-size:.96rem;
  padding-left: 1.6em; position:relative;
}
.jornada-list li::before{
  content:"✦"; position:absolute; left:0; color: var(--magenta); font-size:.85em; top:.1em;
}
.jornada-media{ display:flex; justify-content:center; }
.jornada-badge{
  width: 260px; aspect-ratio: 1; border-radius: 50%;
  background: linear-gradient(155deg, var(--pale), var(--magenta));
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  color:#fff; box-shadow: var(--shadow-card); padding: 2rem;
}
.jornada-badge-eyebrow{ font: 700 .7rem/1 var(--sans); letter-spacing:.16em; text-transform:uppercase; opacity:.85; margin-bottom:.6em; }
.jornada-badge-number{ font-family: var(--serif); font-size: 1.9rem; font-weight:600; margin-bottom:.5em; }
.jornada-badge-caption{ font-size:.82rem; opacity:.92; max-width: 160px; }

@media (max-width: 900px){
  .jornada-inner{ grid-template-columns: 1fr; gap: 3rem; text-align:center; }
  .jornada-text{ order:2; }
  .jornada-list{ align-items:center; }
  .jornada-list li{ padding-left:0; }
  .jornada-list li::before{ position:static; margin-right:.4em; }
  .jornada-media{ order:1; }
}

/* ============ RECURSOS ============ */
.recursos{
  padding: 5.5rem 1.5rem;
  background: linear-gradient(175deg, var(--berry) 0%, #350924 100%);
}
.recursos .section-head{ text-align:center; margin-bottom: 3rem; }
.recursos .section-sub{ margin:0 auto; color: #E8C7D6; }

.recursos-grid{
  max-width: var(--container); margin:0 auto; display:grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1.4rem;
}
.recurso-card{
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14);
  border-radius: var(--radius-md); padding: 2rem 1.6rem; backdrop-filter: blur(6px);
  transition: transform .2s ease, background .2s ease;
}
.recurso-card:hover{ transform: translateY(-4px); background: rgba(255,255,255,.1); }
.recurso-icon{
  width: 46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background: var(--magenta); color:#fff; font-size:1.2rem; margin-bottom:1.1rem;
}
.recurso-card h3{ color:#fff; font-size:1.2rem; }
.recurso-card p{ color:#E8C7D6; font-size:.92rem; }
.recurso-link{ font-weight:700; color:#FFB4D9; }
.recurso-link:hover{ color:#fff; }

.recurso-upsell{
  margin-top: 1.2rem; padding-top: 1.1rem;
  border-top: 1px dashed rgba(255,255,255,.22);
  position: relative;
}
.recurso-upsell-badge{
  display:inline-block; background: var(--gold); color: var(--berry);
  font: 800 .62rem/1 var(--sans); letter-spacing:.06em; text-transform:uppercase;
  padding: .35em .7em; border-radius: 999px; margin-bottom:.6em;
}
.recurso-upsell p{ margin: 0 0 .5em; color:#fff; font-weight:700; font-size: .98rem; }
.recurso-link--upsell{ color: var(--gold); }
.recurso-link--upsell:hover{ color: #fff; }

@media (max-width: 560px){ .recursos-grid{ grid-template-columns: 1fr; } }

.recurso-icon--whats{ background: #25D366; }

/* ============ BOTÃO FLUTUANTE WHATSAPP (evidência) ============ */
.whats-float{
  position: fixed; right: 1.5rem; bottom: 1.5rem; z-index: 60;
  width: 62px; height: 62px; border-radius: 50%;
  background: #25D366; color: #fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 16px 30px -12px rgba(37,211,102,.65);
  transition: transform .18s ease, box-shadow .18s ease;
}
.whats-float:hover{ transform: translateY(-3px) scale(1.04); box-shadow: 0 20px 36px -12px rgba(37,211,102,.75); }
.whats-float-pulse{
  position:absolute; inset:-6px; border-radius:50%;
  border: 2px solid #25D366; opacity:.55;
  animation: whats-pulse 2.2s ease-out infinite;
}
@keyframes whats-pulse{
  0%{ transform: scale(1); opacity:.55; }
  100%{ transform: scale(1.45); opacity:0; }
}
@media (prefers-reduced-motion: reduce){ .whats-float-pulse{ animation: none; display:none; } }
@media (max-width: 560px){ .whats-float{ right:1rem; bottom:1rem; width:56px; height:56px; } }

/* ============ COOKIE BANNER ============ */
.cookie-banner{
  position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 70;
  max-width: 640px; margin: 0 auto;
  background: var(--berry); color: #F3DCE7;
  border-radius: var(--radius-md); padding: 1.3rem 1.5rem;
  box-shadow: 0 20px 44px -16px rgba(0,0,0,.45);
  display:flex; flex-wrap:wrap; align-items:center; gap: 1rem;
  opacity: 0; transform: translateY(16px);
  transition: opacity .35s ease, transform .35s ease;
  pointer-events: none;
}
.cookie-banner--visible{ opacity: 1; transform: translateY(0); pointer-events: auto; }
.cookie-banner--hidden{ opacity: 0; transform: translateY(16px); pointer-events: none; }
.cookie-banner-text{ flex: 1 1 260px; font-size: .86rem; margin: 0; color: #F3DCE7; }
.cookie-banner-text a{ color: #FFB4D9; font-weight: 700; text-decoration: underline; }
.cookie-banner-actions{ display:flex; gap: .6rem; flex: 0 0 auto; }
.cookie-banner-btn{
  border-radius: 999px; padding: .6em 1.2em; font: 700 .84rem/1 var(--sans);
  cursor: pointer; border: 1.5px solid transparent; white-space: nowrap;
}
.cookie-banner-btn--accept{ background: var(--magenta); color: #fff; }
.cookie-banner-btn--accept:hover{ background: var(--magenta-deep); }
.cookie-banner-btn--decline{ background: transparent; color: #F3DCE7; border-color: rgba(243,220,231,.4); }
.cookie-banner-btn--decline:hover{ border-color: #F3DCE7; }

@media (max-width: 560px){
  .cookie-banner{ flex-direction: column; align-items: stretch; text-align:center; }
  .cookie-banner-actions{ justify-content: center; }
}

/* ============ NEWSLETTER ============ */
.newsletter{
  padding: 5rem 1.5rem; text-align:center;
  background:
    radial-gradient(60% 90% at 85% 10%, var(--blush-2) 0%, transparent 60%),
    var(--blush);
}
.newsletter-inner{ max-width: 620px; margin:0 auto; }
.newsletter h2{ font-size: clamp(1.7rem, 3vw, 2.3rem); }
.newsletter-sub{ font-size: 1.05rem; max-width: 460px; margin: 0 auto 1.8rem; }
.btn-lg{ padding: 1.05em 2.1em; font-size: 1.02rem; }

/* ============ FOOTER ============ */
.footer{ background: var(--berry); color: #E8C7D6; padding: 4rem 1.5rem 1.5rem; }
.footer-inner{
  max-width: var(--container); margin:0 auto; display:grid;
  grid-template-columns: 1.6fr 1fr 1fr; gap: 2.5rem;
}
.brand-mark--footer{ height:48px; width:auto; border-radius:10px; margin-bottom:1rem; }
.footer-brand p{ color: #C79AB0; font-size:.9rem; max-width: 320px; }
.footer-col h4{ color:#fff; font-family: var(--sans); font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; margin-bottom:1rem; }
.footer-col a{ display:block; margin-bottom:.7rem; font-size:.92rem; color:#E8C7D6; }
.footer-col a:hover{ color: #fff; }
.footer-bottom{
  max-width: var(--container); margin: 3rem auto 0; padding-top:1.5rem;
  border-top:1px solid rgba(255,255,255,.12); font-size:.8rem; color:#B98BA3;
}
@media (max-width: 700px){ .footer-inner{ grid-template-columns: 1fr 1fr; } .footer-brand{ grid-column: span 2; } }