/*
  El NONO Pizzería — promos.css
  Ajustes de pages/promos.html sobre el componente .promo-board.
*/

.promos-intro {
  max-width: 70ch;
}

/* Flyers de las promos (material del cliente, 2026-10) */
.promo-flyers {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--space-6);
}

.promo-flyer {
  display: grid;
  grid-template-rows: auto 1fr;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(242, 203, 5, 0.18);
  border-radius: 14px;
  overflow: hidden;
}

.promo-flyer-media { display: block; overflow: hidden; }
.promo-flyer-media img { display: block; width: 100%; height: auto; aspect-ratio: 9 / 16; object-fit: cover; transition: transform .5s var(--ease-premium); }
.promo-flyer-media:hover img,
.promo-flyer-media:focus-visible img { transform: scale(1.03); }

.promo-flyer-body {
  display: grid;
  gap: var(--space-2);
  align-content: start;
  padding: var(--space-5);
}

.promo-flyer-body .promo-desc strong { color: var(--color-gold); }
.promo-flyer-body .btn { margin-top: var(--space-2); justify-self: start; }

.promo-flyers + .promo-list { margin-top: var(--space-8); }

.promo-terms {
  margin-top: var(--space-8);
  display: grid;
  gap: var(--space-3);
  color: rgba(255, 255, 255, 0.6);
  font-size: var(--fs-small);
  max-width: 62ch;
}

.promo-terms li { padding-left: 1.2em; position: relative; }
.promo-terms li::before { content: "—"; position: absolute; left: 0; color: var(--color-gold); }