
/* === Allstars Off-Canvas Menu === */
.allstars-ocm{
    position:relative;
    width:100%;
    min-height:100vh;
    background:#000000;
    color:#FFFFFF;
    overflow:hidden;
    font-family:'Montserrat',"Montserrat Fallback", sans-serif;
}
.allstars-ocm::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:var(--alsocm-bg-url, none);
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
    opacity:0.4;
    pointer-events:none;
    z-index:0;
}
.allstars-ocm__inner{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:1fr 390px;
    gap:0;
    min-height:100vh;
}

/* === Left: big menu list === */
.allstars-ocm__menu{
    padding:120px 80px 80px 120px;
    display:flex;
    align-items:center;
}

/* === Mobile BOOK button (sits above the menu, hidden by default — the header's
   own CTA buttons cover desktop/tablet, so this only shows on small screens). */
.allstars-ocm__book{display:none;}
.allstars-ocm__list{
    list-style:none;
    margin:0;
    padding:0;
    width:100%;
    max-width:720px;
}
.allstars-ocm__item{
    position:relative;
    border-bottom:1px solid rgba(255,255,255,0.35);
}
.allstars-ocm__item:first-child{
    border-top:1px solid rgba(255,255,255,0.35);
}
.allstars-ocm__link{
    display:block;
    padding:18px 0;
    font-family:'Rajdhani', sans-serif;
    font-weight:500;
    font-size:77px;
    line-height:1;
    letter-spacing:0;
    text-transform:uppercase;
    color:#FFFFFF;
    text-decoration:none;
    transition:color .2s ease, transform .25s ease;
}
.allstars-ocm__link:hover,
.allstars-ocm__link:focus-visible{
    color:#C53322;
    transform:translateX(8px);
    outline:none;
}

/* === Hover sub-menu (Games) === */
.allstars-ocm__submenu{
    list-style:none;
    margin:0;
    padding:0;
    position:absolute;
    top:50%;
    left:100%;
    transform:translateY(-50%);
    padding-left:60px; /* visual gap, kept as padding so the hover area is unbroken */
    min-width:280px;
    display:flex;
    flex-direction:column;
    gap:12px;
    opacity:0;
    pointer-events:none;
    transition:opacity .2s ease, transform .25s ease;
    z-index:5;
}
/* Invisible bridge that extends the hover area over the gap between the menu link and the submenu */
.allstars-ocm__item.has-submenu::after{
    content:"";
    position:absolute;
    top:0;
    left:100%;
    width:60px;
    height:100%;
    background:transparent;
    pointer-events:none;
}
.allstars-ocm__item.has-submenu:hover::after,
.allstars-ocm__item.has-submenu:focus-within::after{
    pointer-events:auto;
}
.allstars-ocm__item.has-submenu:hover .allstars-ocm__submenu,
.allstars-ocm__item.has-submenu:focus-within .allstars-ocm__submenu{
    opacity:1;
    pointer-events:auto;
    transform:translateY(-50%) translateX(0);
}
.allstars-ocm__submenu a{
    display:inline-block;
    font-family:'Rajdhani', sans-serif;
    font-weight:500;
    font-size:22px;
    line-height:1.3;
    letter-spacing:0.5px;
    text-transform:uppercase;
    color:#FFFFFF;
    text-decoration:none;
    white-space:nowrap;
    transition:color .2s ease, transform .2s ease;
}
.allstars-ocm__submenu a:hover,
.allstars-ocm__submenu a:focus-visible{
    color:#C53322;
    transform:translateX(4px);
    outline:none;
}
.allstars-ocm__item.has-submenu > .allstars-ocm__link::after{
    content:"›"; /* single right-pointing chevron */
    display:inline-block;
    margin-left:20px;
    font-family:'Rajdhani', sans-serif;
    font-weight:500;
    font-size:64px;
    line-height:1;
    vertical-align:middle;
    opacity:0.7;
    transition:transform .25s ease, opacity .2s ease;
}
.allstars-ocm__item.has-submenu:hover > .allstars-ocm__link::after,
.allstars-ocm__item.has-submenu:focus-within > .allstars-ocm__link::after{
    opacity:1;
    transform:translateX(6px);
}

/* === Right: red venue panel (50% opacity background) === */
.allstars-ocm__panel{
    position:relative;
    background:rgba(206,56,39,0.5); /* #CE3827 @ 50% */
    color:#FFFFFF;
    padding:60px 40px;
    display:flex;
    align-items:center; /* vertically centre the inner block */
    justify-content:flex-start;
}
.allstars-ocm__panel-inner{
    display:flex;
    flex-direction:column;
    gap:32px;
    width:100%;
    max-width:330px;
}
.allstars-ocm__block-title,
.allstars-ocm__follow-title{
    font-family:'Montserrat',"Montserrat Fallback", sans-serif;
    font-weight:700;
    font-size:16px;
    line-height:1.2;
    letter-spacing:0.5px;
    text-transform:uppercase;
    margin:0 0 10px 0;
    color:#FFFFFF;
}
.allstars-ocm__follow-title{font-size:18px;}
.allstars-ocm__block-body,
.allstars-ocm__block-body p{
    font-family:'Montserrat',"Montserrat Fallback", sans-serif;
    font-weight:400;
    font-size:14px;
    line-height:1.5;
    color:#FFFFFF;
    margin:0;
}
.allstars-ocm__block-body p + p{margin-top:6px;}
.allstars-ocm__times p{white-space:pre-line;}

/* === Venue info block (mirrors the icon-row layout on the /contact/ card) === */
.allstars-ocm__info{display:flex;flex-direction:column;gap:18px;width:100%;}
.allstars-ocm__info-title{
    margin:0 0 6px 0;
    font-family:'Rajdhani', sans-serif;
    font-weight:700;
    font-size:24px;
    line-height:1.05;
    color:#FFFFFF;
    text-transform:uppercase;
    letter-spacing:0;
}
.allstars-ocm__info-row{
    display:grid;
    grid-template-columns:24px 1fr;
    gap:14px;
    align-items:start;
}
.allstars-ocm__info-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:24px;
    height:24px;
    color:#FFFFFF;
    flex-shrink:0;
}
.allstars-ocm__info-icon svg{display:block;width:24px;height:24px;}
.allstars-ocm__info-text,
.allstars-ocm__info-text p{
    margin:0;
    font-family:'Montserrat',"Montserrat Fallback", sans-serif;
    font-weight:400;
    font-size:14px;
    line-height:1.4;
    color:#FFFFFF;
}
.allstars-ocm__info-text p + p{margin-top:4px;}
.allstars-ocm__info-text a{color:#FFFFFF;text-decoration:none;border-bottom:1px solid rgba(255,255,255,0.35);transition:opacity .2s ease;}
.allstars-ocm__info-text a:hover{opacity:0.85;}
.allstars-ocm__info-text strong{font-weight:700;}
.allstars-ocm__info-row--times .allstars-ocm__info-text{display:flex;flex-direction:column;gap:6px;}

/* === Small nav (PRICES / FAQS / PRIVACY) === */
.allstars-ocm__smallnav ul{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-wrap:wrap;
    gap:18px;
}
.allstars-ocm__smallnav a{
    font-family:'Montserrat',"Montserrat Fallback", sans-serif;
    font-weight:500;
    font-size:14px;
    line-height:1;
    letter-spacing:0.5px;
    text-transform:uppercase;
    color:#FFFFFF;
    text-decoration:none;
    transition:opacity .2s ease;
}
.allstars-ocm__smallnav a:hover{opacity:0.75;}

/* === Follow Us socials === */
.allstars-ocm__socials{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-wrap:wrap;
    gap:18px;
}
.allstars-ocm__social{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:32px;
    color:#FFFFFF;
    text-decoration:none;
    transition:opacity .2s ease, transform .2s ease;
}
.allstars-ocm__social:hover{opacity:0.75;transform:scale(1.06);}
.allstars-ocm__social svg{width:24px;height:24px;display:block;}

/* === Remove the off-canvas WRAPPER container from layout entirely.
   `display:contents` makes the element disappear from the box tree (its children remain in flow,
   which is fine here because the off-canvas <nav> uses position:fixed when open and is hidden
   via aria-hidden/inert when closed). This is the only reliable way to kill the residual white
   strip below the header that was appearing on every page. === */
.elementor-element-2d77c8a{
    display:contents !important;
}
.elementor-element-2d77c8a > .e-con-inner{
    display:contents !important;
    height:0 !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
}
/* Belt + braces: also force the off-canvas widget itself to take zero layout space when closed.
   When the user opens it, Elementor flips aria-hidden="false" and the widget switches to its
   position:fixed overlay state — these rules don't touch that state. */
.elementor-element-9de9390{
    height:0 !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
}
.elementor-element-9de9390 .e-off-canvas[aria-hidden="true"]{
    display:none;
}

/* === Off-canvas widget body overrides (kill default padding on the wrapping container) === */
.elementor-element-9de9390 .e-off-canvas__main,
.elementor-element-9de9390 .e-off-canvas__content{
    padding:0 !important;
    background:#000000 !important;
}
.elementor-element-9de9390 .e-off-canvas__content > .e-con,
.elementor-element-9de9390 .e-off-canvas__content > .e-con > .e-con-inner{
    padding:0 !important;
    margin:0 !important;
    max-width:none !important;
    width:100% !important;
}
.elementor-element-9de9390 .e-off-canvas{
    --e-off-canvas-width:100% !important;
}

/* === Responsive === */
/* === Tablet, small desktops & below: stack panel under menu, drop submenu inline === */
/* The side-by-side submenu only fits cleanly above ~1500px without spilling into the panel. */
@media (max-width: 1499px){
    .allstars-ocm__inner{
        grid-template-columns:1fr;
        min-height:auto;
    }
    .allstars-ocm__menu{
        padding:100px 40px 40px 40px;
        display:block;
    }
    .allstars-ocm__list{max-width:none;}
    .allstars-ocm__link{font-size:56px;}
    .allstars-ocm__panel{
        padding:48px 40px;
        justify-content:flex-start;
    }
    .allstars-ocm__panel-inner{max-width:none;}

    /* Submenu: collapsed-by-default on tablet/mobile. The desktop :hover/:focus-within
       rules set transform/opacity/position, so we re-state with equal specificity and
       rely on cascade order to win. JS adds .is-open on the parent item when the user
       taps GAMES, and we transition max-height for a smooth expand. */
    .allstars-ocm__submenu,
    .allstars-ocm__item.has-submenu:hover .allstars-ocm__submenu,
    .allstars-ocm__item.has-submenu:focus-within .allstars-ocm__submenu{
        position:static;
        transform:none;
        top:auto;
        left:auto;
        opacity:0;
        pointer-events:none;
        max-height:0;
        padding:0 0 0 24px;
        margin:0;
        gap:10px;
        min-width:0;
        overflow:hidden;
        transition:max-height .3s ease, opacity .25s ease, padding .25s ease;
    }
    .allstars-ocm__item.has-submenu.is-open .allstars-ocm__submenu{
        opacity:1;
        pointer-events:auto;
        max-height:600px;
        padding:8px 0 18px 24px;
    }
    .allstars-ocm__submenu a{font-size:22px;}

    /* Kill the bridge — not needed when collapsed */
    .allstars-ocm__item.has-submenu::after{display:none;}

    /* Lock GAMES link in place — no hover translate. */
    .allstars-ocm__item.has-submenu > .allstars-ocm__link,
    .allstars-ocm__item.has-submenu > .allstars-ocm__link:hover,
    .allstars-ocm__item.has-submenu > .allstars-ocm__link:focus-visible{
        transform:none;
    }

    /* Chevron: right-pointing by default, rotates to down when .is-open is set. */
    .allstars-ocm__item.has-submenu > .allstars-ocm__link::after,
    .allstars-ocm__item.has-submenu:hover > .allstars-ocm__link::after,
    .allstars-ocm__item.has-submenu:focus-within > .allstars-ocm__link::after{
        transform:rotate(0deg);
        transform-origin:50% 55%;
        font-size:48px;
        opacity:0.7;
        margin-left:14px;
        transition:transform .25s ease, opacity .2s ease;
    }
    .allstars-ocm__item.has-submenu.is-open > .allstars-ocm__link::after{
        transform:rotate(90deg);
        opacity:1;
    }
}

/* === Mobile (small): big BOOK CTA + smaller menu links (≈20% smaller) === */
@media (max-width: 767px){
    /* BOOK button sits between the (hidden) close affordance and the menu list. */
    .allstars-ocm__book{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:100%;
        padding:14px 24px;
        margin:16px 0 28px 0;
        background:#C53322;
        color:#FFFFFF;
        font-family:'Rajdhani', sans-serif;
        font-weight:700;
        font-size:36px;
        line-height:1;
        letter-spacing:2px;
        text-transform:uppercase;
        text-decoration:none;
        border:2px solid #C53322;
        border-radius:8px;
        transition:background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
    }
    .allstars-ocm__book:hover,
    .allstars-ocm__book:focus-visible{
        background:transparent;
        color:#FFFFFF;
        transform:translateY(-1px);
        box-shadow:0 4px 14px rgba(197,51,34,0.4);
        outline:none;
    }

    .allstars-ocm__menu{padding:80px 24px 24px 24px;display:block;}
    /* Main menu links ≈20% smaller than the previous 42px. */
    .allstars-ocm__link{font-size:34px;padding:10px 0;}
    .allstars-ocm__item.has-submenu > .allstars-ocm__link::after,
    .allstars-ocm__item.has-submenu:hover > .allstars-ocm__link::after,
    .allstars-ocm__item.has-submenu:focus-within > .allstars-ocm__link::after{font-size:28px;margin-left:12px;}
    .allstars-ocm__submenu a{font-size:15px;}
    .allstars-ocm__panel{padding:32px 24px 60px 24px;}
}
/*# sourceURL=allstars-offcanvas-menu-inline-css */
