/* Prospect design tokens: ZOOM GROOM LLC
   Base system: veterinary (pet grooming variant)
   Bespoke tuning: gold + near-black Cooper Black brand identity.
   Gold (#c9a84c) is the primary brand color — used on dark surfaces and as
   button fill with near-black text. Body copy runs dark-on-white for
   readability. Cooper Black wordmark personality expressed via a serif-adjacent
   heading stack anchored by Playfair Display (bold, high-contrast serif). */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;800&family=Nunito:wght@400;500;600;700&display=swap');
:root{
  /* ── Surfaces & ink ─────────────────────────────────────────── */
  --bg:#ffffff;
  --surface:#fdf8ef;           /* warm cream card background         */
  --ink:#2a2520;               /* warm near-black — 13.2:1 on white PASS */
  --ink-strong:#18140d;        /* darkest warm black                 */
  --muted:#6b5c48;             /* warm medium brown for lead copy    */
  --line:#e8d9bf;              /* warm gold-tinted rule              */

  /* ── Brand palette ──────────────────────────────────────────── */
  --brand:#c9a84c;             /* Zoom Groom gold                    */
  --brand-dark:#9e7f2e;        /* darker gold (hover / pressed)      */
  --brand-tint:#fdf5e0;        /* near-white warm cream tint         */
  --on-brand:#18140d;          /* near-black on gold — 7.42:1 PASS  */
  --accent:#7a3b10;            /* warm deep sienna for eyebrows/highlights */

  /* ── Hero gradient (dark gold-black, brand personality) ─────── */
  --hero-bg:radial-gradient(900px 500px at 8% -8%,#3d2f0a,transparent),#18140d;

  /* ── Navigation & footer ─────────────────────────────────────── */
  --header-bg:rgba(24,20,13,.92);   /* dark sticky header (gold logo pops) */
  --footer-bg:#18140d;              /* dark footer matching hero           */

  /* ── CTA band (reversed dark section) ───────────────────────── */
  --band-bg:#18140d;
  --on-band:#f2e6c2;           /* warm cream on dark — 14.6:1 PASS   */
  --on-band-muted:#b8a27a;     /* muted gold-cream for band body copy */

  /* ── Typography ─────────────────────────────────────────────── */
  --font-heading:'Playfair Display',Georgia,'Times New Roman',serif;
  --font-body:'Nunito',system-ui,sans-serif;
  --fs-base:17px;
  --lh-body:1.68;
  --fw-body:400;
  --fw-head:800;               /* extra-bold to echo Cooper Black presence */
  --lh-head:1.08;
  --ls-head:-.02em;
  --fs-lead:1.2rem;
  --fs-h1:clamp(2.6rem,5.5vw,4.2rem);
  --fs-h2:clamp(1.8rem,3.8vw,2.7rem);
  --fs-h3:1.35rem;

  /* ── Layout ─────────────────────────────────────────────────── */
  --container:1140px;
  --gutter:26px;
  --section-y:96px;
  --hero-y:116px;
  --nav-h:72px;
  --space-3:12px;
  --space-4:18px;
  --space-5:28px;
  --space-6:34px;
  --space-7:64px;
  --btn-pad:15px 32px;

  /* ── Shape & shadow ─────────────────────────────────────────── */
  --radius:12px;               /* tighter than base vet system — more refined */
  --radius-lg:20px;
  --radius-pill:999px;
  --shadow:0 6px 22px rgba(201,168,76,.13);
  --shadow-lg:0 20px 48px rgba(201,168,76,.20);

  /* ── Motion ─────────────────────────────────────────────────── */
  --dur:180ms;                 /* slightly snappier than base vet 240ms */
  --ease:cubic-bezier(.34,1.2,.64,1);
}

/* Eyebrow overrides: use accent sienna instead of brand gold on light bg */
.eyebrow{color:var(--accent)}

/* Card icon chip: gold tint bg with dark brand text */
.card .ic{background:var(--brand-tint);color:var(--brand-dark)}

/* Hero overrides: headings and lead copy are light on the dark hero */
.hero h1,.hero h2{color:var(--on-band)}
.hero .lead{color:var(--on-band-muted)}
.hero .eyebrow{color:var(--brand)}       /* gold eyebrow pops on dark hero */

/* Nav links are cream on the dark sticky header */
.site-header .nav-links a{color:var(--on-band-muted)}
.site-header .nav-links a:hover,
.site-header .nav-links a[aria-current="page"]{color:var(--brand)}
.site-header .brand{color:var(--brand)}  /* gold wordmark in header */
.site-header .nav-toggle{color:var(--on-band)}

/* Mobile nav: when the dropdown opens over the white --bg, override link
   color back to near-black so contrast is adequate (WCAG AA ≥ 4.5:1). */
@media (max-width:860px){
  .site-header .nav-links a{color:var(--ink)}
  .site-header .nav-links a:hover,
  .site-header .nav-links a[aria-current="page"]{color:var(--accent)}
}

/* Ghost button variant: gold outline on dark backgrounds */
.btn.ghost{
  background:transparent;
  color:var(--brand);
  box-shadow:inset 0 0 0 1.5px var(--brand);
}
.btn.ghost:hover{background:rgba(201,168,76,.12)}

/* Footer: cream text on dark */
.site-footer{background:var(--footer-bg);border-top:1px solid rgba(201,168,76,.18)}
.site-footer,.site-footer a{color:var(--on-band-muted)}
.site-footer a:hover{color:var(--brand)}