/* ==========================================================
   ATOL BOWLING — neon dark theme v2 (React)
   ========================================================== */
:root{
  --bg-0:#05030f;
  --bg-1:#0b0620;
  --bg-2:#120a2e;
  --ink:#f6f3ff;
  --ink-dim:#b9b3d6;
  --pink:#ff2d95;
  --cyan:#00e5ff;
  --violet:#b44bff;
  --yellow:#ffe600;
  --green:#39ff14;
  --red:#ff3860;
  --glow-pink:0 0 6px #ff2d95, 0 0 18px #ff2d95, 0 0 38px rgba(255,45,149,.6);
  --glow-cyan:0 0 6px #00e5ff, 0 0 18px #00e5ff, 0 0 38px rgba(0,229,255,.55);
  --glow-yellow:0 0 6px #ffe600, 0 0 18px #ffe600, 0 0 38px rgba(255,230,0,.55);
  --glow-green:0 0 6px #39ff14, 0 0 18px #39ff14, 0 0 38px rgba(57,255,20,.55);
  --glow-violet:0 0 6px #b44bff, 0 0 18px #b44bff, 0 0 38px rgba(180,75,255,.55);
  --radius:18px;
  --maxw:1240px;
  --nav-h:88px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg-0);color:var(--ink);font-family:'Inter',system-ui,Segoe UI,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 10px)}
body{padding-top:var(--nav-h)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

body::before{
  content:"";position:fixed;inset:-20vmax;z-index:-3;
  background:
    radial-gradient(60vmax 60vmax at 15% 10%, rgba(255,45,149,.18), transparent 60%),
    radial-gradient(55vmax 55vmax at 85% 20%, rgba(0,229,255,.18), transparent 60%),
    radial-gradient(70vmax 70vmax at 50% 120%, rgba(180,75,255,.22), transparent 60%),
    linear-gradient(180deg,#05030f 0%, #0b0620 60%, #05030f 100%);
  filter:saturate(1.1);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background-image:
    linear-gradient(transparent 95%, rgba(255,255,255,.04) 95%),
    linear-gradient(90deg, transparent 95%, rgba(255,255,255,.04) 95%);
  background-size:38px 38px,38px 38px;
  mask-image:radial-gradient(ellipse at 50% 30%, black 40%, transparent 80%);
}

.sparkles{position:fixed;inset:0;z-index:-1;pointer-events:none}
.sparkles span{position:absolute;width:6px;height:6px;border-radius:50%;opacity:.7;filter:blur(.3px);animation:float 14s linear infinite}
.sparkles span:nth-child(1){left:8%;top:20%;background:#ff2d95;box-shadow:var(--glow-pink);animation-duration:16s}
.sparkles span:nth-child(2){left:82%;top:35%;background:#00e5ff;box-shadow:var(--glow-cyan);animation-duration:22s}
.sparkles span:nth-child(3){left:40%;top:80%;background:#b44bff;box-shadow:var(--glow-violet);animation-duration:19s}
.sparkles span:nth-child(4){left:60%;top:12%;background:#ffe600;box-shadow:var(--glow-yellow);animation-duration:25s}
.sparkles span:nth-child(5){left:15%;top:65%;background:#39ff14;box-shadow:var(--glow-green);animation-duration:21s}
@keyframes float{0%{transform:translateY(0) translateX(0)}50%{transform:translateY(-40px) translateX(20px)}100%{transform:translateY(0) translateX(0)}}

/* ---- NAV (fixed, ZAWSZE widoczne — mobilnie i desktopowo) ---- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:60;
  height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 clamp(16px,3vw,34px);
  background:rgba(5,3,15,.72);
  backdrop-filter:blur(14px) saturate(1.2);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid rgba(255,255,255,.06);
}
/* Logo w nav — lewa strona desktop, góra na mobilnym */
.nav-logo{
  flex:0 0 auto; display:inline-flex; align-items:center;
  height:auto; cursor:pointer;
  transition:.2s transform, .2s filter;
}
.nav-logo svg{
  height:64px; width:auto; display:block;
  fill:#fff;
  filter:drop-shadow(0 0 8px rgba(0,229,255,.5)) drop-shadow(0 0 3px rgba(255,45,149,.4));
}
.nav-logo:hover{transform:translateY(-1px)}
.nav-logo:hover svg{filter:drop-shadow(0 0 10px rgba(0,229,255,.65)) drop-shadow(0 0 4px rgba(255,45,149,.5))}

/* Menu — wycentrowane w osi X viewportu (pozycjonowanie absolutne
   względem paska, żeby nie zależało od szerokości logo/CTA) */
.nav .nav-links{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  display:flex; gap:22px; margin:0; padding:0; list-style:none;
}
.nav .nav-links a{font-weight:600;letter-spacing:.04em;font-size:.95rem;color:var(--ink-dim);transition:.2s color;cursor:pointer}
.nav .nav-links a:hover,.nav .nav-links a.active{color:#fff;text-shadow:var(--glow-cyan)}
.nav .cta-mini{
  flex:0 0 auto;
  padding:10px 16px;border-radius:999px;font-weight:700;letter-spacing:.08em;font-size:.82rem;text-transform:uppercase;
  border:1.5px solid var(--pink);color:#fff;box-shadow:inset 0 0 12px rgba(255,45,149,.35), var(--glow-pink);
  transition:.2s transform, .2s box-shadow;
}
.nav .cta-mini:hover{transform:translateY(-1px);box-shadow:inset 0 0 18px rgba(255,45,149,.55), 0 0 12px var(--pink), 0 0 36px var(--pink)}

.burger{
  display:none;width:44px;height:44px;border-radius:12px;
  border:1.5px solid rgba(0,229,255,.45);
  color:#fff;box-shadow:inset 0 0 10px rgba(0,229,255,.15), 0 0 12px rgba(0,229,255,.25);
  position:relative;
}
.burger span{
  position:absolute;left:10px;right:10px;height:2px;background:#fff;border-radius:2px;
  box-shadow:var(--glow-cyan);transition:.3s transform, .3s opacity, .3s top;
}
.burger span:nth-child(1){top:14px}
.burger span:nth-child(2){top:21px}
.burger span:nth-child(3){top:28px}
.burger.open span:nth-child(1){top:21px;transform:rotate(45deg);box-shadow:var(--glow-pink);background:var(--pink)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){top:21px;transform:rotate(-45deg);box-shadow:var(--glow-pink);background:var(--pink)}

@media (max-width:820px){
  /* Wyższy pasek, bo logo i hamburger stoją jeden nad drugim */
  :root{ --nav-h: 132px; }
  .nav{
    flex-direction:column;
    justify-content:center;
    gap:8px;
    padding:10px 16px 12px;
  }
  .nav .nav-links,.nav .cta-mini{display:none}
  .nav-logo{height:auto}
  .nav-logo svg{height:52px}
  .burger{display:block; width:40px; height:40px}
  .burger span{left:9px; right:9px}
  .burger span:nth-child(1){top:12px}
  .burger span:nth-child(2){top:19px}
  .burger span:nth-child(3){top:26px}
  .burger.open span:nth-child(1),
  .burger.open span:nth-child(3){top:19px}
}

.mobile-menu{
  position:fixed;inset:0;z-index:55;
  background:rgba(5,3,15,.96);
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  display:flex;align-items:center;justify-content:center;padding:80px 24px 40px;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.mobile-menu.open{opacity:1;pointer-events:auto}
.mobile-menu ul{list-style:none;margin:0;padding:0;text-align:center;display:grid;gap:18px}
.mobile-menu li{transform:translateY(20px);opacity:0;transition:.5s cubic-bezier(.2,.9,.3,1.2)}
.mobile-menu.open li{transform:none;opacity:1}
.mobile-menu.open li:nth-child(1){transition-delay:.08s}
.mobile-menu.open li:nth-child(2){transition-delay:.14s}
.mobile-menu.open li:nth-child(3){transition-delay:.20s}
.mobile-menu.open li:nth-child(4){transition-delay:.26s}
.mobile-menu.open li:nth-child(5){transition-delay:.32s}
.mobile-menu a{
  font-family:'Bebas Neue',sans-serif;letter-spacing:.16em;font-size:clamp(2.1rem,8vw,3.4rem);color:#fff;
  text-shadow:var(--glow-cyan);
}
.mobile-menu a.cta{color:var(--pink);text-shadow:var(--glow-pink)}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(16px,3vw,34px)}
section{padding:clamp(60px,10vw,120px) 0;position:relative}
.section-title{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.2rem,6vw,4.4rem);letter-spacing:.06em;margin:0 0 28px;color:#fff}
.section-title .accent{color:var(--cyan);text-shadow:var(--glow-cyan)}
.section-title .accent.pink{color:var(--pink);text-shadow:var(--glow-pink)}
.section-title .accent.yellow{color:var(--yellow);text-shadow:var(--glow-yellow)}
.kicker{display:inline-block;font-size:.8rem;letter-spacing:.35em;text-transform:uppercase;color:var(--cyan);padding:6px 12px;border:1px solid rgba(0,229,255,.4);border-radius:999px;box-shadow:inset 0 0 10px rgba(0,229,255,.1);margin-bottom:18px}

/* ---- HERO ---- */
.hero{min-height:min(92vh,900px);display:grid;place-items:center;text-align:center;padding-top:40px;padding-bottom:40px;position:relative;overflow:hidden}
.hero .logo{width:min(86vw,820px);margin:0 auto 18px;fill:#fff;filter:drop-shadow(0 0 6px rgba(255,255,255,.9)) drop-shadow(0 0 18px rgba(0,229,255,.55)) drop-shadow(0 0 34px rgba(255,45,149,.45));animation:logopulse 4.2s ease-in-out infinite alternate, powerOn 1.2s ease-out both}
@keyframes logopulse{from{filter:drop-shadow(0 0 4px rgba(255,255,255,.75)) drop-shadow(0 0 14px rgba(0,229,255,.45)) drop-shadow(0 0 28px rgba(255,45,149,.35))}to{filter:drop-shadow(0 0 10px rgba(255,255,255,1)) drop-shadow(0 0 26px rgba(0,229,255,.75)) drop-shadow(0 0 46px rgba(255,45,149,.6))}}
@keyframes powerOn{0%{opacity:0}12%{opacity:1}16%{opacity:.2}22%{opacity:.9}28%{opacity:.3}34%{opacity:1}100%{opacity:1}}
.hero .tagline{font-family:'Monoton','Bebas Neue',sans-serif;letter-spacing:.12em;font-size:clamp(1.6rem,4.6vw,3.2rem);color:#fff;margin:8px 0 6px;text-shadow:var(--glow-pink)}
.hero .tagline .cyan{color:var(--cyan);text-shadow:var(--glow-cyan)}
.hero p.lead{max-width:62ch;margin:14px auto 26px;color:var(--ink-dim);font-size:clamp(1rem,1.6vw,1.15rem)}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.bowling-deco{position:absolute;opacity:.9;pointer-events:none}
.bowling-deco.b1{left:-40px;top:70px;width:180px;transform:rotate(-14deg);filter:drop-shadow(var(--glow-pink))}
.bowling-deco.b2{right:-20px;bottom:60px;width:220px;transform:rotate(10deg);filter:drop-shadow(var(--glow-cyan))}
@media (max-width:720px){.bowling-deco{display:none}}

.marquee{overflow:hidden;border-block:1px solid rgba(255,255,255,.06);padding:14px 0;margin-top:20px;mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent)}
.marquee-inner{display:flex;gap:48px;white-space:nowrap;animation:scroll 28s linear infinite;font-family:'Bebas Neue',sans-serif;letter-spacing:.3em;font-size:1.2rem;color:var(--cyan);text-shadow:var(--glow-cyan)}
.marquee-inner span{display:inline-flex;align-items:center;gap:16px}
.marquee-inner em{font-style:normal;color:var(--pink);text-shadow:var(--glow-pink)}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.btn-neon{--c:var(--pink);position:relative;display:inline-flex;align-items:center;gap:10px;padding:16px 28px;border-radius:999px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:clamp(.9rem,1.1vw,1.05rem);color:#fff;background:rgba(255,45,149,.08);border:2px solid var(--c);box-shadow:inset 0 0 16px rgba(255,45,149,.25), 0 0 8px var(--c), 0 0 28px rgba(255,45,149,.55);transition:.25s transform, .25s box-shadow, .25s background;cursor:pointer}
.btn-neon:hover{transform:translateY(-2px);background:rgba(255,45,149,.16);box-shadow:inset 0 0 22px rgba(255,45,149,.4), 0 0 14px var(--c), 0 0 46px var(--c)}
.btn-neon.ghost{--c:var(--cyan);background:rgba(0,229,255,.06);box-shadow:inset 0 0 16px rgba(0,229,255,.2), 0 0 8px var(--c), 0 0 26px rgba(0,229,255,.45)}
.btn-neon.ghost:hover{background:rgba(0,229,255,.14);box-shadow:inset 0 0 22px rgba(0,229,255,.35), 0 0 14px var(--c), 0 0 44px var(--c)}
.btn-neon .dot{width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 10px var(--c),0 0 18px var(--c);animation:blink 1.4s infinite}
@keyframes blink{0%,90%,100%{opacity:1}45%{opacity:.35}}

/* ---- CENNIK ---- */
.cennik-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-top:16px}
.price-card{position:relative;border-radius:var(--radius);padding:24px 18px 22px;background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));border:1.5px solid rgba(255,255,255,.08);text-align:center;transition:.3s transform, .3s box-shadow, .3s border-color;overflow:hidden}
.price-card::before{content:"";position:absolute;inset:0;border-radius:var(--radius);padding:1.5px;background:linear-gradient(140deg,var(--c1,#ff2d95),var(--c2,#00e5ff));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.85}
.price-card:hover{transform:translateY(-4px);border-color:transparent;box-shadow:0 18px 60px rgba(255,45,149,.25), 0 0 40px rgba(0,229,255,.2)}
.price-card .day{font-family:'Bebas Neue',sans-serif;letter-spacing:.12em;font-size:1.25rem;line-height:1;color:var(--c1);text-shadow:0 0 6px var(--c1), 0 0 18px var(--c1)}
.price-card .when{margin-top:4px;font-size:.78rem;letter-spacing:.2em;color:var(--ink-dim);text-transform:uppercase}
.price-card .price{font-family:'Bebas Neue',sans-serif;margin:18px 0 6px;font-size:clamp(2.6rem,4.4vw,3.4rem);line-height:1;color:#fff;text-shadow:0 0 8px var(--c2), 0 0 22px var(--c2)}
.price-card .unit{font-size:.82rem;letter-spacing:.22em;color:var(--ink-dim);text-transform:uppercase}

.cennik-note{margin-top:22px;display:flex;align-items:center;gap:10px;padding:14px 18px;border-radius:14px;background:rgba(255,45,149,.07);border:1px dashed rgba(255,45,149,.4);color:#ffd3e7;font-size:.95rem}
.cennik-note .star{color:var(--pink);font-size:1.3rem;text-shadow:var(--glow-pink)}

.dart-wrap{margin-top:42px;display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center}
@media (max-width:820px){.dart-wrap{grid-template-columns:1fr}}
.dart-card{position:relative;padding:28px;border-radius:var(--radius);background:linear-gradient(140deg, rgba(0,229,255,.07), rgba(180,75,255,.05));border:1.5px solid rgba(0,229,255,.3);box-shadow:inset 0 0 36px rgba(0,229,255,.08)}
.dart-card h3{margin:0 0 6px;font-family:'Bebas Neue',sans-serif;letter-spacing:.1em;font-size:clamp(1.6rem,3vw,2.2rem);color:var(--cyan);text-shadow:var(--glow-cyan)}
.dart-card .dart-list{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.dart-card .dart-list li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);font-size:1rem}
.dart-card .dart-list .p{font-family:'Bebas Neue',sans-serif;font-size:1.5rem;letter-spacing:.05em;color:#fff;text-shadow:var(--glow-pink)}
.dartboard{width:100%;max-width:360px;margin:auto;filter:drop-shadow(0 0 14px rgba(0,229,255,.4)) drop-shadow(0 0 28px rgba(255,45,149,.3))}
.dartboard .rot{transform-origin:100px 100px;animation:spin 24s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---- GALERIA TEASER ---- */
.gallery-teaser{
  display:grid;gap:14px;margin-top:10px;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:180px;
}
.gallery-teaser .tile{position:relative;border-radius:18px;overflow:hidden;cursor:pointer;border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 30px rgba(0,0,0,.5);transition:.35s transform, .35s box-shadow;background:#0b0620}
.gallery-teaser .tile:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 18px 60px rgba(255,45,149,.25), 0 0 40px rgba(0,229,255,.2)}
.gallery-teaser .tile > img,.gallery-teaser .tile > .ph-wrap{width:100%;height:100%;display:block;object-fit:cover}
.gallery-teaser .tile .caption{position:absolute;inset:auto 0 0 0;padding:10px 14px;background:linear-gradient(0deg, rgba(5,3,15,.85), transparent);color:#fff;font-size:.85rem;letter-spacing:.18em;text-transform:uppercase}
.gallery-teaser .tile:nth-child(1){grid-column:span 2;grid-row:span 2}
.gallery-teaser .tile:nth-child(2){grid-column:span 2;grid-row:span 1}
.gallery-teaser .tile:nth-child(3){grid-column:span 1;grid-row:span 1}
.gallery-teaser .tile:nth-child(4){grid-column:span 1;grid-row:span 1}
.gallery-teaser .tile:nth-child(5){grid-column:span 2;grid-row:span 1}
@media(max-width:900px){
  .gallery-teaser{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px}
  .gallery-teaser .tile:nth-child(n){grid-column:span 1;grid-row:span 1}
  .gallery-teaser .tile:nth-child(1){grid-column:span 2;grid-row:span 2}
}
@media(max-width:540px){.gallery-teaser{grid-auto-rows:140px}}

.ph-wrap{display:grid;place-items:center;position:relative;background:radial-gradient(80% 80% at 50% 30%, rgba(255,255,255,.04), transparent 60%),linear-gradient(160deg,#120a2e,#0b0620)}
.ph-wrap::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:linear-gradient(140deg,var(--c1,#ff2d95),var(--c2,#00e5ff));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.ph-wrap svg{width:58%;height:58%;filter:drop-shadow(0 0 8px var(--c1))}
.ph-wrap .label{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-family:'Bebas Neue',sans-serif;letter-spacing:.22em;font-size:.95rem;color:var(--c1);text-shadow:0 0 6px var(--c1), 0 0 16px var(--c1)}

.gallery-cta{margin-top:22px;display:flex;justify-content:center}

/* ---- FULL GALLERY ---- */
.gallery-page{padding-top:30px}
.gallery-page .masonry{column-count:3;column-gap:18px}
@media(max-width:900px){.gallery-page .masonry{column-count:2}}
@media(max-width:540px){.gallery-page .masonry{column-count:1}}
.gallery-page .tile{break-inside:avoid;margin:0 0 18px;border-radius:18px;overflow:hidden;position:relative;border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 30px rgba(0,0,0,.5);transition:.35s transform, .35s box-shadow;cursor:pointer;background:#0b0620}
.gallery-page .tile:hover{transform:translateY(-4px);box-shadow:0 18px 60px rgba(255,45,149,.25), 0 0 40px rgba(0,229,255,.2)}
.gallery-page .tile img{width:100%;height:auto;display:block}
.gallery-page .tile .caption{position:absolute;inset:auto 0 0 0;padding:10px 14px;background:linear-gradient(0deg, rgba(5,3,15,.85), transparent);color:#fff;font-size:.85rem;letter-spacing:.18em;text-transform:uppercase}
.gallery-page .tile.placeholder{aspect-ratio:var(--ar,4/5)}
.gallery-page .tile.placeholder .ph-wrap{width:100%;height:100%}
.gallery-page .back-btn{display:inline-flex;align-items:center;gap:10px;color:var(--ink-dim);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.9rem;cursor:pointer}
.gallery-page .back-btn:hover{color:#fff;text-shadow:var(--glow-cyan)}

/* ---- LIGHTBOX ---- */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.92);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;place-items:center;padding:40px 20px;touch-action:pan-y;animation:fadeIn .25s ease;user-select:none}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.lightbox-inner{position:relative;max-width:min(1100px,95vw);max-height:85vh;width:100%;display:grid;place-items:center;will-change:transform;transition:transform .22s cubic-bezier(.4,.0,.2,1)}
.lightbox-inner.dragging{transition:none}
.lightbox-inner img{max-width:100%;max-height:85vh;object-fit:contain;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.6), 0 0 40px rgba(255,45,149,.3);background:#0b0620;pointer-events:none}
.lightbox-inner .lb-ph{width:min(620px,90vw);aspect-ratio:4/5;border-radius:12px;background:radial-gradient(80% 80% at 50% 30%, rgba(255,255,255,.04), transparent 60%),linear-gradient(160deg,#120a2e,#0b0620);display:grid;place-items:center;box-shadow:0 30px 80px rgba(0,0,0,.6);position:relative}
.lightbox-inner .lb-ph svg{width:55%;height:55%}
.lightbox-inner .lb-ph .label{position:absolute;bottom:18px;left:0;right:0;text-align:center;font-family:'Bebas Neue',sans-serif;letter-spacing:.22em;font-size:1.1rem;color:var(--c1);text-shadow:0 0 6px var(--c1), 0 0 16px var(--c1)}
.lightbox .lb-counter{position:absolute;top:22px;left:22px;color:#fff;font-family:'Bebas Neue',sans-serif;letter-spacing:.2em;font-size:1rem;opacity:.85}
.lightbox .lb-caption{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);color:#fff;font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.9rem;background:rgba(5,3,15,.7);padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.1)}
.lightbox .lb-close{position:absolute;top:14px;right:14px;width:46px;height:46px;border-radius:50%;background:rgba(5,3,15,.6);border:1.5px solid rgba(255,45,149,.6);color:#fff;display:grid;place-items:center;font-size:1.4rem;box-shadow:0 0 18px rgba(255,45,149,.5);cursor:pointer}
.lightbox .lb-close:hover{background:rgba(255,45,149,.2)}
.lightbox .lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;background:rgba(5,3,15,.6);border:1.5px solid rgba(0,229,255,.55);color:#fff;display:grid;place-items:center;font-size:1.8rem;box-shadow:0 0 18px rgba(0,229,255,.5);transition:.2s transform;cursor:pointer}
.lightbox .lb-nav:hover{transform:translateY(-50%) scale(1.08);background:rgba(0,229,255,.15)}
.lightbox .lb-nav.prev{left:14px}
.lightbox .lb-nav.next{right:14px}
@media (max-width:640px){.lightbox .lb-nav{display:none}.lightbox-inner img,.lightbox-inner .lb-ph{max-height:78vh;border-radius:14px}}

/* ---- REGULAMIN ---- */
.reg-grid{display:grid;gap:14px;margin-top:10px}
.reg{border:1px solid rgba(255,255,255,.08);border-radius:14px;background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));overflow:hidden;transition:.25s border-color, .25s box-shadow}
.reg.open{border-color:rgba(0,229,255,.45);box-shadow:inset 0 0 20px rgba(0,229,255,.08), 0 0 22px rgba(0,229,255,.15)}
.reg .summary{display:flex;align-items:center;gap:14px;padding:18px 22px;font-weight:700;letter-spacing:.04em;width:100%;text-align:left;cursor:pointer}
.reg .par{font-family:'Bebas Neue',sans-serif;letter-spacing:.12em;font-size:1.1rem;padding:4px 10px;border-radius:8px;color:var(--pink);border:1px solid rgba(255,45,149,.4);box-shadow:inset 0 0 10px rgba(255,45,149,.1)}
.reg .chev{margin-left:auto;color:var(--cyan);transition:.2s transform;font-size:1.2rem;line-height:1}
.reg.open .chev{transform:rotate(90deg)}
.reg .content{padding:0 22px 0;color:var(--ink-dim);line-height:1.65;overflow:hidden;max-height:0;transition:max-height .4s ease, padding .4s ease}
.reg.open .content{max-height:2400px;padding:0 22px 20px}
.reg .content ul{padding-left:20px;margin:6px 0}
.reg .content li{margin:3px 0}

.finale{margin-top:30px;text-align:center;padding:clamp(40px,8vw,80px) clamp(20px,4vw,60px);border-radius:24px;position:relative;overflow:hidden;background:radial-gradient(60% 100% at 50% 0%, rgba(255,45,149,.25), transparent 70%),radial-gradient(60% 100% at 50% 100%, rgba(0,229,255,.2), transparent 70%),linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.01));border:1.5px solid rgba(255,255,255,.08)}
.finale h3{font-family:'Bebas Neue',sans-serif;letter-spacing:.08em;font-size:clamp(2rem,5vw,3.6rem);margin:0 0 10px;color:#fff;text-shadow:var(--glow-pink)}
.finale p{color:var(--ink-dim);max-width:62ch;margin:0 auto 24px}

footer{margin-top:50px;padding:40px 0 60px;color:var(--ink-dim);border-top:1px solid rgba(255,255,255,.06);background:linear-gradient(0deg, rgba(0,0,0,.35), transparent)}
footer .f-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
@media(max-width:760px){footer .f-grid{grid-template-columns:1fr}}
footer h4{color:#fff;margin:0 0 10px;font-family:'Bebas Neue',sans-serif;letter-spacing:.12em;font-size:1.2rem}
footer a:hover{color:#fff;text-shadow:var(--glow-cyan)}
footer small{display:block;text-align:center;margin-top:30px;color:#6b6492}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s ease, transform .8s ease}
.reveal.on{opacity:1;transform:none}

.booting{position:fixed;inset:0;display:grid;place-items:center;color:var(--ink-dim);font-family:'Bebas Neue',sans-serif;letter-spacing:.3em;text-shadow:var(--glow-cyan);background:var(--bg-0)}
.booting .dots::after{content:"...";animation:blink 1.2s steps(4,end) infinite}

:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- GODZINY OTWARCIA ---------- */
.hours-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:18px}
@media(max-width:820px){.hours-grid{grid-template-columns:1fr}}
.hours-card{position:relative;padding:28px 26px 26px;border-radius:22px;background:linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.01));overflow:hidden;isolation:isolate;transition:transform .35s ease, box-shadow .35s ease}
.hours-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;background:linear-gradient(135deg,var(--c1),var(--c2));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.85}
.hours-card::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 100% 0%, color-mix(in srgb, var(--c1) 22%, transparent), transparent 60%);pointer-events:none;z-index:-1}
.hours-card:hover{transform:translateY(-4px);box-shadow:0 16px 48px -16px color-mix(in srgb, var(--c1) 55%, transparent)}
.hours-card .h-day{font-family:'Bebas Neue',sans-serif;letter-spacing:.14em;font-size:1.5rem;color:#fff;text-shadow:0 0 18px color-mix(in srgb, var(--c1) 60%, transparent)}
.hours-card .h-time{font-family:'Monoton',cursive;font-size:clamp(1.9rem,4.5vw,2.7rem);line-height:1.1;margin-top:6px;color:#fff;text-shadow:0 0 12px var(--c1),0 0 28px color-mix(in srgb, var(--c2) 60%, transparent)}
.hours-card .h-note{margin-top:10px;color:var(--ink-dim);font-size:.9rem;letter-spacing:.06em;text-transform:uppercase}
.hours-card.hot{background:linear-gradient(160deg, color-mix(in srgb, var(--c1) 16%, transparent), color-mix(in srgb, var(--c2) 8%, transparent))}
.hot-badge{position:absolute;top:14px;right:14px;padding:4px 10px;border-radius:999px;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:#0b0620;background:linear-gradient(90deg,var(--yellow),var(--pink));box-shadow:0 0 16px color-mix(in srgb,var(--pink) 50%, transparent);animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}

/* ---------- STAN "WKRÓTCE" ---------- */
.soon{opacity:.78;cursor:not-allowed !important;filter:saturate(.6)}
a.soon, span.soon.btn-neon, span.soon.cta-mini, span.soon.cta{text-decoration:none}
.cta-mini.soon{border-color:rgba(255,255,255,.2) !important;color:var(--ink-dim) !important;background:rgba(255,255,255,.03) !important;box-shadow:none !important}
.btn-neon.soon::after{display:none}
.btn-neon.soon{background:rgba(255,255,255,.04);border:1px dashed rgba(255,255,255,.22);color:var(--ink-dim);box-shadow:none}
.btn-neon.soon:hover{transform:none;background:rgba(255,255,255,.04);box-shadow:none}
footer .soon{font-style:italic;color:var(--ink-dim)}

/* subtle shimmer dla "wkrótce" żeby było żywe a nie martwe */
.cta.soon{position:relative;color:#fff !important;background:linear-gradient(90deg,color-mix(in srgb,var(--violet) 30%, transparent),color-mix(in srgb,var(--cyan) 30%, transparent)) !important;border:1px solid rgba(255,255,255,.2) !important;overflow:hidden}
.cta.soon::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.18),transparent 70%);transform:translateX(-100%);animation:shimmer 2.4s linear infinite}
@keyframes shimmer{to{transform:translateX(100%)}}

/* ---------- PRZYCISK PDF ---------- */
.pdf-cta{display:flex;justify-content:center;margin:32px 0 10px}
.btn-pdf{display:inline-flex;align-items:center;gap:12px;padding:14px 24px;border-radius:14px;color:#fff;text-decoration:none;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.92rem;background:linear-gradient(135deg, rgba(0,229,255,.14), rgba(180,75,255,.14));border:1px solid rgba(0,229,255,.35);box-shadow:0 0 0 1px rgba(0,229,255,.08) inset, 0 10px 30px -14px rgba(0,229,255,.5);transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease}
.btn-pdf svg{width:22px;height:22px;color:var(--cyan);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--cyan) 70%, transparent));flex:none}
.btn-pdf:hover{transform:translateY(-2px);border-color:var(--cyan);background:linear-gradient(135deg, rgba(0,229,255,.22), rgba(180,75,255,.22));box-shadow:0 0 0 1px rgba(0,229,255,.22) inset, 0 18px 40px -18px rgba(0,229,255,.7);color:#fff;text-shadow:0 0 10px rgba(0,229,255,.5)}
.btn-pdf:active{transform:translateY(0)}

/* ---------- PODSTRONA: JAK GRAĆ ---------- */
.zasady-page{padding-top:16px}
.subsection{font-family:'Bebas Neue',sans-serif;letter-spacing:.1em;font-size:clamp(1.6rem,3.5vw,2.4rem);margin:44px 0 14px;color:#fff;text-shadow:0 0 16px rgba(255,45,149,.25)}

/* Skrót zasad — 4 pigułki */
.rules-pills{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:24px 0 8px}
@media(max-width:820px){.rules-pills{grid-template-columns:repeat(2,1fr)}}
.pill{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.01));border:1px solid rgba(255,255,255,.1);position:relative;overflow:hidden;isolation:isolate;transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease}
.pill::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 100% at 100% 0%,rgba(0,229,255,.18),transparent 60%);pointer-events:none;z-index:-1}
.pill:hover{transform:translateY(-3px);border-color:rgba(0,229,255,.4);box-shadow:0 14px 30px -14px rgba(0,229,255,.5)}
.pill svg{width:46px;height:46px;flex:none}
.pill .mega{font-family:'Monoton',cursive;font-size:2.4rem;line-height:1;color:var(--cyan);text-shadow:0 0 14px var(--cyan);min-width:56px;text-align:center}
.pill b{display:block;color:#fff;font-size:1.05rem;letter-spacing:.04em}
.pill span{display:block;color:var(--ink-dim);font-size:.85rem;margin-top:2px}

/* Słownik pojęć */
.slownik-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:960px){.slownik-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.slownik-grid{grid-template-columns:1fr}}
.slow-card{position:relative;padding:22px 20px;border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid color-mix(in srgb,var(--c) 30%, rgba(255,255,255,.08));overflow:hidden;transition:transform .3s ease, box-shadow .3s ease}
.slow-card::before{content:"";position:absolute;top:-40%;right:-30%;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c) 30%, transparent),transparent 70%);pointer-events:none}
.slow-card:hover{transform:translateY(-3px);box-shadow:0 14px 32px -14px color-mix(in srgb,var(--c) 70%, transparent)}
.slow-sym{font-family:'Monoton',cursive;font-size:2.6rem;line-height:1;color:var(--c);text-shadow:0 0 16px var(--c), 0 0 32px color-mix(in srgb,var(--c) 60%, transparent);margin-bottom:10px}
.slow-name{font-family:'Bebas Neue',sans-serif;letter-spacing:.1em;color:#fff;font-size:1.3rem;margin-bottom:4px}
.slow-desc{color:var(--ink-dim);font-size:.92rem;line-height:1.5}

/* Karta wyników — przykład scoringu */
.scoresheet{display:grid;grid-template-rows:auto auto auto;gap:0;border:1px solid rgba(0,229,255,.25);border-radius:16px;overflow:hidden;margin:18px 0 10px;background:rgba(0,229,255,.04)}
@media(max-width:820px){.scoresheet{overflow-x:auto}}
.score-row{display:grid;grid-template-columns:84px repeat(10, minmax(54px, 1fr));align-items:stretch}
@media(max-width:820px){.score-row{grid-template-columns:84px repeat(10, 62px);min-width:720px}}
.score-row + .score-row{border-top:1px solid rgba(255,255,255,.08)}
.rh{padding:12px 10px;font-family:'Bebas Neue',sans-serif;letter-spacing:.1em;color:#fff;background:rgba(0,229,255,.07);border-right:1px solid rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;font-size:.95rem}
.score-row.head .rh{color:var(--cyan);text-shadow:0 0 10px rgba(0,229,255,.4)}
.cell{padding:10px 8px;border-right:1px solid rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;gap:6px;color:#fff;font-family:'Bebas Neue',sans-serif;letter-spacing:.08em;font-size:1.15rem;min-height:56px}
.cell .t1,.cell .t2,.cell .t3{display:inline-block;min-width:22px;text-align:center}
.cell .strike{color:var(--yellow);text-shadow:0 0 10px var(--yellow)}
.cell .spare{color:var(--cyan);text-shadow:0 0 10px var(--cyan)}
.cell.sum{font-family:'Monoton',cursive;color:#fff;font-size:1.4rem;background:rgba(255,230,0,.04);text-shadow:0 0 10px rgba(255,230,0,.35)}

/* Kroki rzutu */
.kroki-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(max-width:820px){.kroki-grid{grid-template-columns:1fr}}
.krok{display:flex;gap:18px;padding:20px;border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid rgba(255,255,255,.08);transition:transform .3s ease, border-color .3s ease}
.krok:hover{transform:translateY(-3px);border-color:rgba(255,45,149,.35)}
.krok-num{font-family:'Monoton',cursive;font-size:2.8rem;line-height:.9;color:var(--pink);text-shadow:0 0 18px var(--pink);flex:none;min-width:70px}
.krok-title{font-family:'Bebas Neue',sans-serif;letter-spacing:.1em;color:#fff;font-size:1.3rem;margin-bottom:6px}
.krok-body p{margin:0;color:var(--ink-dim);line-height:1.55}

/* Etykieta — lista z bullet */
.etyk-list{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px 28px}
@media(max-width:820px){.etyk-list{grid-template-columns:1fr}}
.etyk-list li{position:relative;padding:10px 14px 10px 32px;color:#d4cfee;line-height:1.5;border-radius:10px;background:rgba(255,255,255,.02);border-left:2px solid var(--green);transition:background .2s ease}
.etyk-list li:hover{background:rgba(57,255,20,.05)}
.etyk-list .bullet{position:absolute;left:10px;top:10px;color:var(--green);font-family:'Bebas Neue',sans-serif;font-size:1.2rem;text-shadow:0 0 8px var(--green)}

/* Dart bonus */
.dart-tip{display:grid;grid-template-columns:180px 1fr;gap:30px;align-items:center;margin:24px 0 10px;padding:24px;border-radius:20px;background:linear-gradient(135deg,rgba(255,45,149,.08),rgba(0,229,255,.05));border:1px solid rgba(255,45,149,.25)}
@media(max-width:720px){.dart-tip{grid-template-columns:1fr;text-align:center}}
.dart-tip svg{width:100%;max-width:180px;height:auto;filter:drop-shadow(0 0 20px rgba(255,45,149,.4));animation:spin 40s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* Home CTA prowadzący do podstrony Zasad */
.learn-cta{margin-top:32px;padding:24px 28px;border-radius:22px;background:linear-gradient(135deg, rgba(255,230,0,.06), rgba(255,45,149,.05));border:1px solid rgba(255,230,0,.25);display:flex;gap:24px;align-items:center;justify-content:space-between}
@media(max-width:720px){.learn-cta{flex-direction:column;text-align:center;gap:18px}}
.learn-cta h3{font-family:'Bebas Neue',sans-serif;letter-spacing:.08em;margin:10px 0 6px;font-size:1.8rem;color:#fff;text-shadow:var(--glow-pink)}
.learn-cta p{margin:0;color:var(--ink-dim);max-width:56ch;line-height:1.5}

/* ================================================================
   MOBILE: TŁUMIK GLOW
   Tekst musi być czytelny — neon zostaje, ale tylko cienka poświata.
   ================================================================ */
@media (max-width: 820px){
  :root{
    --glow-pink:   0 0 3px rgba(255,45,149,.9),  0 0 8px rgba(255,45,149,.35);
    --glow-cyan:   0 0 3px rgba(0,229,255,.9),   0 0 8px rgba(0,229,255,.35);
    --glow-yellow: 0 0 3px rgba(255,230,0,.9),   0 0 8px rgba(255,230,0,.35);
    --glow-green:  0 0 3px rgba(57,255,20,.9),   0 0 8px rgba(57,255,20,.35);
    --glow-violet: 0 0 3px rgba(180,75,255,.9),  0 0 8px rgba(180,75,255,.35);
  }
  /* Konkretne przyciemnienia text-shadow tam gdzie jest hardcoded w CSS */
  .price-card .price{text-shadow:0 0 6px color-mix(in srgb, var(--c1) 70%, transparent)}
  .hours-card .h-day{text-shadow:0 0 6px color-mix(in srgb, var(--c1) 50%, transparent)}
  .hours-card .h-time{text-shadow:0 0 4px var(--c1)}
  .slow-sym{text-shadow:0 0 6px var(--c), 0 0 14px color-mix(in srgb,var(--c) 40%, transparent)}
  .krok-num{text-shadow:0 0 6px var(--pink)}
  .cell .strike{text-shadow:0 0 4px var(--yellow)}
  .cell .spare{text-shadow:0 0 4px var(--cyan)}
  .cell.sum{text-shadow:0 0 4px rgba(255,230,0,.5)}
  .pill .mega{text-shadow:0 0 5px var(--cyan)}
  .finale h3{text-shadow:0 0 6px rgba(255,45,149,.6)}
  .subsection{text-shadow:0 0 6px rgba(255,45,149,.2)}
  .hot-badge{box-shadow:0 0 6px rgba(255,45,149,.4)}
  .dart-tip svg{filter:drop-shadow(0 0 8px rgba(255,45,149,.25))}
  .dartboard{filter:drop-shadow(0 0 6px rgba(255,45,149,.2))}
  /* Sparkle-kropki też troszkę ściszamy */
  .sparkles span{filter:blur(.5px) brightness(.9)}
  /* Hero — logo miej mniej flar */
  .hero .logo{filter:drop-shadow(0 0 4px rgba(255,255,255,.5)) !important}

  /* ================================================================
     AGRESYWNY TŁUMIK DLA DUŻYCH AKCENTÓW
     To są te napisy, które na telefonie wyglądały na rozmyte bloby.
     Zamiast warstwy spread-blur zostaje tylko cienki halo 2-3px.
     ================================================================ */
  .section-title .accent,
  .section-title .accent.pink,
  .section-title .accent.yellow{
    text-shadow: 0 0 2px currentColor !important;
  }
  .hero .tagline{
    text-shadow: 0 0 3px rgba(255,45,149,.75) !important;
  }
  .hero .tagline .cyan{
    text-shadow: 0 0 3px rgba(0,229,255,.75) !important;
  }
  /* Ogólne neony — wszędzie, gdzie są klasy utility .neon-* */
  .neon-pink, .neon-cyan, .neon-yellow, .neon-green, .neon-violet{
    text-shadow: 0 0 3px currentColor !important;
  }
}