*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#000}
body{font-family:Inter,Arial,sans-serif;color:#fff}
.hero{
  min-height:100vh;display:grid;place-items:center;overflow:hidden;
  background:
    radial-gradient(circle at 77% 12%,rgba(0,130,65,.10),transparent 23%),
    radial-gradient(circle at 8% 92%,rgba(0,75,210,.16),transparent 26%),
    #000;
}
.content{
  width:min(1120px,92vw);min-height:720px;padding:54px 20px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.logo{
  display:block;width:min(980px,88vw);height:auto;
  margin:0 auto 34px;
}
.message{text-align:center;margin-top:-8px}
h1{
  margin:0;font-size:clamp(44px,5.1vw,72px);line-height:1.08;
  letter-spacing:-2.7px;font-weight:800;
}
h1 span{
  background:linear-gradient(90deg,#145cff,#1597dc 45%,#18c5ad 72%,#6bdd52);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
p{
  margin:32px auto 0;max-width:930px;color:#b6bac3;
  font-size:clamp(18px,1.65vw,25px);line-height:1.55;
}
.accent{
  width:220px;height:2px;margin:52px auto 0;border-radius:99px;
  background:linear-gradient(90deg,#145cff,#18bdca,#6bdd52);
}
@media(max-width:760px){
  .content{min-height:100vh;padding:36px 22px}
  .logo{width:96vw;max-width:680px;margin-bottom:30px}
  h1{font-size:44px;letter-spacing:-2px}
  p{font-size:18px;margin-top:25px}
  .desktop{display:none}
  .accent{width:150px;margin-top:40px}
}
@media(max-width:480px){
  .logo{width:110vw;max-width:none}
  h1{font-size:37px}
  p{font-size:16px}
}