/* RiftWorld — Baza wiedzy. Hero jak w katalogu + układ schodkowy (zigzag). */

/* ---- Hero z tłem (mistyczna biblioteka) ---- */
.rwk-hero--kb{position:relative;background:var(--rw-bg);margin-bottom:0;overflow:visible}
.rwk-hero--kb::before{content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(8,11,18,.58), rgba(8,11,18,.5) 40%, rgba(8,11,18,.92) 88%, var(--rw-bg) 100%),
    url("../img/kb-hero.jpg") center 42%/cover no-repeat;}

/* ---- Szybkie linki w hero (kotwice do sekcji) ---- */
.rwk-hero__links{margin-top:clamp(20px,3vw,30px)}
.rwk-hero__links-label{display:block;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--rw-muted);margin-bottom:13px;text-shadow:0 2px 10px rgba(0,0,0,.6)}
.rwk-hero__links-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.rwk-quicklink{display:inline-flex;align-items:center;gap:8px;padding:11px 24px;border-radius:999px;
  font-weight:600;font-size:15px;text-decoration:none;color:var(--rw-text);
  background:rgba(70,200,255,.10);border:1px solid rgba(230,197,116,.38);
  box-shadow:0 6px 20px rgba(0,0,0,.35);transition:transform .18s,background .18s,border-color .18s,color .18s}
.rwk-quicklink span{color:var(--rw-cyan);transition:transform .18s}
.rwk-quicklink:hover{transform:translateY(-2px);color:#fff;border-color:var(--rw-cyan);background:rgba(70,200,255,.18)}
.rwk-quicklink:hover span{transform:translateY(2px)}

/* Płynne przewijanie + odstęp pod przyklejonym paskiem przy skoku do kotwicy */
html{scroll-behavior:smooth}
#zasady-gry,#mechaniki{scroll-margin-top:90px}

/* ---- Sekcje ---- */
.rwk-kb{padding-bottom:56px}
.rwk-kb__section{margin-top:clamp(30px,5vw,58px)}
/* Pierwsza sekcja bliżej hero (mniejszy odstęp na desktopie) */
.rwk-kb__section:first-child{margin-top:clamp(16px,2.4vw,26px)}
.rwk-kb__lead{max-width:760px;margin:0 auto clamp(22px,4vw,40px);text-align:center}
.rwk-kb__h2{font-size:clamp(26px,4.4vw,40px);line-height:1.08;margin:0 0 12px}
.rwk-kb__intro{color:var(--rw-muted);font-size:clamp(15px,1.6vw,17px);line-height:1.6;margin:0}

/* ---- Wiersze schodkowe ---- */
.rwk-kb__rows{display:flex;flex-direction:column;gap:clamp(26px,4.5vw,56px)}
.rwk-kb__row{display:grid;grid-template-columns:minmax(0,300px) 1fr;
  gap:clamp(22px,4vw,52px);align-items:center}
/* parzyste wiersze: obraz po prawej (wąska kolumna), tekst po lewej (szeroka) —
   trzeba przełączyć TAKŻE szerokości kolumn, nie tylko kolejność. */
.rwk-kb__row:nth-child(even){grid-template-columns:1fr minmax(0,300px)}
.rwk-kb__row:nth-child(even) .rwk-kb__media{order:2}
.rwk-kb__row:nth-child(even) .rwk-kb__text{order:1;text-align:right}
.rwk-kb__row:nth-child(even) .rwk-kb__reminder{flex-direction:row-reverse;margin-left:auto}
.rwk-kb__row:nth-child(even) .rwk-kb__badge{margin-left:auto}

/* ---- Obraz karty ---- */
.rwk-kb__media{display:flex;justify-content:center}
.rwk-kb__card{display:block;line-height:0;position:relative;transition:transform .25s ease}
.rwk-kb__card:hover{transform:translateY(-6px) rotate(-.4deg)}
.rwk-kb__media img{width:100%;max-width:300px;height:auto;border-radius:16px;
  box-shadow:0 18px 44px rgba(0,0,0,.55), 0 0 0 1px rgba(230,197,116,.18);
  background:rgba(255,255,255,.02)}
.rwk-kb__card::after{content:"";position:absolute;inset:0;border-radius:16px;
  box-shadow:inset 0 0 60px rgba(70,200,255,.06);pointer-events:none}

/* ---- Blok tekstu ---- */
.rwk-kb__text{min-width:0}
.rwk-kb__badge{display:inline-block;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--rw-gold);
  border:1px solid rgba(230,197,116,.35);border-radius:999px;padding:3px 11px;margin-bottom:12px}
.rwk-kb__name{font-size:clamp(22px,2.9vw,32px);line-height:1.12;margin:0 0 12px}
.rwk-kb__reminder{display:flex;width:fit-content;max-width:100%;align-items:flex-start;gap:9px;
  margin:0 0 13px;padding:11px 15px;border-radius:12px;
  background:rgba(70,200,255,.06);border:1px solid rgba(70,200,255,.16);
  color:var(--rw-text);font-style:italic;font-size:14.5px;line-height:1.5}
.rwk-kb__reminder-ic{color:var(--rw-cyan);font-style:normal;font-size:20px;line-height:1;flex:none;opacity:.8}
.rwk-kb__desc{color:var(--rw-muted);font-size:clamp(15px,1.55vw,16.5px);line-height:1.65;margin:0 0 16px}
.rwk-kb__desc--more{margin-top:-4px;opacity:.92}
.rwk-kb__more{display:inline-flex;align-items:center;gap:7px;
  font-size:14px;font-weight:600;color:var(--rw-gold);text-decoration:none;
  border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.rwk-kb__more:hover{color:#fff;border-color:var(--rw-cyan)}
.rwk-kb__row:nth-child(even) .rwk-kb__more{flex-direction:row-reverse}

/* ---- Stopka ---- */
.rwk-kb__foot{margin:clamp(36px,6vw,64px) auto 0;max-width:720px;text-align:center;
  color:var(--rw-muted);font-size:13px;opacity:.75}

/* ---- Mobile: stos, obraz zawsze na górze ---- */
@media (max-width:760px){
  /* Każdy wiersz: grafika na górze, tekst niżej i WYŚRODKOWANY (jak wyśrodkowane obrazy);
     hero zostaje bez zmian. Selektory z :nth-child(even) muszą mieć równą specyficzność,
     by pobić reguły desktopu (inaczej co druga sekcja się „mieszała"). */
  .rwk-kb__row,
  .rwk-kb__row:nth-child(even){grid-template-columns:1fr;gap:16px}
  .rwk-kb__row .rwk-kb__media,
  .rwk-kb__row:nth-child(even) .rwk-kb__media{order:1}
  .rwk-kb__row .rwk-kb__text,
  .rwk-kb__row:nth-child(even) .rwk-kb__text{order:2;text-align:center}
  .rwk-kb__row .rwk-kb__reminder,
  .rwk-kb__row:nth-child(even) .rwk-kb__reminder{flex-direction:row;margin-left:auto;margin-right:auto}
  .rwk-kb__row:nth-child(even) .rwk-kb__more{flex-direction:row}
  .rwk-kb__media img{max-width:240px}
}

/* Sekcja „Zacznij grać" - linkowanie wewnętrzne na dole bazy wiedzy */
.rwk-kb__cta{margin:48px 0 8px}
.rwk-kb__ctagrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.rwk-kb__ctacard{display:flex;flex-direction:column;gap:6px;padding:18px 20px;border:1px solid var(--rw-border,rgba(255,255,255,.12));border-radius:14px;background:var(--rw-card,rgba(255,255,255,.03));text-decoration:none;transition:border-color .15s,transform .15s,background .15s}
.rwk-kb__ctacard:hover{border-color:var(--rw-gold,#e6c574);transform:translateY(-2px);background:rgba(230,197,116,.06)}
.rwk-kb__ctacard-h{font-weight:700;font-size:clamp(16px,1.7vw,18px);color:var(--rw-fg,#eef2fb)}
.rwk-kb__ctacard-d{color:var(--rw-muted);font-size:14.5px;line-height:1.55}
@media(max-width:760px){.rwk-kb__ctagrid{grid-template-columns:1fr}}
.rwk-kb__row{scroll-margin-top:90px}