/* ========================================
   LAYERING HIERARCHY - Complete stacking context
   ======================================== */
#beta-banner { z-index: 4050 !important; position: sticky !important; top: 0 !important; }
.site-header { position: relative !important; z-index: 3900 !important; top: auto !important; }
.news-ticker-container { position: sticky !important; top: 48px !important; z-index: 999 !important; }
.ticker-top-row { z-index: 1000 !important; }
.ticker-scroller-row { z-index: 1001 !important; }
.nav-page-overlay { position: fixed !important; z-index: 4250 !important; }
.nav-dropdown-menu { position: fixed !important; z-index: 4300 !important; }
.main-nav .nav-menu, .offcanvas { z-index: 4280 !important; }
.offcanvas.open { z-index: 4290 !important; }
#video-bg-container { z-index: 0 !important; }

/* ========================================
   TICKER FULL-WIDTH BREAKOUT - EDGE TO EDGE
   ======================================== */
.news-ticker-container {
	position: sticky !important;
	top: 48px !important;
	width: 100vw !important;
	max-width: 100vw !important;
	display: flex !important;
	flex-direction: column !important;
	box-sizing: border-box !important;
	margin-left: calc(-50vw + 50%) !important;
	margin-right: calc(-50vw + 50%) !important;
	padding: 0 !important;
	left: 0 !important;
	right: 0 !important;
	overflow: visible !important;
}

/* ========================================
   TICKER ROW LAYOUTS - FULL WIDTH ON ALL DEVICES
   ======================================== */
.ticker-top-row {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	padding: 10px 15px !important;
	flex-wrap: nowrap !important;
	overflow-x: auto !important;
	overflow-y: hidden !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.ticker-scroller-row {
	display: flex !important;
	align-items: center !important;
	width: 100% !important;
	box-sizing: border-box !important;
	flex-wrap: nowrap !important;
	overflow: hidden !important;
	margin: 0 !important;
	height: 42px !important;
	background: linear-gradient(to bottom, rgba(120,255,180,0.22), rgba(40,140,90,0.18)) !important;
	border-top: 1px solid rgba(120, 255, 180, 0.25) !important;
	border-bottom: 1px solid rgba(120, 255, 180, 0.25) !important;
	box-shadow: inset 0 0 14px rgba(120,255,180,.35), 0 6px 18px rgba(0,0,0,.35) !important;
	backdrop-filter: blur(12px) !important;
	-webkit-backdrop-filter: blur(12px) !important;
	position: relative !important;
	z-index: 998 !important;
}

/* Ensure ticker content stretches full width */
.news-ticker-content {
	position: relative !important;
	width: 100% !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	padding: 0 !important;
	height: 42px !important;
	display: flex !important;
	align-items: center !important;
	overflow: hidden !important;
	left: 0 !important;
	right: 0 !important;
}

/* Start items off-screen to the right */
.ticker-section {
	width: max-content !important;
	min-width: 100% !important;
	box-sizing: border-box !important;
	display: none !important;
	align-items: center !important;
	position: relative !important;
}

.ticker-section::before {
	content: '' !important;
	position: absolute !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	pointer-events: none !important;
}

.ticker-section.active {
	display: flex !important;
}

.ticker-items {
	display: inline-flex !important;
	align-items: center !important;
	gap: 0 !important;
	white-space: nowrap !important;
	padding-left: 100% !important;
	margin: 0 !important;
	animation: ticker-glass 26s linear infinite !important;
	height: 100% !important;
	will-change: transform !important;
}

/* Ticker item spacing */
.ticker-item {
	margin-right: 0 !important;
}

/* Time/Date/Weather display */
.ticker-info {
	display: flex !important;
	align-items: center !important;
	gap: 0.5rem !important;
	font-size: 0.85rem !important;
	margin-right: 1rem !important;
}

.ticker-info .ticker-separator {
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	border: none !important;
	box-shadow: none !important;
	animation: none !important;
	opacity: 0.5 !important;
	font-weight: normal !important;
}

/* Flashing separator between items */
.ticker-separator {
	display: inline-flex !important;
	align-items: center !important;
	padding: 0.35rem 1.5rem !important;
	background: linear-gradient(135deg, rgba(120,255,180,0.45), rgba(40,140,90,0.4)) !important;
	border: 1.5px solid rgba(120,255,180,0.6) !important;
	border-radius: 8px !important;
	font-weight: 700 !important;
	font-size: 0.88rem !important;
	white-space: nowrap !important;
	margin-left: 8rem !important;
	margin-right: 8rem !important;
	animation: separator-flash 2s ease-in-out infinite !important;
	box-shadow: 0 0 15px rgba(120,255,180,0.6), inset 0 1px 2px rgba(255,255,255,0.2) !important;
}

.ticker-separator-lead {
	margin-left: 0 !important;
}

@keyframes separator-flash {
	0%, 100% { 
		opacity: 1; 
		box-shadow: 0 0 15px rgba(120,255,180,0.6), 0 0 25px rgba(120,255,180,0.4), inset 0 1px 2px rgba(255,255,255,0.2); 
		border-color: rgba(120,255,180,0.6);
		background: linear-gradient(135deg, rgba(120,255,180,0.45), rgba(40,140,90,0.4));
	}
	50% { 
		opacity: 0.75; 
		box-shadow: 0 0 30px rgba(120,255,180,0.9), 0 0 45px rgba(120,255,180,0.7), 0 0 60px rgba(120,255,180,0.5), inset 0 1px 3px rgba(255,255,255,0.3); 
		border-color: rgba(120,255,180,0.85);
		background: linear-gradient(135deg, rgba(120,255,180,0.6), rgba(40,140,90,0.55));
	}
}

/* Ticker item spacing */
.ticker-item {
	margin-right: 8rem !important; /* Gap after each item */
}

/* Flashing separator between items */
.ticker-separator {
	display: inline-flex !important;
	align-items: center !important;
	padding: 0.25rem 1rem !important;
	background: linear-gradient(135deg, rgba(120,255,180,0.25), rgba(40,140,90,0.22)) !important;
	border: 1px solid rgba(120,255,180,0.35) !important;
	border-radius: 6px !important;
	font-weight: 600 !important;
	font-size: 0.85rem !important;
	white-space: nowrap !important;
	margin-right: 8rem !important; /* Gap after separator */
	animation: separator-flash 2s ease-in-out infinite !important;
}

@keyframes separator-flash {
	0%, 100% { opacity: 1; box-shadow: 0 0 8px rgba(120,255,180,0.4); }
	50% { opacity: 0.6; box-shadow: 0 0 15px rgba(120,255,180,0.7); }
}

/* Duplicate content for seamless loop */
.ticker-items::after {
	content: attr(data-content) !important;
	display: inline-flex !important;
	gap: 2rem !important;
	padding-left: 2rem !important;
}

.ticker-item {
	margin: 0 !important;
	padding: 0 !important;
	display: inline-block !important;
}

.ticker-overlay-left,
.ticker-overlay-right {
	display: none !important;
}

@keyframes ticker-glass {
	0% { transform: translateX(0); }
	100% { transform: translateX(-100%); }
}

/* ========================================
   RESPONSIVE VIEWPORT FIXES
   ======================================== */

/* Ensure body has no horizontal overflow from ticker breakout */
body {
	overflow-x: hidden !important;
}

/* Tablet: fix overflow and void margin */
@media (min-width: 769px) and (max-width: 1024px) {
	.ticker-scroller-row {
		max-width: 100vw !important;
		width: 100% !important;
		height: 42px !important;
		box-sizing: border-box !important;
		display: flex !important;
	}
	
	.news-ticker-container {
		max-width: 100% !important;
		width: 100vw !important;
		overflow: hidden !important;
	}
	
	.news-ticker-content {
		width: 100% !important;
		height: 42px !important;
	}
	
	.ticker-section {
		width: 100% !important;
	}
}

/* Mobile: ensure scroller is visible and adjust padding */
@media (max-width: 768px) {
	/* Remove padding from content area to allow full-width marquee */
	.news-ticker-content {
		padding: 0 !important;
		width: 100% !important;
		box-sizing: border-box !important;
		position: relative !important;
		left: 0 !important;
		top: auto !important;
	}
	
	.ticker-top-row {
		padding: 8px 10px !important;
		gap: 8px !important;
	}
	
	/* Ensure scroller row is visible on mobile with glass effect */
	.ticker-scroller-row {
		display: flex !important;
		height: 42px !important;
		margin: 0 !important;
		position: relative !important;
		background: linear-gradient(135deg, rgba(120, 255, 180, 0.22) 0%, rgba(40, 140, 90, 0.18) 100%) !important;
		backdrop-filter: blur(12px) !important;
		-webkit-backdrop-filter: blur(12px) !important;
		border-top: 1px solid rgba(120, 255, 180, 0.25) !important;
		border-bottom: 1px solid rgba(120, 255, 180, 0.25) !important;
	}
	
	/* Fix ticker nav buttons on mobile - smaller and clearer */
	.news-ticker-nav {
		gap: 0.2rem !important;
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch !important;
	}
	
	.news-ticker-nav-item {
		font-size: 0.65rem !important;
		padding: 0.3rem 0.5rem !important;
		white-space: nowrap !important;
		flex-shrink: 0 !important;
		min-width: auto !important;
	}
	
	.news-ticker-nav-item i,
	.news-ticker-nav-item [class^="fa"] {
		font-size: 0.7rem !important;
		margin-right: 0.2rem !important;
	}
	
	/* Hide social media icons on mobile, only show date/weather */
	.ticker-social {
		display: none !important;
	}
	
	.ticker-info {
		font-size: 0.75rem !important;
	}
	
	.ticker-items {
		padding-left: 100% !important;
		animation: ticker-glass 26s linear infinite !important;
	}
	
	.ticker-item {
		padding: 0 !important;
		margin-right: 0 !important;
	}
	
	.ticker-section {
		display: none !important;
	}
	
	.ticker-section.active {
		display: flex !important;
	}
}

/* Tablet: adjust ticker padding */
@media (min-width: 769px) and (max-width: 1024px) {
	.ticker-items {
		padding: 0 12px !important;
	}
}
/* Header navigation refit: plain stroked text + ticker-matched glass menus. */
.navbar .navbar-nav {
    gap: clamp(0.35rem, 1vw, 1rem);
    align-items: center;
}

/* Viewport rebuild layer: reconstruct the desktop ticker concept for mobile/tablet instead of nudging legacy responsive stacks. */
@media (max-width: 1199.98px) {
    #beta-banner {
        align-items: center !important;
        background:
            linear-gradient(90deg, rgba(0, 57, 31, 0.98), rgba(5, 111, 58, 0.98), rgba(0, 57, 31, 0.98)) !important;
        border-bottom: 0 !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.14),
            inset 0 -1px 0 rgba(115, 255, 164, 0.24),
            0 2px 8px rgba(0, 37, 21, 0.26) !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: center !important;
        min-height: 34px !important;
        overflow: hidden !important;
        padding: 0.42rem 0.75rem !important;
        white-space: nowrap !important;
    }

    #beta-banner,
    #beta-banner * {
        color: #ffffff !important;
        line-height: 1.05 !important;
        text-shadow:
            -1px -1px 0 rgba(0, 46, 27, 0.82),
            1px 1px 0 rgba(0, 46, 27, 0.82),
            0 2px 8px rgba(0, 0, 0, 0.28) !important;
        white-space: nowrap !important;
    }

    .news-ticker-container {
        background:
            linear-gradient(180deg, rgba(6, 93, 50, 0.98), rgba(13, 127, 66, 0.94)) !important;
        border-top: 0 !important;
        border-bottom: 0 !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.12),
            inset 0 -1px 0 rgba(13, 206, 103, 0.2),
            0 7px 18px rgba(0, 55, 30, 0.2) !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        margin-bottom: 0 !important;
        margin-top: 0 !important;
        overflow: visible !important;
        padding: 0 !important;
        top: 34px !important;
    }

    .news-ticker-container .ticker-top-row {
        align-items: center !important;
        background: transparent !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex: 0 0 auto !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: clamp(0.25rem, 1.4vw, 0.7rem) !important;
        justify-content: space-between !important;
        margin: 0 !important;
        overflow: hidden !important;
        padding: 0.38rem clamp(0.55rem, 2vw, 1rem) 0.26rem !important;
        position: relative !important;
        width: 100% !important;
        z-index: 5 !important;
    }

    .news-ticker-container .ticker-widgets-left,
    .news-ticker-container .ticker-title-nav,
    .news-ticker-container .news-ticker-nav,
    .news-ticker-container .ticker-widgets-right,
    .news-ticker-container .ticker-social {
        align-items: center !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        min-width: 0 !important;
    }

    .news-ticker-container .ticker-title-nav {
        flex: 1 1 auto !important;
        justify-content: flex-end !important;
        overflow: hidden !important;
    }

    .news-ticker-container .news-ticker-nav {
        flex: 0 1 auto !important;
        gap: clamp(0.2rem, 0.9vw, 0.4rem) !important;
        justify-content: flex-end !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .news-ticker-container .ticker-scroller-row {
        display: flex !important;
        flex: 0 0 42px !important;
        height: 42px !important;
        margin: 0.02rem auto -21px !important;
        max-height: 42px !important;
        min-height: 42px !important;
        opacity: 1 !important;
        overflow: hidden !important;
        padding: 0.34rem 0.8rem !important;
        position: relative !important;
        transform: none !important;
        visibility: visible !important;
        width: calc(100vw - 18px) !important;
        z-index: 8 !important;
    }

    .news-ticker-container .news-ticker-content,
    .news-ticker-container .ticker-section.active,
    .news-ticker-container .ticker-items {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .page-header {
        padding-top: calc(var(--spacing-lg, 1.5rem) + 24px) !important;
    }

    #mobile-nav.offcanvas,
    .offcanvas,
    .mobile-nav,
    .mobile-menu,
    .mobile-submenu,
    .mobile-dropdown,
    .mobile-nav-list,
    .mobile-nav-list ul,
    .mobile-nav-list .submenu,
    .mobile-nav-list .dropdown-menu,
    .offcanvas .submenu,
    .offcanvas .dropdown-menu {
        background:
            linear-gradient(145deg, rgba(42, 184, 105, 0.34), rgba(5, 70, 42, 0.78)),
            radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.22), transparent 44%) !important;
        border-color: rgba(255, 255, 255, 0.2) !important;
        box-shadow:
            0 16px 34px rgba(0, 0, 0, 0.28),
            inset 0 1px 0 rgba(255, 255, 255, 0.22),
            inset 0 -1px 0 rgba(0, 70, 37, 0.3) !important;
    }

    @supports ((backdrop-filter: blur(15px)) or (-webkit-backdrop-filter: blur(15px))) {
        #mobile-nav.offcanvas,
        .offcanvas,
        .mobile-nav,
        .mobile-menu,
        .mobile-submenu,
        .mobile-dropdown,
        .mobile-nav-list ul,
        .mobile-nav-list .submenu,
        .mobile-nav-list .dropdown-menu,
        .offcanvas .submenu,
        .offcanvas .dropdown-menu {
            -webkit-backdrop-filter: blur(18px) saturate(150%);
            backdrop-filter: blur(18px) saturate(150%);
        }
    }

    #mobile-nav a,
    .offcanvas a,
    .mobile-nav-list a,
    .mobile-submenu a,
    .mobile-dropdown a {
        color: #f8fff7 !important;
        -webkit-text-stroke: 0.28px rgba(3, 48, 29, 0.9);
        text-shadow:
            -1px -1px 0 rgba(3, 48, 29, 0.78),
            1px 1px 0 rgba(3, 48, 29, 0.84),
            0 3px 10px rgba(0, 0, 0, 0.28) !important;
    }
}

@media (max-width: 767.98px) {
    #beta-banner {
        font-size: clamp(0.68rem, 2.75vw, 0.88rem) !important;
        min-height: 32px !important;
        padding-inline: 0.45rem !important;
        text-overflow: clip !important;
    }

    .news-ticker-container {
        top: 32px !important;
    }

    .news-ticker-container .ticker-top-row {
        min-height: 42px !important;
    }

    .news-ticker-container .ticker-info,
    .news-ticker-container .ticker-social,
    .news-ticker-container .ticker-widgets-right,
    .news-ticker-container .news-ticker-title {
        display: none !important;
    }

    .news-ticker-container .ticker-widgets-left {
        flex: 0 0 auto !important;
        gap: 0.28rem !important;
        max-width: 30vw !important;
        overflow: hidden !important;
    }

    .news-ticker-container .ticker-title-nav {
        max-width: 68vw !important;
    }

    .news-ticker-container .ticker-widget-btn,
    .news-ticker-container .news-ticker-nav-item {
        border-radius: 999px !important;
        flex: 0 0 28px !important;
        height: 28px !important;
        min-height: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        width: 28px !important;
    }

    .news-ticker-container .news-ticker-nav-item {
        color: transparent !important;
        font-size: 0 !important;
        overflow: hidden !important;
        position: relative !important;
        text-indent: -999px !important;
    }

    .news-ticker-container .news-ticker-nav-item::after {
        color: #ffffff !important;
        display: block !important;
        font-size: 13px !important;
        left: 50% !important;
        line-height: 1 !important;
        position: absolute !important;
        text-indent: 0 !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
    }
}

/* Mobile/offcanvas menu: same glass language as the desktop dropdowns. */
@media (max-width: 991.98px) {
    .offcanvas-overlay {
        background:
            radial-gradient(circle at 20% 10%, rgba(69, 255, 142, 0.22), transparent 36%),
            rgba(1, 24, 13, 0.55) !important;
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
    }

    #mobile-nav.offcanvas {
        background:
            linear-gradient(145deg, rgba(39, 178, 101, 0.38), rgba(5, 70, 42, 0.78)),
            radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.25), transparent 45%) !important;
        border-left: 1px solid rgba(255, 255, 255, 0.26) !important;
        box-shadow:
            -18px 0 42px rgba(0, 0, 0, 0.34),
            inset 1px 0 0 rgba(255, 255, 255, 0.24),
            inset -1px 0 0 rgba(0, 70, 37, 0.26) !important;
        color: #f8fff7 !important;
        overflow-y: auto !important;
    }

    @supports ((backdrop-filter: blur(16px)) or (-webkit-backdrop-filter: blur(16px))) {
        #mobile-nav.offcanvas {
            -webkit-backdrop-filter: blur(19px) saturate(155%);
            backdrop-filter: blur(19px) saturate(155%);
        }
    }

    #mobile-nav .offcanvas-close {
        background: rgba(255, 255, 255, 0.14) !important;
        border: 1px solid rgba(255, 255, 255, 0.22) !important;
        border-radius: 999px !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.25),
            0 8px 18px rgba(0, 0, 0, 0.2) !important;
        color: #ffffff !important;
        -webkit-text-stroke: 0.3px rgba(3, 48, 29, 0.9);
        text-shadow:
            -1px -1px 0 rgba(3, 48, 29, 0.82),
            1px 1px 0 rgba(3, 48, 29, 0.82),
            0 3px 10px rgba(0, 0, 0, 0.32) !important;
    }

    #mobile-nav .mobile-nav-list {
        padding: 0.8rem !important;
    }

    #mobile-nav .menu-section {
        color: rgba(226, 255, 235, 0.72) !important;
        font-family: "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif !important;
        font-size: 0.74rem !important;
        font-weight: 900 !important;
        letter-spacing: 0.12em !important;
        text-transform: uppercase !important;
        text-shadow: 0 2px 8px rgba(0, 0, 0, 0.28) !important;
    }

    #mobile-nav .mobile-nav-list > li > a {
        background: rgba(255, 255, 255, 0.08) !important;
        border: 1px solid rgba(255, 255, 255, 0.11) !important;
        border-radius: 14px !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.13),
            0 6px 14px rgba(0, 0, 0, 0.12) !important;
        color: #f8fff7 !important;
        font-family: "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif !important;
        font-weight: 900 !important;
        letter-spacing: 0.01em !important;
        margin: 0.26rem 0 !important;
        padding: 0.76rem 0.9rem !important;
        -webkit-text-stroke: 0.32px rgba(3, 48, 29, 0.92);
        text-shadow:
            -1px -1px 0 rgba(3, 48, 29, 0.86),
            1px -1px 0 rgba(3, 48, 29, 0.74),
            -1px 1px 0 rgba(3, 48, 29, 0.74),
            1px 1px 0 rgba(3, 48, 29, 0.86),
            0 3px 11px rgba(0, 0, 0, 0.28) !important;
    }

    #mobile-nav .mobile-nav-list > li > a:hover,
    #mobile-nav .mobile-nav-list > li > a:focus,
    #mobile-nav .mobile-nav-list > li > a.active {
        background:
            linear-gradient(90deg, rgba(255, 255, 255, 0.2), rgba(128, 255, 171, 0.16)) !important;
        border-color: rgba(255, 255, 255, 0.22) !important;
        color: #ffffff !important;
        outline: none !important;
    }
}

/* Ticker scroller: glass tube with rounded ends rather than a flat strip. */
.news-ticker-container .ticker-scroller-row {
    position: relative !important;
    width: min(100vw, calc(100vw - 18px)) !important;
    margin: 0.2rem auto 0.32rem !important;
    padding: 0.32rem 1rem !important;
    min-height: 34px !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    border-radius: 999px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.04) 42%, rgba(0, 93, 50, 0.18)),
        linear-gradient(90deg, rgba(15, 114, 65, 0.55), rgba(55, 210, 121, 0.34), rgba(15, 114, 65, 0.55)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.45),
        inset 0 -2px 8px rgba(0, 57, 31, 0.32),
        0 7px 18px rgba(0, 0, 0, 0.18),
        0 0 0 1px rgba(19, 227, 113, 0.12) !important;
    overflow: hidden !important;
}

@supports ((backdrop-filter: blur(14px)) or (-webkit-backdrop-filter: blur(14px))) {
    .news-ticker-container .ticker-scroller-row {
        -webkit-backdrop-filter: blur(13px) saturate(145%);
        backdrop-filter: blur(13px) saturate(145%);
    }
}

.news-ticker-container .ticker-scroller-row::before,
.news-ticker-container .ticker-scroller-row::after {
    content: "";
    position: absolute;
    top: 3px;
    bottom: 3px;
    width: 54px;
    border-radius: 999px;
    pointer-events: none;
    z-index: 4;
}

.news-ticker-container .ticker-scroller-row::before {
    left: 4px;
    background:
        radial-gradient(circle at 18px 50%, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.08) 42%, transparent 70%),
        linear-gradient(90deg, rgba(4, 85, 48, 0.48), transparent);
}

.news-ticker-container .ticker-scroller-row::after {
    right: 4px;
    background:
        radial-gradient(circle at calc(100% - 18px) 50%, rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0.08) 42%, transparent 70%),
        linear-gradient(270deg, rgba(4, 85, 48, 0.48), transparent);
}

.news-ticker-container .news-ticker-content,
.news-ticker-container .ticker-section,
.news-ticker-container .ticker-items {
    background: transparent !important;
}

.news-ticker-container .ticker-items {
    padding: 0 64px !important;
    line-height: 1.55 !important;
}

.news-ticker-container .ticker-fade-left,
.news-ticker-container .ticker-fade-right {
    display: none !important;
}

@media (max-width: 767.98px) {
    .news-ticker-container .ticker-scroller-row {
        width: calc(100vw - 12px) !important;
        min-height: 31px !important;
        padding-inline: 0.42rem !important;
    }

    .news-ticker-container .ticker-items {
        padding: 0 44px !important;
    }
}

/* Mobile ticker toolbar compact mode: keep a single row above the glass tube. */
@media (max-width: 767.98px) {
    .news-ticker-container .ticker-top-row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: nowrap !important;
        gap: 3px !important;
        height: 30px !important;
        max-height: 30px !important;
        min-height: 28px !important;
        padding: 4px 5px !important;
        overflow: hidden !important;
    }

    .news-ticker-container .ticker-widgets-left,
    .news-ticker-container .ticker-widgets-right,
    .news-ticker-container .ticker-social,
    .news-ticker-container .news-ticker-nav {
        align-items: center !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 2px !important;
        min-width: 0 !important;
    }

    .news-ticker-container .ticker-title-nav {
        align-items: center !important;
        display: flex !important;
        flex: 1 1 auto !important;
        justify-content: center !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    .news-ticker-container .news-ticker-title,
    .news-ticker-container .ticker-info,
    .news-ticker-container .ticker-widgets-right,
    .news-ticker-container .ticker-social {
        display: none !important;
    }

    .news-ticker-container .ticker-widget-btn,
    .news-ticker-container .ticker-social-icon,
    .news-ticker-container .news-ticker-nav-item {
        align-items: center !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        display: inline-flex !important;
        flex: 0 0 21px !important;
        height: 21px !important;
        justify-content: center !important;
        min-height: 21px !important;
        min-width: 21px !important;
        padding: 0 !important;
        width: 21px !important;
    }

    .news-ticker-container .ticker-widget-btn i,
    .news-ticker-container .ticker-social-icon i {
        font-size: 10.5px !important;
        line-height: 1 !important;
    }

    .news-ticker-container .ticker-widget-btn .badge {
        font-size: 8px !important;
        min-width: 12px !important;
        padding: 1px 3px !important;
        right: -4px !important;
        top: -4px !important;
    }

    .news-ticker-container .news-ticker-nav-item {
        color: transparent !important;
        font-size: 0 !important;
        overflow: hidden !important;
        position: relative !important;
        text-indent: -999px !important;
    }

    .news-ticker-container .news-ticker-nav-item::after {
        color: #ffffff !important;
        display: block !important;
        font-size: 11px !important;
        left: 50% !important;
        line-height: 1 !important;
        position: absolute !important;
        text-indent: 0 !important;
        text-shadow:
            -1px -1px 0 rgba(3, 48, 29, 0.78),
            1px 1px 0 rgba(3, 48, 29, 0.78),
            0 2px 7px rgba(0, 0, 0, 0.32) !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
    }

    .news-ticker-container .news-ticker-nav-item[data-target="announcements"]::after {
        content: "📣";
    }

    .news-ticker-container .news-ticker-nav-item[data-target="matches"]::after {
        content: "⚽";
    }

    .news-ticker-container .news-ticker-nav-item[data-target="training"]::after {
        content: "🏋";
    }

    .news-ticker-container .news-ticker-nav-item[data-target="other-events"]::after {
        content: "📅";
    }

    .news-ticker-container .ticker-social {
        display: none !important;
    }

    .news-ticker-container .ticker-widgets-left {
        flex: 0 0 auto !important;
    }
}

@media (max-width: 359.98px) {
    .news-ticker-container .ticker-widget-btn,
    .news-ticker-container .ticker-social-icon,
    .news-ticker-container .news-ticker-nav-item {
        flex-basis: 19px !important;
        height: 19px !important;
        min-height: 19px !important;
        min-width: 19px !important;
        width: 19px !important;
    }

    .news-ticker-container .ticker-widget-btn i,
    .news-ticker-container .ticker-social-icon i {
        font-size: 9.5px !important;
    }
}

/* Tablet/mobile correction: force the tube row to exist and sit directly under the toolbar. */
@media (max-width: 1199.98px) {
    .news-ticker-container .ticker-scroller-row {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        max-height: none !important;
        clear: both !important;
    }

    .news-ticker-container .news-ticker-content,
    .news-ticker-container .ticker-section.active,
    .news-ticker-container .ticker-items {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

.navbar .navbar-nav .nav-link,
.navbar .navbar-nav .dropdown-toggle,
.navbar .navbar-nav .nav-item > a {
    background: transparent !important;
    border: 0 !important;
    border-radius: 999px;
    box-shadow: none !important;
    color: #f8fff7 !important;
    font-family: "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif;
    font-size: clamp(0.95rem, 0.72rem + 0.42vw, 1.12rem);
    font-weight: 900;
    letter-spacing: 0.01em;
    line-height: 1.15;
    padding: 0.45rem 0.72rem !important;
    text-decoration: none !important;
    -webkit-text-stroke: 0.38px rgba(4, 54, 30, 0.9);
    text-shadow:
        -1px -1px 0 rgba(4, 54, 30, 0.9),
        1px -1px 0 rgba(4, 54, 30, 0.75),
        -1px 1px 0 rgba(4, 54, 30, 0.75),
        1px 1px 0 rgba(4, 54, 30, 0.9),
        0 4px 12px rgba(0, 0, 0, 0.32);
    transition: color 160ms ease, background 160ms ease, transform 160ms ease, text-shadow 160ms ease;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link:focus,
.navbar .navbar-nav .dropdown.show > .nav-link,
.navbar .navbar-nav .dropdown.show > .dropdown-toggle {
    background: rgba(255, 255, 255, 0.11) !important;
    color: #ffffff !important;
    outline: none;
    transform: translateY(-1px);
    text-shadow:
        -1px -1px 0 rgba(0, 70, 37, 0.95),
        1px -1px 0 rgba(0, 70, 37, 0.85),
        -1px 1px 0 rgba(0, 70, 37, 0.85),
        1px 1px 0 rgba(0, 70, 37, 0.95),
        0 6px 18px rgba(0, 0, 0, 0.42),
        0 0 18px rgba(137, 255, 174, 0.28);
}

.navbar .navbar-nav .dropdown-toggle::after {
    border-top-color: rgba(255, 255, 255, 0.92);
    filter: drop-shadow(0 1px 0 rgba(0, 53, 31, 0.9));
    margin-left: 0.42rem;
}

.navbar .dropdown-menu {
    background:
        linear-gradient(145deg, rgba(43, 185, 107, 0.34), rgba(7, 83, 49, 0.72)),
        radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.22), transparent 42%);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 18px;
    box-shadow:
        0 18px 36px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.24),
        inset 0 -1px 0 rgba(0, 75, 42, 0.35);
    margin-top: 0.62rem;
    min-width: 215px;
    padding: 0.62rem;
    overflow: visible;
}

@supports ((backdrop-filter: blur(14px)) or (-webkit-backdrop-filter: blur(14px))) {
    .navbar .dropdown-menu {
        -webkit-backdrop-filter: blur(18px) saturate(150%);
        backdrop-filter: blur(18px) saturate(150%);
    }
}

.navbar .dropdown-menu::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent),
        linear-gradient(180deg, rgba(255, 255, 255, 0.16), transparent 38%);
    opacity: 0.7;
}

.navbar .dropdown-item {
    background: transparent !important;
    border-radius: 12px;
    color: #f8fff7 !important;
    font-family: "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif;
    font-weight: 900;
    letter-spacing: 0.01em;
    padding: 0.72rem 0.86rem;
    position: relative;
    -webkit-text-stroke: 0.32px rgba(4, 54, 30, 0.86);
    text-shadow:
        -1px -1px 0 rgba(4, 54, 30, 0.78),
        1px 1px 0 rgba(4, 54, 30, 0.88),
        0 3px 10px rgba(0, 0, 0, 0.32);
    transition: background 160ms ease, color 160ms ease, transform 160ms ease;
    z-index: 1;
}

.navbar .dropdown-item:hover,
.navbar .dropdown-item:focus {
    background: rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important;
    outline: none;
    transform: translateX(3px);
}

@media (max-width: 991.98px) {
    .navbar .navbar-nav {
        align-items: stretch;
        gap: 0.18rem;
    }

    .navbar .navbar-nav .nav-link,
    .navbar .navbar-nav .dropdown-toggle,
    .navbar .navbar-nav .nav-item > a {
        padding: 0.58rem 0.45rem !important;
    }

    .navbar .dropdown-menu {
        margin: 0.25rem 0 0.65rem;
        min-width: 100%;
    }
}

/* Actual desktop header menu family: open text links, no bulky button blocks. */
@media (min-width: 992px) {
    .site-header nav.main-nav > ul.nav-menu {
        align-items: center !important;
        display: flex !important;
        gap: clamp(1.25rem, 1.9vw, 2.45rem) !important;
    }

    .site-header nav.main-nav > ul.nav-menu > li {
        margin: 0 !important;
    }

    .site-header nav.main-nav > ul.nav-menu > li > a,
    .site-header nav.main-nav > ul.nav-menu > li > .nav-dropdown-toggle {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        color: #f8fff7 !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 0.38rem !important;
        font-family: "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif !important;
        font-size: clamp(1rem, 0.72rem + 0.48vw, 1.18rem) !important;
        font-weight: 900 !important;
        letter-spacing: 0.01em !important;
        line-height: 1.05 !important;
        padding: 0.28rem 0 !important;
        position: relative !important;
        text-decoration: none !important;
        -webkit-text-stroke: 0.38px rgba(4, 54, 30, 0.94);
        text-shadow:
            -1px -1px 0 rgba(4, 54, 30, 0.96),
            1px -1px 0 rgba(4, 54, 30, 0.82),
            -1px 1px 0 rgba(4, 54, 30, 0.82),
            1px 1px 0 rgba(4, 54, 30, 0.96),
            0 4px 13px rgba(0, 0, 0, 0.34) !important;
        transform: none !important;
    }

    .site-header nav.main-nav > ul.nav-menu > li > a::before,
    .site-header nav.main-nav > ul.nav-menu > li > .nav-dropdown-toggle::before {
        display: none !important;
    }

    .site-header nav.main-nav > ul.nav-menu > li > a::after,
    .site-header nav.main-nav > ul.nav-menu > li > .nav-dropdown-toggle::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -0.36rem;
        height: 2px;
        border-radius: 999px;
        background: linear-gradient(90deg, transparent, rgba(229, 255, 236, 0.92), transparent);
        box-shadow: 0 0 14px rgba(108, 255, 157, 0.32);
        opacity: 0;
        transform: scaleX(0.45);
        transition: opacity 160ms ease, transform 160ms ease;
    }

    .site-header nav.main-nav > ul.nav-menu > li > a:hover,
    .site-header nav.main-nav > ul.nav-menu > li > a:focus,
    .site-header nav.main-nav > ul.nav-menu > li.active > a,
    .site-header nav.main-nav > ul.nav-menu > li.open > a,
    .site-header nav.main-nav > ul.nav-menu > li.nav-dropdown:hover > .nav-dropdown-toggle,
    .site-header nav.main-nav > ul.nav-menu > li.nav-dropdown:focus-within > .nav-dropdown-toggle {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        color: #ffffff !important;
        outline: none !important;
        transform: translateY(-1px) !important;
        text-shadow:
            -1px -1px 0 rgba(0, 70, 37, 0.98),
            1px -1px 0 rgba(0, 70, 37, 0.9),
            -1px 1px 0 rgba(0, 70, 37, 0.9),
            1px 1px 0 rgba(0, 70, 37, 0.98),
            0 6px 19px rgba(0, 0, 0, 0.44),
            0 0 18px rgba(154, 255, 183, 0.3) !important;
    }

    .site-header nav.main-nav > ul.nav-menu > li > a:hover::after,
    .site-header nav.main-nav > ul.nav-menu > li > a:focus::after,
    .site-header nav.main-nav > ul.nav-menu > li.active > a::after,
    .site-header nav.main-nav > ul.nav-menu > li.nav-dropdown:hover > .nav-dropdown-toggle::after,
    .site-header nav.main-nav > ul.nav-menu > li.nav-dropdown:focus-within > .nav-dropdown-toggle::after {
        opacity: 1;
        transform: scaleX(1);
    }

    .site-header .nav-dropdown-menu {
        background:
            linear-gradient(145deg, rgba(43, 185, 107, 0.36), rgba(7, 83, 49, 0.7)),
            radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.24), transparent 44%) !important;
        border: 1px solid rgba(255, 255, 255, 0.24) !important;
        border-radius: 18px !important;
        box-shadow:
            0 18px 38px rgba(0, 0, 0, 0.34),
            inset 0 1px 0 rgba(255, 255, 255, 0.26),
            inset 0 -1px 0 rgba(0, 75, 42, 0.35) !important;
        list-style: none !important;
        margin-top: 0.72rem !important;
        min-width: 230px !important;
        padding: 0.62rem !important;
        overflow: hidden !important;
    }

    .site-header .nav-dropdown {
        position: relative !important;
    }

    .site-header .nav-dropdown > .nav-dropdown-menu {
        position: absolute !important;
        top: calc(100% + 0.48rem) !important;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%) translateY(0) !important;
    }

    .site-header .nav-dropdown:hover > .nav-dropdown-menu,
    .site-header .nav-dropdown:focus-within > .nav-dropdown-menu {
        transform: translateX(-50%) translateY(0) !important;
    }

    @supports ((backdrop-filter: blur(14px)) or (-webkit-backdrop-filter: blur(14px))) {
        .site-header .nav-dropdown-menu {
            -webkit-backdrop-filter: blur(18px) saturate(150%);
            backdrop-filter: blur(18px) saturate(150%);
        }
    }

    .site-header .nav-dropdown-menu > li {
        margin: 0 !important;
    }

    .site-header .nav-dropdown-menu a {
        background: transparent !important;
        border: 0 !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        color: #f8fff7 !important;
        display: block !important;
        font-family: "Trebuchet MS", "Gill Sans", "Segoe UI", sans-serif !important;
        font-size: 1rem !important;
        font-weight: 900 !important;
        letter-spacing: 0.01em !important;
        padding: 0.72rem 0.86rem !important;
        text-decoration: none !important;
        -webkit-text-stroke: 0.32px rgba(4, 54, 30, 0.86);
        text-shadow:
            -1px -1px 0 rgba(4, 54, 30, 0.78),
            1px 1px 0 rgba(4, 54, 30, 0.88),
            0 3px 10px rgba(0, 0, 0, 0.32) !important;
        transition: background 160ms ease, color 160ms ease, transform 160ms ease;
    }

    .site-header .nav-dropdown-menu a:hover,
    .site-header .nav-dropdown-menu a:focus {
        background:
            linear-gradient(90deg, rgba(255, 255, 255, 0.18), rgba(118, 255, 165, 0.14)) !important;
        color: #ffffff !important;
        outline: none !important;
        transform: translateX(3px) !important;
    }
}

/* Last-word responsive ticker correction: preserve the desktop tube, but keep mobile/tablet from inheriting stacked legacy rows. */
@media (max-width: 767.98px) {
    .news-ticker-container {
        row-gap: 0 !important;
        box-shadow: none !important;
        margin-bottom: -1px !important;
        min-height: 0 !important;
        padding-bottom: 0 !important;
    }

    #beta-banner {
        align-items: center !important;
        background:
            linear-gradient(90deg, rgba(1, 72, 38, 0.98), rgba(3, 110, 55, 0.96), rgba(1, 72, 38, 0.98)) !important;
        border-bottom: 1px solid rgba(100, 255, 157, 0.28) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.12),
            0 2px 8px rgba(0, 45, 24, 0.28) !important;
        box-sizing: border-box !important;
        color: #ffffff !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        font-size: clamp(0.78rem, 2.9vw, 0.98rem) !important;
        font-weight: 900 !important;
        gap: 0.45rem !important;
        justify-content: center !important;
        line-height: 1.05 !important;
        min-height: 34px !important;
        overflow: hidden !important;
        padding: 0.42rem 0.62rem !important;
        text-align: center !important;
        text-shadow:
            -1px -1px 0 rgba(0, 50, 28, 0.82),
            1px 1px 0 rgba(0, 50, 28, 0.82),
            0 2px 7px rgba(0, 0, 0, 0.24) !important;
        white-space: nowrap !important;
    }

    #beta-banner * {
        display: inline !important;
        flex: 0 1 auto !important;
        min-width: 0 !important;
        white-space: nowrap !important;
    }

    .news-ticker-container .ticker-top-row {
        align-items: center !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex: 0 0 30px !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 2px !important;
        height: 34px !important;
        max-height: 34px !important;
        min-height: 34px !important;
        justify-content: space-between !important;
        margin: 0 !important;
        overflow: hidden !important;
        padding: 3px 6px 2px !important;
        position: relative !important;
        width: 100% !important;
        z-index: 3 !important;
    }

    .news-ticker-container .ticker-top-row > * {
        margin-bottom: 0 !important;
        margin-top: 0 !important;
        min-height: 0 !important;
    }

    .news-ticker-container .ticker-widgets-left {
        display: inline-flex !important;
        flex: 0 0 auto !important;
        gap: 2px !important;
        max-width: 86px !important;
        overflow: hidden !important;
    }

    .news-ticker-container .ticker-title-nav {
        display: inline-flex !important;
        flex: 0 1 auto !important;
        justify-content: flex-end !important;
        max-width: calc(100vw - 100px) !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    .news-ticker-container .news-ticker-nav {
        display: inline-flex !important;
        flex: 0 0 auto !important;
        flex-wrap: nowrap !important;
        gap: 2px !important;
        justify-content: flex-end !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .news-ticker-container .ticker-info,
    .news-ticker-container .ticker-social,
    .news-ticker-container .ticker-widgets-right,
    .news-ticker-container .news-ticker-title {
        display: none !important;
    }

    .news-ticker-container .ticker-widget-btn,
    .news-ticker-container .news-ticker-nav-item {
        box-sizing: border-box !important;
        display: inline-flex !important;
        flex: 0 0 24px !important;
        height: 24px !important;
        min-height: 24px !important;
        min-width: 24px !important;
        padding: 0 !important;
        width: 24px !important;
    }

    .news-ticker-container .ticker-scroller-row {
        display: flex !important;
        flex: 0 0 42px !important;
        height: 42px !important;
        margin: -4px auto -22px !important;
        max-height: 42px !important;
        min-height: 42px !important;
        padding-block: 0.36rem !important;
        position: relative !important;
        transform: translateY(0) !important;
        visibility: visible !important;
        width: calc(100vw - 16px) !important;
        z-index: 6 !important;
    }

    .page-header {
        padding-top: calc(var(--spacing-lg, 1.5rem) + 18px) !important;
    }

    .news-ticker-container .news-ticker-content,
    .news-ticker-container .ticker-section.active,
    .news-ticker-container .ticker-items {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    #beta-banner {
        background:
            linear-gradient(90deg, rgba(1, 72, 38, 0.98), rgba(3, 110, 55, 0.96), rgba(1, 72, 38, 0.98)) !important;
        border-bottom: 1px solid rgba(100, 255, 157, 0.28) !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        font-size: clamp(0.86rem, 1.5vw, 1rem) !important;
        justify-content: center !important;
        line-height: 1.1 !important;
        min-height: 34px !important;
        overflow: hidden !important;
        padding: 0.42rem 0.8rem !important;
        white-space: nowrap !important;
    }

    .news-ticker-container .ticker-top-row {
        flex-wrap: nowrap !important;
        height: 38px !important;
        max-height: 38px !important;
        min-height: 38px !important;
        overflow: hidden !important;
    }

    .news-ticker-container .ticker-scroller-row {
        display: flex !important;
        height: 42px !important;
        margin: -4px auto -20px !important;
        max-height: 42px !important;
        min-height: 42px !important;
        opacity: 1 !important;
        overflow: hidden !important;
        padding-block: 0.36rem !important;
        transform: none !important;
        visibility: visible !important;
        width: calc(100vw - 18px) !important;
        z-index: 6 !important;
    }

    .page-header {
        padding-top: calc(var(--spacing-lg, 1.5rem) + 16px) !important;
    }

    .news-ticker-container .news-ticker-content,
    .news-ticker-container .ticker-section.active,
    .news-ticker-container .ticker-items {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* Last-word desktop dropdown correction: keep popups attached to their parent item. */
@media (min-width: 992px) {
    .site-header .main-nav .nav-menu > li.nav-dropdown {
        position: relative !important;
    }

    .site-header .main-nav .nav-menu > li.nav-dropdown > ul.nav-dropdown-menu {
        position: absolute !important;
        top: calc(100% + 0.52rem) !important;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%) !important;
        width: max-content !important;
        max-width: min(280px, calc(100vw - 32px)) !important;
        min-width: 218px !important;
        background:
            linear-gradient(140deg, rgba(38, 181, 103, 0.36), rgba(8, 82, 48, 0.68)),
            radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.26), transparent 46%) !important;
        border: 1px solid rgba(255, 255, 255, 0.26) !important;
        border-radius: 18px !important;
        box-shadow:
            0 16px 32px rgba(0, 0, 0, 0.28),
            0 4px 10px rgba(0, 70, 37, 0.18),
            inset 0 1px 0 rgba(255, 255, 255, 0.32),
            inset 0 -1px 0 rgba(2, 67, 38, 0.34) !important;
        padding: 0.54rem !important;
    }

    @supports ((backdrop-filter: blur(16px)) or (-webkit-backdrop-filter: blur(16px))) {
        .site-header .main-nav .nav-menu > li.nav-dropdown > ul.nav-dropdown-menu {
            -webkit-backdrop-filter: blur(18px) saturate(155%);
            backdrop-filter: blur(18px) saturate(155%);
        }
    }

    .site-header .main-nav .nav-menu > li.nav-dropdown > ul.nav-dropdown-menu a {
        color: #f6fff8 !important;
        padding: 0.62rem 0.78rem !important;
        -webkit-text-stroke: 0.34px rgba(2, 45, 27, 0.95);
        text-shadow:
            -1px -1px 0 rgba(2, 45, 27, 0.92),
            1px -1px 0 rgba(2, 45, 27, 0.78),
            -1px 1px 0 rgba(2, 45, 27, 0.78),
            1px 1px 0 rgba(2, 45, 27, 0.92),
            0 3px 11px rgba(0, 0, 0, 0.3) !important;
    }
}

/* FINAL LAST-WORD VIEWPORT REBUILD: mobile/tablet follows the desktop concept without legacy row stacking. */
@media (max-width: 1199.98px) {
    body #beta-banner {
        align-items: center !important;
        background:
            linear-gradient(90deg, rgba(0, 57, 31, 0.98), rgba(5, 111, 58, 0.98), rgba(0, 57, 31, 0.98)) !important;
        border: 0 !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.14),
            inset 0 -1px 0 rgba(115, 255, 164, 0.24),
            0 2px 8px rgba(0, 37, 21, 0.26) !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: center !important;
        min-height: 34px !important;
        overflow: hidden !important;
        padding: 0.42rem 0.75rem !important;
        white-space: nowrap !important;
    }

    body #beta-banner,
    body #beta-banner * {
        color: #ffffff !important;
        line-height: 1.05 !important;
        text-shadow:
            -1px -1px 0 rgba(0, 46, 27, 0.82),
            1px 1px 0 rgba(0, 46, 27, 0.82),
            0 2px 8px rgba(0, 0, 0, 0.28) !important;
        white-space: nowrap !important;
    }

    body .news-ticker-container {
        background:
            linear-gradient(180deg, rgba(6, 93, 50, 0.98), rgba(13, 127, 66, 0.94)) !important;
        border: 0 !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.12),
            inset 0 -1px 0 rgba(13, 206, 103, 0.2),
            0 7px 18px rgba(0, 55, 30, 0.2) !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        margin-bottom: 0 !important;
        margin-top: 0 !important;
        overflow: visible !important;
        padding: 0 !important;
        top: 34px !important;
    }

    body .news-ticker-container .ticker-top-row {
        align-items: center !important;
        background: transparent !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex: 0 0 auto !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: clamp(0.25rem, 1.4vw, 0.7rem) !important;
        justify-content: space-between !important;
        margin: 0 !important;
        min-height: 42px !important;
        overflow: hidden !important;
        padding: 0.38rem clamp(0.55rem, 2vw, 1rem) 0.26rem !important;
        position: relative !important;
        width: 100% !important;
        z-index: 5 !important;
    }

    body .news-ticker-container .ticker-widgets-left,
    body .news-ticker-container .ticker-title-nav,
    body .news-ticker-container .news-ticker-nav,
    body .news-ticker-container .ticker-widgets-right,
    body .news-ticker-container .ticker-social {
        align-items: center !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        min-width: 0 !important;
    }

    body .news-ticker-container .ticker-title-nav {
        flex: 1 1 auto !important;
        justify-content: flex-end !important;
        overflow: hidden !important;
    }

    body .news-ticker-container .news-ticker-nav {
        flex: 0 1 auto !important;
        gap: clamp(0.2rem, 0.9vw, 0.4rem) !important;
        justify-content: flex-end !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    body .news-ticker-container .ticker-scroller-row {
        display: flex !important;
        flex: 0 0 42px !important;
        height: 42px !important;
        margin: 0.02rem auto -21px !important;
        max-height: 42px !important;
        min-height: 42px !important;
        opacity: 1 !important;
        overflow: hidden !important;
        padding: 0.34rem 0.8rem !important;
        position: relative !important;
        transform: none !important;
        visibility: visible !important;
        width: calc(100vw - 18px) !important;
        z-index: 8 !important;
    }

    body .news-ticker-container .news-ticker-content,
    body .news-ticker-container .ticker-section.active,
    body .news-ticker-container .ticker-items {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    body .page-header {
        padding-top: calc(var(--spacing-lg, 1.5rem) + 24px) !important;
    }

    body #mobile-nav.offcanvas,
    body .offcanvas,
    body .mobile-nav,
    body .mobile-menu,
    body .mobile-submenu,
    body .mobile-dropdown,
    body .mobile-nav-list ul,
    body .mobile-nav-list .submenu,
    body .mobile-nav-list .dropdown-menu,
    body .offcanvas .submenu,
    body .offcanvas .dropdown-menu {
        background:
            linear-gradient(145deg, rgba(42, 184, 105, 0.34), rgba(5, 70, 42, 0.78)),
            radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.22), transparent 44%) !important;
        border-color: rgba(255, 255, 255, 0.2) !important;
        box-shadow:
            0 16px 34px rgba(0, 0, 0, 0.28),
            inset 0 1px 0 rgba(255, 255, 255, 0.22),
            inset 0 -1px 0 rgba(0, 70, 37, 0.3) !important;
    }

    @supports ((backdrop-filter: blur(15px)) or (-webkit-backdrop-filter: blur(15px))) {
        body #mobile-nav.offcanvas,
        body .offcanvas,
        body .mobile-nav,
        body .mobile-menu,
        body .mobile-submenu,
        body .mobile-dropdown,
        body .mobile-nav-list ul,
        body .mobile-nav-list .submenu,
        body .mobile-nav-list .dropdown-menu,
        body .offcanvas .submenu,
        body .offcanvas .dropdown-menu {
            -webkit-backdrop-filter: blur(18px) saturate(150%);
            backdrop-filter: blur(18px) saturate(150%);
        }
    }

    body #mobile-nav a,
    body .offcanvas a,
    body .mobile-nav-list a,
    body .mobile-submenu a,
    body .mobile-dropdown a {
        color: #f8fff7 !important;
        -webkit-text-stroke: 0.28px rgba(3, 48, 29, 0.9);
        text-shadow:
            -1px -1px 0 rgba(3, 48, 29, 0.78),
            1px 1px 0 rgba(3, 48, 29, 0.84),
            0 3px 10px rgba(0, 0, 0, 0.28) !important;
    }
}

@media (max-width: 767.98px) {
    body #beta-banner {
        font-size: clamp(0.68rem, 2.75vw, 0.88rem) !important;
        min-height: 32px !important;
        padding-inline: 0.45rem !important;
    }

    body .news-ticker-container {
        top: 32px !important;
    }

    body .news-ticker-container .ticker-info,
    body .news-ticker-container .ticker-social,
    body .news-ticker-container .ticker-widgets-right,
    body .news-ticker-container .news-ticker-title {
        display: none !important;
    }

    body .news-ticker-container .ticker-widgets-left {
        flex: 0 0 auto !important;
        gap: 0.28rem !important;
        max-width: 30vw !important;
        overflow: hidden !important;
    }

    body .news-ticker-container .ticker-title-nav {
        max-width: 68vw !important;
    }

    body .news-ticker-container .ticker-widget-btn,
    body .news-ticker-container .news-ticker-nav-item {
        border-radius: 999px !important;
        flex: 0 0 28px !important;
        height: 28px !important;
        min-height: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        width: 28px !important;
    }

    body .news-ticker-container .news-ticker-nav-item {
        color: transparent !important;
        font-size: 0 !important;
        overflow: hidden !important;
        position: relative !important;
        text-indent: -999px !important;
    }

    body .news-ticker-container .news-ticker-nav-item::after {
        color: #ffffff !important;
        display: block !important;
        font-size: 13px !important;
        left: 50% !important;
        line-height: 1 !important;
        position: absolute !important;
        text-indent: 0 !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
    }
}

/* ABSOLUTE VIEWPORT AUTHORITY: compact touch/tablet shell, modelled from the approved desktop concept. */
@media (max-width: 1199.98px), (hover: none) and (pointer: coarse) {
    html,
    body {
        overflow-x: hidden !important;
    }

    body #beta-banner {
        align-items: center !important;
        background:
            linear-gradient(90deg, rgba(0, 58, 32, 0.98), rgba(4, 97, 51, 0.98), rgba(0, 58, 32, 0.98)) !important;
        border: 0 !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.12),
            inset 0 -1px 0 rgba(126, 255, 173, 0.26),
            0 1px 0 rgba(0, 38, 22, 0.62) !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        font-size: clamp(0.68rem, 2.15vw, 0.92rem) !important;
        gap: 0.45rem !important;
        justify-content: center !important;
        line-height: 1 !important;
        margin: 0 !important;
        min-height: 31px !important;
        overflow: hidden !important;
        padding: 0.36rem 0.55rem !important;
        text-overflow: clip !important;
        white-space: nowrap !important;
    }

    body #beta-banner *,
    body #beta-banner strong,
    body #beta-banner span {
        display: inline !important;
        flex: 0 1 auto !important;
        line-height: 1 !important;
        min-width: 0 !important;
        white-space: nowrap !important;
    }

    body .site-header {
        border-top: 0 !important;
        margin-top: 0 !important;
    }

    body .news-ticker-container {
        background:
            linear-gradient(180deg, rgba(6, 92, 49, 0.98), rgba(12, 125, 65, 0.94)) !important;
        border: 0 !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        left: auto !important;
        margin: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        overflow: visible !important;
        padding: 0 !important;
        position: relative !important;
        right: auto !important;
        top: auto !important;
        width: 100% !important;
        z-index: 50 !important;
    }

    body .news-ticker-container .ticker-top-row {
        align-items: center !important;
        background: transparent !important;
        box-sizing: border-box !important;
        display: grid !important;
        grid-template-columns: auto 1fr auto !important;
        gap: clamp(0.32rem, 1.25vw, 0.72rem) !important;
        height: 48px !important;
        margin: 0 !important;
        max-height: 48px !important;
        min-height: 48px !important;
        overflow: hidden !important;
        padding: 0.34rem clamp(0.55rem, 1.7vw, 0.95rem) 0.22rem !important;
        width: 100% !important;
        z-index: 5 !important;
    }

    body .news-ticker-container .news-ticker-title,
    body .news-ticker-container .ticker-info,
    body .news-ticker-container .ticker-social,
    body .news-ticker-container .ticker-widgets-right {
        display: none !important;
    }

    body .news-ticker-container .ticker-widgets-left,
    body .news-ticker-container .ticker-title-nav,
    body .news-ticker-container .news-ticker-nav {
        align-items: center !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    body .news-ticker-container .ticker-widgets-left {
        gap: clamp(0.28rem, 1vw, 0.48rem) !important;
        grid-column: 1 !important;
        justify-content: flex-start !important;
    }

    body .news-ticker-container .ticker-title-nav {
        grid-column: 3 !important;
        justify-content: flex-end !important;
    }

    body .news-ticker-container .news-ticker-nav {
        gap: clamp(0.26rem, 0.85vw, 0.44rem) !important;
        justify-content: flex-end !important;
    }

    body .news-ticker-container .ticker-widget-btn,
    body .news-ticker-container .news-ticker-nav-item {
        align-items: center !important;
        border-radius: 999px !important;
        box-sizing: border-box !important;
        display: inline-flex !important;
        flex: 0 0 34px !important;
        height: 34px !important;
        justify-content: center !important;
        min-height: 34px !important;
        min-width: 34px !important;
        padding: 0 !important;
        width: 34px !important;
    }

    body .news-ticker-container .news-ticker-nav-item {
        color: transparent !important;
        font-size: 0 !important;
        overflow: hidden !important;
        position: relative !important;
        text-indent: -999px !important;
    }

    body .news-ticker-container .news-ticker-nav-item::after {
        color: #ffffff !important;
        display: block !important;
        font-size: 15px !important;
        left: 50% !important;
        line-height: 1 !important;
        position: absolute !important;
        text-indent: 0 !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
    }

    body .news-ticker-container .ticker-scroller-row {
        align-items: center !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex: 0 0 44px !important;
        height: 44px !important;
        margin: 0 auto -23px !important;
        max-height: 44px !important;
        min-height: 44px !important;
        opacity: 1 !important;
        overflow: hidden !important;
        padding: 0.34rem 0.82rem !important;
        position: relative !important;
        transform: none !important;
        visibility: visible !important;
        width: calc(100% - 18px) !important;
        z-index: 8 !important;
    }

    body .news-ticker-container .news-ticker-content,
    body .news-ticker-container .ticker-section.active,
    body .news-ticker-container .ticker-items {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    body .page-header,
    body .hero-section,
    body .home-hero,
    body .hero {
        padding-top: max(3.8rem, calc(var(--spacing-lg, 1.5rem) + 28px)) !important;
    }

    body #mobile-nav.offcanvas,
    body .offcanvas,
    body .mobile-nav,
    body .mobile-menu,
    body .mobile-submenu,
    body .mobile-dropdown,
    body .mobile-nav-list,
    body .mobile-nav-list ul,
    body .mobile-nav-list .submenu,
    body .mobile-nav-list .dropdown-menu,
    body .offcanvas .submenu,
    body .offcanvas .dropdown-menu {
        background:
            linear-gradient(145deg, rgba(42, 184, 105, 0.34), rgba(5, 70, 42, 0.78)),
            radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.22), transparent 44%) !important;
        border-color: rgba(255, 255, 255, 0.2) !important;
        box-shadow:
            0 16px 34px rgba(0, 0, 0, 0.28),
            inset 0 1px 0 rgba(255, 255, 255, 0.22),
            inset 0 -1px 0 rgba(0, 70, 37, 0.3) !important;
    }

    @supports ((backdrop-filter: blur(15px)) or (-webkit-backdrop-filter: blur(15px))) {
        body #mobile-nav.offcanvas,
        body .offcanvas,
        body .mobile-nav,
        body .mobile-menu,
        body .mobile-submenu,
        body .mobile-dropdown,
        body .mobile-nav-list,
        body .mobile-nav-list ul,
        body .mobile-nav-list .submenu,
        body .mobile-nav-list .dropdown-menu,
        body .offcanvas .submenu,
        body .offcanvas .dropdown-menu {
            -webkit-backdrop-filter: blur(18px) saturate(150%);
            backdrop-filter: blur(18px) saturate(150%);
        }
    }
}

@media (max-width: 767.98px) {
    body #beta-banner {
        font-size: clamp(0.58rem, 2.45vw, 0.74rem) !important;
        min-height: 28px !important;
        padding: 0.28rem 0.42rem !important;
    }

    /* Keep the mobile ticker toolbar aligned with the source ticker contract
       instead of the older ultra-compact 30px generation. */
    body .news-ticker-container .ticker-top-row {
        grid-template-columns: auto 1fr auto !important;
        height: 50px !important;
        max-height: 50px !important;
        min-height: 50px !important;
        padding: 5px 10px 3px !important;
        gap: 6px !important;
    }

    body .news-ticker-container .ticker-widget-btn,
    body .news-ticker-container .news-ticker-nav-item {
        flex-basis: 28px !important;
        height: 28px !important;
        min-height: 28px !important;
        min-width: 28px !important;
        width: 28px !important;
    }

    body .news-ticker-container .ticker-widgets-left {
        max-width: 38vw !important;
    }

    body .news-ticker-container .ticker-title-nav {
        max-width: 58vw !important;
    }

    body .news-ticker-container .ticker-scroller-row {
        height: 42px !important;
        max-height: 42px !important;
        min-height: 42px !important;
        margin: 1.05rem auto -24px !important;
        padding: 0.3rem 0.72rem !important;
        width: calc(100% - 18px) !important;
    }

    /* Compact submenu links at the final authority layer so older broad
       mobile anchor generations cannot leave them spaced like top-level pills. */
    body #mobile-nav .mobile-nav-list .nav-dropdown-menu {
        padding: 2px 0 0 !important;
        margin: 4px 0 0 !important;
    }

    body #mobile-nav .mobile-nav-list .nav-dropdown-menu li {
        margin: 0 !important;
    }

    body #mobile-nav .mobile-nav-list .nav-dropdown-menu a {
        margin: 0 !important;
        padding: 8px 12px 8px 22px !important;
        min-height: 0 !important;
        border-radius: 10px !important;
        background: rgba(255, 255, 255, 0.05) !important;
        transform: none !important;
        box-shadow: none !important;
    }

    body #mobile-nav .mobile-nav-list .nav-dropdown-menu a:hover,
    body #mobile-nav .mobile-nav-list .nav-dropdown-menu a:focus,
    body #mobile-nav .mobile-nav-list .nav-dropdown-menu a.active {
        background: rgba(255, 255, 255, 0.14) !important;
        transform: none !important;
    }
}

/* ========================================
   4D GREENS GLASS SYSTEM - FINAL VISUAL LAYER
   Loaded last on public pages so it can safely harmonise old generations.
   ======================================== */
:root {
    --rfc-glass-surface: rgba(216, 255, 232, 0.48);
    --rfc-glass-surface-strong: rgba(226, 255, 238, 0.62);
    --rfc-glass-green: rgba(38, 171, 91, 0.42);
    --rfc-glass-green-deep: rgba(2, 74, 42, 0.82);
    --rfc-glass-line: rgba(255, 255, 255, 0.42);
    --rfc-glass-shadow: 0 18px 42px rgba(0, 42, 24, 0.16), 0 6px 16px rgba(0, 0, 0, 0.08);
    --rfc-glass-inset: inset 0 1px 0 rgba(255, 255, 255, 0.72), inset 0 -1px 0 rgba(0, 77, 43, 0.08);
    --rfc-button-glass: linear-gradient(145deg, rgba(255, 255, 255, 0.20), rgba(255, 255, 255, 0.08));
    --rfc-text-stroke-green: -1px -1px 0 rgba(0, 55, 31, 0.78), 1px -1px 0 rgba(0, 55, 31, 0.78), -1px 1px 0 rgba(0, 55, 31, 0.78), 1px 1px 0 rgba(0, 55, 31, 0.78), 0 2px 8px rgba(0, 0, 0, 0.28);
}

body {
    background-color: #f8f9fa !important;
    background-image:
        radial-gradient(circle at 10% 8%, rgba(46, 204, 113, 0.16), transparent 28rem),
        radial-gradient(circle at 92% 18%, rgba(255, 255, 255, 0.82), transparent 20rem),
        linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(231, 247, 238, 0.58), rgba(248, 249, 250, 0.88)) !important;
    background-attachment: fixed !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        linear-gradient(115deg, transparent 0 36%, rgba(255, 255, 255, 0.22) 43%, transparent 51%),
        repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.10) 0 1px, transparent 1px 18px);
    opacity: 0.38;
}

main,
body > .container,
.page-content,
.content-wrapper {
    position: relative;
    z-index: 1;
}

:where(
    .card,
    .feature,
    .feature-inner,
    .panel,
    .content-panel,
    .dashboard-panel,
    .page-panel,
    .settings-panel,
    .profile-section,
    .event-section,
    .form-section,
    .table-panel,
    .admin-card,
    .admin-panel,
    .manager-card,
    .manager-panel,
    .coach-card,
    .coach-panel,
    .stat-card,
    .stats-card,
    .metric-card,
    .widget,
    .widget-card,
    .feature-card,
    .home-card,
    .info-box,
    .box,
    .section-card,
    .module-card,
    .glass-card,
    .glass-panel,
    .event-card,
    .news-card,
    .media-card,
    .sponsor-card,
    .player-card,
    .team-card,
    .login-card,
    .register-card,
    .auth-card,
    .profile-card,
    .attendance-card,
    .transport-card,
    .match-card,
    .lineup-card,
    .conditioning-card,
    .green-zone-card,
    .details-card,
    .form-container,
    .content-container,
    .table-responsive
) {
    background:
        linear-gradient(145deg, var(--rfc-glass-surface-strong), rgba(255, 255, 255, 0.52)),
        radial-gradient(circle at 16% 0%, rgba(46, 204, 113, 0.13), transparent 42%) !important;
    border: 1px solid var(--rfc-glass-line) !important;
    border-radius: clamp(14px, 1.6vw, 22px) !important;
    box-shadow: var(--rfc-glass-shadow), var(--rfc-glass-inset) !important;
    overflow: hidden;
}

@supports ((backdrop-filter: blur(14px)) or (-webkit-backdrop-filter: blur(14px))) {
    :where(
        .card,
        .feature,
        .feature-inner,
        .panel,
        .content-panel,
        .dashboard-panel,
        .page-panel,
        .settings-panel,
        .profile-section,
        .event-section,
        .form-section,
        .table-panel,
        .admin-card,
        .admin-panel,
        .manager-card,
        .manager-panel,
        .coach-card,
        .coach-panel,
        .stat-card,
        .stats-card,
        .metric-card,
        .widget,
        .widget-card,
        .feature-card,
        .home-card,
        .info-box,
        .box,
        .section-card,
        .module-card,
        .glass-card,
        .glass-panel,
        .event-card,
        .news-card,
        .media-card,
        .sponsor-card,
        .player-card,
        .team-card,
        .login-card,
        .register-card,
        .auth-card,
        .profile-card,
        .attendance-card,
        .transport-card,
        .match-card,
        .lineup-card,
        .conditioning-card,
        .green-zone-card,
        .details-card,
        .form-container,
        .content-container,
        .table-responsive
    ) {
        -webkit-backdrop-filter: blur(16px) saturate(138%);
        backdrop-filter: blur(16px) saturate(138%);
    }
}

:where(.card-header, .panel-header, .widget-header, .section-card-header, .modal-header) {
    background:
        linear-gradient(135deg, rgba(8, 120, 62, 0.88), rgba(42, 184, 105, 0.76)),
        radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.22), transparent 44%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    text-shadow: var(--rfc-text-stroke-green) !important;
}

:where(.card-footer, .panel-footer, .modal-footer) {
    background: rgba(255, 255, 255, 0.22) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.30) !important;
}

/* Preserve the homepage Events/News/Media switcher colours; it is a tab control, not a panel skin target. */
.home-tabs.card .card-header,
.home-tabs.card .card-header.bg-transparent {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
    text-shadow: none !important;
}

.home-tabs.card .modern-home-tabs {
    background: rgba(255, 255, 255, 0.60) !important;
    border: 0 !important;
    box-shadow: none !important;
}

.home-tabs.card .modern-home-tabs .nav-link {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #2c8e3e !important;
    text-shadow: none !important;
}

.home-tabs.card .modern-home-tabs .nav-link.active,
.home-tabs.card .modern-home-tabs .nav-link:focus,
.home-tabs.card .modern-home-tabs .nav-link:hover {
    background: linear-gradient(90deg, #2c8e3e 0%, #43b36a 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(44, 142, 62, 0.08) !important;
    text-shadow: none !important;
}

:where(
    .card,
    .panel,
    .content-panel,
    .dashboard-panel,
    .event-card,
    .form-container,
    .content-container,
    .widget-card,
    .feature-card,
    .details-card
) :where(.btn:not(.btn-link), button:not(.menu-toggle):not(.offcanvas-close), input[type="submit"], input[type="button"]) {
    align-items: center;
    background: var(--rfc-button-glass) !important;
    border: 1px solid rgba(255, 255, 255, 0.26) !important;
    border-radius: 999px !important;
    box-shadow: 0 8px 20px rgba(0, 70, 38, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.36) !important;
    color: #ffffff !important;
    display: inline-flex;
    font-weight: 800 !important;
    justify-content: center;
    letter-spacing: 0.01em;
    min-height: 34px;
    text-decoration: none !important;
    text-shadow: var(--rfc-text-stroke-green) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
}

:where(
    .card,
    .panel,
    .content-panel,
    .dashboard-panel,
    .event-card,
    .form-container,
    .content-container,
    .widget-card,
    .feature-card,
    .details-card
) :where(.btn:not(.btn-link), button:not(.menu-toggle):not(.offcanvas-close), input[type="submit"], input[type="button"]):hover {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.28), rgba(46, 204, 113, 0.20)) !important;
    box-shadow: 0 11px 24px rgba(0, 70, 38, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.46) !important;
    transform: translateY(-2px);
}

:where(.card, .panel, .event-card, .form-container) :where(.btn-primary, .btn-success) {
    background: linear-gradient(145deg, rgba(46, 204, 113, 0.68), rgba(5, 127, 66, 0.74)) !important;
}

:where(.card, .panel, .event-card, .form-container) :where(.btn-danger) {
    background: linear-gradient(145deg, rgba(235, 87, 87, 0.74), rgba(151, 34, 34, 0.72)) !important;
}

:where(.card, .panel, .event-card, .form-container) :where(.btn-warning) {
    background: linear-gradient(145deg, rgba(255, 193, 7, 0.72), rgba(181, 119, 0, 0.70)) !important;
}

footer,
.site-footer,
.bg-dark.py-4 {
    background-color: var(--dark-color, #212529) !important;
    background-image:
        linear-gradient(145deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.02)),
        radial-gradient(circle at 12% 0%, rgba(46, 204, 113, 0.18), transparent 24rem),
        linear-gradient(180deg, rgba(20, 34, 27, 0.94), rgba(18, 27, 23, 0.98)) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 -18px 40px rgba(0, 44, 24, 0.12) !important;
    color: #ffffff !important;
    position: relative;
    z-index: 1;
}

@supports ((backdrop-filter: blur(12px)) or (-webkit-backdrop-filter: blur(12px))) {
    footer,
    .site-footer,
    .bg-dark.py-4 {
        -webkit-backdrop-filter: blur(14px) saturate(135%);
        backdrop-filter: blur(14px) saturate(135%);
    }
}

/* Mobile/tablet menu rebuild: force all popup generations into the same text-first glass style. */
@media (max-width: 1199.98px) {
    body #mobile-nav.offcanvas,
    body .offcanvas,
    body .navbar-collapse.show,
    body .navbar-collapse.collapsing,
    body .site-header nav.main-nav > ul.nav-menu.active,
    body .main-nav .nav-menu.active {
        background:
            linear-gradient(145deg, rgba(48, 203, 118, 0.30), rgba(3, 56, 34, 0.84)),
            radial-gradient(circle at 16% 0%, rgba(255, 255, 255, 0.24), transparent 46%) !important;
        border: 1px solid rgba(255, 255, 255, 0.22) !important;
        box-shadow: 0 22px 48px rgba(0, 0, 0, 0.34), var(--rfc-glass-inset) !important;
        color: #ffffff !important;
    }

    @supports ((backdrop-filter: blur(18px)) or (-webkit-backdrop-filter: blur(18px))) {
        body #mobile-nav.offcanvas,
        body .offcanvas,
        body .navbar-collapse.show,
        body .navbar-collapse.collapsing,
        body .site-header nav.main-nav > ul.nav-menu.active,
        body .main-nav .nav-menu.active {
            -webkit-backdrop-filter: blur(20px) saturate(150%);
            backdrop-filter: blur(20px) saturate(150%);
        }
    }

    body #mobile-nav .mobile-nav-list a,
    body .offcanvas .mobile-nav-list a,
    body .navbar-collapse.show a,
    body .navbar-collapse.collapsing a,
    body .site-header nav.main-nav > ul.nav-menu.active a,
    body .main-nav .nav-menu.active a,
    body #mobile-nav .nav-dropdown-menu a,
    body .offcanvas .nav-dropdown-menu a,
    body .dropdown-menu.show a {
        background: transparent !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
        border-radius: 8px !important;
        box-shadow: none !important;
        color: #f5fff6 !important;
        display: flex !important;
        font-size: clamp(0.96rem, 2.6vw, 1.1rem) !important;
        font-weight: 800 !important;
        justify-content: flex-start !important;
        letter-spacing: 0.01em !important;
        margin: 0 !important;
        line-height: 1.18 !important;
        min-height: 0 !important;
        padding: 0.48rem 0.3rem !important;
        text-decoration: none !important;
        text-shadow: var(--rfc-text-stroke-green) !important;
        transform: none !important;
    }

    body #mobile-nav .mobile-nav-list a:hover,
    body .offcanvas .mobile-nav-list a:hover,
    body .navbar-collapse.show a:hover,
    body .navbar-collapse.collapsing a:hover,
    body .site-header nav.main-nav > ul.nav-menu.active a:hover,
    body .main-nav .nav-menu.active a:hover,
    body #mobile-nav .nav-dropdown-menu a:hover,
    body .offcanvas .nav-dropdown-menu a:hover,
    body .dropdown-menu.show a:hover {
        background: linear-gradient(90deg, rgba(255, 255, 255, 0.17), rgba(46, 204, 113, 0.12), transparent) !important;
        color: #ffffff !important;
        padding-left: 0.62rem !important;
    }

    body #mobile-nav .nav-dropdown-menu,
    body .offcanvas .nav-dropdown-menu,
    body .navbar-collapse.show .dropdown-menu,
    body .navbar-collapse.collapsing .dropdown-menu,
    body .dropdown-menu.show,
    body .site-header nav.main-nav > ul.nav-menu.active .nav-dropdown-menu,
    body .main-nav .nav-menu.active .nav-dropdown-menu {
        background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(3, 56, 34, 0.34)) !important;
        border: 1px solid rgba(255, 255, 255, 0.16) !important;
        border-radius: 14px !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
        left: auto !important;
        margin: 0.18rem 0 0.32rem 0.65rem !important;
        min-width: 0 !important;
        padding: 0.28rem 0.55rem !important;
        position: static !important;
        right: auto !important;
        top: auto !important;
        transform: none !important;
        width: auto !important;
    }

    body #mobile-nav .menu-section,
    body .offcanvas .menu-section,
    body .main-nav .nav-menu.active .menu-section {
        color: rgba(235, 255, 238, 0.78) !important;
        font-weight: 900 !important;
        letter-spacing: 0.12em !important;
        text-shadow: var(--rfc-text-stroke-green) !important;
    }

    body #mobile-nav .mobile-nav-list li,
    body .offcanvas .mobile-nav-list li,
    body .site-header nav.main-nav > ul.nav-menu.active li,
    body .main-nav .nav-menu.active li,
    body #mobile-nav .nav-dropdown-menu li,
    body .offcanvas .nav-dropdown-menu li {
        margin: 0 !important;
        padding: 0 !important;
    }

    body #mobile-nav .nav-dropdown-menu a,
    body .offcanvas .nav-dropdown-menu a,
    body .site-header nav.main-nav > ul.nav-menu.active .nav-dropdown-menu a,
    body .main-nav .nav-menu.active .nav-dropdown-menu a,
    body .dropdown-menu.show a {
        font-size: clamp(0.86rem, 2.2vw, 0.98rem) !important;
        padding: 0.38rem 0.28rem !important;
    }
}

@media (max-width: 767.98px) {
    body .news-ticker-container {
        overflow: visible !important;
    }

    body .news-ticker-container .ticker-top-row {
        height: 50px !important;
        max-height: 50px !important;
        min-height: 50px !important;
        overflow: hidden !important;
        padding: 0.34rem 0.55rem 0.18rem !important;
    }

    body .news-ticker-container .ticker-scroller-row {
        height: 42px !important;
        margin: 1.06rem auto -24px !important;
        max-height: 42px !important;
        min-height: 42px !important;
        padding: 0.30rem 0.72rem !important;
        width: calc(100% - 18px) !important;
    }

    body .page-header,
    body .hero-section,
    body .home-hero,
    body .hero {
        padding-top: max(4.75rem, calc(var(--spacing-lg, 1.5rem) + 46px)) !important;
    }
}

/* Stronger glass card/panel pass to match popup menu surfaces more closely. */
:where(
    .card,
    .feature,
    .feature-inner,
    .panel,
    .content-panel,
    .dashboard-panel,
    .page-panel,
    .settings-panel,
    .profile-section,
    .event-section,
    .form-section,
    .table-panel,
    .admin-card,
    .admin-panel,
    .manager-card,
    .manager-panel,
    .coach-card,
    .coach-panel,
    .stat-card,
    .stats-card,
    .metric-card,
    .widget,
    .widget-card,
    .feature-card,
    .home-card,
    .info-box,
    .box,
    .section-card,
    .module-card,
    .glass-card,
    .glass-panel,
    .event-card,
    .news-card,
    .media-card,
    .sponsor-card,
    .player-card,
    .team-card,
    .login-card,
    .register-card,
    .auth-card,
    .profile-card,
    .attendance-card,
    .transport-card,
    .match-card,
    .lineup-card,
    .conditioning-card,
    .green-zone-card,
    .details-card,
    .form-container,
    .content-container
) {
    background:
        linear-gradient(145deg, rgba(228, 255, 238, 0.50), rgba(205, 245, 221, 0.28) 52%, rgba(255, 255, 255, 0.34)),
        radial-gradient(circle at 14% 0%, rgba(255, 255, 255, 0.34), transparent 42%),
        linear-gradient(145deg, rgba(42, 184, 105, 0.18), rgba(5, 70, 42, 0.12)) !important;
    border: 1px solid rgba(255, 255, 255, 0.30) !important;
    box-shadow:
        0 20px 42px rgba(0, 42, 24, 0.16),
        0 8px 18px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.74),
        inset 0 -1px 0 rgba(0, 77, 43, 0.10) !important;
}

@supports ((backdrop-filter: blur(18px)) or (-webkit-backdrop-filter: blur(18px))) {
    :where(
        .card,
        .feature,
        .feature-inner,
        .panel,
        .content-panel,
        .dashboard-panel,
        .page-panel,
        .settings-panel,
        .profile-section,
        .event-section,
        .form-section,
        .table-panel,
        .admin-card,
        .admin-panel,
        .manager-card,
        .manager-panel,
        .coach-card,
        .coach-panel,
        .stat-card,
        .stats-card,
        .metric-card,
        .widget,
        .widget-card,
        .feature-card,
        .home-card,
        .info-box,
        .box,
        .section-card,
        .module-card,
        .glass-card,
        .glass-panel,
        .event-card,
        .news-card,
        .media-card,
        .sponsor-card,
        .player-card,
        .team-card,
        .login-card,
        .register-card,
        .auth-card,
        .profile-card,
        .attendance-card,
        .transport-card,
        .match-card,
        .lineup-card,
        .conditioning-card,
        .green-zone-card,
        .details-card,
        .form-container,
        .content-container
    ) {
        -webkit-backdrop-filter: blur(18px) saturate(150%);
        backdrop-filter: blur(18px) saturate(150%);
    }
}

/* Do not re-skin the homepage tab pill bar/card header. */
.home-tabs.card,
.home-tabs.card .card-body {
    background:
        linear-gradient(145deg, rgba(228, 255, 238, 0.44), rgba(255, 255, 255, 0.30)) !important;
}

/* Final correction layer: keep homepage switcher intact, compact mobile menus,
   and hang the mobile ticker tube below the toolbar instead of on top of it. */
.home-tabs.card .card-header,
.home-tabs.card .card-header.bg-transparent,
.home-tabs.card .modern-home-tabs,
.home-tabs.card .modern-home-tabs .nav-link,
.home-tabs.card .modern-home-tabs .nav-link.active,
.home-tabs.card .modern-home-tabs .nav-link:hover,
.home-tabs.card .modern-home-tabs .nav-link:focus {
    text-shadow: none !important;
}

.home-tabs.card .card-header,
.home-tabs.card .card-header.bg-transparent {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.home-tabs.card .modern-home-tabs {
    background: rgba(255, 255, 255, 0.60) !important;
    border-radius: 2rem !important;
    box-shadow: none !important;
    padding: 0.5rem 0.75rem !important;
}

.home-tabs.card .modern-home-tabs .nav-link {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #2c8e3e !important;
}

.home-tabs.card .modern-home-tabs .nav-link.active,
.home-tabs.card .modern-home-tabs .nav-link:hover,
.home-tabs.card .modern-home-tabs .nav-link:focus {
    background: linear-gradient(90deg, #2c8e3e 0%, #43b36a 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(44, 142, 62, 0.08) !important;
}

/* Make cards/panels read more like the popup glass rather than plain white cards. */
:where(
    .card,
    .feature,
    .feature-inner,
    .panel,
    .content-panel,
    .dashboard-panel,
    .page-panel,
    .settings-panel,
    .profile-section,
    .event-section,
    .form-section,
    .table-panel,
    .admin-card,
    .admin-panel,
    .manager-card,
    .manager-panel,
    .coach-card,
    .coach-panel,
    .stat-card,
    .stats-card,
    .metric-card,
    .widget,
    .widget-card,
    .feature-card,
    .home-card,
    .info-box,
    .box,
    .section-card,
    .module-card,
    .glass-card,
    .glass-panel,
    .event-card,
    .news-card,
    .media-card,
    .sponsor-card,
    .player-card,
    .team-card,
    .login-card,
    .register-card,
    .auth-card,
    .profile-card,
    .attendance-card,
    .transport-card,
    .match-card,
    .lineup-card,
    .conditioning-card,
    .green-zone-card,
    .details-card,
    .form-container,
    .content-container
) {
    background:
        linear-gradient(145deg, rgba(225, 255, 237, 0.46), rgba(210, 247, 224, 0.24) 50%, rgba(255, 255, 255, 0.28)) !important;
    border: 1px solid rgba(255, 255, 255, 0.34) !important;
    box-shadow:
        0 18px 38px rgba(0, 42, 24, 0.14),
        0 6px 14px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        inset 0 -1px 0 rgba(0, 77, 43, 0.08) !important;
}

@supports ((backdrop-filter: blur(18px)) or (-webkit-backdrop-filter: blur(18px))) {
    :where(
        .card,
        .feature,
        .feature-inner,
        .panel,
        .content-panel,
        .dashboard-panel,
        .page-panel,
        .settings-panel,
        .profile-section,
        .event-section,
        .form-section,
        .table-panel,
        .admin-card,
        .admin-panel,
        .manager-card,
        .manager-panel,
        .coach-card,
        .coach-panel,
        .stat-card,
        .stats-card,
        .metric-card,
        .widget,
        .widget-card,
        .feature-card,
        .home-card,
        .info-box,
        .box,
        .section-card,
        .module-card,
        .glass-card,
        .glass-panel,
        .event-card,
        .news-card,
        .media-card,
        .sponsor-card,
        .player-card,
        .team-card,
        .login-card,
        .register-card,
        .auth-card,
        .profile-card,
        .attendance-card,
        .transport-card,
        .match-card,
        .lineup-card,
        .conditioning-card,
        .green-zone-card,
        .details-card,
        .form-container,
        .content-container
    ) {
        -webkit-backdrop-filter: blur(18px) saturate(150%) !important;
        backdrop-filter: blur(18px) saturate(150%) !important;
    }
}

@media (max-width: 1199.98px) {
    body #mobile-nav .mobile-nav-list a,
    body .offcanvas .mobile-nav-list a,
    body .site-header nav.main-nav > ul.nav-menu.active a,
    body .main-nav .nav-menu.active a,
    body #mobile-nav .nav-dropdown-menu a,
    body .offcanvas .nav-dropdown-menu a,
    body .dropdown-menu.show a {
        font-size: clamp(0.92rem, 2.3vw, 1rem) !important;
        line-height: 1.15 !important;
        margin: 0 !important;
        min-height: 0 !important;
        padding: 0.44rem 0.3rem !important;
    }

    body #mobile-nav .mobile-nav-list li,
    body .offcanvas .mobile-nav-list li,
    body .site-header nav.main-nav > ul.nav-menu.active li,
    body .main-nav .nav-menu.active li,
    body #mobile-nav .nav-dropdown-menu li,
    body .offcanvas .nav-dropdown-menu li {
        margin: 0 !important;
        padding: 0 !important;
    }

    body #mobile-nav .nav-dropdown-menu,
    body .offcanvas .nav-dropdown-menu,
    body .navbar-collapse.show .dropdown-menu,
    body .navbar-collapse.collapsing .dropdown-menu,
    body .dropdown-menu.show,
    body .site-header nav.main-nav > ul.nav-menu.active .nav-dropdown-menu,
    body .main-nav .nav-menu.active .nav-dropdown-menu {
        margin: 0.14rem 0 0.24rem 0 !important;
        padding: 0.22rem 0 !important;
    }
}

@media (max-width: 767.98px) {
    body .news-ticker-container .ticker-top-row {
        min-height: 50px !important;
        height: 50px !important;
        max-height: 50px !important;
        padding: 0.34rem 0.55rem 0.18rem !important;
    }

    body .news-ticker-container .ticker-scroller-row {
        margin: 1.18rem auto -24px !important;
        width: calc(100% - 18px) !important;
    }

    body .page-header,
    body .hero-section,
    body .home-hero,
    body .hero {
        padding-top: max(5.35rem, calc(var(--spacing-lg, 1.5rem) + 58px)) !important;
    }
}

@media (max-width: 991.98px) {
    body #mobile-nav .nav-dropdown.open > .nav-dropdown-menu,
    body .offcanvas .nav-dropdown.open > .nav-dropdown-menu {
        margin: 0.08rem 0 0.18rem 0 !important;
        padding: 0.12rem 0 !important;
    }

    body #mobile-nav .nav-dropdown.open > .nav-dropdown-menu li,
    body .offcanvas .nav-dropdown.open > .nav-dropdown-menu li {
        margin: 0 !important;
        padding: 0 !important;
    }

    body #mobile-nav .nav-dropdown.open > .nav-dropdown-menu a,
    body .offcanvas .nav-dropdown.open > .nav-dropdown-menu a {
        font-size: clamp(0.84rem, 2.05vw, 0.96rem) !important;
        line-height: 1.08 !important;
        margin: 0 !important;
        min-height: 0 !important;
        padding: 0.34rem 0.3rem 0.34rem 0.82rem !important;
    }
}

/* Final visual match: make cards/panels use the popup-menu glass language. */
:where(
    .card,
    .feature,
    .feature-inner,
    .panel,
    .content-panel,
    .dashboard-panel,
    .page-panel,
    .settings-panel,
    .profile-section,
    .event-section,
    .form-section,
    .table-panel,
    .admin-card,
    .admin-panel,
    .manager-card,
    .manager-panel,
    .coach-card,
    .coach-panel,
    .stat-card,
    .stats-card,
    .metric-card,
    .widget,
    .widget-card,
    .feature-card,
    .home-card,
    .info-box,
    .box,
    .section-card,
    .module-card,
    .glass-card,
    .glass-panel,
    .event-card,
    .news-card,
    .media-card,
    .sponsor-card,
    .player-card,
    .team-card,
    .login-card,
    .register-card,
    .auth-card,
    .profile-card,
    .attendance-card,
    .transport-card,
    .match-card,
    .lineup-card,
    .conditioning-card,
    .green-zone-card,
    .details-card,
    .form-container,
    .content-container
) {
    background:
        linear-gradient(180deg, rgba(26, 60, 44, 0.72) 0%, rgba(20, 45, 35, 0.56) 100%),
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.16), transparent 44%) !important;
    border: 1px solid rgba(44, 142, 62, 0.28) !important;
    box-shadow:
        0 12px 32px rgba(0, 0, 0, 0.22),
        0 4px 12px rgba(0, 0, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
    color: #eaffea !important;
}

@supports ((backdrop-filter: blur(18px)) or (-webkit-backdrop-filter: blur(18px))) {
    :where(
        .card,
        .feature,
        .feature-inner,
        .panel,
        .content-panel,
        .dashboard-panel,
        .page-panel,
        .settings-panel,
        .profile-section,
        .event-section,
        .form-section,
        .table-panel,
        .admin-card,
        .admin-panel,
        .manager-card,
        .manager-panel,
        .coach-card,
        .coach-panel,
        .stat-card,
        .stats-card,
        .metric-card,
        .widget,
        .widget-card,
        .feature-card,
        .home-card,
        .info-box,
        .box,
        .section-card,
        .module-card,
        .glass-card,
        .glass-panel,
        .event-card,
        .news-card,
        .media-card,
        .sponsor-card,
        .player-card,
        .team-card,
        .login-card,
        .register-card,
        .auth-card,
        .profile-card,
        .attendance-card,
        .transport-card,
        .match-card,
        .lineup-card,
        .conditioning-card,
        .green-zone-card,
        .details-card,
        .form-container,
        .content-container
    ) {
        -webkit-backdrop-filter: blur(16px) saturate(150%) !important;
        backdrop-filter: blur(16px) saturate(150%) !important;
    }
}

:where(
    .card h1,
    .card h2,
    .card h3,
    .card h4,
    .card h5,
    .card h6,
    .panel h1,
    .panel h2,
    .panel h3,
    .panel h4,
    .panel h5,
    .panel h6,
    .feature h1,
    .feature h2,
    .feature h3,
    .feature-inner h1,
    .feature-inner h2,
    .feature-inner h3
) {
    color: #f4fff5 !important;
    text-shadow: -1px -1px 0 rgba(0, 46, 27, 0.72), 1px 1px 0 rgba(0, 46, 27, 0.72), 0 2px 8px rgba(0, 0, 0, 0.24) !important;
}

:where(
    .card p,
    .card li,
    .card .text-muted,
    .panel p,
    .panel li,
    .panel .text-muted,
    .feature p,
    .feature-inner p,
    .content-panel p,
    .event-card .small,
    .event-card .text-muted
) {
    color: rgba(238, 255, 242, 0.92) !important;
}

/* Global button standard for site CTAs and card actions, excluding ticker/nav controls. */
:where(
    .btn,
    a.btn,
    button.btn,
    input[type="submit"],
    input[type="button"]
):not(.ticker-widget-btn):not(.news-ticker-nav-item):not(.menu-toggle):not(.offcanvas-close):not(.ticker-social-icon) {
    background: linear-gradient(145deg, rgba(46, 204, 113, 0.88), rgba(8, 123, 62, 0.92)) !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    border-radius: 999px !important;
    box-shadow:
        0 10px 22px rgba(0, 70, 38, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    letter-spacing: 0.01em !important;
    text-shadow:
        -1px -1px 0 rgba(0, 46, 27, 0.82),
        1px 1px 0 rgba(0, 46, 27, 0.82),
        0 2px 8px rgba(0, 0, 0, 0.24) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease !important;
}

:where(
    .btn,
    a.btn,
    button.btn,
    input[type="submit"],
    input[type="button"]
):not(.ticker-widget-btn):not(.news-ticker-nav-item):not(.menu-toggle):not(.offcanvas-close):not(.ticker-social-icon):hover {
    box-shadow:
        0 13px 28px rgba(0, 70, 38, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
    filter: brightness(1.03) !important;
    transform: translateY(-2px) !important;
}

:where(
    .btn,
    a.btn,
    button.btn,
    input[type="submit"],
    input[type="button"]
):not(.ticker-widget-btn):not(.news-ticker-nav-item):not(.menu-toggle):not(.offcanvas-close):not(.ticker-social-icon):focus {
    box-shadow:
        0 0 0 0.18rem rgba(156, 255, 191, 0.35),
        0 10px 22px rgba(0, 70, 38, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
}

/* Menu-style glass cards and panel text. */
:where(
    .card,
    .feature,
    .feature-inner,
    .panel,
    .content-panel,
    .dashboard-panel,
    .page-panel,
    .settings-panel,
    .profile-section,
    .event-section,
    .form-section,
    .table-panel,
    .admin-card,
    .admin-panel,
    .manager-card,
    .manager-panel,
    .coach-card,
    .coach-panel,
    .stat-card,
    .stats-card,
    .metric-card,
    .widget,
    .widget-card,
    .feature-card,
    .home-card,
    .info-box,
    .box,
    .section-card,
    .module-card,
    .glass-card,
    .glass-panel,
    .event-card,
    .news-card,
    .media-card,
    .sponsor-card,
    .player-card,
    .team-card,
    .login-card,
    .register-card,
    .auth-card,
    .profile-card,
    .attendance-card,
    .transport-card,
    .match-card,
    .lineup-card,
    .conditioning-card,
    .green-zone-card,
    .details-card,
    .form-container,
    .content-container
) {
    background:
        linear-gradient(180deg, rgba(26, 60, 44, 0.82) 0%, rgba(20, 45, 35, 0.72) 100%),
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.16), transparent 44%) !important;
    border: 1px solid rgba(44, 142, 62, 0.34) !important;
    color: #dff7e3 !important;
}

:where(
    .card .card-body,
    .panel .panel-body,
    .feature p,
    .feature-inner p,
    .card p,
    .card li,
    .card span,
    .card small,
    .card .text-muted,
    .panel p,
    .panel li,
    .panel span,
    .panel small,
    .panel .text-muted
) {
    color: #dff7e3 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.16) !important;
}

/* Keep card header bars structurally the same, but restore green heading text with white stroke. */
:where(
    .card h1,
    .card h2,
    .card h3,
    .card h4,
    .card h5,
    .card h6,
    .card .card-title,
    .feature h1,
    .feature h2,
    .feature h3,
    .feature-inner h1,
    .feature-inner h2,
    .feature-inner h3,
    .panel h1,
    .panel h2,
    .panel h3
) {
    color: #2ecc71 !important;
    text-shadow:
        -1px -1px 0 rgba(255, 255, 255, 0.92),
        1px -1px 0 rgba(255, 255, 255, 0.92),
        -1px 1px 0 rgba(255, 255, 255, 0.92),
        1px 1px 0 rgba(255, 255, 255, 0.92),
        0 2px 8px rgba(0, 0, 0, 0.22) !important;
}

/* Threads fallback icon for places where the Font Awesome glyph is missing. */
.threads-mark {
    align-items: center;
    color: currentColor;
    display: inline-flex;
    font-size: 1em;
    font-style: normal;
    font-weight: 900;
    justify-content: center;
    line-height: 1;
}

.threads-mark::before {
    content: "@";
    display: block;
    font-size: 1.08em;
    font-weight: 900;
    text-shadow:
        -0.5px -0.5px 0 rgba(255, 255, 255, 0.28),
        0.5px 0.5px 0 rgba(0, 0, 0, 0.18);
}

.social-icon .threads-mark {
    width: 60px;
    height: 60px;
    margin-bottom: 10px;
    background-color: #ffffff;
    border-radius: 50%;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    color: #2ecc71;
    font-size: 2rem;
    transition: all 0.3s ease;
}

.social-icon:hover .threads-mark {
    background-color: #4caf50;
    color: #ffffff;
}

footer .threads-mark {
    font-size: 1.2rem;
    vertical-align: middle;
}

/* Keep the Greenie mascot image inside the standard ticker button footprint. */
body .news-ticker-container .ticker-widget-btn[data-widget="greenie"] {
    overflow: hidden !important;
}

body .news-ticker-container .ticker-widget-btn[data-widget="greenie"] .ticker-greenie-icon {
    display: block !important;
    filter: none !important;
    height: 70% !important;
    max-height: 18px !important;
    max-width: 18px !important;
    object-fit: contain !important;
    pointer-events: none !important;
    width: 70% !important;
}

@media (max-width: 767.98px) {
    body .news-ticker-container .ticker-widget-btn[data-widget="greenie"] .ticker-greenie-icon {
        max-height: 16px !important;
        max-width: 16px !important;
    }
}
.beta-banner {
  min-height: 36px;
}

.site-header,
.main-header,
.header,
.top-header {
  margin-top: 0;
}

body:has(.beta-banner) .site-header,
body:has(.beta-banner) .main-header,
body:has(.beta-banner) .header,
body:has(.beta-banner) .top-header {
  top: 36px;
}

@media (max-width: 768px) {
  .ticker-toolbar,
  .news-ticker-toolbar,
  .ticker-actions,
  .ticker-topbar {
    min-height: 42px;
    height: 42px;
    padding-top: 4px;
    padding-bottom: 4px;
    align-items: center;
  }

  .ticker-toolbar .btn,
  .news-ticker-toolbar .btn,
  .ticker-actions .btn,
  .ticker-topbar .btn,
  .ticker-toolbar button,
  .news-ticker-toolbar button,
  .ticker-actions button,
  .ticker-topbar button {
    min-height: 30px;
    height: 30px;
    padding-top: 4px;
    padding-bottom: 4px;
    line-height: 1;
  }

  .news-ticker,
  .ticker-scroller,
  .ticker-marquee,
  .ticker-feed {
    min-height: 30px;
  }

  .ticker-toolbar + .news-ticker,
  .ticker-toolbar + .ticker-scroller,
  .news-ticker-toolbar + .news-ticker,
  .news-ticker-toolbar + .ticker-scroller,
  .ticker-actions + .news-ticker,
  .ticker-actions + .ticker-scroller {
    margin-top: 4px;
  }
}

/* 2026-05-18 beta shell stabilisation.
   Keep the compact beta banner, ticker toolbar and scroller aligned while
   older override blocks are migrated back into ticker-modern.css. */
:root {
  --rfc-beta-banner-desktop-height: 36px;
  --rfc-beta-banner-mobile-height: 32px;
}

body #beta-banner {
  min-height: var(--rfc-beta-banner-desktop-height) !important;
}

body .news-ticker-container {
  top: var(--rfc-beta-banner-desktop-height) !important;
}

body .news-ticker-container .ticker-widget-btn[data-widget="greenie"],
body .news-ticker-container .ticker-widget-btn {
  align-items: center !important;
  justify-content: center !important;
}

body .news-ticker-container .ticker-widget-btn[data-widget="greenie"] .ticker-greenie-icon {
  height: 70% !important;
  max-height: 18px !important;
  max-width: 18px !important;
  width: 70% !important;
}

@media (max-width: 767.98px) {
  body #beta-banner {
    min-height: var(--rfc-beta-banner-mobile-height) !important;
  }

  body .news-ticker-container {
    top: var(--rfc-beta-banner-mobile-height) !important;
  }

  body .news-ticker-container .ticker-top-row {
    height: 40px !important;
    max-height: 40px !important;
    min-height: 40px !important;
    padding: 4px 8px 3px !important;
  }

  body .news-ticker-container .ticker-scroller-row {
    flex: 0 0 30px !important;
    height: 30px !important;
    margin: 4px auto 0 !important;
    max-height: 30px !important;
    min-height: 30px !important;
    width: calc(100% - 10px) !important;
  }

  body .news-ticker-container .ticker-widget-btn,
  body .news-ticker-container .news-ticker-nav-item {
    flex-basis: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
    width: 26px !important;
  }

  body .news-ticker-container .ticker-widget-btn[data-widget="greenie"] .ticker-greenie-icon {
    max-height: 15px !important;
    max-width: 15px !important;
  }
}

/* 2026-05-19 mobile shell hardening from screenshot review.
   Scope: compact ticker stack and reset mobile/offcanvas menu spacing only. */
@media (max-width: 767.98px) {
  body .news-ticker-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 0 !important;
    top: var(--rfc-beta-banner-mobile-height, 32px) !important;
  }

  body .news-ticker-container .ticker-top-row {
    align-items: center !important;
    display: flex !important;
    flex: 0 0 34px !important;
    gap: 4px !important;
    height: 34px !important;
    justify-content: space-between !important;
    max-height: 34px !important;
    min-height: 34px !important;
    overflow: hidden !important;
    padding: 3px 7px !important;
  }

  body .news-ticker-container .ticker-scroller-row {
    align-items: center !important;
    display: flex !important;
    flex: 0 0 26px !important;
    height: 26px !important;
    margin: 2px auto 0 !important;
    max-height: 26px !important;
    min-height: 26px !important;
    overflow: hidden !important;
    padding: 0 0.42rem !important;
    position: relative !important;
    width: calc(100% - 10px) !important;
  }

  body .news-ticker-container .news-ticker-content,
  body .news-ticker-container .ticker-section,
  body .news-ticker-container .ticker-items {
    height: 26px !important;
    line-height: 26px !important;
    min-height: 26px !important;
  }

  body .news-ticker-container .ticker-widget-btn,
  body .news-ticker-container .ticker-social-icon,
  body .news-ticker-container .news-ticker-nav-item {
    align-items: center !important;
    display: inline-flex !important;
    flex: 0 0 24px !important;
    height: 24px !important;
    justify-content: center !important;
    line-height: 1 !important;
    margin: 0 !important;
    max-height: 24px !important;
    min-height: 24px !important;
    padding: 0 !important;
    width: 24px !important;
  }

  body .news-ticker-container .ticker-widget-btn i,
  body .news-ticker-container .ticker-social-icon i {
    font-size: 10px !important;
    line-height: 1 !important;
  }

  body .news-ticker-container .news-ticker-nav {
    align-items: center !important;
    display: flex !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body .news-ticker-container .ticker-title-nav {
    align-items: center !important;
    display: flex !important;
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    margin: 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
  }

  body .news-ticker-container .ticker-widgets-left {
    align-items: center !important;
    display: flex !important;
    flex: 0 0 auto !important;
    gap: 4px !important;
    margin: 0 !important;
    max-width: 36vw !important;
    padding: 0 !important;
  }

  body .news-ticker-container .ticker-info,
  body .news-ticker-container .ticker-social,
  body .news-ticker-container .ticker-widgets-right,
  body .news-ticker-container .news-ticker-title {
    display: none !important;
  }

  body .news-ticker-container .ticker-item,
  body .news-ticker-container .ticker-separator {
    font-size: 0.66rem !important;
    line-height: 1 !important;
  }

  body .news-ticker-container .ticker-widget-btn[data-widget="greenie"] .ticker-greenie-icon {
    height: 14px !important;
    max-height: 14px !important;
    max-width: 14px !important;
    width: 14px !important;
  }

  body .offcanvas,
  body #mobile-nav,
  body .mobile-nav-panel,
  body .mobile-menu-panel {
    align-items: stretch !important;
    gap: 0 !important;
    justify-content: flex-start !important;
    padding: 0.75rem 0.8rem !important;
  }

  body .offcanvas .mobile-nav-list,
  body #mobile-nav .mobile-nav-list,
  body .main-nav .nav-menu.active,
  body .site-header nav.main-nav > ul.nav-menu.active {
    align-items: stretch !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.32rem !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body .offcanvas .mobile-nav-list > li,
  body #mobile-nav .mobile-nav-list > li,
  body .main-nav .nav-menu.active > li,
  body .site-header nav.main-nav > ul.nav-menu.active > li {
    display: block !important;
    margin: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  body .offcanvas .mobile-nav-list a,
  body #mobile-nav .mobile-nav-list a,
  body .main-nav .nav-menu.active a,
  body .site-header nav.main-nav > ul.nav-menu.active a {
    align-items: center !important;
    display: inline-flex !important;
    justify-content: center !important;
    line-height: 1.12 !important;
    margin: 0 !important;
    min-height: 0 !important;
    padding: 0.36rem 0.5rem !important;
    width: auto !important;
  }

  body .offcanvas .nav-dropdown-menu,
  body #mobile-nav .nav-dropdown-menu,
  body .main-nav .nav-menu.active .nav-dropdown-menu,
  body .site-header nav.main-nav > ul.nav-menu.active .nav-dropdown-menu {
    gap: 0 !important;
    margin: 0.18rem 0 0.22rem !important;
    padding: 0.1rem 0 !important;
  }

  body .offcanvas .nav-dropdown:not(.open) > .nav-dropdown-menu,
  body #mobile-nav .nav-dropdown:not(.open) > .nav-dropdown-menu,
  body .main-nav .nav-menu.active .nav-dropdown:not(.open) > .nav-dropdown-menu,
  body .site-header nav.main-nav > ul.nav-menu.active .nav-dropdown:not(.open) > .nav-dropdown-menu {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* 2026-05-20 final mobile menu collapse guard.
   Older glass-menu rules style dropdowns as visible static panels; this
   keeps closed sections out of the layout until the user opens them. */
@media (max-width: 767.98px) {
  body #mobile-nav .nav-dropdown > .nav-dropdown-menu,
  body .offcanvas .nav-dropdown > .nav-dropdown-menu,
  body .main-nav .nav-menu.active .nav-dropdown > .nav-dropdown-menu,
  body .site-header nav.main-nav > ul.nav-menu.active .nav-dropdown > .nav-dropdown-menu {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    max-height: 0 !important;
    min-height: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    visibility: hidden !important;
  }

  body #mobile-nav .nav-dropdown.open > .nav-dropdown-menu,
  body .offcanvas .nav-dropdown.open > .nav-dropdown-menu,
  body .main-nav .nav-menu.active .nav-dropdown.open > .nav-dropdown-menu,
  body .site-header nav.main-nav > ul.nav-menu.active .nav-dropdown.open > .nav-dropdown-menu {
    display: block !important;
    height: auto !important;
    margin: 0.16rem auto 0.24rem !important;
    max-height: none !important;
    opacity: 1 !important;
    overflow: visible !important;
    padding: 0.12rem 0 !important;
    visibility: visible !important;
  }

  body #mobile-nav .mobile-nav-list,
  body .offcanvas .mobile-nav-list,
  body .main-nav .nav-menu.active,
  body .site-header nav.main-nav > ul.nav-menu.active {
    row-gap: 0.24rem !important;
  }

  body #mobile-nav .mobile-nav-list a,
  body .offcanvas .mobile-nav-list a,
  body .main-nav .nav-menu.active a,
  body .site-header nav.main-nav > ul.nav-menu.active a {
    border-bottom: 0 !important;
    justify-content: center !important;
    padding-block: 0.32rem !important;
  }
}