/* =========================================================
   GLOBAL HEADER
   ========================================================= */


#main-header .container.et_menu_container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* DESKTOP: FORCE TRUE VERTICAL CENTERING */
@media (min-width: 981px) {

  /* Make the header row act like a proper flex bar */
  #main-header .container.et_menu_container {
    display: flex !important;
    align-items: center !important;
	margin-bottom: 2px !important;
  }

  /* Kill Divi's inline padding-left (your screenshot shows 272px inline) */
  #et-top-navigation {
    padding: 0 !important;         /* top/right/bottom/left = 0 */
    margin: 0 !important;
    align-self: center !important;
    align-items: center !important;
  }

  /* Make the menu itself vertically center */
  #top-menu-nav,
  #top-menu {
    display: flex !important;
    align-items: center !important;
  }

  /* Logo container: stop any height/padding weirdness from biasing it down */
  #main-header .logo_container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-self: center !important;
    display: flex !important;
    align-items: center !important;
  }
}


/* Prevent logo resize animation on load */
.et_pb_svg_logo #logo {
  height: auto !important;
  max-height: 50px !important;
  transition: none !important;
}

/* Stabilize header layout before Divi JS runs */



body.et_fixed_nav #page-container {
  padding-top: 0 !important;
  margin-bottom: 2px !important;
}


#main-header,
#top-header,
#main-header.et-fixed-header {
  background-color: #1f1d19 !important;
}
/*make header sticky*/
#main-header {
  position: sticky;
  top: 0;
}
#page-container {
  padding-top: 0 !important;
}


/* Make Header full width with padding based on screen size */
#main-header .container {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* RESTORE FLEX CONTRACT FOR DIVI HEADER */
#main-header .container.et_menu_container {
  display: flex !important;
  align-items: center !important;
}

/* Make the menu wrap but stay right-aligned */
#top-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}


/* Make Menu Text Uppercase */

/* Desktop menu */
#top-menu > li > a {
  text-transform: uppercase !important;
  letter-spacing: 0.12em;
}

/* Mobile menu */
.et_mobile_menu li a {
  text-transform: uppercase !important;
  letter-spacing: 0.12em;
}

/* =========================================================
   Custom menu items
   ========================================================= */
/* contact button */
#top-menu li.menu-contact > a {
  background: #f1c232;
  color: #1f1d19 !important;
  text-transform: uppercase !important;
  padding: 5px 15px !important; /* Top/bottom - left/right */
  line-height: 1.1;
  border-radius: 999px;
  font-weight: 600;
  letter-spacing: 0.12em;
  height: auto !important;
  align-self: center;
}
#top-menu li.menu-contact {
  display: flex;
  align-items: center;
}

#top-menu li.menu-contact > a:hover {
  background: #f1c232;
  color: #1f1d19 !important;
}

/* MOBILE CONTACT BUTTON */
.et_mobile_menu li.menu-contact {
  text-align: left !important;
}

.et_mobile_menu li.menu-contact > a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  width: auto !important;
  max-width: none !important;

  background: #f1c232 !important;
  color: #1f1d19 !important;

  text-transform: uppercase !important;
  padding: 5px 15px !important;
  line-height: 1;
  margin: 20px 24px !important;

  border-radius: 999px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* Hover stays gold */
.et_mobile_menu li.menu-contact > a:hover {
  background: #f1c232 !important;
  color: #1f1d19 !important;
}

/* Base icon menu items */
#top-menu li.menu-icon > a {
  font-size: 0;
  padding: 0px;
}

/* LinkedIn */
#top-menu li.menu-linkedin > a::before {
  content: "\e09d";
}

/* Instagram */
#top-menu li.menu-instagram > a::before {
  content: "\e09a";
}

/* Facebook */
#top-menu li.menu-facebook > a::before {
  content: "\e093";
}

/* Icon styling */
#top-menu li.menu-icon > a::before {
  font-family: "ETmodules";
  font-size: 18px;
  color: #fff;
}

#top-menu li.menu-icon > a:hover::before {
  color: #f1c232;
}

/* MOBILE SOCIAL ICONS */
.et_mobile_menu li.menu-icon > a {
  font-size: 0;
  padding: 14px 24px;
}

/* LinkedIn */
.et_mobile_menu li.menu-linkedin > a::before {
  content: "\e09d";
}

/* Instagram */
.et_mobile_menu li.menu-instagram > a::before {
  content: "\e09a";
}

/* Facebook */
.et_mobile_menu li.menu-facebook > a::before {
  content: "\e093";
}

/* Icon appearance */
.et_mobile_menu li.menu-icon > a::before {
  font-family: "ETmodules";
  font-size: 20px;
  color: #ffffff;
}

/* Hover = gold */
.et_mobile_menu li.menu-icon > a:hover::before {
  color: #f1c232;
}


/* =========================================================
   DESKTOP MENU
   ========================================================= */
/* NORMALIZE DESKTOP HEADER VERTICAL ALIGNMENT */
@media (min-width: 981px) {
  #main-header {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
}


/* Top-level menu links */
#top-menu > li > a {
  color: #ffffff !important;
  border: none !important;
}

/* Hover color */
#top-menu > li > a:hover {
  color: #f1c232 !important;
}

/* Desktop dropdown container */
#top-menu li ul {
  background-color: #1f1d19;
  border: none;
}

/* Desktop dropdown links */
#top-menu li ul li a {
  color: #ffffff !important;
  border: none !important;
	text-transform: uppercase !important;
  letter-spacing: 0.12em;
}

/* Desktop dropdown hover */
#top-menu li ul li a:hover {
  background: none !important;
  color: #f1c232 !important;
}

/* =========================================
   REMOVE SEARCH ICON (DESKTOP + MOBILE)
   ========================================= */

/* Hide the icon */
#et_top_search,
.et_search_outer {
  display: none !important;
}

/* Remove the clickable search hitbox */
#main-header .et_top_search {
  pointer-events: none !important;
}

/* Prevent spacing shifts */
#et-top-navigation {
  padding-right: 0 !important;
}


/* =========================================================
   MOBILE MENU – FULL WIDTH
   ========================================================= */

  @media (max-width: 980px) {

  #main-header,
  #main-header .container,
  #main-header .et_menu_container {
    overflow: visible !important;
  }

  #main-header .et_mobile_menu,
  #main-header #mobile_menu {
    position: absolute !important;
    top: 100% !important;

    left: 50% !important;
    transform: translateX(-50%) !important;

    width: 100vw !important;
    max-width: 100vw !important;

    margin: 0 !important;
    padding: 24px 0 120px !important;

    background: #1f1d19 !important;
    border-top: 0 !important;
    box-shadow: none !important;
    z-index: 99999 !important;
  }
}


  /* No divider lines between items */
  #main-header .et_mobile_menu li a,
  #main-header #mobile_menu li a {
    border: 0 !important;
  }

  /* White text */
  #main-header .et_mobile_menu li a,
  #main-header #mobile_menu li a {
    color: #fff !important;
    background: transparent !important;
  }

  /* Hover = gold */
  #main-header .et_mobile_menu li a:hover,
  #main-header #mobile_menu li a:hover {
    color: #f1c232 !important;
    background: transparent !important;
  }

  /* Hamburger icon gold (normal + hover) */
  .mobile_menu_bar:before,
  .mobile_menu_bar:hover:before {
    color: #f1c232 !important;
  }



/* =========================================================
   HAMBURGER ICON
   ========================================================= */

/* Hamburger icon color + hover */
.mobile_menu_bar:before {
  color: #f1c232 !important;
}
.mobile_menu_bar:hover:before {
  color: #f1c232 !important;
}
/* ================================
   HAMBURGER → X WHEN MENU IS OPEN
   ================================ */

/* Default hamburger (already gold, keep it) */
.mobile_menu_bar:before {
  content: "\61"; /* Divi hamburger icon */
  font-family: "ETmodules";
  color: #f1c232 !important;
}

/* When menu is OPEN, turn hamburger into X */
.mobile_nav.opened .mobile_menu_bar:before {
  content: "\4d"; /* Divi CLOSE (X) icon */
  font-family: "ETmodules";
  font-size: 32px;
	font-weight: 900;
  color: #f1c232 !important;
}

/* =========================================================
   SOCIAL ICONS (DESKTOP + MOBILE)
   ========================================================= */

.et-social-icon a {
  color: #ffffff !important;
}

.et-social-icon a:hover {
  color: #f1c232 !important;
}

/* FORCE CONTACT BUTTON BACKGROUND (OVERRIDE DIVI) */
#main-header #mobile_menu li.menu-contact > a,
#main-header .et_mobile_menu li.menu-contact > a {
  background-color: #f1c232 !important;
  color: #1f1d19 !important;
}

/* =========================================================
   MOBILE SOCIAL ICONS — FORCE HORIZONTAL ROW
   ========================================================= */

@media (max-width: 980px) {

  /* Make ONLY the social icon items inline */
  .et_mobile_menu li.menu-icon {
    display: inline-block !important;
    width: auto !important;
    margin-right: 20px !important;
    vertical-align: middle;
  }

  /* Prevent anchor from behaving like a block */
  .et_mobile_menu li.menu-icon > a {
    display: inline-block !important;
    padding: 0 !important;
  }
	/* Match icon row left edge to menu text */
  .et_mobile_menu li.menu-icon {
    margin-left: 24px !important;
  }

}

/* ===============================
   FIX CONTACT BUTTON OFFSET
   =============================== */

/* Kill Divi's bottom padding that drops the pill */
#et-top-navigation nav > ul > li > a {
  padding-bottom: 0 !important;
}

/* Normalize all menu items */
#top-menu > li {
  display: flex !important;
  align-items: center !important;
  line-height: 1 !important;
}

/* Force CONTACT pill dead center */
#top-menu > li.menu-contact > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  padding: 6px 16px !important;
}

/* ===============================
   HIDE DESKTOP MENU ON MOBILE
   =============================== */
@media (max-width: 980px) {
  #top-menu {
    display: none !important;
  }
}
/* STOP DIVI FROM SHRINKING LOGO ON MOBILE */
@media (max-width: 980px) {
  .et_header_style_left #logo {
    max-width: none !important;
    width: auto !important;
  }

  #main-header .logo_container {
    flex: 0 0 auto !important;
  }
}
/* CENTER HEADER CONTENT BLOCK */
#main-header .container.et_menu_container {
  margin-left: auto !important;
  margin-right: auto !important;
}


/* FORCE TRUE CENTERING OF HEADER CONTENT */
#main-header .container.et_menu_container {
  justify-content: space-between !important;
}
/* FIX DESKTOP DROPDOWN POSITIONING */
@media (min-width: 981px) {
  #main-header #top-menu li ul {
    left: auto !important;
    transform: none !important;
  }
}
/* DESKTOP: restore normal dropdown positioning */
@media (min-width: 981px) {

  /* Kill transform inheritance */
  #main-header #top-menu li ul {
    transform: none !important;
    left: 0 !important;
    right: auto !important;
  }

}
/* DESKTOP: HARD RESET TRANSFORMS THAT BREAK DROPDOWNS */
@media (min-width: 981px) {

  #et-top-navigation {
    transform: none !important;
    left: auto !important;
  }

}

/* =========================================================
   DESKTOP: FORCE REAL DROPDOWNS (DROP DOWN)
   ========================================================= */
@media (min-width: 981px) {

  /* anchor each dropdown to its parent item */
  #top-menu > li {
    position: relative !important;
  }

  /* force submenu to be a true dropdown (out of the flex flow) */
  #top-menu > li > ul.sub-menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;

    display: block !important;
    float: none !important;

    margin-top: 0px !important;   /* adjust if you want tighter */
    z-index: 99999 !important;
  }

  /* Divi sometimes uses opacity/visibility for hover */
  #top-menu > li > ul.sub-menu {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  #top-menu > li:hover > ul.sub-menu,
  #top-menu > li:focus-within > ul.sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}

@media (min-width: 981px) {
  #et-top-navigation {
    display: block !important;
  }
}
#main-header .container.et_menu_container {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}



