/* ============================================================
   CUSTOM — Per-Store Overrides
   Keep this file under 30 lines. Only store-specific tweaks go here.
   Do NOT add layout, grid, or structural CSS — that belongs in style.css.
   Do NOT add theme design tokens — that belongs in theme.css.

   Examples of what belongs here:
   - A promotional banner color unique to this store
   - A section hidden for this location (display: none)
   - A logo size tweak specific to this store
   ============================================================ */

/* Delivery page: H4 sub-heading inside the delivery text block */
.gs-delivery-text h4 {
  font-family: var(--gs-font-body);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gs-dark);
  margin-bottom: 0.75rem;
}

/* Map + contact box: pin the action buttons to the bottom-right corner */
.gs-location-details .gs-location-buttons,
.gs-map-info .gs-map-buttons {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  margin-top: auto;
}

@media (max-width: 768px) {
  .gs-location-details .gs-location-buttons,
  .gs-map-info .gs-map-buttons {
    justify-content: center;
  }
}

/* Hero readability (index.html, contact-us.html)
   The brand red is tuned for contrast on WHITE, so on the dark hero photo it
   drops to ~1.4:1. Inside .gs-hero only, accents switch to --gs-hero-accent
   (the logo orange lightened), which clears AA even over the brightest photo
   area. Colour only - no layout changes. */
.gs-hero h1 .accent,
.gs-hero-badge i,
.gs-hero-stat-value,
.gs-hero .gs-divider-icon,
.gs-hero .text-gs-red {
  color: var(--gs-hero-accent);
}

.gs-hero .gs-divider-line {
  background: var(--gs-hero-accent);
}

/* Keeps white type legible where the photo behind it is bright and busy */
.gs-hero h1,
.gs-hero-text {
  text-shadow: 0 2px 12px rgba(20, 6, 38, 0.55);
}