/* PG Motion Reels PRO 1.0.1 - scoped styles only, no generic .card/.cards classes */
.pgmrp-section {
  color: #e8dfd3;
  text-align: center;
  padding: 90px 20px 105px;
  overflow: hidden;
  position: relative;
}
.pgmrp-section h2 {
  font-family: 'Lora', serif;
  font-style: italic;
  font-weight: 400;
  color: #000;
  font-size: clamp(48px, 7vw, 90px);
  line-height: 1.1;
  margin: 0 0 60px;
}
.pgmrp-carousel {
  position: relative;
  height: 530px;
  max-width: 1100px;
  margin: 0 auto;
  perspective: 1400px;
  overflow: visible;
}
.pgmrp-cards {
  position: relative;
  height: 100%;
  transform-style: preserve-3d;
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
}
.pgmrp-cards.dragging { cursor: grabbing; }
.pgmrp-card {
  position: absolute;
  top: 0;
  left: 50%;
  width: 330px;
  height: 460px;
  margin-left: -165px;
  border-radius: 28px;
  overflow: hidden;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(232,223,211,.28);
  box-shadow: 0 30px 90px rgba(0,0,0,.55);
  transition: transform .75s cubic-bezier(.22,1,.36,1), opacity .75s, filter .75s;
  will-change: transform, opacity, filter;
  transform-origin: center center;
}
.pgmrp-card video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #000;
  display: block;
}
.pgmrp-card:not(.active) video { pointer-events: none; }
.pgmrp-card.active { opacity: 1; filter: blur(0); z-index: 10; }
.pgmrp-card.side { opacity: .68; filter: blur(.4px); z-index: 6; }
.pgmrp-card.back { opacity: .25; filter: blur(1.5px); z-index: 2; }
.pgmrp-btn {
  position: absolute;
  top: 44%;
  z-index: 30;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(232,223,211,.35);
  background: rgba(255,255,255,.06);
  color: #e8dfd3;
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
  padding: 0;
}
.pgmrp-prev { left: 4%; }
.pgmrp-next { right: 4%; }
@media (max-width: 767px) {
  .pgmrp-section { padding: 70px 10px 80px; }
  .pgmrp-carousel { height: 430px; }
  .pgmrp-card { width: 245px; height: 345px; margin-left: -122.5px; }
  .pgmrp-btn { display: none; }
}

/* DEV iOS/Safari fixes: active reel must stay bright, no native control overlay/dimming */
.pgmrp-card.active,
.pgmrp-card.active video {
  opacity: 1 !important;
  filter: none !important;
  -webkit-filter: none !important;
}
.pgmrp-card.active::before,
.pgmrp-card.active::after,
.pgmrp-card video::-webkit-media-controls,
.pgmrp-card video::-webkit-media-controls-enclosure,
.pgmrp-card video::-webkit-media-controls-panel {
  opacity: 0 !important;
  display: none !important;
}
@media (max-width: 767px) {
  .pgmrp-card.active { opacity: 1 !important; filter: none !important; -webkit-filter: none !important; }
  .pgmrp-card.active video { opacity: 1 !important; filter: none !important; -webkit-filter: none !important; }
  .pgmrp-card.side { opacity: .72; }
  .pgmrp-card.back { opacity: .28; }
}

/* 1.0.12: fallback dla Reels, dla których Meta nie zwraca media_url */
.pgmrp-card .pgmrp-instagram-embed {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
  display: block;
}
.pgmrp-card:not(.active) .pgmrp-instagram-embed { pointer-events: none; }
