/* === v3.30 — Premium typography (Plus Jakarta Sans display + Fraunces italic accent + Inter body) === */

/* Load Google Fonts — preconnected at the document level */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Fraunces:ital,wght@1,500;1,600;1,700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --font-display: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-body:    'Inter', 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-accent:  'Fraunces', 'Plus Jakarta Sans', Georgia, serif;
}

/* Base body — clean, readable */
body {
  font-family: var(--font-body);
  font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11', 'ss01';
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: 0;
}

/* Headings — use the premium display font */
h1, h2, h3, h4, h5, h6,
.hero-title, .section-title, .auth-card__title, .ez-prem-headline {
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.08;
  color: #0f172a;
}

/* Display utility — the strongest headline treatment */
.text-display {
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.05;
}

/* Hero-title — premium responsive sizing */
.hero-title, .ez-prem-headline, h1.text-display {
  font-size: clamp(2.2rem, 5vw, 3.8rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.06;
}

/* Section-title — secondary heading */
.section-title, h2.text-display {
  font-size: clamp(1.6rem, 3.4vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.12;
}

/* Accent text — italic Fraunces serif for highlighted words */
.text-accent,
em.text-accent,
.hero-title em,
.ez-prem-headline em,
.section-title em,
.auth-card__title em {
  font-family: var(--font-accent);
  font-style: italic;
  font-weight: 600;
  letter-spacing: -0.01em;
  background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 60%, #c026d3 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  padding: 0 0.04em 0 0.02em;
}

/* Gradient text utility (no italic) */
.text-gradient {
  background: linear-gradient(135deg, #1e1b4b 0%, #4f46e5 60%, #7c3aed 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* Eyebrow utility — uppercase tracked label */
.eyebrow-text, .ez-prem-eyebrow {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #4338ca;
}

/* Premium copy — refined body paragraph */
.premium-copy, .ez-prem-sub, .lead {
  font-family: var(--font-body);
  font-size: clamp(15px, 1.6vw, 17px);
  line-height: 1.65;
  color: #475569;
  font-weight: 400;
  letter-spacing: 0;
}

/* Stronger body in dark text */
.text-strong { font-weight: 600; color: #0f172a; }

/* Refined button/nav typography */
.ez-prem-cta, .ez-prem-nav__link, .btn, .auth-submit-btn, .premium-btn {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: 0.005em;
}

/* Badges + chips — tighter tracking, weight 700 */
.ez-prem-trust-chip, .badge-popular, .ez-prem-chip {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: 0.04em;
}

/* Input field text — body font for readability */
.auth-input, .premium-form-control, input, textarea, select {
  font-family: var(--font-body);
  font-weight: 500;
  letter-spacing: 0;
}

/* Pricing & numeric — use Plus Jakarta Sans tabular if available */
.plan-price, .price, .ez-stat-value {
  font-family: var(--font-display);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}

/* Body link refinement */
a, .auth-link {
  text-decoration: none;
}

/* Mobile typography tightening */
@media (max-width: 575.98px) {
  .hero-title, .ez-prem-headline, h1.text-display {
    font-size: clamp(1.9rem, 8vw, 2.6rem);
    letter-spacing: -0.025em;
  }
  .section-title, h2.text-display {
    font-size: clamp(1.4rem, 6vw, 2rem);
  }
  .premium-copy, .ez-prem-sub, .lead {
    font-size: 15px;
  }
}

/* === end v3.30 === */
