:root {
  --radius: 0.75rem;
  --color-background: oklch(1 0 0);
  --color-foreground: oklch(0.22 0.03 270);
  --color-primary: oklch(0.34 0.18 270);
  --color-secondary: oklch(0.97 0.01 270);
  --color-highlight: #fede14;
  --color-border: oklch(0.92 0.012 265);
  
  /* Robust Dark Gradient for Hero Legibility */
  --gradient-hero: linear-gradient(135deg, rgba(2, 6, 23, 0.85) 0%, rgba(2, 6, 23, 0.45) 100%);
}

* {
  border-color: var(--color-border);
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--color-background);
  color: var(--color-foreground);
  font-family: system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
   BUTTON & TEXT VISIBILITY FIXES
   ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ */

/* Primary Buttons */
.bg-primary, 
button.bg-primary, 
a.bg-primary { 
  background-color: var(--color-primary) !important;
  color: #FFFFFF !important; 
}

.bg-primary:hover,
button.bg-primary:hover,
a.bg-primary:hover { 
  background-color: oklch(0.25 0.18 270) !important;
  color: #FFFFFF !important;
  opacity: 0.95;
}

/* Ensure Icons inside white-text buttons are also white */
.bg-primary i, 
.bg-primary [data-lucide],
.bg-primary iconify-icon {
  color: #FFFFFF !important;
  stroke: #FFFFFF !important;
}

/* Secondary Buttons */
.bg-secondary {
  background-color: var(--color-secondary) !important;
  color: var(--color-primary) !important;
}

/* ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
   SPACING & GAP FIXES
   ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ */

/* Force reduce all top-paddings used to offset headers */
.pt-32 { padding-top: 3rem !important; }
.pt-20 { padding-top: 2.5rem !important; }
.pt-16 { padding-top: 2rem !important; }
.pt-12 { padding-top: 1.5rem !important; }

/* Global Section spacing */
/* Removed: was conflicting with inline py-* classes on inner pages */


/* Home specific spacing */
#home {
  padding-top: 0 !important;
}

/* #about — Spacing strictly handled by Tailwind classes */


/* Navbar height correction removed to allow stacked layout to expand naturally */
/* header#navbar — height correction removed to allow stacked layout to expand naturally */

/* Navbar Logo constraint disabled to allow larger logo */
#navbar img {
  /* height: 48px !important; */
  width: auto !important;
}

/* ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
   UTILITY FIXES
   ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ */
iconify-icon, [data-lucide] {
  display: inline-block;
  vertical-align: middle;
}

img {
  max-width: 100%;
}

/* Active Link Effect */
.nav-link.active {
  color: var(--color-primary) !important;
  position: relative;
}

.nav-link.active::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--color-primary);
  border-radius: 2px;
  box-shadow: 0 0 8px var(--color-primary);
  opacity: 0.8;
}