/* GENERATED by packages/design-system/scripts/build-wp.mjs in lonestar-launchpad-com. Do not edit; regenerate. */
/* ===========================================================================
   HEADER / NAV
   =========================================================================== */
.lslp-header {
  position: absolute;
  inset-inline: 0;
  top: 0;
  z-index: 20;
}
/* Variant: header in normal flow, for pages with no hero to overlay.
   Added for the resource-page template — see build/resource-page/. */
.lslp-header--static { position: static; }
.lslp-header--static .lslp-header__spacer { display: none; }
/* Interior pages carry live's compact header: a 161px logo on desktop (103px bar),
   16px card padding on mobile (105px bar). Tablet keeps the shared 260px logo. */
@media (min-width: 1025px) { .lslp-header--static .lslp-header__logo { width: 161px; } }
@media (max-width: 767px)  { .lslp-header--static .lslp-header__card { padding: var(--lslp-space-4); } }

.lslp-header__spacer { height: 30px; }
.lslp-header__row {
  max-width: var(--lslp-x-container);
  margin-inline: auto;
  padding-inline: var(--lslp-space-5);
}
.lslp-header__card {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  background: var(--lslp-white);
  padding: var(--lslp-space-5);          /* 24px */
  /* square corners, no shadow — measured */
}
.lslp-header__brand { display: flex; align-items: center; }
.lslp-header__logo-link { display: block; }
.lslp-header__logo { width: 227px; height: auto; }

.lslp-nav__list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 56px;
}
.lslp-nav__link {
  display: inline-block;
  padding: 15px 12.5px;
  font-family: var(--lslp-nav-family);
  font-size: var(--lslp-nav-size);
  line-height: var(--lslp-nav-line);
  font-weight: var(--lslp-nav-weight);
  letter-spacing: var(--lslp-nav-tracking);
  color: var(--lslp-ink);
  text-decoration: none;
}
.lslp-nav__link:hover { color: var(--lslp-red); }

.lslp-header__actions { display: flex; justify-content: flex-end; align-items: center; }
.lslp-header__toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px; height: 44px;           /* a full 44px tap target */
  padding: var(--lslp-space-2);
  border: 0;
  background: var(--lslp-gold);
  color: var(--lslp-navy);
  cursor: pointer;
}

/* Toggle icon: hamburger closed, × open. */
.lslp-header__toggle-close { display: none; }
.lslp-header__toggle[aria-expanded="true"] .lslp-header__toggle-open { display: none; }
.lslp-header__toggle[aria-expanded="true"] .lslp-header__toggle-close { display: block; }

/* Mobile drawer — a full-screen navy sheet from the bottom of the header bar down.
   Links are big, full-width rows; the primary action sits at the bottom, in thumb
   reach, above the home indicator. Square and flat, like everything else. */
.lslp-mobile-nav:not([hidden]) {
  position: fixed;
  inset: var(--lslp-drawer-top, 0px) 0 0 0;
  z-index: 19;
  display: flex;
  flex-direction: column;
  padding: var(--lslp-space-3) var(--lslp-x-section-x) calc(var(--lslp-space-5) + env(safe-area-inset-bottom, 0px));
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--lslp-navy);
  animation: lslp-drawer-in 180ms ease-out;
}
@keyframes lslp-drawer-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .lslp-mobile-nav:not([hidden]) { animation: none; } }
.lslp-mobile-nav__list { margin: 0; padding: 0; list-style: none; }
.lslp-mobile-nav__link {
  display: flex;
  align-items: center;
  min-height: 64px;
  border-bottom: 1px solid var(--lslp-on-navy-line);
  font-family: var(--lslp-nav-family);
  font-size: var(--lslp-nav-size);
  letter-spacing: var(--lslp-nav-tracking);
  color: var(--lslp-white);
  text-decoration: none;
}
.lslp-mobile-nav__link:active { color: var(--lslp-gold); }
.lslp-mobile-nav__link:focus-visible { outline: 2px solid var(--lslp-gold); outline-offset: -2px; }
.lslp-mobile-nav__foot { display: flex; flex-direction: column; gap: var(--lslp-space-3); margin-top: auto; padding-top: var(--lslp-space-6); }
.lslp-mobile-nav__cta { width: 100%; min-height: 52px; }
.lslp-mobile-nav__note { margin: 0; font-size: 14px; text-align: center; color: var(--lslp-on-navy-muted); }
/* Page scroll stops under an open drawer. */
.lslp-nav-open, .lslp-nav-open body { overflow: hidden; }
@media (max-width: 1024px){

  .lslp-header__card { grid-template-columns: 1fr auto; }
  .lslp-nav, .lslp-header__actions .lslp-btn { display: none; }
  .lslp-header__toggle { display: inline-flex; }
  .lslp-header__logo { width: 260px; }}
@media (max-width: 767px){
 .lslp-header__logo { width: 221px; }}

/* ---------------------------------------------------------------------------
   Phone: hide on scroll down, reveal on scroll up (site.js sets the classes).
   The header only takes screen height when someone is reaching for it.
   · interior pages (static header): sticky, so revealing never shifts the page
   · front page (overlay header on the hero): pinned fixed once the header has
     scrolled away, hidden until the first scroll up
   No shadow: a hairline marks the edge while it floats over content. Reduced
   motion swaps the slide for an instant show/hide.
   --------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .lslp-header--static {
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--lslp-white);
  }
  /* In WordPress the header sits inside its template-part <div>, and sticky cannot
     leave its parent's box, so the wrapper is the sticky element there. */
  :has(> .lslp-header--static) { position: sticky; top: 0; z-index: 20; }
  .lslp-header.is-pinned { position: fixed; }
  .lslp-header.is-pinned .lslp-header__spacer { display: none; }
  .lslp-header--static.is-floating .lslp-header__card,
  .lslp-header.is-pinned .lslp-header__card { border-bottom: 1px solid var(--lslp-line); }
  .lslp-header.is-hidden { transform: translateY(-100%); }
  .lslp-header.is-animated { transition: transform 220ms ease; }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .lslp-header.is-animated { transition: none; }
}

