/* =============================================================
   style.css
   1. Mobile menu  (.mobilemenu-wrapper / .mobile-menu-*)
   2. Desktop menu (.dm-wrap / .dm-*)
   ============================================================= */


/* ─────────────────────────────────────────────────────────────
   1. MOBILE MENU  (unchanged)
   ───────────────────────────────────────────────────────────── */

*, *::before, *::after { box-sizing: border-box; }

.mobilemenu-wrapper { width: 100%; box-sizing: border-box; font-family: inherit; }

.mobile-menu-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    align-items: start;
    margin: 0;
    padding: 0;
}

.mobile-menu-item { position: relative; list-style: none; }

.mobile-menu-tile {
    display: block;
    width: 100%;
    padding: 70px 12px 20px;
    border-radius: 10px;
    background-color: #f6f6f6;
    background-size: cover;
    background-position: center;
    position: relative;
    text-align: left;
    cursor: pointer;
    border: none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    transition: transform 140ms ease, box-shadow 140ms ease;
    -webkit-user-select: none;
    user-select: none;
    outline: none;
    z-index: 10;
}

.mobile-menu-title {
    position: absolute;
    left: 10px; right: 10px; bottom: 10px;
    padding: 12px;
    background: linear-gradient(transparent, rgba(0,0,0,0.6));
    color: #fff;
    font-weight: 700;
    border-radius: 8px;
    font-size: 14px;
    pointer-events: none;
}

.mobile-menu-tile:hover,
.mobile-menu-tile:focus {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(0,0,0,0.10);
}

.mobile-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 320ms ease, padding 320ms ease;
    background: #ffffff;
    margin-top: 8px;
    border-radius: 10px;
    border: none;
    padding-left: 12px;
    padding-right: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.mobile-menu-item.open .mobile-submenu {
    padding-top: 14px;
    padding-bottom: 14px;
}

.mobile-submenu a.mobile-submenu-link {
    display: block;
    padding: 14px 8px;
    font-size: 15px;
    color: #333;
    text-decoration: none;
    border-bottom: none;
    background: transparent;
}

.mobile-submenu a.mobile-submenu-seeall {
    display: block;
    width: 100%;
    margin-top: 10px;
    padding: 12px 8px;
    font-weight: 700;
    color: #e60023;
    text-decoration: none;
    background: rgba(230,0,35,0.03);
    border-radius: 8px;
}

.mobile-submenu-empty-msg { padding: 12px 8px; color: #666; }

.mobile-menu-item.open .mobile-menu-tile {
    transform: translateY(-2px) scale(1.01);
    box-shadow: 0 8px 22px rgba(0,0,0,0.12);
}

@media (max-width: 480px) {
    .mobile-menu-grid { grid-template-columns: 1fr; }
    .mobile-menu-tile { padding: 56px 12px 16px; }
}



