/* Saint Demetrios Greek Festival — front-end styles.
   Palette drawn from the festival flyer: Aegean/sky blue, deep navy, white.
   Mobile-first; everything is scoped under .stdem-fest.
   Interactive bits are gated on `.is-enhanced`, which festival.js adds to the
   schedule/menu containers — so with JavaScript off, days stack with headings
   and no dead tabs/filters appear. */

.stdem-fest {
  --fest-navy: #141b4d;
  --fest-navy-2: #1e2a63;
  --fest-blue: #4a90d9;
  --fest-blue-light: #8fc4ec;
  --fest-sky: #e8f2fb;
  --fest-ink: #23262f;
  --fest-line: #d6e3f0;
  --fest-gold: #d4af37;
  --fest-gold-light: #e8d38a;
  --fest-radius: 14px;
  --fest-shadow: 0 10px 30px rgba(20, 27, 77, .12);
  color: var(--fest-ink);
  font-size: 1.02rem;
  line-height: 1.6;
}

.stdem-fest *,
.stdem-fest *::before,
.stdem-fest *::after { box-sizing: border-box; }

.stdem-fest img { max-width: 100%; height: auto; }

/* ---- Greek key (meander) accent used under section headings ---- */
.stdem-fest .fest-h2 {
  font-size: clamp(1.5rem, 4vw, 2.15rem);
  color: var(--fest-navy);
  margin: 0 0 1.1rem;
  padding-bottom: .55rem;
  position: relative;
  letter-spacing: .01em;
}
.stdem-fest .fest-h2::after {
  content: "";
  display: block;
  position: absolute;
  left: 0; bottom: 0;
  width: 120px; height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='24' viewBox='0 0 28 24'%3E%3Cg fill='none' stroke='%23141b4d' stroke-width='3'%3E%3Cpath d='M0 24 H28'/%3E%3Cpath d='M3 24 V3 H25 V18 H10 V9 H19'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-size: auto 14px;
}

/* ============================ HERO ============================ */
.stdem-fest-hero {
  position: relative;
  isolation: isolate;
  background: linear-gradient(180deg, var(--fest-blue) 0%, #3f7fc8 32%, var(--fest-navy) 78%);
  color: #fff;
  border-radius: var(--fest-radius);
  overflow: hidden;
  box-shadow: var(--fest-shadow);
  margin-bottom: 1.75rem;
}
/* Greek-key (meander) bands top & bottom — echoes the flyer border */
.stdem-fest .fest-hero-key {
  position: absolute;
  left: 0; right: 0;
  height: 22px;
  z-index: 1;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='24' viewBox='0 0 28 24'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='3'%3E%3Cpath d='M0 24 H28'/%3E%3Cpath d='M3 24 V3 H25 V18 H10 V9 H19'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-size: auto 22px;
}
.stdem-fest .fest-hero-key-top { top: 0; opacity: .5; }
.stdem-fest .fest-hero-key-bottom { bottom: 0; opacity: .38; transform: scaleY(-1); }
.stdem-fest .fest-hero-inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.2rem;
  padding: 2.6rem 1.5rem 2.8rem;
}
.stdem-fest .fest-hero-copy { text-align: center; }
.stdem-fest .fest-status {
  display: inline-block;
  font-size: .9rem;
  font-weight: 600;
  padding: .3rem .8rem;
  border-radius: 999px;
  margin: 0 0 .9rem;
}
.stdem-fest .fest-status-over { background: rgba(255,255,255,.16); }
.stdem-fest .fest-status-live { background: #2e7d32; }
.stdem-fest .fest-eyebrow {
  display: block;
  font-size: clamp(.9rem, 3.4vw, 1.15rem);
  font-weight: 700;
  letter-spacing: .18em;
  color: var(--fest-gold-light);
  margin-bottom: .3rem;
}
.stdem-fest .fest-title {
  font-size: clamp(2.1rem, 8vw, 3.5rem);
  line-height: 1;
  margin: 0 0 .6rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #fff;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .28);
}
.stdem-fest .fest-date-line {
  font-size: clamp(1.05rem, 3.4vw, 1.4rem);
  font-weight: 700;
  margin: 0 0 .8rem;
  color: #fff;
}
.stdem-fest .fest-tagline {
  font-size: 1.02rem;
  font-style: italic;
  color: var(--fest-blue-light);
  margin: 0 auto .9rem;
  max-width: 34rem;
}
.stdem-fest .fest-admission { margin: 0 0 .9rem; }
.stdem-fest .fest-admission-badge {
  display: inline-block;
  font-weight: 800;
  font-size: .98rem;
  letter-spacing: .01em;
  padding: .45rem 1.05rem;
  border-radius: 999px;
  color: var(--fest-navy);
  background: linear-gradient(180deg, var(--fest-gold-light), var(--fest-gold));
  box-shadow: 0 4px 14px rgba(0, 0, 0, .22);
}
.stdem-fest .fest-intro {
  margin: 0 auto 1.2rem;
  max-width: 36rem;
  color: rgba(255, 255, 255, .92);
}
.stdem-fest .fest-hero-art { display: none; }
.stdem-fest .fest-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  justify-content: center;
}
.stdem-fest .fest-btn {
  display: inline-block;
  padding: .7rem 1.25rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: .98rem;
  text-decoration: none;
  background: #fff;
  color: var(--fest-navy);
  border: 2px solid #fff;
  transition: transform .12s ease, background .12s ease, color .12s ease;
}
.stdem-fest .fest-btn:hover { transform: translateY(-2px); }
.stdem-fest .fest-btn-primary { background: var(--fest-blue); border-color: var(--fest-blue); color: #fff; }
.stdem-fest .fest-btn-ghost { background: transparent; color: #fff; }
.stdem-fest .fest-btn-ghost:hover { background: rgba(255,255,255,.14); }

/* --- Hero media carousel (admin-managed images/videos) --------------- */
.stdem-fest .stdem-fest-hero--media { background: var(--fest-navy); }
.stdem-fest .fest-hero-slides { position: absolute; inset: 0; z-index: 0; }
.stdem-fest .fest-hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity .8s ease;
  background-size: cover;
  background-position: var(--focal-d, 50% 50%);
  background-repeat: no-repeat;
}
.stdem-fest .fest-hero-slide.is-active { opacity: 1; }
.stdem-fest .fest-hero-video { width: 100%; height: 100%; object-fit: cover; object-position: var(--focal-d, 50% 50%); display: block; }
/* Dark-blue readability scrim over the media so the white copy always reads.
   Kept intentionally heavy + fairly even so text stays legible over bright,
   busy, or light-colored photos (banners, food, crowds). */
.stdem-fest .stdem-fest-hero--media::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(13,18,54,.78) 0%, rgba(13,18,54,.62) 50%, rgba(13,18,54,.88) 100%),
    radial-gradient(130% 120% at 50% 42%, rgba(13,18,54,.30) 0%, rgba(13,18,54,.55) 100%);
}
/* Lift the existing copy + key bands above the media & scrim */
.stdem-fest .stdem-fest-hero--media .fest-hero-key { z-index: 2; }
.stdem-fest .stdem-fest-hero--media .fest-hero-inner { z-index: 3; }
/* Extra text-shadow only when the copy sits over a photo/video */
.stdem-fest .stdem-fest-hero--media .fest-eyebrow,
.stdem-fest .stdem-fest-hero--media .fest-date-line,
.stdem-fest .stdem-fest-hero--media .fest-tagline,
.stdem-fest .stdem-fest-hero--media .fest-intro {
  text-shadow: 0 1px 8px rgba(0, 0, 0, .55);
}
.stdem-fest .stdem-fest-hero--media .fest-title {
  text-shadow: 0 2px 18px rgba(0, 0, 0, .55), 0 1px 2px rgba(0, 0, 0, .4);
}
/* The italic tagline uses a light-blue brand tint that can wash out over
   bright media — nudge it toward near-white so it stays readable. */
.stdem-fest .stdem-fest-hero--media .fest-tagline { color: #eaf2ff; }
.stdem-fest .stdem-fest-hero--media .fest-intro { color: #fff; }
/* Arrows */
.stdem-fest .fest-hero-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: rgba(20,27,77,.42);
  color: #fff;
  font-size: 1.7rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease;
}
.stdem-fest .fest-hero-arrow:hover { background: rgba(20,27,77,.72); }
.stdem-fest .fest-hero-prev { left: .6rem; }
.stdem-fest .fest-hero-next { right: .6rem; }
/* Dots */
.stdem-fest .fest-hero-dots {
  position: absolute;
  left: 0; right: 0;
  bottom: 1.35rem;
  z-index: 4;
  display: flex;
  gap: .5rem;
  justify-content: center;
}
.stdem-fest .fest-hero-dot {
  width: 11px;
  height: 11px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,.5);
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}
.stdem-fest .fest-hero-dot:hover { background: rgba(255,255,255,.85); }
.stdem-fest .fest-hero-dot.is-active { background: var(--fest-gold); transform: scale(1.15); }

/* ============================ HOURS ============================ */
.stdem-fest-hours {
  display: grid;
  grid-template-columns: 1fr;
  gap: .7rem;
  margin: 0 0 2rem;
}
.stdem-fest .fest-hours-card {
  background: var(--fest-sky);
  border: 1px solid var(--fest-line);
  border-radius: 12px;
  padding: .85rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.stdem-fest .fest-hours-day { font-weight: 800; color: var(--fest-navy); }
.stdem-fest .fest-hours-time { color: var(--fest-ink); font-size: 1.05rem; }

/* ============================ SECTIONS ============================ */
.stdem-fest-section { margin: 0 0 2.4rem; }
.stdem-fest .fest-empty {
  background: var(--fest-sky);
  border: 1px dashed var(--fest-blue);
  border-radius: 12px;
  padding: 1.1rem 1.2rem;
  color: var(--fest-navy);
}

/* ---- Schedule ---- */
.stdem-fest .fest-day-tabs { display: none; }              /* shown only when enhanced */
.stdem-fest [data-fest-schedule].is-enhanced .fest-day-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1.1rem;
}
.stdem-fest .fest-day-tab {
  border: 2px solid var(--fest-line);
  background: #fff;
  color: var(--fest-navy);
  font-weight: 700;
  padding: .55rem 1rem;
  border-radius: 999px;
  cursor: pointer;
  font-size: .95rem;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.stdem-fest .fest-day-tab:hover { border-color: var(--fest-blue); }
.stdem-fest .fest-day-tab.is-active {
  background: var(--fest-navy);
  border-color: var(--fest-navy);
  color: #fff;
}
.stdem-fest .fest-day-head {
  font-size: 1.15rem;
  color: var(--fest-navy);
  margin: 1.4rem 0 .6rem;
}
/* With JS: hide the in-panel heading (redundant with tab) and stack -> tabs. */
.stdem-fest [data-fest-schedule].is-enhanced .fest-day-head { display: none; }
.stdem-fest [data-fest-schedule].is-enhanced .fest-day { display: none; }
.stdem-fest [data-fest-schedule].is-enhanced .fest-day.is-active { display: block; }

.stdem-fest .fest-event-list { list-style: none; margin: 0; padding: 0; }
.stdem-fest .fest-event {
  display: grid;
  grid-template-columns: 1fr;
  gap: .2rem .9rem;
  padding: .95rem 1rem;
  border: 1px solid var(--fest-line);
  border-left: 5px solid var(--fest-blue);
  border-radius: 12px;
  margin-bottom: .7rem;
  background: #fff;
}
.stdem-fest .fest-cat-dance  { border-left-color: #d1477a; }
.stdem-fest .fest-cat-music  { border-left-color: #7b4fd0; }
.stdem-fest .fest-cat-dj     { border-left-color: #2b7fc2; }
.stdem-fest .fest-cat-tour   { border-left-color: #2f8f6b; }
.stdem-fest .fest-cat-kids   { border-left-color: #e08a2b; }
.stdem-fest .fest-cat-marketplace { border-left-color: #c2913a; }
.stdem-fest .fest-cat-food   { border-left-color: #c34a4a; }
.stdem-fest .fest-cat-other  { border-left-color: var(--fest-blue); }
.stdem-fest .fest-event-time { font-weight: 800; color: var(--fest-navy); }
/* Acts with no fixed slot ("Throughout festival hours") — quieter than a clock time. */
.stdem-fest .fest-event-time--note {
  font-weight: 700;
  font-size: .9rem;
  color: #55606e;
  font-style: italic;
}
.stdem-fest .fest-event-note {
  display: block;
  font-weight: 600;
  font-size: .85rem;
  color: #55606e;
  font-style: italic;
}
.stdem-fest .fest-event-title { font-weight: 700; margin-right: .5rem; }
.stdem-fest .fest-event-link { color: var(--fest-navy); text-decoration: underline; text-underline-offset: 2px; }
.stdem-fest .fest-event-link:hover { color: var(--fest-blue); }
.stdem-fest .fest-ext { font-size: .8em; opacity: .7; }
.stdem-fest .fest-cat-badge {
  display: inline-block;
  font-size: .78rem;
  background: var(--fest-sky);
  color: var(--fest-navy);
  border-radius: 999px;
  padding: .1rem .55rem;
  vertical-align: middle;
}
.stdem-fest .fest-event-loc { display: inline-block; font-size: .85rem; color: #5a6472; margin-left: .5rem; }
.stdem-fest .fest-event-desc { font-size: .95rem; color: #444b57; margin-top: .3rem; }
.stdem-fest .fest-event-desc p { margin: .2rem 0; }

/* ---- Menu ---- */
.stdem-fest .fest-menu-filter { display: none; }           /* shown only when enhanced */
.stdem-fest [data-fest-menu].is-enhanced .fest-menu-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem;
  margin-bottom: 1.2rem;
}
.stdem-fest .fest-menu-cat-label {
  font-size: .9rem;
  color: #55606e;
  font-weight: 700;
  margin-right: .2rem;
}
.stdem-fest .fest-menu-chip {
  border: 2px solid var(--fest-line);
  background: #fff;
  color: var(--fest-navy);
  font-weight: 600;
  padding: .4rem .85rem;
  border-radius: 999px;
  cursor: pointer;
  font-size: .9rem;
}
.stdem-fest .fest-menu-chip.is-active { background: var(--fest-blue); border-color: var(--fest-blue); color: #fff; }

/* ---- Menu: allergen filter ----
   Deliberately styled apart from the blue pill category sorter above: a warm
   tinted panel with squared-off tags, so "hide items with X" never reads as
   "browse category X". */
.stdem-fest .fest-menu-sensitivity-filter { display: none; }
.stdem-fest [data-fest-menu].is-enhanced .fest-menu-sensitivity-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin-bottom: 1rem;
  padding: .65rem .9rem;
  background: #fdf4f1;
  border: 1px solid #f2c3ba;
  border-left: 5px solid #e66b57;
  border-radius: 10px;
}
.stdem-fest .fest-menu-filter-label {
  font-size: .9rem;
  color: #8a3320;
  font-weight: 800;
  margin-right: .2rem;
}
.stdem-fest .fest-menu-filter-icon { font-size: 1em; }
.stdem-fest .fest-menu-sens-chip {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  border: 1px solid #e3b6ac;
  background: #fff;
  color: #7c3421;
  font-weight: 700;
  font-size: .85rem;
  padding: .3rem .6rem;
  border-radius: 7px;             /* squared-off, vs. the pill category chips */
  cursor: pointer;
  line-height: 1.3;
}
.stdem-fest .fest-menu-sens-chip:hover { border-color: #e66b57; background: #fff; }
.stdem-fest .fest-menu-sens-chip.is-active {
  background: #9d2918;
  border-color: #9d2918;
  color: #fff;
}
.stdem-fest .fest-menu-sens-chip.is-active .fest-menu-sens-chip-text {
  text-decoration: line-through;
}
.stdem-fest .fest-menu-sens-chip-emoji { line-height: 1; }
/* The reset action is not a filter — render it as a plain link, never a tag. */
.stdem-fest .fest-menu-clear-sens {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  background: none;
  border: 0;
  padding: .3rem .1rem;
  color: var(--fest-navy);
  font-weight: 700;
  font-size: .82rem;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.stdem-fest .fest-menu-clear-sens:hover { color: #9d2918; }
.stdem-fest .fest-menu-clear-sens:focus-visible { outline: 2px solid #9d2918; outline-offset: 2px; }
.stdem-fest .fest-menu-cat { margin-bottom: 1.5rem; }
.stdem-fest .fest-menu-cat.is-hidden { display: none; }
.stdem-fest .fest-menu-item.is-hidden { display: none; }
.stdem-fest .fest-menu-cat-head {
  font-size: 1.2rem;
  color: var(--fest-navy);
  border-bottom: 2px solid var(--fest-line);
  padding-bottom: .35rem;
  margin: 0 0 .7rem;
}
.stdem-fest .fest-menu-list { list-style: none; margin: 0; padding: 0; }
.stdem-fest .fest-menu-item { padding: .55rem 0; border-bottom: 1px dotted var(--fest-line); }
.stdem-fest .fest-menu-item:last-child { border-bottom: 0; }
.stdem-fest .fest-menu-item-main {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
}
.stdem-fest .fest-menu-name { font-weight: 700; color: var(--fest-navy); }
.stdem-fest .fest-menu-price { font-weight: 700; color: var(--fest-blue); white-space: nowrap; }
.stdem-fest .fest-menu-desc { margin: .15rem 0 0; font-size: .93rem; color: #55606e; }
.stdem-fest .fest-menu-item.is-soldout .fest-menu-name { color: #98a2b3; }
.stdem-fest .fest-soldout-tag {
  font-size: .72rem;
  background: #fde8e8;
  color: #b3261e;
  padding: .05rem .45rem;
  border-radius: 999px;
  font-weight: 700;
}
.stdem-fest .fest-menu-note { font-size: .9rem; color: #667085; font-style: italic; margin-top: .8rem; }
.stdem-fest .fest-menu-avail {
  display: inline-flex;
  align-items: center;
  gap: .2rem;
  font-size: .72rem;
  background: #fdf3e3;
  color: #92500a;
  border: 1px solid #f0d9b0;
  padding: .05rem .5rem;
  border-radius: 999px;
  font-weight: 700;
  white-space: nowrap;
  vertical-align: middle;
}
.stdem-fest .fest-menu-name .fest-menu-avail { margin-left: .1rem; }
/* Per-item allergen marks: bare emoji, same treatment as the location badges.
   The filter panel above doubles as the legend, and each carries a tooltip. */
.stdem-fest .fest-menu-sens {
  font-size: .95em;
  line-height: 1;
  vertical-align: middle;
  margin-left: .15rem;
  cursor: help;
}
.stdem-fest .fest-menu-empty-filter {
  margin: .5rem 0 1.2rem;
  color: #6b7280;
  font-size: .92rem;
}

/* ---- Menu: location legend + per-item badge + photos ---- */
.stdem-fest .fest-menu-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem 1.1rem;
  background: var(--fest-sky);
  border: 1px solid var(--fest-line);
  border-radius: 12px;
  padding: .6rem .9rem;
  margin-bottom: 1rem;
  font-size: .9rem;
  color: var(--fest-navy);
}
.stdem-fest .fest-menu-legend-label { font-weight: 800; }
.stdem-fest .fest-menu-legend-item { display: inline-flex; align-items: center; gap: .35rem; }
.stdem-fest .fest-menu-place {
  font-size: .95em;
  line-height: 1;
  vertical-align: middle;
}
.stdem-fest .fest-menu-name .fest-menu-place { margin-left: .1rem; }
.stdem-fest .fest-menu-item.has-thumb { display: flex; gap: .9rem; align-items: flex-start; }
.stdem-fest .fest-menu-thumb {
  flex: 0 0 auto;
  width: 76px;
  height: 76px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid var(--fest-line);
}
.stdem-fest .fest-menu-item-text { flex: 1 1 auto; min-width: 0; }
.stdem-fest .fest-menu-item.is-soldout .fest-menu-thumb { filter: grayscale(1); opacity: .6; }

/* ---- Menu: clickable name/photo buttons ---- */
.stdem-fest .fest-menu-open {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
  text-align: left;
}
.stdem-fest .fest-menu-name-btn:hover,
.stdem-fest .fest-menu-name-btn:focus-visible { color: var(--fest-blue); text-decoration: underline; }
.stdem-fest .fest-menu-item.is-soldout .fest-menu-name-btn:hover,
.stdem-fest .fest-menu-item.is-soldout .fest-menu-name-btn:focus-visible { color: #7a8698; }
.stdem-fest .fest-menu-thumb-btn {
  flex: 0 0 auto;
  display: block;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  border-radius: 10px;
}
.stdem-fest .fest-menu-thumb-btn .fest-menu-thumb { display: block; transition: transform .15s ease; }
.stdem-fest .fest-menu-thumb-btn:hover .fest-menu-thumb,
.stdem-fest .fest-menu-thumb-btn:focus-visible .fest-menu-thumb { transform: scale(1.04); }

/* ---- Menu: item detail modal ---- */
body.fest-modal-open { overflow: hidden; }
.stdem-fest .fest-menu-modal[hidden] { display: none; }
.stdem-fest .fest-menu-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.2rem;
}
.stdem-fest .fest-menu-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(10, 16, 40, .6);
}
.stdem-fest .fest-menu-modal-card {
  position: relative;
  background: #fff;
  border-radius: 16px;
  width: 100%;
  max-width: 460px;
  max-height: 90vh;
  overflow: auto;
  box-shadow: 0 24px 60px rgba(10, 16, 40, .45);
  animation: festModalIn .18s ease;
}
@keyframes festModalIn {
  from { opacity: 0; transform: translateY(12px) scale(.98); }
  to   { opacity: 1; transform: none; }
}
.stdem-fest .fest-menu-modal-close {
  position: absolute;
  top: .55rem;
  right: .55rem;
  z-index: 2;
  width: 2rem;
  height: 2rem;
  line-height: 1;
  font-size: 1.35rem;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  color: var(--fest-navy);
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(10, 16, 40, .25);
}
.stdem-fest .fest-menu-modal-close:hover,
.stdem-fest .fest-menu-modal-close:focus-visible { background: #fff; color: var(--fest-blue); }
.stdem-fest .fest-menu-modal-img {
  display: block;
  width: 100%;
  max-height: 300px;
  object-fit: cover;
  border-radius: 16px 16px 0 0;
}
.stdem-fest .fest-menu-modal-body { padding: 1.1rem 1.3rem 1.4rem; }
.stdem-fest .fest-menu-modal-card.no-photo .fest-menu-modal-media { display: none; }
.stdem-fest .fest-menu-modal-card.no-photo .fest-menu-modal-body { padding-top: 1.9rem; }
.stdem-fest .fest-menu-modal-title { margin: 0 0 .5rem; font-size: 1.4rem; color: var(--fest-navy); }
.stdem-fest .fest-menu-modal-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .9rem;
  margin-bottom: .7rem;
}
.stdem-fest .fest-menu-modal-price { font-weight: 800; color: var(--fest-blue); font-size: 1.1rem; }
.stdem-fest .fest-menu-modal-place { font-size: .92rem; color: var(--fest-navy); }
.stdem-fest .fest-menu-modal-avail {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  font-size: .8rem;
  background: #fdf3e3;
  color: #92500a;
  border: 1px solid #f0d9b0;
  padding: .1rem .55rem;
  border-radius: 999px;
  font-weight: 700;
}
.stdem-fest .fest-menu-modal-desc { margin: 0; color: #55606e; line-height: 1.55; }
.stdem-fest .fest-menu-modal-sens {
  margin: 0 0 .6rem;
  font-size: .86rem;
  color: #9d2918;
  font-weight: 700;
}

/* ---- Vendors / marketplace ---- */
.stdem-fest .fest-vendors-intro {
  margin: 0 0 1.2rem;
  color: #4a5462;
  max-width: 60ch;
}
.stdem-fest .fest-vendor-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: .85rem;
}
.stdem-fest .fest-vendor-card {
  display: flex;
  align-items: flex-start;
  gap: .9rem;
  height: 100%;
  padding: 1rem 1.05rem;
  background: #fff;
  border: 1px solid var(--fest-line);
  border-left: 5px solid var(--fest-blue);
  border-radius: 12px;
  color: inherit;
  text-decoration: none;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.stdem-fest .fest-vendor-card.is-linked:hover,
.stdem-fest .fest-vendor-card.is-linked:focus-visible {
  transform: translateY(-3px);
  box-shadow: var(--fest-shadow);
  border-left-color: var(--fest-gold);
}
.stdem-fest .fest-vendor-cat-crafts  .fest-vendor-card { border-left-color: #c2913a; }
.stdem-fest .fest-vendor-cat-jewelry .fest-vendor-card { border-left-color: #7b4fd0; }
.stdem-fest .fest-vendor-cat-art     .fest-vendor-card { border-left-color: #d1477a; }
.stdem-fest .fest-vendor-cat-food    .fest-vendor-card { border-left-color: #c34a4a; }
.stdem-fest .fest-vendor-cat-culture .fest-vendor-card { border-left-color: #2f8f6b; }
.stdem-fest .fest-vendor-cat-kids    .fest-vendor-card { border-left-color: #e08a2b; }
.stdem-fest .fest-vendor-media {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--fest-sky);
  border: 1px solid var(--fest-line);
}
.stdem-fest .fest-vendor-logo { width: 100%; height: 100%; object-fit: cover; }
.stdem-fest .fest-vendor-initial {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--fest-navy);
  line-height: 1;
}
.stdem-fest .fest-vendor-text { display: block; min-width: 0; }
.stdem-fest .fest-vendor-name {
  display: block;
  font-weight: 800;
  color: var(--fest-navy);
  font-size: 1.05rem;
  line-height: 1.3;
}
.stdem-fest .fest-vendor-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: .35rem 0 .1rem;
}
.stdem-fest .fest-vendor-days {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  font-size: .78rem;
  background: #fdf3e3;
  color: #92500a;
  border: 1px solid #f0d9b0;
  padding: .1rem .55rem;
  border-radius: 999px;
  font-weight: 700;
}
.stdem-fest .fest-vendor-desc {
  display: block;
  margin-top: .3rem;
  font-size: .93rem;
  color: #55606e;
  line-height: 1.5;
}
.stdem-fest .fest-vendor-note {
  margin-top: 1.1rem;
  font-size: .92rem;
  color: #55606e;
}

/* ---- Signups ---- */
.stdem-fest .fest-signup-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: .9rem;
  margin-top: 1rem;
}
.stdem-fest .fest-signup-card {
  display: block;
  text-decoration: none;
  background: var(--fest-sky);
  border: 1px solid var(--fest-line);
  border-radius: 14px;
  padding: 1.2rem 1.25rem;
  color: var(--fest-navy);
  transition: transform .12s ease, box-shadow .12s ease;
}
.stdem-fest .fest-signup-card:hover { transform: translateY(-3px); box-shadow: var(--fest-shadow); }
.stdem-fest .fest-signup-icon { font-size: 1.8rem; display: block; }
.stdem-fest .fest-signup-label { display: block; font-weight: 800; font-size: 1.1rem; margin: .3rem 0 .2rem; }
.stdem-fest .fest-signup-sub { display: block; color: #52606f; font-size: .92rem; }

/* ---- Map ---- */
.stdem-fest .fest-map-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--fest-shadow);
  border: 1px solid var(--fest-line);
}
.stdem-fest .fest-map-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.stdem-fest .fest-address { text-align: center; font-weight: 600; color: var(--fest-navy); margin-top: .9rem; }

/* ============================ RESPONSIVE ============================ */
@media (min-width: 720px) {
  .stdem-fest-hours { grid-template-columns: repeat(3, 1fr); }
  .stdem-fest-hours .fest-hours-card { flex-direction: row; justify-content: space-between; gap: .8rem; }
  .stdem-fest .fest-event { grid-template-columns: 10rem minmax(0, 1fr); align-items: start; }
  .stdem-fest .fest-signup-row { grid-template-columns: 1fr 1fr; }
  .stdem-fest .fest-vendor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1040px) {
  .stdem-fest .fest-vendor-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 820px) {
  .stdem-fest .fest-hero-inner {
    grid-template-columns: 1.3fr .7fr;
    align-items: center;
    gap: 2rem;
    padding: 3.2rem 3rem 3.4rem;
  }
  .stdem-fest .fest-hero-copy { text-align: left; }
  .stdem-fest .fest-tagline,
  .stdem-fest .fest-intro { margin-left: 0; }
  .stdem-fest .fest-cta-row { justify-content: flex-start; }
  .stdem-fest .fest-hero-art { display: flex; align-items: center; justify-content: center; color: #fff; }
  .stdem-fest .fest-dome { width: min(100%, 250px); opacity: .92; filter: drop-shadow(0 8px 22px rgba(0, 0, 0, .3)); }
  /* Media hero has no dome — keep the copy single-column & centered */
  .stdem-fest .stdem-fest-hero--media .fest-hero-inner { grid-template-columns: 1fr; padding: 3.4rem 3rem 3.6rem; }
  .stdem-fest .stdem-fest-hero--media .fest-hero-copy { text-align: center; }
  .stdem-fest .stdem-fest-hero--media .fest-tagline,
  .stdem-fest .stdem-fest-hero--media .fest-intro { margin-left: auto; margin-right: auto; }
  .stdem-fest .stdem-fest-hero--media .fest-cta-row { justify-content: center; }
}

@media (max-width: 767px) {
  /* Use the mobile focal point (falls back to desktop, then centered). */
  .stdem-fest .fest-hero-slide { background-position: var(--focal-m, var(--focal-d, 50% 50%)); }
  .stdem-fest .fest-hero-video { object-position: var(--focal-m, var(--focal-d, 50% 50%)); }
}

@media (max-width: 640px) {
  .stdem-fest .fest-hero-arrow { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .stdem-fest .fest-btn,
  .stdem-fest .fest-signup-card,
  .stdem-fest .fest-vendor-card,
  .stdem-fest .fest-hero-slide { transition: none; }
}