/* DELIVER45 homepage promo popup (2026-11-05). Markup: inc/promo-popup.php. */
.pp-promo[hidden] { display: none; }
.pp-promo {
  position: fixed; inset: 0; z-index: 100000;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.pp-promo__backdrop { position: absolute; inset: 0; background: rgba(20, 25, 21, 0.74); }
.pp-promo__dialog {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 14px;
  outline: none; animation: pp-promo-in 0.25s ease-out;
}
.pp-promo__picture, .pp-promo__img { display: block; }
/* Desktop/tablet: 3:2 graphic, capped by width and by viewport height. */
.pp-promo__img {
  width: min(800px, 92vw, calc((100vh - 110px) * 1.5));
  width: min(800px, 92vw, calc((100dvh - 110px) * 1.5));
  height: auto; border-radius: 12px; box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}
.pp-promo__close {
  position: absolute; top: -14px; right: -14px; z-index: 2;
  width: 42px; height: 42px; border-radius: 50%;
  border: 2px solid #FFFBE6; background: #2D5441; color: #FFFBE6;
  font-size: 26px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center; padding: 0;
}
.pp-promo__close:hover { background: #F7B51C; color: #2D5441; }
.pp-promo__shop {
  display: inline-block; background: #F7B51C; color: #2D5441;
  font-weight: 700; font-size: 16px; letter-spacing: 0.02em;
  padding: 14px 40px; border-radius: 6px; text-decoration: none;
}
.pp-promo__shop:hover { background: #FFFBE6; color: #2D5441; }
.pp-promo__close:focus-visible, .pp-promo__shop:focus-visible { outline: 2px solid #F7B51C; outline-offset: 3px; }
body.pp-promo-open { overflow: hidden; }
/* Phone: 4:5 graphic. */
@media (max-width: 600px) {
  .pp-promo__img {
    width: min(92vw, calc((100vh - 110px) * 0.8));
    width: min(92vw, calc((100dvh - 110px) * 0.8));
  }
  .pp-promo__close { top: -12px; right: -8px; width: 40px; height: 40px; }
}
@keyframes pp-promo-in { from { opacity: 0; transform: translateY(12px) scale(0.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pp-promo__dialog { animation: none; } }