*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}

body{
  height:100vh;
  background: rgba(0,0,0,0.75);
  color:#fff;
}

/* ✅ 18+ GATE */
.gate{
  position:relative;
  height:100vh;
  background:
    radial-gradient(circle at center, rgba(255,255,255,0.08), transparent 60%),
    url('./images/silhouette.jpg') center/cover no-repeat;
  animation: gateIn 1.2s ease-out forwards;
}

.overlay{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.75);
}

.content{
  position:relative;
  z-index:2;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding: 24px;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

h1{
  font-size:42px;
  letter-spacing:2px;
  margin-bottom:10px;
}

.subtitle{
  opacity:.9;
  margin-bottom: 16px;
  line-height:1.4;
  max-width: 820px;
}

.intro-box{
  width:min(860px, 92vw);
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 14px 16px;
  box-shadow: 0 18px 45px rgba(0,0,0,.45);
  margin-bottom: 18px;
}

.intro-box .lead{
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .2px;
  opacity: .98;
  margin-bottom: 8px;
}

.intro-box .muted{
  font-size: 13px;
  opacity: .70;
  line-height: 1.35;
}

/* BUTTONS */
.actions{
  display:flex;
  gap:14px;
  margin-bottom: 16px;
  flex-wrap: wrap;
  justify-content:center;
}

button{
  padding:14px 28px;
  font-size:15px;
  border-radius:30px;
  cursor:pointer;
  border:none;
  transition: .15s;
}

.accept{
  background: linear-gradient(135deg, #ffd700, #ffb700);
  color:#000;
  font-weight:800;
}

.accept:hover{
  filter: brightness(1.03);
}

.leave{
  background: transparent;
  color:#aaa;
  border:1px solid rgba(255,255,255,.18);
}

.leave:hover{
  border-color: rgba(255,255,255,.30);
  color:#fff;
  background: rgba(255,255,255,.04);
}

/* DISCLAIMER */
.disclaimer{
  width:min(860px, 92vw);
  margin-top: 6px;
  padding: 14px 16px;
  background: rgba(0,0,0,0.28);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  text-align: left;
}

.disclaimer .disc-title{
  margin-bottom: 10px;
  opacity: .95;
}

.disclaimer ul{
  margin-left: 18px;
  display: grid;
  gap: 8px;
}

.disclaimer li{
  font-size: 12.5px;
  opacity: .80;
  line-height: 1.35;
}

.disclaimer .disc-contact{
  margin-top: 10px;
  font-size: 12.5px;
  opacity: .85;
}

.pill{
  display:inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  font-weight: 700;
  letter-spacing: .2px;
}

/* FOOTER NOTE */
.footer-note{
  margin-top: 12px;
  font-size: 12px;
  opacity: .55;
}

/* MOBILE */
@media (max-width: 520px){
  h1{ font-size: 34px; }
  button{ width: 100%; max-width: 360px; }
  .actions{ gap: 10px; }
}

/* ANIM */
@keyframes gateIn{
  from{ opacity:0; transform:scale(1.02); }
  to{ opacity:1; transform:scale(1); }
}

/* 🔒 LEGAL FOOTER (BOTTOM, NON-INTRUSIVE) */
.legal-footer{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  padding:10px 18px;
  background: linear-gradient(
    to top,
    rgba(0,0,0,0.65),
    rgba(0,0,0,0.25),
    transparent
  );
  font-size:11.5px;
  line-height:1.35;
  color:rgba(255,255,255,0.65);
  text-align:center;
  z-index:3;
}

.legal-footer a{
  color:#ffd700;
  text-decoration:none;
  font-weight:600;
}

.legal-footer a:hover{
  text-decoration:underline;
}

/* MOBILE */
@media (max-width: 520px){
  .legal-footer{
    font-size:10.5px;
    padding:8px 12px;
  }
}

/* ===========================
   MOBILE POLISH — 18+ GATE
   =========================== */

/* iOS/telefon: unikamy fixed background glitch */
@media (max-width: 768px){
  .gate{
    background-attachment: scroll;
    background-position: center top;
  }

  .content{
    padding: 18px;
    justify-content: flex-end;   /* lepiej pod kciuk */
    gap: 10px;
  }

  h1{
    font-size: 32px;
    letter-spacing: 1.2px;
    margin-bottom: 6px;
  }

  .subtitle{
    font-size: 14px;
    max-width: 520px;
    margin-bottom: 10px;
  }

  .intro-box{
    padding: 12px 14px;
    border-radius: 14px;
    margin-bottom: 10px;
  }

  .intro-box .lead{ font-size: 14px; }
  .intro-box .muted{ font-size: 12.5px; }

  .actions{
    width: 100%;
    gap: 10px;
    margin-bottom: 10px;
  }

  button{
    width: 100%;
    max-width: 520px;
    padding: 14px 18px;
    font-size: 15px;
  }

  .disclaimer{
    padding: 12px 14px;
    border-radius: 14px;
  }

  .disclaimer li{
    font-size: 12px;
  }

  /* legal zawsze czytelny, ale nie zasłania guzików */
  .legal-footer{
    position: relative;
    margin-top: 10px;
    padding: 10px 12px;
    background: rgba(0,0,0,0.35);
  }
}

/* bardzo małe telefony */
@media (max-width: 380px){
  h1{ font-size: 28px; }
  .subtitle{ font-size: 13px; }
}
