.menu-button {
        width: 46px;
        min-width: 46px;
        padding: 0;
        justify-content: center;
}

.menu-button-icon {
        position: relative;
        display: block;
        width: 23px;
        height: 16px;
}

.menu-button-icon span {
        position: absolute;
        left: 0;
        display: block;
        width: 100%;
        height: 2px;
        border-radius: 999px;
        background: currentColor;
        transition: top 220ms ease, transform 220ms ease, opacity 160ms ease;
}

.menu-button-icon span:nth-child(1) {
        top: 0;
}

.menu-button-icon span:nth-child(2) {
        top: 7px;
}

.menu-button-icon span:nth-child(3) {
        top: 14px;
}

.menu-button[aria-expanded="true"] .menu-button-icon span:nth-child(1) {
        top: 7px;
        transform: rotate(45deg);
}

.menu-button[aria-expanded="true"] .menu-button-icon span:nth-child(2) {
        opacity: 0;
}

.menu-button[aria-expanded="true"] .menu-button-icon span:nth-child(3) {
        top: 7px;
        transform: rotate(-45deg);
}

.mobile-menu-socials,
.mobile-menu-backdrop {
        display: none;
}

.mobile-menu-header,
.mobile-menu-social-footer,
.mobile-menu-item-icon,
.mobile-menu-item-chevron {
        display: none;
}

.mobile-menu-list {
        display: contents;
}

@media (max-width: 1180px) {
        .site-nav .nav-links {
                position: fixed;
                top: 0;
                right: 0;
                bottom: auto;
                left: auto;
                z-index: 61;
                display: flex !important;
                width: 90vw;
                height: 100vh;
                height: 100dvh;
                max-height: none;
                margin: 0;
                padding: calc(48px + env(safe-area-inset-top)) 26px calc(24px + env(safe-area-inset-bottom));
                border: 0;
                border-radius: 0;
                background: rgba(251, 248, 241, 0.98);
                box-shadow: -18px 0 46px rgba(0, 0, 0, 0.18);
                overflow-x: hidden;
                overflow-y: auto;
                visibility: hidden;
                opacity: 0;
                pointer-events: none;
                transform: translateX(100%);
                transition: transform 280ms ease, opacity 220ms ease, visibility 280ms;
                -webkit-overflow-scrolling: touch;
                overscroll-behavior: contain;
        }

        .site-nav .nav-links.open {
                visibility: visible;
                opacity: 1;
                pointer-events: auto;
                transform: translateX(0);
        }

        .site-nav .nav-links>a {
                flex: 0 0 auto;
                justify-content: flex-start;

                padding: 0px;
                border-bottom: 1px solid rgba(17, 17, 17, 0.1);
                color: rgba(17, 17, 17, 0.82);
                font-size: 15px;
                letter-spacing: 0.08em;
                text-align: left;
        }

        .site-nav .nav-links>a.active {
                color: var(--gold);
        }

        .site-nav .menu-button {
                position: relative;
                z-index: 62;
                width: 46px;
                min-width: 46px;
                padding: 0;
                background: unset;
                border: unset;
        }

        body.mobile-menu-open {
                position: fixed;
                right: 0;
                left: 0;
                width: 100%;
                overflow: hidden;
        }

        body.mobile-menu-open .site-nav,
        body.mobile-menu-open .site-nav.scrolled {
                top: 0;
                right: 0;
                left: 0;
                z-index: 60;
                width: 100%;
                max-width: none;
                border-color: transparent;
                background: transparent;
                -webkit-backdrop-filter: none;
                backdrop-filter: none;
                box-shadow: none;
                transform: none;
                pointer-events: none;
        }

        body.mobile-menu-open .site-nav .logo {
                opacity: 0;
                pointer-events: none;
        }

        body.mobile-menu-open .site-nav .menu-button,
        body.mobile-menu-open .site-nav .nav-links {
                pointer-events: auto;
        }

        .mobile-menu-backdrop {
                position: fixed;
                inset: 0;
                z-index: 55;
                display: block;
                background: rgba(0, 0, 0, 0.62);
                visibility: hidden;
                opacity: 0;
                pointer-events: none;
                transition: opacity 220ms ease, visibility 220ms;
        }

        .mobile-menu-backdrop.is-open {
                visibility: visible;
                opacity: 1;
                pointer-events: auto;
        }

        .mobile-menu-socials {
                display: flex;
                flex-wrap: wrap;
                gap: 10px;
                margin-top: auto;
                padding-top: 28px;
        }

        .site-nav .nav-links .mobile-menu-socials a {
                display: grid;
                flex: 0 0 38px;
                width: 38px;
                min-height: 38px;
                height: 38px;
                padding: 0;
                place-items: center;
                border: 1px solid rgba(17, 17, 17, 0.2);
                border-radius: 50%;
                color: var(--ink);
        }

        .mobile-menu-socials svg {
                width: 16px;
                height: 16px;
                fill: currentColor;
        }

        @media (prefers-reduced-motion: reduce) {

                .site-nav .nav-links,
                .mobile-menu-backdrop,
                .menu-button-icon span {
                        transition: none;
                }
        }

        .site-nav .nav-links {
                width: min(89vw, 520px);
                padding: 0;
                background:
                        radial-gradient(circle at 26% 12%, rgba(255, 255, 255, 0.82), transparent 34%),
                        var(--ivory);
                box-shadow: -18px 0 46px rgba(0, 0, 0, 0.2);
        }

        .site-nav .nav-links.open {
                display: flex !important;
                flex-direction: column;
                align-items: stretch;
                justify-content: flex-start;
        }

        .mobile-menu-header {
                position: relative;
                display: flex;
                flex: 0 0 auto;
                align-items: flex-start;
                min-height: clamp(132px, 18dvh, 158px);
                padding: calc(28px + env(safe-area-inset-top)) clamp(24px, 8vw, 42px) 20px;
        }

        .site-nav .nav-links .mobile-menu-logo {
                position: absolute;
                top: calc(35.5px + env(safe-area-inset-top));
                left: clamp(24px, 8vw, 42px);
                display: block;
                width: clamp(118px, 34vw, 148px);
                min-height: 0;
                padding: 0;
                color: var(--ink);
                text-align: left;
                transform: translateY(-50%);
        }

        .site-nav .nav-links .mobile-menu-logo img {
                display: block;
                width: 50%;
                height: auto;
        }

        .mobile-menu-list {
                display: flex;
                flex: 0 0 auto;
                flex-direction: column;
                padding: 0 clamp(24px, 7vw, 38px);
        }

        .site-nav .nav-links .mobile-menu-list>a {
                display: grid;
                grid-template-columns: clamp(38px, 11vw, 52px) minmax(0, 1fr) 14px;
                flex: 0 0 auto;
                align-items: center;
                min-height: clamp(70px, 9.4dvh, 82px);
                gap: clamp(12px, 4vw, 22px);
                padding: 0;
                border-bottom: 1px solid rgba(17, 17, 17, 0.1);
                color: rgba(17, 17, 17, 0.9);
                font-size: clamp(12px, 3.7vw, 16px);
                font-weight: 800;
                letter-spacing: 0.13em;
                line-height: 1.22;
                text-align: left;
        }

        .site-nav .nav-links .mobile-menu-list>a:last-child {
                border-bottom: 0;
        }

        .site-nav .nav-links a::after {
                display: none;
        }

        .site-nav .nav-links .mobile-menu-list>a.active,
        .site-nav .nav-links .mobile-menu-list>a:hover,
        .site-nav .nav-links .mobile-menu-list>a:focus-visible {
                color: var(--gold);
        }

        .site-nav .nav-links .mobile-menu-list>a.active::before {
                position: absolute;
                top: 12%;
                bottom: 12%;
                left: calc(-1 * clamp(24px, 7vw, 38px));
                width: clamp(4px, 1.2vw, 6px);
                background: var(--gold);
                content: "";
        }

        .mobile-menu-item-icon,
        .mobile-menu-item-chevron {
                display: grid;
                place-items: center;
        }

        .mobile-menu-item-icon svg {
                width: clamp(25px, 7vw, 31px);
                height: clamp(25px, 7vw, 31px);
                fill: none;
                stroke: currentColor;
                stroke-linecap: round;
                stroke-linejoin: round;
                stroke-width: 1.55;
        }

        .mobile-menu-item-image {
                width: auto;

                height: 30px;
                object-fit: contain;
        }

        .mobile-menu-item-chevron {
                justify-self: end;
        }

        .mobile-menu-item-chevron svg {
                width: 10px;
                height: 18px;
                fill: none;
                stroke: currentColor;
                stroke-linecap: round;
                stroke-linejoin: round;
                stroke-width: 1.6;
        }

        .mobile-menu-item-label {
                min-width: 0;
        }

        .site-nav .menu-button[aria-expanded="true"] {
                position: fixed;
                top: calc(18px + env(safe-area-inset-top));
                right: clamp(20px, 6vw, 38px);
                z-index: 63;
                width: 35px;
                min-width: 35px;
                min-height: 35px;
                border: 1px solid var(--gold);
                border-radius: 50%;
                background: var(--ivory);
                color: var(--gold);
        }

        .site-nav .menu-button[aria-expanded="true"] .menu-button-icon {
                width: 21px;
                height: 16px;
        }

        .mobile-menu-social-footer {
                display: block;
                flex: 0 0 auto;
                margin-top: auto;
                padding: clamp(24px, 4dvh, 36px) clamp(18px, 5vw, 30px) calc(24px + env(safe-area-inset-bottom));
        }

        .mobile-menu-social-heading {
                display: grid;
                grid-template-columns: minmax(24px, 1fr) auto minmax(24px, 1fr);
                align-items: center;
                gap: 14px;
                margin-bottom: 22px;
                color: var(--gold);
                font-size: 11px;
                font-weight: 600;
                letter-spacing: 0.38em;
                text-transform: uppercase;
        }

        .mobile-menu-social-heading::before,
        .mobile-menu-social-heading::after {
                height: 1px;
                background: var(--gold);
                content: "";
        }

        .mobile-menu-social-heading span {
                position: relative;
                padding-left: 0.38em;
                white-space: nowrap;
        }

        .mobile-menu-socials {
                display: grid;
                grid-template-columns: repeat(7, minmax(0, 1fr));
                align-items: center;
                justify-items: center;
                gap: 4px;
                margin: 0;
                padding: 0;
        }

        .site-nav .nav-links .mobile-menu-socials a {
                display: grid;
                width: clamp(34px, 9vw, 40px);
                min-width: 0;
                height: clamp(34px, 9vw, 40px);
                min-height: 0;
                padding: 0;
                place-items: center;
                border: 1px solid rgba(232, 173, 0, 0.58);
                border-radius: 50%;
                color: var(--ink);
                opacity: 0;
                transform: translateY(10px);
        }

        .site-nav .nav-links .mobile-menu-socials a:hover,
        .site-nav .nav-links .mobile-menu-socials a:focus-visible {
                border-color: var(--gold);
                color: var(--gold);
        }

        .mobile-menu-socials svg {
                width: clamp(14px, 4vw, 17px);
                height: clamp(14px, 4vw, 17px);
                fill: currentColor;
        }

        .mobile-menu-social-footer.socials-ready .mobile-menu-socials a {
                animation: mobileMenuSocialReveal 320ms ease-out forwards;
                animation-delay: calc(var(--social-index) * 60ms);
        }

        @keyframes mobileMenuSocialReveal {
                to {
                        opacity: 1;
                        transform: translateY(0);
                }
        }
}

@media (max-width: 1180px) and (max-height: 720px) {
        .mobile-menu-header {
                min-height: 90px;
                padding-top: calc(10px + env(safe-area-inset-top));
        }

        .site-nav .nav-links .mobile-menu-list>a {
                min-height: 54px;
        }

        .mobile-menu-social-footer {
                margin-top: auto;
                padding-top: 22px;
        }
}

@media (max-width: 1180px) and (prefers-reduced-motion: reduce) {

        .site-nav .nav-links .mobile-menu-socials a,
        .mobile-menu-social-footer.socials-ready .mobile-menu-socials a {
                animation: none;
                opacity: 1;
                transform: none;
        }
}

@media (max-width: 760px) {

        .site-nav,
        .site-nav.scrolled {
                top: 0;
                right: 0;
                left: 0;
                width: 100%;
                max-width: none;
                min-height: calc(68px + env(safe-area-inset-top));
                padding: calc(8px + env(safe-area-inset-top)) 14px 8px;
                border: 0;
                border-bottom: 1px solid rgba(255, 255, 255, 0.48);
                border-radius: 0;
                background: rgba(251, 248, 241, 0.72);
                -webkit-backdrop-filter: blur(22px) saturate(160%);
                backdrop-filter: blur(22px) saturate(160%);
                box-shadow: 0 8px 26px rgba(0, 0, 0, 0.1);
                transform: none;
        }

        .site-nav .nav-links {
                margin-top: 0;
                gap: 0px;
        }

        .mobile-menu-socials {
                /* grid-template-columns: repeat(4, 42px); */
                justify-content: center;
                gap: 10px 14px;
        }

        .site-nav .nav-links .mobile-menu-socials a {
                width: 42px;
                height: 42px;
        }
}