/* =========================================================
   NG08 STEP 36.3 — SOURCING CONTROL GRID
   Alternate concept: no timeline / no moving dot.
   ========================================================= */

@media(min-width:1051px){

    /* Remove previous sourcing line + dot systems entirely */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey::before,
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey::after{
        content:none !important;
        display:none !important;
        animation:none !important;
    }

    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card__node{
        box-shadow:none !important;
    }

    /* Stage becomes a controlled technical surface */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-stage{
        position:relative;
        overflow:hidden;

        background:
            linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
            linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
        background-size:42px 42px;
        background-position:-1px -1px;
    }

    /* Soft radial depth */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-stage::before{
        content:"";
        position:absolute;
        inset:0;
        pointer-events:none;

        background:
            radial-gradient(
                circle at 78% 22%,
                rgba(183,213,50,.07),
                transparent 30%
            ),
            radial-gradient(
                circle at 16% 84%,
                rgba(63,100,86,.11),
                transparent 34%
            );
    }

    /*
     * Animated scan beam:
     * one luminous vertical pass across the stage.
     */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-stage::after{
        content:"";
        position:absolute;
        top:34px;
        bottom:18px;
        left:-16%;

        width:14%;
        pointer-events:none;

        background:
            linear-gradient(
                90deg,
                transparent 0%,
                rgba(183,213,50,.018) 25%,
                rgba(183,213,50,.12) 50%,
                rgba(183,213,50,.018) 75%,
                transparent 100%
            );

        filter:blur(5px);

        animation:ngWowControlScan 7.8s ease-in-out infinite;
    }

    @keyframes ngWowControlScan{
        0%{
            left:-16%;
            opacity:0;
        }
        8%{
            opacity:.75;
        }
        48%{
            opacity:.48;
        }
        92%{
            opacity:.75;
        }
        100%{
            left:102%;
            opacity:0;
        }
    }

    /* 2x2 command grid */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey{
        position:relative;
        z-index:2;

        height:354px !important;

        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        grid-template-rows:repeat(2,minmax(0,1fr)) !important;

        gap:10px !important;
    }

    /* Reset Step 36.1 row-grid overrides */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card{
        position:relative;
        z-index:2;

        min-height:0 !important;
        height:auto !important;

        display:grid !important;
        grid-template-columns:58px minmax(0,1fr) auto !important;
        grid-template-rows:auto auto 1fr auto !important;

        column-gap:16px !important;
        row-gap:0 !important;

        padding:18px 18px 15px !important;

        border:1px solid rgba(255,255,255,.075) !important;
        border-radius:15px !important;

        background:
            linear-gradient(
                145deg,
                rgba(255,255,255,.034),
                rgba(255,255,255,.012)
            ) !important;

        overflow:hidden;

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

    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card:hover{
        transform:translateY(-3px);

        border-color:rgba(183,213,50,.28) !important;

        background:
            linear-gradient(
                145deg,
                rgba(183,213,50,.055),
                rgba(255,255,255,.018)
            ) !important;

        box-shadow:
            inset 0 0 0 1px rgba(183,213,50,.025),
            0 16px 34px rgba(3,20,15,.14);
    }

    /* number module */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card__node{
        grid-column:1;
        grid-row:1 / span 4;

        width:48px !important;
        height:48px !important;
        margin:0 !important;

        align-self:start;

        border-radius:12px !important;

        background:
            linear-gradient(
                145deg,
                rgba(183,213,50,.13),
                rgba(183,213,50,.035)
            ) !important;

        border:1px solid rgba(183,213,50,.32) !important;

        color:var(--ng-wow-accent) !important;

        font:700 9px/1 Manrope,sans-serif !important;

        display:grid !important;
        place-items:center !important;
    }

    /* eyebrow */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card small{
        grid-column:2;
        grid-row:1;

        align-self:start !important;

        margin:2px 0 0 !important;

        color:rgba(248,247,242,.38) !important;

        font:700 6px/1 Manrope,sans-serif !important;
        letter-spacing:.15em !important;
    }

    /* title */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card strong{
        grid-column:2;
        grid-row:2;

        min-height:0 !important;
        margin:8px 0 0 !important;

        color:#fff !important;

        font:400 18px/1.03 Merriweather,serif !important;
        letter-spacing:-.025em;
    }

    /* body */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card p{
        grid-column:2;
        grid-row:3;

        min-height:0 !important;
        margin:9px 0 0 !important;

        max-width:44ch;

        color:rgba(248,247,242,.58) !important;

        font:400 8px/1.55 Manrope,sans-serif !important;
    }

    /* CTA becomes compact right module */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card > span{
        grid-column:3;
        grid-row:1 / span 4;

        align-self:center !important;
        justify-self:end;

        width:34px;
        height:34px;

        margin:0 !important;
        padding:0 !important;

        border:1px solid rgba(255,255,255,.10);
        border-radius:50%;

        color:var(--ng-wow-accent) !important;

        font-size:0 !important;

        display:grid !important;
        place-items:center !important;

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

    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card > span::after{
        content:"↗";
        font:500 12px/1 Manrope,sans-serif;
    }

    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card:hover > span{
        transform:translate(2px,-2px);

        background:var(--ng-wow-accent);
        border-color:var(--ng-wow-accent);

        color:#17352D !important;
    }

    /* Each step gets a tiny status LED */
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card::after{
        content:"";

        position:absolute;
        top:12px;
        right:12px;

        width:4px;
        height:4px;
        border-radius:50%;

        background:rgba(183,213,50,.55);

        box-shadow:0 0 8px rgba(183,213,50,.25);
    }

    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-journey-card:hover::after{
        background:var(--ng-wow-accent);
        box-shadow:
            0 0 8px rgba(183,213,50,.65),
            0 0 18px rgba(183,213,50,.28);
    }
}

@media(prefers-reduced-motion:reduce){
    #ngWowMegaRoot [data-ng-wow-panel="sourcing"] .ng-wow-stage::after{
        animation:none !important;
        display:none !important;
    }
}
