/* ============================================================
   Midway Vacations — Typography
   Display: Pridi (stand-in for Recoleta Alt Light) — light, friendly serif
   Text:    Inter — clear, contemporary sans
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-display: 'Recoleta Alt', Georgia, 'Times New Roman', serif;
  --font-sans:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono:    'SFMono-Regular', ui-monospace, 'Menlo', 'Consolas', monospace;

  /* ---- Weights ---- */
  --weight-display:   400;  /* Recoleta Alt Regular (only weight provided) */
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;

  /* ---- Type scale (rem, 16px base) ---- */
  --text-2xs:  0.6875rem; /* 11px — micro labels */
  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-md:   1.125rem;  /* 18px — brand body size */
  --text-lg:   1.375rem;  /* 22px */
  --text-xl:   1.75rem;   /* 28px */
  --text-2xl:  2.25rem;   /* 36px */
  --text-3xl:  3rem;      /* 48px */
  --text-4xl:  4rem;      /* 64px */
  --text-5xl:  5.25rem;   /* 84px */

  /* ---- Line heights ---- */
  --leading-tight:   1.08;  /* display headlines */
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.7;   /* long-form body */

  /* ---- Letter spacing ---- */
  --tracking-tight:  -0.02em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-wider:  0.12em;  /* eyebrows / uppercase labels */
  --tracking-widest: 0.22em;  /* logo-style spaced caps */
}

/* ---- Semantic text presets (optional helper classes) ---- */
.mv-display {
  font-family: var(--font-display);
  font-weight: var(--weight-display);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--text-primary);
}
.mv-eyebrow {
  font-family: var(--font-sans);
  font-weight: var(--weight-semibold);
  font-size: var(--text-xs);
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  color: var(--text-gold);
}
.mv-body {
  font-family: var(--font-sans);
  font-weight: var(--weight-regular);
  font-size: var(--text-md);
  line-height: var(--leading-relaxed);
  color: var(--text-secondary);
}
