/* ==========================================================================
   Totality Estates — Header / global chrome
   Alert bar · desktop nav + dropdowns · contact block · mobile drawer.
   Layout swap at 1180px (CSS); JS handles drawer/dismiss/a11y state only.
   ========================================================================== */

/* ---- Logo lockup ---- */
.te-logo { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; }
.te-logo__mark { height: 25px; width: auto; }
.te-logo__word { height: 18px; width: auto; }
.te-logo--invert .te-logo__mark,
.te-logo--invert .te-logo__word { filter: invert(1); }

/* ---- Icons ---- */
.te-icon { display: block; flex-shrink: 0; }

/* ---- Alert bar ---- */
.te-alertbar {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  gap: 9px;
  background: var(--te-ink-strong);
  color: var(--te-white);
  padding: 13px var(--te-gutter-alert);
  font-size: var(--te-fs-14);
}
.te-alertbar__link { display: inline-flex; align-items: center; gap: 9px; color: inherit; text-decoration: none; }
.te-alertbar__link:hover .te-alertbar__msg { text-decoration: underline; }
.te-alertbar__glyph { color: var(--te-warning); font-size: var(--te-fs-16); line-height: 1; }
.te-alertbar__msg { font-weight: 600; }
.te-alertbar__cta { color: var(--te-warning); font-weight: 600; }
@media (max-width: 560px) { .te-alertbar__cta { display: none; } }
.te-alertbar__dismiss {
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  background: none; border: 0; color: var(--te-muted-light);
  font-size: var(--te-fs-15); line-height: 1; padding: 4px;
}
.te-alertbar__dismiss:hover { color: var(--te-white); }
.te-alertbar[hidden] { display: none; }

/* ---- Header shell ---- */
.te-header {
  position: relative;
  z-index: var(--te-z-header);
  background: var(--te-white);
  border-bottom: 1px solid var(--te-divider);
}
.te-header__inner {
  display: flex; align-items: center;
  gap: var(--te-nav-gap);
  width: 100%; max-width: var(--te-content-max); margin-inline: auto;
  padding: 18px var(--te-gutter);
}

/* ---- Desktop search field (shared header only) ---- */
.te-search {
  display: flex; align-items: center; gap: 8px;
  width: 190px; flex-shrink: 0;
  background: var(--te-fill);
  border: 1px solid var(--te-border);
  border-radius: var(--te-r-9);
  padding: 9px 14px;
}
.te-search__icon { color: var(--te-label); }
.te-search__input {
  border: 0; background: none; width: 100%;
  font-size: var(--te-fs-15); color: var(--te-ink);
}
.te-search__input:focus { outline: none; }
.te-search__input::placeholder { color: var(--te-label); }

/* ---- Desktop nav ---- */
.te-nav { flex: 1; }
.te-nav__list {
  list-style: none; margin: 0; padding: 0;
  display: flex; align-items: center; justify-content: center;
  gap: var(--te-nav-gap-sm);
}
.te-navitem { position: relative; }
.te-navitem__label {
  display: inline-flex; align-items: center; gap: 5px;
  background: none; border: 0; padding: 0;
  font-family: var(--te-font-body); font-size: var(--te-fs-16); font-weight: 500;
  color: var(--te-ink); white-space: nowrap; cursor: pointer;
  transition: color var(--te-hover-transition);
}
.te-navitem__label--signin { font-weight: 600; }
.te-navitem__caret { transition: transform var(--te-hover-transition); }
.te-navitem:hover > .te-navitem__label,
.te-navitem:focus-within > .te-navitem__label { color: var(--te-accent); }
.te-navitem:hover > .te-navitem__label .te-navitem__caret,
.te-navitem:focus-within > .te-navitem__label .te-navitem__caret { transform: rotate(180deg); }

/* Dropdown panel + invisible hover bridge */
.te-navitem__pop {
  position: absolute; top: 100%; left: -18px;
  padding-top: 16px;
  z-index: var(--te-z-dropdown);
  opacity: 0; visibility: hidden; transform: translateY(4px);
  transition: opacity var(--te-hover-transition), transform var(--te-hover-transition), visibility var(--te-hover-transition);
}
.te-navitem:hover > .te-navitem__pop,
.te-navitem:focus-within > .te-navitem__pop,
.te-navitem__pop.is-open {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.te-navitem__panel {
  background: var(--te-white);
  border: 1px solid var(--te-divider);
  border-radius: var(--te-r-12);
  padding: 10px;
  box-shadow: var(--te-shadow-dropdown);
}
.te-navitem__panel a {
  display: block;
  padding: 13px 16px; border-radius: var(--te-r-8);
  font-size: var(--te-fs-16); color: var(--te-ink);
  white-space: nowrap;
  transition: background var(--te-hover-transition);
}
.te-navitem__panel a:hover { background: var(--te-fill); color: var(--te-ink); }

/* More panel social row */
.te-panel-social {
  display: flex; align-items: center; justify-content: center; gap: 20px;
  padding: 18px 16px 8px;
  margin-top: 10px;
  border-top: 1px solid var(--te-divider-light);
}
.te-panel-social a { padding: 0; color: var(--te-chevron); }
.te-panel-social a:hover { color: var(--te-ink); background: none; }

/* ---- Contact block ---- */
.te-contact {
  display: flex; align-items: center; gap: 16px; flex-shrink: 0;
  padding-left: clamp(12px, 1.6vw, 22px);
  border-left: 1px solid var(--te-border);
}
.te-contact a { color: var(--te-ink); display: inline-flex; }
.te-contact a:hover { color: var(--te-accent); }
.te-contact__phone {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 16.5px; font-weight: 600; white-space: nowrap;
}

/* ---- Mobile-only controls (hidden on desktop) ---- */
.te-hdr-mobile { display: none; margin-left: auto; align-items: center; gap: 10px; }
.te-hdr-btn {
  width: 44px; height: 44px; border-radius: var(--te-r-10);
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--te-white); color: var(--te-ink); border: 1px solid var(--te-border);
}
.te-hdr-btn--burger { border-color: var(--te-border); }

/* ---- Mobile drawer ---- */
.te-drawer {
  position: relative; z-index: var(--te-z-drawer);
  background: var(--te-white);
  padding: 14px var(--te-gutter) 26px;
  box-shadow: var(--te-shadow-drawer);
}
.te-drawer[hidden] { display: none; }
.te-drawer__search {
  display: flex; align-items: center; gap: 8px;
  background: var(--te-fill); border: 1px solid var(--te-border);
  border-radius: var(--te-r-10); padding: 12px 16px; margin-bottom: 6px;
}
.te-drawer__search input { border: 0; background: none; width: 100%; font-size: var(--te-fs-16); }
.te-drawer__search input:focus { outline: none; }
.te-drawer__nav { list-style: none; margin: 0; padding: 0; }
.te-drawer__row { border-bottom: 1px solid var(--te-divider-light); }
.te-drawer__link,
.te-drawer__toggle {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%; background: none; border: 0; text-align: left;
  padding: 16px 2px; font-size: var(--te-fs-17); font-weight: 600; color: var(--te-ink);
  font-family: var(--te-font-body);
}
.te-drawer__toggle .te-navitem__caret { transition: transform var(--te-hover-transition); }
.te-drawer__toggle[aria-expanded="true"] .te-navitem__caret { transform: rotate(180deg); }
.te-drawer__sub { list-style: none; margin: 0; padding: 0 0 10px; }
.te-drawer__sub[hidden] { display: none; }
.te-drawer__sub a { display: block; padding: 12px 14px; font-size: var(--te-fs-16); color: var(--te-body); }
.te-drawer__cta { display: grid; gap: 12px; margin-top: 20px; }
.te-drawer__cta .te-btn { width: 100%; padding: 16px; border-radius: var(--te-r-10); font-size: var(--te-fs-16); }
.te-drawer__cta .te-btn--outline {
  background: none; color: var(--te-ink); border: 1px solid var(--te-border);
}
.te-drawer__cta .te-btn--outline:hover { border-color: var(--te-border-hover); }

/* ==========================================================================
   Layout swap at 1180px
   ========================================================================== */
@media (max-width: 1179.98px) {
  .te-nav, .te-search, .te-contact { display: none; }
  .te-hdr-mobile { display: inline-flex; }
}
@media (min-width: 1180px) {
  .te-drawer { display: none !important; }
}

/* Tight desktop band: compress gaps/search so the full row fits without
   page scroll between the 1180px swap and the ~1440px design width. */
@media (min-width: 1180px) and (max-width: 1400px) {
  .te-header__inner { gap: clamp(12px, 1.4vw, 26px); }
  .te-nav { min-width: 0; }
  .te-nav__list { gap: clamp(12px, 1.2vw, 22px); }
  .te-search { width: clamp(140px, 12vw, 190px); }
}

/* ==========================================================================
   Over-hero variant (homepage) — transparent chrome over the hero photo
   ========================================================================== */
.te-over-hero .te-chrome {
  position: absolute; top: 0; left: 0; right: 0;
  z-index: var(--te-z-header);
}
.te-over-hero .te-header {
  background: transparent;
  border-bottom: 0;
}
.te-over-hero .te-header__inner { padding-block: 22px; }
.te-over-hero .te-search { display: none; } /* homepage header has no search field */
.te-over-hero .te-logo__mark,
.te-over-hero .te-logo__word { filter: invert(1) brightness(2); }
.te-over-hero .te-navitem__label,
.te-over-hero .te-contact a,
.te-over-hero .te-contact__phone,
.te-over-hero .te-hdr-btn { color: var(--te-white); }
.te-over-hero .te-hdr-btn { background: rgba(16,17,20,0.28); border-color: var(--te-on-dark-border-24); }
.te-over-hero .te-contact { border-left-color: var(--te-on-dark-border-24); }
.te-over-hero .te-navitem:hover > .te-navitem__label,
.te-over-hero .te-navitem:focus-within > .te-navitem__label { color: var(--te-accent-pale); }
.te-over-hero .te-navitem__caret { color: currentColor; }
.te-over-hero .te-navitem__panel {
  border: 0;
  box-shadow: var(--te-shadow-dropdown-hero);
}
/* Panel interiors stay dark-on-white for readability */
.te-over-hero .te-navitem__panel a { color: var(--te-ink); }
