:root{
  --bg:#050a08;
  --text:#f4f7f5;
  --muted:#819088;
  --green:#78f2a0;
  --green-hover:#8cf6ad;
  --outline:rgba(255,255,255,.18);
  --overlay:rgba(2,8,5,.68);
}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg)}
html{min-width:320px}
body{
  min-height:100vh;
  color:var(--text);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  background:
    linear-gradient(var(--overlay),var(--overlay)),
    url("assets/background.jpg") center center / cover no-repeat fixed,
    var(--bg);
}
a{color:inherit;text-decoration:none}
::selection{background:var(--green);color:#061009}

.page{
  min-height:100vh;
  display:grid;
  grid-template-rows:1fr auto;
  padding:40px clamp(24px,5vw,80px) 28px;
}

.entry{
  align-self:center;
  justify-self:center;
  width:min(100%,1100px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:32px;
}

.entry h1{
  margin:0;
  max-width:none;
  font-size:clamp(2rem,6.2vw,6.6rem);
  line-height:.94;
  letter-spacing:-.058em;
  font-weight:720;
  white-space:nowrap;
}

.entry-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.button{
  min-height:50px;
  padding:0 22px;
  border-radius:10px;
  border:1px solid transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.8rem;
  font-weight:800;
  white-space:nowrap;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  transition:background .15s,border-color .15s,transform .15s;
}
.button:hover{transform:translateY(-1px)}
.button-primary{background:var(--green);color:#061009}
.button-primary:hover{background:var(--green-hover)}
.button-outline{border-color:var(--outline);background:rgba(5,10,8,.42);color:var(--text)}
.button-outline:hover{border-color:rgba(255,255,255,.34);background:rgba(5,10,8,.58)}

.footer{
  position:relative;
  width:100%;
  padding-top:22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:var(--muted);
  font-size:.72rem;
  letter-spacing:.01em;
}
.footer::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  width:100vw;
  height:1px;
  transform:translateX(-50%);
  background:rgba(120,242,160,.20);
}

@media(max-width:620px){
  body{background-attachment:scroll;min-height:100svh}
  .page{height:100svh;min-height:100svh;padding:12px 18px 14px}
  .entry{gap:26px}
  .entry h1{font-size:clamp(1.95rem,9vw,3rem)}
  .entry-actions{width:100%;flex-direction:column}
  .button{width:min(100%,280px)}
  .footer{font-size:.68rem;padding-top:16px}
}

/* Very short mobile viewports: preserve both buttons and footer without clipping. */
@media(max-width:620px) and (max-height:410px){
  .entry{gap:12px}
  .entry-actions{gap:7px}
  .button{min-height:42px}
  .footer{padding-top:10px}
}
/* Keep the original one-line heading within narrow phone widths. */
@media(max-width:360px){
  .entry h1{font-size:clamp(1.65rem,8.5vw,1.95rem)}
}
