:root{
/* ---- Base palette ---------------------------------------------------- */
--sand-50:#F5F1E9;   /* lifted page tint, cards on sand */
--sand-100:#EDE7DC;  /* PAGE BACKGROUND — the brand's default canvas */
--clay-200:#DCD3C5;  /* hairline / divider on sand */
--clay-300:#C9BEAE;  /* card + section fill */
--clay-400:#B6A995;  /* pressed clay, disabled bronze */
--bronze-300:#C6AC84; /* bronze on charcoal hover (lighter) */
--bronze-500:#A8895F; /* PRIMARY ACCENT — CTA, active, icon */
--bronze-600:#8F7350; /* bronze hover on light */
--bronze-700:#77603F; /* bronze pressed */
--stone-600:#6E6A62;  /* secondary / caption text */
--stone-700:#4A4844;
--char-900:#2B2A28;   /* body text, dark sections */
--char-950:#1E1D1B;   /* deepest — footer base, overlay scrim */
--white:#FFFFFF;

/* ---- Semantic: light surfaces (default) ------------------------------ */
--surface-page:var(--sand-100);
--surface-raised:var(--sand-50);
--surface-card:var(--clay-300);
--surface-card-soft:rgba(201,190,174,.38);   /* preferred card fill on sand */
--surface-card-veil:rgba(201,190,174,.18);   /* whisper fill, image captions */
--surface-inverse:var(--char-900);

--text-body:var(--char-900);
--text-heading:var(--char-900);
--text-muted:var(--stone-600);
--text-accent:var(--bronze-600);             /* labels only, never paragraphs */
--text-on-accent:var(--sand-100);
--text-on-inverse:var(--sand-100);
--text-muted-inverse:rgba(237,231,220,.62);

--border-hairline:var(--clay-200);
--border-strong:rgba(43,42,40,.20);
--border-inverse:rgba(237,231,220,.18);
--border-accent:var(--bronze-500);

--accent:var(--bronze-500);
--accent-hover:var(--bronze-600);
--accent-press:var(--bronze-700);
--accent-on-dark-hover:var(--bronze-300);
--focus-ring:var(--bronze-500);

/* ---- Semantic: status (kept deliberately quiet) ---------------------- */
--status-success:#5F7355;
--status-warning:#B0803A;
--status-danger:#8E4B3C;
--status-info:var(--stone-600);

/* ---- Imagery treatment ---------------------------------------------- */
/* Caption scrim — text in the bottom third only (MediaFrame eyebrow/caption). */
--scrim-image:linear-gradient(to top,rgba(30,29,27,.80) 0%,rgba(30,29,27,.52) 30%,rgba(30,29,27,.24) 60%,rgba(30,29,27,.06) 85%,rgba(30,29,27,0) 100%); /* @kind color */
/* Hero scrim — never fully transparent, so a heading, lead and eyebrow all clear
   4.5:1 against a bright daylight photograph anywhere in the frame. */
--scrim-hero:linear-gradient(to top,rgba(30,29,27,.88) 0%,rgba(30,29,27,.74) 30%,rgba(30,29,27,.58) 60%,rgba(30,29,27,.40) 85%,rgba(30,29,27,.32) 100%); /* @kind color */
--scrim-flat:rgba(30,29,27,.42);
}

/* Dark scope: apply [data-theme="dark"] to hero / footer / any inverse band. */
[data-theme="dark"]{
--surface-page:var(--char-900);
--surface-raised:#333230;
--surface-card:rgba(237,231,220,.06);
--surface-card-soft:rgba(237,231,220,.05);
--surface-card-veil:rgba(237,231,220,.03);
--surface-inverse:var(--sand-100);
--text-body:var(--sand-100);
--text-heading:var(--sand-100);
--text-muted:var(--text-muted-inverse);
--text-accent:var(--bronze-300);
--text-on-inverse:var(--char-900);
--border-hairline:rgba(237,231,220,.14);
--border-strong:rgba(237,231,220,.28);
--accent-hover:var(--bronze-300);
}
