/* ── Base & Reset ───────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { margin: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%230f2140' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1rem center; padding-right: 2.5rem; }

/* ── Navbar scroll state ────────────────────────────────── */
#navbar.scrolled {
    background: rgba(10, 22, 40, 0.95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 4px 32px rgba(0, 0, 0, 0.3);
}
#navbar.scrolled .menu-line { background-color: #fff; }

/* ── Mobile menu animation ─────────────────────────────── */
#mobile-menu.open { opacity: 1; pointer-events: all; }
#mobile-menu.open .menu-line:nth-child(1) { transform: translateY(7px) rotate(45deg); }
#mobile-menu.open .menu-line:nth-child(2) { opacity: 0; transform: scaleX(0); }
#mobile-menu.open .menu-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); width: 1.5rem; }

/* ── Selection color ────────────────────────────────────── */
::selection { background: #c8a84e; color: #0a1628; }

/* ── Focus visible ──────────────────────────────────────── */
:focus-visible { outline: 2px solid #c8a84e; outline-offset: 2px; }

/* ── Smooth image loading ───────────────────────────────── */
img { opacity: 1; transition: opacity 0.3s ease; }
img[data-src] { opacity: 0; }