@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,700;1,400&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{
  --lime:#c8ff2e;
  --ink:#07140a;
  --paper:#f4ffe8;
  font-family:Outfit,system-ui,sans-serif;
  color:var(--paper);
  background:#020805;
  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, #010403 0%, #052214 38%, #147a32 72%, #9ae628 100%);
}

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

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

.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,.92);
  padding:10px 16px;
  border-radius:999px;
  font-weight:800;
  font-size:.88rem;
  text-decoration:none;
  box-shadow:0 8px 22px rgba(0,0,0,.2);
  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(320px,78%);
  max-width:100%;
  height:auto;
  aspect-ratio:1/1;
  display:block;
  margin:0 auto 16px;
  object-fit:cover;
  object-position:center;
  border-radius:50%;
  filter:drop-shadow(0 14px 28px rgba(0,0,0,.4));
  box-shadow:
    0 0 0 3px rgba(250,204,21,.55),
    0 0 22px rgba(34,197,94,.3);
  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,.4))}
  50%{filter:drop-shadow(0 18px 34px rgba(34,197,94,.5))}
}

.land-title{
  margin:0 0 12px;
  font-size:clamp(1.1rem, 3.6vw, 1.4rem);
  font-weight:700;
  line-height:1.3;
  letter-spacing:-.01em;
  color:rgba(255,255,255,.92);
  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(244,255,232,.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:#fff;
  box-shadow:0 14px 32px rgba(0,0,0,.28);
  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,0,0,.32)}
.cta-main:active{transform:scale(.98)}

.cta-soft{
  color:rgba(255,255,255,.9);
  font-weight:700;
  font-size:.92rem;
  text-decoration:underline;
  text-underline-offset:4px;
  text-decoration-color:rgba(255,255,255,.45);
}

@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(380px,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}
}