:root {
  /* ==========================================================================
     Prime Optik Brand Colors
     ========================================================================== */
  --po-white: #FFFEFA;
  --po-off-white: #FBF8F0;
  --po-warm-white: #F5F0E4;
  --po-soft-stone: #E2DAC7;
  --po-line: #D7C89E;
  --po-charcoal: #11110F;
  --po-body: #37352F;
  --po-muted: #777267;
  --po-champagne: #D6AE4F;
  --po-champagne-dark: #9E711C;
  --po-gold-light: #F1DC91;
  --po-gold: #D6AE4F;
  --po-gold-deep: #A6751D;
  --po-ink: #11110F;
  --po-black: #070706;
  --po-gradient-gold: linear-gradient(118deg, #F1DC91 0%, #D6AE4F 48%, #A6751D 100%);
  --po-gradient-gold-deep: linear-gradient(118deg, #E2C467 0%, #C99D3E 52%, #9E711C 100%);
  --po-gradient-dark: linear-gradient(135deg, #050505 0%, #11110F 54%, #1D1C18 100%);
  --po-gradient-ivory: linear-gradient(135deg, #FFFEFA 0%, #F5F0E4 58%, #E8DFC9 100%);
  --po-whatsapp: #A6751D;

  /* ==========================================================================
     Typography Families
     ========================================================================== */
  --po-font-serif: 'Cormorant Garamond', Garamond, Georgia, serif;
  --po-font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* ==========================================================================
     Layout & Dimensions
     ========================================================================== */
  --po-max-wide: 1600px;
  --po-max-content: 1320px;
  --po-max-reading: 760px;
  
  --po-gutter: clamp(1.125rem, 3.5vw, 4.5rem);
  --po-section-spacing: clamp(4.5rem, 8vw, 10rem);
  --po-header-height: 90px;
  --po-header-height-scrolled: 72px;

  /* ==========================================================================
     Transitions & Motion
     ========================================================================== */
  --po-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --po-ease-subtle: cubic-bezier(0.25, 0.1, 0.25, 1);
  --po-duration-fast: 0.25s;
  --po-duration-base: 0.45s;
  --po-duration-slow: 0.85s;
  --po-transition-fast: var(--po-duration-fast) var(--po-ease);
  --po-transition-base: var(--po-duration-base) var(--po-ease);
  --po-transition-slow: var(--po-duration-slow) var(--po-ease);

  /* ==========================================================================
     Z-Index Layers
     ========================================================================== */
  --po-z-header: 1000;
  --po-z-drawer: 2000;
  --po-z-bar: 990;
  --po-z-modal: 3000;
}
