/* AnavianVet design tokens.
   Palette: forest, botanical green and sage from the brief, warmed with sand and terracotta.
   Contrast is checked for every text pairing (see CITESTE-MA.txt). */
/* Metric-adjusted local fallbacks keep layout stable while web fonts load (font-display: swap). */
/* Widths measured against the web fonts: Newsreader ≈ 94.7% of Georgia (italic ≈ 87.8%), Manrope ≈ 101.6% of Arial. */
@font-face { font-family: "Manrope Fallback"; src: local("Arial"), local("Helvetica"); size-adjust: 101.6%; }
@font-face { font-family: "Newsreader Fallback"; font-style: normal; src: local("Georgia"); size-adjust: 94.7%; }
@font-face { font-family: "Newsreader Fallback"; font-style: italic; src: local("Georgia Italic"), local("Georgia-Italic"); size-adjust: 87.8%; }

:root {
  /* Brand */
  --c-forest: #163F35;
  --c-primary: #307D63;          /* fills & buttons (white text 4.95:1) */
  --c-primary-hover: #28694F;
  --c-link: #276A52;             /* text links, ≥4.5:1 on paper and mint */
  --c-sage: #A9C5AE;
  --c-sand: #E9DDC8;
  --c-terracotta: #CA8B71;       /* decorative only */
  --c-terracotta-ink: #93502F;   /* terracotta as text, ≥4.5:1 on paper, mint and sand */

  /* Surfaces */
  --c-bg: #FAF9F5;
  --c-bg-mint: #EDF5EF;
  --c-bg-sand: #F3EDE2;
  --c-surface: #FFFFFF;
  --c-surface-2: #F4F3EE;
  --c-inverse: #163F35;
  --c-on-inverse: #EEF3EF;
  --c-on-inverse-muted: #B9CCC0;

  /* Text */
  --c-text: #202D29;
  --c-text-muted: #5B6B65;
  --c-on-primary: #FFFFFF;

  /* Lines & states */
  --c-line: #E3E2DA;
  --c-line-strong: #CBD3CC;
  --c-focus: #1F6F55;
  --c-danger: #A33A2C;
  --c-danger-bg: #FBEDEA;
  --c-warn: #8A5A12;
  --c-warn-bg: #FBF2DF;
  --c-ok: #276A52;
  --c-ok-bg: #E6F2EA;
  --c-skeleton: #ECEBE4;

  /* Type */
  --f-display: "Newsreader", "Newsreader Fallback", Georgia, serif;
  --f-body: "Manrope", "Manrope Fallback", "Segoe UI", system-ui, sans-serif;
  --fs-xs: 0.8125rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
  --fs-lg: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
  --fs-xl: clamp(1.625rem, 1.3rem + 1.4vw, 2.25rem);
  --fs-2xl: clamp(2rem, 1.5rem + 2.4vw, 3.25rem);
  --fs-hero: clamp(2.5rem, 1.6rem + 4.6vw, 5.25rem);

  /* Space (8px rhythm, 4px half-step) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 40px; --s-8: 48px; --s-9: 64px; --s-10: 80px; --s-11: 96px;
  --section: clamp(32px, 2.5vw + 20px, 64px);
  --gutter: clamp(16px, 4vw, 40px);
  --container: 1280px;

  /* Shape & depth */
  --r-xs: 6px; --r-sm: 10px; --r-md: 16px; --r-lg: 24px; --r-xl: 36px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(22, 63, 53, .06), 0 2px 8px -2px rgba(22, 63, 53, .06);
  --shadow-2: 0 2px 4px rgba(22, 63, 53, .05), 0 16px 40px -16px rgba(22, 63, 53, .22);
  --shadow-3: 0 24px 64px -24px rgba(22, 63, 53, .38);

  /* Motion */
  --ease-out: cubic-bezier(.22, .8, .32, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --t-fast: 150ms; --t-base: 220ms; --t-slow: 320ms;

  --header-h: 68px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --c-forest: #CFE3D7; --c-primary: #6FBF9A; --c-primary-hover: #86CDA9; --c-link: #7CC4A3;
    --c-sage: #3F6A58; --c-sand: #3A342A; --c-terracotta-ink: #E2A487;
    --c-bg: #0E1D19; --c-bg-mint: #12251F; --c-bg-sand: #1A211C; --c-surface: #15261F; --c-surface-2: #1A2D26;
    --c-inverse: #0A1613; --c-on-inverse: #E8EFEA; --c-on-inverse-muted: #9DB3AA;
    --c-text: #E8EFEA; --c-text-muted: #9DB3AA; --c-on-primary: #0E1D19;
    --c-line: #24382F; --c-line-strong: #33493F; --c-focus: #8FD6B3;
    --c-danger: #F09A8C; --c-danger-bg: #3A1F1A; --c-warn: #E9C27A; --c-warn-bg: #33281A;
    --c-ok: #7CC4A3; --c-ok-bg: #173229; --c-skeleton: #1F332B;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .3); --shadow-2: 0 16px 40px -16px rgba(0, 0, 0, .6); --shadow-3: 0 24px 64px -24px rgba(0, 0, 0, .7);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --c-forest: #CFE3D7; --c-primary: #6FBF9A; --c-primary-hover: #86CDA9; --c-link: #7CC4A3;
  --c-sage: #3F6A58; --c-sand: #3A342A; --c-terracotta-ink: #E2A487;
  --c-bg: #0E1D19; --c-bg-mint: #12251F; --c-bg-sand: #1A211C; --c-surface: #15261F; --c-surface-2: #1A2D26;
  --c-inverse: #0A1613; --c-on-inverse: #E8EFEA; --c-on-inverse-muted: #9DB3AA;
  --c-text: #E8EFEA; --c-text-muted: #9DB3AA; --c-on-primary: #0E1D19;
  --c-line: #24382F; --c-line-strong: #33493F; --c-focus: #8FD6B3;
  --c-danger: #F09A8C; --c-danger-bg: #3A1F1A; --c-warn: #E9C27A; --c-warn-bg: #33281A;
  --c-ok: #7CC4A3; --c-ok-bg: #173229; --c-skeleton: #1F332B;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .3); --shadow-2: 0 16px 40px -16px rgba(0, 0, 0, .6); --shadow-3: 0 24px 64px -24px rgba(0, 0, 0, .7);
  color-scheme: dark;
}