/* Imagine IT Games — wspólny motyw (klimat karczmy). Zero zależności zewnętrznych. */
:root{
  --bg:#17100a; --bg2:#1f160c;
  --panel:#271a0e; --panel2:#2f2010;
  --border:#4a3217; --border-soft:#3a2713;
  --gold:#e4bd58; --gold2:#d3a03c; --gold-deep:#b9842b;
  --cream:#f1e7d3; --muted:#c6b091; --muted2:#9c8569;
  --ok:#8fbf6a;
  --shadow:0 12px 34px rgba(0,0,0,.5);
  --radius:14px;
  --maxw:1000px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  color:var(--cream);
  background:
    radial-gradient(1200px 600px at 50% -10%, #3a2613 0%, rgba(58,38,19,0) 60%),
    linear-gradient(180deg,#1f160c 0%, #17100a 100%);
  background-attachment:fixed;
  line-height:1.6;
  min-height:100vh;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--cream)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 18px}

/* Pasek górny */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;max-width:var(--maxw);margin:0 auto}
.brand{display:flex;align-items:center;gap:10px;font-size:15px;letter-spacing:.5px;color:var(--muted)}
.brand b{color:var(--cream)}
.brand .dot{color:var(--gold)}
.langsw{display:flex;gap:6px}
.langsw button{
  font-family:inherit;font-size:13px;font-weight:700;letter-spacing:.5px;
  background:transparent;color:var(--muted);border:1px solid var(--border);
  border-radius:999px;padding:6px 14px;cursor:pointer;transition:.15s
}
.langsw button:hover{color:var(--cream);border-color:var(--gold-deep)}
.langsw button.active{background:var(--gold2);color:#201203;border-color:var(--gold2)}

/* Hero */
.hero{max-width:var(--maxw);margin:6px auto 0;padding:0 18px}
.hero-img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border-soft)}
.hero-sub{font-size:clamp(18px,3.4vw,24px);color:var(--cream);margin:18px 0 6px;text-align:center}
.hero-tag{color:var(--muted);text-align:center;margin:0 0 20px;font-size:clamp(14px,2.6vw,17px)}

/* Przyciski / badge */
.cta{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin:8px 0 6px}
.play-badge{
  display:inline-flex;align-items:center;gap:12px;
  background:linear-gradient(180deg,#2d1f10,#241709);
  border:1px solid var(--gold-deep);border-radius:12px;
  padding:12px 22px;color:var(--cream);font-size:16px;font-weight:700;
  box-shadow:var(--shadow);opacity:.96
}
.play-badge .ic{font-size:26px;line-height:1}
.play-badge small{display:block;font-weight:400;font-size:12px;color:var(--muted);letter-spacing:.5px}
.play-badge.soon{cursor:default}

/* Sekcje / karty */
section{max-width:var(--maxw);margin:34px auto;padding:0 18px}
.card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--border-soft);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 24px}
h1,h2,h3{font-weight:700;color:var(--cream);line-height:1.25}
.sec-title{font-size:clamp(20px,3.6vw,26px);margin:0 0 14px;color:var(--gold);letter-spacing:.3px}
.sec-title::after{content:"";display:block;width:78px;height:4px;background:var(--gold2);border-radius:3px;margin-top:10px}
.desc h2{font-size:clamp(16px,2.8vw,19px);color:var(--gold);letter-spacing:.6px;margin:22px 0 6px;text-transform:uppercase}
.desc h2:first-of-type{margin-top:6px}
.desc p{margin:0 0 4px;color:var(--cream)}
.desc .intro{font-size:clamp(16px,2.8vw,19px);color:var(--cream);margin-bottom:10px}
.desc ul{margin:6px 0 0;padding-left:20px;color:var(--cream)}
.desc ul li{margin:4px 0}
.credit{color:var(--muted);font-style:italic;margin-top:18px}

/* Galeria */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.gallery button{padding:0;border:1px solid var(--border-soft);background:#120c06;border-radius:10px;overflow:hidden;cursor:zoom-in;transition:.18s}
.gallery button:hover{border-color:var(--gold-deep);transform:translateY(-2px)}
.gallery img{width:100%;aspect-ratio:16/9;object-fit:cover}

/* Info */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;list-style:none;margin:0;padding:0}
.facts li{background:#1d130a;border:1px solid var(--border-soft);border-radius:10px;padding:14px 16px}
.facts b{display:block;color:var(--gold);font-size:14px;letter-spacing:.4px;margin-bottom:2px}
.facts span{color:var(--cream);font-size:15px}

/* Indeks gier */
.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.game-tile{display:flex;gap:16px;align-items:center;background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--border-soft);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;transition:.18s}
.game-tile:hover{transform:translateY(-3px);border-color:var(--gold-deep)}
.game-tile img{width:84px;height:84px;border-radius:16px;border:1px solid var(--border);flex:0 0 auto}
.game-tile .t{font-size:19px;color:var(--cream);margin:0 0 4px}
.game-tile .d{font-size:14px;color:var(--muted);margin:0}

/* Stopka */
footer{border-top:1px solid var(--border-soft);margin-top:40px;background:rgba(0,0,0,.2)}
footer .wrap{padding:26px 18px;color:var(--muted);font-size:14px;text-align:center}
footer a{color:var(--gold)}
footer .links{margin:0 0 8px}
footer .links a{margin:0 10px}

/* Polityka prywatności (czytelna) */
.legal{max-width:820px;margin:26px auto;padding:0 18px}
.legal .card{padding:30px 28px}
.legal h1{font-size:clamp(22px,4vw,28px);color:var(--gold);margin:0 0 4px}
.legal h2{font-size:clamp(17px,3vw,20px);color:var(--gold);margin:26px 0 6px}
.legal .meta{color:var(--muted);font-size:14px;margin:0 0 6px}
.legal p,.legal li{color:var(--cream)}
.legal code{background:#120c06;border:1px solid var(--border-soft);border-radius:5px;padding:1px 6px;font-size:.92em;color:var(--gold)}
.legal hr{border:0;border-top:1px solid var(--border);margin:36px 0}

/* Lightbox (vanilla, bez zależności) */
.lb{position:fixed;inset:0;background:rgba(10,6,2,.92);display:none;align-items:center;justify-content:center;z-index:9999;padding:20px;cursor:zoom-out}
.lb.open{display:flex}
.lb img{max-width:96vw;max-height:92vh;border-radius:10px;border:1px solid var(--border)}
.lb .x{position:absolute;top:14px;right:18px;color:var(--cream);font-size:34px;line-height:1;cursor:pointer}

/* Przełącznik języka — pokazywanie treści */
[data-lang="en"]{display:none}
html.lang-en [data-lang="pl"]{display:none}
html.lang-en [data-lang="en"]{display:revert}

@media (max-width:560px){
  .card{padding:20px 16px}
  .game-tile{flex-direction:column;text-align:center}
}