/* ==========================================================================
   Header — transparent over hero, solid on scroll
   ========================================================================== */

.ap-header {
  position: fixed; inset: 0 0 auto 0;
  z-index: var(--ap-z-header);
  transition: transform 280ms var(--ap-ease),
              background var(--ap-dur) var(--ap-ease),
              box-shadow var(--ap-dur) var(--ap-ease),
              border-color var(--ap-dur) var(--ap-ease);
  background: var(--ap-warm-white);
  border-bottom: 1px solid var(--ap-border);
  will-change: transform;
}
/* Auto-hide: slides up out of view on scroll-down, back on scroll-up */
.ap-header.is-hidden { transform: translateY(-100%); }
@media (prefers-reduced-motion: reduce) {
  .ap-header.is-hidden { transform: none; }
}
.ap-header__inner {
  display: flex; align-items: center; gap: 1rem;
  min-height: 76px;
}

/* Transparent state (over hero) */
.ap-header--transparent {
  background: transparent;
  border-bottom-color: transparent;
}
.ap-header--transparent .ap-header__wordmark strong,
.ap-header--transparent .ap-header__wordmark em,
.ap-header--transparent .ap-nav__list a,
.ap-header--transparent .ap-header__phone { color: #fff; }
.ap-header--transparent .ap-header__mark { color: rgba(255,255,255,0.16); }
.ap-header--transparent .ap-nav-toggle__bars i { background: #fff; }

/* Scrolled / solid state */
.ap-header.is-scrolled {
  background: color-mix(in srgb, var(--ap-warm-white) 82%, transparent);
  -webkit-backdrop-filter: saturate(180%) blur(16px);
  backdrop-filter: saturate(180%) blur(16px);
  border-bottom-color: transparent;
  box-shadow: 0 1px 0 rgba(44,44,44,0.04), 0 8px 30px rgba(44,44,44,0.06);
}
.ap-header.is-scrolled .ap-header__wordmark strong { color: var(--ap-charcoal); }
.ap-header.is-scrolled .ap-header__wordmark em { color: var(--ap-forest); }
.ap-header.is-scrolled .ap-header__mark { color: var(--ap-forest); }
.ap-header.is-scrolled .ap-nav__list a,
.ap-header.is-scrolled .ap-header__phone { color: var(--ap-charcoal); }
.ap-header.is-scrolled .ap-nav-toggle__bars i { background: var(--ap-charcoal); }

/* Brand — logo swaps treatment by header state */
.ap-header__brand { display: inline-flex; align-items: center; position: relative; }
.ap-header__logo { display: block; height: 46px; width: auto; transition: opacity var(--ap-dur) var(--ap-ease); }
.ap-header__logo--dark { position: absolute; inset: 0; opacity: 0; }
/* transparent (over hero) → show white logo */
.ap-header--transparent:not(.is-scrolled) .ap-header__logo--light { opacity: 1; }
.ap-header--transparent:not(.is-scrolled) .ap-header__logo--dark { opacity: 0; }
/* scrolled / solid → show charcoal logo */
.ap-header.is-scrolled .ap-header__logo--light,
.ap-header:not(.ap-header--transparent) .ap-header__logo--light { opacity: 0; }
.ap-header.is-scrolled .ap-header__logo--dark,
.ap-header:not(.ap-header--transparent) .ap-header__logo--dark { opacity: 1; }

/* Nav */
.ap-nav { margin-inline: auto; }
.ap-nav__list { display: flex; align-items: center; gap: 0.15rem; list-style: none; margin: 0; padding: 0; }
.ap-nav__list a {
  display: inline-block; padding: 0.55rem 0.95rem; border-radius: var(--ap-radius-pill);
  font-size: 0.9375rem; font-weight: 450; color: var(--ap-charcoal); white-space: nowrap;
  letter-spacing: 0.005em;
  transition: background var(--ap-dur-fast) var(--ap-ease), color var(--ap-dur-fast) var(--ap-ease), opacity var(--ap-dur-fast) var(--ap-ease);
}
.ap-nav__list a { opacity: 0.85; }
.ap-nav__list a:hover { opacity: 1; }
.ap-nav__list a:hover { background: color-mix(in srgb, currentColor 10%, transparent); }
.ap-header--transparent:not(.is-scrolled) .ap-nav__list a:hover { background: rgba(255,255,255,0.16); color:#fff; }

/* Actions */
.ap-header__actions { display: flex; align-items: center; gap: 1rem; }
.ap-header__phone { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 600; font-size: 0.95rem; color: var(--ap-charcoal); }
.ap-header__phone svg { opacity: 0.8; }

/* Mobile toggle */
.ap-nav-toggle { display: none; background: none; border: 0; padding: 0.5rem; cursor: pointer; }
.ap-nav-toggle__bars { display: grid; gap: 5px; width: 26px; }
.ap-nav-toggle__bars i { display: block; height: 2px; border-radius: 2px; background: var(--ap-charcoal); transition: transform var(--ap-dur) var(--ap-ease), opacity var(--ap-dur) var(--ap-ease); }
.ap-nav-toggle[aria-expanded="true"] .ap-nav-toggle__bars i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.ap-nav-toggle[aria-expanded="true"] .ap-nav-toggle__bars i:nth-child(2) { opacity: 0; }
.ap-nav-toggle[aria-expanded="true"] .ap-nav-toggle__bars i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile drawer */
.ap-mobile-nav {
  position: fixed; inset: 0; z-index: calc(var(--ap-z-header) - 1);
  background: var(--ap-warm-white);
  padding: calc(76px + 1.5rem) var(--ap-gutter) 2.5rem;   /* clear the fixed header */
  display: flex; flex-direction: column; gap: 0.25rem;
  overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  transform: translateY(-10px); opacity: 0; pointer-events: none;
  transition: opacity 300ms var(--ap-ease), transform 300ms var(--ap-ease);
}
.ap-mobile-nav[hidden] { display: none; }   /* beat the class's display:flex */
.ap-mobile-nav.is-open { opacity: 1; transform: none; pointer-events: auto; }
.ap-mobile-nav__list { list-style: none; margin: 0 0 1.5rem; padding: 0; display: flex; flex-direction: column; }
.ap-mobile-nav__list a {
  display: block; padding: 1.05rem 0.25rem;
  font-family: var(--ap-font-head); font-size: 1.3rem; font-weight: 600;
  color: var(--ap-charcoal); border-bottom: 1px solid var(--ap-border);
}
.ap-mobile-nav__list a:hover, .ap-mobile-nav__list .current-menu-item > a { color: var(--ap-forest); }
.ap-mobile-nav .ap-btn { margin-top: 1.5rem; }

@media (max-width: 1080px) {
  .ap-nav { display: none; }
  .ap-nav-toggle { display: inline-flex; }
  .ap-header__actions { margin-inline-start: auto; }
}
@media (max-width: 560px) {
  .ap-header__cta { display: none; }
}
@media (min-width: 1081px) {
  .ap-mobile-nav { display: none; }
}
