/* =====================================================================
   FAZA 2 · SCENA
   Nowa warstwa obrazu. Każda ciemna sekcja dostaje własne tło
   fotograficzne, dobrane do treści, przyciemnione tak, żeby tekst
   pozostał czytelny (kontrast ≥ 7:1 na papierze wobec granatu).

   Zdjęcia leżą w katalogu motywu, nie w bibliotece mediów — dzięki temu
   nie zależą od pól ACF i nie znikną przy porządkach w panelu.
   Dekoracyjne obrazy z pól ACF chowamy, bo pełniły dokładnie tę rolę.
   ===================================================================== */

:root{
  --c-scena-cien: linear-gradient(180deg, rgba(9,20,34,.90), rgba(9,20,34,.965));
}

/* ── wspólny mechanizm tła sekcyjnego ───────────────────────────────── */
.c-scena{position:relative;isolation:isolate;overflow:hidden}
.c-scena::after{
  content:"";position:absolute;inset:0;z-index:-2;
  background-size:cover;background-position:center;
  opacity:.42;filter:saturate(.55) contrast(1.05);
}
.c-scena::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:var(--c-scena-cien);
}

/* ── HERO · Temida ──────────────────────────────────────────────────── */
.c-hero{
  min-height:min(88vh,820px)!important;
  padding-block:clamp(4rem,7vw,6.5rem) clamp(0rem,2vw,1.5rem)!important;
}
.c-hero::before{
  background:
    radial-gradient(72% 58% at 84% 26%, rgba(200,155,60,.20), transparent 62%),
    radial-gradient(90% 70% at 8% 0%,   rgba(24,48,74,.75),   transparent 58%),
    linear-gradient(180deg, transparent 52%, rgba(7,16,27,.62) 100%);
}

/* fotografia wychodzi poza prawą krawędź i rozpływa się w granacie */
.c-hero__art{
  position:absolute;inset:-4% -4% -4% auto;width:min(56%,720px);z-index:-1;
  display:flex;align-items:center;justify-content:flex-end;pointer-events:none;
  will-change:transform;
}
.c-hero__art img{
  width:100%;height:100%;object-fit:cover;object-position:62% center;
  opacity:.62;filter:contrast(1.06) brightness(1.02) saturate(.85);
  -webkit-mask-image:linear-gradient(100deg,transparent 2%,#000 46%,#000 88%,transparent 100%);
          mask-image:linear-gradient(100deg,transparent 2%,#000 46%,#000 88%,transparent 100%);
}
/* delikatna winieta, żeby nagłówek zawsze leżał na spokojnym tle */
.c-hero__art::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, var(--c-ink) 0%, rgba(12,26,43,.55) 34%, transparent 68%);
}

/* pas atutów: cztery kolumny oddzielone włosową linią */
.c-hero__atuty{
  max-width:1320px;margin:clamp(2.2rem,4vw,3.2rem) auto 0;
  padding-inline:clamp(1.25rem,5vw,4.5rem);position:relative;z-index:1;
}
.c-hero__list{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0!important;margin:0!important;padding:0!important;list-style:none!important;
  border-top:1px solid rgba(200,155,60,.22);
}
.c-hero__list li,.c-hero .hero-text-content__list-item{
  padding:1.35rem clamp(.9rem,2vw,1.7rem) 0 0!important;
  margin:0!important;border-right:1px solid rgba(200,155,60,.1);
  display:flex;flex-direction:column;gap:.55rem;
}
.c-hero__list li::before{display:none!important}
.c-hero__list li:last-child{border-right:0}
.c-hero__znum{
  font-family:var(--c-mono);font-size:var(--t-label);letter-spacing:.18em;
  color:var(--c-gold);
}
.c-hero__ztxt{
  color:#A7B4C0;font-size:.88rem;line-height:1.55;display:block;
}

/* pasek liczb pod hero */
.c-hero__ticker{
  margin-top:clamp(2.2rem,4vw,3.4rem)!important;
  border-top:1px solid rgba(200,155,60,.22);
  position:relative;z-index:1;
}
.c-tick{padding-block:1.35rem 0!important}

/* ── REPERTORIUM · archiwum akt ─────────────────────────────────────── */
.c-wyroki::after{
  content:"";position:absolute;inset:0;z-index:-2;
  background:url("../img/archiwum.webp") center/cover no-repeat;
  opacity:.40;filter:saturate(.5);
}
.c-wyroki::before{
  background:linear-gradient(180deg, rgba(9,20,34,.88) 0%, rgba(9,20,34,.955) 55%, rgba(9,20,34,.985) 100%)!important;
}
.c-wyroki__bg{display:none!important}

/* ── WSPARCIE · pusta sala sądowa ───────────────────────────────────── */
.c-wsparcie::after{
  content:"";position:absolute;inset:0;z-index:-2;
  background:url("../img/sala-sadowa.webp") center 30%/cover no-repeat;
  opacity:.38;filter:saturate(.5);
}
.c-wsparcie::before{
  background:linear-gradient(180deg, rgba(9,20,34,.90), rgba(9,20,34,.975))!important;
}
.c-wsparcie__bg{display:none!important}

/* ── FUNDACJA · kwiat na granatowym lnie ────────────────────────────── */
.c-fund::after{
  content:"";position:absolute;inset:0;z-index:-2;
  background:url("../img/kwiat.webp") right center/cover no-repeat;
  opacity:.55;
}
.c-fund::before{
  background:linear-gradient(90deg, rgba(15,31,50,.97) 0%, rgba(15,31,50,.88) 42%, rgba(15,31,50,.55) 100%)!important;
}
.c-fund__bg{display:none!important}
.c-fund__grid{align-items:center}
.c-fund__portret img{
  filter:grayscale(.35) contrast(1.05);
  border:1px solid rgba(200,155,60,.25);
}

/* ── JAK POMAGAMY · kadr w ramie ────────────────────────────────────── */
.c-pomoc .c-frame::after{
  inset:16px -16px -16px 16px;border-color:rgba(200,155,60,.5);
}
.c-pomoc .c-frame img{filter:saturate(.8) contrast(1.04)}
/* gdy w polu nie ma ani zdjęcia, ani filmu — wchodzi kadr z narady */
.c-pomoc__media:empty{
  aspect-ratio:4/3;
  background:url("../img/narada.webp") center/cover no-repeat;
  border:1px solid rgba(200,155,60,.28);
}

/* ── STOPKA · panorama o zmierzchu ──────────────────────────────────── */
.footer-top{position:relative;isolation:isolate}
.footer-top::after{
  content:"";position:absolute;inset:0;z-index:-2;
  background:url("../img/panorama.webp") center 35%/cover no-repeat;
  opacity:.34;filter:saturate(.6);
}
.footer-top::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg, rgba(9,20,34,.93), rgba(9,20,34,.98));
}
.footer-top__bg,.footer-top__path{display:none!important}

/* ── ikony konturowe zamiast rastrowych plam ────────────────────────── */
.c-ico{width:100%;height:100%;display:block;stroke-width:1.4;vector-effect:non-scaling-stroke}
.c-ikona{
  width:40px;height:40px;flex:none;color:var(--c-gold);
  display:grid;place-items:center;padding:8px;
  border:1px solid rgba(200,155,60,.32);
  transition:border-color .45s var(--c-ex),color .45s var(--c-ex),background .45s var(--c-ex);
}
.c-ikona--jasna{color:var(--c-gold-lo);border-color:rgba(126,95,31,.3)}
:is(.c-gwar__box,.c-wsp,.c-atut):hover .c-ikona{
  border-color:var(--c-gold);background:rgba(200,155,60,.08);
}

/* stare ikony rastrowe: gasimy tam, gdzie wstawiamy własne */
.c-stat__ico,.c-gwar__ico,.c-wsp__ico img{display:none!important}

/* ── ograniczenia mobilne ───────────────────────────────────────────── */
@media(max-width:1024px){
  .c-hero__list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c-hero__list li:nth-child(2n){border-right:0}
  .c-hero__list li:nth-child(-n+2){padding-bottom:1.35rem!important;
    border-bottom:1px solid rgba(200,155,60,.1)}
}
@media(max-width:760px){
  .c-hero{min-height:0!important;padding-block:3rem 0!important}
  .c-hero__art{inset:0 -22% auto auto;width:78%;height:100%}
  .c-hero__art img{opacity:.3}
  .c-hero__list{grid-template-columns:1fr}
  .c-hero__list li{border-right:0;padding-bottom:1.2rem!important;
    border-bottom:1px solid rgba(200,155,60,.1)}
  .c-hero__list li:last-child{border-bottom:0}
  .c-fund::after{opacity:.28}
  .c-fund::before{background:linear-gradient(180deg,rgba(15,31,50,.94),rgba(15,31,50,.98))!important}
}
