/* custom overrides (loaded last) */
@media (max-width: 767px) {
  .headerAndNavContainer {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
  }
  /* eyebrow (secondary nav) collapses on scroll to reclaim space */
  .secondaryNav {
    overflow: hidden;
    max-height: 300px;
    transition: max-height 0.25s ease, opacity 0.2s ease;
  }
  .secondaryNav.eyebrow-collapsed {
    max-height: 0 !important;
    opacity: 0 !important;
  }
}

/* footer Contact Us: stacked info with icons beneath heading */
/* template hides the first contact <p> (.block_a987...>.blockText>.blockInnerContent>p:first-of-type);
   our phone number is that first <p>, so re-enable it */
.block_a98717c530734da1aa503480ce39007c > .blockText > .blockInnerContent > p:first-of-type {
  display: flex !important;
}
.footerContact p {
  display: flex !important;
  align-items: flex-start;
  padding-bottom: 1.25em;
  margin: 0;
}
/* template zeroes .contactPhone padding-bottom (specificity 0-2-1); restore so phone/email are spaced */
.footerContact p.contactPhone {
  padding-bottom: 1.25em;
}
.footerContact .fcIcon {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  margin-top: 2px;
  line-height: 0;
  color: #c2d8f0;
}
.footerContact .fcIcon svg {
  width: 20px !important;
  height: 20px !important;
  display: block;
}
.footerContact .fcText {
  flex: 1 1 auto;
  line-height: 1.5;
}
.footerContact .fcText a {
  text-decoration: none;
}
/* a script wraps the address <p> inner content in <a class="addressMapLink">,
   making the anchor the flex parent instead of the <p>; mirror the flex here
   so the pin icon sits beside the address (matching phone/email/hours) */
.footerContact .addressMapLink {
  display: flex !important;
  align-items: flex-start;
  color: inherit;
  text-decoration: none;
}

/* top contact bar (eyebrow above header): location / phone / hours with blue outline icons */
/* the bar lives inside the fixed .headerAndNavContainer (which is display:table on desktop);
   force block stacking so the bar sits above the logo/nav row */
.headerAndNavContainer { display: block !important; }
.secondaryNav.phelanTopBar {
  background: #fff;
  border-bottom: 1px solid rgba(194, 216, 240, 0.6);
  font-size: 0.9rem;
}
.phelanTopBar .secondaryNavContent {
  max-width: 1200px;
  margin: 0 auto;
  padding: 9px 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(1.5rem, 5vw, 5rem);
  flex-wrap: wrap;
}
.phelanTopBar .tbItem {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #333;
  text-decoration: none;
  white-space: nowrap;
  line-height: 1.2;
}
.phelanTopBar a.tbItem:hover { color: #00467f; }
.phelanTopBar .tbIcon {
  display: inline-flex;
  align-items: center;
  color: #00467f;
  flex: 0 0 auto;
}
.phelanTopBar .tbIcon svg { display: block; }
@media (max-width: 767px) {
  .phelanTopBar .secondaryNavContent {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 8px 16px;
  }
  .phelanTopBar .tbItem { white-space: normal; }
}
