/* ============================================================
   VARIABLES — Ocean & Turquoise Color System
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700;900&family=Nunito:wght@300;400;600;700&family=Raleway:wght@400;500;600;700&display=swap');

:root {
  /* Colors */
  --color-primary:       #0B7A75;
  --color-primary-dark:  #085E5A;
  --color-primary-light: #0E9E97;
  --color-secondary:     #1AAFB0;
  --color-accent:        #4ECDC4;
  --color-accent-light:  #A8EDEA;
  --color-ocean-deep:    #0A2E36;
  --color-ocean-mid:     #134E5E;
  --color-ocean-surface: #1C7293;
  --color-seafoam:       #71C9CE;
  --color-mist:          #CBF1F5;
  --color-white-wave:    #F0FAFA;
  --color-white:         #FFFFFF;
  --color-text-dark:     #0A2E36;
  --color-text-mid:      #2C6E74;
  --color-text-light:    #5BA3A8;
  --color-border:        #B2E4E6;

  /* Typography */
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body:    'Nunito', 'Segoe UI', sans-serif;
  --font-accent:  'Raleway', sans-serif;

  /* Spacing */
  --section-padding: 80px 0;
  --container-max:   1200px;

  /* Shadows */
  --shadow-soft:   0 4px 24px rgba(11,122,117,0.12);
  --shadow-medium: 0 8px 40px rgba(11,122,117,0.20);
  --shadow-deep:   0 16px 60px rgba(10,46,54,0.28);

  /* Border Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 32px;
}