:root{
  --ink:#141414;
  --black:#0A0A0A;
  --green:#83BC30;
  --green-dark:#5C8623;
  --white:#FDFDFD;
  --display:'Saira', sans-serif;
  --body:'Saira', sans-serif;
}

@font-face{font-family:'Saira';src:url('../fonts/saira-400.woff') format('woff');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Saira';src:url('../fonts/saira-500.woff') format('woff');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Saira';src:url('../fonts/saira-600.woff') format('woff');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Saira';src:url('../fonts/saira-700.woff') format('woff');font-weight:700;font-style:normal;font-display:swap;}

*{box-sizing:border-box;}
html,body{height:100%;}
body{margin:0;font-family:var(--body);background:var(--black);}

.gate{position:relative;min-height:100vh;display:flex;flex-direction:column;overflow:hidden;}

.gate-bg{
  position:absolute;inset:0;
  background-image:url('../img/gate-bg.webp');
  background-size:cover;
  background-position:center;
  background-color:var(--black);
  z-index:0;
}

.gate-content{
  position:relative;z-index:1;flex:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:32px 20px;text-align:center;
}

.gate-logos{display:flex;align-items:center;gap:28px;margin-bottom:36px;flex-wrap:wrap;justify-content:center;}
.gate-logo{height:56px;width:auto;margin-bottom:0;filter:drop-shadow(0 2px 10px rgba(0,0,0,0.5));}

.gate-card{
  max-width:520px;width:100%;
  background:rgba(10,10,10,0.55);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:6px;
  padding:clamp(28px,5vw,48px) clamp(22px,5vw,40px);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

.gate-card .eyebrow{
  font-family:var(--body);font-size:0.75rem;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--green);font-weight:600;margin-bottom:14px;
}

.gate-card h1{
  font-family:var(--display);text-transform:uppercase;letter-spacing:0.01em;
  font-size:clamp(1.5rem,4.5vw,2.1rem);line-height:1.15;color:var(--white);margin:0 0 14px;
}

.gate-card p{
  font-size:0.98rem;color:#D8D8D8;margin:0 0 28px;line-height:1.5;
}

.gate-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

.gate-actions .btn{
  display:inline-block;min-width:140px;padding:14px 32px;border-radius:2px;
  font-weight:600;font-size:1rem;text-decoration:none;border:1.5px solid transparent;
  transition:transform .15s ease, background .15s ease;
}
.gate-actions .btn:active{transform:scale(0.97);}

.btn-primary{background:var(--green);color:#0A0A0A;}
.btn-primary:hover{background:var(--green-dark);}

.btn-ghost{background:transparent;color:var(--white);border-color:rgba(255,255,255,0.4);}
.btn-ghost:hover{border-color:var(--white);}

.gate-footer{
  position:relative;z-index:1;
  display:flex;gap:20px;justify-content:center;
  padding:20px;font-size:0.8rem;
}
.gate-footer a{color:#B8B8B8;text-decoration:none;}
.gate-footer a:hover{color:var(--white);text-decoration:underline;}

@media (max-width:480px){
  .gate-actions{flex-direction:column;align-items:stretch;}
  .gate-actions .btn{width:100%;padding:16px 20px;}
  .gate-logos{flex-direction:column;gap:16px;margin-bottom:28px;}
  .gate-logo{height:44px;}
}