/* ============================================================
   DESIGN TOKENS — unified from the approved source's two token
   sets (the original Montserrat/Open Sans pages and the later
   "Confirmed Global Theme" Inter pages). Inter is the canonical
   sitewide typeface per the source's own later pages' explicit
   "Theme Controls" / "Confirmed Global Theme" authority comments.
   ============================================================ */
:root {
	/* Brand colors */
	--color-primary:        #2C3E2D;
	--color-primary-dark:   #1E2E1F;
	--color-primary-deep:   #1A2A1F;
	--color-secondary:      #1B3454;
	--color-accent:         #E07B2A;
	--color-accent-dark:    #C46A1A;
	--color-accent-light:   #F49640;

	/* Text */
	--color-text-dark:      #1A1A1A;
	--color-text-medium:    #4A5568;
	--color-text-light:     #718096;
	--color-text-inverse:   #FFFFFF;

	/* Backgrounds */
	--color-bg-white:       #FFFFFF;
	--color-bg-light:       #F7F4EF;
	--color-bg-cream:       #EEE9E0;
	--color-bg-dark:        #1A2A1F;
	--color-bg-navy:        #0F1B2D;

	/* UI */
	--color-border:         #D5CFC5;
	--color-success:        #22C55E;
	--color-error:          #EF4444;
	--color-warning:        #F59E0B;

	/* Typography */
	--font-heading:         'Inter', sans-serif;
	--font-body:            'Inter', sans-serif;

	--text-display: clamp(40px, calc(2.0712vw + 32.233px), 72px);
	--text-h1:      clamp(36px, calc(1.2945vw + 31.146px), 56px);
	--text-h2:      clamp(28px, calc(1.0356vw + 24.117px), 44px);
	--text-h3:      clamp(24px, calc(0.5178vw + 22.058px), 32px);
	--text-h4:      clamp(20px, calc(0.2589vw + 19.029px), 24px);
	--text-body-lg: clamp(18px, calc(0.1294vw + 17.515px), 20px);
	--text-body:    clamp(15px, calc(0.0647vw + 14.757px), 16px);
	--text-small:   clamp(13px, calc(0.0647vw + 12.757px), 14px);
	--text-label:   12px;

	/* Spacing */
	--space-section:        96px;
	--space-container-x:    40px;
	--space-card:           40px;
	--space-gap:            24px;
	--space-stack:          16px;

	/* Containers */
	--container-max:        1200px;
	--container-narrow:     800px;
	--container-wide:       1920px;

	/* Radius */
	--radius-sm:            6px;
	--radius-md:            10px;
	--radius-lg:            20px;
	--radius-full:          9999px;

	/* Shadows */
	--shadow-sm:            0 1px 8px rgba(0,0,0,0.06);
	--shadow-md:            0 4px 20px rgba(0,0,0,0.10);
	--shadow-lg:            0 8px 40px rgba(0,0,0,0.14);
	--shadow-accent:        0 8px 28px rgba(224,123,42,0.32);

	/* Transitions */
	--transition-fast:      150ms cubic-bezier(0.4,0,0.2,1);
	--transition-base:      250ms cubic-bezier(0.4,0,0.2,1);
	--transition-slow:      400ms cubic-bezier(0.4,0,0.2,1);
	--transition-luxury:    700ms cubic-bezier(0.25,0.1,0.25,1);

	/* Layout */
	--header-height:         74px;
	--footer-padding-top:    72px;
	--footer-padding-bottom: 40px;
	--media-aspect-default:  16/9;

	/* Component tokens — derived, never a hardcoded literal */
	--button-radius:      var(--radius-sm);
	--button-padding-y:   14px;
	--button-padding-x:   32px;
	--button-transition:  var(--transition-base);

	--card-radius:        var(--radius-md);
	--card-padding:       var(--space-card);
	--card-shadow:        var(--shadow-md);
	--card-bg:            var(--color-bg-white);
	--card-border-color:  var(--color-border);

	--header-bg:              var(--color-bg-dark);
	--nav-link-color:         var(--color-text-inverse);
	--nav-link-color-active:  var(--color-accent);

	--footer-bg:          var(--color-bg-dark);
	--footer-text-color:  rgba(255,255,255,0.52);

	--media-radius:       var(--radius-sm);

	--section-bg-primary: var(--color-bg-white);
	--section-bg-alt:     var(--color-bg-light);
	--section-bg-dark:    var(--color-bg-dark);
	--section-padding-y:  var(--space-section);
}
