/* Shared presentation layer for the public-facing static site. */
:root {
    --site-gold: #d4a84b;
    --site-gold-light: #edcf83;
    --site-ink: #110e0a;
    --site-panel: rgba(18, 14, 10, 0.78);
    --site-panel-strong: rgba(12, 10, 8, 0.94);
    --site-text: #fffdf8;
    --site-text-soft: rgba(255, 253, 248, 0.78);
    --site-border: rgba(255, 255, 255, 0.14);
    --site-nav-height: 72px;
}

html { scroll-padding-top: calc(var(--site-nav-height) + 24px); }
body { min-height: 100vh; }
button, input, select, textarea { font: inherit; }
img { max-width: 100%; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
summary:focus-visible {
    outline: 2px solid var(--site-gold-light);
    outline-offset: 4px;
}

.nav,
.navbar {
    height: var(--site-nav-height) !important;
    padding: 0 clamp(1.25rem, 4vw, 4rem) !important;
    background: rgba(10, 8, 6, 0.58) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(18px) saturate(1.35) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.35) !important;
}

.nav.scrolled,
.navbar.scrolled {
    background: rgba(10, 8, 6, 0.92) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2) !important;
}

.nav-logo {
    color: var(--site-gold) !important;
    white-space: nowrap;
}

.nav-links {
    gap: clamp(1rem, 2.2vw, 2rem) !important;
}

.nav-links a {
    position: relative;
    color: var(--site-text-soft) !important;
    letter-spacing: 0.035em !important;
    white-space: nowrap;
}

.nav-links a:not(.cta-nav):not(.cta)::after {
    content: '';
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: -0.55rem;
    height: 1px;
    background: var(--site-gold);
    transition: left 0.25s ease, right 0.25s ease;
}

.nav-links a:hover,
.nav-links a.active {
    color: var(--site-gold-light) !important;
}

.nav-links a:hover::after,
.nav-links a.active::after {
    left: 0;
    right: 0;
}

.nav-links a.cta-nav,
.nav-links a.cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0.5rem 1.35rem !important;
    color: #2c1810 !important;
    background: var(--site-gold) !important;
    border-radius: 999px;
    font-weight: 600 !important;
}

.nav-links a.cta-nav:hover,
.nav-links a.cta:hover {
    color: #2c1810 !important;
    background: var(--site-gold-light) !important;
}

.nav-mobile-toggle {
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 50% !important;
    color: var(--site-text) !important;
    transition: color 0.25s ease, background 0.25s ease;
}

.nav-mobile-toggle:hover,
.nav-mobile-toggle[aria-expanded='true'] {
    color: var(--site-gold-light) !important;
    background: rgba(212, 168, 75, 0.12) !important;
}

.nav-mobile-menu {
    top: var(--site-nav-height) !important;
    padding: 1rem clamp(1.25rem, 5vw, 2rem) 1.35rem !important;
    gap: 0.25rem !important;
    background: var(--site-panel-strong) !important;
    border-bottom: 1px solid var(--site-border) !important;
    box-shadow: 0 24px 40px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(20px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(20px) saturate(1.2) !important;
    max-height: calc(100dvh - var(--site-nav-height));
    overflow-y: auto;
}

.nav-mobile-menu a {
    display: block;
    padding: 0.8rem 0.25rem !important;
    color: var(--site-text-soft) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    font-size: 1rem !important;
}

.nav-mobile-menu a:last-child { border-bottom: 0; }
.nav-mobile-menu a:hover,
.nav-mobile-menu a.active { color: var(--site-gold-light) !important; }
body.menu-open { overflow: hidden; }

footer {
    padding: 3rem clamp(1.25rem, 4vw, 3rem) !important;
    background: rgba(7, 6, 5, 0.28);
}

.footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.7rem 1.75rem !important;
    margin: 1rem 0 1.15rem !important;
}

.footer-links a {
    color: var(--site-text-soft) !important;
    text-decoration: none;
    font-size: 0.85rem;
}

.footer-links a:hover { color: var(--site-gold-light) !important; }

.site-skip-link {
    position: fixed;
    top: 0.75rem;
    left: 1rem;
    z-index: 3000;
    transform: translateY(-180%);
    padding: 0.65rem 1rem;
    color: #2c1810;
    background: var(--site-gold-light);
    border-radius: 999px;
    text-decoration: none;
    font-weight: 700;
    transition: transform 0.2s ease;
}

.site-skip-link:focus { transform: translateY(0); }

@media (max-width: 980px) {
    .nav-links { display: none !important; }
    .nav-mobile-toggle { display: inline-flex !important; }
}

@media (min-width: 981px) {
    .nav-mobile-menu { display: none !important; }
}

@media (max-width: 520px) {
    :root { --site-nav-height: 64px; }
    .nav-logo { font-size: 1.22rem !important; }
    footer { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    .reveal { opacity: 1 !important; transform: none !important; }
}