:root{ --bg:#fff; --text:#111; --muted:#6b7280; }
*{box-sizing:border-box} html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
.wrap{ min-height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  padding:clamp(64px,12vh,140px) 20px 60px; gap:16px; }
.logo {
  width: min(420px, 85vw);
  height: auto;
  display: block;
  margin: 0 auto clamp(60px, 10vh, 100px);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .6s ease, transform .6s ease;
}
@keyframes slowspin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.spin{ animation: none; }
.loaded .logo{ opacity:1; transform:translateY(0); }
.cta-line {
  margin: 0; /* remove extra top gap */
  font-family: "Courier New", Courier, monospace;
  font-size: clamp(14px, 2.4vw, 18px);
  font-weight: 400;
  letter-spacing: 0.02em;
  text-align: left;
  width: min(560px, 92vw);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .6s ease .15s, transform .6s ease .15s;
  margin-top: 4px;
}

/* Slight extra gap between logo and first text */
.logo{ 
  margin-bottom: clamp(40px, 8vh, 80px); 
}
.wink{ animation:wink 4s infinite; }
@keyframes wink{ 0%, 90%, 100% { opacity:1; } 95% { opacity:.25; } }
.email-line{ width:min(560px,92vw); display:flex; align-items:center; gap:10px; border-bottom:1.25px solid #000;
  padding:8px 4px; margin-top:clamp(10px,2.5vh,16px); opacity:0; transform:translateY(10px);
  transition:opacity .6s ease .3s, transform .6s ease .3s; }
.email-line input{ flex:1; border:none; outline:none; font-size:16px; padding:6px 2px; background:transparent; }
.email-line .arrow{ border:none; background:transparent; font-size:22px; line-height:1; cursor:pointer;
  padding:4px 2px 4px 8px; transform:translateX(0); transition:transform .15s ease; }
.email-line .arrow:hover{ transform:translateX(2px); }
.status{ margin-top:10px; font-size:14px; color:var(--text); }
.visually-hidden{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,1px,1px); white-space:nowrap; border:0; }
.hp{ position:absolute !important; left:-99999px !important; height:0 !important; width:0 !important; }
.loaded .cta-line, .loaded .email-line{ opacity:1; transform:translateY(0); }