/* ============================================================
   OA 2026 theme — site header and footer.
   Loads after the OA Components stylesheets, as it did when it
   lived inside base.css.
   ============================================================ */

/* ============================================================
   Header
   ============================================================ */
.oa-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 40; background: #fff; border-bottom: 1px solid var(--color-border); }
.oa-navbar { max-width: var(--container-xl); margin: 0 auto; padding: 0 var(--space-6); height: 76px; display: flex; align-items: center; gap: var(--space-7); }
.oa-brand { flex: none; display: inline-flex; }
.oa-brand__img { height: 34px; width: auto; display: block; }
.oa-brand__text { font-family: var(--font-slab); font-weight: 700; font-size: var(--text-md); letter-spacing: .04em; text-transform: uppercase; color: var(--brand-dark); }
.oa-nav { display: flex; gap: var(--space-6); margin-left: auto; min-width: 0; }
.oa-nav__link { position: relative; white-space: nowrap; font-weight: 700; font-size: var(--text-xs); letter-spacing: .08em; text-transform: uppercase; color: var(--text-secondary); text-decoration: none; }
.oa-nav__link:hover { color: var(--brand-dark); text-decoration: none; }
.oa-nav__link.is-active { color: var(--brand-primary); }
.oa-nav__bar { position: absolute; left: 0; right: 0; bottom: -27px; height: 3px; background: var(--brand-primary); }
.oa-header__actions { display: flex; align-items: center; gap: var(--space-4); flex: none; }
.oa-header__cta { flex: none; }
.oa-search-panel { border-top: 1px solid var(--color-border); background: var(--color-surface-sunken); }
.oa-search-panel__form { position: relative; max-width: var(--container-md); margin: 0 auto; padding: var(--space-4) var(--space-6); display: flex; gap: 10px; align-items: center; }
.oa-search-panel__icon { position: absolute; left: calc(var(--space-6) + 12px); color: var(--text-muted); display: inline-flex; }
.oa-search-panel__form .oa-input { padding-left: 2.3rem; }

@media (max-width: 1080px) {
  .oa-navbar { flex-wrap: wrap; height: auto; padding-top: 14px; padding-bottom: 14px; gap: var(--space-5); }
  .oa-header__actions { margin-left: auto; }
  .oa-nav { order: 3; width: 100%; margin-left: 0; gap: var(--space-5); overflow-x: auto; padding-bottom: 14px; margin-bottom: -14px; scrollbar-width: none; }
  .oa-nav::-webkit-scrollbar { display: none; }
  .oa-nav__bar { bottom: 0; }
  .oa-nav__link { padding-bottom: 2px; }
}
@media (max-width: 480px) {
  .oa-navbar { padding-left: var(--space-4); padding-right: var(--space-4); }
  .oa-brand__img { height: 28px; }
  .oa-header__cta { display: none; }
}

/* ============================================================
   Footer
   ============================================================ */
.oa-footer { background: var(--oa-slate-800); color: var(--oa-slate-200); }
.oa-footer a { text-decoration: none; }
.oa-footer__inner { max-width: var(--container-xl); margin: 0 auto; padding: var(--space-9) var(--space-6) var(--space-6); }
.oa-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--space-7); padding-bottom: var(--space-8); border-bottom: 1px solid rgba(255,255,255,.12); }
.oa-footer__logo { height: 38px; width: auto; margin-bottom: var(--space-4); display: block; }
.oa-footer__wordmark { display: block; font-family: var(--font-slab); font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: .06em; margin-bottom: var(--space-4); }
.oa-footer__tagline { font-family: var(--font-slab); font-weight: 300; font-style: italic; font-size: var(--text-md); color: var(--oa-slate-300); line-height: 1.4; max-width: 30ch; margin: 0; }
.oa-footer__heading { font-family: var(--font-sans); font-weight: 700; font-size: var(--text-2xs); text-transform: uppercase; letter-spacing: .12em; color: #fff; margin: 0 0 var(--space-4); }
.oa-footer__link { display: block; font-size: var(--text-sm); color: var(--oa-slate-300); padding: 5px 0; }
.oa-footer__link:hover { color: #fff; text-decoration: none; }
.oa-footer__bottom { display: flex; justify-content: space-between; align-items: center; padding-top: var(--space-5); font-size: var(--text-xs); color: var(--oa-slate-400); flex-wrap: wrap; gap: 8px; }
.oa-footer__bottom a { color: var(--oa-slate-400); }
.oa-footer__bottom a:hover { color: #fff; }
.oa-footer__compact { max-width: var(--container-xl); margin: 0 auto; padding: var(--space-8) var(--space-6) var(--space-6); display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); flex-wrap: wrap; }
.oa-footer__compact .oa-footer__logo { height: 34px; margin: 0; }
.oa-footer__row { display: flex; gap: var(--space-6); flex-wrap: wrap; }
.oa-footer__row .oa-footer__link { padding: 0; }
.oa-footer__copy { font-size: var(--text-xs); color: var(--oa-slate-400); }
@media (max-width: 900px) {
  .oa-footer__grid { grid-template-columns: 1fr 1fr; }
  .oa-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 520px) { .oa-footer__grid { grid-template-columns: 1fr; } }