/* ============================================
   THEME VARIABLES — Source of Truth
   Source: design-dna.json (modern_v7)
   Style: Luxury Architecture & Design Agency
   ============================================ */

:root {
  /* === Brand Colors (Luxury Navy) === */
  --theme-primary:        #1E2240;
  --theme-primary-dark:   #111527;
  --theme-primary-light:  #E8E9EE;
  --theme-primary-mid:    #9DA0B4;
  --theme-primary-border: #C5C7D4;

  /* === Alpha Variants === */
  --theme-primary-alpha-10: rgba(30, 34, 64, 0.10);
  --theme-primary-alpha-25: rgba(30, 34, 64, 0.25);
  --theme-primary-alpha-50: rgba(30, 34, 64, 0.50);

  /* === Dark Palette === */
  --theme-dark:           #0D0F1A;
  --theme-dark-lighter:   #1E2240;

  /* === Gray Scale === */
  --theme-gray-900: #111827;
  --theme-gray-700: #374151;
  --theme-gray-500: #6B7280;
  --theme-gray-400: #9CA3AF;
  --theme-gray-300: #D1D5DB;
  --theme-gray-200: #E5E7EB;
  --theme-gray-100: #F3F4F6;
  --theme-gray-50:  #F8F8F8;

  /* === Semantic Variables === */
  --theme-text-primary:   #111827;
  --theme-text-secondary: #6B7280;
  --theme-text-muted:     #9CA3AF;
  --theme-text-white:     #FFFFFF;
  --theme-bg-default:     #FFFFFF;
  --theme-bg-subtle:      #F8F8F8;
  --theme-bg-dark:        #1E2240;
  --theme-border:         #E5E7EB;
  --theme-border-light:   #F3F4F6;

  /* === Feedback === */
  --theme-success: #10B981;
  --theme-error:   #EF4444;
  --theme-warning: #F59E0B;

  /* === Shapes === */
  --theme-radius-none: 0px;
  --theme-radius-xs:   4px;
  --theme-radius-sm:   8px;
  --theme-radius-md:   12px;
  --theme-radius-lg:   16px;
  --theme-radius-xl:   24px;
  --theme-radius-2xl:  32px;
  --theme-radius-pill: 9999px;

  --theme-radius-card:    16px;
  --theme-radius-btn:     9999px;
  --theme-radius-input:   9999px;
  --theme-radius-img:     12px;

  /* === Shadows === */
  --theme-shadow-sm:   0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --theme-shadow-md:   0 4px 16px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.04);
  --theme-shadow-lg:   0 10px 40px rgba(0,0,0,0.10), 0 4px 12px rgba(0,0,0,0.05);
  --theme-shadow-card: 0 4px 20px rgba(0,0,0,0.06), 0 2px 8px rgba(0,0,0,0.04);
  --theme-shadow-nav:  0 1px 0 rgba(0,0,0,0.06);

  /* === Spacing === */
  --theme-section-y:   96px;
  --theme-section-y-m: 64px;
}