/* public/housy-theme/css/tokens.css
   Design tokens — single source of truth for colours, type, spacing, shadows.
   Loaded BEFORE bootstrap / skin / style. Use via var(--token-name). */

:root {
  /* Brand */
  --brand-primary: #114481;
  --brand-dark:    #0d2f5c;
  --brand-accent:  #c9a96e;

  /* Neutrals */
  --neutral-50:  #fafafa;
  --neutral-100: #f4f5f7;
  --neutral-300: #d6d9de;
  --neutral-600: #5a6270;
  --neutral-900: #1a1d24;

  /* Typography */
  --font-display: 'Montserrat', system-ui, sans-serif;
  --font-body:    'Inter', 'Open Sans', system-ui, sans-serif;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.5rem;

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* Shadows (tinted with brand navy) */
  --shadow-sm: 0 1px 2px rgba(17, 68, 129, 0.06);
  --shadow-md: 0 4px 12px rgba(17, 68, 129, 0.08);
  --shadow-lg: 0 12px 32px rgba(17, 68, 129, 0.12);

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* Motion */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-base: 250ms;

  /* ===================================================================
     P1 additions — additive only. Nothing consumes these yet (visual
     no-op). Brand primary #114481 unchanged. Consumed later in P2+.
     =================================================================== */

  /* Text colors (fix weak muted contrast; #999 legacy = 2.85:1 FAILS AA) */
  --text-body:    #2b2f36;            /* primary body copy */
  --text-muted:   var(--neutral-600); /* #5a6270 ~5.9:1 on white, PASS AA */
  --text-heading: var(--neutral-900); /* #1a1d24 */

  /* Link colors */
  --link:       var(--brand-primary);
  --link-hover: var(--brand-dark);

  /* Border */
  --border-color: var(--neutral-300);

  /* Line heights */
  --leading-tight:   1.25;
  --leading-normal:  1.55;
  --leading-relaxed: 1.7;

  /* Font weights */
  --fw-normal:   400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  /* Display font size (fluid, for hero h1 in P5..) */
  --text-display: clamp(2rem, 4vw, 2.75rem);

  /* Card tokens (unify chaotic 3px/10px radii -> 8px) */
  --card-bg:           #fff;
  --card-radius:       var(--radius-md);
  --card-border:       1px solid var(--neutral-300);
  --card-shadow:       var(--shadow-sm);  /* rest state: gentle, not flat */
  --card-shadow-hover: var(--shadow-lg);
  --card-pad:          var(--space-6);

  /* Button tokens */
  --btn-radius: var(--radius-sm);
  --btn-pad-y:  0.625rem;
  --btn-pad-x:  1.5rem;
  --btn-fw:     var(--fw-semibold);

  /* Focus ring (for P2 focus-visible) */
  --focus-ring:        0 0 0 3px rgba(17, 68, 129, 0.4);
  --focus-ring-color:  var(--brand-primary);
}