/**
 * Design Tokens - Beauty Couture Cambridge Heath
 * Modern East London editorial aesthetic: warm, confident, couture.
 */

:root {
  /* Color Tokens */
  --ink: #14110F;
  --espresso: #2A1F1A;
  --cream: #F6EFE6;
  --bone: #EDE3D5;
  --copper: #B7683F;
  --copper-text: #96502C; /* WCAG AA accessible against --cream (>=4.5:1) */
  --blush: #E3B7A0;
  --oxblood: #5B1F24;
  --line: rgba(20, 17, 15, 0.14);
  --line-light: rgba(246, 239, 230, 0.18);
  --whatsapp: #25D366;
  --success: #2F7D4F;
  --error: #B3261E;

  /* Typography */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Fluid Type Scale */
  --type-h1: clamp(2.75rem, 7vw + 1rem, 6.5rem);
  --type-h2: clamp(2rem, 4vw + 1rem, 3.75rem);
  --type-h3: clamp(1.35rem, 1.5vw + 1rem, 1.9rem);
  --type-body: clamp(1rem, 0.25vw + 0.95rem, 1.0625rem);
  --type-body-lead: clamp(1.125rem, 0.5vw + 1rem, 1.25rem);
  --type-small: 0.875rem;
  --type-eyebrow: 0.78rem;

  /* Line Heights */
  --lh-h1: 0.95;
  --lh-h2: 1.1;
  --lh-h3: 1.25;
  --lh-body: 1.65;
  --lh-tight: 1.3;

  /* Letter Spacing */
  --track-tightest: -0.025em;
  --track-tight: -0.015em;
  --track-normal: 0;
  --track-eyebrow: 0.18em;

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-pill: 9999px;
  --radius-arch: 999px 999px 24px 24px;
  --radius-circle: 50%;

  /* Spacing Scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-9: 112px;
  --space-10: 160px;

  /* Layout Containers */
  --container-max: 1240px;
  --container-gutter: clamp(20px, 5vw, 48px);
  --section-padding-y: clamp(72px, 10vw, 144px);
  --section-padding-compact: clamp(48px, 6vw, 80px);

  /* Elevation / Shadows */
  --shadow-subtle: 0 4px 20px rgba(20, 17, 15, 0.05);
  --shadow-card: 0 10px 30px rgba(20, 17, 15, 0.07);
  --shadow-hover: 0 16px 40px rgba(20, 17, 15, 0.12);
  --shadow-overlay: 0 24px 60px rgba(20, 17, 15, 0.22);

  /* Transitions */
  --ease-couture: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 180ms;
  --duration-medium: 300ms;
  --duration-slow: 600ms;

  /* Focus Ring (WCAG AA compliant) */
  --focus-outline: 3px solid var(--copper-text);
  --focus-offset: 3px;
}
