/* Storefront — corner-shop theme.
   Aisle-blue + price-tag red + paper white for retail counters:
   delis, groceries, discount shops, mini markets. A shelf-edge
   divider band and an open-daily marquee. All self-hosted; nothing
   here moves without content. */

html[data-theme="storefront"] {
  --brand: #1f5fa8;
  --brand-deep: #12365e;
  --brand-soft: #e7f0fa;
  --hero-bg: #101f33;
  --hero-ink: #f2f7fd;
  --accent: #d64545;
  --aisle: #1f5fa8;
  --tag: #d64545;
  --paper: #f7f5ef;
}

html[data-theme="storefront"] .hero {
  background:
    radial-gradient(120% 90% at 50% 0%, rgb(31 95 168 / 0.35), transparent 60%),
    var(--hero-bg);
}

/* --- shelf-edge divider ------------------------------------------------------- */
.shelf-band {
  height: 18px;
  background:
    repeating-linear-gradient(90deg, var(--tag) 0 14px, var(--paper) 14px 28px),
    var(--brand-deep);
  background-size:
    auto,
    auto;
  background-position:
    0 8px,
    0 0;
  background-repeat: repeat-x;
  border-block: 1px solid rgb(214 69 69 / 0.55);
}

/* --- open-daily marquee ---------------------------------------------------------- */
.opendaily {
  overflow: hidden;
  background: var(--brand-deep);
  color: var(--paper);
  border-block: 1px solid var(--aisle);
  padding-block: 0.55rem;
}
.opendaily-track {
  display: flex;
  gap: 3rem;
  width: max-content;
  animation: opendaily-scroll 26s linear infinite;
  will-change: transform;
}
.opendaily-track span {
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.8rem;
  white-space: nowrap;
}
@keyframes opendaily-scroll {
  to { transform: translateX(-50%); }
}

html[data-theme="storefront"] .service {
  border-color: rgb(31 95 168 / 0.4);
  background: linear-gradient(180deg, var(--brand-soft), transparent 140%);
}

html[data-theme="storefront"] .site-footer {
  background: var(--brand-deep);
  color: var(--hero-ink);
}

@media (prefers-reduced-motion: reduce) {
  .opendaily-track { animation: none; }
}