/* BSH Aero — sitewide header + footer (Xpro Theme Builder chrome).
   Dark canvas is default; .bsh-theme-light overrides apply on the
   Part 21 Agency page only. Loaded by the Novamira sandbox loader
   via bsh-header-footer.php (mirrors the bsh-theme.css pattern). */

html { scroll-behavior: smooth; }

/* ============ HEADER ============ */
#bsh-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 80;
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px; padding: 14px 40px;
  background: linear-gradient(180deg, rgba(13,28,43,.42) 0%, rgba(5,13,22,.34) 100%);
  backdrop-filter: blur(22px) saturate(165%);
  -webkit-backdrop-filter: blur(22px) saturate(165%);
  border-bottom: 1px solid rgba(212,191,163,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 34px rgba(0,0,0,.28);
  transform: translateY(0); opacity: 1;
  transition: transform 360ms cubic-bezier(.22,.61,.36,1), opacity 360ms cubic-bezier(.22,.61,.36,1);
  font-family: 'Poppins', system-ui, -apple-system, sans-serif;
}
#bsh-header.bsh-hidden { transform: translateY(-110%); opacity: 0; }

.bsh-logo { display: flex; align-items: center; flex: none; }
.bsh-logo img {
  height: 26px; width: auto; display: block;
  filter: none;
  transition: filter 260ms cubic-bezier(.22,.61,.36,1);
}

.bsh-nav { display: flex; align-items: center; gap: 4px; }
.bsh-navlink {
  position: relative; display: flex; align-items: center; gap: 7px;
  padding: 9px 14px; border-radius: 999px;
  color: #9aa3ad; font-size: 12.5px; font-weight: 400; letter-spacing: .005em;
  white-space: nowrap; text-decoration: none;
  transition: color 200ms cubic-bezier(.22,.61,.36,1);
}
.bsh-navlink::after {
  content: ''; position: absolute; left: 14px; right: 14px; bottom: 4px;
  height: 1px; background: #d4bfa3;
  transform: scaleX(0); transform-origin: left center;
  transition: transform 240ms cubic-bezier(.22,.61,.36,1);
}
.bsh-navlink:hover,
.bsh-navlink:focus { color: #fff; }
.bsh-navlink:hover::after,
.bsh-navlink:focus::after { transform: scaleX(1); }
.bsh-navlink-active { color: #fff; }
.bsh-navlink-active::after { display: none; }
.bsh-dot { width: 4px; height: 4px; border-radius: 999px; background: #d4bfa3; display: block; flex: none; }

.bsh-cta {
  flex: none; display: inline-flex; align-items: center; gap: 9px;
  padding: 9px 18px; border-radius: 999px;
  border: 1px solid rgba(212,191,163,.28);
  color: #d4bfa3; font-size: 12px; letter-spacing: .01em; white-space: nowrap;
  text-decoration: none;
  transition: border-color 200ms cubic-bezier(.22,.61,.36,1), background 200ms cubic-bezier(.22,.61,.36,1);
}
.bsh-cta:hover,
.bsh-cta:focus { border-color: #d4bfa3; background: rgba(212,191,163,.05); color: #d4bfa3; }
.bsh-cta svg { flex: none; }

.bsh-mobile-cta { display: none; }

/* Keyboard-focus parity: every focusable header control gets the same
   visual treatment as :hover (see rules above). No outline ring. */
#bsh-header a:focus,
#bsh-header button:focus {
  outline: none;
}

/* Mobile nav toggle (hamburger -> X) — hidden above 900px */
.bsh-nav-toggle {
  display: none; flex: none; width: 36px; height: 36px; padding: 0;
  align-items: center; justify-content: center; gap: 5px; flex-direction: column;
  background: transparent; border: 1px solid rgba(212,191,163,.28); border-radius: 999px;
  cursor: pointer; outline: none; -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none; appearance: none; box-shadow: none;
}
.bsh-nav-toggle:hover,
.bsh-nav-toggle:focus,
.bsh-nav-toggle:focus-visible,
.bsh-nav-toggle:active {
  background: transparent; outline: none; -webkit-tap-highlight-color: transparent;
  border-color: rgba(212,191,163,.28);
}
.bsh-nav-toggle span {
  display: block; width: 15px; height: 1px; background: #d4bfa3;
  transition: transform 220ms cubic-bezier(.22,.61,.36,1), opacity 220ms cubic-bezier(.22,.61,.36,1);
}
.bsh-nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.bsh-nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.bsh-nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ============ FOOTER ============ */
#bsh-footer {
  padding: 10px 40px;
  background: linear-gradient(0deg, rgba(13,28,43,.42) 0%, rgba(5,13,22,.30) 100%);
  backdrop-filter: blur(22px) saturate(165%);
  -webkit-backdrop-filter: blur(22px) saturate(165%);
  border-top: 1px solid rgba(212,191,163,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 -10px 34px rgba(0,0,0,.28);
  font-family: 'Poppins', system-ui, -apple-system, sans-serif;
}
#bsh-footer .bsh-footer-inner {
  max-width: 1400px; margin: 0 auto;
  display: flex; flex-direction: column; gap: 26px;
}
#bsh-footer .bsh-footer-cols {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 48px;
}
#bsh-footer .bsh-footer-brand {
  display: flex; flex-direction: column; gap: 12px; max-width: 34ch; margin-top: 22.1px;
}
#bsh-footer .bsh-footer-brand img {
  height: 50px; width: auto; align-self: flex-start; opacity: .9;
}
#bsh-footer .bsh-footer-brand p { font-size: 13px; line-height: 1.7; color: #68717b; margin: 0; }

#bsh-footer .bsh-footer-col { display: flex; flex-direction: column; gap: 9px; margin-top: 62px; }
#bsh-footer .bsh-footer-label {
  font-size: 10px; font-weight: 500; letter-spacing: .18em;
  text-transform: uppercase; color: #68717b;
}
#bsh-footer .bsh-footer-col a,
#bsh-footer .bsh-footer-col a:visited {
  font-size: 13px; color: #adb3bc; text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
}
#bsh-footer .bsh-footer-col a:hover { color: #d4bfa3; }
#bsh-footer .bsh-footer-col svg { width: 15px; height: 15px; flex: none; }
#bsh-footer .bsh-footer-col button.cmplz-manage-consent {
  font-size: 13px; color: #adb3bc; text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
  background: none; border: none; padding: 0; margin: 0;
  font-family: inherit; font-weight: inherit; line-height: inherit;
  letter-spacing: inherit; cursor: pointer; text-align: left;
}
#bsh-footer .bsh-footer-col button.cmplz-manage-consent:hover { color: #d4bfa3; }

#bsh-footer .bsh-footer-bottom {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px;
  padding-top: 16px; border-top: 1px solid rgba(212,191,163,.08);
  font-size: 11px; letter-spacing: .06em; color: #545b65;
}

/* ============ LIGHT VARIANT (Part 21 Agency page only) ============ */
.bsh-theme-light#bsh-header {
  background: linear-gradient(180deg, rgba(251,252,253,.10) 0%, rgba(251,252,253,.08) 100%);
  backdrop-filter: blur(26px) saturate(180%);
  -webkit-backdrop-filter: blur(26px) saturate(180%);
  border-bottom: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 8px 26px rgba(13,28,43,.10);
}
.bsh-theme-light .bsh-logo img { filter: none; }

.bsh-theme-light .bsh-navlink { color: #5a6672; }
.bsh-theme-light .bsh-navlink::after { background: #a8906d; }
.bsh-theme-light .bsh-navlink:hover,
.bsh-theme-light .bsh-navlink:focus,
.bsh-theme-light .bsh-navlink-active { color: #0d1c2b; }
.bsh-theme-light .bsh-dot { background: #a8906d; }

.bsh-theme-light .bsh-cta { border-color: rgba(13,28,43,.18); color: #0d1c2b; }
.bsh-theme-light .bsh-cta:hover,
.bsh-theme-light .bsh-cta:focus { border-color: #a8906d; background: rgba(168,144,109,.06); color: #0d1c2b; }

.bsh-theme-light .bsh-nav-toggle { border-color: rgba(13,28,43,.18); }
.bsh-theme-light .bsh-nav-toggle span { background: #0d1c2b; }

.bsh-theme-light#bsh-footer {
  background: linear-gradient(0deg, rgba(251,252,253,.72) 0%, rgba(251,252,253,.58) 100%);
  border-top: 1px solid rgba(13,28,43,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
.bsh-theme-light #bsh-footer .bsh-footer-brand p,
.bsh-theme-light #bsh-footer .bsh-footer-label { color: #6b7580; }
.bsh-theme-light #bsh-footer .bsh-footer-col a { color: #3d4954; }
.bsh-theme-light #bsh-footer .bsh-footer-col a:hover { color: #a8906d; }
.bsh-theme-light #bsh-footer .bsh-footer-col button.cmplz-manage-consent { color: #3d4954; }
.bsh-theme-light #bsh-footer .bsh-footer-col button.cmplz-manage-consent:hover { color: #a8906d; }
.bsh-theme-light #bsh-footer .bsh-footer-bottom {
  border-top: 1px solid rgba(13,28,43,.08); color: #8b949d;
}
.bsh-theme-light #bsh-footer .bsh-footer-brand img { filter: none; opacity: 1; }
.bsh-theme-light#bsh-header, .bsh-theme-light#bsh-footer { color-scheme: light; }

/* Header-over-hero: while the fixed header still visually overlaps the
   Part 21 Agency hero band (.bsh-hero, dark photo background), swap its
   text/logo back to the same light-on-dark palette the header uses on the
   dark-theme pages. Toggled via .bsh-header-on-hero (bsh-header-footer.js).
   #bsh-header specificity keeps this winning over the .bsh-theme-light rules
   above regardless of source order. */
#bsh-header.bsh-header-on-hero .bsh-logo img { filter: brightness(0) invert(1); }

#bsh-header.bsh-header-on-hero .bsh-navlink { color: rgba(255,255,255,.78); }
#bsh-header.bsh-header-on-hero .bsh-navlink::after { background: #fff; }
#bsh-header.bsh-header-on-hero .bsh-navlink:hover,
#bsh-header.bsh-header-on-hero .bsh-navlink:focus,
#bsh-header.bsh-header-on-hero .bsh-navlink-active { color: #fff; }
#bsh-header.bsh-header-on-hero .bsh-dot { background: #fff; }

#bsh-header.bsh-header-on-hero .bsh-cta { border-color: rgba(255,255,255,.35); color: #fff; }
#bsh-header.bsh-header-on-hero .bsh-cta:hover,
#bsh-header.bsh-header-on-hero .bsh-cta:focus { border-color: #fff; background: rgba(255,255,255,.08); color: #fff; }

#bsh-header.bsh-header-on-hero .bsh-nav-toggle { border-color: rgba(255,255,255,.35); }
#bsh-header.bsh-header-on-hero .bsh-nav-toggle span { background: #fff; }

/* ============ MOBILE (< 900px) ============ */
@media (max-width: 900px) {
  #bsh-header { padding: 12px 20px; }

  .bsh-nav-toggle { display: inline-flex; }

  .bsh-nav {
    position: fixed; top: 66px; left: 12px; right: 12px;
    flex-direction: column; align-items: stretch; gap: 2px;
    padding: 10px;
    background: linear-gradient(180deg, rgba(13,28,43,1) 0%, rgba(5,13,22,1) 100%);
    border: 1px solid rgba(212,191,163,.14);
    border-radius: 16px;
    box-shadow: 0 20px 40px rgba(0,0,0,.35);
    opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity 220ms cubic-bezier(.22,.61,.36,1), transform 220ms cubic-bezier(.22,.61,.36,1), visibility 220ms;
  }
  .bsh-nav.bsh-nav-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .bsh-navlink { padding: 13px 16px; }
  .bsh-navlink::after { display: none; }

  .bsh-cta { display: none; }

  .bsh-mobile-cta {
    display: flex; align-items: center; justify-content: center; gap: 9px;
    margin-top: 6px; padding: 13px 16px; border-radius: 999px;
    background: rgba(212,191,163,.10);
    border: 1px solid rgba(212,191,163,.28);
    color: #d4bfa3; font-size: 13px; font-weight: 500; letter-spacing: .01em;
    text-decoration: none;
  }
  .bsh-theme-light .bsh-mobile-cta {
    background: rgba(13,28,43,.05);
    border-color: rgba(13,28,43,.18);
    color: #0d1c2b;
  }

  .bsh-theme-light .bsh-nav {
    background: linear-gradient(180deg, rgba(251,252,253,.97) 0%, rgba(251,252,253,.97) 100%);
    border-color: rgba(13,28,43,.10);
    box-shadow: 0 20px 40px rgba(13,28,43,.14);
  }

  #bsh-footer { padding: 32px 20px 22px; }
  #bsh-footer .bsh-footer-cols { flex-direction: column; gap: 28px; }
  #bsh-footer .bsh-footer-col { margin-top: 0; }
  #bsh-footer .bsh-footer-brand { margin-top: 0; }
  #bsh-footer .bsh-footer-bottom { flex-direction: column; gap: 8px; }
}