/* custom overrides (loaded last) */
/* visually-hidden accessible text (gives the logo <h1> a real text name) */
.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}
/* keyboard skip-to-content link: off-screen until focused */
.skip-link {
  position: absolute;
  left: 8px;
  top: -48px;
  z-index: 10000;
  background: #0b5cab;
  color: #fff !important;
  padding: 10px 16px;
  border-radius: 0 0 6px 6px;
  font-weight: 600;
  text-decoration: none;
  transition: top .15s ease;
}
.skip-link:focus {
  top: 0;
  outline: 3px solid #ffbf47;
  outline-offset: 2px;
}
/* visible keyboard focus for interactive elements (a11y) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #0b5cab;
  outline-offset: 2px;
}
/* contact-page location map (keyless Google Maps embed, this pharmacy's address) */
.locationMapBlock {
  max-width: 1100px;
  margin: 1.5em auto 0;
}
.locationMap {
  width: 100%;
  border: 0;
  display: block;
  aspect-ratio: 16 / 9;
  min-height: 320px;
}
/* top contact bar (eyebrow): the template lays each group out as a full-width
   block (inline width:100%) with right-aligned text and the icon absolutely
   positioned at left:-20px, so the icon floats far from its text. Shrink each
   group to its content and put the icon in normal flow right before the text so
   it sits tight with even spacing and is vertically centred. The wrapper here is
   .secondaryNavContent (built at runtime); there is no .secondaryNav element. */
.secondaryNavContent .blockContainer {
  width: auto !important;       /* override the inline width:100% */
  text-align: left !important;  /* override the inline text-align:right */
  flex: 0 0 auto;
}
.secondaryNavContent .blockInnerContent {
  display: inline-flex;
  align-items: center;
}
.secondaryNavContent .blockInnerContent p {
  margin: 0;
}
.secondaryNavContent .blockWrap_d1c3085901d84645b31bd09c4bae76b6 .blockInnerContent:before,
.secondaryNavContent .blockWrap_ec68df6a64454b0d992c5244bb2cac55 .blockInnerContent:before,
.secondaryNavContent .blockWrap_f00a8333e723460baad25b5365b52e36 .blockInnerContent:before {
  position: static;
  left: auto;
  margin-top: 0;
  margin-right: 6px;
  flex: 0 0 auto;
}
/* keep the three groups on a single line (no wrapping) in the row layout */
@media only screen and (min-width: 1025px) {
  .secondaryNavContent {
    flex-wrap: nowrap;
    gap: 2.25em;
  }
  .secondaryNavContent .blockInnerContent {
    white-space: nowrap;
  }
}
/* About-the-pharmacy headshot: the photo is a portrait whose head sits near the
   top, but the theme crops it to a centred square circle (background-position
   50% 50%), trimming the top of the head. Shift the focal point upward so the
   whole head stays inside the circle. */
.block_cf2495fef3f246eda03a4a26d0afb874 .imgShape {
  background-position: 50% 6% !important;
}
/* newsletter section: the duplicate static heading is removed at build time
   (the Lumistry widget renders its own title), so centre the remaining capture
   form within its section instead of leaving it floated to one 48% column. */
.blockWrap_d66f6a80367049f7b70e5a4e6d422571 .blockContent {
  justify-content: center;
}
.blockWrap_d66f6a80367049f7b70e5a4e6d422571 .blockImg.blockForm {
  width: 100%;
  max-width: 560px;
  float: none;
  padding-left: 0;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
@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;
  }
}
/* About > The Pharmacy Team roster: a responsive card grid carried over from
   the prior site's team section. Members with a headshot show a circular,
   cover-cropped photo; those without one keep a clean text-only card so the
   row stays aligned. */
.teamGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1.75em 1.25em;
  margin-top: 1.5em;
  list-style: none;
  padding: 0;
}
.teamMember {
  text-align: center;
}
.teamPhoto {
  width: 132px;
  height: 132px;
  margin: 0 auto 0.7em;
  border-radius: 50%;
  overflow: hidden;
  background: #e8eef5;
  box-shadow: 0 4px 14px rgba(0, 62, 126, 0.15);
}
.teamPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 20%;
  display: block;
}
.teamMember--noPhoto:before {
  content: "";
  display: block;
  width: 132px;
  height: 132px;
  margin: 0 auto 0.7em;
  border-radius: 50%;
  background: #e8eef5;
  border: 2px dashed #c3d4e6;
}
.teamName {
  font-weight: 700;
  color: #003e7e;
  line-height: 1.25;
}
.teamTitle {
  font-size: 0.9em;
  color: #5a6b7b;
  margin-top: 0.15em;
}
/* About first block: keep the team photo at the TOP beside the opening text
   (template default vertically-centers it against the very tall text column,
   pushing the circle photo halfway down the page). */
.blockWrap_d55f91342f024f59b17b4228366c8373 .blockContent.layoutD--vAlign1 {
  align-items: flex-start;
}
