/* Phostreet — Vietnamese noodle-bar theme.
   Basil green + star-anise brown + lime for pho counters and
   banh-mi delis: steaming bowls, fresh herbs, quick lunch lines.
   A chopstick divider band and a noodle-pull marquee. All
   self-hosted; nothing here moves without content. */

html[data-theme="phostreet"] {
  --brand: #2f7d3b;
  --brand-deep: #123d1a;
  --brand-soft: #e9f4e4;
  --hero-bg: #0f2413;
  --hero-ink: #f2f7ec;
  --accent: #c8d64f;
  --basil: #2f7d3b;
  --lime: #c8d64f;
  --broth: #f2e7c9;
}

html[data-theme="phostreet"] .hero {
  background:
    radial-gradient(120% 90% at 50% 0%, rgb(200 214 79 / 0.14), transparent 60%),
    var(--hero-bg);
}

/* --- chopstick divider -------------------------------------------------------- */
.chop-band {
  height: 16px;
  background:
    linear-gradient(180deg, transparent 5px, var(--lime) 5px 7px, transparent 7px 9px, var(--basil) 9px 11px, transparent 11px),
    var(--brand-deep);
  border-block: 1px solid rgb(47 125 59 / 0.6);
}

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

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

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

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