/* Small layout corrections applied to the existing site.
   Keep its typefaces, colours, photography, copy and section order. */

/* Give the store content a consistent rhythm without changing the layout. */
.stores-dir-header { margin-bottom: 1.75rem; }
.dir-filter-chips { margin-bottom: 1.75rem; }
.dir-filter-chip { min-height: 42px; }
.dir-store-card { display: flex; flex-direction: column; }
.dir-store-card.hidden { display: none; }
.dir-card-photo { height: 220px; flex-shrink: 0; }
.dir-card-photo img { object-position: center 35%; }
.dir-card-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 1.4rem;
}
.dir-card-body h3 { margin-bottom: .55rem; }
.dir-card-desc { line-height: 1.65; margin-bottom: 1.1rem; }
.dir-card-meta { margin-top: auto; min-height: 4.25rem; }
.dir-card-hours, .dir-card-phone { font-size: .875rem; line-height: 1.5; }
.dir-card-hours { align-items: flex-start; }
.dir-card-hours svg { margin-top: .2rem; }
.dir-card-phone { min-height: 24px; }

/* The St1 award was absolutely positioned over the hours at the bottom. */
.dir-card-body > .dir-card-badge {
  position: static;
  align-self: flex-start;
  margin: 0 0 .8rem;
  padding: 0;
  background: none;
  color: var(--red-orange);
  box-shadow: none;
  text-transform: none;
  letter-spacing: 0;
  font-size: .8rem;
  line-height: 1.5;
}
.dir-card-photo > .dir-card-badge {
  max-width: calc(100% - 24px);
  line-height: 1.4;
  white-space: normal;
  box-shadow: none;
}
.dir-card-badge svg { flex-shrink: 0; }

/* Keep hover feedback small enough that cards and text stay in place. */
.dir-store-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(27,58,124,.07); }
.dir-store-card:hover .dir-card-photo img { transform: scale(1.015); }
.office-point:hover { transform: none; box-shadow: none; }

/* Make dense opening-time rows easier to scan. */
.hours-table-row { gap: 1rem; }
.h-time { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* This container previously lost all horizontal padding on small screens. */
.office-content { padding-inline: clamp(1rem,4vw,2rem); }

@media (max-width: 640px) {
  .dir-card-photo { height: 200px; }
  .dir-card-body { padding: 1.15rem; }
  .dir-card-meta { min-height: 0; }
  .dir-card-expand {
    min-height: 44px;
    align-self: flex-start;
    font-size: .875rem;
    color: var(--navy);
    margin-bottom: .4rem;
  }
  .dir-card-phone { min-height: 36px; }
  .dir-card-photo > .dir-card-badge { font-size: .7rem; }
  .dir-store-card:hover { transform: none; }
  .office-grid > .office-point:last-child { grid-column: 1 / -1 !important; }
}

@media (prefers-reduced-motion: reduce) {
  .dir-store-card, .dir-card-photo img { transition: none; }
}