/**
 * Design tokens — Detalii Med
 * Paleta pornește din logo (extras din logo-detaliimed.pdf): cupru cald (#C97E60) și
 * brun-ciocolatiu (#672916), extinsă cu neutre calde pentru un fundal premium, nu clinic.
 */
:root {
  /* Culori — brand */
  --copper: #c97e60;
  --copper-dark: #672916;
  --copper-light: #e3b39c;

  /* Culori — neutre calde */
  --cream: #faf6f1;
  --sand: #efe6db;
  --sand-dark: #ddccb8;
  --ink: #2b2320;
  --ink-soft: #5a4c43;
  --white: #ffffff;

  /* Culori — accent secundar (echilibru rece-cald, folosit sparse) */
  --sage: #7f8a72;
  --sage-dark: #5c6650;

  /* Culori — stare */
  --success: #3f6b4a;
  --success-bg: #e8f0e8;
  --error: #a3372a;
  --error-bg: #fbeceb;

  /* Suprafețe */
  --bg: var(--cream);
  --surface: var(--white);
  --surface-alt: var(--sand);
  --border: #e2d5c4;
  --border-strong: var(--sand-dark);

  /* Text */
  --text: var(--ink);
  --text-soft: var(--ink-soft);
  --text-on-dark: var(--cream);
  --link: var(--copper-dark);

  /* Tipografie — serif editorial cu contrast ridicat pentru titluri, geometric pentru text.
     Titlurile folosesc greutatea 500 (nu bold): la corpuri mari, un Playfair semi-light
     citește mai rafinat decât unul îngroșat. */
  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --fw-display: 500;
  --fw-display-strong: 600;

  --fs-base: 1rem;
  --fs-sm: 0.9375rem;
  --fs-xs: 0.8125rem;
  --fs-lg: clamp(1.125rem, 1.05rem + 0.35vw, 1.3rem);
  --fs-xl: clamp(1.35rem, 1.2rem + 0.7vw, 1.75rem);
  --fs-2xl: clamp(1.7rem, 1.4rem + 1.4vw, 2.4rem);
  --fs-3xl: clamp(2.1rem, 1.6rem + 2.3vw, 3.2rem);
  --fs-4xl: clamp(2.6rem, 1.9rem + 3.4vw, 4.4rem);

  /* Titlurile mari se strâng optic; cele mici rămân neutre. */
  --ls-display-xl: -0.035em;
  --ls-display: -0.02em;

  --lh-tight: 1.18;
  --lh-snug: 1.35;
  --lh-normal: 1.8;

  /* Spațiere (scară 4px) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6.5rem;

  /* Container */
  --container-max: 1200px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);

  /* Radius & umbre */
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 3px rgba(43, 35, 32, 0.08);
  --shadow-md: 0 8px 24px rgba(43, 35, 32, 0.10);
  --shadow-lg: 0 20px 50px rgba(43, 35, 32, 0.16);

  /* Tranziții */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 160ms;
  --duration-normal: 280ms;
  --duration-slow: 480ms;

  /* Z-index */
  --z-header: 100;
  --z-overlay: 200;
  --z-toast: 300;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 1ms;
    --duration-normal: 1ms;
    --duration-slow: 1ms;
  }
}
