/*
|--------------------------------------------------------------------------
| SAN NICODEMO ABATE — DESKTOP MEGA MENU
|--------------------------------------------------------------------------
|
| Desktop-only navigation enhancement.
|
| IMPORTANT:
| - Existing navigation is left untouched below 1180px.
| - No JavaScript is required.
| - Dropdowns open with hover and keyboard focus-within.
|
|--------------------------------------------------------------------------
*/

.desktop-mega-nav {
    display: none;
}


@media (min-width: 1180px) {

    /* ---------------------------------------------------------------------
       SWITCH FROM LEGACY DESKTOP NAV TO MEGA NAV
       ------------------------------------------------------------------ */

    .site-header .nav-toggle {
        display: none !important;
    }

    .site-header .main-nav[data-nav-menu] {
        display: none !important;
    }

    .site-header-inner {
        position: relative;
        gap: 24px;
    }

    .desktop-mega-nav {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 7px;
        min-width: 0;
        margin-left: auto;
        font-size: .92rem;
    }

    .desktop-mega-nav,
    .desktop-mega-nav * {
        box-sizing: border-box;
    }

    .desktop-mega-direct,
    .desktop-mega-support,
    .desktop-mega-trigger,
    .desktop-mega-private {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 46px;
        border: 0;
        border-radius: 13px;
        padding: 0 15px;
        background: transparent;
        color: rgba(255, 255, 255, .92);
        font: inherit;
        font-weight: 800;
        line-height: 1.1;
        text-decoration: none;
        white-space: nowrap;
        cursor: pointer;
        transition:
            background-color .18s ease,
            color .18s ease,
            border-color .18s ease,
            transform .18s ease;
    }

    .desktop-mega-direct:hover,
    .desktop-mega-trigger:hover,
    .desktop-mega-group:focus-within > .desktop-mega-trigger,
    .desktop-mega-group:hover > .desktop-mega-trigger,
    .desktop-mega-direct:focus-visible,
    .desktop-mega-trigger:focus-visible {
        background: rgba(214, 169, 44, .11);
        color: #f3c85d;
        outline: none;
    }

    .desktop-mega-direct.active,
    .desktop-mega-group.active > .desktop-mega-trigger {
        background: rgba(214, 169, 44, .13);
        color: #f2c34f;
    }

    .desktop-mega-chevron {
        display: inline-block;
        margin-left: 7px;
        color: #dcb44c;
        font-size: 1rem;
        transform: translateY(-1px);
        transition: transform .18s ease;
    }

    .desktop-mega-group:hover .desktop-mega-chevron,
    .desktop-mega-group:focus-within .desktop-mega-chevron {
        transform: translateY(1px) rotate(180deg);
    }


    /* ---------------------------------------------------------------------
       DROPDOWN POSITIONING
       ------------------------------------------------------------------ */

    .desktop-mega-group {
        position: relative;
    }

    .desktop-mega-panel {
        position: absolute;
        top: calc(100% + 13px);
        z-index: 1200;
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
        transform: translateY(8px);
        transition:
            opacity .16s ease,
            transform .16s ease,
            visibility .16s ease;
    }

    .desktop-mega-group:hover > .desktop-mega-panel,
    .desktop-mega-group:focus-within > .desktop-mega-panel {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    /* Invisible hover bridge prevents the menu closing while the pointer
       travels from the trigger to the panel. */
    .desktop-mega-panel::before {
        content: "";
        position: absolute;
        top: -14px;
        left: 0;
        width: 100%;
        height: 15px;
    }

    .desktop-mega-panel-inner {
        overflow: hidden;
        border: 1px solid rgba(211, 170, 61, .24);
        border-radius: 20px;
        background:
            linear-gradient(145deg, #fffdf7 0%, #f7f2e7 100%);
        box-shadow:
            0 26px 70px rgba(3, 18, 30, .24),
            0 4px 14px rgba(3, 18, 30, .10);
    }


    /* ---------------------------------------------------------------------
       EXPLORE — THREE COLUMN MEGA MENU
       ------------------------------------------------------------------ */

    .desktop-mega-group-explore .desktop-mega-panel {
        left: 50%;
        width: min(820px, calc(100vw - 80px));
        transform: translate(-35%, 8px);
    }

    .desktop-mega-group-explore:hover > .desktop-mega-panel,
    .desktop-mega-group-explore:focus-within > .desktop-mega-panel {
        transform: translate(-35%, 0);
    }

    .desktop-mega-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        padding: 16px;
    }

    .desktop-mega-column {
        min-width: 0;
        padding: 8px 12px 10px;
    }

    .desktop-mega-column + .desktop-mega-column {
        border-left: 1px solid rgba(12, 34, 51, .09);
    }

    .desktop-mega-kicker {
        margin: 0 8px 9px;
        color: #a87908;
        font-size: .69rem;
        font-weight: 900;
        letter-spacing: .14em;
        text-transform: uppercase;
    }

    .desktop-mega-column > a {
        display: flex;
        flex-direction: column;
        gap: 3px;
        margin: 2px 0;
        border-radius: 12px;
        padding: 10px 11px;
        color: #10293c;
        text-decoration: none;
        transition:
            background-color .16s ease,
            transform .16s ease;
    }

    .desktop-mega-column > a strong {
        color: #0c263a;
        font-size: .86rem;
        line-height: 1.2;
    }

    .desktop-mega-column > a small {
        color: #6c7780;
        font-size: .69rem;
        line-height: 1.45;
    }

    .desktop-mega-column > a:hover,
    .desktop-mega-column > a:focus-visible,
    .desktop-mega-column > a.active {
        background: rgba(207, 162, 38, .11);
        outline: none;
        transform: translateX(2px);
    }

    .desktop-mega-column > a.active strong {
        color: #a97800;
    }

    .desktop-mega-highlight {
        display: flex;
        align-items: flex-start;
        gap: 9px;
        margin: 9px 7px 0;
        border: 1px solid rgba(191, 148, 34, .19);
        border-radius: 13px;
        padding: 11px 12px;
        background: rgba(255, 255, 255, .62);
    }

    .desktop-mega-highlight > span {
        color: #b68715;
        font-size: 1rem;
        line-height: 1.1;
    }

    .desktop-mega-highlight strong,
    .desktop-mega-highlight small {
        display: block;
    }

    .desktop-mega-highlight strong {
        margin-bottom: 3px;
        color: #173246;
        font-size: .73rem;
    }

    .desktop-mega-highlight small {
        color: #71808a;
        font-size: .65rem;
        line-height: 1.45;
    }


    /* ---------------------------------------------------------------------
       STATUE PROJECT — COMPACT DROPDOWN
       ------------------------------------------------------------------ */

    .desktop-mega-group-project .desktop-mega-panel {
        right: -30px;
        width: 410px;
    }

    .desktop-mega-project-list {
        display: grid;
        gap: 4px;
        padding: 11px;
    }

    .desktop-mega-project-list > a {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
        align-items: center;
        gap: 10px;
        border-radius: 12px;
        padding: 10px 11px;
        color: #0d273a;
        text-decoration: none;
        transition: background-color .16s ease, transform .16s ease;
    }

    .desktop-mega-project-list > a:hover,
    .desktop-mega-project-list > a:focus-visible,
    .desktop-mega-project-list > a.active {
        background: rgba(207, 162, 38, .11);
        outline: none;
        transform: translateX(2px);
    }

    .desktop-mega-project-icon {
        display: inline-flex;
        width: 34px;
        height: 34px;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(198, 150, 27, .20);
        border-radius: 50%;
        background: #fff8df;
        color: #a77708;
        font-size: .82rem;
        font-weight: 900;
    }

    .desktop-mega-project-list strong,
    .desktop-mega-project-list small {
        display: block;
    }

    .desktop-mega-project-list strong {
        margin-bottom: 2px;
        color: #102c40;
        font-size: .82rem;
    }

    .desktop-mega-project-list small {
        color: #6e7b84;
        font-size: .67rem;
        line-height: 1.42;
    }


    /* ---------------------------------------------------------------------
       SUPPORT, LANGUAGE, PRIVATE AREA
       ------------------------------------------------------------------ */

    .desktop-mega-support {
        border: 1px solid rgba(220, 177, 67, .32);
        background: rgba(213, 167, 42, .08);
        color: #f0c451;
    }

    .desktop-mega-support:hover,
    .desktop-mega-support:focus-visible,
    .desktop-mega-support.active {
        border-color: rgba(225, 184, 73, .62);
        background: rgba(213, 167, 42, .17);
        color: #ffd46b;
        outline: none;
    }

    .desktop-mega-language {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        margin-left: 2px;
        border-left: 1px solid rgba(255, 255, 255, .12);
        padding-left: 12px;
        color: rgba(255, 255, 255, .34);
        font-size: .72rem;
        font-weight: 900;
    }

    .desktop-mega-language a {
        display: inline-flex;
        min-width: 30px;
        min-height: 32px;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        color: rgba(255, 255, 255, .80);
        text-decoration: none;
    }

    .desktop-mega-language a:hover,
    .desktop-mega-language a:focus-visible,
    .desktop-mega-language a.active {
        background: rgba(213, 167, 42, .11);
        color: #f1c34e;
        outline: none;
    }

    .desktop-mega-private {
        margin-left: 3px;
        border: 1px solid rgba(212, 165, 42, .56);
        padding-inline: 18px;
        color: #f1c858;
    }

    .desktop-mega-private:hover,
    .desktop-mega-private:focus-visible {
        border-color: rgba(234, 195, 92, .92);
        background: rgba(213, 167, 42, .12);
        color: #ffda79;
        outline: none;
        transform: translateY(-1px);
    }


    /* ---------------------------------------------------------------------
       SLIGHTLY TIGHTER WIDE-LAPTOP MODE
       ------------------------------------------------------------------ */

    @media (max-width: 1420px) {

        .site-header-inner {
            gap: 16px;
        }

        .desktop-mega-nav {
            gap: 4px;
            font-size: .86rem;
        }

        .desktop-mega-direct,
        .desktop-mega-support,
        .desktop-mega-trigger,
        .desktop-mega-private {
            padding-inline: 11px;
        }

        .desktop-mega-private {
            padding-inline: 14px;
        }

        .desktop-mega-group-explore .desktop-mega-panel {
            width: min(760px, calc(100vw - 54px));
        }
    }
}