:root{
  /* Dark / Neon (domyślnie) */
  --wbs-bg: #07070b;
  --wbs-text: rgba(255,255,255,.92);
  --wbs-muted: rgba(255,255,255,.62);

  --wbs-header-bg: rgba(10,10,18,.72);
  --wbs-card-bg: rgba(255,255,255,.04);
  --wbs-border: rgba(255,255,255,.12);

  --wbs-accent: #ff2bd6;          /* neon pink */
  --wbs-accent-2: #00e5ff;        /* neon cyan */
  --wbs-glow: 0 0 22px rgba(255,43,214,.25), 0 0 42px rgba(0,229,255,.14);

  --wbs-shadow: 0 18px 60px rgba(0,0,0,.45);
  --wbs-radius: 18px;
  --wbs-max: 1100px;
  --wbs-pad: 16px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica,Arial,sans-serif;
  color: var(--wbs-text);
  background: radial-gradient(1200px 800px at 10% 10%, rgba(255,43,214,.10), transparent 60%),
              radial-gradient(1100px 700px at 85% 20%, rgba(0,229,255,.08), transparent 60%),
              var(--wbs-bg);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Layout */
.wbs-container{
  width: min(var(--wbs-max), 100%);
  margin: 0 auto;
  padding: 24px var(--wbs-pad);
}

.wbs-card{
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
  border: 1px solid var(--wbs-border);
  border-radius: var(--wbs-radius);
  box-shadow: var(--wbs-shadow);
  padding: 18px;
  margin: 0 0 18px;
  backdrop-filter: blur(10px);
}

.wbs-card__title{margin:0 0 8px;font-size: 1.35rem;line-height:1.2}
.wbs-card__title a{color:inherit;text-decoration:none}
.wbs-card__title a:hover{text-decoration:underline}
.wbs-card__meta{margin:0;color:var(--wbs-muted);font-size:.9rem}
.wbs-card__content p{margin:0 0 12px}

/* Header */
.wbs-header{
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--wbs-header-bg);
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(14px);
}

.wbs-header__inner{
  width: min(var(--wbs-max), 100%);
  margin: 0 auto;
  padding: 10px var(--wbs-pad);
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
}

.wbs-brand__link{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.wbs-brand__text{
  font-weight:800;
  letter-spacing:.3px;
  text-shadow: 0 0 18px rgba(255,255,255,.08);
}
.custom-logo{max-height:42px;width:auto;display:block}

/* Burger button (app-like) */
.wbs-burger{
  display:flex;
  align-items:center;
  gap:10px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
  color:#fff;
  padding: 10px 12px;
  border-radius: 999px;
  cursor:pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .16s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}
.wbs-burger:hover{
  background: rgba(255,255,255,.09);
  border-color: rgba(255,255,255,.26);
  box-shadow: var(--wbs-glow);
}
.wbs-burger:active{transform: scale(.98)}
.wbs-burger:focus{outline:2px solid rgba(0,229,255,.65);outline-offset:2px}
.wbs-burger__label{font-weight:700;font-size:.95rem}

/* Burger icon → X (animacja) */
.wbs-burger__lines{
  width: 22px;
  height: 16px;
  position: relative;
  display:block;
}
.wbs-burger__line,
.wbs-burger__lines::before,
.wbs-burger__lines::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:2px;
  background:#fff;
  border-radius: 999px;
  transition: transform .22s cubic-bezier(.2,.9,.2,1),
              top .22s cubic-bezier(.2,.9,.2,1),
              opacity .18s ease;
}
.wbs-burger__lines::before{top:3px}
.wbs-burger__line{top:7px}
.wbs-burger__lines::after{top:11px}

body.wbs-menu-open .wbs-burger__lines::before{
  top:7px;
  transform: rotate(45deg);
}
body.wbs-menu-open .wbs-burger__lines::after{
  top:7px;
  transform: rotate(-45deg);
}
body.wbs-menu-open .wbs-burger__line{
  opacity:0;
  transform: scaleX(.2);
}

/* Overlay fade + blur */
.wbs-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 60;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
  backdrop-filter: blur(10px);
}
body.wbs-menu-open .wbs-overlay{
  opacity: 1;
  pointer-events: auto;
}

/* Offcanvas (app-like) */
.wbs-offcanvas{
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  width: min(88vw, 380px);
  background: rgba(15,15,24,.86);
  color: rgba(255,255,255,.92);
  transform: translateX(110%);
  transition: transform .26s cubic-bezier(.2,.9,.2,1);
  z-index: 70;
  box-shadow: -20px 0 70px rgba(0,0,0,.55);
  display:flex;
  flex-direction: column;
  border-left: 1px solid rgba(255,255,255,.10);
  border-top-left-radius: 22px;
  border-bottom-left-radius: 22px;
  backdrop-filter: blur(16px);
}

.wbs-offcanvas__top{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 14px 14px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.wbs-offcanvas__title{
  font-size:1rem;
  letter-spacing:.2px;
}

.wbs-close{
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: #fff;
  border-radius: 14px;
  width: 44px;
  height: 44px;
  cursor:pointer;
  font-size: 26px;
  line-height: 1;
  transition: transform .16s ease, box-shadow .2s ease, background .2s ease;
}
.wbs-close:hover{
  background: rgba(255,255,255,.10);
  box-shadow: var(--wbs-glow);
}
.wbs-close:active{transform: scale(.98)}

.wbs-menu{padding: 10px 12px; overflow:auto; -webkit-overflow-scrolling: touch}
.wbs-menu__list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction: column;
  gap: 10px;
}

/* Micro-animacje linków */
.wbs-menu__list a{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 14px 14px;
  border-radius: 16px;
  text-decoration:none;
  color: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.04));
  transition: transform .16s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}
.wbs-menu__list a:hover{
  transform: translateX(-2px);
  border-color: rgba(0,229,255,.35);
  box-shadow: 0 0 0 1px rgba(255,43,214,.18), var(--wbs-glow);
  background: linear-gradient(180deg, rgba(255,43,214,.10), rgba(0,229,255,.06));
}
.wbs-menu__list a:active{transform: translateX(-2px) scale(.99)}

/* Submenu */
.wbs-menu__list .children,
.wbs-menu__list .sub-menu{
  list-style:none;
  margin: 8px 0 0 14px;
  padding: 0;
  display:flex;
  flex-direction: column;
  gap: 10px;
}

/* Open state */
body.wbs-menu-open .wbs-offcanvas{transform: translateX(0)}

/* Footer */
.wbs-footer{
  border-top: 1px solid rgba(255,255,255,.10);
  padding: 20px var(--wbs-pad);
  color: var(--wbs-muted);
}
.wbs-footer__inner{
  width: min(var(--wbs-max), 100%);
  margin: 0 auto;
}

/* Anchor offset */
:target{scroll-margin-top: 80px}

@media (min-width: 900px){
  .wbs-burger{padding: 10px 14px}
}

/* === AGE GATE === */
.age-gate{
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(14px);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
}
.age-gate.active{
  opacity: 1;
  pointer-events: auto;
}
.age-gate__card{
  max-width: 420px;
  margin: 20px;
  padding: 28px;
  border-radius: 22px;
  text-align: center;
  color: #fff;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 0 60px rgba(0,0,0,.6);
}
.age-gate__card h2{
  margin-top: 0;
}
.age-gate__actions{
  display: flex;
  gap: 14px;
  margin-top: 22px;
  justify-content: center;
}
.age-btn{
  flex: 1;
  padding: 14px 16px;
  border-radius: 14px;
  font-size: 1rem;
  cursor: pointer;
  border: none;
}
.age-yes{
  background: linear-gradient(135deg, #ff2bd6, #00e5ff);
  color: #000;
  font-weight: 700;
}
.age-no{
  background: rgba(255,255,255,.1);
  color: #fff;
  border: 1px solid rgba(255,255,255,.25);
}
/* === END AGE GATE === */

.age-gate__hint{margin:16px 0 0;font-size:.9rem;color:rgba(255,255,255,.72)}


/* === MENU ICONS + ACTIVE STATE === */
.wbs-menu__list a::before{
  content:"";
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  margin-right: 12px;
  opacity: .92;
  background-size: 18px 18px;
  background-repeat:no-repeat;
  background-position:center;
  filter: drop-shadow(0 0 10px rgba(0,229,255,.18));
}

.wbs-icon-home > a::before{ background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22white%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M3%2010.5%2012%203l9%207.5%22/%3E%3Cpath%20d=%22M5%2010.5V21h14V10.5%22/%3E%3C/svg%3E"); }
.wbs-icon-info > a::before{ background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22white%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Ccircle%20cx=%2212%22%20cy=%2212%22%20r=%229%22/%3E%3Cpath%20d=%22M12%2010v7%22/%3E%3Cpath%20d=%22M12%207h.01%22/%3E%3C/svg%3E"); }
.wbs-icon-rocket > a::before{ background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22white%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M5%2014c4-8%2010-10%2014-10%200%204-2%2010-10%2014l-4-4Z%22/%3E%3Cpath%20d=%22M9%2018%206%2021%22/%3E%3Cpath%20d=%22M14%209a2%202%200%201%200%200.01%200%22/%3E%3C/svg%3E"); }
.wbs-icon-book > a::before{ background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22white%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M4%2019a2%202%200%200%200%202%202h14%22/%3E%3Cpath%20d=%22M6%202h14v19H6a2%202%200%200%201-2-2V4a2%202%200%200%201%202-2Z%22/%3E%3Cpath%20d=%22M8%206h8%22/%3E%3C/svg%3E"); }
.wbs-icon-map > a::before{ background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22white%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M9%2018%203%2021V6l6-3%206%203%206-3v15l-6%203-6-3Z%22/%3E%3Cpath%20d=%22M9%203v15%22/%3E%3Cpath%20d=%22M15%206v15%22/%3E%3C/svg%3E"); }
.wbs-icon-pen > a::before{ background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22white%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M12%2020h9%22/%3E%3Cpath%20d=%22M16.5%203.5a2.1%202.1%200%200%201%203%203L8%2018l-4%201%201-4Z%22/%3E%3C/svg%3E"); }
.wbs-icon-handshake > a::before{ background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22white%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M11%205%207%209a3%203%200%200%200%200%204l1%201%22/%3E%3Cpath%20d=%22M13%205l4%204a3%203%200%200%201%200%204l-1%201%22/%3E%3Cpath%20d=%22M8%2014l2%202a2%202%200%200%200%203%200l1-1%22/%3E%3Cpath%20d=%22M3%2012l4-4%22/%3E%3Cpath%20d=%22M21%2012l-4-4%22/%3E%3C/svg%3E"); }
.wbs-icon-user > a::before{ background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22white%22%20stroke-width=%222%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M20%2021a8%208%200%201%200-16%200%22/%3E%3Ccircle%20cx=%2212%22%20cy=%228%22%20r=%224%22/%3E%3C/svg%3E"); }

/* Active: podświetl aktualną stronę */
.wbs-menu__list .current-menu-item > a,
.wbs-menu__list .current_page_item > a,
.wbs-menu__list .current-menu-ancestor > a{
  border-color: rgba(255,43,214,.55);
  box-shadow: 0 0 0 1px rgba(0,229,255,.22), var(--wbs-glow);
  background: linear-gradient(180deg, rgba(255,43,214,.16), rgba(0,229,255,.10));
}

/* Mini „kropka” aktywna po prawej */
.wbs-menu__list .current-menu-item > a::after,
.wbs-menu__list .current_page_item > a::after{
  content:"";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--wbs-accent), var(--wbs-accent-2));
  box-shadow: var(--wbs-glow);
}

/* === Stagger animacja wejścia elementów (app-like) === */
.wbs-menu__list > li > a{
  opacity: 0;
  transform: translateX(10px);
}
body.wbs-menu-open .wbs-menu__list > li > a{
  opacity: 1;
  transform: translateX(0);
  transition: transform .22s cubic-bezier(.2,.9,.2,1),
              opacity .22s ease,
              box-shadow .22s ease,
              border-color .22s ease,
              background .22s ease;
}
body.wbs-menu-open .wbs-menu__list > li:nth-child(1) > a{ transition-delay: .02s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(2) > a{ transition-delay: .04s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(3) > a{ transition-delay: .06s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(4) > a{ transition-delay: .08s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(5) > a{ transition-delay: .10s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(6) > a{ transition-delay: .12s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(7) > a{ transition-delay: .14s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(8) > a{ transition-delay: .16s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(9) > a{ transition-delay: .18s; }
body.wbs-menu-open .wbs-menu__list > li:nth-child(10) > a{ transition-delay: .20s; }
/* === END MENU ICONS === */
