/* Original You — Design Tokens
   Medical-aesthetic visual language. Safety-forward, premium, calm. */

:root {
  /* ——— Color ——— */
  /* Warm clinical neutrals — feels like a modern medspa, not a sterile hospital */
  --color-bg:           #F5F2EC;   /* warm bone / paper */
  --color-surface:      #FBFAF6;   /* card */
  --color-surface-alt:  #ECE7DC;   /* mineral band */
  --color-ink:          #1B2622;   /* deep forest-charcoal */
  --color-ink-muted:    #5B6661;
  --color-ink-faint:    #9AA29D;
  --color-border:       #D7D1C2;
  --color-border-soft:  #E5E0D2;

  /* Brand accent — clinical teal/green. Reads as botanical + medical. */
  --color-accent:       #2A6E68;
  --color-accent-deep:  #1E4F4B;
  --color-accent-hover: #235955;
  --color-accent-soft:  #D9E5E1;

  /* Secondary — warm copper, used VERY sparingly for emphasis */
  --color-warm:         #B4663A;

  /* Semantic */
  --color-success:      #437A22;
  --color-warning:      #9C5414;
  --color-error:        #A12C44;

  /* ——— Typography ——— */
  --font-display: "Fraunces", "Iowan Old Style", "Apple Garamond", "Times New Roman", serif;
  --font-body:    "Inter Tight", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* Fluid type scale */
  --text-xs:    clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
  --text-sm:    clamp(0.875rem, 0.85rem + 0.15vw, 0.9375rem);
  --text-base:  clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --text-lg:    clamp(1.125rem, 1.07rem + 0.3vw, 1.25rem);
  --text-xl:    clamp(1.375rem, 1.25rem + 0.6vw, 1.625rem);
  --text-2xl:   clamp(1.75rem, 1.5rem + 1.2vw, 2.25rem);
  --text-3xl:   clamp(2.25rem, 1.85rem + 2vw, 3.25rem);
  --text-hero:  clamp(2.75rem, 2rem + 4vw, 5.25rem);

  /* Line heights */
  --leading-tight:  1.1;
  --leading-snug:   1.25;
  --leading-normal: 1.55;
  --leading-loose:  1.7;

  /* ——— Spacing ——— */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Section padding fluid */
  --section-y: clamp(3.5rem, 6vw, 7rem);
  --container-x: clamp(1.25rem, 4vw, 2.5rem);
  --container-max: 1200px;
  --measure: 65ch;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 22px;

  /* Shadows — restrained */
  --shadow-sm: 0 1px 2px rgba(27, 38, 34, 0.04), 0 1px 1px rgba(27, 38, 34, 0.03);
  --shadow-md: 0 4px 12px rgba(27, 38, 34, 0.06), 0 1px 3px rgba(27, 38, 34, 0.04);
  --shadow-lg: 0 12px 30px rgba(27, 38, 34, 0.08), 0 2px 6px rgba(27, 38, 34, 0.04);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 160ms;
  --dur-base: 280ms;
  --dur-slow: 500ms;
}