/* =========================================================
   NG08 STEP 36 — MEGA MENU REBUILD V1
   Completely isolated component.
   ========================================================= */

:root{
    --ng-wow-bg:#0E3027;
    --ng-wow-bg-2:#143A30;
    --ng-wow-card:#193F35;
    --ng-wow-card-2:#20493E;
    --ng-wow-line:rgba(255,255,255,.105);
    --ng-wow-line-soft:rgba(255,255,255,.065);
    --ng-wow-text:#F8F7F2;
    --ng-wow-muted:rgba(248,247,242,.62);
    --ng-wow-faint:rgba(248,247,242,.38);
    --ng-wow-accent:#B7D532;
    --ng-wow-radius:20px;
}

/* Kill all historical desktop mega-menu surfaces. */
@media(min-width:1051px){
    header#header .links .mega-menu{
        display:none !important;
        visibility:hidden !important;
        opacity:0 !important;
        pointer-events:none !important;
    }

    header#header{
        overflow:visible !important;
    }

    #ngWowMegaRoot{
        position:absolute;
        left:0;
        top:100%;
        width:100vw;
        z-index:1000;

        padding:10px 0 24px;

        background:
            linear-gradient(
                180deg,
                rgba(14,48,39,.985) 0%,
                rgba(14,48,39,.97) 100%
            );

        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transform:translateY(-8px);

        transition:
            opacity .20s ease,
            transform .24s cubic-bezier(.2,.8,.2,1),
            visibility 0s linear .24s;

        box-shadow:0 30px 70px rgba(3,20,15,.28);
    }

    #ngWowMegaRoot.is-open{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        transform:translateY(0);
        transition-delay:0s;
    }

    #ngWowMegaRoot .ng-wow-mega__surface{
        width:min(1440px,calc(100% - 64px));
        margin:0 auto;

        border:1px solid var(--ng-wow-line);
        border-radius:var(--ng-wow-radius);
        overflow:hidden;

        background:
            radial-gradient(
                circle at 80% 0%,
                rgba(183,213,50,.055),
                transparent 30%
            ),
            var(--ng-wow-bg);

        box-shadow:
            0 24px 60px rgba(2,18,14,.24),
            inset 0 1px 0 rgba(255,255,255,.025);
    }

    #ngWowMegaRoot .ng-wow-panel{
        display:none;
        grid-template-columns:360px minmax(0,1fr);
        min-height:440px;
    }

    #ngWowMegaRoot .ng-wow-panel.is-active{
        display:grid;
        animation:ngWowPanelIn .22s ease both;
    }

    @keyframes ngWowPanelIn{
        from{opacity:0;transform:translateY(5px)}
        to{opacity:1;transform:translateY(0)}
    }

    /* Editorial rail */
    #ngWowMegaRoot .ng-wow-editorial{
        padding:34px 32px 30px;
        border-right:1px solid var(--ng-wow-line);
        background:
            linear-gradient(
                160deg,
                rgba(255,255,255,.035),
                rgba(255,255,255,.012)
            );

        display:flex;
        flex-direction:column;
        justify-content:space-between;
        gap:28px;
    }

    #ngWowMegaRoot .ng-wow-kicker{
        display:block;
        margin-bottom:17px;

        color:var(--ng-wow-accent);
        font:700 9px/1.2 Manrope,sans-serif;
        letter-spacing:.15em;
        text-transform:uppercase;
    }

    #ngWowMegaRoot .ng-wow-editorial h2{
        margin:0;

        color:var(--ng-wow-text);
        font:400 38px/.98 Merriweather,serif;
        letter-spacing:-.035em;
        text-wrap:balance;
    }

    #ngWowMegaRoot .ng-wow-editorial p{
        max-width:290px;
        margin:19px 0 0;

        color:var(--ng-wow-muted);
        font:400 11px/1.72 Manrope,sans-serif;
    }

    #ngWowMegaRoot .ng-wow-editorial__cta{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:18px;

        width:100%;
        padding-top:17px;

        border-top:1px solid var(--ng-wow-line);

        color:var(--ng-wow-text);
        text-decoration:none;

        font:700 9px/1 Manrope,sans-serif;
        letter-spacing:.055em;
        text-transform:uppercase;
    }

    #ngWowMegaRoot .ng-wow-editorial__cta b{
        width:32px;
        height:32px;
        border-radius:50%;

        display:grid;
        place-items:center;

        background:var(--ng-wow-accent);
        color:#17352D;

        font-size:13px;
        font-weight:500;

        transition:transform .25s ease;
    }

    #ngWowMegaRoot .ng-wow-editorial__cta:hover b{
        transform:translate(2px,-2px);
    }

    /* Shared stage */
    #ngWowMegaRoot .ng-wow-stage{
        min-width:0;
        padding:20px;
        background:transparent;
    }

    #ngWowMegaRoot .ng-wow-stage__head{
        height:34px;
        margin-bottom:12px;

        display:flex;
        justify-content:space-between;
        align-items:center;

        color:var(--ng-wow-faint);
        font:700 7px/1 Manrope,sans-serif;
        letter-spacing:.13em;
        text-transform:uppercase;
    }

    /* PRODUCTS */
    #ngWowMegaRoot .ng-wow-product-grid{
        height:354px;

        display:grid;
        grid-template-columns:repeat(var(--ng-wow-count),minmax(0,1fr));
        gap:10px;
    }

    #ngWowMegaRoot .ng-wow-product-grid.is-overflow{
        grid-auto-flow:column;
        grid-template-columns:none;
        grid-auto-columns:minmax(190px,1fr);

        overflow-x:auto;
        overscroll-behavior-inline:contain;
        scrollbar-width:thin;
        scrollbar-color:rgba(183,213,50,.35) transparent;
    }

    #ngWowMegaRoot .ng-wow-product-card{
        position:relative;
        min-width:0;
        overflow:hidden;

        border:1px solid var(--ng-wow-line-soft);
        border-radius:15px;

        background:
            linear-gradient(160deg,#21483D,#17392F);

        color:var(--ng-wow-text);
        text-decoration:none;

        isolation:isolate;

        transition:
            transform .28s ease,
            border-color .28s ease;
    }

    #ngWowMegaRoot .ng-wow-product-card:hover{
        transform:translateY(-4px);
        border-color:rgba(183,213,50,.32);
    }

    #ngWowMegaRoot .ng-wow-product-card.is-primary{
        border-color:rgba(183,213,50,.33);
    }

    #ngWowMegaRoot .ng-wow-product-card__media{
        position:absolute;
        inset:0;
        z-index:-3;

        background:
            radial-gradient(circle at 70% 20%,rgba(183,213,50,.10),transparent 28%),
            linear-gradient(160deg,#21483D,#17392F);

        background-size:cover;
        background-position:center;

        transform:scale(1.01);
        transition:transform .45s ease;
    }

    #ngWowMegaRoot .ng-wow-product-card:hover .ng-wow-product-card__media{
        transform:scale(1.055);
    }

    #ngWowMegaRoot .ng-wow-product-card__shade{
        position:absolute;
        inset:0;
        z-index:-2;

        background:
            linear-gradient(
                180deg,
                rgba(8,31,25,.18) 0%,
                rgba(8,31,25,.36) 42%,
                rgba(8,31,25,.93) 100%
            );
    }

    #ngWowMegaRoot .ng-wow-product-card__top,
    #ngWowMegaRoot .ng-wow-product-card__bottom{
        position:absolute;
        left:17px;
        right:17px;
    }

    #ngWowMegaRoot .ng-wow-product-card__top{
        top:16px;

        display:flex;
        justify-content:space-between;
        align-items:center;
    }

    #ngWowMegaRoot .ng-wow-product-card__top span{
        color:rgba(255,255,255,.76);
        font:700 8px/1 Manrope,sans-serif;
        letter-spacing:.12em;
    }

    #ngWowMegaRoot .ng-wow-product-card__top em{
        padding:5px 7px;
        border-radius:999px;

        background:rgba(183,213,50,.94);
        color:#17352D;

        font:800 6px/1 Manrope,sans-serif;
        letter-spacing:.11em;
        font-style:normal;
    }

    #ngWowMegaRoot .ng-wow-product-card__bottom{
        bottom:17px;
    }

    #ngWowMegaRoot .ng-wow-product-card__bottom small{
        display:block;
        margin-bottom:7px;

        color:rgba(255,255,255,.48);
        font:700 6px/1 Manrope,sans-serif;
        letter-spacing:.12em;
    }

    #ngWowMegaRoot .ng-wow-product-card__bottom strong{
        display:block;

        color:#fff;
        font:600 16px/1.08 Manrope,sans-serif;
        text-transform:uppercase;
        text-wrap:balance;
    }

    #ngWowMegaRoot .ng-wow-product-card__bottom > span{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:12px;

        margin-top:18px;
        padding-top:12px;

        border-top:1px solid rgba(255,255,255,.13);

        color:var(--ng-wow-accent);
        font:700 8px/1 Manrope,sans-serif;
        text-transform:uppercase;
    }

    /* SOURCING */
    #ngWowMegaRoot .ng-wow-journey{
        position:relative;
        height:354px;

        display:grid;
        grid-template-columns:repeat(4,minmax(0,1fr));
        gap:10px;
    }

    #ngWowMegaRoot .ng-wow-journey::before{
        content:"";
        position:absolute;
        left:8%;
        right:8%;
        top:52px;
        height:1px;
        z-index:0;

        background:
            linear-gradient(
                90deg,
                rgba(183,213,50,.18),
                rgba(183,213,50,.65),
                rgba(183,213,50,.18)
            );
    }

    #ngWowMegaRoot .ng-wow-journey-card{
        position:relative;
        z-index:1;

        padding:20px 17px 17px;
        border:1px solid var(--ng-wow-line-soft);
        border-radius:15px;

        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.03),
                rgba(255,255,255,.012)
            );

        color:var(--ng-wow-text);
        text-decoration:none;

        display:flex;
        flex-direction:column;

        transition:
            transform .28s ease,
            border-color .28s ease,
            background .28s ease;
    }

    #ngWowMegaRoot .ng-wow-journey-card:hover{
        transform:translateY(-4px);
        border-color:rgba(183,213,50,.30);
        background:rgba(255,255,255,.035);
    }

    #ngWowMegaRoot .ng-wow-journey-card__node{
        width:42px;
        height:42px;
        margin-bottom:37px;
        border-radius:50%;

        display:grid;
        place-items:center;

        border:1px solid rgba(183,213,50,.45);
        background:var(--ng-wow-bg);

        color:var(--ng-wow-accent);
        font:700 8px/1 Manrope,sans-serif;
    }

    #ngWowMegaRoot .ng-wow-journey-card small{
        color:var(--ng-wow-faint);
        font:700 6px/1 Manrope,sans-serif;
        letter-spacing:.14em;
    }

    #ngWowMegaRoot .ng-wow-journey-card strong{
        margin-top:9px;

        color:var(--ng-wow-text);
        font:400 20px/1.05 Merriweather,serif;
    }

    #ngWowMegaRoot .ng-wow-journey-card p{
        margin:12px 0 0;

        color:var(--ng-wow-muted);
        font:400 9px/1.62 Manrope,sans-serif;
    }

    #ngWowMegaRoot .ng-wow-journey-card > span{
        margin-top:auto;
        padding-top:16px;

        color:var(--ng-wow-accent);
        font:700 7px/1 Manrope,sans-serif;
        text-transform:uppercase;
    }

    /* QUALITY */
    #ngWowMegaRoot .ng-wow-live{
        display:flex;
        align-items:center;
        gap:7px;
    }

    #ngWowMegaRoot .ng-wow-live i{
        width:6px;
        height:6px;
        border-radius:50%;
        background:var(--ng-wow-accent);
        box-shadow:0 0 12px rgba(183,213,50,.75);
    }

    #ngWowMegaRoot .ng-wow-quality-grid{
        height:354px;

        display:grid;
        grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);
        gap:10px;
    }

    #ngWowMegaRoot .ng-wow-batch,
    #ngWowMegaRoot .ng-wow-quality-links{
        border:1px solid var(--ng-wow-line-soft);
        border-radius:15px;
        background:
            linear-gradient(
                180deg,
                rgba(255,255,255,.03),
                rgba(255,255,255,.012)
            );
    }

    #ngWowMegaRoot .ng-wow-batch{
        padding:21px;
    }

    #ngWowMegaRoot .ng-wow-batch__head{
        display:flex;
        justify-content:space-between;
        align-items:flex-end;

        padding-bottom:18px;
        border-bottom:1px solid var(--ng-wow-line);
    }

    #ngWowMegaRoot .ng-wow-batch__head span{
        color:var(--ng-wow-faint);
        font:700 7px/1 Manrope,sans-serif;
        letter-spacing:.13em;
    }

    #ngWowMegaRoot .ng-wow-batch__head strong{
        color:var(--ng-wow-text);
        font:400 27px/1 Merriweather,serif;
    }

    #ngWowMegaRoot .ng-wow-batch__rows{
        margin-top:9px;
    }

    #ngWowMegaRoot .ng-wow-batch__rows div{
        min-height:54px;

        display:grid;
        grid-template-columns:1fr 1fr 22px;
        gap:14px;
        align-items:center;

        border-bottom:1px solid var(--ng-wow-line-soft);
    }

    #ngWowMegaRoot .ng-wow-batch__rows div:last-child{
        border-bottom:0;
    }

    #ngWowMegaRoot .ng-wow-batch__rows span{
        color:var(--ng-wow-faint);
        font:700 7px/1 Manrope,sans-serif;
        letter-spacing:.10em;
        text-transform:uppercase;
    }

    #ngWowMegaRoot .ng-wow-batch__rows b{
        color:var(--ng-wow-text);
        font:600 9px/1 Manrope,sans-serif;
        text-transform:uppercase;
    }

    #ngWowMegaRoot .ng-wow-batch__rows em{
        color:var(--ng-wow-accent);
        font:700 12px/1 Manrope,sans-serif;
        font-style:normal;
        text-align:right;
    }

    #ngWowMegaRoot .ng-wow-quality-links{
        padding:12px;
        display:grid;
        grid-template-rows:repeat(4,1fr);
        gap:8px;
    }

    #ngWowMegaRoot .ng-wow-quality-links a{
        min-height:0;
        padding:0 14px;

        display:flex;
        justify-content:space-between;
        align-items:center;
        gap:18px;

        border:1px solid var(--ng-wow-line-soft);
        border-radius:11px;

        background:rgba(255,255,255,.018);

        color:var(--ng-wow-text);
        text-decoration:none;

        transition:
            border-color .25s ease,
            background .25s ease,
            transform .25s ease;
    }

    #ngWowMegaRoot .ng-wow-quality-links a:hover{
        transform:translateX(2px);
        border-color:rgba(183,213,50,.28);
        background:rgba(255,255,255,.03);
    }

    #ngWowMegaRoot .ng-wow-quality-links span{
        display:flex;
        flex-direction:column;
        gap:5px;
    }

    #ngWowMegaRoot .ng-wow-quality-links b{
        color:var(--ng-wow-text);
        font:700 9px/1 Manrope,sans-serif;
        text-transform:uppercase;
    }

    #ngWowMegaRoot .ng-wow-quality-links small{
        color:var(--ng-wow-faint);
        font:600 6px/1 Manrope,sans-serif;
        letter-spacing:.08em;
        text-transform:uppercase;
    }

    #ngWowMegaRoot .ng-wow-quality-links em{
        color:var(--ng-wow-accent);
        font:500 13px/1 Manrope,sans-serif;
        font-style:normal;
    }
}

/* Keep mobile nav simple: use existing direct navigation links. */
@media(max-width:1050px){
    #ngWowMegaRoot{
        display:none !important;
    }
}

@media(prefers-reduced-motion:reduce){
    #ngWowMegaRoot,
    #ngWowMegaRoot *,
    #ngWowMegaRoot *::before,
    #ngWowMegaRoot *::after{
        animation:none !important;
        transition:none !important;
    }
}
