:root { --header-height: 112px; }
.site-header { position: fixed; inset: 0 0 auto; background: transparent; transition: background .35s, box-shadow .35s; }
.header-main { border-bottom: 0; gap: 30px; }
.brand-mark { width: 90px; height: 83px; }
.brand-mark img { filter: url(#header-logo-white); }
.header-descriptor { display: none; }
.main-navigation { flex: 1; justify-content: flex-end; gap: 42px; }
.nav-link { color: #fff; font-size: 15px; padding-block: 14px; }
.nav-link.is-active { color: #fff; }
.nav-link::after { display: none; }
.nav-roll { position: relative; display: block; height: 1.3em; overflow: hidden; line-height: 1.3; }
.nav-roll > span { display: block; transition: transform .4s cubic-bezier(.22,1,.36,1); }
.nav-roll > span:last-child { position: absolute; top: 100%; left: 0; white-space: nowrap; color: #e5c793; }
.nav-link:hover .nav-roll > span, .dropdown-toggle[aria-expanded='true'] .nav-roll > span { transform: translateY(-100%); }
.nav-contact { margin-left: clamp(30px, 6vw, 110px); background: #f3eee4; border-radius: 5px; color: #26382d; padding: 13px 21px; gap: 24px; font-size: 14px; transition: background .25s; }
.nav-contact span { color: #84632f; font-size: 19px; transition: transform .25s; }
.nav-contact:hover { background: #e5c793; }
.nav-contact:hover span { transform: translate(2px,-2px); }
.site-header.is-scrolled, .site-header.menu-is-open { background: #20352df2; backdrop-filter: blur(16px); box-shadow: 0 4px 24px #12231c18; }
.dropdown-panel { background: #f6f3eb; color: #26382d; border: 0; border-radius: 6px; box-shadow: 0 20px 40px #12231c25; top: calc(100% + 12px); }
.dropdown-panel a { transition: color .2s, padding .2s; }
.dropdown-panel a:hover { padding-left: 5px; }
.welcome-immersive { height: 100svh; min-height: 620px; }
.immersive-content { padding-top: calc(var(--header-height) + 35px); padding-bottom: 110px; }
.welcome-immersive .hero-image::after { background: linear-gradient(90deg, #111d18b8, #111d1850 50%, #111d1810), linear-gradient(180deg, #111d1866, transparent 30%), linear-gradient(0deg, #111d1899, transparent 45%); }
@media (max-width: 1100px) {
    :root { --header-height: 100px; }
    .brand-mark { width: 84px; height: 77px; }
    .menu-toggle { color: #fff; }
    .menu-toggle-lines { width: 44px; height: 44px; align-items: center; justify-content: center; border: 1px solid #ffffff60; border-radius: 50%; }
    .menu-toggle-lines span { background: #fff; width: 20px; }
    .main-navigation { background: #20352d; justify-content: flex-start; gap: 0; }
    .main-navigation > .nav-link, .nav-dropdown { border-color: #ffffff20; }
    .nav-link { color: #fff; }
    .nav-contact { width: 100%; margin: 24px 0 0; padding: 18px 22px; font-size: 18px; color: #26382d; border-bottom: 0 !important; }
    .dropdown-panel { background: transparent; color: #fff; box-shadow: none; border-radius: 0; }
    .dropdown-panel a + a { border-color: #ffffff20; }
    .dropdown-panel a:hover { color: #e5c793; }
}
@media (max-width: 600px) {
    :root { --header-height: 94px; }
    .brand-mark { width: 76px; height: 70px; }
    .header-main { gap: 18px; }
    .immersive-content { padding-top: 120px; padding-bottom: 150px; }
    .welcome-immersive { min-height: 660px; }
}
@media (prefers-reduced-motion: reduce) { .nav-roll > span { transition: none; } }
/* Keep the pointer path continuous between the heading and submenu. */
@media (min-width:1101px) {
    .main-navigation { gap:clamp(25px,2.3vw,42px); }
    .dropdown-panel::before { content:''; position:absolute; inset:-14px 0 auto; height:14px; }
    .dropdown-panel:not([hidden]) { animation:header-submenu-open .3s cubic-bezier(.2,.7,.2,1) both; }
}
@keyframes header-submenu-open { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) { .dropdown-panel:not([hidden]) { animation:none; } }
