#skmmMobile.skmm-m {
    position: fixed;
    inset: 0;
    background: #fff;
    z-index: 99999;
    overflow: hidden;
}

#skmmMobile .skmm-m__promo {
    .skmm-m__promoImg {
        img {
            width: 100%;
            height: auto;
            border-radius: 14px;
        }
    }

    .skmm-m__promoContent {
        padding-top: 16px;
    }
}

#skmmMobile .skmm-m__screen {
    position: absolute;
    inset: 0;
    background: #fff;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

#skmmMobile .skmm-m__sectionTitle {
    padding: 0 16px;
    gap: 4px;
    opacity: .75;
    margin-top: 10px;
}

#skmmMobile .skmm-m__item--card {
    flex-direction: column;
    align-items: flex-start;

    .skmm-m__itemTitle {

    }
}

#skmmMobile .skmm-m__itemDesc, .skmm-m__promoText {
    opacity: .75;
    font-size: 12px;
    margin-bottom: 5px;
}

#skmmMobile .skmm-m__promoContent .skmm-m__promoText {
    margin-top: 5px;
    margin-bottom: 10px;
}

#skmmMobile .skmm-m__promo {
    padding: 16px;
}

#skmmMobile .skmm-m__top {
    background: var(--sk-primaryColor, #003566);
    height: 130px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, .08);
    justify-content: space-between;
}

#skmmMobile .skmm-m__x,
#skmmMobile .skmm-m__back {
    border: 0;
    background: transparent;
    font-size: 22px;
    cursor: pointer;
}

#skmmMobile .skmm-m__title {
    font-weight: 700;
    font-size: 16px;
}

#skmmMobile .skmm-m__list {
    display: flex;
    flex-direction: column;
    padding-top: 20px;
}

#skmmMobile .skmm-m__item {
    padding: 16px;
    display: flex;
    @media (min-width: 1024px) {
        align-items: center;
    }
    justify-content: space-between;
    text-decoration: none;
    color: inherit;
    border: 0;
    background: transparent;
    cursor: pointer;
    font-size: 16px;
}

#skmmMobile .skmm-m__item + .skmm-m__item {
    border-top: 1px solid rgba(0, 0, 0, .06);
}

#skmmMobile {
    position: fixed;
    inset: 0;
    background: #fff;
    z-index: 99999;
    overflow: hidden;
    transform: translateX(100%);
    pointer-events: none;
}

#skmmMobile.is-open {
    pointer-events: auto;
}

#skmmMobile .skmm-m__screen {
    position: absolute;
    inset: 0;
    background: #fff;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    will-change: transform;
}

/* =========================
   SKMM MOBILE (overlay)
   ========================= */
#skmmMobile {
    position: fixed;
    inset: 0;
    background: #fff;
    z-index: 99999;
    overflow: hidden;
    transform: translateX(100%);
    pointer-events: none;
    will-change: transform;
}

#skmmMobile.is-open {
    pointer-events: auto
}

#skmmMobile .skmm-m__screen {
    position: absolute;
    inset: 0;
    background: #fff;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    will-change: transform;
}

#skmmMobile .skmm-m__x,
#skmmMobile .skmm-m__back {
    border: 0;
    background: transparent;
    font-size: 22px;
    cursor: pointer;
}

#skmmMobile .skmm-m__title {
    font-weight: 700;
    font-size: 16px
}

#skmmMobile .skmm-m__item + .skmm-m__item {
    border-top: 1px solid rgba(0, 0, 0, .06)
}


/* =========================
   SKMM DESKTOP PANEL (viewport anchored)
   ========================= */
@media (min-width: 1024px) {
    .sk-has-megamenu > .sk-mm-panel {
        position: fixed;
        top: var(--skmm-panel-top, 96px);

        width: min(1120px, calc(100vw - 40px));
        max-height: calc(100vh - var(--skmm-panel-top, 96px) - 24px);
        overflow: auto;

        display: grid;
        grid-template-columns: 280px 1fr 360px;

        opacity: 0;
        visibility: hidden;
        transform: translateY(8px);
        pointer-events: none;
        transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
    }

    .sk-has-megamenu.sk-mm-open > .sk-mm-panel {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        pointer-events: auto;
    }
}


/* =========================
   SKMM PANEL BASE (shared)
   ========================= */
.sk-has-megamenu {
    position: relative
}

.sk-mm-panel {
    width: min(1120px, calc(100vw - 40px));
    display: grid;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 18px 60px rgba(0, 0, 0, .22);
    z-index: 9999;
    grid-template-columns:280px 1fr 360px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
    overflow: hidden;
}

.sk-has-megamenu.sk-mm-open > .sk-mm-panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
    transition: opacity .2s ease, transform .2s ease, visibility 0s;
}


/* =========================
   SKMM PANEL CONTENT
   ========================= */
.sk-mm-col {
    padding: 22px
}

.sk-mm-coltitle {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .08em;
    opacity: .75;
    margin-bottom: 14px;
    color: var(--sk-dark);
    text-transform: uppercase;
}

.sk-mm-left .sk-mm-coltitle {
    opacity: .85;
    color: #fff
}

.sk-mm-list {
    list-style: none;
    margin: 0;
    padding: 0
}

.sk-mm-list li {
    margin: 10px 0
}

.sk-mm-list a {
    color: #fff;
    text-decoration: none;
    font-weight: 400;
    font-size: 14px;
    gap: 14px;
    display: flex;
    flex-direction: row;
    align-items: center;
    transition: all .3s ease;
}

.sk-mm-list a:hover {
    gap: 20px
}

.sk-mm-middle {
    background: #fff
}

.sk-mm-card__icon {
    max-width: 30px;
    margin-bottom: 5px;
}

.sk-mm-grid {
    display: grid;
    grid-template-columns:1fr 1fr;
    gap: 18px;
    margin-top: 10px;
}

.sk-mm-card {
    text-decoration: none;
    color: inherit;
    padding: 12px;
    border-radius: 14px;
    display: block;
    transition: all .3s ease;
}

.sk-mm-card:hover {
    background: var(--sk-primary-50)
}

.sk-mm-ic {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: var(--sk-primary-200);
    margin-bottom: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sk-mm-cardtitle, .sk-mm-middle-cardtitle {
    font-weight: 900;
    margin-bottom: 5px;
    line-height: 1.25;
}

.sk-mm-carddesc, .sk-mm-middle-carddesc {
    opacity: .75;
    line-height: 1.45;
    font-size: 14px
}

.sk-mm-promoimg img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    display: block;
}

.sk-mm-promotitle {
    font-size: 20px;
    font-weight: 950;
    margin-top: 12px
}

.sk-mm-promotext {
    margin-top: 5px;
    margin-bottom: 10px;
    opacity: .8;
    line-height: 1.55;
    font-size: 14px
}


/* =========================
   MOBILE PANEL IN NAV (dropdown)
   ========================= */
@media (max-width: 980px) {
    .sk-mm-panel {
        position: static;
        width: 100%;
        border-radius: 0;
        box-shadow: none;
        grid-template-columns:1fr;
        opacity: 1;
        visibility: visible;
        transform: none;
        pointer-events: auto;
        transition: none;
    }
}


/* =========================
   HEADER LINK UNDERLINE
   ========================= */
.skmm-header .main-menu {
    position: relative;
    display: inline-block;
    text-decoration: none;
}

.skmm-header .main-menu::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px;
    height: 2px;
    background: var(--sk-accent);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .3s ease;
}

.skmm-header .main-menu:hover::after,
.skmm-header .main-menu:focus-visible::after {
    transform: scaleX(1);
    transform-origin: left;
}


/* =========================
   THEME VARS HOOKS
   ========================= */
.skmm-header .sk-mm-left {
    background: var(--sk-menuLeft)
}

.skmm-header .sk-mm-right {
    background: var(--sk-menuRight)
}

.skmm-header .sk-mm-cardtitle {
    color: var(--sk-menuTitle)
}

.skmm-header .sk-mm-middle-cardtitle {
    color: var(--sk-menuMiddleTitle)
}

.skmm-header .sk-mm-middle-carddesc {
    color: var(--sk-menuMiddleText)
}

.skmm-header .sk-mm-promotitle {
    color: var(--sk-menuTitle)
}

.skmm-header .sk-mm-promotext {
    color: var(--sk-menuText)
}

.skmm-header .sk-mm-carddesc {
    color: var(--sk-menuText)
}

.skmm-header {
    transition: all 0.3s ease-in-out;
    background: var(--sk-primaryColor);
}

.home .skmm-header {
    background: transparent;
}

.skmm-header.scrolled {
    background: var(--sk-primaryColor);
    box-shadow: 0 3px 16px #00000026;
}

.sk-global-banners-mobile {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sk-global-banner-mobile {
    display: block;
}

.sk-global-banner-mobile img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 110px;
    object-fit: contain;
    border-radius: 12px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
    background: #fff;
}

html.sk-a11y #skmmMobile,
html.sk-a11y #skmmMobile .skmm-m__screen,
html.sk-a11y .skmm-header .sk-mm-panel,
html.sk-a11y .skmm-header .sk-mm-middle {
    background: #000 !important;
    color: #fff !important;
}

html.sk-a11y #skmmMobile .skmm-m__top,
html.sk-a11y .skmm-header,
html.sk-a11y .skmm-header .sk-mm-left,
html.sk-a11y .skmm-header .sk-mm-right {
    background: #000 !important;
    border-color: #fff !important;
}

html.sk-a11y #skmmMobile .skmm-m__item,
html.sk-a11y #skmmMobile .skmm-m__sectionTitle,
html.sk-a11y #skmmMobile .skmm-m__title,
html.sk-a11y #skmmMobile .skmm-m__itemDesc,
html.sk-a11y #skmmMobile .skmm-m__promoText,
html.sk-a11y .skmm-header .sk-mm-coltitle,
html.sk-a11y .skmm-header .sk-mm-cardtitle,
html.sk-a11y .skmm-header .sk-mm-carddesc,
html.sk-a11y .skmm-header .sk-mm-middle-carddesc,
html.sk-a11y .skmm-header .sk-mm-middle-cardtitle,
html.sk-a11y .skmm-header .sk-mm-promotitle,
html.sk-a11y .skmm-header .sk-mm-promotext {
    color: inherit !important;
}

html.sk-a11y #skmmMobile .skmm-m__item + .skmm-m__item,
html.sk-a11y .skmm-header .sk-mm-panel {
    border-color: rgba(255, 255, 255, .35) !important;
}

html.sk-a11y #skmmMobile .skmm-m__x,
html.sk-a11y #skmmMobile .skmm-m__back,
html.sk-a11y #skmmMobile .skmm-m__x i,
html.sk-a11y #skmmMobile .skmm-m__back i {
    color: #fff !important;
}

html.sk-a11y #skmmMobile a,
html.sk-a11y .skmm-header .sk-mm-list a,
html.sk-a11y .skmm-header .main-menu,
html.sk-a11y .skmm-header .sk-mm-card {
    color: #ffff00 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    transition: none !important;
}

html.sk-a11y #skmmMobile a:hover,
html.sk-a11y #skmmMobile a:focus-visible,
html.sk-a11y #skmmMobile .skmm-m__item:hover,
html.sk-a11y #skmmMobile .skmm-m__item:focus-visible,
html.sk-a11y .skmm-header .sk-mm-list a:hover,
html.sk-a11y .skmm-header .sk-mm-list a:focus-visible,
html.sk-a11y .skmm-header .main-menu:hover,
html.sk-a11y .skmm-header .main-menu:focus-visible,
html.sk-a11y .skmm-header .sk-mm-card:hover,
html.sk-a11y .skmm-header .sk-mm-card:focus-visible {
    color: #fff !important;
    outline: 3px solid #fff !important;
    outline-offset: 3px;
    background: #000 !important;
}

html.sk-a11y .skmm-header .main-menu::after {
    background: #fff !important;
    transform: none !important;
}

html.sk-a11y .skmm-header .sk-mm-card:hover,
html.sk-a11y .skmm-header .sk-mm-card:focus-visible {
    outline: 4px solid #fff !important;
    outline-offset: 4px;
    transition: none !important;
}

html.sk-a11y .skmm-header .sk-mm-ic {
    background: #fff !important;
}

html.sk-a11y .skmm-m__sub div {
    background: #000 !important;
}

html.sk-a11y .skmm-m__search div {
    background: #000 !important;
}

html.sk-a11y #skmmMobile img,
html.sk-a11y .skmm-header .sk-mm-promoimg img,
html.sk-a11y #skmmMobile .skmm-m__promoImg img {
    opacity: 1 !important;
    filter: grayscale(20%) contrast(130%) brightness(105%) !important;
}

html.sk-a11y #skmmMobile *,
html.sk-a11y #skmmMobile *::before,
html.sk-a11y #skmmMobile *::after,
html.sk-a11y .skmm-header *,
html.sk-a11y .skmm-header *::before,
html.sk-a11y .skmm-header *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
}

html.sk-a11y #skmmMobile :where(div, span, p, li, h1, h2, h3, h4, h5, h6),
html.sk-a11y .skmm-header :where(div, span, p, li, h1, h2, h3, h4, h5, h6) {
    color: #fff !important;
}

html.sk-a11y #skmmMobile :where(a, a span),
html.sk-a11y .skmm-header :where(a, a span) {
    color: #ffff00 !important;
}

.main-navigation a:focus-visible,
.sk-has-megamenu > a:focus-visible {
    outline: 3px solid var(--sk-focus-color, #facc15);
    outline-offset: 4px;
    border-radius: 10px;
}

.sk-mm-panel a:focus-visible {
    outline: 3px solid var(--sk-focus-color, #facc15);
    outline-offset: 4px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.12);
}

.sk-mm-panel button:focus-visible, .sk-mm-panel .sk-main-btn:focus-visible {
    outline: 3px solid var(--sk-focus-color, #facc15);
    outline-offset: 4px;
    border-radius: 10px;
    background: var(--sk-accent) !important;
}
