/* -------------------------------------------------
   4. SITE HEADER / NAV
------------------------------------------------- */
.site-header{
    position:sticky;
    top:0;
    z-index:80;
    background: var(--color-white);
    border-bottom:1px solid transparent;
}
.site-header .container{
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    padding-top:22px;
    padding-bottom:18px;
}
.site-logo{ text-align:center; }
.site-logo a{ display:inline-block; }
.site-logo .logo-main{
    font-family: "EB Garamond", serif;
    font-size:22px;
    letter-spacing:.1em;
    color:var(--color-dark);
    line-height:1;
}
.site-logo .logo-sub{
    display:block;
    font-family:var(--font-body);
    font-size:9px;
    letter-spacing:.4em;
    color:var(--color-text-muted);
    margin-top:4px;
}
.main-nav{
    border-top:1px solid var(--color-line);
}
.main-nav .container{
    padding-top:0; padding-bottom:0;
    justify-content:center;
}
#primary-menu{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:40px;
    padding:16px 0;
}
.main-nav a{
    font-size:var(--fs-base);
    font-weight: 400;
    letter-spacing:.03em;
    color:var(--color-text);
    display:flex;
    align-items:center;
    gap:5px;
    transition:color .2s ease;
}
@media (min-width:901px){
    .main-nav a:hover{ color:var(--color-text-muted); }
}

/* strzałka przy pozycjach posiadających podmenu (dodawana automatycznie przez WP) */
#primary-menu li.menu-item-has-children > a::after{
    content:"";
    width:6px; height:6px;
    border-right:1px solid currentColor;
    border-bottom:1px solid currentColor;
    transform:rotate(45deg);
    margin-top:-3px;
    transition:transform .2s ease;
}
/* obrót strzałki na hover dotyczy tylko desktopu - na mobile
   sterują tym wyłącznie stany .submenu-open (patrz sekcja 4c) */
@media (min-width:901px){
    #primary-menu li.menu-item-has-children:hover > a::after{
        transform:rotate(225deg);
        margin-top:3px;
    }
}
 /* =================================================
   HEADER TRANSPARENTNY NAD HERO — STRONA GŁÓWNA
================================================= */

@media (min-width: 901px) {

    /* Header leży nad hero */
    body.home #masthead,
    body.front-page #masthead {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        background: transparent !important;
        border-bottom-color: transparent !important;
        z-index: 80;

        transition:
            background-color .7s cubic-bezier(.22, 1, .36, 1),
            border-color .7s ease,
            box-shadow .7s ease;
    }

    /* Po scrollu */
    body.home #masthead.is-scrolled,
    body.front-page #masthead.is-scrolled {
        position: fixed;
        top: 0;
        left: 0;

        background: var(--color-white) !important;
        border-bottom-color: var(--color-line) !important;
        box-shadow: 0 4px 20px rgba(0,0,0,.04);
    }

    /* Linia pomiędzy logo a menu też musi być przezroczysta */
    body.home #masthead .main-nav,
    body.front-page #masthead .main-nav {
        border-top-color: transparent;
        transition: border-color .3s ease;
    }

    body.home #masthead.is-scrolled .main-nav,
    body.front-page #masthead.is-scrolled .main-nav {
        border-top-color: var(--color-line);
    }

}


/* =================================================
   POZOSTAŁE STRONY — NORMALNY HEADER
================================================= */

body:not(.home):not(.front-page) #masthead {
    position: sticky;
    top: 0;
    background: var(--color-white);
}
/* =================================================
   HOME — HEADER NAD HERO
================================================= */

body.home #masthead {
    position: absolute !important;
    top: 40px;
    left: 0;
    width: 100%;
    z-index: 100;

    background: transparent !important;
    border-bottom: 1px solid transparent !important;

}

/* Ukrywamy również linię nad menu */
body.home #masthead .main-nav {
    border-top-color: transparent !important;
}

/* Po scrollowaniu */
body.home #masthead.is-scrolled {
    position: fixed !important;
    top: 0;
    left: 0;

    background: #fff !important;
    border-bottom: 1px solid var(--color-line) !important;

    box-shadow: 0 4px 20px rgba(0, 0, 0, .04);
}

body.home #masthead.is-scrolled .main-nav {
    border-top-color: var(--color-line) !important;
}
body.home #masthead .header-action-btn,
body.front-page #masthead .header-action-btn {
    color: #fff !important;
    transition: color .7s cubic-bezier(.22, 1, .36, 1);
}

body.home #masthead.is-scrolled .header-action-btn,
body.front-page #masthead.is-scrolled .header-action-btn {
    color: var(--color-dark) !important;
}
body.home #masthead .logo-main,
body.home #masthead .main-nav a,
body.front-page #masthead .logo-main,
body.front-page #masthead .main-nav a {
    color: #fff !important;
}

body.home #masthead.is-scrolled .logo-main,
body.home #masthead.is-scrolled .main-nav a,
body.front-page #masthead.is-scrolled .logo-main,
body.front-page #masthead.is-scrolled .main-nav a {
    color: var(--color-dark) !important;
}

body.home #masthead .menu-toggle-bar,
body.front-page #masthead .menu-toggle-bar {
    background-color: #fff !important;
    transition: background-color .7s cubic-bezier(.22, 1, .36, 1);
}

body.home #masthead.is-scrolled .menu-toggle-bar,
body.front-page #masthead.is-scrolled .menu-toggle-bar {
    background-color: var(--color-dark) !important;
}


/* -------------------------------------------------
   4b. ROZWIJANE PODMENU (Lampy wewnętrzne, Marki...)
------------------------------------------------- */
#primary-menu li.menu-item-has-children{
    position:relative;
}
#primary-menu .sub-menu{
    display:block; /* zawsze jedna kolumna, niezależnie od kontekstu */
    position:absolute;
    top:100%;
    left:50%;
    transform:translateX(-50%) translateY(6px);
    min-width:220px;
    background:var(--color-white);
    border:1px solid var(--color-line);
    box-shadow:0 18px 40px rgba(23,20,15,.08);
    padding:10px 0;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
    z-index:50;
}
/* rozwijanie na hover/focus dotyczy tylko trybu desktop -
   na mobile submenu sterowane jest wyłącznie klasą .submenu-open (JS) */
@media (min-width:901px){
    #primary-menu li.menu-item-has-children:hover > .sub-menu,
    #primary-menu li.menu-item-has-children:focus-within > .sub-menu{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        transform:translateX(-50%) translateY(0);
    }
}
#primary-menu .sub-menu li{ width:100%; }
#primary-menu .sub-menu a{
    display:block;
    padding:10px 22px;
    font-size:var(--fs-base);
    white-space:nowrap;
    color:var(--color-text);
}
#primary-menu .sub-menu a:hover{
    background:var(--color-cream-alt);
    color:var(--color-dark);
}
#primary-menu .sub-menu a::after{ content:none; }

/* -------------------------------------------------
   4c. NAGŁÓWEK MOBILE / HAMBURGER / OFF-CANVAS PANEL
   (< 900px - logo i przycisk menu dzielą jeden,
   kompaktowy rząd; menu wysuwa się jako panel z
   prawej strony, w duchu materiałów Apple: blur +
   przezroczystość zamiast pełnego nieprzezroczystego tła)
------------------------------------------------- */

.site-header-inner{ position:relative; }

.menu-toggle{
    display:none; /* domyślnie ukryty - desktop pokazuje pełne menu w linii */
    position:relative;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    flex-shrink:0;
    background:none;
    border:none;
    padding:0;
    -webkit-tap-highlight-color:transparent;
    transition:transform .12s ease-out;
}
.menu-toggle:active{ transform:scale(.92); }

/* trzy kreski o identycznej grubości i długości - klasyczny hamburger -> X */
.menu-toggle-bar{
    position:absolute;
    left:50%;
    top:50%;
    width:22px;
    height:1px;
    background:var(--color-dark);
    border-radius:1px;
    transform:translate(-50%,-50%) translateY(var(--ty)) rotate(0deg);
    transition:transform .32s cubic-bezier(.22,.61,.36,1), opacity .2s ease;
}
.menu-toggle-bar:nth-child(1){ --ty:-6.5px; }
.menu-toggle-bar:nth-child(2){ --ty:0px; }
.menu-toggle-bar:nth-child(3){ --ty:6.5px; }

/* stan otwarty: górna i dolna kreska składają się w "X", środkowa znika */
body.nav-open .menu-toggle-bar:nth-child(1){ transform:translate(-50%,-50%) translateY(0) rotate(45deg); }
body.nav-open .menu-toggle-bar:nth-child(2){ opacity:0; }
body.nav-open .menu-toggle-bar:nth-child(3){ transform:translate(-50%,-50%) translateY(0) rotate(-45deg); }

.nav-scrim{
    position:fixed;
    inset:0;
    background:rgba(23,20,15,.38);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .32s ease, visibility .32s ease;
    z-index:90;
}
.nav-mobile-head,
.nav-close{ display:none; }

/* przycisk-strzałka do rozwijania podkategorii na mobile - osobny od
   nazwy kategorii, żeby sama nazwa mogła normalnie przenosić do katalogu.
   Domyślnie (desktop) ukryty - tam rozwijanie działa na hover. */
.submenu-toggle{
    display:none;
    background:none;
    border:none;
    padding:0;
}

@media (max-width:900px){

    /* --- rząd nagłówka: logo + hamburger, bez wielkiego, wyśrodkowanego bloku --- */
    .site-header .container.site-header-inner{
        justify-content:space-between;
        padding-top:7px;
        padding-bottom:7px;
    }
    .site-logo{ text-align:left; }
    .site-logo .logo-main{ font-size:22px; letter-spacing:.1em; }
    .site-logo .logo-sub{ font-size:7.5px; letter-spacing:.3em; margin-top:3px; }
    .menu-toggle{ display:inline-flex; }

    /* --- panel nawigacji jako wysuwana warstwa (off-canvas) --- */
    body.nav-open{ overflow:hidden; }

    .nav-scrim{ opacity:0; }
    body.nav-open .nav-scrim{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
    }

    .main-nav{
        border-top:none;
        position:fixed;
        top:0;
        right:0;
        bottom:0;
        width:min(360px, 86vw);
        max-width:100vw;
        background-color:rgba(255,255,255,.45);
        backdrop-filter:blur(24px) saturate(180%);
        -webkit-backdrop-filter:blur(24px) saturate(180%);
        box-shadow:-30px 0 60px rgba(23,20,15,.16);
        transform:translateX(100%);
        transition:transform .38s cubic-bezier(.22,.61,.36,1);
        z-index:95;
        display:flex;
        flex-direction:column;
        overflow-y:auto;
        -webkit-overflow-scrolling:touch;
    }
    body.nav-open .main-nav{ transform:translateX(0); }

    .nav-mobile-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        flex-shrink:0;
        padding:max(18px, env(safe-area-inset-top)) 22px 16px;
        border-bottom:1px solid var(--color-line);
    }
    .nav-mobile-title{
        font-family:var(--font-body);
        font-size:var(--fs-base);
        letter-spacing:.14em;
        text-transform:uppercase;
        color:var(--color-text-muted);
    }
    .nav-close{
        display:flex;
        align-items:center;
        justify-content:center;
        width:36px;
        height:36px;
        border-radius:50%;
        background:none;
        border:none;
        color:var(--color-dark);
        transition:background .2s ease, transform .12s ease-out;
    }
    .nav-close svg{ width:16px; height:16px; }
    .nav-close:hover{ background:var(--color-cream-alt); }
    .nav-close:active{ transform:scale(.9); }

    .main-nav .container{
        padding:8px 0 40px;
        max-width:none;
    }
    /* --- lista głównych kategorii: jeden, pojedynczy wiersz na pozycję,
       identycznie jak w menu desktopowym (bez rozwiniętych podkategorii) --- */
    .main-nav ul#primary-menu{
        flex-direction:column;
        align-items:stretch;
        justify-content:flex-start;
        gap:0;
        padding:8px 0;
    }
    #primary-menu > li{ border-bottom:1px solid var(--color-line); }
    .main-nav a{
        padding:16px 22px;
        font-size:var(--fs-base);
    }

    /* --- podmenu: ta sama strzałka co na desktopie (::after). Na mobile
       nazwa kategorii ZAWSZE normalnie przenosi do katalogu (prawdziwy href) -
       rozwijaniem podkategorii steruje wyłącznie osobny przycisk-strzałka
       (.submenu-toggle) w prawym rogu. Kolor i kierunek strzałki zmieniają
       się dopiero po tapnięciu w nią (klasa .submenu-open), nigdy na hover --- */
    #primary-menu li.menu-item-has-children{ position:relative; }
    #primary-menu li.menu-item-has-children > a{
        justify-content:space-between; /* strzałka zawsze przy prawej krawędzi */
        padding-right:52px;            /* miejsce na przycisk-strzałkę obok */
    }
    #primary-menu li.menu-item-has-children > a::after{
        margin-top:0; /* na mobile wyrównujemy strzałkę środkowo w wierszu, nie jak na desktopie */
    }
    #primary-menu li.submenu-open > a{
        color:var(--color-text-muted);
    }
    #primary-menu li.submenu-open > a::after{
        transform:rotate(225deg);
    }
    .submenu-toggle{
        display:block;
        position:absolute;
        top:0;
        right:0;
        width:70px;
        height:52px;
        z-index:2; /* zawsze nad linkiem, żeby dotknięcie strzałki nie uruchamiało nawigacji */
        -webkit-tap-highlight-color:transparent;
    }

    #primary-menu .sub-menu{
        display:block;
        position:static;
        transform:none;
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        box-shadow:none;
        border:none;
        background:transparent; /* to samo tło co reszta panelu - bez wizualnego wyodrębniania */
        max-height:0;
        padding:0;      /* bez tego zwinięte podmenu zostawiało "widmowe" 10px 0
                            paddingu z reguły desktopowej - stąd wyższe li z dziećmi */
        overflow:hidden;
        transition:max-height .38s cubic-bezier(.22,.61,.36,1), opacity .25s ease, visibility .38s ease;
    }
    /* WAŻNE: prefiks #primary-menu jest tu konieczny - bez niego ta reguła
       (bez ID w selektorze) przegrywa specyficznością z regułą bazową
       #primary-menu .sub-menu{opacity:0;visibility:hidden;...} powyżej,
       więc lista technicznie się rozwijała (max-height rósł) ale
       pozostawała niewidoczna (opacity/visibility nadal na "ukryte") */
    #primary-menu li.submenu-open > .sub-menu{
        max-height:640px;
        opacity:1;
        visibility:visible;
        pointer-events:auto;
    }
    #primary-menu .sub-menu li{ width:100%; }
    /* te same krój, rozmiar i kolor co pozycje główne - jedyna różnica to
       lekkie wcięcie z lewej, żeby było widać hierarchię */
    #primary-menu .sub-menu a{
        padding:16px 22px 16px 38px;
        font-size:var(--fs-base);
        color:var(--color-text);
    }
}

/* pełna nieprzezroczystość dla użytkowników preferujących mniej przezroczystości */
@media (max-width:900px) and (prefers-reduced-transparency: reduce){
    .main-nav{ background:var(--color-white); backdrop-filter:none; -webkit-backdrop-filter:none; }
}


/* ===== Ikony w jednym rzędzie z logo/nav ===== */
.site-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.site-header-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}
.header-action-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    display: inline-flex;
}
.header-action-btn svg {
    width: 18px;
    height: 18px;
}

/* -------------------------------------------------
   4d. DESKTOP: LOGO + NAV RAZEM PO LEWEJ, IKONY PRZY
   PRAWEJ KRAWĘDZI ("nav" jest teraz zagnieżdżony w
   .site-header-inner, żeby siedział w jednym rzędzie
   z logo). Dotyczy WYŁĄCZNIE desktopu - na mobile
   (<=900px) .main-nav nadal działa jako wysuwany
   panel off-canvas, bez żadnych zmian.
------------------------------------------------- */
@media (min-width:901px){
    .site-header-inner{
        justify-content:flex-start;
        gap:56px;
    }

    /* nav siedzi teraz wewnątrz .site-header-inner (który sam jest
       .container) - usuwamy jej własny border-top oraz podwójny
       container/padding, żeby menu po prostu wstawiło się w rząd */
    .site-header-inner .main-nav{
        border-top:none;
    }
    .site-header-inner .main-nav .container{
        max-width:none;
        padding:0;
        justify-content:flex-start;
    }
    .site-header-inner #primary-menu{
        justify-content:flex-start;
        padding:0;
    }

    /* ikony (konto/szukaj/koszyk) zostają dosunięte do prawej
       krawędzi, niezależnie od szerokości logo + menu po lewej */
    .site-header-actions{
        margin-left:auto;
    }
}


/* =========================================================
   LUXORA — MEGA MENU
   ========================================================= */


/* =========================================================
   MOBILE / TABLET
   ========================================================= */

.mega-menu {
    display: none;
}

.mega-menu-overlay {
    display: none;
}


/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 901px) {


    /* =====================================================
       HEADER
       
       Header pozostaje NAD overlayem i mega-menu.
       ===================================================== */

    #masthead {
        position: relative;
        z-index: 100;
    }


    /* =====================================================
       MEGA MENU
       ===================================================== */

    .mega-menu {

        display: block;

        position: fixed;

        left: 20px;
        right: 20px;

        /*
         * top ustawia JS na podstawie aktualnego
         * bottom #masthead.
         */
        top: 0;

        width: auto;

        z-index: 99;

        background: #ffffff;

        border-top:
            1px solid
            var(--color-line, #e5e0da);

        border-radius:
            0 0
            var(--radius, 16px)
            var(--radius, 16px);

        box-shadow:
            0 24px 48px -24px
            rgba(10, 9, 7, .18);

        opacity: 0;

        visibility: hidden;

        pointer-events: none;

        transform:
            translateY(-8px);

        transition:
            opacity .28s
            cubic-bezier(.22,.61,.36,1),

            transform .28s
            cubic-bezier(.22,.61,.36,1),

            visibility .28s;
        font-weight: 400;
    }


    .mega-menu.is-open {

        opacity: 1;

        visibility: visible;

        pointer-events: auto;

        transform:
            translateY(0);
    }


    /* =====================================================
       INNER
       ===================================================== */

    .mega-menu__inner {

        display: flex;

        align-items: stretch;

        gap: 80px;

        padding:
            56px 40px
            64px;
    }


    /* =====================================================
       KOLUMNY
       ===================================================== */

    .mega-menu__columns {

        display: flex;

        flex: 1 1 auto;

        gap: 96px;

        min-width: 0;
    }


    .mega-menu__column {

        display: flex;

        flex-direction: column;

        min-width: 200px;
    }


    .mega-menu__column-title {

        margin:
            0 0 20px;

        font-size: var(--fs-base);

        font-weight: 500;

        line-height: 1.3;

        letter-spacing: .04em;

        color:
            var(--color-dark, #1a1712);
    }


    /* =====================================================
       LISTA
       ===================================================== */

    .mega-menu__list {

        display: flex;

        flex-direction: column;

        gap: 16px;

        margin: 0;

        padding: 0;

        list-style: none;
    }


    .mega-menu__list li {

        margin: 0;

        padding: 0;
    }


    .mega-menu__list a {

        display: inline-block;

        font-size: var(--fs-base);

        line-height: 1.45;

        color: var(--color-dark);

        text-decoration: none;

        transition:
            opacity .2s ease,
            color .2s ease;
    }


    .mega-menu__list a:hover {

        opacity: .6;

        color:
            var(--color-dark, #1a1712);
    }


    /* =====================================================
       VIEW ALL
       ===================================================== */

    .mega-menu__view-all {

        display: inline-block;

        width: max-content;

        margin-top: auto;

        padding-top: 24px;

        font-size: var(--fs-base);
        font-weight: 500;

        line-height: 1.4;

        color:
            var(--color-dark, #1a1712);

        text-decoration: underline;

        text-decoration-thickness: 1px;

        text-underline-offset: 3px;

        transition:
            opacity .2s ease;
    }


    .mega-menu__view-all:hover {

        opacity: .6;
    }


    /* =====================================================
       BANERY
       ===================================================== */

    .mega-menu__banners {

        display: flex;

        flex: 0 0 auto;

        width: 640px;

        gap: 24px;
    }


    .mega-menu__banner {

        display: flex;

        flex: 1 1 0;

        flex-direction: column;

        min-width: 0;

        color: inherit;

        text-decoration: none;
    }


    /* =====================================================
       MEDIA BANERA
       ===================================================== */

    .mega-menu__banner-media {

        display: block;

        position: relative;

        width: 100%;

        aspect-ratio: 4 / 5;

        overflow: hidden;

        margin-bottom: 16px;

        border-radius:
            var(--radius, 12px);

        background: #f5f4f2;
    }


    .mega-menu__banner-img {

        display: block;

        width: 100%;

        height: 100%;

        object-fit: cover;

        transition:
            transform .5s
            cubic-bezier(.22,.61,.36,1);
    }


    .mega-menu__banner:hover
    .mega-menu__banner-img {

        transform:
            scale(1.04);
    }


    /* =====================================================
       TEKST BANERA
       ===================================================== */

    .mega-menu__banner-content {

        display: flex;

        flex-direction: column;

        gap: 4px;
    }


    .mega-menu__banner-content strong {

        display: block;

        font-size: var(--fs-base);

        font-weight: 500;

        line-height: 1.35;

        color:
            var(--color-dark, #1a1712);
    }


    .mega-menu__banner-sub {

        display: block;

        font-size: var(--fs-base);

        line-height: 1.45;

        color: #8a8478;
    }


    .mega-menu__banner-link {

        display: inline-block;

        width: max-content;

        margin-top: 8px;

        font-size: var(--fs-base);
        font-weight: 500;

        line-height: 1.4;

        color:
            var(--color-dark, #1a1712);

        text-decoration: underline;

        text-decoration-thickness: 1px;

        text-underline-offset: 3px;

        transition:
            opacity .2s ease;
    }


    .mega-menu__banner:hover
    .mega-menu__banner-link {

        opacity: .6;
    }


    /* =====================================================
       ZWYKŁE WORDPRESS SUB-MENU
       ===================================================== */

    #primary-menu
    > .menu-item-has-children
    > .sub-menu {

        display: none !important;
    }


    /* =====================================================
       OVERLAY
       
       JS przenosi go do BODY.
       
       98 = overlay
       99 = mega menu
       100 = header
       ===================================================== */

    .mega-menu-overlay {

        display: block;

        position: fixed;

        /*
         * top jest ustawiany przez JS.
         */
        top: 0;

        left: 0;

        right: 0;

        bottom: 0;

        z-index: 98;

        background:
            rgba(10, 9, 7, .45);

        opacity: 0;

        visibility: hidden;

        pointer-events: none;

        transition:
            opacity .28s ease,
            visibility .28s;
    }


    .mega-menu-overlay.is-open {

        opacity: 1;

        visibility: visible;

        pointer-events: auto;
    }


}


/* =========================================================
   MNIEJSZE DESKTOPY
   ========================================================= */

@media (min-width: 901px)
and (max-width: 1200px) {

    .mega-menu__inner {

        gap: 48px;

        padding:
            44px 32px
            52px;
    }


    .mega-menu__columns {

        gap: 48px;
    }


    .mega-menu__column {

        min-width: 160px;
    }


    .mega-menu__banners {

        width: 460px;

        gap: 16px;
    }


    .mega-menu__list {

        gap: 13px;
    }


    .mega-menu__list a {

        font-size: var(--fs-base)
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 900px) {

    .mega-menu {

        display: none !important;
    }


    .mega-menu-overlay {

        display: none !important;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

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

    .mega-menu,
    .mega-menu-overlay,
    .mega-menu__banner-img,
    .mega-menu__list a,
    .mega-menu__view-all,
    .mega-menu__banner-link {
  
        transition: none !important;
    }

}