/* Base Variables */
        :root {
            --mdl-ink: #1a1a18;
            --mdl-paper: #f9f7f4;
            --mdl-sand: #b8a48a;
            --mdl-muted: #6d6b65;
            --mdl-nav-height: 100px;
            --mdl-nav-height-mobile: 80px;
            
            /* Custom Easings for Premium Feel */
            --ease-expo: cubic-bezier(0.19, 1, 0.22, 1);
            --ease-circ: cubic-bezier(0.85, 0, 0.15, 1);
            --ease-power: cubic-bezier(0.16, 1, 0.3, 1);
        }

        /* Prevent scrolling when overlay is active */
        body.mdl-menu-active {
            overflow: hidden;
            touch-action: none;
        }

        /* --- Main Header Architecture --- */
        .mdl-header-wrapper {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: var(--mdl-nav-height);
            z-index: 999;
            transition: transform 0.6s var(--ease-power), 
                        background-color 0.5s var(--ease-power),
                        border-color 0.5s var(--ease-power),
                        color 0.5s var(--ease-power);
            border-bottom: 1px solid transparent;
            font-family: "DM Sans", sans-serif;
            color: var(--mdl-paper);
        }

        /* Glassmorphism state on scroll */
        .mdl-header-wrapper.is-scrolled {
            background-color: rgba(249, 247, 244, 0.85);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            border-bottom: 1px solid rgba(26, 26, 24, 0.06);
            height: calc(var(--mdl-nav-height) - 15px); /* Shrink slightly on scroll */
            color: var(--mdl-ink);
        }

        /* Hide header on scroll down, show on scroll up (optional UX enhancement, currently disabled for simplicity, but foundation is here) */
        .mdl-header-wrapper.is-hidden {
            transform: translateY(-100%);
        }

        .mdl-nav-container {
            width: min(1440px, calc(100% - 64px));
            height: 100%;
            margin: auto;
            display: grid;
            grid-template-columns: 1fr auto 1fr; /* Centered brand */
            align-items: center;
            position: relative;
            z-index: 1001; /* Must sit above the overlay curtain */
            transition: color 0.5s var(--ease-power);
        }

        /* Brand Logo */
        .mdl-brand-link {
            grid-column: 2;
            font-family: "Cormorant Garamond", serif;
            font-weight: 500;
            font-size: clamp(16px, 1.5vw, 18px);
            letter-spacing: 0.25em;
            text-transform: uppercase;
            text-decoration: none;
            color: inherit;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden;
        }

        /* Brand Hover effect (Reveals italicized 'MDL' on hover) */
        .mdl-brand-link .full-text {
            display: inline-block;
            transition: transform 0.6s var(--ease-expo), opacity 0.6s var(--ease-expo);
        }
        
        .mdl-brand-link .short-text {
            position: absolute;
            font-style: italic;
            font-weight: 300;
            transform: translateY(100%);
            opacity: 0;
            transition: transform 0.6s var(--ease-expo), opacity 0.6s var(--ease-expo);
        }

        .mdl-brand-link:hover .full-text {
            transform: translateY(-100%);
            opacity: 0;
        }
        
        .mdl-brand-link:hover .short-text {
            transform: translateY(0);
            opacity: 1;
        }

        /* Desktop Navigation (Left side) */
        .mdl-nav-left {
            grid-column: 1;
            display: flex;
            align-items: center;
            gap: 40px;
        }

        /* Desktop Navigation (Right side) */
        .mdl-nav-right {
            grid-column: 3;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 40px;
        }

        .mdl-nav-item {
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.15em;
            color: inherit;
            text-decoration: none;
            position: relative;
            padding: 8px 0;
            overflow: hidden;
        }

        /* Magnetic Hover Line Effect */
        .mdl-nav-item::after {
            content: '';
            position: absolute;
            bottom: 4px;
            left: 0;
            width: 100%;
            height: 1px;
            background-color: currentColor;
            transform: scaleX(0);
            transform-origin: right;
            transition: transform 0.6s var(--ease-expo);
        }
        
        .mdl-nav-item:hover::after {
            transform: scaleX(1);
            transform-origin: left;
        }

        /* Distinctive Contact Button */
        .mdl-contact-btn {
            display: flex;
            align-items: center;
            gap: 12px;
            font-size: 11px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.15em;
            color: inherit;
            text-decoration: none;
            position: relative;
            padding: 12px 24px;
            border-radius: 40px; /* Pill shape for contrast */
            border: 1px solid rgba(249, 247, 244, 0.3);
            overflow: hidden;
            transition: border-color 0.4s ease, color 0.4s ease;
        }

        .mdl-contact-btn::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: var(--mdl-paper);
            border-radius: 40px;
            transform: scale(0);
            transition: transform 0.6s var(--ease-expo), background-color 0.4s ease;
            z-index: -1;
        }

        .mdl-contact-btn:hover {
            border-color: var(--mdl-paper);
            color: var(--mdl-ink);
        }

        .mdl-contact-btn:hover::before {
            transform: scale(1.05); /* Slight overscale to fill border */
        }
        
        /* Scrolled state overrides for contact button */
        .mdl-header-wrapper.is-scrolled .mdl-contact-btn {
            border-color: rgba(26, 26, 24, 0.2);
        }
        .mdl-header-wrapper.is-scrolled .mdl-contact-btn::before {
            background-color: var(--mdl-ink);
        }
        .mdl-header-wrapper.is-scrolled .mdl-contact-btn:hover {
            border-color: var(--mdl-ink);
            color: var(--mdl-paper);
        }

        /* Dot indicator in button */
        .mdl-contact-dot {
            width: 6px;
            height: 6px;
            background-color: var(--mdl-sand);
            border-radius: 50%;
            position: relative;
        }
        
        /* Pulsing effect for the dot */
        .mdl-contact-dot::after {
            content: '';
            position: absolute;
            top: -3px;
            left: -3px;
            width: 12px;
            height: 12px;
            border-radius: 50%;
            border: 1px solid var(--mdl-sand);
            animation: pulse-dot 2s infinite var(--ease-power);
        }

        @keyframes pulse-dot {
            0% { transform: scale(0.5); opacity: 1; }
            100% { transform: scale(2); opacity: 0; }
        }

        /* Mobile Hamburger Toggle */
        .mdl-burger-wrapper {
            display: none;
            grid-column: 3;
            justify-self: end;
            background: none;
            border: none;
            width: 48px;
            height: 48px;
            position: relative;
            cursor: pointer;
            color: inherit;
            padding: 0;
            z-index: 1002; /* Topmost element */
            outline: none;
        }

        .mdl-burger-line {
            position: absolute;
            left: 12px;
            width: 24px;
            height: 1px;
            background-color: currentColor;
            transition: transform 0.6s var(--ease-expo), background-color 0.4s ease;
        }

        .mdl-burger-line-1 { top: 20px; }
        .mdl-burger-line-2 { bottom: 20px; }

        /* Fullscreen Overlay Curtain */
        .mdl-menu-curtain {
            position: fixed;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            height: 100dvh;
            background-color: var(--mdl-ink);
            color: var(--mdl-paper);
            z-index: 1000;
            clip-path: inset(0 0 100% 0); /* Bottom-to-top reveal */
            transition: clip-path 0.8s var(--ease-expo);
            visibility: hidden;
            display: flex;
            align-items: center;
        }

        .mdl-menu-content {
            width: min(1440px, calc(100% - 64px));
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 40px;
            height: 100%;
            padding: 18vh 0 10vh;
        }

        /* Overlay Left - Large Links */
        .mdl-menu-primary-nav {
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: clamp(10px, 2vh, 20px);
        }

        .mdl-huge-link {
            font-family: "Cormorant Garamond", serif;
            font-size: clamp(48px, 8vw, 110px);
            font-weight: 400;
            line-height: 1;
            color: var(--mdl-paper);
            text-decoration: none;
            display: block;
            width: max-content;
            letter-spacing: -0.02em;
            
            /* Initial Animation State */
            transform: translateY(100%);
            opacity: 0;
            clip-path: inset(0 0 100% 0);
            transition: transform 0.8s var(--ease-expo), 
                        opacity 0.6s ease,
                        clip-path 0.8s var(--ease-expo),
                        color 0.4s ease;
        }

        .mdl-huge-link em {
            font-style: italic;
            font-weight: 300;
            color: var(--mdl-sand);
            display: inline-block;
            transition: transform 0.6s var(--ease-expo);
        }

        .mdl-huge-link:hover {
            color: var(--mdl-sand);
        }

        .mdl-huge-link:hover em {
            transform: translateX(15px);
        }

        /* Overlay Right - Secondary Links & Contact */
        .mdl-menu-secondary-info {
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            padding-bottom: 2vh;
            font-size: 12px;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            
            /* Initial Animation State */
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 0.6s ease, transform 0.8s var(--ease-expo);
        }

        .mdl-info-block {
            margin-top: 40px;
        }
        
        .mdl-info-label {
            color: rgba(249, 247, 244, 0.4);
            display: block;
            margin-bottom: 16px;
            font-size: 10px;
        }

        .mdl-info-list {
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .mdl-info-list a {
            color: var(--mdl-paper);
            text-decoration: none;
            position: relative;
            display: inline-block;
            width: max-content;
        }

        .mdl-info-list a::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0;
            width: 100%;
            height: 1px;
            background-color: var(--mdl-sand);
            transform: scaleX(0);
            transform-origin: right;
            transition: transform 0.4s var(--ease-expo);
        }

        .mdl-info-list a:hover::after {
            transform: scaleX(1);
            transform-origin: left;
        }

        /* ======================================================= */
        /* --- ACTIVE STATE TRIGGERS --- */
        /* ======================================================= */
        
        /* Change Header Colors */
        body.mdl-menu-active .mdl-header-wrapper {
            background-color: transparent !important;
            backdrop-filter: none !important;
            -webkit-backdrop-filter: none !important;
            border-color: transparent !important;
            color: var(--mdl-paper) !important;
        }
        
        body.mdl-menu-active .mdl-nav-container {
            color: var(--mdl-paper);
        }

        body.mdl-menu-active .mdl-header-wrapper .mdl-contact-btn {
            border-color: rgba(249, 247, 244, 0.3);
        }
        
        body.mdl-menu-active .mdl-header-wrapper .mdl-contact-btn::before {
            background-color: var(--mdl-paper);
        }
        
        body.mdl-menu-active .mdl-header-wrapper .mdl-contact-btn:hover {
            border-color: var(--mdl-paper);
            color: var(--mdl-ink);
        }

        /* Animate Hamburger to 'Close' */
        body.mdl-menu-active .mdl-burger-line-1 {
            transform: translateY(4.5px) rotate(45deg);
        }
        body.mdl-menu-active .mdl-burger-line-2 {
            transform: translateY(-4.5px) rotate(-45deg);
        }

        /* Reveal Curtain */
        body.mdl-menu-active .mdl-menu-curtain {
            visibility: visible;
            clip-path: inset(0 0 0 0); /* Pull curtain up */
        }

        /* Staggered Entrance Animations */
        body.mdl-menu-active .mdl-huge-link {
            transform: translateY(0);
            opacity: 1;
            clip-path: inset(0 0 -20% 0);
        }

        body.mdl-menu-active .mdl-huge-link:nth-child(1) { transition-delay: 0.3s; }
        body.mdl-menu-active .mdl-huge-link:nth-child(2) { transition-delay: 0.4s; }
        body.mdl-menu-active .mdl-huge-link:nth-child(3) { transition-delay: 0.5s; }
        body.mdl-menu-active .mdl-huge-link:nth-child(4) { transition-delay: 0.6s; }

        body.mdl-menu-active .mdl-menu-secondary-info {
            opacity: 1;
            transform: translateY(0);
            transition-delay: 0.6s;
        }

        /* ======================================================= */
        /* --- RESPONSIVENESS --- */
        /* ======================================================= */
        @media (max-width: 1024px) {
            .mdl-nav-left { gap: 24px; }
            .mdl-nav-right { gap: 24px; }
        }

        @media (max-width: 900px) {
            .mdl-header-wrapper {
                height: var(--mdl-nav-height-mobile);
            }
            .mdl-header-wrapper.is-scrolled {
                height: var(--mdl-nav-height-mobile);
            }
            .mdl-nav-container {
                grid-template-columns: 1fr auto; /* Just logo and burger */
                width: min(100% - 32px, 1140px);
            }
            
            .mdl-brand-link {
                grid-column: 1;
                justify-self: start;
            }

            .mdl-nav-left, .mdl-contact-btn {
                display: none; /* Hide standard links and CTA */
            }

            .mdl-burger-wrapper {
                display: block; /* Show hamburger */
            }

            .mdl-menu-content {
                grid-template-columns: 1fr;
                grid-template-rows: auto 1fr;
                gap: 20px;
                padding-top: 15vh;
                width: min(100% - 32px, 1140px);
            }

            .mdl-menu-secondary-info {
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: flex-start;
                gap: 40px;
                padding-bottom: 5vh;
            }

            .mdl-info-block {
                margin-top: 0;
            }
        }
        
        @media (max-width: 480px) {
            .mdl-menu-secondary-info {
                flex-direction: column;
                gap: 24px;
            }
        }
.mdl-header-wrapper,.mdl-header-wrapper *,.mdl-menu-curtain,.mdl-menu-curtain *{box-sizing:border-box}
        .mdl-header-wrapper::before{content:'';position:absolute;inset:0;z-index:-1;opacity:0;background:rgba(249,247,244,.9);box-shadow:0 12px 45px rgba(26,26,24,.045);backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%);transition:opacity .45s ease}
        .mdl-header-wrapper.is-scrolled{background:transparent}.mdl-header-wrapper.is-scrolled::before{opacity:1}
        .mdl-header-wrapper.is-on-light:not(.is-scrolled){color:var(--mdl-ink)}
        .mdl-header-wrapper.is-on-light:not(.is-scrolled) .mdl-contact-btn{border-color:rgba(26,26,24,.28)}
        .mdl-header-wrapper.is-on-light:not(.is-scrolled) .mdl-contact-btn::before{background-color:var(--mdl-ink)}
        .mdl-header-wrapper.is-on-light:not(.is-scrolled) .mdl-contact-btn:hover{border-color:var(--mdl-ink);color:var(--mdl-paper)}
        .mdl-brand-link{min-width:255px;min-height:44px}.mdl-contact-btn{min-height:44px;isolation:isolate}.mdl-contact-btn::before{z-index:-1}
        .mdl-nav-item:focus-visible,.mdl-brand-link:focus-visible,.mdl-contact-btn:focus-visible,.mdl-burger-wrapper:focus-visible,.mdl-menu-curtain a:focus-visible{outline:1px solid var(--mdl-sand);outline-offset:5px}
        .mdl-menu-curtain{align-items:flex-start;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:radial-gradient(circle at 88% 82%,rgba(184,164,138,.15),transparent 32rem),var(--mdl-ink);transition:visibility 0s linear .82s,clip-path .8s var(--ease-circ)}
        .mdl-menu-curtain::before{content:'M';position:fixed;right:-.06em;bottom:-.28em;color:rgba(249,247,244,.025);font:400 clamp(26rem,70vw,66rem)/.72 "Cormorant Garamond",serif;pointer-events:none}
        .mdl-menu-content{position:relative;min-height:100vh;min-height:100dvh;height:auto}
        .mdl-menu-primary-nav{--mdl-link-hover-shift:15px;padding-right:calc(var(--mdl-link-hover-shift) + .1em)}
        .mdl-huge-link{max-width:100%;line-height:.88;letter-spacing:-.035em}
        .mdl-huge-link:hover em{transform:translateX(var(--mdl-link-hover-shift))}
        body.mdl-menu-active .mdl-header-wrapper::before{opacity:0}body.mdl-menu-active .mdl-menu-curtain{transition-delay:0s}
        @media(max-width:1180px) and (min-width:901px){.mdl-nav-container{width:min(100% - 40px,1440px)}.mdl-nav-left,.mdl-nav-right{gap:22px}.mdl-brand-link{min-width:218px;font-size:15px}.mdl-contact-btn{padding-inline:18px}}
        @media(max-width:900px){
            :root{--mdl-nav-height-mobile:78px}
            .mdl-header-wrapper,.mdl-header-wrapper.is-scrolled{height:calc(var(--mdl-nav-height-mobile) + env(safe-area-inset-top));padding-top:env(safe-area-inset-top)}
            .mdl-nav-container{width:min(calc(100% - 40px),1140px)}.mdl-nav-left,.mdl-nav-right{display:none}
            .mdl-brand-link{min-width:0;max-width:calc(100vw - 100px);justify-content:flex-start;font-size:clamp(13px,3.5vw,16px);letter-spacing:.2em;white-space:nowrap}
            .mdl-brand-link:hover .full-text,.mdl-brand-link:focus-visible .full-text{opacity:1;transform:none}.mdl-brand-link .short-text{display:none}
            .mdl-burger-wrapper{display:block;width:48px;height:48px;border-radius:50%;-webkit-tap-highlight-color:transparent}
            .mdl-menu-content{grid-template-columns:1fr;grid-template-rows:auto auto;align-content:start;gap:clamp(46px,8vh,76px);width:min(calc(100% - 40px),1140px);padding:calc(var(--mdl-nav-height-mobile) + env(safe-area-inset-top) + clamp(46px,8vh,76px)) 0 calc(34px + env(safe-area-inset-bottom))}
            .mdl-menu-primary-nav{--mdl-link-hover-shift:8px;justify-content:flex-start;gap:clamp(2px,.5vh,7px);overflow:visible}
            .mdl-huge-link{
                width:max-content;
                max-width:calc(100% - 2px);
                padding:.06em .12em .15em .02em;
                overflow:visible;
                font-size:clamp(43px,10.8vw,72px);
                line-height:.94;
                clip-path:none;
            }
            .mdl-menu-secondary-info{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px;padding:28px 0 0;border-top:1px solid rgba(249,247,244,.18)}
            .mdl-info-list a{max-width:100%;overflow-wrap:anywhere;line-height:1.5}
        }
        @media(max-width:600px){
            .mdl-huge-link{font-size:clamp(38px,10.4vw,52px)}
        }
        @media(max-width:520px){
            .mdl-nav-container,.mdl-menu-content{width:calc(100% - 40px)}
            .mdl-huge-link{max-width:100%;padding-right:.16em;font-size:clamp(36px,10.4vw,52px);line-height:.98}
            .mdl-menu-secondary-info{grid-template-columns:1fr;gap:25px}
            .mdl-info-block{min-width:0}
        }
        @media(max-width:370px){.mdl-brand-link{font-size:12px;letter-spacing:.16em}.mdl-huge-link{font-size:39px}}
        @media(max-height:700px) and (max-width:900px){
            .mdl-menu-content{gap:36px;padding-top:calc(var(--mdl-nav-height-mobile) + env(safe-area-inset-top) + 26px)}
            .mdl-huge-link{font-size:clamp(36px,8.6vh,52px);line-height:.96}
        }
        @media(prefers-reduced-motion:reduce){.mdl-header-wrapper,.mdl-header-wrapper::before,.mdl-nav-item::after,.mdl-brand-link span,.mdl-contact-btn,.mdl-contact-btn::before,.mdl-burger-line,.mdl-menu-curtain,.mdl-huge-link,.mdl-huge-link em,.mdl-menu-secondary-info,.mdl-info-list a::after{transition-duration:.01ms!important;transition-delay:0s!important}.mdl-contact-dot::after{animation:none}}

/* Adaptive contrast: sample the surface beneath the fixed header at every scroll position. */
.mdl-header-wrapper.is-on-light { color: var(--mdl-ink); }
.mdl-header-wrapper.is-on-dark { color: var(--mdl-paper); }
.mdl-header-wrapper.is-scrolled::before { background: rgba(26, 26, 24, .72); }
.mdl-header-wrapper.is-scrolled.is-on-light::before { background: rgba(249, 247, 244, .88); }
.mdl-header-wrapper.is-scrolled.is-on-dark::before { background: rgba(26, 26, 24, .72); }
.mdl-header-wrapper.is-on-light .mdl-contact-btn { border-color: rgba(26, 26, 24, .28); }
.mdl-header-wrapper.is-on-light .mdl-contact-btn::before { background-color: var(--mdl-ink); }
.mdl-header-wrapper.is-on-light .mdl-contact-btn:hover { border-color: var(--mdl-ink); color: var(--mdl-paper); }
.mdl-header-wrapper.is-on-dark .mdl-contact-btn { border-color: rgba(249, 247, 244, .32); }
.mdl-header-wrapper.is-on-dark .mdl-contact-btn::before { background-color: var(--mdl-paper); }
.mdl-header-wrapper.is-on-dark .mdl-contact-btn:hover { border-color: var(--mdl-paper); color: var(--mdl-ink); }
body.mdl-menu-active .mdl-header-wrapper { color: var(--mdl-paper); }
