/* ═══════════════════════════════════════════════════════════
   PLANO FAMÍLIA — Sales page styles (extends index-ui.css)
   ═══════════════════════════════════════════════════════════ */
:root{ --promo-h: 44px; }

body{ padding-top: calc(var(--promo-h) + 68px); }

/* ───────── PROMO BAR ───────── */
.promo-bar{
  position:fixed; top:0; left:0; right:0; z-index:60;
  min-height: var(--promo-h);
  background:#05060c;
  border-bottom:1px solid rgba(197,159,63,.22);
  display:flex; align-items:center; justify-content:center;
  padding: 7px 16px;
  text-align:center;
}
.promo-bar .promo-txt{
  font-size:13px; color:var(--text-2); line-height:1.35;
  display:inline-flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:center;
}
.promo-bar b{ color:var(--gold); font-weight:600 }
.promo-bar .strike{ color:var(--text-4); text-decoration: line-through; }
.promo-bar .promo-cd{
  font-variant-numeric:tabular-nums; color:var(--text);
  font-weight:600; background:rgba(197,159,63,.12);
  border:1px solid rgba(197,159,63,.3); border-radius:var(--r-pill);
  padding:2px 10px; font-size:12px;
}
@media (max-width:600px){ .promo-bar .promo-txt{ font-size:11.5px; gap:6px } }

/* nav sits under promo */
.nav{ top: var(--promo-h); }
.nav .nav-cta{ display:none; }
@media (min-width:720px){
  .nav .nav-cta{ display:inline-flex; padding:10px 20px; min-height:42px; font-size:14px; }
}

/* ───────── shared section scaffold ───────── */
.grid-bg{
  position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:
    radial-gradient(ellipse 60% 45% at 50% 0%, rgba(197,159,63,.10), transparent 70%),
    linear-gradient(to right, rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size: auto, 56px 56px, 56px 56px;
  mask-image: radial-gradient(ellipse 85% 75% at 50% 25%, black, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse 85% 75% at 50% 25%, black, transparent 80%);
}
.section{ padding: clamp(72px, 9vw, 132px) 0; position:relative; }
.section.alt{ background: var(--bg-2); }
.section-head{ max-width: 760px; margin: 0 auto clamp(44px, 5vw, 68px); text-align:center; }
.section-head.left{ margin-left:0; text-align:left; }
.section-head .eyebrow{ margin-bottom:18px }
.section-head h2{
  font-family:var(--font-display); font-weight:500;
  font-size: clamp(30px, 4.4vw, 56px);
  line-height:1.06; letter-spacing:-.018em; margin-bottom:18px;
  text-wrap: balance;
}
.section-head h2 em{ font-style:italic; color:var(--gold) }
.section-head p{ color:var(--text-2); font-size: clamp(16px, 1.4vw, 19px); line-height:1.6; }
.section-head p b{ color:var(--text); font-weight:600 }

/* eyebrow as a bordered "selo" */
.selo{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 15px; border:1px solid rgba(197,159,63,.4);
  border-radius:var(--r-pill);
  font-size:11.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); background:rgba(197,159,63,.06);
  margin-bottom:20px;
}
.selo .dot{ width:6px;height:6px;border-radius:50%; background:var(--gold); }

/* ───────── HERO ───────── */
.phero{ position:relative; overflow:hidden; padding: clamp(36px,5vh,68px) 0 clamp(56px,7vw,96px); }
.phero-inner{
  position:relative; z-index:1;
  display:grid; gap: clamp(36px, 4.5vw, 68px); align-items:center;
  grid-template-columns:1fr;
}
@media (min-width:960px){ .phero-inner{ grid-template-columns: 1.08fr .92fr; } }

.phero h1{
  font-family:var(--font-display); font-weight:500;
  font-size: clamp(40px, 5.6vw, 78px);
  line-height:1.02; letter-spacing:-.022em; margin-bottom:22px;
  text-wrap: balance;
}
.phero h1 em{ font-style:italic; color:var(--gold) }
.phero .sub{
  font-size: clamp(17px, 1.5vw, 20px); color:var(--text-2);
  line-height:1.6; max-width: 52ch; margin-bottom: clamp(26px,3.4vh,34px);
}
.phero .sub b{ color:var(--text); font-weight:600 }

.cta-row{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
@media (max-width:520px){ .cta-row{ flex-direction:column; align-items:stretch } .cta-row .btn{ width:100% } }

/* price ladder chips */
.price-ladder{
  display:flex; flex-wrap:wrap; gap:10px; margin-top: clamp(24px,3vh,30px);
}
.price-chip{
  display:inline-flex; flex-direction:column; gap:2px;
  padding:11px 16px; border-radius:var(--r-md);
  border:1px solid var(--line); background:rgba(255,255,255,.02);
}
.price-chip.now{ border-color: rgba(197,159,63,.5); background:rgba(197,159,63,.08); }
.price-chip .pc-price{ font-family:var(--font-display); font-weight:600; font-size:21px; line-height:1; }
.price-chip.now .pc-price{ color:var(--gold) }
.price-chip .pc-when{ font-size:11px; color:var(--text-3); letter-spacing:.02em; }

.trust-row{
  display:flex; flex-wrap:wrap; gap: 8px 22px; margin-top: clamp(22px,3vh,28px);
  font-size:13.5px; color:var(--text-3);
}
.trust-row span{ display:inline-flex; align-items:center; gap:7px; }
.trust-row svg{ width:15px; height:15px; color:var(--gold); flex:none }

/* hero media (family photo) */
.phero-media{
  position:relative; overflow:hidden; border-radius:var(--r-lg);
  border:1px solid var(--line); box-shadow: var(--shadow-md);
  aspect-ratio: 1080 / 880; background:var(--bg-2);
}
.phero-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 28%; }
.phero-media::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(to top, rgba(7,9,18,.55), transparent 42%); }
.phero-media .media-cap{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding: 22px; display:flex; align-items:center; gap:12px;
}
.phero-media .media-cap .seal-img{ width:44px;height:44px; flex:none }
.phero-media .media-cap .mc-txt{ font-size:13px; color:var(--text-2); line-height:1.4 }
.phero-media .media-cap .mc-txt b{ color:var(--text); font-family:var(--font-display); font-size:17px; font-weight:600 }
@media (max-width:959px){ .phero-media{ order:-1; aspect-ratio: 1080/760 } }

/* ───────── VOICE CARDS (novidades) ───────── */
.voices{ display:grid; gap: clamp(20px,2.4vw,28px); grid-template-columns:1fr; max-width:1080px; margin:0 auto; }
@media (min-width:840px){ .voices{ grid-template-columns: 1fr 1fr; } }
.voice-card{
  background: var(--surface); border:1px solid var(--line);
  border-radius: var(--r-lg); padding: clamp(26px,2.6vw,34px);
  display:flex; flex-direction:column;
}
.voice-card .vc-tag{
  font-family:var(--font-display); font-style:italic; color:var(--gold);
  font-size:18px; margin-bottom:10px;
}
.voice-card h3{
  font-family:var(--font-display); font-weight:500;
  font-size: clamp(23px,2.2vw,30px); line-height:1.1; margin-bottom:14px;
}
.voice-card p{ color:var(--text-2); font-size:15px; line-height:1.65; margin-bottom:20px; }
.voice-card p em{ font-style:italic; color:var(--text) }
.voice-card p b{ color:var(--text); font-weight:600 }
.voice-card .vc-books{ display:flex; gap:8px; margin-bottom:22px; }
.voice-card .vc-books img{
  width:58px; border-radius:5px; box-shadow:var(--shadow-sm);
  border:1px solid var(--line); aspect-ratio:726/1083; object-fit:cover;
}
.voice-card .vc-foot{ margin-top:auto; }

/* audio preview player */
.audio-player{
  display:flex; align-items:center; gap:14px;
  background: var(--bg-2); border:1px solid var(--line-strong);
  border-radius: var(--r-md); padding:12px 14px;
}
.audio-player .ap-btn{
  width:46px; height:46px; border-radius:50%; flex:none;
  background:var(--gold); color:var(--bg);
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 6px 18px -6px rgba(197,159,63,.6);
  transition: transform .18s, filter .2s;
}
.audio-player .ap-btn:hover{ filter:brightness(1.08); transform:scale(1.05) }
.audio-player .ap-btn:active{ transform:scale(.95) }
.audio-player .ap-btn svg{ width:20px; height:20px }
.audio-player .ap-wave{
  flex:1; display:flex; align-items:center; gap:3px; height:34px; overflow:hidden;
}
.audio-player .ap-wave i{
  flex:1; min-width:2px; background:var(--text-4); border-radius:2px;
  height: var(--h, 30%); transition: background .2s;
}
.audio-player.playing .ap-wave i{ background:var(--gold); animation: eq .9s ease-in-out infinite alternate; }
.audio-player.playing .ap-wave i:nth-child(2n){ animation-delay:.15s }
.audio-player.playing .ap-wave i:nth-child(3n){ animation-delay:.3s }
.audio-player.playing .ap-wave i:nth-child(4n){ animation-delay:.45s }
@keyframes eq{ from{ transform: scaleY(.5) } to{ transform: scaleY(1.15) } }
.audio-player .ap-time{ font-size:12px; color:var(--text-3); font-variant-numeric:tabular-nums; flex:none; }
.audio-player .ap-note{ font-size:11px; color:var(--text-4); }

/* ───────── O QUE É (narrative + callouts) ───────── */
.narrative{ max-width: 760px; margin:0 auto; }
.narrative p{ color:var(--text-2); font-size: clamp(16px,1.25vw,17.5px); line-height:1.78; margin-bottom:20px; }
.narrative p b{ color:var(--text); font-weight:600 }
.narrative .lead-p{ font-size: clamp(17px,1.4vw,19px); color:var(--text); }

.feat-list{ display:grid; gap:14px; margin: clamp(30px,4vw,42px) 0; }
.feat-list li{ display:flex; gap:14px; align-items:flex-start; list-style:none; }
.feat-list .fl-ic{
  width:26px;height:26px;border-radius:50%; flex:none; margin-top:1px;
  background:rgba(197,159,63,.12); border:1px solid rgba(197,159,63,.35);
  display:flex; align-items:center; justify-content:center; color:var(--gold);
}
.feat-list .fl-ic svg{ width:14px;height:14px }
.feat-list span{ color:var(--text-2); font-size:16px; line-height:1.5; }
.feat-list span b{ color:var(--text); font-weight:600 }

.callout{
  display:flex; gap:16px; align-items:flex-start;
  border:1px solid var(--line); border-radius:var(--r-md);
  background: var(--surface); padding: 20px 22px; margin-bottom:14px;
}
.callout .co-em{ font-size:22px; line-height:1.2; flex:none }
.callout p{ margin:0; font-size:15.5px; color:var(--text-2); line-height:1.6 }
.callout p b{ color:var(--text); font-weight:600 }
.callout.gold{ border-color:rgba(197,159,63,.32); background:rgba(197,159,63,.05); }
.callout.gold p b{ color:var(--gold) }

.center-cta{ text-align:center; margin-top: clamp(34px,4vw,46px); }

/* ───────── CATÁLOGO ───────── */
.cat-grid{
  display:grid; gap: clamp(12px,1.4vw,18px);
  grid-template-columns: repeat(2, 1fr);
  max-width: 980px; margin: 0 auto clamp(36px,4vw,48px);
}
@media (min-width:560px){ .cat-grid{ grid-template-columns: repeat(5, 1fr); } }
.cat-grid figure{ margin:0; }
.cat-grid img{
  width:100%; border-radius:7px; aspect-ratio:726/1083; object-fit:cover;
  box-shadow: var(--shadow-md); border:1px solid var(--line);
  transition: transform .3s;
}
.cat-grid figure:hover img{ transform: translateY(-5px); }
.cat-note{ text-align:center; font-family:var(--font-display); font-style:italic;
  font-size: clamp(18px,1.6vw,22px); color:var(--text-3); max-width:48ch; margin:0 auto; }

/* ───────── DIFERENÇA (4 features) ───────── */
.diff-grid{ display:grid; gap: clamp(18px,2vw,24px); grid-template-columns:1fr; max-width:1080px; margin:0 auto; }
@media (min-width:720px){ .diff-grid{ grid-template-columns:1fr 1fr; } }
.diff-card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding: clamp(26px,2.6vw,34px);
}
.diff-card .di-ic{
  width:48px;height:48px;border-radius:12px; margin-bottom:20px;
  background:rgba(197,159,63,.1); border:1px solid rgba(197,159,63,.3);
  display:flex;align-items:center;justify-content:center; color:var(--gold);
}
.diff-card .di-ic svg{ width:24px;height:24px }
.diff-card h3{ font-family:var(--font-display); font-weight:500; font-size:clamp(21px,1.9vw,26px); margin-bottom:10px; }
.diff-card p{ color:var(--text-2); font-size:15.5px; line-height:1.65 }
.diff-card p b{ color:var(--text); font-weight:600 }

/* ───────── COMUNIDADE ───────── */
.community{ position:relative; overflow:hidden; }
.community-inner{
  display:grid; gap: clamp(40px,5vw,72px); align-items:center;
  grid-template-columns:1fr; max-width:1120px; margin:0 auto;
}
@media (min-width:940px){ .community-inner{ grid-template-columns: .92fr 1.08fr; } }
.community-media{ position:relative; }
.community-media img{
  width:100%; border-radius:var(--r-lg); border:1px solid var(--line); box-shadow:var(--shadow-md);
}
.community-copy .narrative{ margin:0; max-width:none; }
.stat-row{ display:flex; gap: clamp(20px,3vw,40px); margin-top: clamp(28px,3.5vw,38px); flex-wrap:wrap; }
.stat{ }
.stat .st-num{ font-family:var(--font-display); font-weight:600; font-size: clamp(36px,4vw,52px); color:var(--gold); line-height:1; }
.stat .st-lab{ font-size:13px; color:var(--text-3); margin-top:6px; max-width:22ch; }

/* ───────── TESTIMONIALS ───────── */
.tcols{ columns: 1; column-gap: clamp(16px,1.8vw,22px); max-width:1100px; margin:0 auto; }
@media (min-width:640px){ .tcols{ columns:2; } }
@media (min-width:1000px){ .tcols{ columns:3; } }
.tcard{
  break-inside:avoid; margin-bottom: clamp(16px,1.8vw,22px);
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding: clamp(22px,2vw,28px);
}
.tcard .tc-quote{ font-family:var(--font-display); font-size: clamp(18px,1.5vw,21px); line-height:1.45; color:var(--text); margin-bottom:16px; }
.tcard .tc-who{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--text-3); }
.tcard .tc-who .tw-dot{ width:24px;height:24px;border-radius:50%; flex:none;
  background:linear-gradient(135deg, rgba(197,159,63,.3), rgba(197,159,63,.08)); border:1px solid rgba(197,159,63,.3);
  display:flex;align-items:center;justify-content:center; color:var(--gold); font-family:var(--font-display); font-size:13px; }
.tcard .tc-who b{ color:var(--text-2); font-weight:600 }
.t-disclaimer{ text-align:center; max-width:60ch; margin: clamp(36px,4vw,48px) auto 0;
  font-size:13.5px; color:var(--text-4); line-height:1.6; font-style:italic; }

/* ───────── PRICING ───────── */
.plans{ display:grid; gap: clamp(16px,1.8vw,22px); grid-template-columns:1fr; max-width:680px; margin:0 auto clamp(36px,4vw,48px); }
@media (min-width:680px){ .plans{ grid-template-columns:1fr 1fr; } }
.plan{
  position:relative; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-lg); padding: clamp(24px,2vw,30px);
  display:flex; flex-direction:column;
}
.plan.feature{ border-color: rgba(197,159,63,.5); background: linear-gradient(180deg, rgba(197,159,63,.08), var(--surface) 60%); box-shadow: var(--shadow-glow); }
.plan .plan-flag{
  position:absolute; top:-11px; left:50%; transform:translateX(-50%);
  background:var(--gold); color:var(--bg); font-size:10.5px; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; padding:5px 14px; border-radius:var(--r-pill);
  white-space:nowrap;
}
.plan .plan-name{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); font-weight:600; margin-bottom:14px; }
.plan .plan-price{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; margin-bottom:4px; }
.plan .plan-price .pp-old{ font-size:16px; color:var(--text-4); text-decoration:line-through; }
.plan .plan-price .pp-now{ font-family:var(--font-display); font-weight:600; font-size: clamp(34px,3.4vw,44px); line-height:1; color:var(--text); white-space:nowrap; }
.plan.feature .plan-price .pp-now{ color:var(--gold) }
.plan .plan-price .pp-per{ font-size:14px; color:var(--text-3); white-space:nowrap; }
.plan .plan-sub{ font-size:12.5px; color:var(--text-3); line-height:1.45; min-height:34px; margin-bottom:18px; }
.plan .plan-sub b{ color:var(--gold); font-weight:600 }
.plan .plan-perfis{ display:inline-flex; align-items:center; gap:7px; font-size:13.5px; color:var(--text-2); padding-bottom:18px; margin-bottom:18px; border-bottom:1px solid var(--line); }
.plan .plan-perfis svg{ width:16px;height:16px; color:var(--gold) }
.plan .plan-perfis b{ color:var(--text); font-weight:600 }
.plan .btn{ margin-top:auto; width:100%; }
.plan .btn.btn-ghost{ font-size:14px; }

.incl{
  max-width: 1120px; margin: 0 auto clamp(30px,3.5vw,40px);
  background:var(--bg-2); border:1px solid var(--line); border-radius:var(--r-lg);
  padding: clamp(22px,2.4vw,30px) clamp(24px,3vw,40px);
}
.incl h4{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); font-weight:600; margin-bottom:18px; text-align:center; }
.incl-grid{ display:grid; gap:12px 28px; grid-template-columns:1fr; }
@media (min-width:620px){ .incl-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:980px){ .incl-grid{ grid-template-columns:1fr 1fr 1fr; } }
.incl-grid li{ list-style:none; display:flex; align-items:center; gap:10px; font-size:14.5px; color:var(--text-2); }
.incl-grid li svg{ width:18px;height:18px; color:var(--whats); flex:none }
.incl-grid li b{ color:var(--text); font-weight:600 }

.big-cta{ text-align:center; }
.big-cta .bc-sub{ margin-top:14px; font-size:13.5px; color:var(--text-3); }
.founder-note{
  max-width: 720px; margin: clamp(28px,3.5vw,40px) auto 0;
  display:flex; gap:14px; align-items:flex-start;
  border:1px solid rgba(197,159,63,.3); background:rgba(197,159,63,.05);
  border-radius:var(--r-md); padding: 18px 22px;
}
.founder-note img{ width:42px;height:42px; flex:none }
.founder-note p{ margin:0; font-size:14.5px; color:var(--text-2); line-height:1.6 }
.founder-note p b{ color:var(--text); font-weight:600 }

/* ───────── GARANTIA ───────── */
.guarantee{ text-align:center; }
.guarantee .g-seal{
  width: clamp(86px,10vw,108px); aspect-ratio:1; border-radius:50%; margin:0 auto 28px;
  background: radial-gradient(circle at 50% 34%, var(--gold-bright), var(--gold) 62%, var(--gold-deep));
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 0 0 10px rgba(116,90,24,.26), 0 24px 56px -12px rgba(197,159,63,.5);
}
.guarantee .g-seal .g-num{ font-family:var(--font-display); font-weight:600; font-size: clamp(34px,4vw,44px); color:var(--bg); line-height:1; }
.guarantee h2{ font-family:var(--font-display); font-weight:500; font-size: clamp(30px,4vw,52px); line-height:1.06; letter-spacing:-.015em; margin-bottom:20px; }
.guarantee p{ max-width: 56ch; margin:0 auto; color:var(--text-2); font-size: clamp(16px,1.4vw,19px); line-height:1.65; }
.guarantee p b{ color:var(--text); font-weight:600 }

/* ───────── FAQ ───────── */
.faq{ max-width: 820px; margin:0 auto; }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-q{
  width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding: 22px 0; font-family:var(--font-display); font-weight:500;
  font-size: clamp(18px,1.7vw,23px); color:var(--text); line-height:1.25;
}
.faq-q .faq-ic{ width:26px;height:26px; flex:none; position:relative; }
.faq-q .faq-ic::before,.faq-q .faq-ic::after{
  content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  background:var(--gold); transition: transform .3s, opacity .3s;
}
.faq-q .faq-ic::before{ width:14px; height:2px; }
.faq-q .faq-ic::after{ width:2px; height:14px; }
.faq-item.open .faq-q .faq-ic::after{ transform:translate(-50%,-50%) scaleY(0); opacity:0; }
.faq-a{ overflow:hidden; max-height:0; transition: max-height .4s ease; }
.faq-a-inner{ padding: 0 0 24px; color:var(--text-2); font-size:16px; line-height:1.7; max-width:70ch; }
.faq-a-inner b{ color:var(--text); font-weight:600 }
.faq-a-inner .team{ display:block; margin-top:10px; font-size:13.5px; color:var(--text-4); font-style:italic; }

/* ───────── FECHAMENTO ───────── */
.closing{ position:relative; overflow:hidden; text-align:center; }
.closing-inner{ position:relative; z-index:1; max-width: 820px; margin:0 auto; }
.closing h2{ font-family:var(--font-display); font-weight:500; font-size: clamp(34px,5vw,68px); line-height:1.03; letter-spacing:-.02em; margin-bottom:22px; text-wrap:balance; }
.closing h2 em{ font-style:italic; color:var(--gold) }
.closing p{ max-width: 56ch; margin: 0 auto clamp(34px,4vw,42px); color:var(--text-2); font-size: clamp(17px,1.5vw,20px); line-height:1.6; }
.closing p b{ color:var(--text); font-weight:600 }
.closing .bc-sub{ margin-top:16px; font-size:13.5px; color:var(--text-3); }

/* ───────── STICKY MOBILE CTA ───────── */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:55;
  background: rgba(7,9,18,.94); backdrop-filter: blur(12px); -webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--line);
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  display:flex; align-items:center; gap:14px; justify-content:space-between;
  transform: translateY(120%); transition: transform .4s cubic-bezier(.22,.61,.36,1);
}
.sticky-cta.show{ transform:none; }
.sticky-cta .sc-price{ line-height:1.15; }
.sticky-cta .sc-price b{ font-family:var(--font-display); font-size:22px; color:var(--gold); font-weight:600; }
.sticky-cta .sc-price span{ display:block; font-size:11px; color:var(--text-3); }
.sticky-cta .btn{ flex:none; padding:13px 20px; min-height:46px; }
@media (min-width:860px){ .sticky-cta{ display:none } }
@media (max-width:380px){ .sticky-cta .btn .sc-arrow{ display:none } }