/*
Theme Name: FC-Lead_Different
Theme URI: https://leaddifferent.ai
Author: FranklinCovey
Description: Lead Different marketing site theme. Dark-first with light mode, built from the LeadDifferent_AI_Site_v2 mockup token system.
Version: 0.1.0
Requires at least: 6.4
Requires PHP: 8.1
License: Proprietary
Text Domain: fc-lead-different
*/

/* Global border-box (the mockup relied on this; without it, padded inputs
   overflow their grid tracks and overlap). Scoped away from WP admin bar. */
*, *::before, *::after { box-sizing: border-box; }

/* ── Brand fonts (licensed files in assets/fonts/) ───────────────────── */
@font-face {
  font-family: 'Tiempos Fine';
  src: url('assets/fonts/TiemposFine-Light.otf') format('opentype');
  font-weight: 300 400;
  font-style: normal;
  font-display: swap;
}

/* ── Design tokens (lifted verbatim from the mockup) ──────────────────── */
:root {
  /* Backgrounds */
  --bg:        #141928;
  --bg-mid:    #141928;
  --bg-card:   rgba(255,255,255,.035);
  --bg-hover:  rgba(255,255,255,.055);
  --bg-input:  rgba(255,255,255,.055);
  --bg-pill:   rgba(255,255,255,.04);
  --nav-bg:    rgba(20,25,40,.96);
  --modal-bg:  rgba(10,14,24,.97);
  /* Text */
  --text:      #FFFFFF;
  --text-dim:  rgba(255,255,255,.72);
  --text-muted:rgba(255,255,255,.62);
  --text-ph:   rgba(255,255,255,.26);
  /* Borders */
  --border:       rgba(255,255,255,.08);
  --border-card:  rgba(255,255,255,.07);
  --border-input: rgba(255,255,255,.11);
  /* Brand — same in both themes */
  --blue:        #3253FF;
  --blue-light:  #5570FF;
  --blue-pale:   rgba(50,83,255,.09);
  --golden:      #FFB93C;
  --golden-lt:   #FFC85A;
  --golden-pale: rgba(255,185,60,.09);
  /* Accent text — golden in dark, blue in light */
  --accent-text: #FFB93C;
  --accent-dim:  rgba(255,185,60,.8);
  /* Misc */
  --shadow: 0 40px 80px rgba(0,0,0,.6);

  /* Type — Tiempos Fine is the licensed brand serif; Rand still pending from FC */
  --font-serif: 'Tiempos Fine', 'Playfair Display', Georgia, serif;
  --font-sans:  'Rand', 'DM Sans', 'Inter', system-ui, sans-serif;
}

[data-theme="light"] {
  --bg:        #FFFFFF;
  --bg-mid:    #F2F4F8;
  --bg-card:   rgba(20,25,40,.03);
  --bg-hover:  rgba(20,25,40,.055);
  --bg-input:  rgba(20,25,40,.04);
  --bg-pill:   rgba(20,25,40,.04);
  --nav-bg:    rgba(255,255,255,.96);
  --modal-bg:  rgba(242,244,248,.97);
  --text:      #141928;
  --text-dim:  rgba(20,25,40,.70);
  --text-muted:rgba(20,25,40,.60);
  --text-ph:   rgba(20,25,40,.28);
  --border:       rgba(20,25,40,.09);
  --border-card:  rgba(20,25,40,.08);
  --border-input: rgba(20,25,40,.14);
  --blue-pale:   rgba(50,83,255,.07);
  --golden-pale: rgba(255,185,60,.14);
  --accent-text: #3253FF;
  --accent-dim:  rgba(50,83,255,.8);
  --shadow: 0 20px 60px rgba(20,25,40,.14);
}

/* ── Base ─────────────────────────────────────────────────────────────── */
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
  font-family: var(--font-serif);
  font-weight: 400;
}

a { color: var(--accent-text); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Accessible visually-hidden utility (WordPress standard). Without this, the
   form's screen-reader labels render as 1px slivers between inputs. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  position: absolute !important;
  word-wrap: normal !important;
}
.screen-reader-text:focus {
  background-color: #fff;
  clip: auto;
  clip-path: none;
  height: auto;
  width: auto;
  padding: 12px;
  z-index: 100000;
}