/* KGW: Styl wyskakującego okienka – v1.2 (z konkursem + zdjęciem) */
.kgw-pop-mask {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.4);
  backdrop-filter: blur(2px);
  display: grid;
  place-items: center;
  z-index: 9999;
  animation: kgw-fade-in .24s ease;
}

.kgw-pop-hide { animation: kgw-fade-out .24s ease forwards; }

.kgw-pop {
  position: relative;
  width: min(92vw, 620px);
  border-radius: 20px;
  background: linear-gradient(180deg,#ffffff,#fafafa);
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
  overflow: hidden;
  transform: translateY(8px) scale(.97);
  opacity: 0;
  animation: kgw-drop .42s cubic-bezier(.2,.8,.2,1) .08s forwards;
}

.kgw-pop-glow {
  position: absolute;
  inset: -40% -20% auto -20%;
  height: 60%;
  background: radial-gradient(60% 60% at 50% 50%, rgba(255,215,0,.35), rgba(255,215,0,0) 70%);
  filter: blur(20px);
  pointer-events: none;
}

.kgw-pop-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  border: none;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
  font-size: 26px;
  line-height: 40px;
  cursor: pointer;
  transition: transform .12s ease, background .2s ease;
}
.kgw-pop-close:hover { transform: scale(1.06); background: rgba(0,0,0,.12); }

.kgw-pop-content { padding: 38px 24px 26px; text-align: center; }

.kgw-pop-title {
  margin: 0 0 6px;
  font-size: clamp(22px, 4vw, 30px);
  line-height: 1.15;
}

.kgw-pop-sub {
  margin: 0 0 12px;
  font-size: clamp(16px, 2.4vw, 18px);
  color: #444;
}

.kgw-pop-contest {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 700;
  color: #1f2937;
}

.kgw-pop-figure {
  margin: 0 auto 14px;
  max-width: 560px;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(0,0,0,.10);
}
.kgw-pop-figure img {
  width: 100%;
  height: auto;
  display: block;
}

.kgw-pop-highlights {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: grid;
  gap: 8px;
}
.kgw-pop-highlight {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: linear-gradient(180deg, #fff, #fbfbfb);
  border: 1px solid #f0f0f0;
  box-shadow: 0 4px 12px rgba(0,0,0,.04);
}
.kgw-pop-highlight .hi-ico { font-size: 22px; line-height: 1; transform: translateY(-1px); }
.kgw-pop-highlight .hi-text { text-align: left; font-size: 14px; color: #222; }

.kgw-pop-cta {
  display: inline-block;
  padding: 12px 18px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 700;
  background: linear-gradient(135deg, #ffd700, #ff9f1a);
  box-shadow: 0 10px 20px rgba(255,165,0,.35);
  transition: transform .12s ease, box-shadow .2s ease, filter .2s ease;
}
.kgw-pop-cta:hover { transform: translateY(-1px); box-shadow: 0 12px 24px rgba(255,165,0,.45); filter: brightness(1.02); }

.kgw-pop-note { margin: 12px 0 0; font-size: 12px; color: #666; }

/* Konfetti (dekor) – czysto CSS */
.kgw-pop-confetti::before,
.kgw-pop-confetti::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 20%, rgba(255, 0, 102, .9) 0 3px, transparent 4px),
    radial-gradient(circle at 80% 30%, rgba(0, 180, 255, .9) 0 3px, transparent 4px),
    radial-gradient(circle at 30% 70%, rgba(0, 200, 140, .9) 0 3px, transparent 4px),
    radial-gradient(circle at 65% 80%, rgba(255, 200, 0, .9) 0 3px, transparent 4px),
    radial-gradient(circle at 50% 50%, rgba(180, 0, 255, .9) 0 3px, transparent 4px);
  animation: kgw-confetti 6s linear infinite;
  opacity: .7;
}

@keyframes kgw-fade-in { from { opacity: 0 } to { opacity: 1 } }
@keyframes kgw-fade-out { from { opacity: 1 } to { opacity: 0 } }
@keyframes kgw-drop { from { opacity: 0; transform: translateY(10px) scale(.95) } to { opacity: 1; transform: translateY(0) scale(1) } }
@keyframes kgw-confetti {
  0% { transform: translateY(-6%) rotate(0deg) }
  100% { transform: translateY(6%) rotate(1turn) }
}