/* ==========================================================================
   MedSpaWebDesigns — Warm Vellum palette (DESIGN-SYSTEM.md Direction B)
   Every value contrast-verified. Ratios noted; do not change without re-testing.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Instrument+Sans:wght@400;500;600&display=swap');

:root{
  /* Five neutrals plus one metal */
  --vellum:#F7F4EF;    /* page ground */
  --sand:#EDE7DE;      /* alternate sections, fields */
  --stone:#B8AC9E;     /* hairlines, decoration ONLY — 2.03:1, never text */
  --ink:#6B6055;       /* secondary text — 5.58:1 on vellum */
  --espresso:#2A2621;  /* primary text, dark anchor — 13.7:1 on vellum */

  --brass:#7A5E2C;       /* accent — 5.52 vellum / 4.93 sand / 6.06 white */
  --brass-hover:#5F4A22; /* 7.69:1 on vellum */
  --brass-light:#C6A56B; /* on espresso only — 6.44:1. NEVER text on light (2.13:1) */

  /* Legacy aliases — existing page CSS keeps working unchanged */
  --bg-main:var(--vellum); --bg-alt:var(--sand); --dark:var(--espresso);
  --text-muted:var(--ink); --primary:var(--brass); --primary-hover:var(--brass-hover);
  --accent:var(--espresso); --surface:#FFFFFF; --border-light:rgba(184,172,158,.45);
  --success:#2A2621; --gold-light:rgba(122,94,44,.08);

  --ease:cubic-bezier(.16,1,.3,1);
  --r-sm:4px; --r-md:12px; --r-lg:24px; --r-pill:999px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Instrument Sans',system-ui,-apple-system,sans-serif;color:var(--espresso);
     background:var(--vellum);line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,.logo,.section-title,.price,.hero-stat-value,.stat-number,.problem-number,
.big-stat,.footer-brand,.tier-price,.legal-hero h1{
  font-family:'Instrument Serif',Georgia,serif;font-weight:400;letter-spacing:-.02em}
:focus-visible{outline:2px solid var(--espresso);outline-offset:3px}
::selection{background:var(--brass-light);color:var(--espresso)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}
