/* ── mmenu brand overrides (off-canvas, right, white theme) ── */

/* Hide raw nav until mmenu initialises — never `#mobile-menu { display:none }` (breaks .mm-menu) */
#mobile-menu:not(.mm-menu) { display: none !important; }

.mm-menu {
    --mm-color-background: var(--skin-canvas);
    --mm-color-text: var(--skin-black);
    --mm-color-text-dimmed: rgba(0, 0, 0, .5);
    --mm-color-border: rgba(0, 0, 0, .12);
    --mm-color-icon: var(--skin-coral);
    --mm-color-background-highlight: rgba(255, 115, 118, .08);
    --mm-color-background-emphasis: rgba(255, 115, 118, .12);
    --mm-color-focusring: var(--skin-coral);
    font-family: var(--font-body);
}
.mm-menu .mm-navbar {
    background: var(--skin-header);
    color: var(--skin-white);
    text-transform: lowercase;
    border-bottom: 0;
}
.mm-menu .mm-navbar__title { color: var(--skin-white); }
.mm-menu .mm-listitem__text {
    padding-top: 16px;
    padding-bottom: 16px;
    font-size: 20px;
    text-transform: lowercase;
}
.mm-menu .mm-listitem__text:hover { color: var(--skin-coral); }

.mm-menu .mm-listitem--social { padding: 18px 20px; }
.mm-menu .mm-listitem--social::after { display: none; }
.mm-mobile-social { display: flex; gap: 10px; }
.mm-mobile-social a {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1.5px solid var(--skin-black);
    border-radius: 50%;
    color: var(--skin-black);
    transition: color .2s, border-color .2s;
}
.mm-mobile-social a:hover { color: var(--skin-coral); border-color: var(--skin-coral); }
.mm-mobile-social i { font-size: 15px; letter-spacing: 0; }