#mobile_phone,#venue_search,#header nav{position:absolute;top:55px;right:0;padding:0;width:100%;height:33px;text-align:center;z-index:10;background-color:transparent}#header.tiny #mobile_phone,#header.tiny nav{top:55px}#header nav.hide{display:none}#header nav.centered > ul{padding:0}#header nav.centered > ul > li{float:none;display:inline-block}#header nav ul > li > a{white-space:nowrap}body.scroll #header nav{top:50px;transition:top 0.4s ease}#header nav.right > ul{float:right;padding-left:0}#header nav.cente#82C90D > ul{padding:0}#header nav.cente#82C90D > ul > li{float:none;display:inline-block;white-space:nowrap;margin-right:-4px}#header nav::after{content:'';display:block;clear:both}#header nav ul{list-style:none;margin:0;padding:0}#header nav ul li{text-align:left}#header nav ul li:hover > ul{display:block}#header nav ul li.last:hover > ul{right:0}#header nav ul > li > a{display:inline-block;color:#FFF;font-size:16px;font-weight:500;padding-top:9px;padding-right:14px;padding-left:14px text-decoration:none;width:125px;position:relative}#header nav ul > li > a.text_small{font-size:11px;padding-top:8px;padding-right:6px;padding-left:6px}#header nav ul > li > a.text_medium{font-size:12px;padding-top:7px;padding-right:10px;padding-left:10px}#header nav ul > li > a.text_large{font-size:15px;padding-top:6px;padding-right:10px;padding-left:10px}#header nav > ul > li.last::after{content:none}#header nav > ul > li > a:active,#header nav > ul > li > a:link,#header nav > ul > li > a:visited{color:#FFF;height:33px}#header nav ul > li > a:hover,#header nav ul > li.nav_active > a:active,#header nav ul > li.nav_active > a:hover,#header nav ul > li.nav_active > a:link,#header nav ul > li.nav_active > a:visited{color:#82C90D}#header nav ul li:hover > div.drop_down_container{display:block}#header nav ul div.drop_down_container{position:absolute;top:33px;left:0;width:auto;padding:0 50px;z-index:12;display:none}#header nav ul div.drop_down_container.mini_container{width:auto;left:auto;padding:0}body.scroll #header nav ul div.drop_down_container{-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;top:42px}#header nav ul div.drop_down_container div.drop_down{background-color:#D5DEE5;padding:20px 0;font-size:0.8em}#header nav ul div.drop_down_container div.drop_down .text_small{font-size:0.8em}#header nav ul div.drop_down_container div.drop_down .text_medium{font-size:0.9em}#header nav ul div.drop_down_container div.drop_down td{padding:0 20px;border-right:1px #005296 solid}@media screen and (max-width: 1000px){#header nav ul div.drop_down_container div.drop_down td{padding:0 10px}}#header nav ul div.drop_down_container div.drop_down td.last{border:none}#header nav ul div.drop_down_container div.nav_top{text-transform:uppercase;margin-top:10px;font-weight:700}#header nav ul div.drop_down_container div.nav_top:first-child{margin-top:0;margin-bottom:10px}#header nav ul div.drop_down_container a{text-decoration:none}#header nav ul ul{position:absolute;top:auto;left:auto;width:auto;padding:0;box-shadow:0 4px 15px rgba(51, 51, 51, .3);display:none}body.scroll #header nav ul ul{-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;top:88px}#header nav ul ul li{position:relative;background-color:#D5DEE5}#header nav ul ul ul{left:100%;top:0}#header nav > ul > li{float:left;padding:0}body.scroll #header nav > ul > li{padding:0 10px 60px}#header nav ul > li > a{width:auto;white-space:nowrap;z-index:13}#header nav ul > li > ul > li > a{width:auto;padding:7px 20px;white-space:nowrap}#header nav a[aria-haspopup="true"]::after{content:'';display:block;width:0;height:0;position:absolute;top:18px;right:10px;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid #82C90D}#header nav > ul > li > a[aria-haspopup="true"]::after{border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #FFF;left:20px;right:auto;bottom:-12px;top:auto}#header nav > ul > li:hover > a[aria-haspopup="true"]::after{border-top:6px solid #82C90D}#header nav > ul > li.nav_active > a[aria-haspopup="true"]::after,#header nav ul > li:hover > a:link,#header nav ul > li:hover > a:visited{color:#82C90D}#header nav ul li.nav_search{margin-top:-55px}#header nav ul li.nav_search a i{color:#1E6EB0;font-size:30px}#header nav ul div.drop_down_container div.drop_down div.nav_donate,#header nav ul li.nav_donate{margin-top:-40px}#header nav ul div.drop_down_container div.drop_down div.nav_donate a,#header nav ul li.nav_donate a{margin:0;background-color:#82C90D;color:#FFF !important;overflow:hidden;padding:4px 14px;line-height:14px;text-transform:uppercase;text-decoration:none;cursor:pointer;letter-spacing:1px;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;white-space:nowrap;border:#82C90D solid thin;border-radius:15px}#header nav ul div.drop_down_container div.drop_down div.nav_donate a:hover,#header nav ul li.nav_donate a:hover{background-color:#FFF;color:#82C90D !important;text-decoration:none;border:#82C90D solid thin}#header nav ul div.nav_button{padding-top:10px}#header nav ul div.drop_down_container div.drop_down div.nav_button a,#header nav ul li.nav_button a{background-color:#006CB2;color:#FFF !important;font-size:1em;line-height:1.5em;overflow:hidden;padding:4px 14px;text-transform:uppercase;text-decoration:none;cursor:pointer;letter-spacing:1px;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;white-space:normal;border:#80CA31 solid thin;border-radius:5px}#header nav ul div.drop_down_container div.drop_down div.nav_button a:hover,#header nav ul li.nav_button a:hover{background-color:#FFF;color:#006CB2 !important;text-decoration:none;border:#80CA31 solid thin}#navbar-footer ul{list-style:none;margin:0 0 30px;padding:0}#navbar-footer ul li{text-align:left;display:inline-block;padding:0 10px 0 5px;border-right:#607490 solid thin}#navbar-footer ul li a{text-decoration:none;text-transform:uppercase}#navbar-footer ul li.nav_search a i{color:#2993C9;font-size:15px}#navbar-footer ul li.last{border:none}#mobile_nav{position:absolute;top:0;right:20px;margin:0;width:60px;height:50px;text-align:center;padding:0;z-index:500;transition:all 0.4s ease}#mobile_nav a{text-decoration:none;line-height:normal}.mobile-nav-toggle{position:absolute;width:30px;height:30px;top:5px;right:40px;vertical-align:middle;cursor:pointer;color:#FFF;padding:0;display:inline-block;z-index:1002;transition:top 0.4s ease}@media screen and (max-width: 400px){.mobile-nav-toggle{right:20px}}.top-bar{width:40px;height:4px;background-color:#458ec0;position:absolute;top:0;transition:transform 0.1s 0.1s ease-in-out;-webkit-transition:transform 0.1s 0.1s ease-in-out;-moz-transition:transform 0.2s 0.2s ease-in-out;-o-transition:transform 0.1s 0.1s ease-in-out}.middle-bar{width:40px;height:4px;background-color:#7f8283;position:absolute;top:10px;transition:opacity 0 0.1s linear;-webkit-transition:opacity 0 0.1s linear;-moz-transition:opacity 0 0.1s linear;-o-transition:opacity 0 0.1s linear}.bottom-bar{width:40px;height:4px;background-color:#80CA31;position:absolute;top:20px;transition:transform 0.1s 0.1s ease-in-out;-webkit-transition:transform 0.1s 0.1s ease-in-out;-moz-transition:transform 0.1s 0.1s ease-in-out;-o-transition:transform 0.1s 0.1s ease-in-out}.toggle-name{position:absolute;top:26px;left:0;font-size:14px;color:#FFF}div.mobile-nav-toggle.open .top-bar{transform:rotate(45deg);-webkit-transition:rotate(45deg);-moz-transition:rotate(45deg);-o-transition:rotate(45deg);top:7px}div.mobile-nav-toggle.open .middle-bar{opacity:0}div.mobile-nav-toggle.open .bottom-bar{transform:rotate(-45deg);-webkit-transition:rotate(-45deg);-moz-transition:rotate(-45deg);-o-transition:rotate(-45deg);top:7px}#nav_ul > li > a:hover{color:#268CD1 !important}

/* ============================================================
   Phase 3 — CSS Grid header: center nav on viewport
   Desktop only (>= 1050px). On mobile, all three elements use
   their existing position:fixed / display:none rules.
   Uses 1fr-auto-1fr so nav is VIEWPORT-centered regardless of
   logo/phone width difference (logo=364px, phone=283px).
   ============================================================ */
@media screen and (min-width: 1050px) {
	/* Header becomes a 2-row grid: top-bar row + logo|nav|phone row */
	#header {
		display: grid !important;
		grid-template-columns: 1fr auto 1fr;
		grid-template-rows: auto auto;
		margin-right: 0 !important;
	}

	/* Top utility bar spans all 3 columns */
	#header > .site-header-top {
		grid-column: 1 / -1;
		grid-row: 1;
	}

	/* Logo: left-aligned in row 2, fills left column */
	#header > .main_logo {
		grid-column: 1;
		grid-row: 2;
		position: relative !important;
		top: auto !important;
		left: auto !important;
		display: flex !important;
		align-items: center;
		justify-self: start;
		padding-left: 40px;
		height: auto !important;
		z-index: 81;
	}
	/* Scroll state: keep grid layout (override master.css .tiny rules) */
	#header.tiny > .main_logo {
		top: auto !important;
		left: auto !important;
	}

	/* Nav: TRUE viewport-center (column 2 = auto, flanked by equal 1fr) */
	#header > nav.centered {
		grid-column: 2;
		grid-row: 2;
		position: relative !important;
		top: auto !important;
		right: auto !important;
		width: auto !important;
		height: auto !important;
		display: flex !important;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	/* Scroll state: keep relative positioning */
	#header.tiny > nav.centered,
	body.scroll #header > nav.centered {
		top: auto !important;
	}

	/* Phone: right-aligned in row 2, fills right column */
	#header > #phone {
		grid-column: 3;
		grid-row: 2;
		float: none !important;
		display: flex !important;
		align-items: center;
		justify-content: flex-end;
		padding: 0 20px 0 0;
	}
}

/* ============================================================
   Rules moved from inline <style> block (CLS trimming)
   ============================================================ */

/* --- Logo visual styling (CLS sizing kept inline) --- */
.ptg-logo { text-decoration: none !important; color: #ffffff !important; }
.ptg-logo:hover { text-decoration: none !important; opacity: 0.9; }
.ptg-logo__text { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif; font-weight: 600; font-size: 18px; letter-spacing: -0.01em; white-space: nowrap; line-height: 1; }
.ptg-logo__text sup { font-size: 0.5em; font-weight: 400; vertical-align: super; line-height: 1; }

/* --- Dropdown menus: hover/focus visibility --- */
li.nav_simple:hover > ul.ptg-dropdown,
li.nav_simple:focus-within > ul.ptg-dropdown { display: block !important; }
#nav_ul > li:hover > a[aria-haspopup="menu"]::before { display: none !important; }
li.nav_simple > a[aria-haspopup="menu"]::after {
	display: block !important;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #FFF;
	left: 20px; right: auto; bottom: -12px; top: auto;
}

/* --- Hover bridges: invisible pseudo-elements that fill the gap between
       nav trigger and dropdown panel so the mouse can traverse without
       losing :hover state --- */
.ptg-mega::before {
	content: '';
	position: absolute;
	top: -42px;
	left: 0;
	right: 0;
	height: 42px;
}
/* Bridge the gap between the LI and the fixed-positioned mega dropdown.
   The LI bottom is ~72px; the mega top is 110px. This pseudo-element
   extends the LI's hover zone so the mouse can traverse without
   dropping the :hover state before the mega becomes visible. */
li.ptg-mega-parent {
	position: relative;
}
li.ptg-mega-parent::after {
	content: '';
	position: absolute;
	left: -40px;
	right: -40px;
	top: 100%;
	height: 50px;
	z-index: 9;
}
ul.ptg-dropdown::before {
	content: '';
	position: absolute;
	top: -15px;
	left: 0;
	width: 100%;
	height: 15px;
}

/* ============================================================
   Search overlay — fixed card + backdrop
   ============================================================ */

/* Curtain: dark backdrop covering entire viewport */
#curtain {
	position: fixed !important;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(5,10,25,0.80) !important;
	z-index: 9000 !important;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

/* Hide the wrapper div — we position search_container directly */
#venue_search {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 0 !important;
	height: 0 !important;
	overflow: visible !important;
	z-index: 9500 !important;
}

/* Search card: fixed centered near top of viewport */
#search_container {
	position: fixed !important;
	top: 120px !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	width: 92% !important;
	max-width: 660px;
	height: auto !important;
	z-index: 9600;
	background: rgba(17,27,51,0.97);
	border: 1px solid rgba(255,255,255,0.1);
	border-radius: 16px;
	padding: 24px 28px;
	box-shadow: 0 24px 80px rgba(0,0,0,0.6);
}
#search_container form#search {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	text-align: left;
}

/* Search input */
input#search_for {
	flex: 1;
	width: 100% !important;
	padding: 14px 20px !important;
	font-size: 1.1rem !important;
	font-family: var(--font-heading, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
	background: rgba(255,255,255,0.06) !important;
	color: #fff !important;
	border: 2px solid rgba(255,255,255,0.15) !important;
	border-radius: 12px !important;
	outline: none !important;
	transition: border-color 0.25s, box-shadow 0.25s;
	margin: 0 !important;
}
input#search_for:focus {
	border-color: #00A9E0 !important;
	box-shadow: 0 0 0 4px rgba(0,169,224,0.2) !important;
}
input#search_for::placeholder {
	color: rgba(255,255,255,0.35) !important;
	font-weight: 400;
}

/* Close button */
#close_search {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 10px;
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(255,255,255,0.1);
	color: rgba(255,255,255,0.6);
	transition: all 0.2s;
	flex-shrink: 0;
	text-decoration: none;
}
#close_search:hover {
	background: rgba(255,80,80,0.12);
	border-color: rgba(255,80,80,0.3);
	color: #ff5050;
}
#close_search svg {
	width: 20px;
	height: 20px;
}

/* Suggestions dropdown: positioned right below the search card */
div#search_for_auto_complete {
	position: fixed !important;
	top: 210px !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	width: 92% !important;
	max-width: 660px;
	background: rgba(17,27,51,0.97) !important;
	color: #F0F0F0 !important;
	border: 1px solid rgba(255,255,255,0.1) !important;
	border-top: none !important;
	border-radius: 0 0 16px 16px !important;
	box-shadow: 0 20px 60px rgba(0,0,0,0.5) !important;
	padding: 16px 28px 20px !important;
	z-index: 99999;
}
div#search_for_auto_complete p {
	color: #00A9E0 !important;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 0.7rem;
	letter-spacing: 0.1em;
	margin: 0 0 12px 0;
	padding: 0 0 10px 4px;
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
div#search_for_auto_complete ul.contacts {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
}
div#search_for_auto_complete .contact {
	padding: 10px 14px;
	border-radius: 8px;
	cursor: pointer;
	transition: background 0.15s;
	margin-bottom: 2px;
	background: transparent !important;
}
div#search_for_auto_complete .contact:hover {
	background: rgba(0,169,224,0.1);
}
div#search_for_auto_complete .contact .name {
	color: #fff !important;
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 2px;
}
div#search_for_auto_complete .contact .email {
	color: rgba(255,255,255,0.45) !important;
	font-size: 0.78rem;
	line-height: 1.4;
}

/* Desktop grid: don't let the grid affect fixed search */
@media screen and (min-width: 1050px) {
	#venue_search {
		grid-column: 1 / -1;
		grid-row: 1 / -1;
	}
}