/**
 * Site Header + Navigation
 *
 * Extracted from style.css on 2026-04-22 (CSS consolidation Session 4 split).
 * Original lines 1001-1588. Contents: Site header, title area, site navigation,
 * responsive menu, header menu, animated menu (NextRust Slab), footer menu,
 * push-up animation keyframes.
 */

/* Site Header
---------------------------------------------------------------------------- */

.site-header {
	background-color: #222;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
	padding: 0 30px;
	border-bottom: none;
	position: relative;
}

.site-header::before {
	content: "";
	position: absolute;
	bottom: 0px;
	left: 0;
	width: 100%;
	height: 20px;
	background: #4da44b;
	clip-path: polygon(0% 100%, 10% 20%, 20% 40%, 30% 10%, 40% 50%, 50% 15%, 60% 60%, 70% 25%, 80% 45%, 90% 20%, 100% 100%, 100% 100%, 0% 100%);
	overflow: hidden;
	z-index: 1;
}

/* Title Area
--------------------------------------------- */

.title-area {
	float: left;
	padding-bottom: 25px;
	padding-top: 25px;
}

.wp-custom-logo .title-area {
	max-width: 350px;
	padding-bottom: 5px;
	padding-top: 5px;
	width: 100%;
}

.wp-custom-logo .custom-logo-link {
	display: block;
}

.wp-custom-logo .title-area img {
	width: auto;
}

.site-title {
	font-size: 20px;
	font-weight: 600;
	line-height: 1;
	margin-bottom: 0;
}

.site-title a,
.site-title a:focus,
.site-title a:hover {
	color: #333;
	text-decoration: none;
}

.site-description,
.wp-custom-logo .site-title {
	border: 0;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}


/* Site Navigation
---------------------------------------------------------------------------- */

.genesis-nav-menu {
	clear: both;
	line-height: 1;
	width: 100%;
	font-size:14px;
font-family: 'Roboto', sans-serif;
font-weight: 500;
line-height:1.5;
}

.genesis-nav-menu .menu-item {
	display: block;
	float: none;
	position: relative;
}

.genesis-nav-menu a, .review-archive-page-entry-title a {
	color: #4da44b;
	display: block;
	font-size: 20px;
	font-weight: 500;
	font-family: 'Roboto', san-sans-serif;
	outline-offset: -1px;
	padding-bottom: 12px;
	padding-top: 12px;
	text-decoration: none;
	text-transform: uppercase;
}

.review-archive-page-entry-title a:focus,
.review-archive-page-entry-title a:hover,
.review-archive-page-entry-title .current-menu-item > a,
.review-archive-page-entry-title .sub-menu .current-menu-item > a:focus,
.review-archive-page-entry-title .sub-menu .current-menu-item > a:hover  {
	color: #ffcc00;
	text-decoration: none;
}

.genesis-nav-menu a:focus,
.genesis-nav-menu a:hover,
.genesis-nav-menu .current-menu-item > a,
.genesis-nav-menu .sub-menu .current-menu-item > a:focus,
.genesis-nav-menu .sub-menu .current-menu-item > a:hover {
	color: #ffcc00;
	text-decoration: none;
}

.genesis-nav-menu .sub-menu,
.genesis-nav-menu .sub-menu a {
	width: 100%;
}

.genesis-nav-menu .sub-menu {
	clear: both;
	display: none;
	left: -9999px;
	margin: 0;
	opacity: 1;
	padding-left: 15px;
	position: static;
	z-index: 99;
}

.genesis-nav-menu .sub-menu a {
	background-color: #2d2d2d;
	color: #e0e0e0;
	font-size: 14px;
	position: relative;
	word-wrap: break-word;
}

.genesis-nav-menu .sub-menu a:hover,
.genesis-nav-menu .sub-menu a:focus {
	background-color: #4da44b;
	color: #ffffff;
}

.genesis-nav-menu .menu-item:focus,
.genesis-nav-menu .menu-item:hover {
	position: relative;
}

/* Responsive Menu
--------------------------------------------- */

.menu .menu-item:focus {
	position: static;
}

.js .nav-primary {
	display: none;
	position: relative;
}

.genesis-responsive-menu .genesis-nav-menu .menu-item:hover > .sub-menu {
	display: none;
}

.menu-toggle,
.sub-menu-toggle {
	background-color: transparent;
	border-width: 0;
	color: #333;
	display: block;
	margin: 0 auto;
	overflow: hidden;
	text-align: center;
	visibility: visible;
}

.menu-toggle:focus,
.menu-toggle:hover,
.sub-menu-toggle:focus,
.sub-menu-toggle:hover {
	background-color: transparent;
	border-width: 0;
	color: #0073e5;
}

.menu-toggle {
	float: right;
	line-height: 20px;
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 15px 0;
	position: relative;
	z-index: 1000;
}

.menu-toggle.activated::before {
	content: "\f335";
}

.site-header .dashicons-before::before {
	transition: none;
}

.site-header .menu-toggle::before {
	float: left;
	margin-right: 5px;
	position: relative;
	text-rendering: auto;
	top: 1px;
}

.sub-menu-toggle {
	float: right;
	padding: 9px 10px;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 100;
}

.sub-menu .sub-menu-toggle {
	padding: 12px 10px;
}

.sub-menu-toggle::before {
	display: inline-block;
	text-rendering: auto;
	transform: rotate(0);
	transition: transform 0.25s ease-in-out;
}

.sub-menu-toggle.activated::before {
	transform: rotate(180deg);
}

/* Header Menu
--------------------------------------------- */

.nav-primary {
	clear: left;
	padding-bottom: 15px;
	padding-top: 15px;
	width: 100%;
}

/* Animated Menu Styles - NextRust Slab */
@font-face {
	font-family: 'NextRust Slab';
	/* Paths relative to THIS file's location (assets/css/theme/) — the
	   split on 2026-04-22 moved this rule out of style.css at theme root,
	   so "./assets/fonts/..." no longer resolves correctly. Going up two
	   levels lands in assets/, then down into fonts/. */
	src: url('../../fonts/NexaRustSlab-Trial-Black3.woff2') format('woff2'),
		 url('../../fonts/NexaRustSlab-Trial-Black3.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

/* Apply NextRust Slab to all primary menu items */
.nav-primary .genesis-nav-menu a {
	font-family: 'NextRust Slab', Arial, sans-serif !important;
}

.animated-menu-link {
	font-family: 'NextRust Slab', Arial, sans-serif !important;
}

.menu-fixed {
	color: inherit;
}

.morphing-word {
	position: relative;
	display: inline-block;
	min-width: 100px;
	text-align: left;
	height: 1.2em;
	transition: width 0.3s ease;
	/* Use overflow-x visible to prevent horizontal text truncation on font load timing */
	/* Keep overflow-y hidden for the morphing animation to work */
	overflow-x: visible;
	overflow-y: hidden;
	/* Allow z-index stacking for overlapping words */
	transform-style: preserve-3d;
}



.word-option {
	position: absolute !important;
	left: 0 !important;
	top: 3px !important;
	opacity: 0;
	font-size: inherit !important;
	animation: finalSwipe 9s infinite;
	line-height: inherit !important;
	vertical-align: baseline !important;
}

.word-color-orange { color: #ff6b35; } /* Orange */
.word-color-cyan { color: #00bcd4; } /* Cyan */
.word-color-purple { color: #9c27b0; } /* Purple */

/* Legacy support */
.word-color-0 { color: #ff6b35; } /* Orange (was Green) */
.word-color-1 { color: #00bcd4; } /* Cyan (was Orange) */  
.word-color-2 { color: #9c27b0; } /* Purple (was Cyan) */

.menu-dropdown-arrow {
	color: #aaa;
	font-size: 0.9em;
	margin-left: 4px;
	display: inline;
}

/* Animated menu dropdown width fix */
.menu-item:has(.animated-menu-link):hover > .sub-menu {
	min-width: 100%;
	width: auto;
}

.menu-item:has(.animated-menu-link):hover > .sub-menu a {
	width: 100%;
	min-width: 100%;
}

/* Ensure animated menu link takes full width of dynamically sized container */
.animated-menu-link {
	display: block;
	width: 100%;
}

/* Fix menu flickering on game pages and improve hover stability */
.genesis-nav-menu .menu-item {
	position: relative !important;
}

/* Keep submenu hidden by default - let JavaScript OR CSS control it, not both */
.genesis-nav-menu .sub-menu {
	position: absolute !important;
	top: 100% !important;
	left: 0 !important;
	margin-top: -1px !important; /* Slight overlap to prevent gap */
	z-index: 9999 !important; /* Ensure menu is on top */
	min-width: 200px !important;
	/* Initially hide with display none to prevent any visibility */
	display: none !important;
}

/* When JavaScript adds sfHover, show the menu */
.genesis-nav-menu .menu-item.sfHover > .sub-menu {
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
}

/* Fallback: If JavaScript fails, CSS hover still works */
.genesis-nav-menu .menu-item:hover > .sub-menu,
.genesis-nav-menu .menu-item:focus-within > .sub-menu,
.genesis-nav-menu .menu-item .sub-menu:hover {
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
}

/* Extend hover area to prevent gap */
.genesis-nav-menu .menu-item > a {
	display: block;
	position: relative;
	z-index: 10;
}

/* Create invisible bridge to prevent flickering */
.genesis-nav-menu .menu-item::after {
	content: '';
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	height: 10px; /* Bridge height */
	background: transparent;
	z-index: 9998;
	pointer-events: none; /* Don't interfere with clicks */
}

/* Extend hover area for menu items with submenus */
.genesis-nav-menu .menu-item-has-children {
	position: relative;
}

.genesis-nav-menu .menu-item-has-children::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: -10px; /* Extend hover area downward */
	z-index: 1;
}

/* Specific fix for game pages - higher z-index */
.single-games .genesis-nav-menu .sub-menu {
	z-index: 99999 !important; /* Override any game page z-index */
}

/* Fix sub-menu item spacing and appearance */
.genesis-nav-menu .sub-menu a {
	display: block;
	padding: 12px 20px;
	white-space: nowrap;
	border-bottom: 1px solid rgba(255,255,255,0.05);
	/* Prevent width shrinking during page navigation */
	min-width: 100%;
	box-sizing: border-box;
}

.genesis-nav-menu .sub-menu li:last-child a {
	border-bottom: none;
}

.genesis-nav-menu .sub-menu a:hover,
.genesis-nav-menu .sub-menu a:focus {
	background-color: #4da44b;
	color: #ffffff;
}

/* Prevent menu from collapsing during click/navigation */
.genesis-nav-menu .sub-menu a:active {
	background-color: #4da44b;
	color: #ffffff;
}

/* Keep submenu visible when any link inside is being clicked */
.genesis-nav-menu .menu-item:has(.sub-menu a:active) > .sub-menu {
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* Freeze menu state during page navigation to prevent visual glitches */
.genesis-nav-menu.navigating .sub-menu.nav-frozen,
.genesis-nav-menu.navigating .sub-menu.nav-frozen a {
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	min-width: 200px !important;
	width: auto !important;
}

/* Right-align dropdowns on rightmost menu items to prevent viewport overflow */
/* -n+3 accounts for the coin item being the last child */
.genesis-nav-menu > .menu-item:nth-last-child(-n+3):not(.wakasm-nav-coin) > .sub-menu {
	left: 0 !important;
	right: auto !important;
}

/* Patron credit coin in nav */
.wakasm-nav-coin a.animated-menu-link,
.wakasm-nav-coin a {
	background: #111 !important;
	border: 1px solid #333 !important;
	border-radius: 20px !important;
	padding: 5px 12px !important;
	transition: border-color 0.2s !important;
}

.wakasm-nav-coin a:hover,
.wakasm-nav-coin a.animated-menu-link:hover {
	border-color: #f5c842 !important;
}

/* Position-only tweaks for the nav coin span; sizing/colors come from
   .wakasm-coin--mini in assets/css/utilities/coin.css. */
.wakasm-nav-coin-img {
	vertical-align: middle;
	margin-right: 4px;
}

.wakasm-nav-coin-count {
	font-weight: 700;
	color: #f5c842 !important;
	font-size: 15px;
	vertical-align: middle;
}

/* Ensure sub-menu items don't overflow — size to content */
.genesis-nav-menu .sub-menu {
	width: auto !important;
	min-width: 200px !important;
}

.genesis-nav-menu .sub-menu a {
	width: auto !important;
	white-space: nowrap !important;
	padding-right: 20px !important;
}

/* Push-up animation with continuous word visibility and overlap */
@keyframes finalSwipe {
	/* Word is fully visible and in position */
	0%, 28% {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0px);
		z-index: 2;
	}
	/* Word starts pushing up as new word arrives from below */
	30% {
		opacity: 0.8;
		transform: translateY(-5px);
		filter: blur(0.5px);
		z-index: 1;
	}
	32% {
		opacity: 0.4;
		transform: translateY(-15px);
		filter: blur(2px);
		z-index: 1;
	}
	33% {
		opacity: 0;
		transform: translateY(-25px);
		filter: blur(4px);
		z-index: 1;
	}
	/* Word waits below, ready to come up */
	34%, 94% {
		opacity: 0;
		transform: translateY(25px);
		filter: blur(4px);
		z-index: 1;
	}
	/* Word slides up from below while previous word is still leaving */
	95% {
		opacity: 0.4;
		transform: translateY(15px);
		filter: blur(2px);
		z-index: 2;
	}
	97% {
		opacity: 0.8;
		transform: translateY(5px);
		filter: blur(0.5px);
		z-index: 2;
	}
	/* Word arrives in position */
	100% {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0px);
		z-index: 2;
	}
}


/* Footer Menu
--------------------------------------------- */

.nav-secondary {
	margin-top: 10px;
}

.nav-secondary .genesis-nav-menu {
	line-height: 1.5;
}

.nav-secondary .menu-item {
	display: inline-block;
}

.nav-secondary a {
	margin-left: 10px;
	margin-right: 10px;
	padding: 0;
}


