/* HIMG Medical — design tokens
   Taken over from the HIMG Clinic English prototype (himg.clinic/himg-proba, "European medical maison"):
   brand, ivory, champagne, walnut, stone; Playfair Display for headings, Inter for reading and UI.
   Every page of the HIMG Medical prototype uses these tokens; components never hard-code colours. */

:root {
  /* brand palette (identical to the reference) */
  /* the reference's navy is replaced by HIMG Medical's logo green (#0CBAB8), darkened at the same hue
     so ivory text (7.7:1) and champagne labels (4.8:1) stay readable on it */
  --brand: #065654;        /* header, hero, deep sections, footer, primary buttons on light backgrounds */
  --brand-hover: #0A6664;
  --brand-deep: #043F3E;   /* image placeholders on brand */
  --brand-logo: #0CBAB8;   /* exact logo colour: decorative accents only, too light for text */
  --ivory: #F7F3EA;       /* page background, text on brand */
  --champagne: #D4C1A3;   /* hairlines, accents and primary buttons on brand */
  --champagne-hover: #E2D3BA;
  --walnut: #5A4636;      /* small labels and kickers on light backgrounds */
  --stone: #9AA0A6;       /* decorative separators only (too light for text) */
  --white: #FFFFFF;       /* cards, tables, form fields */

  /* derived, contrast-checked in the reference */
  --ink: #043B3A;         /* headings on ivory 11:1 */
  --text: #3D4652;        /* body text 8.6:1 on ivory */
  --muted: #5E646C;       /* captions 5.4:1 on ivory */
  --bronze: #8B7355;      /* line icons on light backgrounds */
  --line: #E4D9C7;        /* champagne hairline */
  --sand: #EFE8DB;        /* tinted sections */
  --cream: #F2EBDD;       /* warm panels and notes */

  /* text on brand */
  --on-brand: rgba(247, 243, 234, .86);
  --on-brand-muted: rgba(247, 243, 234, .68);
  --line-on-brand: rgba(212, 193, 163, .25);

  /* square corners, as in the reference; pills and circles keep their own radius */
  --radius-s: 2px;
  --radius-pill: 999px;

  /* layout */
  --wrap: 1240px;
  --gutter: clamp(16px, 4vw, 40px);
  --section: clamp(72px, 9vw, 136px);
  --header-h: 88px;

  /* type */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --fs-small: .875rem;
  --fs-body: 1rem;
  --fs-lead: 1.0625rem;
  --fs-h3: clamp(1.3rem, 1.15rem + .5vw, 1.6rem);
  --fs-h2: clamp(2.1rem, 1.4rem + 2.6vw, 3.5rem);
  --fs-h2-support: clamp(1.8rem, 1.3rem + 1.7vw, 2.6rem);
  --fs-label: .75rem;     /* uppercase tracked labels */
  --track-label: .2em;

  --shadow-card: 0 18px 40px -24px rgba(6, 86, 84, .55);
  --ease: .25s ease;
}