/* ==================================================================
   Site header normalisation for the archived interior pages.

   The interior pages span Divi 3.0 -> 4.x. Each carries the 2026
   homepage header MARKUP (copied verbatim), but its own era's CSS
   styles that markup differently. These rules realign the header with
   the 2026 homepage regardless of era.

   Scope: the header only (#top-header, #main-header) plus the fixed
   content offset. Nothing here styles page content below </header>.

   Font URLs are root-relative (/_assets/...) so they resolve from any
   page depth. Two ID selectors give these rules enough specificity to
   beat the era stylesheets without a specificity arms race.
   ================================================================== */

@font-face {
  font-family: 'Alata';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/_assets/8c7ab5c8d2-PbytFmztEwbIoceyzqYzQ1OW7l8.woff2') format('woff2');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/_assets/bf4aa17d70-JTUSjIg1_i6t8kCHKm459WRhyyTh89ZNpQ.woff2') format('woff2');
}

/* ---------- header does not stick (matches homepage + other pages) ---------- */
#top-header,
#main-header,
#top-header.et-fixed-header,
#main-header.et-fixed-header {
  position: relative !important;
  top: auto !important;
}

/* ---------- main header geometry ---------- */
#main-header,
#main-header.et-fixed-header,
#main-header .container.et_menu_container,
#main-header .logo_container {
  height: 94px !important;
}

#main-header .container.et_menu_container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Logo: preserve aspect ratio; old CSS honours the literal width="400" */
#main-header #logo,
#main-header.et-fixed-header #logo {
  width: auto !important;
  height: auto !important;
  max-height: 94% !important;
  max-width: 100%;
}

#main-header #et-top-navigation,
#main-header.et-fixed-header #et-top-navigation {
  padding-top: 40px !important;
}

#main-header {
  background-color: rgba(255, 255, 255, 0.9) !important;
}

/* ---------- top bar ---------- */
#top-header {
  background-color: #471500 !important;
  color: #fff;
  min-height: 33px;
  line-height: 33px;
  font-size: 13px;
  font-family: 'Montserrat', Helvetica, Arial, Lucida, sans-serif;
}

#top-header,
#top-header a,
#top-header #et-info,
#top-header #et-info a,
#top-header #et-secondary-menu a,
#top-header .et-social-icon a {
  color: #fff;
}

/* The homepage carries body.et_fullwidth_secondary_nav, which stretches the
   top-bar container to full width so #et-info (left) lines up under the logo
   and #et-secondary-menu (right) lines up with the main nav. Interior pages
   lack that class, leaving the top bar in a centered 1080px column that
   doesn't align with the full-width header below. Force it full width. */
#top-header .container {
  width: 100% !important;
  max-width: 100% !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
}

/* Keep the two top-bar groups on one row: info left, secondary menu right,
   items inline so nothing ("Store") wraps to a second line. */
#top-header #et-info {
  float: left;
}

#top-header #et-secondary-menu {
  float: right;
}

#top-header #et-secondary-menu > ul {
  white-space: nowrap;
}

#top-header #et-secondary-menu > ul > li {
  display: inline-block;
  float: none;
}

#top-header #et-secondary-menu > ul > li > a {
  font-size: 14px;
}

/* ---------- main nav ---------- */
#main-header #top-menu > li > a {
  font-family: 'Alata', Helvetica, Arial, Lucida, sans-serif !important;
  font-size: 14px;
  font-weight: 400;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.6);
}

#main-header #top-menu > li {
  padding-right: 22px;
}

#main-header #top-menu > li.current-menu-item > a,
#main-header #top-menu > li > a:hover {
  color: #2ea3f2;
}

/* Dropdown items keep the nav face but stay readable on the panel */
#main-header #top-menu li ul.sub-menu li a {
  font-family: 'Alata', Helvetica, Arial, Lucida, sans-serif !important;
  text-transform: none;
  font-size: 14px;
}

/* ---------- content offset ---------- */
/* The header is in normal flow (position:relative above), so it occupies
   its own space and content flows naturally below it -- exactly like the
   homepage. Divi adds padding-top to #page-container to clear a *fixed*
   header; with the header un-fixed that padding becomes an empty gap ABOVE
   it, so we zero it out. */
#page-container {
  padding-top: 0 !important;
}
