/* ============================================
   Saint VIII · Lead Magnet funnel — flat pass
   Loads AFTER v2-vsl/css/styles.css on the
   opt-in + thank-you pages only. Kills the
   decorative layer (gradients, glows, pills,
   float animations) without touching the
   shared system other funnels still use.
   ============================================ */

/* Palette: matched to the lead magnet document (the SOP) —
   black banners #141414, gold trim #D7B341, yellow highlight #F2D36A */
:root {
  --accent: #D7B341;
  --accent-2: #CBB05A;
  --accent-deep: #8F7B33;
  --accent-glow: rgba(215, 179, 65, 0.25);
  --highlight-text: #F2D36A;
}

/* Flat background: no radial washes, no noise */
body::before { background: var(--bg-dark); }
body::after { display: none; }

/* Headline highlights: the doc's marker yellow instead of steel blue */
.headline .highlight,
.confirm-headline .highlight,
.ty-headline .highlight {
  color: var(--highlight-text);
  -webkit-text-fill-color: var(--highlight-text);
}

/* Solid buttons: no gradient, no glow, no float */
.cta-btn,
.tf-next,
.tf-next--submit {
  background: var(--accent);
  color: #0A0A0C;
  animation: none;
  box-shadow: none;
  text-transform: none;
  letter-spacing: 0;
  font-size: 1.12rem;
  border-radius: var(--radius-sm);
}
.cta-btn:hover,
.tf-next:hover,
.tf-next--submit:hover {
  animation: none;
  transform: none;
  filter: brightness(0.94);
  box-shadow: none;
}
.cta-btn:active,
.tf-next:active { transform: none; }
.cta-btn--community {
  background: transparent;
  color: var(--text-primary);
  border: 1px solid var(--border-strong);
}

/* Boxed inputs instead of underline fields */
.tf-input,
.tf-textarea {
  padding: 15px 16px;
  font-size: 1rem;
  font-weight: 400;
  background: var(--bg-input);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
}
.tf-input:focus,
.tf-textarea:focus { border-color: var(--accent-2); }
.tf-input.error,
.tf-textarea.error { border-color: var(--error); }
.tf-field .tf-input { font-size: 1rem; }

/* intl-tel-input inside a boxed input: center the dial code */
.iti__selected-flag,
.iti__selected-country,
.iti__selected-country-primary {
  align-items: center;
  padding-bottom: 0;
  padding-left: 14px;
}
.tf-field .iti .tf-input,
.tf-field .iti__selected-dial-code { font-size: 1rem; }

/* Flat cards: no gradient overlay, no glow hairline */
.lead-form-panel,
.panel {
  background: var(--bg-card);
  border: 1px solid var(--border);
  box-shadow: none;
}
.lead-form-panel::before,
.panel::before { display: none; }

/* Flat media frames + icons */
.video-wrapper { box-shadow: none; }
.video-placeholder .play-icon { background: var(--accent); box-shadow: none; }
.confirm-icon { background: var(--bg-card); box-shadow: none; }
.slide-brand img { filter: none; }

/* Socials: plain text links, not pills */
.social-pill {
  background: transparent;
  border: none;
  padding: 6px 10px;
  color: var(--text-muted);
}
.social-pill:hover { color: var(--text-primary); background: transparent; transform: none; border: none; }

/* Choice buttons: flat */
.tf-choice { background: var(--bg-input); border: 1px solid var(--border-strong); }
.tf-choice.selected { border-color: var(--accent); background: rgba(215,179,65,0.07); }
.tf-choice.selected .tf-choice-key { background: var(--accent); }

/* Phone-input focus ring: gold, not the old platinum */
.lead-form-panel .iti__search-input:focus { box-shadow: 0 0 0 4px rgba(215,179,65,0.12); border-color: var(--accent-2); }
