/* The approved floating glass menu with the full slide from above. */
.beauty-menu,
.beauty-menu-toggle,
.beauty-menu-fallback { display: none; }
.beauty-menu[hidden],
.beauty-menu-toggle[hidden] { display: none !important; }

@media (max-width: 68rem) {
    .beauty-menu-toggle {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: .375rem;
        width: 3.2rem;
        height: 3.2rem;
        padding: 0;
        color: var(--heading-color);
        cursor: pointer;
        pointer-events: auto;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }
    .beauty-menu-toggle__line {
        display: block;
        width: 1.3rem;
        height: 1.5px;
        border-radius: 2px;
        background: currentColor;
        transform-origin: center;
    }
    .beauty-menu-toggle__line:last-child { width: 1rem; margin-left: .3rem; }
    .beauty-menu-toggle:active { transform: scale(.96); }

    .beauty-menu {
        position: fixed;
        z-index: 9990;
        inset: 0;
        display: block;
        pointer-events: none;
        overflow: hidden;
        --menu-ink: #fffaf6;
        --menu-muted: #f3e9dd;
        --menu-gold: #f0dcc0;
        --menu-fill: rgba(35, 29, 24, .25);
    }
    .beauty-menu__scrim {
        position: absolute;
        inset: 0;
        background: rgba(16, 11, 7, .5);
        opacity: 0;
        pointer-events: auto;
    }
    .beauty-menu__surface {
        position: absolute;
        top: max(5.05rem, calc(env(safe-area-inset-top) + 4.35rem));
        right: 1.05rem;
        bottom: max(1rem, env(safe-area-inset-bottom));
        width: calc(100% - 2.1rem);
        max-width: 26rem;
        max-height: 48rem;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid rgba(255, 249, 237, .46);
        border-radius: 2.2rem;
        background:
            linear-gradient(145deg, rgba(255, 249, 237, .16), rgba(255, 249, 237, .03) 42%, rgba(212, 195, 170, .08)),
            var(--menu-fill);
        color: var(--menu-ink);
        box-shadow:
            0 28px 60px rgba(9, 7, 5, .27), 0 3px 10px rgba(9, 7, 5, .15),
            inset 0 1px 1px rgba(255, 255, 255, .72),
            inset 1px 0 1px rgba(255, 255, 255, .32),
            inset -1px -1px 1px rgba(255, 255, 255, .14);
        -webkit-backdrop-filter: blur(21px) saturate(175%) brightness(1.13);
        backdrop-filter: blur(21px) saturate(175%) brightness(1.13);
        text-shadow: 0 1px 3px rgba(17, 12, 8, .35);
        transform: translate3d(0, calc(-100% - 6.25rem), 0);
        transform-origin: 50% 0;
        opacity: 0;
        pointer-events: auto;
        overscroll-behavior: contain;
    }
    .beauty-menu__surface::before,
    .beauty-menu__surface::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        pointer-events: none;
    }
    .beauty-menu__surface::before {
        background: radial-gradient(ellipse at 3% 1%, rgba(255, 255, 255, .26), transparent 48%),
            linear-gradient(155deg, transparent 54%, rgba(255, 249, 237, .05));
    }
    .beauty-menu__surface::after {
        inset: -10% -45%;
        background: linear-gradient(115deg, transparent 43%, rgba(255, 255, 255, .16) 49%, transparent 55%);
        opacity: var(--menu-shine, 0);
        transform: translate3d(var(--menu-shift, -35%), 0, 0);
    }
    .beauty-menu__head,
    .beauty-menu__intro,
    .beauty-menu__navigation,
    .beauty-menu__foot { position: relative; z-index: 1; }
    .beauty-menu__head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex: none;
        padding: 1rem 1.25rem .45rem;
    }
    .beauty-menu__head > img { width: 5.7rem; height: 2.9rem; object-fit: contain; }
    .beauty-menu__close {
        display: grid;
        place-items: center;
        width: 2.75rem;
        height: 2.75rem;
        padding: 0;
        flex: none;
        border: 1px solid rgba(255, 255, 255, .28);
        border-radius: 50%;
        background: rgba(22, 17, 13, .14);
        color: inherit;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22);
        cursor: pointer;
    }
    .beauty-menu__icon {
        display: block;
        width: 1.35rem;
        height: 1.35rem;
        flex: none;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.65;
        stroke-linecap: round;
        stroke-linejoin: round;
    }
    .beauty-menu__intro { flex: none; padding: .4rem 1.45rem 1.1rem; }
    .beauty-menu__overline {
        margin: 0 0 .55rem;
        color: #f1dfc8;
        font-size: .5rem;
        font-weight: 600;
        line-height: 1.4;
        letter-spacing: .17em;
        text-transform: uppercase;
    }
    .beauty-menu__title {
        margin: 0;
        color: inherit;
        font-size: 1.65rem;
        font-weight: 550;
        line-height: 1.1;
        letter-spacing: -.035em;
    }
    .beauty-menu__navigation {
        flex: 1;
        min-height: 0;
        overflow: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        padding: 0 1.2rem .75rem;
    }
    .beauty-menu__grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: .55rem;
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .beauty-menu__home { grid-column: 1 / -1; }
    .beauty-menu__tile {
        min-width: 0;
        border: 1px solid rgba(255, 255, 255, .2);
        border-radius: 1.35rem;
        background: rgba(21, 17, 13, .15);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
        overflow: hidden;
    }
    .beauty-menu__link {
        display: flex;
        min-height: 4.8rem;
        padding: .875rem;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: .65rem;
        color: inherit;
        font-size: .81rem;
        font-weight: 650;
        line-height: 1.3;
        text-decoration: none;
    }
    .beauty-menu__link > .beauty-menu__icon { color: var(--menu-gold); }
    .beauty-menu__link[aria-current] { color: #fff2d8; }
    .beauty-menu__home > .beauty-menu__link {
        min-height: 2.75rem;
        padding: .4rem .55rem;
        flex-direction: row;
        align-items: center;
        font-size: .875rem;
    }
    .beauty-menu__link:active { background: rgba(255, 255, 255, .1); }
    .beauty-menu__foot { flex: none; padding: .95rem 1.2rem 1.2rem; }
    .beauty-menu__foot::before {
        content: "";
        position: absolute;
        top: 0;
        left: 1.2rem;
        right: 1.2rem;
        height: 1px;
        background: rgba(255, 255, 255, .2);
    }
    .beauty-menu__contact-label {
        margin: 0 0 .65rem;
        color: var(--menu-muted);
        font-size: .625rem;
        line-height: 1.4;
    }
    .beauty-menu__contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
    .beauty-menu__contact {
        display: flex;
        min-height: 3.25rem;
        align-items: center;
        justify-content: center;
        gap: .55rem;
        padding: .65rem .4rem;
        border: 1px solid rgba(255, 255, 255, .3);
        border-radius: 1.2rem;
        background: rgba(22, 17, 13, .17);
        color: inherit;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2);
        font-size: .75rem;
        font-weight: 650;
        text-decoration: none;
    }
    .beauty-menu__contact > .beauty-menu__icon { width: 1.2rem; height: 1.2rem; }
    .beauty-menu__contact--whatsapp {
        border-color: rgba(197, 226, 189, .35);
        background: linear-gradient(150deg, rgba(174, 204, 164, .14), rgba(113, 154, 114, .1)), rgba(22, 17, 13, .17);
        color: #edf5e9;
    }
    .beauty-menu__contact--whatsapp > .beauty-menu__icon { color: #d7e9d0; }
    .beauty-menu__book {
        display: flex;
        min-height: 3.3rem;
        align-items: center;
        justify-content: space-between;
        gap: .75rem;
        margin-top: .75rem;
        padding: .8rem 1.3rem;
        border: 0;
        border-radius: 999px;
        background: linear-gradient(165deg, #eed5a4, #ddbb7b);
        color: #352419;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .66), 0 5px 12px rgba(15, 10, 6, .12);
        text-shadow: none;
        font-size: .81rem;
        font-weight: 700;
        text-decoration: none;
    }
    .beauty-menu :is(a, button) { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
    .beauty-menu :is(a, button):focus-visible,
    .beauty-menu-toggle:focus-visible { outline: 2px solid #e1bd7b; outline-offset: 4px; }
    .beauty-menu :is(button, .beauty-menu__contact, .beauty-menu__book):active { scale: .97; }
    body.beauty-menu-open .site-header::before { opacity: 0; }
    body.beauty-menu-open .site-header__mobile :is(.button--mobile-book, .beauty-menu-toggle) { opacity: 0; pointer-events: none; }
    body.beauty-menu-open iframe[src*="widget.salonized.com/button"] { visibility: hidden !important; pointer-events: none !important; }
    .beauty-menu-fallback {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: .5rem;
        margin: 5rem .75rem 1rem;
        padding: 1rem;
        border-radius: 1.5rem;
        background: var(--surface-solid);
    }
    .beauty-menu-fallback > a { min-height: 2.75rem; padding: .7rem; }
}

@media (max-width: 68rem) and (max-height: 800px) {
    .beauty-menu__head { padding-top: .7rem; padding-bottom: .2rem; }
    .beauty-menu__head > img { height: 2.5rem; }
    .beauty-menu__intro { padding-top: .45rem; padding-bottom: .9rem; }
    .beauty-menu__overline { margin-bottom: .3rem; }
    .beauty-menu__title { font-size: 1.55rem; }
    .beauty-menu__link { min-height: 4.1rem; padding: .75rem .8rem; gap: .55rem; }
    .beauty-menu__foot { padding-top: .8rem; padding-bottom: 1rem; }
}
@media (max-width: 68rem) and (max-height: 650px) {
    .beauty-menu__surface { top: max(4.75rem, calc(env(safe-area-inset-top) + 4rem)); bottom: max(.7rem, env(safe-area-inset-bottom)); }
    .beauty-menu__head { padding-top: .5rem; }
    .beauty-menu__intro { padding-top: .2rem; padding-bottom: .65rem; }
    .beauty-menu__title { font-size: 1.45rem; }
    .beauty-menu__link { min-height: 3.75rem; padding: .6rem .75rem; }
    .beauty-menu__foot { padding-top: .7rem; padding-bottom: .8rem; }
    .beauty-menu__contact-label { margin-bottom: .55rem; }
    .beauty-menu__contact { min-height: 3rem; }
    .beauty-menu__book { min-height: 3rem; margin-top: .6rem; }
}
@media (max-width: 68rem) and (max-height: 400px) {
    .beauty-menu__surface { top: max(.5rem, env(safe-area-inset-top)); bottom: max(.5rem, env(safe-area-inset-bottom)); border-radius: 1.5rem; }
    .beauty-menu__intro { position: absolute; width: 1px; height: 1px; padding: 0; clip-path: inset(50%); overflow: hidden; }
    .beauty-menu__contact-label { display: none; }
    .beauty-menu__contact { min-height: 2.75rem; }
    .beauty-menu__book { min-height: 2.75rem; }
}
@media (max-width: 68rem) and (prefers-color-scheme: light) {
    .beauty-menu { --menu-ink: #332117; --menu-muted: #584330; --menu-gold: #765434; --menu-fill: rgba(255, 250, 246, .64); }
    .beauty-menu__surface { text-shadow: none; }
    .beauty-menu__head > img { filter: brightness(0); opacity: .8; }
    .beauty-menu__overline { color: #775938; }
    .beauty-menu__link[aria-current] { color: #684525; }
    .beauty-menu__tile, .beauty-menu__close, .beauty-menu__contact { background: rgba(255, 255, 255, .15); border-color: rgba(84, 63, 43, .18); }
    .beauty-menu__contact--whatsapp { background: linear-gradient(150deg, rgba(161, 194, 148, .22), rgba(113, 154, 114, .12)); color: #344a32; border-color: rgba(94, 130, 84, .23); }
    .beauty-menu__contact--whatsapp > .beauty-menu__icon { color: #4d7145; }
    .beauty-menu__foot::before { background: rgba(84, 63, 43, .15); }
}
@media (max-width: 68rem) and (prefers-reduced-transparency: reduce), (max-width: 68rem) and (prefers-contrast: more) {
    .beauty-menu__surface { background: #342a23; color: #fffaf6; -webkit-backdrop-filter: none; backdrop-filter: none; }
    .beauty-menu__surface::before, .beauty-menu__surface::after { display: none; }
    .beauty-menu { --menu-muted: #fffaf6; --menu-gold: #f0dcc0; }
    .beauty-menu__overline, .beauty-menu__link[aria-current] { color: #fff2d8; }
    .beauty-menu__head > img { filter: none; opacity: 1; }
    .beauty-menu__contact--whatsapp { color: #edf5e9; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .beauty-menu__surface { background: #342a23; color: #fffaf6; }
    .beauty-menu { --menu-muted: #fffaf6; --menu-gold: #f0dcc0; }
    .beauty-menu__head > img { filter: none; opacity: 1; }
    .beauty-menu__overline, .beauty-menu__link[aria-current], .beauty-menu__contact--whatsapp { color: #fff2d8; }
}