/* ==========================================================================
   PBP — Funnel styles (loaded only on funnel page templates)
   Extends the core design system in assets/css/style.css
   ========================================================================== */

/* minimal nav: logo only, no escape routes */
.fnav{ position:fixed; inset:0 0 auto 0; z-index:200; padding-block:.9rem;
  transition:.4s var(--ease); border-bottom:1px solid transparent; }
.fnav.is-stuck{ background:color-mix(in oklab, var(--ink) 80%, transparent);
  backdrop-filter:blur(16px); border-color:var(--line); }
.fnav__inner{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.fnav .brand__name span{ display:none; }
.fnav__seat{ font-size:.78rem; font-weight:600; color:var(--ember); letter-spacing:.04em; }

/* hero (funnel) */
.fhero{ position:relative; padding-top:clamp(6.5rem,12vh,9rem); padding-bottom:clamp(2.5rem,6vw,4.5rem); overflow:hidden; }
.fhero__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.fhero__title{ font-size:var(--step-5); }
.fhero__sub{ max-width:34ch; }
.fhero__bar{ display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.6rem; margin-top:1.4rem; color:var(--bone-dim); font-size:.92rem; }
.fhero__bar b{ color:var(--bone); font-weight:600; }
.fhero__bar .sep{ width:4px;height:4px;border-radius:50%;background:var(--signal); }

/* countdown */
.countdown{ display:flex; gap:.7rem; margin-top:1.8rem; }
.cd__unit{ flex:1; max-width:96px; text-align:center; border:1px solid var(--line); border-radius:var(--r);
  background:var(--ink-3); padding:.8rem .4rem; }
.cd__num{ font-family:var(--f-display); font-weight:600; font-size:var(--step-2); line-height:1; color:var(--bone); font-variant-numeric:tabular-nums; }
.cd__lbl{ font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-top:.4rem; }

/* trust badges */
.badges{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.6rem; }
.badge{ display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .85rem; border-radius:var(--r-pill);
  font-size:.78rem; font-weight:500; color:var(--bone-dim); background:rgba(244,238,226,.05); border:1px solid var(--line); }
.badge svg{ width:15px;height:15px;color:var(--signal); }

/* checklist */
.checklist{ display:grid; gap:.85rem; margin-top:1.6rem; }
.checklist li{ display:flex; gap:.85rem; align-items:flex-start; font-size:1rem; color:var(--bone-dim); }
.checklist li .ck{ flex:none; width:24px;height:24px;border-radius:7px; margin-top:.1rem;
  background:rgba(244,192,60,.14); color:var(--signal); display:grid; place-items:center; }
.checklist li b{ color:var(--bone); font-weight:600; }

/* problem block */
.problem{ display:grid; grid-template-columns:.4fr .6fr; gap:clamp(1.5rem,4vw,3rem); align-items:center; }
.problem__mark{ font-family:var(--f-display); font-style:italic; font-size:var(--step-5); color:var(--signal); opacity:.9; line-height:1; }
.learning-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.learning{ padding:1.4rem; border:1px solid var(--line); border-radius:var(--r); background:var(--ink-3); transition:.45s var(--ease); }
.learning:hover{ border-color:rgba(244,192,60,.4); transform:translateY(-4px); }
.learning__n{ font-family:var(--f-display); font-style:italic; color:var(--signal); font-size:var(--step-1); }
.learning__t{ font-weight:600; margin-top:.5rem; }
.learning__d{ color:var(--muted); font-size:.9rem; margin-top:.35rem; }

/* agenda compact */
.agenda-mini{ border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.agenda-mini__row{ display:grid; grid-template-columns:110px 1fr; gap:1rem; padding:1rem 1.3rem; border-top:1px solid var(--line); align-items:baseline; }
.agenda-mini__row:first-child{ border-top:0; }
.agenda-mini__t{ font-family:var(--f-display); font-weight:600; color:var(--signal); }

/* FAQ */
.faq{ display:grid; gap:.6rem; max-width:760px; margin-inline:auto; }
.faq__item{ border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:var(--ink-3); }
.faq__q{ width:100%; text-align:left; padding:1.2rem 1.4rem; display:flex; justify-content:space-between; align-items:center; gap:1rem;
  font-weight:600; font-size:1.02rem; }
.faq__q .pm{ flex:none; width:22px;height:22px; position:relative; transition:transform .4s var(--ease); }
.faq__q .pm::before,.faq__q .pm::after{ content:""; position:absolute; background:var(--signal); top:50%; left:50%; transform:translate(-50%,-50%); }
.faq__q .pm::before{ width:12px;height:2px; } .faq__q .pm::after{ width:2px;height:12px; transition:transform .4s var(--ease); }
.faq__item.is-open .pm::after{ transform:translate(-50%,-50%) rotate(90deg); opacity:0; }
.faq__a{ max-height:0; overflow:hidden; transition:max-height .45s var(--ease); color:var(--muted); }
.faq__a p{ padding:0 1.4rem 1.3rem; }
.faq__item.is-open .faq__a{ max-height:340px; }

/* sticky mobile CTA */
.sticky-cta{ position:fixed; inset:auto 0 0 0; z-index:300; padding:.8rem var(--gutter) 1rem;
  background:color-mix(in oklab, var(--ink) 88%, transparent); backdrop-filter:blur(14px);
  border-top:1px solid var(--line); display:none; }
.sticky-cta .btn{ width:100%; justify-content:center; }

/* final CTA */
.cta-final{ position:relative; overflow:hidden; border-radius:var(--r-xl); padding:clamp(2.5rem,6vw,4.5rem); text-align:center; }
.cta-final__bg{ position:absolute; inset:0; z-index:-1; border-radius:inherit; border:1px solid var(--line-strong);
  background:radial-gradient(60% 90% at 50% 0%, rgba(244,192,60,.3), transparent 60%), linear-gradient(180deg,var(--ink-3),var(--ink)); }

/* thank-you */
.tyhero{ text-align:center; padding-top:clamp(7rem,14vh,10rem); }
.tyhero .check{ width:84px;height:84px;border-radius:50%; margin-inline:auto; display:grid; place-items:center;
  background:radial-gradient(circle at 35% 30%, var(--ember), var(--signal) 60%, #8a2a08);
  box-shadow:0 0 60px -8px rgba(244,192,60,.7); color:var(--ink); }
.tyhero .check svg{ width:40px;height:40px; }
.tycards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.tycard{ padding:1.6rem; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--ink-3); }
.tycard__ic{ width:42px;height:42px;border-radius:11px; background:rgba(244,192,60,.12); color:var(--signal); display:grid; place-items:center; margin-bottom:.9rem; }
.tycard__t{ font-family:var(--f-display); font-size:var(--step-1); }
.tycard__d{ color:var(--muted); font-size:.92rem; margin-top:.5rem; }
.share{ display:flex; gap:.6rem; justify-content:center; margin-top:1.2rem; }
.share a{ width:42px;height:42px;border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; transition:.3s; }
.share a:hover{ border-color:var(--signal); color:var(--signal); transform:translateY(-3px); }

/* PBP CRM form — theme the [pbp_register] shortcode output to match */
.ff__card{ border:1px solid rgba(244,192,60,.3); border-radius:var(--r); overflow:hidden; box-shadow:var(--sh-2); background:var(--ink-3); }
.ff__bar{ display:flex; align-items:center; gap:.5rem; padding:.8rem 1rem; border-bottom:1px solid var(--line); background:var(--ink-3); }
.ff__bar i{ width:11px;height:11px;border-radius:50%;background:var(--signal);font-style:normal; }
.ff__bar i:nth-child(2){ background:var(--gold); } .ff__bar i:nth-child(3){ background:var(--forest); opacity:.7; }
.ff__bar span{ margin-left:.5rem; font-size:.78rem; color:var(--muted); letter-spacing:.04em; }
.ff__wrap{ padding:1rem 1.2rem 1.4rem; }
.ff__wrap label{ font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-weight:600; }
.ff__wrap input[type=text],.ff__wrap input[type=email],.ff__wrap input[type=tel],.ff__wrap select,.ff__wrap textarea{
  width:100%; padding:.8rem .9rem; margin-top:.35rem; border-radius:10px; border:1px solid var(--line-strong);
  background:var(--ink); color:var(--bone); font-family:var(--f-body); font-size:.95rem; }
.ff__wrap input:focus,.ff__wrap select:focus,.ff__wrap textarea:focus{ outline:none; border-color:var(--signal); }
.ff__wrap button[type=submit],.ff__wrap .ff_btn_style{ width:100%; margin-top:.6rem; }
.ff__note{ padding:0 1.2rem 1.2rem; font-size:.78rem; color:var(--muted); text-align:center; }

@media (max-width:1024px){
  .fhero__grid,.problem{ grid-template-columns:1fr; }
  .tycards{ grid-template-columns:1fr; }
}
@media (max-width:680px){
  .learning-grid{ grid-template-columns:1fr; }
  .agenda-mini__row{ grid-template-columns:84px 1fr; }
  .sticky-cta{ display:block; }
  body{ padding-bottom:74px; }
  .cd__unit{ max-width:none; }
}
