
.fx-intro-chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 4px}

.fxbento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:26px;grid-auto-flow:row dense}
.fx{grid-column:span 3;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;display:flex;flex-direction:column}
.fx.lg{grid-column:span 4}.fx.sm{grid-column:span 2}.fx.full{grid-column:span 6}
@media(max-width:1100px){.fx,.fx.lg,.fx.sm,.fx.full{grid-column:span 6}}

.fx-stage{position:relative !important;height:240px !important;overflow:hidden;border-bottom:1px solid var(--line);
  --s-bg:#0a0d12;--s-fg:#dbe3ec;--s-line:#23303f;--s-faint:#5a6675;
  background:var(--s-bg);color:var(--s-fg);display:grid;place-items:center}
.fx-stage.is-light{--s-bg:#eef1f4;--s-fg:#16202b;--s-line:#dde3ea;--s-faint:#95a0ac}
.fx-hint{position:absolute;bottom:9px;left:11px;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--s-faint);pointer-events:none;z-index:6}
.fx-tt{position:absolute;top:9px;right:9px;z-index:7;width:30px;height:30px;border-radius:var(--r);
  border:1px solid color-mix(in srgb,var(--s-fg) 35%,transparent);
  background:color-mix(in srgb,var(--s-bg) 60%,transparent);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
  color:var(--s-fg);opacity:.82;cursor:pointer;display:grid;place-items:center;
  box-shadow:0 2px 8px rgba(0,0,0,.18);transition:opacity .2s,color .2s,border-color .2s}
.fx-tt:hover{color:var(--accent);border-color:var(--accent);opacity:1}
.fx-tt .ico{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.9}
.fx-env{position:absolute;top:9px;right:11px;z-index:7;font-family:var(--mono);font-size:9px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--s-faint)}
.fx-info{padding:13px 15px;display:flex;flex-direction:column;gap:4px}
.fx-info .row{display:flex;align-items:center;gap:8px}
.fx-info h3{margin:0;font-size:14.5px;font-weight:600;letter-spacing:-.01em}
.fx-info .cat{margin-left:auto;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);border:1px solid var(--accent-dim);border-radius:99px;padding:2px 8px}
.fx-info p{margin:0;color:var(--txt-dim);font-size:12.5px;line-height:1.5}

.flash span:not(.fx-env){position:absolute;inset:0;display:grid;place-items:center;font-family:var(--mono);font-weight:700;
  letter-spacing:.14em;font-size:clamp(22px,4vw,40px)}
.flash .base{color:var(--s-line)}
.flash .lit{color:var(--accent);
  -webkit-mask-image:radial-gradient(circle 88px at var(--mx,-300px) var(--my,-300px),#000 0,rgba(0,0,0,.7) 55%,transparent 75%);
          mask-image:radial-gradient(circle 88px at var(--mx,-300px) var(--my,-300px),#000 0,rgba(0,0,0,.7) 55%,transparent 75%)}
.flash .pool{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(circle 120px at var(--mx,-300px) var(--my,-300px),rgba(91,155,255,.22),transparent 70%)}

.glowwrap{display:flex;gap:10px;padding:16px;width:100%;height:100%}
.glowcard{position:relative;flex:1;border:1px solid var(--s-line);border-radius:6px;background:transparent;
  display:grid;place-items:center;overflow:hidden;font-family:var(--mono);font-size:11.5px;color:var(--s-fg)}
.glowcard::before{content:"";position:absolute;inset:-1px;opacity:0;transition:opacity .3s;pointer-events:none;
  background:radial-gradient(180px circle at var(--x,50%) var(--y,50%),rgba(91,155,255,.28),transparent 60%)}
.glowwrap:hover .glowcard::before{opacity:1}
.glowcard b{position:relative;z-index:1}

.magbtn{font-family:var(--sans);font-size:13.5px;font-weight:600;color:#fff;background:var(--accent);
  border:0;border-radius:99px;padding:13px 24px;cursor:pointer;will-change:transform}
.magbtn span{display:inline-block;will-change:transform}

.tiltscene{perspective:760px}
.tiltcard{width:184px;height:132px;border-radius:10px;position:relative;transform-style:preserve-3d;
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 26%,var(--s-bg)),var(--s-bg));
  border:1px solid var(--s-line);display:grid;place-items:center;font-family:var(--mono);letter-spacing:.16em;
  color:var(--accent);transition:transform .15s ease;box-shadow:0 18px 36px rgba(0,0,0,.3)}
.tiltcard .glare{position:absolute;inset:0;border-radius:10px;pointer-events:none;
  background:radial-gradient(circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.25),transparent 55%)}

.scramble{font-family:var(--mono);font-weight:700;font-size:clamp(22px,4.5vw,40px);letter-spacing:.1em;color:var(--s-fg);cursor:pointer}
.scramble .dud{color:var(--accent)}

.marq{display:flex;flex-direction:column;justify-content:center;gap:12px;align-items:stretch}
.marq .track{display:flex;gap:26px;white-space:nowrap;width:max-content;font-family:var(--mono);font-weight:700;
  font-size:23px;color:var(--s-fg);align-items:center}
.marq .track.a{animation:mr 16s linear infinite}.marq .track.b{animation:ml 20s linear infinite;font-size:17px;color:var(--s-faint)}
.marq .track i{color:var(--accent);font-style:normal}
@keyframes mr{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@keyframes ml{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.aurora{position:relative;overflow:hidden}
.aurora .blob{position:absolute;width:280px;height:280px;border-radius:50%;filter:blur(50px);opacity:.62;mix-blend-mode:screen}
.aurora .b1{background:#5b9bff;animation:fl1 6s ease-in-out infinite}
.aurora .b2{background:#7c5bff;animation:fl2 8s ease-in-out infinite}
.aurora .b3{background:#46c08a;animation:fl3 10s ease-in-out infinite}
@keyframes fl1{0%,100%{transform:translate(-90px,-50px)}50%{transform:translate(160px,80px)}}
@keyframes fl2{0%,100%{transform:translate(170px,-40px)}50%{transform:translate(-110px,100px)}}
@keyframes fl3{0%,100%{transform:translate(50px,110px)}50%{transform:translate(-90px,-90px)}}
.aurora span:not(.fx-env){position:relative;z-index:1;font-family:var(--mono);font-weight:700;letter-spacing:.2em;
  font-size:clamp(22px,4vw,38px);color:#fff;mix-blend-mode:overlay}

.fx-stage canvas{display:block;width:100%;height:100%}

.stats{display:flex;justify-content:space-around;align-items:center;width:100%;padding:0 14px}
.stat{text-align:center}
.stat .num{font-family:var(--mono);font-weight:700;font-size:clamp(26px,5vw,44px);color:var(--accent);letter-spacing:-.02em}
.stat .lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--s-faint);margin-top:4px}

@media (prefers-reduced-motion:reduce){.marq .track,.aurora .blob{animation:none!important}}

#e-parallax{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-family:var(--sans);
  user-select:none;
  -webkit-user-select:none;
  cursor:default;
}
#e-parallax .px-scene{
  position:relative;
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
}
#e-parallax .px-layer{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  will-change:transform;
}

#e-parallax .px-word{
  font-family:var(--mono);
  font-weight:800;
  font-size:clamp(46px,16vw,86px);
  letter-spacing:.04em;
  line-height:1;
  color:var(--s-line);
  opacity:.55;
  white-space:nowrap;
}

#e-parallax .px-ring{
  width:140px;
  height:140px;
  border-radius:50%;
  border:2px solid var(--accent);
  box-shadow:0 0 0 1px var(--accent-dim) inset;
}
#e-parallax .px-ring::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:84px;
  height:84px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  border:1px dashed var(--accent-dim);
}

#e-parallax .px-dot{
  position:absolute;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 12px var(--accent-dim);
}
#e-parallax .px-label{
  position:absolute;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--s-faint);
  padding:2px 6px;
  border:1px solid var(--s-line);
  border-radius:3px;
  background:var(--s-bg);
  white-space:nowrap;
}
#e-parallax .px-tag{
  color:var(--accent);
  border-color:var(--accent-dim);
}

#e-splittext{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  user-select:none;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
#e-splittext .fx-word{
  display:flex;
  flex-wrap:nowrap;
  white-space:nowrap;
  font-family:var(--sans);
  font-weight:800;
  letter-spacing:.02em;
  line-height:1;
  font-size:clamp(28px,9vw,58px);
  color:var(--s-fg);
}
#e-splittext .fx-word.is-accent{
  color:var(--accent);
}
#e-splittext .fx-char{
  display:inline-block;
  transform:translateY(0);
  opacity:1;
  filter:blur(0);
  will-change:transform,opacity,filter;
}
#e-splittext .fx-char.fx-space{
  width:.32em;
}

#e-splittext.fx-armed .fx-char{
  opacity:0;
  transform:translateY(0.7em);
  filter:blur(6px);
}
#e-splittext.fx-run .fx-char{
  animation:e-splittext-in .62s cubic-bezier(.2,.7,.2,1) both;
  animation-delay:var(--d,0ms);
}
@keyframes e-splittext-in{
  0%{
    opacity:0;
    transform:translateY(0.7em);
    filter:blur(6px);
  }
  60%{
    filter:blur(0);
  }
  100%{
    opacity:1;
    transform:translateY(0);
    filter:blur(0);
  }
}
#e-splittext .fx-tag{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--s-faint);
}

#e-splittext.fx-static .fx-char{
  opacity:1;
  transform:none;
  filter:none;
  animation:none;
}

#e-gradtext{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  padding:0 18px;
  box-sizing:border-box;
}
#e-gradtext .gt-wrap{
  text-align:center;
  line-height:1.04;
  max-width:100%;
}
#e-gradtext .gt-line{
  margin:0;
  font-family:var(--sans);
  font-weight:800;
  letter-spacing:-0.02em;
  font-size:clamp(30px,8.5vw,58px);
}
#e-gradtext .gt-grad{
  display:inline-block;
  background-image:linear-gradient(
    100deg,
    var(--accent) 0%,
    var(--accent-dim) 22%,
    var(--s-fg) 42%,
    var(--accent) 60%,
    var(--accent-dim) 80%,
    var(--accent) 100%
  );
  background-size:260% 100%;
  background-position:0% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
  animation:gt-sweep 4.6s linear infinite;
  will-change:background-position;
}
#e-gradtext.gt-paused .gt-grad{
  animation-play-state:paused;
}
#e-gradtext .gt-sub{
  margin:12px 0 0;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--s-faint);
}
#e-gradtext .gt-sub .gt-dot{
  color:var(--accent);
}
@keyframes gt-sweep{
  0%{ background-position:0% 50%; }
  100%{ background-position:-260% 50%; }
}
#e-gradtext.gt-static .gt-grad{
  animation:none;
  background-position:38% 50%;
}
@media (prefers-reduced-motion:reduce){
  #e-gradtext .gt-grad{
    animation:none;
    background-position:38% 50%;
  }
}

#e-textmask{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:
    radial-gradient(120% 90% at 50% 120%, rgba(91,155,255,.10), transparent 60%),
    #05070d;
}
#e-textmask .tm-word{
  margin:0;
  padding:0 .12em;
  font-family:var(--sans);
  font-weight:900;
  font-size:clamp(58px, 24vw, 132px);
  line-height:.92;
  letter-spacing:-.02em;
  text-transform:uppercase;
  white-space:nowrap;
  user-select:none;

  background-image:
    linear-gradient(
      115deg,
      var(--accent) 0%,
      #8b5bff 28%,
      #19d3c5 52%,
      var(--accent) 76%,
      #8b5bff 100%
    );
  background-size:260% 100%;
  background-position:0% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;

  filter:drop-shadow(0 6px 26px rgba(91,155,255,.30));
  will-change:background-position;
}
#e-textmask .tm-sub{
  position:absolute;
  bottom:18px;
  left:0;
  right:0;
  text-align:center;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.42em;
  text-transform:uppercase;
  text-indent:.42em;
  color:rgba(150,170,210,.45);
  pointer-events:none;
}
#e-textmask.tm-anim .tm-word{
  animation:tm-slide 7s linear infinite;
}
@keyframes tm-slide{
  0%{ background-position:0% 50%; }
  100%{ background-position:260% 50%; }
}
@media (prefers-reduced-motion:reduce){
  #e-textmask.tm-anim .tm-word{ animation:none; }
}

#e-typewriter{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 24px;
  box-sizing:border-box;
}
#e-typewriter .tw-line{
  font-family:var(--mono);
  font-size:clamp(18px,4.4vw,30px);
  font-weight:600;
  line-height:1.2;
  letter-spacing:-0.01em;
  color:var(--s-fg);
  display:inline-flex;
  align-items:baseline;
  white-space:nowrap;
  max-width:100%;
}
#e-typewriter .tw-prefix{
  color:var(--s-faint);
  margin-right:0.5ch;
  font-weight:500;
}
#e-typewriter .tw-text{
  color:var(--accent);
  min-height:1em;
}
#e-typewriter .tw-caret{
  display:inline-block;
  width:0.6ch;
  height:1.05em;
  margin-left:0.12ch;
  transform:translateY(0.14em);
  background:var(--accent);
  border-radius:1px;
  animation:tw-blink 1.05s steps(1) infinite;
}
@keyframes tw-blink{
  0%,49%{opacity:1}
  50%,100%{opacity:0}
}
#e-typewriter.tw-typing .tw-caret{
  animation:none;
  opacity:1;
}
@media (prefers-reduced-motion:reduce){
  #e-typewriter .tw-caret{animation:none;opacity:1}
}

#e-grain{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:var(--s-bg);
}
#e-grain .fx-word{
  position:relative;
  z-index:1;
  margin:0;
  padding:0 18px;
  text-align:center;
  font-family:var(--sans);
  font-weight:800;
  font-size:clamp(28px,9vw,58px);
  line-height:0.94;
  letter-spacing:-0.02em;
  color:var(--s-fg);
  text-transform:uppercase;
  user-select:none;
}
#e-grain .fx-word .fx-em{
  color:var(--accent);
}
#e-grain .fx-kicker{
  display:block;
  margin-bottom:10px;
  font-family:var(--mono);
  font-weight:500;
  font-size:11px;
  letter-spacing:0.34em;
  text-transform:uppercase;
  color:var(--s-faint);
}
#e-grain .fx-noise{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  pointer-events:none;
  mix-blend-mode:screen;
  opacity:0.62;
}
#e-grain .fx-vignette{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:radial-gradient(120% 120% at 50% 50%,transparent 55%,color-mix(in srgb,var(--s-bg) 70%,transparent) 100%);
}

#e-dotgrid{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
#e-dotgrid canvas{
  display:block;
  width:100%;
  height:100%;
}
#e-dotgrid .dg-content{position:absolute;inset:0;z-index:2;display:grid;place-content:center;gap:8px;text-align:center;pointer-events:none;padding:0 20px}
#e-dotgrid .dg-kicker{font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--s-faint)}
#e-dotgrid .dg-title{font-family:var(--sans);font-weight:800;font-size:clamp(22px,3.4vw,34px);letter-spacing:-.01em;line-height:1.05;color:var(--s-fg)}
#e-dotgrid .dg-title span{background:linear-gradient(90deg,#7db4ff,#c98bff);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}

#e-mesh{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
}
#e-mesh .mesh-field{
  position:absolute;
  inset:-25%;
  filter:blur(46px) saturate(135%);
  will-change:transform;
}
#e-mesh .blob{
  position:absolute;
  width:62%;
  height:62%;
  border-radius:50%;
  mix-blend-mode:screen;
  opacity:.85;
  will-change:transform;
}
#e-mesh .b1{
  background:radial-gradient(circle at 50% 50%, var(--accent) 0%, rgba(91,155,255,0) 68%);
  top:-8%; left:-6%;
  animation:e-mesh-d1 17s ease-in-out infinite alternate;
}
#e-mesh .b2{
  background:radial-gradient(circle at 50% 50%, #8b5cf6 0%, rgba(139,92,246,0) 68%);
  top:6%; right:-12%; left:auto;
  animation:e-mesh-d2 21s ease-in-out infinite alternate;
}
#e-mesh .b3{
  background:radial-gradient(circle at 50% 50%, #16d7c4 0%, rgba(22,215,196,0) 68%);
  bottom:-10%; left:18%; top:auto;
  animation:e-mesh-d3 19s ease-in-out infinite alternate;
}
#e-mesh .b4{
  background:radial-gradient(circle at 50% 50%, var(--accent-dim, var(--accent)) 0%, rgba(1,81,249,0) 70%);
  bottom:-4%; right:4%; left:auto; top:auto;
  width:54%; height:54%;
  animation:e-mesh-d4 23s ease-in-out infinite alternate;
}
#e-mesh .b5{
  background:radial-gradient(circle at 50% 50%, #c026d3 0%, rgba(192,38,211,0) 70%);
  top:30%; left:34%;
  width:46%; height:46%;
  opacity:.7;
  animation:e-mesh-d5 15s ease-in-out infinite alternate;
}
#e-mesh .grain{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.04) 0, rgba(255,255,255,0) 40%),
    radial-gradient(circle at 80% 70%, rgba(0,0,0,.18) 0, rgba(0,0,0,0) 55%);
  mix-blend-mode:overlay;
}
#e-mesh .mesh-label{
  position:relative;
  z-index:2;
  text-align:center;
  font-family:var(--mono);
  color:#f4f7ff;
  text-shadow:0 1px 18px rgba(2,8,24,.65);
  user-select:none;
}
#e-mesh .mesh-label .ml-title{
  display:block;
  font-size:15px;
  font-weight:600;
  letter-spacing:.32em;
  text-transform:uppercase;
}
#e-mesh .mesh-label .ml-sub{
  display:block;
  margin-top:8px;
  font-size:10px;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:rgba(244,247,255,.62);
}
#e-mesh .mesh-label .ml-dot{
  display:inline-block;
  width:5px;
  height:5px;
  margin:0 3px 1px;
  border-radius:50%;
  background:var(--accent);
  vertical-align:middle;
  box-shadow:0 0 10px var(--accent);
}

@keyframes e-mesh-d1{
  0%{transform:translate(0,0) scale(1)}
  100%{transform:translate(14%,10%) scale(1.18)}
}
@keyframes e-mesh-d2{
  0%{transform:translate(0,0) scale(1.05)}
  100%{transform:translate(-16%,12%) scale(1.22)}
}
@keyframes e-mesh-d3{
  0%{transform:translate(0,0) scale(1.1)}
  100%{transform:translate(12%,-14%) scale(.92)}
}
@keyframes e-mesh-d4{
  0%{transform:translate(0,0) scale(1)}
  100%{transform:translate(-12%,-10%) scale(1.2)}
}
@keyframes e-mesh-d5{
  0%{transform:translate(0,0) scale(.95)}
  100%{transform:translate(10%,8%) scale(1.16)}
}

#e-mesh.is-static .mesh-field .blob{
  animation:none;
}
#e-mesh.is-paused .mesh-field .blob{
  animation-play-state:paused;
}

#e-blob{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
}
#e-blob .blob-wrap{
  position:relative;
  width:170px;
  height:170px;
  display:grid;
  place-items:center;
  animation:e-blob-float 7s ease-in-out infinite;
}
#e-blob svg{
  width:100%;
  height:100%;
  overflow:visible;
  display:block;
}
#e-blob .blob-fill{
  fill:var(--accent);
  opacity:.16;
}
#e-blob .blob-stroke{
  fill:none;
  stroke:var(--accent);
  stroke-width:2.2;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 10px var(--accent-dim));
}
#e-blob .blob-core{
  fill:var(--accent);
  opacity:.9;
}
#e-blob .blob-dot{
  fill:var(--s-fg);
  opacity:.7;
}
@keyframes e-blob-float{
  0%,100%{ transform:translateY(-6px) rotate(-2deg); }
  50%{ transform:translateY(6px) rotate(2deg); }
}
#e-blob.is-static .blob-wrap{
  animation:none;
}
@media (prefers-reduced-motion: reduce){
  #e-blob .blob-wrap{ animation:none; }
}

#e-trail{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
#e-trail canvas{
  display:block;
  width:100%;
  height:100%;
  cursor:crosshair;
}

#e-underline .nav{
  display:flex;
  gap:clamp(18px,5vw,42px);
  align-items:center;
  font-family:var(--sans);
  padding:0 12px;
}
#e-underline .lnk{
  position:relative;
  display:inline-block;
  padding:6px 2px;
  color:var(--s-fg);
  font-size:clamp(15px,2.4vw,19px);
  letter-spacing:.01em;
  text-decoration:none;
  cursor:pointer;
  outline:none;
  transition:color .35s ease;
}
#e-underline .lnk::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-2px;
  width:100%;
  height:2px;
  background:var(--accent);
  border-radius:2px;
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .42s cubic-bezier(.22,.61,.36,1);
}
#e-underline .lnk:hover,
#e-underline .lnk:focus-visible{
  color:var(--accent);
}
#e-underline .lnk:hover::after,
#e-underline .lnk:focus-visible::after{
  transform:scaleX(1);
}

#e-underline .lnk:not(:hover):not(:focus-visible)::after{
  transform-origin:right center;
}
#e-underline .lnk:focus-visible{
  border-radius:3px;
  box-shadow:0 0 0 2px var(--accent-dim);
}

#e-underline.is-static .lnk.is-active::after{
  transform:scaleX(1);
  transform-origin:left center;
  transition:none;
}
#e-underline.is-static .lnk.is-active{
  color:var(--accent);
}

#e-scrollreveal{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  user-select:none;
}
#e-scrollreveal .sr-stack{
  display:flex;
  flex-direction:column;
  gap:14px;
  width:min(78%, 320px);
  padding:4px 0;
}
#e-scrollreveal .sr-bar{
  height:14px;
  border-radius:7px;
  border:1px solid var(--s-line);
  background:linear-gradient(90deg, var(--accent), var(--accent-dim));
  position:relative;
  opacity:0;
  transform:translateX(-26px);
  transition:opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1);
  will-change:opacity, transform;
}

#e-scrollreveal .sr-bar:nth-child(1){ width:100%; }
#e-scrollreveal .sr-bar:nth-child(2){ width:72%;  }
#e-scrollreveal .sr-bar:nth-child(3){ width:88%;  }
#e-scrollreveal .sr-bar:nth-child(4){ width:54%;  }
#e-scrollreveal .sr-bar:nth-child(5){ width:66%;  }

#e-scrollreveal .sr-bar.sr-faint{
  background:var(--s-line);
  height:10px;
}

#e-scrollreveal .sr-stack.is-in .sr-bar{
  opacity:1;
  transform:translateX(0);
}
#e-scrollreveal .sr-stack.is-in .sr-bar:nth-child(1){ transition-delay:.00s; }
#e-scrollreveal .sr-stack.is-in .sr-bar:nth-child(2){ transition-delay:.10s; }
#e-scrollreveal .sr-stack.is-in .sr-bar:nth-child(3){ transition-delay:.20s; }
#e-scrollreveal .sr-stack.is-in .sr-bar:nth-child(4){ transition-delay:.30s; }
#e-scrollreveal .sr-stack.is-in .sr-bar:nth-child(5){ transition-delay:.40s; }

#e-scrollreveal.sr-static .sr-bar{
  opacity:1;
  transform:none;
  transition:none;
}

#e-beforeafter{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  user-select:none;
  -webkit-user-select:none;
  touch-action:pan-y;
  font-family:var(--sans);
  cursor:ew-resize;
}
#e-beforeafter .ba-panel{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
}

#e-beforeafter .ba-before{
  background:var(--s-bg);
  color:var(--s-faint);
}
#e-beforeafter .ba-before .ba-grid{
  opacity:.35;
  filter:grayscale(1);
}

#e-beforeafter .ba-after{
  background:
    radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 60%),
    var(--s-bg);
  color:var(--s-fg);
  clip-path:inset(0 0 0 var(--pos, 50%));
  will-change:clip-path;
}
#e-beforeafter .ba-card{
  position:relative;
  width:74%;
  max-width:300px;
  padding:18px 20px;
  border:1px solid var(--s-line);
  border-radius:12px;
  background:color-mix(in srgb, var(--s-bg) 85%, transparent);
}
#e-beforeafter .ba-after .ba-card{
  border-color:color-mix(in srgb, var(--accent) 55%, var(--s-line));
  box-shadow:0 8px 28px color-mix(in srgb, var(--accent) 18%, transparent);
}
#e-beforeafter .ba-bars{
  display:flex;
  align-items:flex-end;
  gap:7px;
  height:54px;
  margin-bottom:14px;
}
#e-beforeafter .ba-bars i{
  display:block;
  flex:1;
  border-radius:3px 3px 0 0;
  background:var(--s-line);
}
#e-beforeafter .ba-after .ba-bars i{
  background:linear-gradient(180deg, var(--accent), var(--accent-dim));
}
#e-beforeafter .ba-bars i:nth-child(1){height:42%}
#e-beforeafter .ba-bars i:nth-child(2){height:68%}
#e-beforeafter .ba-bars i:nth-child(3){height:30%}
#e-beforeafter .ba-bars i:nth-child(4){height:86%}
#e-beforeafter .ba-bars i:nth-child(5){height:56%}
#e-beforeafter .ba-line{
  height:9px;
  border-radius:5px;
  background:var(--s-line);
  margin:7px 0;
}
#e-beforeafter .ba-line.s{width:60%}
#e-beforeafter .ba-after .ba-line{
  background:color-mix(in srgb, var(--accent) 35%, var(--s-line));
}
#e-beforeafter .ba-tag{
  position:absolute;
  top:14px;
  font:600 11px/1 var(--mono);
  letter-spacing:.14em;
  text-transform:uppercase;
  padding:5px 9px;
  border-radius:6px;
}
#e-beforeafter .ba-before .ba-tag{
  left:14px;
  color:var(--s-faint);
  border:1px solid var(--s-line);
  background:color-mix(in srgb, var(--s-bg) 70%, transparent);
}
#e-beforeafter .ba-after .ba-tag{
  right:14px;
  color:var(--s-bg);
  background:var(--accent);
}

#e-beforeafter .ba-divider{
  position:absolute;
  top:0;
  bottom:0;
  left:var(--pos, 50%);
  width:2px;
  transform:translateX(-1px);
  background:var(--accent);
  box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent);
  z-index:3;
}
#e-beforeafter .ba-handle{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--s-bg);
  border:2px solid var(--accent);
  display:grid;
  place-items:center;
  color:var(--accent);
  box-shadow:0 4px 14px color-mix(in srgb, var(--accent) 28%, transparent);
  transition:transform .15s ease, box-shadow .15s ease;
}
#e-beforeafter.is-drag .ba-handle{
  transform:translate(-50%,-50%) scale(1.12);
  box-shadow:0 6px 20px color-mix(in srgb, var(--accent) 40%, transparent);
}
#e-beforeafter .ba-handle svg{
  width:18px;
  height:18px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

#e-clipwipe{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-family:var(--sans);
}
#e-clipwipe .cw-frame{
  position:relative;
  width:62%;
  max-width:300px;
  aspect-ratio:16/10;
  border:1px solid var(--s-line);
  border-radius:10px;
  overflow:hidden;
  background:var(--s-bg);
  box-shadow:0 1px 0 var(--s-line);
}

#e-clipwipe .cw-panel{
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg, var(--accent) 0%, var(--accent-dim) 100%);
  
  clip-path:polygon(0 0, 0 0, 0 100%, 0 100%);
  transition:clip-path .85s cubic-bezier(.65,.02,.18,1);
  will-change:clip-path;
}

#e-clipwipe.cw-in .cw-panel{
  clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

#e-clipwipe .cw-panel::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,
    transparent 0%,
    rgba(255,255,255,.28) 48%,
    rgba(255,255,255,.55) 50%,
    rgba(255,255,255,.28) 52%,
    transparent 100%);
  mix-blend-mode:screen;
  opacity:0;
  transform:translateX(-60%);
}
#e-clipwipe.cw-in .cw-panel::after{
  animation:cw-sheen .9s ease-out;
}
@keyframes cw-sheen{
  0%{opacity:0;transform:translateX(-60%);}
  35%{opacity:.9;}
  100%{opacity:0;transform:translateX(60%);}
}

#e-clipwipe .cw-cap{
  position:absolute;
  left:14px;
  bottom:11px;
  z-index:2;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--s-bg);
  opacity:0;
  transform:translateY(6px);
  transition:opacity .4s ease .55s, transform .4s ease .55s;
  text-shadow:0 1px 3px rgba(0,0,0,.35);
}
#e-clipwipe.cw-in .cw-cap{
  opacity:1;
  transform:translateY(0);
}

#e-clipwipe .cw-tag{
  position:absolute;
  top:10px;
  right:12px;
  z-index:2;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.1em;
  color:var(--s-faint);
}
#e-clipwipe.cw-in .cw-tag{
  color:var(--s-bg);
  opacity:.85;
}

#e-clipwipe .cw-grid{
  position:absolute;
  inset:0;
  z-index:0;
  background-image:
    linear-gradient(var(--s-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--s-line) 1px, transparent 1px);
  background-size:22px 22px;
  opacity:.5;
}
#e-clipwipe .cw-ph{
  position:absolute;
  inset:0;
  z-index:1;
  display:grid;
  place-items:center;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--s-faint);
}
#e-clipwipe.cw-in .cw-ph{opacity:0;transition:opacity .25s ease;}

#e-clipwipe.cw-static .cw-panel{transition:none;}
#e-clipwipe.cw-static .cw-cap{transition:none;}

#e-confetti{
  width:100%;
  height:100%;
  position:relative;
}
#e-confetti .cf-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:2;
}
#e-confetti .cf-center{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  font-family:var(--mono);
}
#e-confetti .cf-status{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--s-faint);
  min-height:14px;
  transition:color .25s ease;
}
#e-confetti .cf-status.is-done{
  color:var(--accent);
}
#e-confetti .cf-btn{
  font-family:var(--mono);
  font-size:13px;
  letter-spacing:.06em;
  color:var(--s-bg);
  background:var(--accent);
  border:1px solid var(--accent);
  border-radius:8px;
  padding:11px 26px;
  cursor:pointer;
  position:relative;
  overflow:hidden;
  transition:transform .12s ease, box-shadow .25s ease, background .2s ease;
  box-shadow:0 4px 16px -6px var(--accent-dim);
}
#e-confetti .cf-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 22px -8px var(--accent-dim);
}
#e-confetti .cf-btn:active{
  transform:translateY(0);
}
#e-confetti .cf-btn:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
}
#e-confetti .cf-btn.is-busy{
  pointer-events:none;
  opacity:.85;
}
#e-confetti .cf-btn .cf-check{
  display:inline-block;
  margin-right:7px;
  width:13px;
  height:13px;
  vertical-align:-2px;
  opacity:0;
  transform:scale(.5);
  transition:opacity .2s ease, transform .2s ease;
}
#e-confetti .cf-btn.is-done .cf-check{
  opacity:1;
  transform:scale(1);
}
#e-confetti .cf-btn .cf-check path{
  stroke:var(--s-bg);
  stroke-width:2.4;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
@keyframes cf-pulse{
  0%,100%{transform:translateY(0) scale(1);}
  50%{transform:translateY(-1px) scale(1.045);}
}
#e-confetti .cf-btn.cf-static{
  animation:cf-pulse 2.4s ease-in-out infinite;
}

.fx-replay{position:absolute;bottom:9px;right:9px;z-index:7;width:30px;height:30px;border-radius:var(--r);
  border:1px solid color-mix(in srgb,var(--s-fg) 35%,transparent);
  background:color-mix(in srgb,var(--s-bg) 60%,transparent);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
  color:var(--s-fg);opacity:.82;cursor:pointer;display:grid;place-items:center;
  box-shadow:0 2px 8px rgba(0,0,0,.18);transition:opacity .2s,color .2s,border-color .2s,transform .45s ease}
.fx-replay:hover{color:var(--accent);border-color:var(--accent);opacity:1}
.fx-replay:active{transform:rotate(-160deg)}
.fx-replay .ico{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

#e-photoreveal{overflow:hidden;height:500px !important}
.photo-reveal{position:absolute;inset:0}
.photo-reveal .pr-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 50%;-webkit-user-drag:none;user-select:none}
.photo-reveal .pr-dim{filter:brightness(.26) grayscale(.4) contrast(1.05);opacity:.55}
.photo-reveal .pr-lit{filter:brightness(1.5) contrast(1.05) saturate(1.1);
  -webkit-mask-image:radial-gradient(circle 150px at var(--mx,-300px) var(--my,-300px),#000 0,rgba(0,0,0,.85) 55%,transparent 78%);
          mask-image:radial-gradient(circle 150px at var(--mx,-300px) var(--my,-300px),#000 0,rgba(0,0,0,.85) 55%,transparent 78%)}
.photo-reveal .pr-beam{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(circle 175px at var(--mx,-300px) var(--my,-300px),rgba(255,214,172,.26),transparent 68%)}
.photo-reveal .pr-type{position:absolute;inset:0;z-index:3;margin:0;pointer-events:none;display:grid;place-items:center;text-align:center;
  font-family:var(--mono);font-weight:800;line-height:.9;letter-spacing:.04em;font-size:clamp(22px,4.4vw,42px);color:#fff;mix-blend-mode:exclusion}

#e-glitch{overflow:hidden}
.glitch{position:relative;font-family:var(--mono);font-weight:800;font-size:clamp(26px,5.2vw,46px);letter-spacing:.05em;
  color:var(--s-fg);text-transform:uppercase}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none}
.glitch::before{color:#ff3b6b;mix-blend-mode:screen;animation:gl-a 2.6s infinite linear alternate}
.glitch::after{color:#27e0ff;mix-blend-mode:screen;animation:gl-b 3.1s infinite linear alternate}
.glitch.is-paused::before,.glitch.is-paused::after{animation-play-state:paused}
@keyframes gl-a{0%{clip-path:inset(0 0 82% 0);transform:translate(-2px,-1px)}20%{clip-path:inset(40% 0 30% 0);transform:translate(2px,1px)}40%{clip-path:inset(70% 0 8% 0);transform:translate(-1px,1px)}60%{clip-path:inset(10% 0 60% 0);transform:translate(2px,-1px)}80%{clip-path:inset(55% 0 20% 0);transform:translate(-2px,0)}100%{clip-path:inset(20% 0 50% 0);transform:translate(1px,1px)}}
@keyframes gl-b{0%{clip-path:inset(60% 0 16% 0);transform:translate(2px,1px)}25%{clip-path:inset(10% 0 70% 0);transform:translate(-2px,-1px)}50%{clip-path:inset(44% 0 36% 0);transform:translate(1px,1px)}75%{clip-path:inset(78% 0 4% 0);transform:translate(-1px,-1px)}100%{clip-path:inset(28% 0 44% 0);transform:translate(2px,0)}}
@media (prefers-reduced-motion:reduce){.glitch::before,.glitch::after{display:none}}

.wr-line{display:flex;align-items:baseline;justify-content:center;gap:10px;flex-wrap:wrap;padding:0 12px;
  font-family:var(--sans);font-weight:700;font-size:clamp(19px,3.4vw,29px);color:var(--s-fg)}
.wr-rot{position:relative;display:inline-block;height:1.25em;overflow:hidden;vertical-align:bottom;color:var(--accent)}
.wr-list{display:flex;flex-direction:column;transition:transform .55s cubic-bezier(.66,0,.2,1)}
.wr-item{height:1.25em;line-height:1.25em;white-space:nowrap;font-weight:800}
@media (prefers-reduced-motion:reduce){.wr-list{transition:none}}

#e-grid{overflow:hidden}
#e-grid canvas{display:block;width:100%;height:100%}

#e-starfield{overflow:hidden}
#e-starfield canvas{display:block;width:100%;height:100%}

#e-cursor{overflow:hidden}
#e-cursor.cc-on{cursor:none}
.cc-stage-label{font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;font-size:12px;color:var(--s-faint);
  border:1px solid var(--s-line);border-radius:99px;padding:10px 18px;transition:color .2s,border-color .2s}
#e-cursor.cc-hot .cc-stage-label{color:var(--accent);border-color:var(--accent)}
.cc-ring,.cc-dot{position:absolute;top:0;left:0;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);will-change:transform;z-index:5;opacity:0;transition:opacity .25s}
#e-cursor.cc-on .cc-ring,#e-cursor.cc-on .cc-dot{opacity:1}
.cc-ring{width:34px;height:34px;border:1.5px solid var(--accent);transition:width .22s,height .22s,background .22s,opacity .25s}
.cc-dot{width:6px;height:6px;background:var(--accent)}
#e-cursor.cc-hot .cc-ring{width:56px;height:56px;background:color-mix(in srgb,var(--accent) 16%,transparent)}

@property --bb-a{syntax:'<angle>';inherits:false;initial-value:0deg}
.bb-card{position:relative;width:80%;max-width:300px;height:138px;border-radius:14px;background:var(--s-bg);
  display:grid;place-items:center;overflow:hidden;border:1px solid var(--s-line)}
.bb-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.6px;
  background:conic-gradient(from var(--bb-a),transparent 0 76%,var(--accent) 87%,#bcd4ff 93%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
          mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  animation:bb-spin 4s linear infinite}
@keyframes bb-spin{to{--bb-a:360deg}}
.bb-card.is-paused::before{animation-play-state:paused}
.bb-inner{position:relative;z-index:1;text-align:center;font-family:var(--mono);color:var(--s-fg)}
.bb-inner b{display:block;font-size:15px;letter-spacing:.02em;margin-bottom:5px}
.bb-inner em{font-style:normal;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--s-faint)}
@media (prefers-reduced-motion:reduce){.bb-card::before{animation:none}}

.odo{display:flex;gap:26px;align-items:flex-start;justify-content:center;width:100%;padding:0 12px}
.odo-stat{text-align:center}
.odo-num{display:inline-flex;align-items:flex-start;font-family:var(--mono);font-weight:800;
  font-size:clamp(30px,6.4vw,52px);color:var(--accent);line-height:1;letter-spacing:.01em}
.odo-digit{display:inline-block;height:1em;overflow:hidden;width:.62em}
.odo-reel{display:flex;flex-direction:column;transition:transform 1.3s cubic-bezier(.16,1,.3,1)}
.odo-reel span{height:1em;line-height:1;text-align:center}
.odo-suf{margin-left:1px}
.odo-lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--s-faint);margin-top:9px}

#e-colorreveal{overflow:hidden;height:500px !important;background:#070a12}
.color-reveal{position:absolute;inset:0}
.color-reveal .cr-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 50%;-webkit-user-drag:none;user-select:none}
.color-reveal .cr-base{filter:grayscale(1) brightness(.5) contrast(1.05) sepia(1) hue-rotate(178deg) saturate(2.1);opacity:.6}
.color-reveal .cr-color{filter:brightness(1.12) contrast(1.04) saturate(1.35);
  -webkit-mask-image:radial-gradient(circle 190px at var(--mx,-300px) var(--my,-300px),#000 0,rgba(0,0,0,.9) 55%,transparent 80%);
          mask-image:radial-gradient(circle 190px at var(--mx,-300px) var(--my,-300px),#000 0,rgba(0,0,0,.9) 55%,transparent 80%)}
.color-reveal .cr-beam{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(circle 230px at var(--mx,-300px) var(--my,-300px),rgba(120,180,255,.22),rgba(255,120,190,.1) 45%,transparent 70%)}
.color-reveal .cr-type{position:absolute;left:0;right:0;bottom:16px;z-index:3;pointer-events:none;text-align:center;display:grid;gap:6px}
.color-reveal .cr-kicker{font-family:var(--mono);font-weight:500;font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--s-faint)}
.color-reveal .cr-word{font-family:var(--mono);font-weight:800;letter-spacing:.06em;font-size:clamp(20px,3.2vw,32px);
  background:linear-gradient(90deg,#7db4ff,#c98bff 50%,#ff8fbf);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}

#e-saashero{overflow:hidden;height:320px !important;background:radial-gradient(120% 120% at 50% 0,#141a33,#080a14 70%)}
.saas-hero{position:absolute;inset:0;display:grid;place-items:center}
.saas-hero .sh-aurora{position:absolute;inset:-20%;filter:blur(46px);opacity:.9;pointer-events:none;transition:transform .3s ease}
.saas-hero .sh-b{position:absolute;width:46%;height:46%;border-radius:50%;mix-blend-mode:screen;will-change:transform}
.saas-hero .sh-b.b1{background:#5b8cff;left:6%;top:8%;animation:sh-f1 11s ease-in-out infinite}
.saas-hero .sh-b.b2{background:#c46bff;right:4%;top:0;animation:sh-f2 13s ease-in-out infinite}
.saas-hero .sh-b.b3{background:#3fe0d0;left:16%;bottom:2%;animation:sh-f3 12s ease-in-out infinite}
.saas-hero .sh-b.b4{background:#ff6ba6;right:12%;bottom:6%;animation:sh-f4 14s ease-in-out infinite}
@keyframes sh-f1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(18%,12%) scale(1.15)}}
@keyframes sh-f2{0%,100%{transform:translate(0,0) scale(1.05)}50%{transform:translate(-14%,16%) scale(.92)}}
@keyframes sh-f3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(12%,-14%) scale(1.12)}}
@keyframes sh-f4{0%,100%{transform:translate(0,0) scale(.95)}50%{transform:translate(-16%,-10%) scale(1.1)}}
.saas-hero.is-paused .sh-b,.saas-hero.is-paused .sh-cta::after{animation-play-state:paused}
.saas-hero .sh-content{position:relative;z-index:2;text-align:center;padding:0 22px;max-width:520px}
.saas-hero .sh-kicker{display:inline-block;margin-bottom:12px;padding:5px 12px;border-radius:999px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:#cdd6ff;
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.saas-hero .sh-title{margin:0 0 10px;font-family:var(--sans);font-weight:800;line-height:1.02;font-size:clamp(26px,4.6vw,44px);letter-spacing:-.02em;color:#fff}
.saas-hero .sh-title span{background:linear-gradient(90deg,#7db4ff,#c98bff 45%,#ff8fbf);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.saas-hero .sh-sub{margin:0 0 20px;color:#aeb7cc;font-size:14px;line-height:1.5}
.saas-hero .sh-cta{display:inline-block;padding:11px 22px;border-radius:12px;font-weight:700;font-size:13.5px;color:#0a0d16;
  background:linear-gradient(90deg,#8ec5ff,#c9a3ff 50%,#ff9ec6);box-shadow:0 8px 26px rgba(120,150,255,.4);position:relative;overflow:hidden;cursor:pointer}
.saas-hero .sh-cta::after{content:"";position:absolute;inset:0;transform:translateX(-120%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:sh-sheen 3.4s ease-in-out infinite}
@keyframes sh-sheen{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@media(prefers-reduced-motion:reduce){.saas-hero .sh-b,.saas-hero .sh-cta::after{animation:none}}

#e-kenburns{overflow:hidden;height:360px !important;background:#0a0d12}
.kenburns{position:absolute;inset:0}
.kenburns .kb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;
  transform-origin:60% 42%;animation:kb-pan 22s ease-in-out infinite alternate;will-change:transform}
@keyframes kb-pan{0%{transform:scale(1.06) translate(0,0)}100%{transform:scale(1.22) translate(-2.5%,-2%)}}
.kenburns.is-paused .kb-img{animation-play-state:paused}
.kenburns .kb-grade{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,10,18,.15),rgba(8,10,18,.05) 40%,rgba(12,8,4,.74) 100%),radial-gradient(120% 90% at 28% 92%,rgba(255,150,60,.24),transparent 60%)}
.kenburns .kb-content{position:absolute;left:0;right:0;bottom:22px;z-index:2;text-align:center;padding:0 22px;pointer-events:none}
.kenburns .kb-kicker{display:block;margin-bottom:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.82)}
.kenburns .kb-title{margin:0;font-family:var(--sans);font-weight:800;font-size:clamp(30px,5.4vw,52px);letter-spacing:-.02em;line-height:1;color:#fff;text-shadow:0 2px 26px rgba(0,0,0,.55)}
.kenburns .kb-sub{margin:6px 0 16px;color:rgba(255,255,255,.85);font-size:14px;text-shadow:0 1px 14px rgba(0,0,0,.55)}
.kenburns .kb-cta{display:inline-block;padding:10px 22px;border-radius:999px;font-weight:700;font-size:13px;color:#1a1206;
  background:linear-gradient(90deg,#ffd08a,#ff9e5e);box-shadow:0 8px 24px rgba(255,150,70,.35)}
@media(prefers-reduced-motion:reduce){.kenburns .kb-img{animation:none;transform:scale(1.12)}}

#e-hoverimg{overflow:hidden;height:390px !important}
.hoverimg{position:absolute;inset:0;display:grid;align-content:center;padding:6px 6px}
.hoverimg .hi-list{list-style:none;margin:0;padding:0}
.hoverimg .hi-list li{position:relative;z-index:2;padding:9px 22px;font-family:var(--sans);font-weight:800;
  font-size:clamp(19px,2.9vw,29px);letter-spacing:-.01em;color:var(--s-fg);cursor:default;transition:color .2s,opacity .2s,transform .2s}
.hoverimg .hi-list li::after{content:"\2197";float:right;font-weight:500;opacity:0;transform:translateX(-6px);transition:opacity .2s,transform .2s;color:var(--accent)}
.hoverimg.has-hover .hi-list li{opacity:.34}
.hoverimg .hi-list li.is-on{opacity:1;color:var(--accent);transform:translateX(6px)}
.hoverimg .hi-list li.is-on::after{opacity:1;transform:translateX(0)}
.hoverimg .hi-preview{position:absolute;z-index:5;top:0;left:0;width:210px;height:140px;border-radius:12px;overflow:hidden;
  pointer-events:none;opacity:0;transform:translate(-50%,-118%) scale(.9) rotate(-3deg);transition:opacity .18s ease,transform .18s ease;
  box-shadow:0 20px 54px rgba(0,0,0,.48);border:1px solid rgba(255,255,255,.14)}
.hoverimg .hi-preview.is-visible{opacity:1;transform:translate(-50%,-118%) scale(1) rotate(-3deg)}
.hoverimg .hi-preview img{width:100%;height:100%;object-fit:cover;display:block}

#e-winmoment{overflow:hidden;height:360px !important;background:#0a0d12}
.winmoment{position:absolute;inset:0}
.winmoment .wm-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.winmoment .wm-grade{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,10,18,.38),rgba(8,10,18,.22) 45%,rgba(10,7,3,.8) 100%),radial-gradient(90% 80% at 50% 46%,rgba(255,140,40,.28),transparent 62%)}
.winmoment .wm-content{position:absolute;inset:0;z-index:2;display:grid;place-content:center;text-align:center;padding:0 22px;pointer-events:none}
.winmoment .wm-kicker{font-family:var(--mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.85);margin-bottom:6px}
.winmoment .wm-stat{margin:0;line-height:.95}
.winmoment .wm-num{font-family:var(--sans);font-weight:800;font-size:clamp(52px,10vw,94px);letter-spacing:-.03em;
  background:linear-gradient(90deg,#ffd88a,#ff9e5e 55%,#ff7a59);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.winmoment .wm-label{margin:8px 0 0;font-family:var(--sans);font-weight:600;font-size:clamp(14px,2vw,18px);color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.6)}

#e-baphoto{overflow:hidden;height:340px !important}
.baphoto{position:absolute;inset:0}
.baphoto .ba-wrap{position:absolute;inset:0;overflow:hidden;--pos:50%;touch-action:none;cursor:ew-resize}
.baphoto .ba-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;-webkit-user-drag:none;user-select:none}
.baphoto .ba-after{filter:saturate(1.42) contrast(1.12) brightness(1.03)}
.baphoto .ba-before{filter:grayscale(.6) saturate(.28) contrast(.88) brightness(1.07);clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.baphoto .ba-divider{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;background:rgba(255,255,255,.92);transform:translateX(-1px);z-index:3;pointer-events:none;box-shadow:0 0 12px rgba(0,0,0,.45)}
.baphoto .ba-knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.96);box-shadow:0 3px 12px rgba(0,0,0,.4);display:grid;place-items:center}
.baphoto .ba-knob::before{content:"\2194";color:#111;font-size:16px;font-weight:700}
.baphoto .ba-tag{position:absolute;top:12px;z-index:3;padding:4px 10px;border-radius:999px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:rgba(6,8,14,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none}
.baphoto .ba-tl{left:12px}.baphoto .ba-tr{right:12px}

#e-gallery{overflow:hidden;height:320px !important}
.gallery-fx{position:absolute;inset:0;padding:12px}
.gallery-fx .gl-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr;gap:10px;height:100%}
.gallery-fx .gl-item{position:relative;overflow:hidden;border-radius:12px;cursor:pointer}
.gallery-fx .gl-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;filter:saturate(1.06)}
.gallery-fx .gl-item::before{content:"";position:absolute;inset:0;z-index:1;opacity:.16;transition:opacity .3s ease;background:linear-gradient(135deg,var(--c1),var(--c2))}
.gallery-fx .gl-item::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 42%,rgba(6,8,14,.72));opacity:.65}
.gallery-fx .gl-cap{position:absolute;left:12px;bottom:10px;z-index:2;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#fff;transform:translateY(6px);opacity:.86;transition:transform .3s ease,opacity .3s ease}
.gallery-fx .gl-item:hover img{transform:scale(1.12)}
.gallery-fx .gl-item:hover::before{opacity:.52}
.gallery-fx .gl-item:hover .gl-cap{transform:translateY(0);opacity:1}

#e-duohero{overflow:hidden;height:340px !important;background:#0a0d12}
.duohero{position:absolute;inset:0}
.duohero .du-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15) brightness(1.02)}
.duohero .du-shadow{position:absolute;inset:0;pointer-events:none;mix-blend-mode:multiply;background:linear-gradient(135deg,#241a6b,#3b1e78)}
.duohero .du-light{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;background:linear-gradient(135deg,#ff6ba6,#ffab5e);animation:du-hue 15s linear infinite}
@keyframes du-hue{to{filter:hue-rotate(360deg)}}
.duohero.is-paused .du-light{animation-play-state:paused}
.duohero .du-content{position:absolute;left:0;right:0;bottom:20px;z-index:2;text-align:center;padding:0 22px;pointer-events:none}
.duohero .du-kicker{display:block;margin-bottom:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.9)}
.duohero .du-title{margin:0;font-family:var(--sans);font-weight:800;font-size:clamp(26px,4.4vw,44px);letter-spacing:-.02em;line-height:1.02;color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.45)}
@media(prefers-reduced-motion:reduce){.duohero .du-light{animation:none}}

#e-fotoparallax{overflow:hidden;height:380px !important;background:#070a12}
.fotoparallax{position:absolute;inset:0}
.fotoparallax .pl-scene{position:absolute;inset:0}
.fotoparallax .pl-layer{position:absolute;max-width:none;will-change:transform;-webkit-user-drag:none;user-select:none;transition:transform .25s ease}
.fotoparallax .pl-back{z-index:1;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%;transform:scale(1.14)}
.fotoparallax .pl-atmo{z-index:2;position:absolute;inset:0;pointer-events:none;will-change:transform;transition:transform .25s ease;mix-blend-mode:screen;transform:scale(1.3);
  background:radial-gradient(55% 45% at 28% 18%,rgba(255,190,120,.28),transparent 60%),radial-gradient(70% 60% at 82% 82%,rgba(90,140,255,.24),transparent 60%)}
.fotoparallax .pl-front{z-index:3;left:0;right:0;bottom:0;width:100%;height:66%;object-fit:cover;object-position:50% 30%;transform-origin:bottom center;transform:scale(1.16);filter:brightness(.5) saturate(1.1);
  -webkit-mask-image:linear-gradient(to top,#000 60%,transparent);mask-image:linear-gradient(to top,#000 60%,transparent)}
.fotoparallax::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(180deg,transparent 48%,rgba(6,8,14,.55))}
.fotoparallax .pl-content{position:absolute;left:0;right:0;bottom:24px;z-index:5;text-align:center;padding:0 22px;pointer-events:none;will-change:transform;transition:transform .25s ease}
.fotoparallax .pl-kicker{display:block;margin-bottom:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.85)}
.fotoparallax .pl-title{margin:0;font-family:var(--sans);font-weight:800;font-size:clamp(28px,5vw,50px);letter-spacing:-.02em;line-height:1;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.55)}

#e-product{overflow:hidden;perspective:900px;background:radial-gradient(120% 120% at 50% 18%,#161a2e,#080a12 70%)}
.product-fx{position:absolute;inset:0;display:grid;place-items:center}
.product-fx .pr3-scene{position:relative;transform-style:preserve-3d;transition:transform .2s ease}
.product-fx .pr3-card{position:relative;width:210px;height:132px;border-radius:16px;transform-style:preserve-3d;overflow:hidden;
  background:linear-gradient(135deg,#5b8cff,#c46bff 40%,#ff6ba6 70%,#ffab5e);
  box-shadow:0 22px 50px rgba(90,110,255,.35),inset 0 1px 0 rgba(255,255,255,.4);animation:pr3-spin 7s ease-in-out infinite}
@keyframes pr3-spin{0%,100%{transform:rotateY(-22deg) rotateX(6deg)}50%{transform:rotateY(22deg) rotateX(6deg)}}
.product-fx.is-paused .pr3-card,.product-fx.is-paused .pr3-sheen{animation-play-state:paused}
.product-fx .pr3-chip{position:absolute;top:26px;left:22px;width:36px;height:27px;border-radius:6px;background:linear-gradient(135deg,#ffe9a8,#d9a94e);box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.product-fx .pr3-logo{position:absolute;top:24px;right:20px;font-family:var(--mono);font-weight:800;letter-spacing:.14em;color:#fff;font-size:13px;text-shadow:0 1px 2px rgba(0,0,0,.25)}
.product-fx .pr3-line{position:absolute;left:22px;bottom:24px;width:120px;height:12px;border-radius:3px;background:rgba(255,255,255,.55)}
.product-fx .pr3-sheen{position:absolute;top:-60%;left:-40%;width:55%;height:220%;transform:rotate(18deg);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:pr3-sheen 7s ease-in-out infinite}
@keyframes pr3-sheen{0%,100%{left:-45%}50%{left:115%}}
.product-fx .pr3-shadow{position:absolute;left:50%;bottom:40px;width:170px;height:24px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent);filter:blur(3px)}
@media(prefers-reduced-motion:reduce){.product-fx .pr3-card,.product-fx .pr3-sheen{animation:none}.product-fx .pr3-card{transform:rotateY(-14deg) rotateX(6deg)}}

#e-testimonial{overflow:hidden;height:300px !important}
.testimonial{position:absolute;inset:0}
.testimonial .tm-item{position:absolute;inset:0;display:grid;grid-template-columns:150px 1fr;gap:22px;align-items:center;padding:26px 30px;
  opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease;pointer-events:none}
.testimonial .tm-item.is-active{opacity:1;transform:none}
.testimonial .tm-photo{width:150px;height:186px;object-fit:cover;object-position:50% 22%;border-radius:14px;filter:grayscale(1) contrast(1.05);box-shadow:0 12px 30px rgba(0,0,0,.35)}
.testimonial .tm-quote{margin:0;font-family:var(--sans);font-weight:600;font-size:clamp(15px,2vw,20px);line-height:1.4;color:var(--s-fg)}
.testimonial .tm-quote::before{content:"\201C";color:var(--accent);font-size:2em;line-height:0;vertical-align:-.32em;margin-right:.08em}
.testimonial .tm-cap{margin-top:14px;display:flex;flex-direction:column;gap:2px}
.testimonial .tm-cap b{font-family:var(--sans);font-size:14px;color:var(--s-fg)}
.testimonial .tm-cap span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--s-faint)}
.testimonial .tm-dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:4}
.testimonial .tm-dots span{width:7px;height:7px;border-radius:50%;background:var(--s-faint);opacity:.5;cursor:pointer;transition:opacity .3s,background .3s}
.testimonial .tm-dots span.is-on{opacity:1;background:var(--accent)}

#e-hotspot{overflow:hidden;height:360px !important;background:#0a0d12}
.hotspot{position:absolute;inset:0}
.hotspot .hs-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:brightness(.86) saturate(1.05)}
.hotspot .hs-pt{position:absolute;transform:translate(-50%,-50%);z-index:3;width:26px;height:26px;border:0;background:none;cursor:pointer;padding:0}
.hotspot .hs-pt span{display:block;width:14px;height:14px;margin:6px;border-radius:50%;background:var(--accent);animation:hs-pulse 2s ease-out infinite}
@keyframes hs-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent)}70%{box-shadow:0 0 0 15px transparent}100%{box-shadow:0 0 0 0 transparent}}
.hotspot .hs-pt::after{content:attr(data-label);position:absolute;left:50%;bottom:132%;transform:translateX(-50%) translateY(6px);white-space:nowrap;padding:6px 12px;border-radius:8px;background:rgba(10,13,20,.92);color:#fff;font-size:12px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.14)}
.hotspot .hs-pt:hover::after,.hotspot .hs-pt:focus-visible::after{opacity:1;transform:translateX(-50%) translateY(0)}
.hotspot .hs-pt:hover span{background:#fff}

#e-glasscards{overflow:hidden;height:340px !important}
.glasscards{position:absolute;inset:0}
.glasscards .gc-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;filter:saturate(1.15)}
.glasscards::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(40,20,80,.28),rgba(255,120,80,.14))}
.glasscards .gc-row{position:absolute;inset:0;z-index:2;display:flex;gap:18px;align-items:center;justify-content:center;padding:0 26px;flex-wrap:wrap}
.glasscards .gc-card{flex:1 1 190px;max-width:260px;padding:20px;border-radius:16px;background:rgba(255,255,255,.13);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);border:1px solid rgba(255,255,255,.28);box-shadow:0 10px 30px rgba(0,0,0,.28);color:#fff}
.glasscards .gc-ico{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#8ec5ff,#c9a3ff);color:#0a0d16;font-size:16px;margin-bottom:12px}
.glasscards .gc-card b{display:block;font-family:var(--sans);font-size:16px;margin-bottom:6px}
.glasscards .gc-card p{margin:0;font-size:12.5px;line-height:1.5;color:rgba(255,255,255,.88)}

#e-imagetext{overflow:hidden;height:360px !important;background:#06080e;display:grid;place-items:center}
.imagetext{position:absolute;inset:0;display:grid;place-items:center}
.imagetext .it-kicker{position:absolute;top:20px;left:0;right:0;text-align:center;font-family:var(--mono);font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--s-faint)}
.imagetext .it-word{font-family:var(--sans);font-weight:900;font-size:clamp(64px,17vw,152px);letter-spacing:-.03em;line-height:.9;background-image:url('/assets/effekte/text-img.jpg');background-size:140% auto;background-position:50% 40%;background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:it-pan 16s ease-in-out infinite alternate}
@keyframes it-pan{0%{background-position:28% 30%;background-size:135% auto}100%{background-position:72% 62%;background-size:158% auto}}
.imagetext.is-paused .it-word{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.imagetext .it-word{animation:none}}

#e-loupe{overflow:hidden;height:300px !important;background:#0a0d12}
.loupe{position:absolute;inset:0;cursor:crosshair}
.loupe .lp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.loupe .lp-lens{position:absolute;top:0;left:0;width:132px;height:132px;border-radius:50%;pointer-events:none;opacity:0;transform:translate(-50%,-50%);background-image:url('/assets/effekte/para-back.jpg');background-repeat:no-repeat;border:3px solid #fff;box-shadow:0 10px 26px rgba(0,0,0,.45);transition:opacity .2s}
.loupe.is-on .lp-lens{opacity:1}

#e-selcolor{overflow:hidden;height:300px !important;background:#0a0d12}
.selcolor{position:absolute;inset:0}
.selcolor .sc-gray,.selcolor .sc-color{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.selcolor .sc-gray{filter:grayscale(1) contrast(1.06) brightness(.95)}
.selcolor .sc-color{filter:saturate(1.35) contrast(1.05);-webkit-mask-image:radial-gradient(ellipse 42% 58% at 55% 48%,#000 52%,transparent 74%);mask-image:radial-gradient(ellipse 42% 58% at 55% 48%,#000 52%,transparent 74%)}

#e-rippleimg{overflow:hidden;height:340px !important;background:#0a0d12}
.rippleimg{position:absolute;inset:0}
.rippleimg .ri-defs{position:absolute;width:0;height:0}
.rippleimg .ri-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:url(#ri-water) saturate(1.15)}
.rippleimg .ri-cap{position:absolute;inset:0;z-index:2;display:grid;place-content:center;text-align:center;pointer-events:none;padding:0 22px}
.rippleimg .ri-kicker{font-family:var(--mono);font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.85);margin-bottom:6px}
.rippleimg .ri-title{margin:0;font-family:var(--sans);font-weight:800;font-size:clamp(28px,4.6vw,46px);letter-spacing:-.02em;color:#fff;text-shadow:0 2px 22px rgba(0,0,0,.55)}

#e-photostack{overflow:hidden;height:380px !important;background:radial-gradient(120% 120% at 50% 0,#141a2e,#080a12 70%)}
.photostack{position:absolute;inset:0}
.photostack .ps-deck{position:absolute;inset:0;display:grid;place-items:center}
.photostack .ps-card{position:absolute;width:70%;max-width:430px;height:74%;border-radius:16px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.48);border:1px solid rgba(255,255,255,.12);transition:transform .6s cubic-bezier(.5,0,.2,1),opacity .6s;will-change:transform}
.photostack .ps-card img{width:100%;height:100%;object-fit:cover;display:block}
.photostack .ps-tag{position:absolute;left:14px;bottom:12px;padding:5px 12px;border-radius:999px;background:rgba(10,13,20,.6);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}

#e-refmarquee{overflow:hidden;height:170px !important;background:#0a0d12;display:grid;align-content:center}
.refmarquee{position:absolute;inset:0;display:flex;align-items:center;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.refmarquee .rm-track{display:flex;gap:16px;align-items:center;animation:rm-scroll 30s linear infinite;will-change:transform}
.refmarquee:hover .rm-track{animation-play-state:paused}
@keyframes rm-scroll{to{transform:translateX(-50%)}}
.refmarquee .rm-item{flex:0 0 auto;width:150px;height:96px;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}
.refmarquee .rm-item img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.9);transition:filter .3s}
.refmarquee .rm-item:hover img{filter:grayscale(0) brightness(1)}
@media(prefers-reduced-motion:reduce){.refmarquee .rm-track{animation:none}}

#e-liquidimg.fx-stage{height:360px;position:relative;overflow:hidden;background:#0a0d12;cursor:crosshair}
#e-liquidimg canvas{display:block;position:absolute;inset:0}
#e-liquidimg .liq-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;opacity:1;transition:opacity .4s ease}
#e-liquidimg.liq-gl .liq-fallback{opacity:0;pointer-events:none}
#e-liquidimg .liq-veil{position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 50% 105%,rgba(10,13,18,.55),rgba(10,13,18,0) 55%)}
@media (prefers-reduced-motion:reduce){
  #e-liquidimg canvas{display:none}
  #e-liquidimg .liq-fallback{opacity:1 !important}
}

#e-particleglobe.fx-stage{height:300px;background:radial-gradient(circle at 50% 45%,#0a1428 0%,#050a16 70%,#03060e 100%);overflow:hidden}
#e-particleglobe canvas{display:block}
@media (prefers-reduced-motion:reduce){
  #e-particleglobe.fx-stage{background:radial-gradient(circle at 50% 45%,#0a1428 0%,#050a16 70%,#03060e 100%)}
}

#e-metaballs.fx-stage{height:300px;overflow:hidden;position:relative;background:radial-gradient(circle at 30% 30%,#0b1220,#05070d 70%)}
#e-metaballs .mb-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
#e-metaballs .mb-group circle{mix-blend-mode:screen}
@media (prefers-reduced-motion:reduce){
  #e-metaballs .mb-group circle{transition:none}
}

#e-coverflow.fx-stage{height:340px;display:flex;align-items:center;justify-content:center;overflow:hidden}
#e-coverflow .cf-wrap{position:relative;width:100%;height:100%;perspective:1200px;perspective-origin:50% 42%}
#e-coverflow .cf-track{position:absolute;inset:0;transform-style:preserve-3d}
#e-coverflow .cf-item{position:absolute;top:50%;left:50%;width:190px;height:130px;margin:-65px 0 0 -95px;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.22,.61,.36,1),opacity .55s ease;cursor:pointer;will-change:transform}
#e-coverflow .cf-item img{display:block;width:100%;height:100%;object-fit:cover;border-radius:8px;box-shadow:0 14px 34px rgba(0,0,0,.55);-webkit-box-reflect:below 4px linear-gradient(transparent 62%,rgba(0,0,0,.28));user-select:none;pointer-events:none}
#e-coverflow .cf-item.is-active{cursor:default}
#e-coverflow .cf-item.is-active img{box-shadow:0 20px 50px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.12)}
#e-coverflow .cf-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;gap:9px;justify-content:center;z-index:5}
#e-coverflow .cf-dot{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:var(--s-faint,rgba(255,255,255,.28));cursor:pointer;transition:background .3s,transform .3s}
#e-coverflow .cf-dot.is-on{background:var(--s-fg,#fff);transform:scale(1.35)}
@media (prefers-reduced-motion:reduce){
#e-coverflow .cf-item{transition:none}
#e-coverflow .cf-item img{-webkit-box-reflect:none}
}

#e-particletext.fx-stage{height:300px;background:radial-gradient(120% 140% at 50% 40%,#0a1626 0%,#050a12 70%);cursor:crosshair}
#e-particletext .pt-canvas{display:block;width:100%;height:100%}
#e-particletext .pt-fallback{position:absolute;inset:0;display:none;align-items:center;justify-content:center;color:#eaf3ff;font-weight:700;font-size:clamp(32px,7vw,64px);letter-spacing:.01em}
@media (prefers-reduced-motion:reduce){
  #e-particletext .pt-canvas{display:none}
  #e-particletext .pt-fallback{display:flex}
}

#e-fluidcursor.fx-stage{height:320px;position:relative;overflow:hidden;background:#08080c;cursor:crosshair}
#e-fluidcursor .flc-canvas{position:absolute;inset:0}
#e-fluidcursor .flc-static{position:absolute;inset:0;display:none;background:#08080c}
#e-fluidcursor .flc-static::after{content:"";position:absolute;left:8%;top:30%;width:84%;height:40%;background:linear-gradient(90deg,rgba(255,60,120,0),rgba(255,60,120,.55) 20%,rgba(120,80,255,.6) 45%,rgba(40,200,220,.6) 70%,rgba(80,255,160,0));filter:blur(28px);border-radius:120px}
@media (prefers-reduced-motion:reduce){
  #e-fluidcursor .flc-canvas{display:none}
  #e-fluidcursor .flc-static{display:block}
}

#e-scrollcine.fx-stage{height:420px;position:relative;overflow:hidden;background:#0a0d12}
#e-scrollcine canvas{display:block}
#e-scrollcine .sc-overlay{position:absolute;left:16px;right:16px;bottom:16px;display:flex;align-items:center;gap:12px;pointer-events:none;z-index:2;font-variant-numeric:tabular-nums}
#e-scrollcine .sc-bar{flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,.14);overflow:hidden}
#e-scrollcine .sc-bar-fill{height:100%;width:0%;border-radius:2px;background:linear-gradient(90deg,#4fd1c5,#63b3ed);transition:width .06s linear}
#e-scrollcine .sc-pct{min-width:44px;text-align:right;font-size:12px;font-weight:600;letter-spacing:.02em;color:rgba(255,255,255,.82)}
#e-scrollcine .sc-label{position:absolute;left:16px;top:14px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.4);z-index:2;pointer-events:none}
@media (prefers-reduced-motion:reduce){
  #e-scrollcine .sc-bar-fill{width:50%!important;transition:none}
}

#e-mosaic{overflow:hidden;height:420px !important;background:#0a0d12}
.mos-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(4,1fr);gap:6px;padding:20px}
.mos-grid .mos-tile{position:relative;border-radius:8px;background-image:url(/assets/effekte/hero-reise.jpg);background-size:600% 400%;background-repeat:no-repeat;filter:saturate(1.06) contrast(1.04);will-change:transform,opacity;transform-origin:center;backface-visibility:hidden}
.mos-vig{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(120% 120% at 50% 42%,transparent 52%,rgba(6,8,14,.62))}
@media(prefers-reduced-motion:reduce){
  #e-mosaic .mos-grid .mos-tile{transform:none !important;opacity:1 !important}
}

#e-rgbsplit.fx-stage{height:300px;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:default}
#e-rgbsplit .rgb-wrap{position:relative;--dx:0px;--dy:0px}
#e-rgbsplit .rgb-word{position:relative;font-weight:800;font-size:clamp(48px,14vw,110px);letter-spacing:.04em;line-height:1;color:var(--s-fg);z-index:2;user-select:none}
#e-rgbsplit .rgb-ghost{position:absolute;top:0;left:0;right:0;font-weight:800;font-size:clamp(48px,14vw,110px);letter-spacing:.04em;line-height:1;text-align:center;pointer-events:none;user-select:none;mix-blend-mode:screen;will-change:transform,opacity;opacity:0;transition:opacity .25s ease}
#e-rgbsplit .rgb-r{color:#ff2d55;transform:translate(calc(var(--dx)*-1),calc(var(--dy)*-1))}
#e-rgbsplit .rgb-c{color:#00e5ff;transform:translate(var(--dx),var(--dy))}
#e-rgbsplit .rgb-wrap.on .rgb-ghost{opacity:.9}
#e-rgbsplit .rgb-wrap.on .rgb-word{color:#f2f2f4}
@media (prefers-reduced-motion:reduce){
  #e-rgbsplit .rgb-ghost{opacity:.8;transition:none}
  #e-rgbsplit .rgb-r{transform:translate(-3px,-2px)}
  #e-rgbsplit .rgb-c{transform:translate(3px,2px)}
}

#e-hscroll.fx-stage{height:380px;overflow:hidden;position:relative;padding:0}
#e-hscroll .hs-track{display:flex;height:100%;width:100%;will-change:transform;transition:transform .05s linear}
#e-hscroll .hs-panel{flex:0 0 100%;width:100%;height:100%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;gap:16px;padding:34px 40px;position:relative;opacity:.32;filter:saturate(.6);transition:opacity .5s ease,filter .5s ease}
#e-hscroll .hs-panel.is-active{opacity:1;filter:saturate(1)}
#e-hscroll .hs-visual{position:relative;height:120px;display:flex;align-items:center;gap:18px}
#e-hscroll .hs-shape{opacity:0;transform:translateY(14px) scale(.9);transition:opacity .6s ease,transform .6s ease}
#e-hscroll .hs-panel.is-active .hs-shape{opacity:1;transform:translateY(0) scale(1)}
#e-hscroll .hs-panel.is-active .hs-shape:nth-child(2){transition-delay:.08s}
#e-hscroll .hs-panel.is-active .hs-shape:nth-child(3){transition-delay:.16s}
#e-hscroll .hs-c1{width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,#5eead4,#0ea5e9)}
#e-hscroll .hs-c2{width:84px;height:84px;border-radius:18px;background:linear-gradient(135deg,#818cf8,#a855f7);transform-origin:center}
#e-hscroll .hs-c3{width:0;height:0;border-left:56px solid transparent;border-right:56px solid transparent;border-bottom:98px solid #f59e0b}
#e-hscroll .hs-bar{width:22px;border-radius:6px;background:linear-gradient(180deg,#22d3ee,#3b82f6)}
#e-hscroll .hs-b1{height:52px}
#e-hscroll .hs-b2{height:88px}
#e-hscroll .hs-b3{height:70px}
#e-hscroll .hs-b4{height:104px}
#e-hscroll .hs-ring{width:92px;height:92px;border-radius:50%;border:14px solid rgba(255,255,255,.14);border-top-color:#34d399;border-right-color:#34d399}
#e-hscroll .hs-idx{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--s-faint);font-weight:600}
#e-hscroll .hs-panel h4{margin:0;font-size:24px;line-height:1.15;color:var(--s-fg);max-width:22ch}
#e-hscroll .hs-panel p{margin:0;font-size:14px;line-height:1.55;color:var(--s-faint);max-width:34ch}
#e-hscroll .hs-dots{position:absolute;left:0;right:0;bottom:16px;display:flex;justify-content:center;gap:10px;z-index:3;pointer-events:none}
#e-hscroll .hs-dot{width:8px;height:8px;border-radius:50%;background:var(--s-line);transition:width .35s ease,background .35s ease}
#e-hscroll .hs-dot.on{width:26px;background:#5eead4}
#e-hscroll .hs-hint-wrap{position:absolute;top:14px;left:0;right:0;text-align:center;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--s-faint);z-index:3;pointer-events:none}
@media (prefers-reduced-motion:reduce){
#e-hscroll .hs-track{transition:none}
#e-hscroll .hs-panel{opacity:1;filter:none}
#e-hscroll .hs-shape{opacity:1;transform:none}
}

.content{position:relative}
.fx-hero-glow{position:absolute;top:-30px;left:-60px;right:0;height:420px;pointer-events:none;z-index:-1;overflow:hidden;opacity:.55}
[data-theme="light"] .fx-hero-glow{opacity:.4}
.fx-hero-glow i{position:absolute;border-radius:50%;filter:blur(70px)}
.fx-hero-glow i:first-child{width:440px;height:300px;left:4%;top:-90px;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 32%,transparent),transparent);
  animation:fxhg1 16s ease-in-out infinite alternate}
.fx-hero-glow i:last-child{width:380px;height:270px;left:36%;top:-50px;
  background:radial-gradient(closest-side,rgba(94,234,212,.18),transparent);
  animation:fxhg2 19s ease-in-out infinite alternate}
@keyframes fxhg1{to{transform:translate(70px,26px) scale(1.12)}}
@keyframes fxhg2{to{transform:translate(-60px,20px) scale(.94)}}
@media (prefers-reduced-motion:reduce){.fx-hero-glow i{animation:none}}

.fx-stats{display:flex;flex-wrap:wrap;margin:2px 0 22px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--panel)}
.fx-stats .st{flex:1 1 150px;min-width:150px;padding:14px 18px;display:flex;flex-direction:column;gap:3px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:-1px}
.fx-stats .st:last-child{border-right:0}
.fx-stats b{font-family:var(--mono);font-size:15px;font-weight:700;color:var(--txt);letter-spacing:.01em;line-height:1.2}
.fx-stats b em{font-style:normal;color:var(--accent)}
.fx-stats span{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--txt-faint)}

@keyframes fxCardIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.fx.fx-anim{animation:fxCardIn .38s ease both}
@media (prefers-reduced-motion:reduce){.fx.fx-anim{animation:none}}

.fx{transition:border-color .25s ease,box-shadow .25s ease}
.fx:hover{border-color:var(--line-2);box-shadow:0 10px 30px rgba(0,0,0,.14)}
.fx.rv{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease,border-color .25s ease,box-shadow .25s ease}
.fx.rv-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.fx.rv{opacity:1;transform:none;transition:none}}

.fx-progress{position:fixed;top:0;left:0;height:2px;width:100%;z-index:99;pointer-events:none;
  transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--accent),#5eead4)}

#e-imagetrail{overflow:hidden;height:380px !important;background:#080b11;cursor:crosshair}
#e-imagetrail .it-word{position:relative;z-index:1;margin:0;font-weight:800;font-size:clamp(24px,4.2vw,42px);letter-spacing:-.02em;
  color:var(--s-fg);text-align:center;line-height:1.25;pointer-events:none;user-select:none;max-width:18ch}
#e-imagetrail .it-word i{font-style:normal;color:var(--accent)}
#e-imagetrail .it-img{position:absolute;z-index:2;left:0;top:0;width:150px;height:105px;object-fit:cover;border-radius:10px;
  opacity:0;pointer-events:none;will-change:transform,opacity;box-shadow:0 14px 34px rgba(0,0,0,.45);
  transform:translate(-50%,-50%) rotate(var(--ro,0deg)) scale(.5)}
#e-imagetrail .it-img.go{animation:itPop 1.05s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes itPop{
  0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--ro,0deg)) scale(.5)}
  14%{opacity:1}
  62%{opacity:1}
  100%{opacity:0;transform:translate(-50%,-50%) translateY(-34px) rotate(0deg) scale(1.05)}
}
@media (prefers-reduced-motion:reduce){#e-imagetrail{cursor:default}#e-imagetrail .it-img.go{animation:none}}

#e-linedraw{overflow:hidden;height:300px !important}
#e-linedraw>svg{width:76%;height:auto;max-height:80%;overflow:visible}
#e-linedraw .ld-p{fill:none;stroke:var(--s-fg);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:var(--len,600);stroke-dashoffset:var(--len,600)}
#e-linedraw .ld-p.acc{stroke:var(--accent)}
#e-linedraw.draw .ld-p{animation:ldDraw 1.5s ease forwards;animation-delay:var(--d,0s)}
@keyframes ldDraw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){#e-linedraw .ld-p{stroke-dashoffset:0;animation:none !important}}

#e-halftone{overflow:hidden;height:340px !important;background:#07090f}
#e-halftone canvas{position:absolute;inset:0;width:100%;height:100%}
#e-halftone .ht-fb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.25) contrast(1.05)}

#e-wavetext{overflow:hidden;height:300px !important}
#e-wavetext .wv{display:flex;align-items:center;gap:.03em;margin:0;font-weight:800;font-size:clamp(38px,8.5vw,80px);
  letter-spacing:.02em;color:var(--s-fg);user-select:none;cursor:default}
#e-wavetext .wv b{display:inline-block;font-weight:800;will-change:transform}
#e-wavetext .wv b:nth-child(odd){color:var(--accent)}

#e-draggrid{overflow:hidden;height:420px !important;background:#06080d;cursor:grab;touch-action:pan-y}
#e-draggrid.dragging{cursor:grabbing}
#e-draggrid canvas{position:absolute;inset:0;width:100%;height:100%}
#e-draggrid .dg-vig{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(130% 130% at 50% 50%,transparent 55%,rgba(4,6,10,.55))}
#e-draggrid .dg-label{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:#e8eef6;
  background:rgba(8,10,16,.55);border:1px solid rgba(255,255,255,.16);border-radius:99px;padding:8px 16px;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

#e-plasma{overflow:hidden;height:300px !important;background:#04060b}
#e-plasma canvas{position:absolute;inset:0;width:100%;height:100%}
#e-plasma.pl2-fb{background:linear-gradient(130deg,#0a1030,#123a8f 38%,#0b6b8f 62%,#071026);
  background-size:280% 280%;animation:pl2fb 14s ease-in-out infinite alternate}
@keyframes pl2fb{from{background-position:0% 0%}to{background-position:100% 100%}}
@media (prefers-reduced-motion:reduce){#e-plasma.pl2-fb{animation:none}}

#e-scrollzoom{overflow:hidden;height:380px !important;background:#05070c}
#e-scrollzoom .sz-clip{position:absolute;inset:0;overflow:hidden;border-radius:22px;transform:scale(.52);
  will-change:transform;transform-origin:center}
#e-scrollzoom .sz-clip img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.06) contrast(1.03)}
#e-scrollzoom .sz-cap{position:absolute;left:26px;bottom:22px;z-index:2;opacity:0;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.55)}
#e-scrollzoom .sz-cap b{display:block;font-size:22px;font-weight:700;letter-spacing:-.01em}
#e-scrollzoom .sz-cap span{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;opacity:.85}
#e-scrollzoom .sz-kick{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:#dfe8f2;
  background:rgba(6,8,12,.5);border:1px solid rgba(255,255,255,.14);border-radius:99px;padding:7px 14px;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none}
@media (prefers-reduced-motion:reduce){
  #e-scrollzoom .sz-clip{transform:scale(1);border-radius:0}
  #e-scrollzoom .sz-cap{opacity:1}
  #e-scrollzoom .sz-kick{opacity:0}
}

#e-kinetictype{overflow:hidden;height:320px !important;background:#070a10}
#e-kinetictype .kt-wrap{display:flex;flex-direction:column;gap:4px;width:100%;transform:rotate(-2deg) scale(1.08)}
#e-kinetictype .kt-row{display:flex;white-space:nowrap;width:max-content;will-change:transform;font-weight:800;
  font-size:clamp(34px,6vw,58px);letter-spacing:.02em;line-height:1.12;color:var(--s-fg)}
#e-kinetictype .kt-row span{padding-right:.6em}
#e-kinetictype .kt-row.alt{color:transparent;-webkit-text-stroke:1.5px color-mix(in srgb,var(--s-fg) 50%,transparent)}
#e-kinetictype .kt-row .acc{color:var(--accent);-webkit-text-stroke:0}

