/* ISCO Ghana — Custom Theme Styles */
/* Tailwind utilities are loaded via CDN in functions.php */

/* ── Base ── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; }

/* ── Navbar scroll behaviour ── */
#masthead.scrolled #main-nav {
  background-color: #fff !important;
  color: #1e293b !important;
  box-shadow: 0 2px 16px 0 rgba(0,0,0,.10);
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
#masthead.scrolled .logo-text  { color: #1e3a8a !important; }
#masthead.scrolled .logo-subtext { color: #475569 !important; }
#masthead.scrolled .nav-link   { color: #1e293b !important; }
#masthead.scrolled .nav-icon   { color: #1e293b !important; }

/* ── Hero slider ── */
.hero-slider { position: relative; }
.hero-slide { position: absolute; inset: 0; transition: opacity 1s ease-in-out; }

/* ── Animations ── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.animate-fade-in-up { animation: fadeInUp .8s ease both; }

/* ── Tailwind-compatible utilities not in CDN base ── */
.tracking-tight   { letter-spacing: -.025em; }
.tracking-wide    { letter-spacing: .025em; }
.tracking-wider   { letter-spacing: .05em; }
.leading-tight    { line-height: 1.25; }
.leading-relaxed  { line-height: 1.625; }
.drop-shadow-lg   { filter: drop-shadow(0 10px 8px rgba(0,0,0,.04)) drop-shadow(0 4px 3px rgba(0,0,0,.1)); }
.backdrop-blur-sm { backdrop-filter: blur(4px); }
.backdrop-blur-md { backdrop-filter: blur(12px); }
.mix-blend-multiply { mix-blend-mode: multiply; }

/* ── Container ── */
.container { width: 100%; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px)  { .container { max-width: 640px; } }
@media (min-width: 768px)  { .container { max-width: 768px; } }
@media (min-width: 1024px) { .container { max-width: 1024px; } }
@media (min-width: 1280px) { .container { max-width: 1280px; } }
