/* ============================================================================
 * Norwood Dental — Design Tokens
 *
 * Source: 2026 Brand Guidelines (Feb 2026).
 * Every color, type style, space, and radius used in the theme is defined here.
 * ========================================================================== */

:root {
	/* --- Brand palette --- */
	--nd-prussian:     #021D3B;  /* primary dark anchor */
	--nd-prussian-90:  #0a253f;  /* slightly lifted, for cards on dark bg */
	--nd-french-blue:  #034192;  /* secondary accent */
	--nd-pacific-blue: #419EB0;  /* soft accent */
	--nd-lime:         #AED939;  /* CTA — small areas only */
	--nd-lime-hover:   #99c428;
	--nd-pacific-hover: #2C8295;  /* darker shade for hover states */
	--nd-white-smoke:  #F4F4F4;  /* primary light anchor */
	--nd-white:        #FFFFFF;
	--nd-black:        #000000;

	/* --- Functional --- */
	--nd-bg:           var(--nd-white-smoke);
	--nd-bg-dark:      var(--nd-prussian);
	--nd-surface:      var(--nd-white);
	--nd-surface-dark: var(--nd-prussian-90);

	--nd-text:           var(--nd-prussian);
	--nd-text-muted:     #54607a;
	--nd-text-inverse:   var(--nd-white);
	--nd-text-inverse-muted: rgba(255,255,255,.78);

	--nd-border:       rgba(2,29,59,.10);
	--nd-border-dark:  rgba(255,255,255,.10);

	--nd-success: #2c8a4a;
	--nd-error:   #c1342a;

	/* --- Typography --- */
	--nd-font-display: 'Filosofia', Georgia, 'Times New Roman', serif;
	--nd-font-sans:    'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	--nd-font-body:    var(--nd-font-sans);

	/* Type scale (v2 — Jun 2026 audit) */
	--nd-display-lg: clamp(3rem, 5.5vw, 5rem);      /* hero  → 80px desktop */
	--nd-display-sm: clamp(2rem, 3.5vw, 2.75rem);   /* big numbers — steps, year, rating */
	--nd-h1:         clamp(2.5rem, 4.5vw, 3.75rem); /* page title → 60px */
	--nd-h2:         clamp(2rem, 3vw, 2.5rem);      /* section heading → 40px */
	--nd-h3:         clamp(1.5rem, 2vw, 1.875rem);  /* card / sub-heading → 30px */
	--nd-h4:         1.25rem;                       /* small heading → 20px */

	--nd-body-lg:    1.1875rem;                     /* lead → 19px */
	--nd-body:       1.0625rem;                     /* body → 17px */
	--nd-small:      0.9375rem;                     /* small → 15px */
	--nd-xs:         0.8125rem;                     /* xs / labels → 13px */
	--nd-eyebrow:    0.8125rem;                     /* eyebrows → 13px */
	--nd-btn:        0.9375rem;                     /* button text → 15px */

	--nd-leading-tight: 1.2;
	--nd-leading-snug:  1.3;
	--nd-leading-base:  1.5;
	--nd-leading-loose: 1.75;

	--nd-tracking-tight:  -0.03em;  /* display */
	--nd-tracking-normal:  0;
	--nd-tracking-wide:    0.05em;
	--nd-tracking-wider:   0.16em;  /* eyebrows / button text */

	/* --- Spacing scale (4px base) --- */
	--nd-space-1:  0.25rem;
	--nd-space-2:  0.5rem;
	--nd-space-3:  0.75rem;
	--nd-space-4:  1rem;
	--nd-space-5:  1.25rem;
	--nd-space-6:  1.5rem;
	--nd-space-8:  2rem;
	--nd-space-10: 2.5rem;
	--nd-space-12: 3rem;
	--nd-space-16: 4rem;
	--nd-space-20: 5rem;
	--nd-space-24: 6rem;

	/* --- Layout --- */
	--nd-container:      1280px;
	--nd-container-narrow: 920px;
	--nd-gutter:         clamp(1.25rem, 3vw, 2rem);
	--nd-section-y:      clamp(3rem, 6vw, 6rem);

	/* --- Radius --- */
	--nd-radius-sm:   8px;
	--nd-radius-md:   12px;
	--nd-radius-lg:   24px;
	--nd-radius-pill: 999px;

	/* --- Shadows --- */
	--nd-shadow-card:       0 4px 12px rgba(2,29,59,.06);
	--nd-shadow-card-hover: 0 8px 24px rgba(2,29,59,.10);
	--nd-shadow-card-dark:  0 4px 24px rgba(0,0,0,.30);

	/* --- Motion --- */
	--nd-ease:     cubic-bezier(.2,.6,.2,1);
	--nd-fast:     150ms;
	--nd-medium:   240ms;
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}