:root{
  --hero_font: "Arsenal", Arial, sans-serif;
}

/* ===== RESET / BAZA ===== */
html,
body{
  margin:0;
  padding:0;
  height:100%;
  background:#828282;
  font-family: var(--hero_font);
  overflow-x:hidden;
}

/* ===== SEKCJA HERO ===== */
.hero_section{
  position:relative;
  width:100vw;
  height:100vh;
  overflow:hidden;
}

/* ===== TŁO HERO ===== */
.hero_bg{
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, #0b0f12 0%, #ffffff 100%);
  transform: scale(1.02);
  overflow:hidden;
  z-index:0;
  transition: opacity 0.35s ease;
}

.hero_bg::before{
  content:"";
  position:absolute;
  inset:0;
  background: url("img/hero_bg.png") center center / cover no-repeat;
  opacity:0.66;
  pointer-events:none;
}

.hero_bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(
      1200px 620px at 50% 35%,
      rgba(0,0,0,0.02) 0%,
      rgba(0,0,0,0.152) 70%,
      rgba(0,0,0,0.24) 100%
    ),
    linear-gradient(
      90deg,
      rgba(0,0,0,0.168) 0%,
      rgba(0,0,0,0.032) 20%,
      rgba(0,0,0,0.032) 80%,
      rgba(0,0,0,0.168) 100%
    );
  pointer-events:none;
}

/* ===== WRAPPER DLA LIVE ===== */
.live_wrapper{
  position:absolute;
  inset:0;
  z-index:1;
  background:#000;
  overflow:hidden;
}

.live_wrapper iframe{
  width:100%;
  height:100%;
  border:0;
  background:#000;
}

/* ===== OVERLAY / TREŚĆ ===== */
.hero_overlay{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:36px 44px;
  box-sizing:border-box;
  background: linear-gradient(180deg, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.04) 45%, rgba(0,0,0,0.14) 100%);
  transition: background 0.35s ease;
}

.hero_center{
  width:min(1320px, 92vw);
  text-align:center;
  margin-top:12px;
  transform: translateY(-15vh);
}

.hero_kicker{
  font-weight:700;
  letter-spacing:2px;
  font-size: clamp(1.9rem, 2.2vw, 2.6rem);
  color:rgba(245,246,247,0.90);
  text-shadow:0 8px 26px rgba(0,0,0,0.55);
}

.hero_title{
  margin:16px 0 0 0;
  font-family:"Cormorant Garamond", serif;
  font-weight:600;
  font-size: clamp(3rem, 5.6vw, 6.2rem);
  line-height:1.03;
  color:#f5f6f7;
  text-shadow:0 12px 40px rgba(0,0,0,0.60);
}

/* ===== DOLNE ELEMENTY ===== */
.hero_bottom{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.hero_partners{
  position:absolute;
  left:120px;
  bottom:95px;
  display:flex;
  flex-direction:column;
  gap:14px;
  max-width:56vw;
  pointer-events:auto;
}

.hero_partners_label{
  font-weight:700;
  letter-spacing:1px;
  font-size:1.05rem;
  color:rgba(245,246,247,0.90);
  text-shadow:0 8px 24px rgba(0,0,0,0.55);
}

.hero_partners_logos{
  display:flex;
  align-items:center;
  gap:28px;
  flex-wrap:wrap;
}

.partner_logo{
  height:86px;
  width:auto;
  max-width:260px;
  object-fit:contain;
  filter: drop-shadow(0 10px 22px rgba(0,0,0,0.38));
  opacity:0.98;
}

.partner_ppp{
  height:98px;
}

.partner_wsg{
  height:84px;
  transform: scale(1.08);
  transform-origin:left center;
}

.partner_wszp{
  height:84px;
  transform: scale(1.05);
  transform-origin:left center;
}

.partner_powiat{
  height:90px;
  transform: scale(1.18);
  transform-origin:left center;
}

/* ===== PRZYCISK LIVE NA TELEFONIE ===== */
.hero_online{
  position:absolute;
  right:18px;
  bottom:18px;
  display:none;
  align-items:center;
  justify-content:center;
  pointer-events:auto;
}

.hero_live_btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:220px;
  max-width:88vw;
  padding:16px 24px;
  border:none;
  border-radius:999px;
  background:rgba(255,255,255,0.96);
  color:#1b2a33;
  text-decoration:none;
  font-weight:700;
  font-size:1.05rem;
  letter-spacing:0.2px;
  box-shadow:0 14px 40px rgba(0,0,0,0.26);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.hero_live_btn:hover{
  transform: translateY(-1px);
  box-shadow:0 18px 46px rgba(0,0,0,0.30);
  background:#ffffff;
}

/* ===== BADGE LIVE ===== */
.hero_live_badge{
  position:absolute;
  top:26px;
  right:28px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:999px;
  background:rgba(168, 24, 24, 0.96);
  color:#fff;
  font-size:0.95rem;
  font-weight:700;
  letter-spacing:1px;
  box-shadow:0 12px 32px rgba(0,0,0,0.28);
}

.hero_live_badge[hidden]{
  display:none !important;
}

/* ===== STAN LIVE ===== */
.hero_section.is_live .hero_bg{
  opacity:0;
  pointer-events:none;
}

.hero_section.is_live .hero_overlay{
  background: linear-gradient(180deg, rgba(0,0,0,0.18) 0%, rgba(0,0,0,0.06) 45%, rgba(0,0,0,0.18) 100%);
}

/* ===== KOMUNIKAT PODCZAS LIVE ===== */
.live_event_msg{
  margin:0 0 18px 0;
  padding:16px 18px;
  border-radius:18px;
  background:rgba(98,57,29,0.10);
  color:#62391D;
  font-weight:700;
  line-height:1.45;
  box-shadow:0 10px 24px rgba(0,0,0,0.08);
}

/* ===== EKRAN KOŃCOWY ===== */
.ending_section{
  display:none;
  min-height:100vh;
  width:100%;
  background:
    linear-gradient(180deg, rgba(11,15,18,0.70) 0%, rgba(11,15,18,0.82) 100%),
    url("img/hero_bg.png") center center / cover no-repeat;
}

.ending_section.show{
  display:flex;
  align-items:center;
  justify-content:center;
}

.ending_overlay{
  width:min(900px, calc(100vw - 40px));
  padding:48px 32px;
  border-radius:28px;
  background:rgba(255,255,255,0.10);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  text-align:center;
  box-shadow:0 18px 50px rgba(0,0,0,0.28);
}

.ending_overlay h2{
  margin:0 0 14px 0;
  color:#fff;
  font-family:"Cormorant Garamond", serif;
  font-size: clamp(2.4rem, 5vw, 4rem);
  line-height:1.08;
}

.ending_overlay p{
  margin:0;
  color:rgba(255,255,255,0.92);
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  line-height:1.55;
}

/* ===== RESPONSYWNOŚĆ ===== */
@media (max-width: 900px){
  .hero_overlay{
    padding:24px 16px;
  }

  .hero_center{
    width:min(1320px, 94vw);
    transform: translateY(-12vh);
  }

  .hero_partners{
    left:50%;
    bottom:18px;
    transform: translateX(-50%);
    max-width: calc(100vw - 36px);
    width: calc(100vw - 36px);
    align-items:center;
    text-align:center;
  }

  .hero_partners_label{
    width:100%;
    text-align:center;
  }

  .hero_partners_logos{
    width:100%;
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:18px 22px;
    align-items:center;
    justify-items:center;
    justify-content:center;
  }

  .partner_logo{
    height: clamp(62px, 14vw, 92px);
    max-width: 100%;
    width:auto;
    object-fit:contain;
    transform:none;
    transform-origin:center;
  }

  .partner_ppp{
    height: clamp(72px, 16vw, 104px);
  }

  .partner_wszp{
    height: clamp(62px, 14vw, 92px);
  }

  .partner_wsg{
    height: clamp(62px, 14vw, 92px);
  }

  .partner_powiat{
    height: clamp(64px, 15vw, 96px);
  }

  .hero_live_badge{
    display:none !important;
  }

  .hero_live_btn{
    min-width: 0;
    width: auto;
    font-size: 1rem;
    padding: 16px 22px;
  }

  .hero_section.is_live .hero_online{
    display:flex;
  }

  .hero_section.is_live .hero_partners{
    display:none;
  }

  .hero_section.is_live .hero_center{
    transform: translateY(-8vh);
  }
}

@media (min-width: 901px){
  .hero_online{
    display:none !important;
  }

  .hero_section.is_live .hero_center,
  .hero_section.is_live .hero_partners{
    display:none;
  }
}

@media (min-width: 901px){
  .hero_section.is_live .hero_overlay{
    pointer-events: none;
  }
}