/* ----- Global Variables for all pages ----- */
:root {
  /* Base Colors (RGB format for alpha transparency support) */
  --bg-body-rgb: 241, 245, 249;    /* #f1f5f9 */
  --bg-card-rgb: 255, 255, 255;    /* #ffffff */
  --accent-color-rgb: 92, 43, 182; /* #5c2bb6 */

  /* --- Background Colors --- */
  --bg-body: rgb(var(--bg-body-rgb));
  --bg-card: rgb(var(--bg-card-rgb));
  --bg-tag: #e2e8f0;

  /* --- Glassmorphism System --- */
  --glass-bg: rgba(var(--bg-card-rgb), 0.6);
  --glass-bg-hover: rgba(var(--bg-card-rgb), 0.85);
  --glass-border: rgba(0, 0, 0, 0.08);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.05);
  --glass-inset: inset 0 1px 0 rgba(255, 255, 255, 0.4);

  /* --- Text Colors --- */
  --text-main: #1e293b;
  --text-muted: #64748b;
  --text-heading-h2: #5c2bb6;
  --text-heading-h3: #0f172a;

  /* --- Borders & Accents --- */
  --accent-color: rgb(var(--accent-color-rgb));
  --border-color: #e2e8f0;
  --primary-gradient: linear-gradient(90deg, #322bb6 0%, #712bb6 100%);

  /* --- Transitions --- */
  --transition-speed: 0.3s;

  /* --- Layout & Spacing --- */
  --container-max-width: 1000px; /* Widened slightly to support a modern grid */
  --header-height: 140px; /* Actual header height */
  --navbar-height: 60px; /* Navbar height */
  --header-offset: calc(var(--header-height) + var(--navbar-height)); /* Scroll padding offset (header + buffer) */
  --spacing-xs: 5px;
  --spacing-sm: 10px;
  --spacing-md: 15px;
  --spacing-lg: 20px;
  --spacing-xl: 24px;
  --spacing-xxl: 40px;

  /* --- Shadows --- */
  --shadow-card-hover: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --shadow-hover: 0 10px 20px rgba(0, 0, 0, 0.05);

  /* --- Backwards Compatibility Aliases --- */
  --bg-card: rgb(var(--bg-card-rgb));
  --text-nav: var(--text-main);
}

/* --- Dark Mode Overrides --- */
[data-theme='dark'] {
  /* --- Base Colors (RGB) --- */
  --bg-body-rgb: 10, 10, 12;         /* #0a0a0c */
  --bg-card-rgb: 30, 41, 59;         /* #1e293b */
  --accent-color-rgb: 167, 139, 250; /* #a78bfa */

  /* --- Background Colors --- */
  --bg-body: rgb(var(--bg-body-rgb));
  --bg-card: rgb(var(--bg-card-rgb));
  --bg-tag: #334155;

  /* --- Glassmorphism System --- */
  /* Higher base opacity on dark mode to ensure text legibility */
  --glass-bg: rgba(var(--bg-card-rgb), 0.7);
  --glass-bg-hover: rgba(var(--bg-card-rgb), 0.9);
  --glass-border: rgba(255, 255, 255, 0.1);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  --glass-inset: inset 0 1px 0 rgba(255, 255, 255, 0.05);

  /* --- Text Colors --- */
  --text-main: #f8fafc;
  --text-muted: #94a3b8;
  --text-heading-h2: #a78bfa;
  --text-heading-h3: #f8fafc;

  /* --- Borders & Accents --- */
  --border-color: #334155;

  /* --- Shadows --- */
  --shadow-card-hover: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
}

/* --- Global Reset & Variables --- */
* { 
    text-decoration: none !important;
    box-sizing: border-box; 
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--header-offset);
}

body {
  margin: 0;
  padding: 0;
  background-color: var(--bg-body);
  color: var(--text-main);
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  line-height: 1.6;
}