/* ==========================================================
   Homepage previews — short versions of the full pages
   (sections/home/*.html). Reuses the full sections' styles
   (about.css, entertainment.css, events.css, food-truck.css)
   and only adds what the previews need.
   ========================================================== */

/* Entertainment preview: 3 highlight cards instead of 4 */
.features--3 { grid-template-columns: repeat(3, 1fr); }

/* ---------- Food truck preview ---------- */
.food-preview-grid {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2.5rem, 6vw, 5rem); align-items: center;
}
.food-preview-photos {
  position: relative; display: grid; grid-template-columns: 1.15fr 1fr; gap: 1rem; align-items: start;
}
.food-preview-photos .food-photo:first-child { aspect-ratio: 4 / 5; }
.food-preview-photos .food-photo:last-child { aspect-ratio: 4 / 5; margin-top: 3.5rem; }
.food-preview-photos::before {
  content: ""; position: absolute; inset: 10% 5%; z-index: 0; pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(242,138,30,.22), transparent 70%);
  filter: blur(20px);
}
.food-preview-photos .food-photo {
  position: relative; z-index: 1;
  box-shadow: 0 30px 60px -30px rgba(0,0,0,.9);
}
.food-preview-photos .food-photo img { display: block; }
/* Menu is taller than the 4:5 frame — show it whole rather than crop off prices */
.food-preview-photos .food-photo--menu { background: #0a0a0a; } /* matches the menu's own black so the side margins read as part of it */
.food-preview-photos .food-photo--menu img { object-fit: contain; }
/* Truck photo is 1024×1536 (2:3) — size its frame to match so it shows whole, uncropped */
.food-preview-photos .food-photo:last-child:not(.is-placeholder) { aspect-ratio: 2 / 3; }
.food-preview-photos .food-photo.is-placeholder {
  background: linear-gradient(150deg, #231c18 0%, #3b2a1d 100%);
  border: 1px solid rgba(242,138,30,.35);
}
.food-preview-copy p { margin: 0 0 1.1rem; }
.food-preview-copy .lede { margin-bottom: 1.1rem; }
.food-preview-copy .food-preview-hours p { margin: 0; }
.food-preview-copy .btn-row { margin-top: 1.8rem; }

@media (max-width: 900px) {
  .features--3 { grid-template-columns: 1fr; max-width: 520px; margin-left: auto; margin-right: auto; }
  .food-preview-grid { grid-template-columns: 1fr; }
  .food-preview-photos { max-width: 520px; }
}
@media (max-width: 600px) {
  .section-foot .btn, .food-preview-copy .btn { width: 100%; }
}