/* =========================================================
   IPHONE / MOBILE HEADFOOT STYLES (CLEANED & SEPARATED)
/* =========================================================
   CLEAN & UNIFIED MOBILE HEADER & FOOTER STYLES
   ========================================================= */

/* 1. Base Header Styling */
header, .page-header {
  border-top: 4px solid #16130B !important;
  border-bottom: none !important;
  box-shadow: none !important;
  background-color: #000000 !important;
  box-sizing: border-box !important;
}

.header-bar {
  display: block !important;
  width: 100% !important;
  height: 6px !important;
  background-color: #445368 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}





/* 2. Eliminate default browser margins on the top masthead/header wrappers */
#masthead, 
.site-header, 
.header-container,
header:first-of-type {
  margin-top: 0 !important;
  padding-top: 0 !important;
  top: 0 !important;
}
/* =========================================================
   STABLE FIXED FOOTER (Balanced 3px Borders & Safe Padding)
   ========================================================= */
footer, .center-footer, #footer {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  background-color: #000000 !important;
  border-top: 6px solid #445368 !important;
  border-bottom: 6px solid #445368 !important;
  box-sizing: border-box !important;
  z-index: 999999 !important;
  padding: 8px 12px !important; /* Restores breathing room for text */
}

.footer-inner {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
  gap: 10px !important;
  margin: 0 !important;
}

.footer-inner > *:first-child {
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: left !important;
  color: #D65A5A !important;
}

.footer-inner > *:last-child {
  white-space: nowrap !important;
  text-align: right !important;
  color: #D65A5A !important;
}

/* Clear out any broken pseudo-elements */
footer::before, footer::after,
.center-footer::before, .center-footer::after,
#footer::before, #footer::after {
  display: none !important;
  content: none !important;
}

/* Explicitly clear out rogue pseudo-element bars to stop double lines */
footer::after, 
.center-footer::after, 
#footer::after {
  display: none !important;
  content: none !important;
}

/* 3. Strip top margins from the very first element inside body or main */
body > *:first-child,
main:first-of-type,
.main:first-of-type,
.container:first-of-type {
  margin-top: 0 !important;
}
html, body {
   position	
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.container, .wrapper, main, header, footer {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  margin: 0 !important;
}

header, .header, nav, .navbar-container {
  height: auto !important;
  min-height: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background-color: #000000 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}





/* Target anchor tag positioning for the pseudo-element border */
.site-title, 
h1.site-title {
  position: relative !important;
  font-size: 18px !important; /* Slightly adjusted down to ensure it fits safely on iPhone screens */
  font-weight: normal !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
  background-color: #000000 !important;
  border: none !important;
  overflow: visible !important;
  white-space: nowrap !important; /* Added here so the container forces a single line */
}

.site-title a, 
h1.site-title a {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  background-color: #000000 !important;
  color: #D65A5A !important;
  padding: 14px 15px 8px 15px !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.site-title a::before, 
h1.site-title a::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: 6px !important;
  background-color: #50525D !important;
  z-index: 9999 !important;
}

/* Fallback if title has no <a> tag */
h1.site-title:not(:has(a)) {
  padding: 14px 15px 8px 15px !important;
}

h1.site-title:not(:has(a))::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: 6px !important;
  background-color: #50525D !important;
  z-index: 9999 !important;
}

header, 
.site-header, 
#masthead, 
.page-header {
  background-color: transparent !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  overflow: visible !important;
}




/* Page Header Wrapper */
.page-header {
  font-size: 16px !important;
  font-weight: normal !important;
  text-align: center !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 8px 15px !important;
  margin: 0 !important;
  background-color: #000000 !important;
  color: #D65A5A !important;
}

/* Page Title */
.page-title, 
h2.page-title, 
.page-header h2 {
  font-size: 18px !important;
  font-weight: normal !important;
  text-align: center !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 4px 15px !important;
  margin: 0 !important;
  background-color: #000000 !important;
  color: #D65A5A !important;
}

/* Navbar Layout */
.navbar {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
 background-color: #404040 !important;
 
  padding: 2px 0 !important;
  margin: 0 !important;
  
}

.nav-list {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 3px 0 !important;
  gap: 14px !important;
}

.nav-list li {
  flex: none !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Navbar Menu Tab Items (Bold applied here) */
.nav-list a {
  font-size: 16px !important;
  font-weight: bold !important;
  padding: 0 4px !important;
  color: #ffffff !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
}

.nav-list a:hover {
  color: #cccccc !important;
}

/* Reduce Navbar Height */
.navbar {
  padding: 0 !important; 
  min-height: auto !important;
}

.nav-list {
  padding: 0 !important; 
  margin: 0 !important;
}

.nav-list a {
  padding: 2px 4px !important; 
  line-height: 1.2 !important; 
}



/* Page Header Bar Height Reduction */
header, 
.site-header, 
#masthead, 
.page-header {
  padding-top: 3px !important;
  padding-bottom: 3px !important;
  min-height: 0 !important;
}






main, .main-content, .content-wrapper {
  padding-bottom: 60px !important; 
  margin-bottom: 20px !important;
}

/* Mobile Dropdown */
/* 1. Hide all dropdown submenus by default on mobile */
.navbar .dropdown-content,
.navbar .dropdown-menu,
.nav-list li.dropdown .dropdown-content,
.nav-list li.dropdown .dropdown-menu {
  display: none !important;
}

/* 2. Display ONLY the submenu belonging to the specific active/open list item */
.navbar .nav-list li.dropdown.active > .dropdown-content,
.navbar .nav-list li.dropdown.mobile-open > .dropdown-content,
.navbar .nav-list li.dropdown.active > .dropdown-menu,
.navbar .nav-list li.dropdown.mobile-open > .dropdown-menu {
  display: block !important;
  position: static !important;
  width: 100% !important;
  background-color: #222 !important;
  padding-left: 15px !important;
  margin-top: 5px !important;
  box-sizing: border-box !important;
}











/* =========================================================
   SAFE FIXED HEADER, FOOTER & BUTTON CLEANUP
   ========================================================= */
/* 1. Neutralize ancestor layout containment and transforms that break fixed positioning */
html, body, #page, .site, .site-inner, #wrapper, div[id*="page"], div[class*="site"] {
  contain: none !important;
  transform: none !important;
  will-change: auto !important;
  filter: none !important;
  backdrop-filter: none !important;
}

/* 2. Fix the master header container (which holds the header-wrap, page-title, and header-bar together natively) */
#masthead, 
.site-header, 
.header-container, 
.header-container-wrap,
.ast-main-header-wrap,
header:first-of-type {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 999999 !important;
  box-sizing: border-box !important;
  transform: translateZ(0) !important;
}

/* Fallback individual locking if the container selector doesn't catch it */
.header-wrap, .page-title, .header-bar {
  box-sizing: border-box !important;
}



/* 4. Push body content down so it doesn't slide under the fixed header stack */
body {
  padding-top: 130px !important;   /* Adjust this value if the combined header stack is taller or shorter */
  padding-bottom: 50px !important; /* Height of the footer */
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* 5. Keep the navbar strictly horizontal on a single line */
.navbar {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
}

.navbar .nav-list {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* 6. Dropdown positioning clearing the full locked stack */
.navbar .nav-list li.dropdown.active .dropdown-content,
.navbar .nav-list li.dropdown.mobile-open .dropdown-content {
  display: block !important;
  position: fixed !important;
  top: 130px !important; /* Must match body padding-top */
  left: 0 !important;
  width: 100vw !important;
  max-height: calc(100vh - 130px) !important;
  box-sizing: border-box !important;
  z-index: 9999999 !important;
  background: transparent !important;
  background-color: transparent !important;
  padding-top: 20px !important;
  padding-left: 20px !important;
  overflow-y: auto !important;
}

.navbar .nav-list li.dropdown.active .dropdown-content ul,
.navbar .nav-list li.dropdown.mobile-open .dropdown-content ul {
  display: flex !important;
  flex-direction: column !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}

/* 1. Force the master header container to use vertical flex layout */
#masthead, 
.site-header, 
.header-container {
  display: flex !important;
  flex-direction: column !important;
}

/* 2. Enforce strict sequential order: Title -> Navbar -> Page-Header Bar */
.site-title, 
.site-branding {
  order: 1 !important;
}

.navbar {
  order: 2 !important;
 
}

.page-header, 
.header-bar {
  order: 3 !important;
  position: relative !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 1. Lock the header container flow */
#masthead, 
.site-header, 
.header-container {
  display: flex !important;
  flex-direction: column !important;
}

/* 2. Ensure Navbar stays at order 2 and Page-Header sits cleanly at order 3 */
.navbar {
  order: 2 !important;
  position: relative !important;
}

.page-header, 
.header-bar {
  order: 3 !important;
  position: relative !important;
  z-index: 1 !important;
}

/* 3. Isolate the dropdown so it breaks out of the navbar box and goes transparent */
.navbar .dropdown-menu,
.navbar .dropdown-content,
.navbar ul ul {
  position: absolute !important;
  top: 100% !important; /* Anchors it precisely to the bottom of the navbar */
  left: 0 !important;
  width: 100% !important;
  background-color: transparent !important; /* Makes the dropdown background transparent */
  z-index: 99999 !important; /* Floats over the page-header below it */
}

/* 1. Add top spacing to push the dropdown down and remove bullets */
.navbar .dropdown-menu,
.navbar .dropdown-content,
.navbar ul ul {
  margin-top: 75px !important;
  list-style: none !important;
  padding-left: 0 !important;
}

/* 2. Ensure individual list items also strip default bullet formatting */
.navbar .dropdown-menu li,
.navbar .dropdown-content li,
.navbar ul ul li {
  list-style: none !important;
  background: none !important;
}

.dropdown-toggle-btn {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  color: inherit !important;
  padding: 0 4px !important;
  cursor: pointer;
}

/* 1. Ensure the nav list items sit horizontally and align properly */
.nav-list {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 2. Style the dropdown container so it stays compact */
.dropdown-container {
  display: flex !important;
  align-items: center !important;
  position: relative !important;
}

/* 3. Neutralize any stray padding or line-height expansion */
.dropdown-toggle-btn, 
.nav-main-link {
  display: inline-block !important;
  margin: 0 !important;
  line-height: normal !important;
}

.nav-main-link {
  position: relative !important;
  z-index: 10 !important;
  pointer-events: auto !important;
}


/* Evenly distribute all 5 items across the full width */
.nav-list {
  display: flex !important;
  justify-content: space-evenly !important; /* Distributes balanced space both between items and at the outer ends */
  align-items: center !important;
  width: 100% !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  list-style: none !important;
  margin: 0 !important;
}

/* Ensure list items don't wrap */
.nav-list > li {
  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
}

/* Base styling for all main navigation text links */
.nav-list a {
  text-decoration: none !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-family: Arial, Helvetica, sans-serif !important;
}







/* Ensure the main links behave normally on touch */
.nav-main-link, .navbar a {
  cursor: pointer;
}






