/*
 * Sales funnel styling: Bridge, VSL, Webinar Register/Live/Replay, Offer, Apply.
 * Reuses the design tokens and component classes already defined in main.css
 * (--brand-orange, .btn, .btn-primary, .card, .lead-card, .field, .badge, etc.)
 * so funnel pages look like a natural part of the same site, not a bolt-on.
 */

.funnel-shell { padding: 46px 0 70px; }
.funnel-container { max-width: 860px; margin: 0 auto; padding: 0 22px; }

.funnel-eyebrow { display: flex; justify-content: center; margin-bottom: 16px; }

.funnel-headline {
  font-family: var(--font-display);
  font-size: clamp(30px, 4.4vw, 46px);
  line-height: 1.08;
  letter-spacing: -.04em;
  text-align: center;
  margin: 0 0 12px;
  color: var(--foreground);
}
.funnel-subhead {
  text-align: center;
  color: var(--muted-foreground);
  max-width: 640px;
  margin: 0 auto 30px;
  font-size: 17px;
}

.webinar-meta-strip {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 0 0 26px;
  color: var(--muted-foreground);
  font-size: 13px;
  font-weight: 800;
}

/* Responsive 16:9 video frame, used for every YouTube embed on funnel pages */
.video-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-4xl);
  overflow: hidden;
  border: 1px solid var(--line-soft);
  box-shadow: var(--shadow-card), var(--shadow-glow);
  background: var(--surface-deep);
  margin: 0 auto 30px;
}
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.funnel-content.content { margin-top: 8px; margin-bottom: 30px; }

.funnel-cta-wrap { text-align: center; margin: 28px 0; }
.funnel-cta-wrap .funnel-cta {
  font-size: 16px;
  padding: 16px 32px;
  min-height: 52px;
}
.funnel-cta-wrap.is-locked .funnel-cta {
  opacity: .35;
  pointer-events: none;
  filter: grayscale(.5);
}
.funnel-cta-hint {
  margin: 0 0 12px;
  color: var(--muted-foreground);
  font-weight: 800;
  font-size: 13px;
}
.funnel-cta-wrap a + a { margin-left: 12px; }
@media (max-width: 520px) {
  .funnel-cta-wrap a { display: block; margin: 10px auto 0 !important; max-width: 320px; }
}

/* Countdown */
.funnel-countdown {
  margin: 0 auto 30px;
  max-width: 440px;
  text-align: center;
  padding: 18px 20px;
  border-radius: var(--radius-3xl);
  border: 1px solid var(--line-soft);
  background: linear-gradient(180deg, oklch(0.23 0.036 260 / 92%), oklch(0.18 0.03 260 / 86%));
  box-shadow: var(--shadow-card);
}
.funnel-countdown-label {
  display: block;
  font-weight: 900;
  color: var(--brand-orange-glow);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .07em;
  margin-bottom: 12px;
}
.funnel-countdown-clock { display: flex; justify-content: center; gap: 10px; }
.cd-box {
  background: var(--surface-deep);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-2xl);
  padding: 10px 12px;
  min-width: 56px;
}
.cd-box span { display: block; font-family: var(--font-display); font-size: 23px; font-weight: 800; color: var(--foreground); }
.cd-box small { display: block; color: var(--muted-foreground); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; }
.funnel-countdown-expired-text { display: none; margin: 14px 0 0; color: var(--muted-foreground); font-weight: 700; font-size: 14px; }
.funnel-countdown.is-expired .funnel-countdown-clock { display: none; }
.funnel-countdown.is-expired .funnel-countdown-expired-text { display: block; }

/* Offer page price tag */
.offer-price-strip { display: flex; justify-content: center; margin: 0 0 22px; }
.offer-price-tag {
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 800;
  color: var(--foreground);
  background: var(--orange-soft);
  border: 1px solid var(--orange-ring);
  padding: 10px 20px;
  border-radius: 999px;
}

/* Webinar live: optional genuine YouTube live chat panel */
.live-chat-frame {
  width: 100%;
  height: 420px;
  border-radius: var(--radius-3xl);
  border: 1px solid var(--line-soft);
  overflow: hidden;
  margin: 0 0 10px;
}
.live-chat-frame iframe { width: 100%; height: 100%; border: 0; }
.live-chat-note { font-size: 12px; color: var(--muted-foreground); text-align: center; margin: 0 0 30px; }

/* Distraction-free header for single-path Bridge & VSL pages: hide the
   main nav links and the competing Demo/Portal buttons, keep WhatsApp. */
body.pa-funnel-focus .nav > ul { display: none; }
body.pa-funnel-focus .header-actions .cta,
body.pa-funnel-focus .header-actions .btn-ghost { display: none; }
body.pa-funnel-focus .mobile-toggle { visibility: hidden; }

@media (max-width: 620px) {
  .funnel-countdown-clock { gap: 7px; }
  .cd-box { min-width: 48px; padding: 8px 8px; }
  .cd-box span { font-size: 19px; }
}
