@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");

/* Dark Clients-on-Demand-inspired presentation for /mc.
   The PHP, forms, timers, embeds, and tracking remain inherited from /mc. */

:root {
  --bg-primary: #020a27;
  --bg-secondary: #06195e;
  --bg-card: #07185a;
  --bg-card-alt: #0a1f6d;
  --text-primary: #f6f1e8;
  --text-secondary: rgba(246, 241, 232, 0.78);
  --text-muted: rgba(246, 241, 232, 0.62);
  --accent-gold: #D8BC68;
  --accent-gold-light: #D8BC68;
  --accent-gold-dim: rgba(216, 188, 104, 0.18);
  --accent-gold-border: rgba(216, 188, 104, 0.34);
  --radius-card: 8px;
  --radius-btn: 8px;
  --max-width: 1240px;
  --font-body: "Inter", system-ui, sans-serif;
  --font-display: "Inter", system-ui, sans-serif;
  --thanks-light-bg: #020a27;
  --thanks-light-text: var(--text-primary);
  --thanks-card-bg: rgba(246, 241, 232, 0.045);
  --thanks-card-border: rgba(216, 188, 104, 0.24);
  --thanks-card-copy: var(--text-secondary);
  --thanks-muted: var(--text-secondary);
  --thanks-video-border: rgba(216, 188, 104, 0.3);
  color-scheme: dark;
}

html {
  background: var(--bg-primary);
}

body {
  background: linear-gradient(102deg, #020A27 0%, #00104B 100%) !important;
  color: var(--text-secondary) !important;
  font-family: var(--font-body) !important;
  font-optical-sizing: auto;
  font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6,
.hero-title,
.book-title,
.bm-step-title,
.bm-status-title {
  color: var(--text-primary) !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-weight: 900 !important;
  line-height: 0.98 !important;
}

h1,
.hero-title,
.book-title,
h2,
h3,
h4,
h5,
h6,
.panel-title,
.success-title,
.step-title,
.stories-more h3,
.bm-step-title,
.bm-status-title {
  letter-spacing: -0.015em !important;
}

h1 {
  letter-spacing: -0.02em !important;
}

h4,
h5,
h6 {
  font-family: "Inter", system-ui, sans-serif !important;
  font-weight: 700 !important;
}

p,
a,
button,
input,
textarea,
label,
select,
.hero-badge,
.hero-eyebrow,
.book-eyebrow,
.bm-status-eyebrow,
.small-caps,
.form-group label,
.bm-field label,
.bm-step-sub,
.bm-status-sub,
.feature-text,
.tp-text {
  font-family: "Inter", system-ui, sans-serif !important;
}

.nav {
  background: rgba(2, 10, 39, 0.88) !important;
  border-bottom: 1px solid rgba(246, 241, 232, 0.1) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.18);
}

.logo .logo-full path,
.nav-logo .logo-full path {
  fill: var(--text-primary) !important;
}

.logo .logo-full .logo-accent,
.nav-logo .logo-full .logo-accent {
  fill: var(--accent-gold) !important;
}

.logo .logo-mobile .lionSolidFill,
.logo .logo-mobile .lionGradFill,
.nav-logo .logo-mobile .lionSolidFill,
.nav-logo .logo-mobile .lionGradFill {
  fill: var(--text-primary) !important;
}

.gold-btn,
.nav-btn,
.bm-btn-next {
  background: linear-gradient(180deg, #FFE259 0%, #FFA751 100%) !important;
  color: #141414 !important;
  border: 1px solid rgba(246, 241, 232, 0.16) !important;
  border-radius: var(--radius-btn) !important;
  box-shadow: 0 16px 34px rgba(35, 59, 145, 0.24);
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
}

.gold-btn:hover,
.nav-btn:hover,
.bm-btn-next:hover {
  box-shadow: 0 20px 44px rgba(255, 167, 81, 0.34) !important;
}

.bg-curve,
.hero-glow-tr,
.hero-glow-bl {
  display: none !important;
}

.page-cols {
  gap: clamp(44px, 6vw, 92px) !important;
  padding-top: 0 !important;
  isolation: auto !important;
}

.homepage-bg {
  height: min(760px, 92vh) !important;
  margin-top: -8% !important;
  opacity: 0.3 !important;
  filter: grayscale(1) !important;
  background-position: center top !important;
  mix-blend-mode: normal !important;
  -webkit-mask-image:
    linear-gradient(to right, transparent 0%, #000 14%, #000 86%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 12%, #000 78%, transparent 100%) !important;
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to right, transparent 0%, #000 14%, #000 86%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 12%, #000 78%, transparent 100%) !important;
  mask-composite: intersect;
}

.hero {
  padding: 128px 0 24px !important;
}

.hero-badge,
.hero-eyebrow,
.book-eyebrow,
.bm-status-eyebrow,
.small-caps {
  color: var(--accent-gold) !important;
}

.small-caps {
  font-weight: 600 !important;
}

.panel-title .small-caps {
  color: var(--text-primary) !important;
}

.hero-badge,
.hero-eyebrow,
.book-eyebrow,
.bm-status-eyebrow {
  background: rgba(216, 188, 104, 0.1) !important;
  border: 1px solid rgba(216, 188, 104, 0.22) !important;
  border-radius: 999px !important;
  padding: 7px 15px !important;
}

.hero-badge,
.hero-eyebrow {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 1px !important;
  line-height: 120% !important;
  max-width: 70vw !important;
}

.hero h1,
.hero-title,
.book-title {
  font-size: clamp(34px, 5vw, 54px) !important;
  font-weight: 800 !important;
  line-height: 0.98 !important;
  letter-spacing: -0.02em !important;
  max-width: 760px !important;
}

.hero h1 em,
.hero-title em,
.panel-title em {
  color: var(--accent-gold) !important;
}

.hero-sub,
.hero-subtitle,
.panel-subtitle,
.book-subtitle,
.bm-step-sub,
.bm-status-sub {
  color: var(--text-secondary) !important;
}

.hero-stats {
  border-top: 1px solid rgba(246, 241, 232, 0.12) !important;
}

.hero-stat strong,
.feature-text strong,
.tp-text strong {
  color: var(--text-primary) !important;
}

.hero-stat span {
  color: var(--accent-gold) !important;
}

.tp-text,
.tp-stars {
  color: var(--text-secondary) !important;
}

.modal-sheet,
.bm-sheet,
.bm-next-steps-card {
  background: rgba(7, 24, 90, 0.94) !important;
  border: 1px solid rgba(216, 188, 104, 0.3) !important;
  border-radius: var(--radius-card) !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.24) !important;
}

.optin-card,
.feature-item {
  background: rgba(51,61,97,0.5) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  border-radius: var(--radius-card) !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.24) !important;
  backdrop-filter: blur(20px) !important;
}

.optin-card-section:nth-child(1) {
  background: transparent !important;
  border-bottom: 1px solid rgba(216, 188, 104, 0.16);
}

.optin-card h3 {
  font-size: 23.5px !important;
  letter-spacing: -0.02em !important;
}

.countdown-unit {
  background: transparent !important;
  background-color: transparent !important;
  border-color: rgba(216, 188, 104, 0.26) !important;
}

.countdown-digits,
.countdown-colon,
.feature-icon,
.bm-spinner {
  color: var(--accent-gold) !important;
}

.countdown-unit-label,
.countdown-label,
.video-cta-pretitle,
.bm-next-steps-title {
  color: rgba(246, 241, 232, 0.62) !important;
}

.countdown-target-time {
  color: var(--text-primary) !important;
}

.form-group label,
.bm-field label,
.bm-other-label,
.bm-option-title,
.bm-option-simple .bm-option-body,
.bm-consent-text,
.bm-next-steps-list li,
.modal-sheet > p,
.optin-card .optin-sub,
.optin-privacy,
.bm-option-sub {
  color: var(--text-secondary) !important;
}

.form-group input,
.modal-sheet input[type="text"],
.modal-sheet input[type="email"],
.modal-sheet input[type="tel"],
.optin-card input[type="text"],
.optin-card input[type="email"],
.optin-card input[type="tel"],
.bm-input,
.bm-textarea,
.bm-sheet input[type="text"],
.bm-sheet input[type="email"],
.bm-sheet input[type="tel"],
.bm-sheet textarea,
.bm-sheet select {
  background: rgba(246, 241, 232, 0.08) !important;
  background-color: rgba(246, 241, 232, 0.08) !important;
  border: 1px solid rgba(246, 241, 232, 0.16) !important;
  color: var(--text-primary) !important;
  border-radius: 6px !important;
}

.form-group input::placeholder,
.modal-sheet input::placeholder,
.optin-card input::placeholder,
.bm-input::placeholder,
.bm-textarea::placeholder,
.bm-sheet textarea::placeholder {
  color: rgba(246, 241, 232, 0.42) !important;
}

.form-group input:focus,
.modal-sheet input:focus,
.optin-card input:focus,
.bm-input:focus,
.bm-textarea:focus,
.bm-sheet select:focus {
  border-color: rgba(216, 188, 104, 0.68) !important;
  box-shadow: 0 0 0 3px rgba(216, 188, 104, 0.12);
}

.form-group input:-webkit-autofill,
.modal-sheet input:-webkit-autofill,
.optin-card input:-webkit-autofill,
.bm-input:-webkit-autofill,
.bm-sheet input:-webkit-autofill {
  -webkit-text-fill-color: var(--text-primary) !important;
  box-shadow: 0 0 0 1000px #07185a inset !important;
}

.list-panel {
  border-top: 1px solid rgba(246, 241, 232, 0.12) !important;
}

.feature-icon,
.bm-confirmed-icon,
.bm-next-step-num {
  background: rgba(216, 188, 104, 0.12) !important;
  border-color: rgba(216, 188, 104, 0.26) !important;
  color: var(--accent-gold) !important;
}

.bio-image {
  background: rgba(246, 241, 232, 0.08) !important;
  border: 1px solid rgba(216, 188, 104, 0.3);
}

.bio-image:after {
  background: linear-gradient(to bottom, rgba(2, 10, 39, 0), #020a27) !important;
}

.logo-bar,
.footer {
  background: rgba(0, 9, 42, 0.58) !important;
  border-top: 1px solid rgba(246, 241, 232, 0.1) !important;
}

.logo-bar-swiper .swiper-slide img {
  filter: brightness(0) invert(1) !important;
  opacity: 0.72 !important;
}

.footer p,
.footer-links a {
  color: rgba(246, 241, 232, 0.58) !important;
}

.footer-links a:hover {
  color: var(--accent-gold) !important;
}

.mobile-sticky {
  background: rgba(2, 10, 39, 0.96) !important;
  border-top: 1px solid rgba(216, 188, 104, 0.22) !important;
  box-shadow: 0 -18px 42px rgba(0, 0, 0, 0.24);
}

.modal-overlay,
.bm-overlay {
  background: rgba(0, 5, 24, 0.78) !important;
}

.modal-overlay .modal-sheet,
.bm-overlay .bm-sheet {
  background: #07185a !important;
  background-color: #07185a !important;
}

.modal-close,
.bm-close {
  background: rgba(246, 241, 232, 0.08) !important;
  border-color: rgba(216, 188, 104, 0.28) !important;
  color: rgba(246, 241, 232, 0.72) !important;
}

.bm-step-num,
.bm-btn-back,
.bm-err-msg {
  color: var(--accent-gold) !important;
}

.bm-option {
  background: rgba(246, 241, 232, 0.06) !important;
  border-color: rgba(246, 241, 232, 0.12) !important;
  border-radius: 8px !important;
}

.bm-option:hover,
.bm-option.selected {
  background: rgba(216, 188, 104, 0.16) !important;
  border-color: rgba(216, 188, 104, 0.54) !important;
}

.bm-option-check {
  border-color: rgba(246, 241, 232, 0.24) !important;
}

.bm-option.selected .bm-option-check {
  background: var(--accent-gold) !important;
  border-color: var(--accent-gold) !important;
  color: #141414 !important;
}

.bm-consent input[type="checkbox"] {
  accent-color: var(--accent-gold) !important;
}

.mf-cal {
  color: var(--text-primary) !important;
}

.mf-cal button,
.mf-cal .mf-cal__month-nav button,
.mf-cal .mf-cal__toolbar-toggle button {
  color: var(--text-primary) !important;
}

.mf-cal .mf-cal__calendar-day:not(:disabled),
.mf-cal .mf-cal__time-button {
  background: rgba(246, 241, 232, 0.06) !important;
  border-color: rgba(246, 241, 232, 0.14) !important;
  color: var(--text-primary) !important;
}

.mf-cal .mf-cal__toolbar-control-wrap svg {
  left: 8px !important;
}

.mf-cal .mf-cal__toolbar-control {
  padding-left: 34px !important;
}

.mf-cal .mf-cal__section-title {
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.mf-cal .mf-cal__calendar-day.is-selected,
.mf-cal .mf-cal__time-button.is-selected,
.mf-cal .mf-cal__toolbar-toggle button.is-active {
  background: rgba(246, 241, 232, 0.12) !important;
  border-color: rgba(216, 188, 104, 0.58) !important;
  color: var(--text-primary) !important;
  box-shadow: inset 0 0 0 1px rgba(216, 188, 104, 0.28) !important;
}

.video-wrap {
  background: var(--bg-card);
  border-radius: var(--radius-card);
}

.wistia-embed-wrapper {
  border: 1px solid rgba(216, 188, 104, 0.2);
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.28) !important;
}

.play-btn {
  background: linear-gradient(180deg, #FFE259 0%, #FFA751 100%) !important;
  color: #141414 !important;
}

.play-label {
  color: var(--text-primary) !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8) !important;
}

#completionOverlay h2 {
  color: #ffffff !important;
}

.thanks-hero .hero-title {
  color: #ffffff !important;
}

.section-light,
.section-dark,
.section-alt {
  color: var(--text-primary) !important;
}

.section-light {
  background: #020a27 !important;
}

.section-dark {
  background: var(--bg-primary) !important;
}

.section-alt {
  background: var(--bg-secondary) !important;
}

.section-light h2,
.section-light h3,
.section-light .section-title,
.section-dark h2,
.section-dark h3,
.section-alt h2,
.section-alt h3,
.success-title,
.step-title,
.stories-more h3 {
  color: var(--text-primary) !important;
}

.legal {
  color: rgba(246, 241, 232, 0.62) !important;
}

.legal a {
  color: var(--text-primary) !important;
}

.sms-image,
.client-grid img {
  border-color: rgba(216, 188, 104, 0.24) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24) !important;
}

.thanks-logo .logo .logo-full path {
  fill: #f0ede8 !important;
}

.thanks-logo .logo .logo-full .logo-accent {
  fill: #D8BC68 !important;
}

.thanks-logo .logo .logo-mobile .lionSolidFill,
.thanks-logo .logo .logo-mobile .lionGradFill {
  fill: #ffffff !important;
}

.variant-pill,
.success-kicker,
.section-kicker {
  display: block !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: var(--accent-gold) !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  line-height: 120% !important;
  text-transform: uppercase !important;
}

.variant-pill {
  display: none !important;
  margin: 0 !important;
}

.success-kicker,
.section-kicker {
  margin: 8px 0 !important;
}

.success-hero-image {
  max-width: 100% !important;
}

.success-card p {
  color: var(--text-secondary) !important;
}

.calendar-button,
.story-button {
  background: linear-gradient(180deg, #FFE259 0%, #FFA751 100%) !important;
  color: #141414 !important;
  border-radius: var(--radius-btn) !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

.calendar-button:hover,
.story-button:hover {
  background: linear-gradient(180deg, #FFE259 0%, #FFA751 100%) !important;
  color: #141414 !important;
}

@media (max-width: 1024px) {
  .hero {
    padding-top: 36px !important;
  }

  .homepage-bg {
    opacity: 0.3 !important;
  }
}

@media (max-width: 640px) {
  .gold-btn,
  .nav-btn,
  .bm-btn-next {
    font-size: 16px !important;
  }

  .hero h1,
  .hero-title {
    font-size: clamp(27px, 8.8vw, 35px) !important;
  }

  .book-main {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}