@import url('https://fonts.googleapis.com/css2?family=Metamorphous&family=Pirata+One&family=Grenze+Gotisch:wght@500;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,500&display=swap');
:root{--bg:#14100f;--p:#ecdfc6;--violet:#8c1f16;--blood:#8c1f16;--amber:#c9622f;--brass:#c8892f;--parch:#d9c9a3;--parch-ink:#2b211a;--ember:#c9622f;--line:#4a392c}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--p);font-family:Georgia,serif}.page{overflow:hidden;background:radial-gradient(circle at 85% 5%,#4c284f33,transparent 28%),#160f19}.wrap{width:min(1180px,calc(100% - 48px));margin:auto}.bar{min-height:70px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(74,57,44,.55);font:700 .65rem Arial;letter-spacing:.13em}.bar a{color:var(--p);text-decoration:none}.bar a:last-child{color:var(--violet)}.bar span{color:#bda5bb}.hero{position:relative;min-height:650px;padding-top:80px;background:linear-gradient(90deg,#160f19ee 0%,#160f19a6 45%,#160f1944),url('../assets/cien-demonow-hero-background.webp') center/cover}.eyebrow{color:var(--violet);font:700 .66rem Arial;letter-spacing:.16em}.hero h1{max-width:800px;margin:35px 0 0;font:400 clamp(4rem,10vw,9rem)/.8 Impact,sans-serif;letter-spacing:-.04em}.hero h1 em{color:var(--ember);font-style:normal}.hook{max-width:650px;margin:38px 0 20px;font-size:1.45rem;line-height:1.45}.tags{display:flex;gap:8px;flex-wrap:wrap}.tags span{border:1px solid var(--violet);padding:7px 9px;font:700 .6rem Arial;letter-spacing:.1em}.omen{position:absolute;right:12%;bottom:70px;width:290px;padding:23px;background:rgba(31,24,19,.92);border:1px solid var(--violet);box-shadow:8px 8px 0 rgba(201,98,47,.42)}.omen b{color:var(--ember);letter-spacing:.13em}.omen p{border-bottom:1px solid #4a392c;padding-bottom:9px;font-size:.9rem}.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;padding:110px 0}.split h2,.gallery h2,.warning h2{margin:12px 0;font-size:clamp(2.7rem,5vw,4.8rem);line-height:.95;font-weight:400}.split p{font-size:1.05rem;line-height:1.7}.split .lead{font-size:1.3rem;color:#fff0d9}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.cards article{min-height:245px;padding:25px;border:1px solid var(--line);background:#26182b}.cards span{color:var(--ember);font:700 .65rem Arial}.cards h3{margin:45px 0 10px;font-size:1.5rem}.cards p{line-height:1.55;color:#d9c6d0}.quote{margin:105px 0;padding:65px 20px;background:var(--violet);color:#180d1e;text-align:center;font-size:clamp(1.8rem,3vw,3rem)}.gallery{padding:100px 0;background:#211526}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:35px}.grid button{height:430px;padding:0;border:1px solid var(--violet);background:#000;cursor:zoom-in}.grid img{width:100%;height:100%;object-fit:cover}.warning{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;padding:92px 0;border-bottom:1px solid var(--line)}.warning p:last-child{font-size:1.1rem;line-height:1.6}.footer{display:flex;justify-content:space-between;padding:25px 0;color:#bda5bb;font:700 .6rem Arial;letter-spacing:.12em}.footer a{color:var(--violet);text-decoration:none}.lightbox{max-width:1100px;max-height:90vh;border:1px solid var(--violet);background:#211526;color:var(--p)}.lightbox img{max-width:100%;max-height:75vh}.lightbox-close{float:right;background:none;border:0;color:white;font-size:2rem}@media(max-width:700px){.wrap{width:calc(100% - 32px)}.bar span{display:none}.omen{position:static;margin:40px auto;width:auto}.hero{padding-bottom:55px}.split,.warning{grid-template-columns:1fr;gap:30px;padding:70px 0}.cards{grid-template-columns:1fr}.grid{grid-template-columns:1fr}.footer{flex-direction:column;gap:12px}}

/* --- Typografia: Gotycki manuskrypt (Grenze Gotisch + Cormorant Garamond) --- */
.hero h1,.hero h1 em,.split h2,.gallery h2,.warning h2,.cards h3{font-family:'Grenze Gotisch',serif!important}
body,.eyebrow,.hook,.split .lead,.tags span,.quote,.cards p,p{font-family:'Cormorant Garamond',Georgia,serif!important}
.hero h1{line-height:1.0!important;letter-spacing:.01em!important}
.split h2,.gallery h2,.warning h2{line-height:1.1!important}

/* --- suwaki-dodane --- */
.omen [data-scale]{margin:2px 0;font-size:.85rem;opacity:.9}

/* tytul strony: Pirata One */
.hero h1, .hero h1 em {
  font-family: "Pirata One", "Grenze Gotisch", serif !important;
  letter-spacing: .02em !important;
  line-height: 1.14 !important;
}

/* wszystkie naglowki: Pirata One */
.hero h1, .hero h1 em,
.split h2, .gallery h2, .warning h2,
.cards h3 {
  font-family: "Pirata One", "Grenze Gotisch", serif !important;
  letter-spacing: .02em !important;
}
.split h2, .gallery h2, .warning h2 { line-height: 1.16 !important; }
.cards h3 { line-height: 1.2 !important; }

/* ---- Trigery: panel w jezyku .omen (fioletowa ramka + ognisty cien) ---- */
.warning{display:block!important;padding:64px 0 74px!important}
.warning>div{
  position:relative;max-width:640px;padding:24px 26px 22px;
  background:rgba(31,24,19,.92);border:1px solid var(--violet);box-shadow:8px 8px 0 rgba(201,98,47,.42);
}
.warning>div::before{
  position:absolute;top:-1px;left:-1px;right:-1px;height:3px;
  background:linear-gradient(90deg,var(--ember),transparent 72%);content:"";
}
.warning h2{
  margin:0 0 10px!important;color:var(--ember)!important;
  font-size:1.34rem!important;line-height:1.22!important;letter-spacing:.02em!important;
}
.warning>div>p{
  max-width:58ch!important;margin:0!important;color:#efe2cd!important;
  font-size:1.02rem!important;line-height:1.6!important;
}
@media(max-width:800px){.warning{padding:46px 0 56px!important}.warning>div{max-width:100%;padding:20px;box-shadow:6px 6px 0 rgba(201,98,47,.35)}}

/* ============================================================
   KARTY: bestiariusz na pergaminie (zamiast neonowych ramek)
   ============================================================ */
.cards { counter-reset: card; }
.cards article {
  counter-increment: card;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 14px;
  align-items: baseline;
  min-height: 0;
  padding: 22px 24px 20px;
  border: 0;
  border-left: 3px solid var(--blood);
  background: var(--parch);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.4);
}
.cards article::before {
  grid-column: 1;
  grid-row: 1;
  color: var(--blood);
  font-family: "Pirata One", "Grenze Gotisch", serif;
  font-size: 2.1rem;
  line-height: 1;
  content: counter(card, upper-roman);
}
.cards article span { display: none; }
.cards h3 {
  grid-column: 2;
  grid-row: 1;
  margin: 0 !important;
  color: var(--parch-ink) !important;
  font-size: 1.24rem !important;
  line-height: 1.2 !important;
}
.cards p {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 12px 0 0 !important;
  padding-top: 11px;
  border-top: 1px solid rgba(140, 31, 22, 0.32);
  color: #3b3026 !important;
  font-size: 1rem;
  line-height: 1.55;
}

/* --- reszta strony: zamiana fioletu na krew/bursztyn --- */
.eyebrow { color: var(--amber) !important; }
.tags span { border-color: rgba(201, 98, 47, 0.6) !important; color: #e6d6bd !important; }
.quote { background: var(--blood) !important; color: var(--parch) !important; }
.omen { border-color: var(--amber) !important; box-shadow: 8px 8px 0 rgba(201, 98, 47, 0.4) !important; }

/* ============================================================
   KARTA OMEN: pergamin, spojna z kartami bestiariusza
   ============================================================ */
.omen {
  width: 300px;
  padding: 20px 22px 18px !important;
  border: 0 !important;
  border-left: 3px solid var(--blood) !important;
  background: var(--parch) !important;
  color: var(--parch-ink) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.45) !important;
}
.omen b {
  display: block;
  margin-bottom: 12px;
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(140, 31, 22, 0.32);
  color: var(--blood) !important;
  font: 700 0.62rem/1 "Cormorant Garamond", Georgia, serif;
  letter-spacing: 0.18em !important;
  text-transform: uppercase;
}
.omen p {
  margin: 0 0 9px;
  padding-bottom: 9px !important;
  border-bottom: 1px solid rgba(140, 31, 22, 0.18) !important;
  color: #3b3026 !important;
  font-size: 0.9rem !important;
  line-height: 1.45;
}
.omen [data-scale] {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  margin: 0 !important;
  padding-bottom: 6px !important;
  border-bottom: 1px dotted rgba(140, 31, 22, 0.28) !important;
  font-size: 0.82rem !important;
  opacity: 1 !important;
}
.omen [data-scale]:last-child { border-bottom: 0 !important; padding-bottom: 0 !important; }

/* OMEN: wieksza typografia na pergaminie */
.omen { width: 340px; padding: 24px 26px 22px !important; }
.omen b { margin-bottom: 14px; padding-bottom: 11px; font-size: 0.74rem !important; letter-spacing: 0.16em !important; }
.omen p { margin: 0 0 11px; padding-bottom: 11px !important; font-size: 1.04rem !important; line-height: 1.5 !important; }
.omen [data-scale] { padding-bottom: 8px !important; font-size: 0.98rem !important; }
@media (max-width: 800px) { .omen { width: auto; } }