/* =========================================================
   Nasz stadion — mapa na zielonym boisku
   Wgraj do: assets/css/pitch.css
   ========================================================= */
.pitch{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-l);
  padding:clamp(28px,6vw,64px) clamp(14px,4vw,40px) clamp(28px,5vw,48px);
  display:flex; flex-direction:column; align-items:center; gap:28px;
  box-shadow:var(--shadow-pop);
  background:
    radial-gradient(560px 220px at 10% 0%, rgba(255,255,255,.18), transparent 70%),   /* reflektory */
    radial-gradient(560px 220px at 90% 0%, rgba(255,255,255,.18), transparent 70%),
    radial-gradient(120% 100% at 50% 50%, transparent 55%, rgba(0,0,0,.3) 100%),      /* winieta */
    repeating-linear-gradient(90deg, #2e7d32 0, #2e7d32 8.333%, #3a923e 8.333%, #3a923e 16.666%); /* pasy koszenia */
}

.pitch-lines{position:absolute; inset:0; width:100%; height:100%; pointer-events:none;}
.pitch-lines .ln{
  fill:none;
  stroke:rgba(255,255,255,.88);
  stroke-width:3;
  stroke-dasharray:1;
  stroke-dashoffset:1;                       /* linie "rysują się" po pojawieniu w widoku */
  transition:stroke-dashoffset 2.4s ease .2s;
}
.pitch-lines .dot{fill:rgba(255,255,255,.9); stroke:none;}
.pitch.is-visible .ln{stroke-dashoffset:0;}

/* przy wyłączonych animacjach linie są od razu widoczne */
@media (prefers-reduced-motion: reduce){
  .pitch-lines .ln{stroke-dashoffset:0; transition:none;}
}

.pitch .location-map{
  position:relative;
  width:100%;
  max-width:740px;
  min-height:clamp(300px,42vw,400px);
  border:5px solid #fff;
  border-radius:var(--radius-m);
}
.pitch .location-btn{position:relative; margin:0; align-self:center;}