/* ==========================================================================
   Strona produktu karty piłkarza - nowy układ (product/karty-v2, paczka karty-v2). Wzór: sbc-produkt.css.
   Podsumowanie, pasek i opinie z packet-v2.css (klasy pv2-*), partiale wspólne z SBC v2 w product/v2-wspolne.
   Kolory: zieleń morska z hero kategorii kart (#2dd4bf, #5eead4, #0f2d2b), granat jak SBC. Prefiks kv2p-.
   Telefon: jedna kolumna (< 1024 px), jak packet-v2.
   ========================================================================== */
.kv2p {
  --kv2p-panel: #0d131c;
  --kv2p-morski: #2dd4bf;
  --kv2p-morski-jasny: #5eead4;
  --kv2p-morski-ciemny: #0f2d2b;
  --kv2p-zloty: #f5a623;
}

/* ---------- Lewa karta ---------- */
.kv2p-karta {
  position: relative; overflow: hidden; isolation: isolate; border-radius: 20px; color: #c9d0da; min-width: 0;
  padding: 26px 28px 18px; display: flex; flex-direction: column; gap: 18px; box-shadow: 0 16px 34px rgba(13, 16, 23, 0.22);
  background:
    radial-gradient(34% 15% at 18% 64%, rgba(45, 212, 191, 0.5) 0%, rgba(45, 212, 191, 0.12) 55%, rgba(45, 212, 191, 0) 78%),
    radial-gradient(55% 60% at 12% 0%, rgba(94, 234, 212, 0.26) 0%, rgba(45, 212, 191, 0.07) 48%, rgba(45, 212, 191, 0) 72%),
    linear-gradient(100deg, #0f2d2b 0%, #0e2229 30%, var(--kv2p-panel) 62%, #0a0f17 100%);
}
/* reflektor z lewej góry: snop światła nad podium */
.kv2p-karta::before {
  content: ''; position: absolute; z-index: -1; pointer-events: none; left: 2%; top: -4%; width: 36%; height: 72%;
  background: linear-gradient(180deg, rgba(153, 246, 228, 0.2) 0%, rgba(94, 234, 212, 0.06) 60%, rgba(94, 234, 212, 0) 100%);
  clip-path: polygon(40% 0, 60% 0, 100% 100%, 0 100%); filter: blur(8px);
}
/* opcjonalne tło z grafiki (ustawienie players_produkt_tlo) + ciemny gradient od prawej pod tekst */
.kv2p-tlo {
  position: absolute; inset: 0; z-index: -1; background-color: var(--kv2p-panel); background-repeat: no-repeat;
  background-size: cover; background-position: left bottom;
}
.kv2p-tlo::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(270deg, rgba(13, 19, 28, 0.97) 0%, rgba(13, 19, 28, 0.9) 40%, rgba(13, 19, 28, 0.45) 66%, rgba(13, 19, 28, 0) 84%);
}
.kv2p-gora {
  display: grid; grid-template-columns: 200px minmax(0, 1fr); grid-template-areas: "podium info" "podium zdanie";
  column-gap: 26px; row-gap: 10px; align-items: end; min-height: 262px;
}
.kv2p-podium { grid-area: podium; align-self: end; position: relative; display: flex; justify-content: center; padding-bottom: 14px; }
/* świecące podium pod kartą */
.kv2p-podium::before {
  content: ''; position: absolute; left: 4%; right: 4%; bottom: 0; height: 26px; border-radius: 50%; z-index: 0;
  background: radial-gradient(50% 50% at 50% 50%, rgba(94, 234, 212, 0.75) 0%, rgba(45, 212, 191, 0.3) 45%, rgba(45, 212, 191, 0) 72%);
  box-shadow: 0 0 34px rgba(45, 212, 191, 0.35);
}
.kv2p-podium::after {
  content: ''; position: absolute; left: 14%; right: 14%; bottom: 8px; height: 10px; border-radius: 50%; z-index: 0;
  border: 1.5px solid rgba(153, 246, 228, 0.55);
}
.kv2p-unos { position: relative; z-index: 1; display: block; width: 176px; animation: kv2p-unos 4.8s ease-in-out infinite; }
.kv2p-obraz {
  position: relative; display: block; overflow: hidden; border-radius: 6px;
  filter: drop-shadow(0 0 20px rgba(45, 212, 191, 0.45)) drop-shadow(0 14px 16px rgba(0, 0, 0, 0.55));
}
.kv2p .kv2p-obraz img { display: block; width: 100%; height: auto; aspect-ratio: 600 / 838; object-fit: contain; max-width: none; }
/* błysk przesuwający się po karcie (pasek światła, tylko nad kartą) */
.kv2p-blysk {
  position: absolute; inset: 0; pointer-events: none; mix-blend-mode: soft-light;
  background: linear-gradient(105deg, rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, 0.85) 50%, rgba(255, 255, 255, 0) 62%);
  transform: translateX(-130%); animation: kv2p-blysk 6.5s ease-in-out 1.2s infinite;
  -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
}
@keyframes kv2p-unos { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes kv2p-blysk { 0%, 62% { transform: translateX(-130%); } 88%, 100% { transform: translateX(130%); } }
@media (prefers-reduced-motion: reduce) {
  .kv2p-unos, .kv2p-blysk { animation: none; }
  .kv2p-blysk { display: none; }
}
.kv2p-info { grid-area: info; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pv2 .kv2p-zdanie { grid-area: zdanie; align-self: start; margin: 0 0 6px; font-size: 15px; line-height: 1.5; color: #aeb6c3; max-width: 520px; }

/* chipy */
.kv2p-chipy { display: flex; flex-wrap: wrap; gap: 6px; }
.kv2p-chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 700;
  line-height: 1.3; color: #e9edf2; background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.14); white-space: nowrap;
}
.kv2p-chip svg { color: var(--kv2p-morski); flex: none; }
.kv2p-flaga { display: block; width: 16px; height: auto; border-radius: 2px; flex: none; }
.kv2p-chip--wersja { color: #99f6e4; background: rgba(45, 212, 191, 0.14); border-color: rgba(45, 212, 191, 0.5); }
.kv2p-chip--holo { color: #fff; border-color: transparent; background: linear-gradient(135deg, #06b6d4 0%, #7c3aed 50%, #ec4899 100%); }
.kv2p-chip--meta { color: #ffe1a3; background: rgba(245, 166, 35, 0.15); border-color: rgba(245, 166, 35, 0.55); }
.kv2p-chip--druzyna { color: #c9fbf0; border-color: rgba(94, 234, 212, 0.4); }
.kv2p-chip--druzyna.is-nowa { color: #0b1a1a; background: var(--kv2p-morski-jasny); border-color: var(--kv2p-morski-jasny); }
.kv2p-chip--cena { font-variant-numeric: tabular-nums; color: #c9d0da; }

.kv2p-ea { font-size: 12.5px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; color: var(--kv2p-morski-jasny); margin-top: 4px; }
.pv2 .kv2p-h1 {
  margin: 0; font-family: var(--pv2-cond); font-weight: 800; font-size: 50px; line-height: 0.98; color: #fff;
  text-transform: none; letter-spacing: 0; text-align: left; overflow-wrap: anywhere;
}
.kv2p-podpis { font-size: 14px; font-weight: 600; color: #c9d0da; }

/* przełącznik platformy (product/v2-wspolne/platformy) */
.kv2p-platformy { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.kv2p-plat {
  position: relative; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; min-width: 0;
  background: rgba(255, 255, 255, 0.05); border: 1.5px solid rgba(255, 255, 255, 0.14); color: #e9edf2; text-decoration: none;
  transition: border-color 0.15s, background 0.15s;
}
.pv2 a.kv2p-plat { color: #e9edf2; text-decoration: none; }
.pv2 a.kv2p-plat:hover { border-color: rgba(94, 234, 212, 0.6); background: rgba(45, 212, 191, 0.08); color: #fff; }
.kv2p-plat-ikona { width: 40px; height: 40px; flex: none; border-radius: 11px; background: rgba(255, 255, 255, 0.08); display: flex; align-items: center; justify-content: center; }
.kv2p-plat-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.kv2p-plat-txt b { font-family: var(--pv2-cond); font-weight: 800; font-size: 20px; line-height: 1.05; color: #fff; }
.kv2p-plat-txt span { font-family: var(--pv2-cond); font-weight: 700; font-size: 16px; color: var(--pv2-zloty-jasny); white-space: nowrap; }
.kv2p-plat.is-on { border-color: var(--kv2p-morski); background: rgba(45, 212, 191, 0.1); box-shadow: 0 0 0 1px var(--kv2p-morski) inset; }
.kv2p-plat.is-on .kv2p-plat-ikona { background: rgba(45, 212, 191, 0.18); color: var(--kv2p-morski-jasny); }
.kv2p-plat.is-on .pv2-ptaszek { display: flex; top: 50%; right: 12px; transform: translateY(-50%); width: 22px; height: 22px; background: var(--kv2p-morski); color: #0b1a1a; }
.kv2p-plat.is-off { opacity: 0.5; cursor: not-allowed; }
.kv2p-plat.is-off .kv2p-plat-txt span { color: #9aa3b2; font-family: inherit; font-weight: 600; font-size: 12.5px; }

/* kafelki (product/v2-wspolne/kafle) */
.kv2p-kafle { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.kv2p-kafel { background: rgba(10, 14, 22, 0.78); border: 1px solid #22343a; border-radius: 14px; padding: 10px 13px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kv2p-kafel strong { font-family: var(--pv2-cond); font-weight: 800; font-size: 25px; line-height: 1.05; color: var(--kv2p-morski-jasny); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kv2p-kafel span { font-size: 12.5px; font-weight: 600; color: #9aa3b2; line-height: 1.3; }
.kv2p .pv2-sprzedawca { margin-top: 2px; }

/* ---------- Podsumowanie (product/v2-wspolne/podsumowanie) ---------- */
.kv2p .pv2-bilet { background: var(--kv2p-panel); }
.kv2p .pv2-bilet-gora { background: radial-gradient(120% 120% at 100% 0%, var(--kv2p-morski-ciemny) 0%, var(--kv2p-panel) 62%); }
.kv2p-otrz { display: flex; align-items: center; gap: 12px; min-width: 0; }
.kv2p-mini { display: block; width: 54px; flex: none; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.5)); }
.kv2p .kv2p-mini img { display: block; width: 100%; height: auto; aspect-ratio: 160 / 223; object-fit: contain; max-width: none; }
.kv2p-otrz-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kv2p-otrz-txt b { font-family: var(--pv2-cond); font-weight: 800; font-size: 26px; line-height: 1.05; color: #fff; overflow-wrap: anywhere; }
.kv2p-otrz-txt span { font-size: 12.5px; color: #9aa3b2; }
.kv2p .pv2-zaplata { margin-top: 14px; }
.kv2p .pv2-zaplata-lbl { padding-bottom: 36px; }
.kv2p-przygotuj { margin: 0 22px 14px; text-align: center; font-size: 12.5px; }
.pv2 .kv2p-przygotuj a { color: var(--pv2-zloty-jasny); font-weight: 700; }

/* ---------- Sekcje pod górą ---------- */
.kv2p-sekcja {
  background: #fff; border: 1px solid #e6e9ef; border-radius: 18px; padding: 20px 22px 22px; box-shadow: 0 6px 18px rgba(13, 16, 23, 0.05);
  display: flex; flex-direction: column; gap: 14px;
}
.kv2p-sekcja .pv2-h2 { margin: 0; font-size: 28px; }
.kv2p-staty-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.pv2 .kv2p-paski { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.kv2p-pasek { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "nazwa liczba" "tor tor"; column-gap: 10px; row-gap: 5px; align-items: baseline; }
.kv2p-pasek-nazwa { grid-area: nazwa; font-size: 14px; font-weight: 600; color: #3b4555; }
.kv2p-pasek-liczba { grid-area: liczba; font-family: var(--pv2-cond); font-weight: 800; font-size: 22px; line-height: 1; color: var(--pv2-tekst); font-variant-numeric: tabular-nums; }
.kv2p-pasek-tor { grid-area: tor; height: 8px; border-radius: 999px; background: #edf0f4; overflow: hidden; }
.kv2p-pasek-tor span { display: block; height: 100%; border-radius: inherit; }
/* kolory jak statystyki na liście kart (playerlist.css: stat-90 / 80 / 70 / low) */
.kv2p-pasek--90 .kv2p-pasek-tor span { background: #16a34a; }
.kv2p-pasek--80 .kv2p-pasek-tor span { background: #22c55e; }
.kv2p-pasek--70 .kv2p-pasek-tor span { background: #eab308; }
.kv2p-pasek--low .kv2p-pasek-tor span { background: #dc2626; }
.kv2p-pasek--90 .kv2p-pasek-liczba { color: #15803d; }
.kv2p-pasek--low .kv2p-pasek-liczba { color: #b91c1c; }
.kv2p-dane { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.kv2p-dana { background: #f4fbfa; border: 1px solid #d5efe9; border-radius: 12px; padding: 9px 12px; min-width: 0; }
.pv2 .kv2p-dana dt { float: none; width: auto; margin: 0; text-align: left; font-size: 12px; font-weight: 600; color: #5b6576; }
.pv2 .kv2p-dana dd { margin: 2px 0 0; font-family: var(--pv2-cond); font-weight: 800; font-size: 20px; line-height: 1.1; color: var(--pv2-tekst); overflow-wrap: anywhere; }

/* "Inne karty [wersja]" */
.kv2p-dol { padding-top: 0; }
.kv2p-inne-lista { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.pv2 a.kv2p-inna {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; text-decoration: none; color: var(--pv2-tekst);
  background: linear-gradient(100deg, #0f2d2b 0%, var(--kv2p-panel) 70%); border: 1px solid #1d3a3a; min-width: 0;
  transition: transform 0.15s, border-color 0.15s;
}
.pv2 a.kv2p-inna:hover { border-color: var(--kv2p-morski); transform: translateY(-2px); color: var(--pv2-tekst); }
.kv2p-inna-obraz { display: block; width: 52px; flex: none; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.5)); }
.kv2p .kv2p-inna-obraz img { display: block; width: 100%; height: auto; aspect-ratio: 160 / 223; object-fit: contain; max-width: none; }
.kv2p-inna-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.kv2p-inna-txt b { font-family: var(--pv2-cond); font-weight: 800; font-size: 19px; line-height: 1.05; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kv2p-inna-txt span { font-size: 12px; font-weight: 600; color: #9aa3b2; }
.kv2p-inna-txt strong { font-family: var(--pv2-cond); font-weight: 800; font-size: 18px; color: var(--pv2-zloty-jasny); white-space: nowrap; }

/* ---------- Opis produktu w karcie (jak opis SBC v2; ramka "Dobrze wiedzieć" w zieleni kart) ---------- */
.kv2p-opis {
  box-sizing: border-box; background: #fff; border: 1px solid #e6e9ef; border-radius: 18px; padding: 16px 16px 14px; margin: 10px 0 0;
  font-family: Barlow, Arial, Helvetica, sans-serif; color: #3b4555; line-height: 1.55; box-shadow: 0 6px 18px rgba(13, 16, 23, 0.05); text-align: left;
}
.formatarticle .kv2p-opis h2, .formatarticle .kv2p-opis h3 {
  margin: 0 0 8px; padding: 0; font-family: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif; font-weight: 800; font-size: 22px;
  line-height: 1.1; color: #1a2230; text-transform: none; text-align: left; letter-spacing: 0; border: 0; background: none;
}
.formatarticle .kv2p-opis h3 + h3, .formatarticle .kv2p-opis p + h2, .formatarticle .kv2p-opis p + h3, .formatarticle .kv2p-opis ul + h3 { margin-top: 14px; }
/* all.css: .formatarticle p { margin: 10px 0 !important } i #main .content article p { line-height: 20px } */
.formatarticle .kv2p-opis p { margin: 0 0 10px !important; font-size: 14.5px; line-height: 1.55 !important; color: #3b4555; text-align: left; }
.formatarticle .kv2p-opis ul { margin: 0 0 10px; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; }
.formatarticle .kv2p-opis li { position: relative; margin: 0; padding: 0 0 0 16px; font-size: 14px; line-height: 1.5; color: #3b4555; background: none; }
.formatarticle .kv2p-opis li::before { content: ''; position: absolute; left: 2px; top: 0.6em; width: 7px; height: 7px; border-radius: 50%; background: var(--kv2p-morski, #2dd4bf); }
.formatarticle .kv2p-opis strong { color: #1a2230; }
.formatarticle .kv2p-opis > :first-child { margin-top: 0 !important; }
.formatarticle .kv2p-opis > :last-child { margin-bottom: 0 !important; }
.formatarticle .kv2p-opis .kv2-wiedz, .formatarticle .kv2p-opis .dobrze-wiedziec {
  margin: 0; padding: 10px 12px; border-radius: 12px; background: #ecfdf8; border: 1px solid #b6ece0; font-size: 13.5px; line-height: 1.5; color: #3b4555;
}
.formatarticle .kv2p-opis .kv2-wiedz strong, .formatarticle .kv2p-opis .dobrze-wiedziec strong { color: #0f766e; }

/* ---------- Telefon i tablet ---------- */
@media (max-width: 1023px) {
  .kv2p-karta { padding: 16px 16px 14px; gap: 14px; border-radius: 18px; }
  .kv2p-karta::before { width: 46%; }
  .kv2p-tlo { background-position: 12% bottom; }
  .kv2p-tlo::after { background: linear-gradient(270deg, rgba(13, 19, 28, 0.95) 0%, rgba(13, 19, 28, 0.82) 45%, rgba(13, 19, 28, 0.35) 75%, rgba(13, 19, 28, 0.15) 100%); }
  .kv2p-gora { grid-template-columns: 112px minmax(0, 1fr); grid-template-areas: "podium info" "zdanie zdanie"; column-gap: 14px; row-gap: 12px; align-items: center; min-height: 0; }
  .kv2p-podium { align-self: center; padding-bottom: 10px; }
  .kv2p-podium::before { height: 18px; }
  .kv2p-podium::after { bottom: 5px; height: 7px; }
  .kv2p-unos { width: 104px; }
  .pv2 .kv2p-zdanie { margin: 0; font-size: 13.5px; }
  .kv2p-info { gap: 5px; }
  .kv2p-chip { font-size: 11px; padding: 3px 8px; }
  .kv2p-ea { font-size: 11px; margin-top: 2px; }
  .pv2 .kv2p-h1 { font-size: 32px; }
  .kv2p-podpis { font-size: 12.5px; }
  .kv2p-plat { padding: 10px 11px; gap: 9px; }
  .kv2p-plat-ikona { width: 34px; height: 34px; border-radius: 10px; }
  .kv2p-plat-txt b { font-size: 18px; }
  .kv2p-plat-txt span { font-size: 15px; }
  .kv2p-plat.is-on .pv2-ptaszek { top: 8px; right: 8px; transform: none; width: 18px; height: 18px; }
  .kv2p-kafle { gap: 8px; }
  .kv2p-kafel { padding: 9px 10px; }
  .kv2p-kafel strong { font-size: 20px; }
  .kv2p-kafel span { font-size: 11.5px; }
  .kv2p-sekcja { padding: 16px 14px 16px; border-radius: 16px; }
  .kv2p-sekcja .pv2-h2 { font-size: 24px; }
  .kv2p-staty-in { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .kv2p-inne-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
@media (max-width: 560px) {
  .kv2p-inne-lista { grid-template-columns: minmax(0, 1fr); }
  .formatarticle .kv2p-opis ul { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 420px) {
  .pv2 .kv2p-h1 { font-size: 28px; }
}
@media (max-width: 360px) {
  .kv2p-gora { grid-template-columns: 92px minmax(0, 1fr); }
  .kv2p-unos { width: 88px; }
  .kv2p-kafel strong { font-size: 18px; }
}