/* ---- Professional Blue Theme (Office Hours) ---- */
:root {
  --page-bg: #F5F7FA;
  --page-bg-gradient: linear-gradient(170deg, #F5F7FA 0%, #EEF1F6 50%, #E8ECF3 100%);
  --pattern-image: linear-gradient(#0F3460 1px, transparent 1px), linear-gradient(90deg, #0F3460 1px, transparent 1px);
  --pattern-size: 40px 40px;
  --pattern-opacity: 0.025;

  --orb1-bg: none;
  --orb2-bg: none;

  --font-display: 'IBM Plex Sans', sans-serif;
  --font-body: 'IBM Plex Sans', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;

  --text-primary: #1A1A2E;
  --text-heading: #1A1A2E;
  --text-secondary: #5D5D5D;
  --text-muted: #7F8C8D;
  --text-secondary-dark: #4A4A4A;

  --accent-1: #0F3460;
  --accent-1-dark: #0A2545;
  --accent-2: #2980B9;
  --accent-2-dark: #1A5276;
  --accent-3: #27AE60;
  --accent-3-dark: #196F3D;
  --accent-4: #D97706;
  --accent-4-dark: #B45309;
  --accent-r: #E94560;

  --card-bg: #fff;
  --card-border: 1px solid rgba(0,0,0,.05);
  --card-border-color: rgba(0,0,0,.05);
  --card-radius: 10px;
  --card-shadow: 0 1px 6px rgba(0,0,0,.04);
  --card-accent-dir: 180deg;

  --card-dark-bg: #0F3460;
  --card-dark-text: #fff;
  --card-dark-title: #67B8E3;
  --card-dark-body: #B8CBE0;

  --highlight-bg: #F0F7ED;
  --highlight-border-color: #C8E6C0;
  --highlight-border-width: 1.5px;

  --badge-bg: transparent;
  --badge-border-color: #0F3460;
  --badge-border-width: 1.5px;
  --badge-text: #0F3460;

  --dot-radius: 2px;

  --bullet-color: #0F3460;
  --bullet-radius: 1px;
  --bullet-opacity: 0.35;

  --step-radius: 4px;
  --step-1-color: #0F3460;
  --step-2-color: #0F3460;
  --step-3-color: #0F3460;
  --step-4-color: #0F3460;

  --tag-bg-1: rgba(15,52,96,.08);  --tag-color-1: #0F3460;
  --tag-bg-2: rgba(41,128,185,.08); --tag-color-2: #1A5276;
  --tag-bg-3: rgba(39,174,96,.08);  --tag-color-3: #196F3D;
  --tag-bg-4: rgba(217,119,6,.08);  --tag-color-4: #92400E;

  --chip-bg: #F0EDE6;
  --chip-color: #4A4A4A;
  --chip-border: #E0DCD3;

  --glow-bg-1: #F0F7ED;
  --glow-bg-2: #F0F7ED;
  --glow-border: #C8E6C0;

  --cta-border: #DEE2E8;
  --btn-bg: #0F3460;
  --btn-text: #fff;
  --btn-font-size: 12px;
  --btn-radius: 6px;
  --btn-shadow: none;
  --btn-letter-spacing: 1px;
  --btn-transform: uppercase;

  --title-size: 52px;
  --title-weight: 700;
  --title-letter-spacing: -1px;
  --tagline-size: 14px;
  --tagline-weight: 300;
  --card-title-size: 13px;
  --card-title-transform: uppercase;
  --card-title-spacing: 0.5px;
  --brand-weight: 500;
}