html,
body,
:root {
  --primary: #C46D46 !important;
  --primary_hover: #A85B3A !important;
}
/* =========================================
   CONVOY: CONSISTENT STICKY HEADER
   ========================================= */

:root {
  --convoy-header-bg: #151512;
  --convoy-header-height: 60px;
  --convoy-logo-width: 60px;
}


/* =========================================
   MAIN HEADER
   ========================================= */

#masthead {
  position: sticky !important;
  top: 0;
  z-index: 99990 !important;

  display: flex !important;
  align-items: center !important;

  width: 100% !important;
  height: var(--convoy-header-height) !important;
  min-height: var(--convoy-header-height) !important;
  max-height: var(--convoy-header-height) !important;

  margin: 0 !important;
  padding: 0 !important;

  background: var(--convoy-header-bg) !important;
  border-bottom: 1px solid rgba(216, 202, 186, 0.16);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);

  box-sizing: border-box !important;
}


/* =========================================
   FRAMEK / ELEMENTOR WRAPPER
   ========================================= */

#masthead > .elementor,
#masthead > .elementor.header-absolute {
  position: relative !important;
  inset: auto !important;

  display: block !important;
  align-self: center !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  background: var(--convoy-header-bg) !important;
}


/* =========================================
   MAIN ELEMENTOR HEADER ROW
   ========================================= */

#masthead > .elementor > .e-con:first-child {
  display: flex !important;
  align-items: center !important;

  --align-items: center !important;
  --min-height: var(--convoy-header-height) !important;
  --padding-top: 0 !important;
  --padding-bottom: 0 !important;

  width: 100% !important;
  height: var(--convoy-header-height) !important;
  min-height: var(--convoy-header-height) !important;
  max-height: var(--convoy-header-height) !important;

  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  box-sizing: border-box !important;
  background: var(--convoy-header-bg) !important;
}


/* Support older Elementor section structure */

#masthead > .elementor > .elementor-section:first-child {
  display: flex !important;
  align-items: center !important;

  width: 100% !important;
  height: var(--convoy-header-height) !important;
  min-height: var(--convoy-header-height) !important;

  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  background: var(--convoy-header-bg) !important;
}

#masthead > .elementor > .elementor-section:first-child > .elementor-container {
  align-items: center !important;
  width: 100% !important;
  min-height: var(--convoy-header-height) !important;
}


/* =========================================
   INNER COLUMNS AND WIDGETS
   ========================================= */

#masthead .elementor-column,
#masthead .elementor-column-wrap,
#masthead .elementor-widget-wrap {
  align-items: center !important;
}

#masthead .elementor-widget {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#masthead .elementor-widget-container {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


/* =========================================
   LOGO — SAME SIZE ON EVERY PAGE
   ========================================= */

#masthead .site-branding,
#masthead .hfe-site-logo,
#masthead .hfe-site-logo-container,
#masthead .elementor-widget-theme-site-logo .elementor-widget-container {
  display: flex !important;
  align-items: center !important;

  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

#masthead img.custom-logo,
#masthead .custom-logo-link img,
#masthead .site-logo img,
#masthead .hfe-site-logo-img,
#masthead .elementor-widget-theme-site-logo img {
  display: block !important;

  width: var(--convoy-logo-width) !important;
  min-width: var(--convoy-logo-width) !important;
  max-width: var(--convoy-logo-width) !important;

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

  margin: 0 !important;
  padding: 0 !important;
}


/* =========================================
   NAVIGATION ALIGNMENT
   ========================================= */

#masthead .main-navigation {
  display: flex !important;
  align-items: center !important;

  height: var(--convoy-header-height) !important;
  margin: 0 !important;
}

#masthead .main-navigation ul.menu {
  display: flex !important;
  align-items: center !important;

  height: var(--convoy-header-height) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#masthead .main-navigation ul.menu > li.menu-item {
  display: flex !important;
  align-items: center !important;

  height: var(--convoy-header-height) !important;
  margin: 0 !important;
}

#masthead .main-navigation ul.menu > li.menu-item > a {
  position: relative;

  display: flex !important;
  align-items: center !important;

  height: var(--convoy-header-height) !important;
  padding: 0 1.2em !important;

  line-height: 1 !important;
}


/* =========================================
   MENU SEPARATORS
   ========================================= */

#masthead .main-navigation ul.menu > li.menu-item > a::before {
  content: "/" !important;

  position: absolute;
  top: 50%;
  left: -3px;

  width: auto;
  height: auto;

  color: rgba(255, 255, 255, 0.85);
  background: none !important;
  border-radius: 0 !important;

  font-size: 17px;
  font-weight: 300;
  line-height: 1;

  transform: translate(-50%, -50%);
}

#masthead .main-navigation ul.menu > li.menu-item:first-child > a::before {
  content: none !important;
}


/* =========================================
   OVERRIDE PAGE-SPECIFIC FRAMEK STYLES
   ========================================= */

body.home #masthead,
body.single-post #masthead,
body.page #masthead,
body.archive #masthead {
  height: var(--convoy-header-height) !important;
  min-height: var(--convoy-header-height) !important;
  max-height: var(--convoy-header-height) !important;
}

body.home #masthead img.custom-logo,
body.single-post #masthead img.custom-logo,
body.page #masthead img.custom-logo,
body.archive #masthead img.custom-logo,
body.home #masthead .hfe-site-logo-img,
body.single-post #masthead .hfe-site-logo-img {
  width: var(--convoy-logo-width) !important;
  min-width: var(--convoy-logo-width) !important;
  max-width: var(--convoy-logo-width) !important;
  height: auto !important;
  max-height: none !important;
}


/* =========================================
   WORDPRESS ADMIN BAR
   ========================================= */

body.admin-bar #masthead {
  top: 32px;
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 782px) {
  :root {
    --convoy-header-height: 80px;
    --convoy-logo-width: 52px;
  }

  body.admin-bar #masthead {
    top: 46px;
  }
}

/* Hide Framek page-title header on author archives only */
body.author .page-title-bar,
body.author .page-header,
body.author .archive-header,
body.author .page-title-wrap,
body.author .breadcrumb-wrap {
  display: none !important;
}

/* Remove any spacing left behind */
body.author #content,
body.author .site-content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* =========================================
   CONVOY GLOBAL FOOTER HEIGHT
   ========================================= */

:root {
  --convoy-footer-padding-top: 5px;
  --convoy-footer-padding-bottom: 5px;
  --convoy-footer-padding-sides: 30px;
}

/* Target the actual Framek footer container */
#colophon
.elementor-99
.elementor-element.elementor-element-bbb1a2f {
  --padding-top: var(--convoy-footer-padding-top) !important;
  --padding-bottom: var(--convoy-footer-padding-bottom) !important;
  --padding-left: var(--convoy-footer-padding-sides) !important;
  --padding-right: var(--convoy-footer-padding-sides) !important;

  padding-top: var(--convoy-footer-padding-top) !important;
  padding-bottom: var(--convoy-footer-padding-bottom) !important;
  padding-left: var(--convoy-footer-padding-sides) !important;
  padding-right: var(--convoy-footer-padding-sides) !important;

  margin: 0 !important;
}

/* Keep the footer contents vertically aligned */
#colophon
.elementor-99
.elementor-element.elementor-element-bbb1a2f
> .e-con-inner {
  align-items: center !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1024px) {
  :root {
    --convoy-footer-padding-top: 60px;
    --convoy-footer-padding-bottom: 60px;
    --convoy-footer-padding-sides: 30px;
  }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 767px) {
  :root {
    --convoy-footer-padding-top: 45px;
    --convoy-footer-padding-bottom: 45px;
    --convoy-footer-padding-sides: 20px;
  }
}

#colophon .elementor-element-0e48a24 .elementor-icon-box-title a {
  color: inherit !important;
}