/* Base */
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: radial-gradient(1200px 600px at 10% -10%, rgba(132,204,22,0.08), rgba(0,0,0,0) 60%),
              radial-gradient(900px 500px at 110% 10%, rgba(59,7,100,0.08), rgba(0,0,0,0) 60%);
}

/* Utility: glass background used in header/button */
.glass {
  backdrop-filter: saturate(180%) blur(10px);
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.16);
}

/* Fixed header contrast handling */
.site-header {
  background: linear-gradient(to bottom, rgba(59,7,100,0.78), rgba(30,11,58,0.45));
  backdrop-filter: saturate(160%) blur(8px);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.site-header.scrolled {
  background: rgba(30,11,58,0.96);
  box-shadow: 0 10px 30px -12px rgba(2,6,23,0.55);
}
.site-header a { color: #fff; }
.site-header nav a:hover { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 2px; }

/* Equal-height grids and cards */
.grid-equal { align-items: stretch; }
.grid-equal > * { height: 100%; }
.card { display: flex; flex-direction: column; height: 100%; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.card ul { margin-top: 0.75rem; }
.card a.mt-8 { margin-top: auto; }
.card:hover { transform: translateY(-2px); box-shadow: 0 20px 30px -18px rgba(2,6,23,0.25); border-color: #93c5fd40; }

/* Responsive fixes for mobile nav panel opened via script */
#navLinks.absolute { width: calc(100% - 2rem); max-width: 20rem; }
#navLinks.absolute a { display: block; }

/* Image gallery uniform sizing fallback (in case of slow Tailwind load) */
#work img { aspect-ratio: 4/3; object-fit: cover; }

/* Gallery hover effect */
.img-zoom { transition: transform .35s ease, box-shadow .25s ease; }
.img-zoom:hover { transform: scale(1.03); box-shadow: 0 24px 40px -24px rgba(2,6,23,0.35); }

/* Section spacing consistency */
section { scroll-margin-top: 90px; }

/* Buttons hover/active refinements */
button, .btn { transition: transform .15s ease, filter .2s ease, box-shadow .2s ease; }
button:hover, .btn:hover { transform: translateY(-1px); box-shadow: 0 10px 18px -10px rgba(2,6,23,0.3); }
button:active, .btn:active { transform: translateY(0); filter: brightness(.98); box-shadow: none; }

/* Form contrast improvements */
input[type="text"], input[type="email"], textarea {
  background-color: #fff;
  color: #0f172a; /* slate-900 */
  border-color: #cbd5e1; /* slate-300 */
}
input::placeholder, textarea::placeholder {
  color: #64748b; /* slate-500 for better readability */
  opacity: 1;
}
input:focus, textarea:focus {
  border-color: #14B8A6; /* teal */
  box-shadow: 0 0 0 3px rgba(20,184,166,0.25);
  outline: none;
}

/* Footer subtle elevation */
footer { box-shadow: inset 0 1px 0 rgba(148,163,184,0.25); }