/* Header / footer overrides for the HFE templates "Site header" (tf-header) and "Site footer" (tf-footer).
   Built by WP2 (app/build/pages/_hf-header.py, _hf-footer.py). Keep small; core rules live in tf-sections.css. */

/* Header: logo + right group keep their natural width, the nav never wraps onto two lines. */
.e-con.tf-header__end { --width: auto; flex: 0 0 auto; }
.tf-header .tf-header__logo { flex: 0 0 auto; }
.tf-header .tf-nav { flex: 0 1 auto; min-width: 0; }
@media (min-width: 1025px) {
  .tf-header .tf-nav .hfe-nav-menu__layout-horizontal .hfe-nav-menu { flex-wrap: nowrap; white-space: nowrap; }
}
.tf-header .tf-header__clock { white-space: nowrap; }

/* <=1024 (HFE breakpoint "Tablet"): hamburger sits right, next to the CTA (design: margin-left auto). */
@media (max-width: 1024px) {
  .tf-header .tf-nav { margin-left: auto; flex: 0 0 auto; position: static; }
  /* The collapsed panel is out of the flow and anchored to the bottom edge of the header
     (.tf-header is position:relative); HFE's full-width JS then sets left/width from the header box. */
  .tf-header .tf-nav nav.hfe-nav-menu__layout-horizontal { position: absolute !important; top: 100%; left: 0; z-index: 9999; }
  .tf-header .tf-nav .hfe-nav-menu__toggle:not(.hfe-active-menu) + nav.hfe-nav-menu__layout-horizontal {
    width: 0 !important; padding: 0 !important; border: 0 !important; overflow: hidden;
  }
  /* Same look for every row of the open panel. tf-sections.css's desktop rule
     (".hfe-nav-menu > li.menu-item > a") out-ranks its own dropdown rule for plain items. */
  .tf-header .elementor-widget.tf-nav nav.hfe-dropdown .hfe-nav-menu li.menu-item a.hfe-menu-item,
  .tf-header .elementor-widget.tf-nav nav.hfe-dropdown .hfe-nav-menu li.menu-item a.hfe-sub-menu-item {
    display: flex; justify-content: space-between; align-items: center;
    padding: 13px 10px; font-size: 15px; color: var(--tf-text); background: transparent;
    border-bottom: 1px solid var(--tf-divider);
  }
  .tf-header .elementor-widget.tf-nav nav.hfe-dropdown .hfe-nav-menu li.menu-item a.hfe-sub-menu-item { font-size: 14px; color: var(--tf-n300); }
  .tf-header .elementor-widget.tf-nav nav.hfe-dropdown .hfe-nav-menu li.menu-item a:hover { color: var(--tf-accent); }
  /* Opaque panel: at 96% alpha the hero headline showed through the open menu. */
  .tf-header .elementor-widget.tf-nav nav.hfe-dropdown { background-color: #111114; }
}

/* Footer: legal links (HFE Navigation Menu "Footer – Legal" with class tf-footer__legal). */
/* tf-sections.css gives every .hfe-nav-menu in the bottom bar flex + gap 18px, which also hits HFE's wrapper div. */
.tf-footer .tf-footer__legal div.hfe-nav-menu { display: block; gap: 0; }
.tf-footer .tf-footer__legal ul.hfe-nav-menu { display: flex; flex-wrap: wrap; gap: 18px; margin: 0; padding: 0; list-style: none; }
.tf-footer .tf-footer__legal ul.hfe-nav-menu > li.menu-item { margin: 0 !important; }
.tf-footer .tf-footer__legal ul.hfe-nav-menu::before,
.tf-footer .tf-footer__legal ul.hfe-nav-menu::after { content: none; display: none; } /* HFE clearfix would become a gapped flex item */
.tf-footer .tf-footer__legal .menu-item a.hfe-menu-item { padding: 0; font-size: 12px; color: var(--tf-n600); background: transparent; }
.tf-footer .tf-footer__legal .menu-item a.hfe-menu-item:hover,
.tf-footer .tf-footer__legal .menu-item a.hfe-menu-item:focus-visible { color: var(--tf-accent); }
.tf-footer .tf-footer__copy p { margin: 0; }
.tf-footer .tf-footer__about p { margin: 18px 0 0; }

/* Footer padding on phones: 48 / 20 / 24 (design-2 style-3.css). */
@media (max-width: 767px) {
  .tf-footer, .e-con.tf-footer { padding-top: 48px; padding-bottom: 24px; --padding-top: 48px; --padding-bottom: 24px; }
}
