@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@600;700;800&family=Outfit:wght@400;500;600;700;800&display=swap');

html,body{
  margin:0;padding:0;width:100%;max-width:100%;overflow-x:hidden!important;
}
.land-body{
  --cyan:#00D2FF;
  --blue:#0072FF;
  --ink:#041018;
  --paper:#eef6ff;
  font-family:Outfit,system-ui,sans-serif;
  color:var(--paper);
  background:#001408;
  min-height:100vh;min-height:100dvh;
  width:100%;max-width:100%;overflow-x:hidden!important;
  position:relative;
}

.land-stage{
  position:relative;width:100%;max-width:100%;
  min-height:100vh;min-height:100dvh;
  display:flex;flex-direction:column;
  overflow-x:hidden;overflow-y:auto;
  background:
    linear-gradient(180deg, #001408 0%, #062814 28%, #0f6a28 58%, #28b83a 82%, #5adf4a 100%);
}

.land-glow{
  position:absolute;left:0;right:0;bottom:-8%;
  height:48%;width:100%;max-width:100%;
  background:radial-gradient(ellipse at center, rgba(124,255,46,.42), transparent 68%);
  filter:blur(10px);
  animation:landGlow 5.5s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes landGlow{
  from{opacity:.45; transform:translateY(0)}
  to{opacity:.85; transform:translateY(-12px)}
}

.land-mesh{
  position:absolute;inset:0;pointer-events:none;opacity:.35;
  width:100%;max-width:100%;
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.6), transparent 72%);
}

.land-nav{
  position:relative;z-index:2;
  display:flex;justify-content:flex-end;
  padding:18px 16px 0;width:100%;max-width:100%;box-sizing:border-box;margin:0;
}
.land-nav-sign{
  color:var(--ink);
  background:rgba(255,255,255,.94);
  padding:10px 16px;border-radius:999px;
  font-weight:800;font-size:.88rem;text-decoration:none;
  box-shadow:0 8px 22px rgba(0,0,0,.28), 0 0 16px rgba(0,0,0,.18);
  transition:transform .18s ease;
}
.land-nav-sign:active{transform:scale(.97)}

.land-compose{
  position:relative;z-index:2;flex:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:0;
  padding:8px 16px 40px;width:100%;max-width:100%;margin:0;box-sizing:border-box;
}

.land-logo,
.land-hero-pic{
  width:min(360px,86%);
  max-width:100%;
  height:auto;
  aspect-ratio:1/1;
  display:block;
  margin:0 auto 14px;
  object-fit:contain;
  object-position:center;
  border-radius:18px;
  background:transparent;
  filter:drop-shadow(0 14px 28px rgba(0,0,0,.55)) drop-shadow(0 0 22px rgba(0,210,255,.35));
  opacity:0;
  transform:translateY(18px) scale(.97);
}
.land-ready .land-logo,
.land-ready .land-hero-pic{
  animation:landIn .7s cubic-bezier(.2,.8,.2,1) .05s forwards, landPulse 3.2s ease-in-out 1s infinite;
}
@keyframes landPulse{
  0%,100%{filter:drop-shadow(0 14px 28px rgba(0,0,0,.5))}
  50%{filter:drop-shadow(0 18px 36px rgba(0,210,255,.55))}
}

.land-title{
  margin:0 0 12px;
  font-size:clamp(1.15rem, 3.8vw, 1.55rem);
  font-weight:800;
  line-height:1.28;
  letter-spacing:-.01em;
  color:#fff;
  max-width:18em;
  padding:0 8px;
  opacity:0;transform:translateY(16px);
}
.land-ready .land-title{animation:landIn .7s cubic-bezier(.2,.8,.2,1) .28s forwards}

.land-sub{
  margin:0 0 24px;
  font-size:.95rem;font-weight:500;line-height:1.45;
  color:rgba(200,220,240,.78);
  max-width:22em;padding:0 8px;
  opacity:0;transform:translateY(16px);
}
.land-ready .land-sub{animation:landIn .7s cubic-bezier(.2,.8,.2,1) .38s forwards}

.land-cta{
  display:flex;flex-direction:column;align-items:center;gap:12px;
  width:min(300px,100%);max-width:100%;padding:0 4px;box-sizing:border-box;
  opacity:0;transform:translateY(16px);
}
.land-ready .land-cta{animation:landIn .7s cubic-bezier(.2,.8,.2,1) .48s forwards}

.cta-main{
  display:block;width:100%;max-width:100%;text-align:center;text-decoration:none;
  padding:15px 22px;border-radius:999px;font-weight:800;font-size:1.02rem;
  color:var(--ink);
  background:linear-gradient(180deg,#7af0ff 0%, #00D2FF 35%, #0072FF 100%);
  box-shadow:0 14px 32px rgba(0,114,255,.35), 0 0 22px rgba(0,210,255,.25);
  transition:transform .18s ease, box-shadow .18s ease;
  box-sizing:border-box;
}
.cta-main:hover{transform:translateY(-1px);box-shadow:0 18px 36px rgba(0,114,255,.42)}
.cta-main:active{transform:scale(.98)}

.cta-soft{
  display:block;width:100%;max-width:100%;text-align:center;text-decoration:none;
  padding:13px 20px;border-radius:999px;box-sizing:border-box;
  color:#04140A;font-weight:800;font-size:.95rem;
  background:rgba(255,255,255,.92);
  border:2px solid #04140A;
  box-shadow:0 8px 20px rgba(0,0,0,.22);
}

@keyframes landIn{to{opacity:1;transform:none}}

@media (min-width:720px){
  .land-compose{padding:8px 24px 64px;max-width:560px;margin:0 auto}
  .land-logo,.land-hero-pic{width:min(400px,100%)}
}

@media (prefers-reduced-motion:reduce){
  .land-glow,.land-ready .land-logo,.land-ready .land-hero-pic{animation:none}
  .land-ready .land-logo,.land-ready .land-hero-pic,
  .land-ready .land-title,.land-ready .land-sub,.land-ready .land-cta{opacity:1;transform:none}
}