html{
  scroll-behavior:smooth;
}

body{
  overflow-x:hidden;
}

.wrap{
  position:relative;
  z-index:2;
}

.nav-ripple{
  position:fixed;
  z-index:115;
  pointer-events:none;
  transform:scale(.995);
  transform-origin:center;
  background:
    linear-gradient(135deg,rgba(255,245,205,.08),rgba(140,215,255,.04)),
    radial-gradient(circle at 18% 0%,rgba(255,226,145,.12),transparent 34%);
  border:1px solid rgba(255,218,126,.76);
  box-shadow:
    0 0 0 1px rgba(255,245,205,.14) inset,
    0 0 28px rgba(243,177,74,.18),
    0 0 48px rgba(140,215,255,.1);
  mix-blend-mode:screen;
  opacity:0;
  filter:blur(.1px);
  animation:nav-ripple-bloom 1.05s cubic-bezier(.22,1,.36,1) forwards;
}

.is-nav-rippled{
  animation:nav-ripple-glow 1s ease-out;
}

.scroll-progress{
  position:fixed;
  left:0;
  top:0;
  width:100%;
  height:3px;
  transform:scaleX(0);
  transform-origin:left center;
  background:linear-gradient(90deg,#8cd7ff,#63e6cf 55%,#f3b14a);
  box-shadow:0 0 18px rgba(140,215,255,.48);
  z-index:120;
  pointer-events:none;
}

.ambient-backdrop{
  position:fixed;
  inset:-14%;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
  opacity:.92;
}

.ambient-backdrop::before,
.ambient-backdrop::after{
  content:"";
  position:absolute;
  inset:-8%;
  filter:blur(34px);
}

.ambient-backdrop::before{
  background:
    radial-gradient(circle at 16% 22%,rgba(140,215,255,.16),transparent 28%),
    radial-gradient(circle at 82% 18%,rgba(99,230,207,.12),transparent 24%),
    radial-gradient(circle at 50% 78%,rgba(243,177,74,.08),transparent 20%),
    radial-gradient(circle at 68% 54%,rgba(140,215,255,.08),transparent 18%);
  animation:ambient-drift-a 28s ease-in-out infinite alternate;
}

.ambient-backdrop::after{
  background:
    radial-gradient(circle at 74% 68%,rgba(140,215,255,.14),transparent 24%),
    radial-gradient(circle at 22% 72%,rgba(99,230,207,.1),transparent 22%),
    radial-gradient(circle at 46% 18%,rgba(255,255,255,.06),transparent 18%),
    radial-gradient(circle at 10% 44%,rgba(243,177,74,.06),transparent 16%);
  mix-blend-mode:screen;
  opacity:.68;
  animation:ambient-drift-b 34s ease-in-out infinite alternate;
}

.hero,
.card,
.panel,
.guide,
.stat,
.plan-item,
.item{
  position:relative;
}

.hero{
  isolation:isolate;
}

.hero::before{
  transition:transform .22s ease,opacity .22s ease;
  animation:hero-sheen 16s ease-in-out infinite alternate;
}

.motion-enter{
  opacity:0;
  transform:translate3d(0,28px,0);
  filter:blur(10px);
}

body.motion-ready .motion-enter{
  animation:motion-rise .9s cubic-bezier(.22,1,.36,1) forwards;
}

.fx-reveal{
  opacity:0;
  transform:translate3d(0,46px,0) scale(.985);
  filter:blur(12px);
}

.fx-reveal.is-visible{
  opacity:1;
  transform:none;
  filter:none;
  transition:opacity .86s cubic-bezier(.22,1,.36,1),transform .96s cubic-bezier(.22,1,.36,1),filter .96s cubic-bezier(.22,1,.36,1);
}

.chips .chip,
.actions > *,
.controls > *,
.plan-list > *,
.stats > *,
.info-grid > *,
.participant-grid > *{
  transition:transform .22s ease,opacity .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease;
}

.hero-link:hover,
.filter-btn:hover,
.mini-btn:hover,
.fav-btn:hover,
.cta:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 28px rgba(0,0,0,.22);
}

.hero-link.primary:hover,
.cta:hover{
  box-shadow:0 16px 36px rgba(99,230,207,.18);
}

.count{
  background:linear-gradient(180deg,#ffffff 8%,#dff7ff 42%,#8cd7ff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 14px 30px rgba(140,215,255,.14));
}

.item.upcoming{
  animation:motion-float 5.6s ease-in-out infinite;
}

.item .timebox{
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
}

.item:hover .timebox{
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(140,215,255,.14);
  background:linear-gradient(180deg,rgba(140,215,255,.18),rgba(255,255,255,.05));
}

.searchbox input{
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}

.searchbox input:focus{
  transform:translateY(-1px);
  box-shadow:0 0 0 4px rgba(140,215,255,.1),0 18px 34px rgba(0,0,0,.24);
}

@keyframes motion-rise{
  0%{
    opacity:0;
    transform:translate3d(0,28px,0);
    filter:blur(10px);
  }
  100%{
    opacity:1;
    transform:none;
    filter:none;
  }
}

@keyframes motion-float{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-6px);
  }
}

@keyframes ambient-drift-a{
  0%{
    transform:translate3d(-2%, -1%, 0) scale(1.02);
    opacity:.82;
  }
  50%{
    transform:translate3d(2%, 3%, 0) scale(1.06);
    opacity:1;
  }
  100%{
    transform:translate3d(5%, -2%, 0) scale(1.04);
    opacity:.88;
  }
}

@keyframes ambient-drift-b{
  0%{
    transform:translate3d(3%, 0%, 0) scale(1.04);
    opacity:.46;
  }
  50%{
    transform:translate3d(-2%, 4%, 0) scale(1.08);
    opacity:.68;
  }
  100%{
    transform:translate3d(-5%, -3%, 0) scale(1.05);
    opacity:.56;
  }
}

@keyframes hero-sheen{
  0%{
    transform:scale(1) translate3d(0,0,0);
    opacity:.82;
  }
  50%{
    transform:scale(1.02) translate3d(1.4%, -1%, 0);
    opacity:1;
  }
  100%{
    transform:scale(1.03) translate3d(-1.2%, 1.1%, 0);
    opacity:.88;
  }
}

@keyframes nav-ripple-bloom{
  0%{
    opacity:0;
    transform:scale(.995);
  }
  20%{
    opacity:.92;
  }
  58%{
    opacity:.52;
  }
  100%{
    opacity:0;
    transform:scale(1.085);
  }
}

@keyframes nav-ripple-glow{
  0%{
    box-shadow:0 0 0 0 rgba(140,215,255,0),0 0 0 0 rgba(243,177,74,0);
    border-color:rgba(255,255,255,.08);
  }
  22%{
    box-shadow:0 0 0 1px rgba(255,241,197,.14) inset,0 0 38px rgba(243,177,74,.12);
    border-color:rgba(243,177,74,.26);
  }
  100%{
    box-shadow:0 0 0 0 rgba(140,215,255,0),0 0 0 0 rgba(243,177,74,0);
    border-color:rgba(255,255,255,.08);
  }
}

@media (prefers-reduced-motion: reduce){
  html{
    scroll-behavior:auto;
  }

  .ambient-backdrop,
  .scroll-progress{
    display:none;
  }

  .motion-enter,
  .fx-reveal{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    animation:none !important;
    transition:none !important;
  }

  .hero-link,
  .filter-btn,
  .mini-btn,
  .fav-btn,
  .cta,
  .item.upcoming,
  .nav-ripple,
  .is-nav-rippled{
    animation:none !important;
    transition:none !important;
    transform:none !important;
  }
}
