:root{--y:#f0ff00;--bg:#02090d;--p:#071218;--p2:#0b171e;--txt:#f7f9fa;--muted:#aeb9bf;--line:#26343c;--max:1500px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--txt);font-family:Inter,Arial,Helvetica,sans-serif;line-height:1.45}a{color:inherit;text-decoration:none}.promo{height:38px;background:var(--y);color:#05090b;display:flex;align-items:center;justify-content:center;gap:55px;font-size:12px;font-weight:900}.promo a{background:#071016;color:#fff;padding:5px 13px;border-radius:999px}.header{height:78px;position:sticky;top:0;z-index:50;background:#030a0eee;backdrop-filter:blur(16px);display:flex;align-items:center;padding:0 max(28px,calc((100vw - var(--max))/2));gap:45px;border-bottom:1px solid #ffffff12}.logo img{width:155px;height:55px;object-fit:contain}.nav{display:flex;gap:32px;font-size:14px}.nav a:hover{color:var(--y)}.right{margin-left:auto;display:flex;gap:22px;align-items:center;font-size:13px}.btn{display:inline-flex;justify-content:center;align-items:center;padding:15px 21px;border-radius:7px;background:var(--y);color:#05090b;font-weight:900;transition:.25s}.btn:hover{transform:translateY(-3px);box-shadow:0 15px 40px #efff0030}.outline{background:#071016aa;color:#fff;border:1px solid #68747a}.hamb{display:none;background:0;border:0;color:#fff;font-size:25px}.hero{min-height:640px;position:relative;background:#03090d url('../images/hero-cat-v3.png') 68% 50%/min(66vw,1050px) auto no-repeat;overflow:hidden}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#02090d 0,#02090df2 31%,#02090d8c 49%,#02090d18 70%),linear-gradient(0deg,#02090d 0,transparent 20%)}.heroIn{max-width:var(--max);margin:auto;padding:74px 30px 62px;position:relative;z-index:2}.heroCopy{max-width:640px}.eyebrow{font-size:11px;font-weight:900;letter-spacing:.28em}.eyebrow:after{content:"";display:inline-block;width:60px;height:2px;background:var(--y);vertical-align:middle;margin-left:15px}.hero h1{font-size:clamp(54px,4.4vw,76px);line-height:.94;letter-spacing:-.055em;margin:15px 0 22px}.yellow,h2 span{color:var(--y)}.lead{font-size:17px;max-width:590px}.actions{display:flex;gap:15px;margin:28px 0 34px}.features{display:flex}.features div{display:flex;gap:12px;padding:0 27px;border-right:1px solid #73808780}.features div:first-child{padding-left:0}.features b{color:var(--y);font-size:27px}.features span{font-size:13px;font-weight:800}.features small{display:block;color:#c0c7cb;font-weight:500}.scribble{position:absolute;font-family:"Comic Sans MS",cursive;font-size:21px;text-shadow:0 3px 10px #000}.s1{left:55%;top:12%;transform:rotate(-8deg)}.s2{right:6%;top:39%;transform:rotate(6deg)}.trust{height:100px;display:grid;grid-template-columns:1.1fr repeat(5,1fr);align-items:center;max-width:var(--max);margin:auto;padding:0 30px;border-bottom:1px solid var(--line);font-weight:850;color:#c7d0d4}.trust small{letter-spacing:.25em}.trust span{text-align:center}.section{max-width:var(--max);margin:auto;padding:95px 30px}.head{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:end;margin-bottom:45px}.head h2,.pageHero h1{font-size:clamp(45px,4.5vw,70px);line-height:.95;letter-spacing:-.055em;margin:10px 0}.head>p{color:var(--muted);font-size:17px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.card{border:1px solid var(--line);background:linear-gradient(145deg,#0c171e,#061016);border-radius:9px;padding:28px;min-height:230px;transition:.35s}.card:hover{transform:translateY(-8px);border-color:#899400;box-shadow:0 25px 60px #0009}.card i{font-style:normal;color:var(--y);font-size:34px}.card h3{margin-top:35px}.card p,.muted{color:var(--muted)}.projects{border-top:1px solid var(--line)}.projectGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.project{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#071117;transition:.35s}.project:hover{transform:translateY(-6px);border-color:#8a9600}.project img{width:100%;aspect-ratio:1.55;object-fit:cover;display:block;transition:.6s}.project:hover img{transform:scale(1.04)}.project div{padding:22px}.project small{font-size:10px;letter-spacing:.16em}.project h3{font-size:23px;margin:6px 0}.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:38px}.stats div{border-right:1px solid var(--line);padding:0 28px}.stats div:first-child{padding-left:0}.stats b{display:block;color:var(--y);font-size:30px}.stats span{font-size:13px}.cta{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center;background:radial-gradient(circle at 88% 100%,#2c3600,#03090d 40%)}.cta p{color:var(--muted)}.cta h2{font-size:clamp(43px,4vw,65px);line-height:.96;margin:10px 0}.cta .actions{margin-bottom:0}.footer{border-top:1px solid var(--line);min-height:130px;max-width:var(--max);margin:auto;padding:28px 30px;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;color:#aab4b9;font-size:12px}.footer img{width:145px}.footer nav{display:flex;gap:24px;justify-content:center}.footer p{text-align:right}.pageHero{min-height:390px;display:flex;align-items:center;border-bottom:1px solid var(--line);background:radial-gradient(circle at 80% 30%,#1d2b30,#03090d 50%)}.pageHero>div{max-width:var(--max);width:100%;margin:auto;padding:65px 30px}.pageHero p{max-width:700px;color:var(--muted);font-size:18px}.split{display:grid;grid-template-columns:1fr 1fr;gap:60px}.list{display:grid;gap:14px}.list article{border:1px solid var(--line);padding:25px;border-radius:8px;background:#071117}.form{display:grid;gap:13px}.form input,.form textarea{width:100%;padding:15px;border:1px solid var(--line);background:#071117;color:#fff;border-radius:7px}.form textarea{min-height:160px}.reveal{opacity:0;transform:translateY(25px);transition:.8s}.reveal.show{opacity:1;transform:none}
@media(max-width:900px){.promo{font-size:9px;padding:0 12px}.promo a,.right{display:none}.header{height:68px;padding:0 20px}.nav{display:none}.hamb{display:block;margin-left:auto}.header.open .nav{display:flex;position:absolute;top:68px;left:0;right:0;background:#03090d;padding:24px;flex-direction:column}.hero{min-height:790px;background-size:auto 390px;background-position:62% 0;background-repeat:no-repeat}.hero:after{background:linear-gradient(180deg,#02090d05 0,#02090d28 28%,#02090df2 49%,#02090d 63%)}.heroIn{padding:365px 22px 38px}.heroCopy{max-width:100%}.hero h1{font-size:clamp(42px,12vw,54px);line-height:.96}.lead{font-size:15px}.scribble{font-size:14px}.s1{left:5%;top:7%}.s2{right:4%;top:25%}.actions{flex-direction:column}.features{justify-content:space-between}.features div{padding:0 8px;border:0}.features b{font-size:21px}.features span,.features small{font-size:10px}.trust{height:auto;padding:25px 20px;grid-template-columns:1fr 1fr;gap:20px}.trust small{grid-column:1/-1;text-align:center}.section{padding:70px 22px}.head,.split,.cta{grid-template-columns:1fr;gap:25px}.cards,.projectGrid{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr;gap:25px}.stats div{padding:0;border:0}.footer{grid-template-columns:1fr;gap:20px}.footer nav{justify-content:flex-start;flex-wrap:wrap}.footer p{text-align:left}.pageHero>div{padding:55px 22px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}

@media(min-width:1600px){.hero{background-size:1050px auto;background-position:72% 48%}.heroIn{padding-left:30px}.section{padding-top:82px;padding-bottom:82px}}

@media(max-width:520px){.promo{height:34px;white-space:nowrap;overflow:hidden}.logo img{width:132px}.hero{min-height:760px;background-size:auto 345px;background-position:60% 0}.heroIn{padding-top:330px}.hero h1{font-size:43px}.eyebrow{font-size:9px;letter-spacing:.2em}.actions .btn{width:100%;padding:14px 12px}.features{gap:4px}.features div{flex:1}.trust{font-size:11px}.head h2,.pageHero h1{font-size:43px}.section{padding:58px 18px}.card{min-height:auto}.stats b{font-size:24px}}

/* V3 hero correction: generated artwork already contains the handwritten captions. */
.hero .scribble{display:none!important}
.hero{
  background-image:url('../images/hero-cat-v3.png')!important;
  background-repeat:no-repeat!important;
  background-color:#02090d!important;
  background-position:center center!important;
  background-size:cover!important;
}
.hero:after{
  background:linear-gradient(90deg,rgba(2,9,13,.96) 0%,rgba(2,9,13,.82) 30%,rgba(2,9,13,.28) 52%,rgba(2,9,13,.08) 78%),
             linear-gradient(0deg,#02090d 0%,transparent 18%)!important;
}
.heroCopy{position:relative;z-index:4}
@media (min-width:1400px){
 .hero{min-height:680px;background-position:center center!important}
 .heroIn{padding-top:92px}
}
@media (max-width:900px){
 .hero{
   min-height:760px!important;
   background-size:auto 440px!important;
   background-position:center top!important;
 }
 .hero:after{
   background:linear-gradient(180deg,rgba(2,9,13,.05) 0%,rgba(2,9,13,.12) 36%,rgba(2,9,13,.94) 57%,#02090d 72%)!important;
 }
 .heroIn{padding:385px 22px 42px!important}
 .hero h1{font-size:46px!important}
}
@media (max-width:520px){
 .hero{background-size:auto 340px!important;min-height:720px!important}
 .heroIn{padding-top:300px!important}
 .hero h1{font-size:40px!important}
 .lead{font-size:16px!important}
}


/* === V4 INTERAKTIVE EFFEKTE === */
body{overflow-x:hidden}
.hero{isolation:isolate}
.hero::before{
  content:"";position:absolute;inset:-3%;z-index:1;pointer-events:none;
  background:
    radial-gradient(circle at var(--mx,65%) var(--my,42%),rgba(240,255,0,.12),transparent 18%),
    radial-gradient(circle at 70% 45%,rgba(255,190,70,.08),transparent 25%);
  transition:background-position .15s linear;
}
.heroIn{z-index:3}
.hero{
  --hero-x:0px;--hero-y:0px;
  background-position:calc(50% + var(--hero-x)) calc(50% + var(--hero-y))!important;
  transition:background-position .18s ease-out;
}
.heroCopy{transition:transform .18s ease-out;transform:translate3d(var(--copy-x,0),var(--copy-y,0),0)}
.card,.project,.btn{will-change:transform}
.card,.project{
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0px));
  transition:transform .16s ease-out,border-color .3s,box-shadow .3s;
}
.card:hover,.project:hover{--lift:-7px;box-shadow:0 25px 70px rgba(0,0,0,.55),0 0 35px rgba(240,255,0,.05)}
.cursor-glow{
  position:fixed;width:260px;height:260px;border-radius:50%;z-index:9997;pointer-events:none;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(240,255,0,.10) 0%,rgba(240,255,0,.035) 35%,transparent 70%);
  mix-blend-mode:screen;opacity:0;transition:opacity .25s;
}
.cursor-dot{
  position:fixed;width:7px;height:7px;border-radius:50%;background:var(--y);z-index:9999;
  pointer-events:none;transform:translate(-50%,-50%);box-shadow:0 0 18px var(--y);opacity:0;
}
.spark{
  position:fixed;z-index:9998;pointer-events:none;color:var(--y);font-size:11px;
  animation:sparkOut .65s ease-out forwards;text-shadow:0 0 10px var(--y)
}
@keyframes sparkOut{0%{opacity:.9;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(var(--sx),var(--sy)) scale(.15) rotate(80deg)}}
@keyframes heroFloat{
  0%,100%{background-position:50% 50%}
  50%{background-position:50.7% 49.2%}
}
@media (hover:hover) and (pointer:fine){
  .hero.idle{animation:heroFloat 6s ease-in-out infinite}
  a,.btn,.card,.project{cursor:pointer}
}
@media(max-width:900px){
  .cursor-glow,.cursor-dot{display:none!important}
  .hero{background-position:center top!important}
  .heroCopy{transform:none!important}
}
@media(prefers-reduced-motion:reduce){
  .hero,.heroCopy,.card,.project{animation:none!important;transform:none!important}
  .cursor-glow,.cursor-dot,.spark{display:none!important}
}

/* Cookie settings */
.cookie-banner{position:fixed;left:24px;right:24px;bottom:24px;z-index:10050;max-width:760px;margin:auto;background:rgba(5,14,19,.98);border:1px solid #33434b;border-radius:18px;padding:24px;box-shadow:0 24px 80px rgba(0,0,0,.6);backdrop-filter:blur(18px)}
.cookie-banner[hidden]{display:none}.cookie-banner h2{margin:0 0 9px;color:#fff;font-size:22px}.cookie-banner p{margin:0;color:#bdc8cd;line-height:1.55;font-size:14px}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.cookie-actions button{border:1px solid #40515a;border-radius:10px;padding:11px 17px;background:#0a171d;color:#fff;font:inherit;font-weight:700;cursor:pointer}
.cookie-actions .cookie-ok{background:var(--y);border-color:var(--y);color:#071014}.cookie-link{position:fixed;right:18px;bottom:18px;z-index:9000;border:1px solid #34444c;background:#071218;color:#dce5e8;border-radius:999px;padding:9px 13px;font:inherit;font-size:12px;cursor:pointer;opacity:.82}
.cookie-link:hover{opacity:1;border-color:var(--y)}@media(max-width:600px){.cookie-banner{left:12px;right:12px;bottom:12px;padding:19px}.cookie-actions button{width:100%}.cookie-link{right:10px;bottom:10px}}

/* V11 global header + footer */
.site-global-header{position:sticky;top:0;z-index:10000;background:rgba(2,9,13,.92);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px)}
.global-nav{width:min(1280px,calc(100% - 44px));height:78px;margin:auto;display:flex;align-items:center;gap:28px}
.global-brand img{display:block;width:150px;max-height:48px;object-fit:contain}.global-links{display:flex;gap:27px;margin-left:auto}.global-links a,.global-mail{color:#dce5e8;text-decoration:none;font-size:14px;font-weight:650}.global-links a:hover,.global-mail:hover{color:var(--y)}
.global-actions{display:flex;align-items:center;gap:18px}.global-cta{background:var(--y);color:#071014!important;text-decoration:none;padding:11px 16px;border-radius:8px;font-weight:850;font-size:13px}.global-menu-btn{display:none;background:none;border:1px solid #35444c;color:#fff;border-radius:8px;padding:7px 10px;font-size:20px}
.site-global-footer{border-top:1px solid #26343c;background:#02080c;padding:58px 24px 20px;color:#9eabb1}.global-footer-grid{width:min(1280px,100%);margin:auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px}.global-footer-grid>div{display:flex;flex-direction:column;gap:10px}.global-footer-grid strong{color:#fff;margin-bottom:8px}.global-footer-grid a{color:#aeb9bf;text-decoration:none}.global-footer-grid a:hover{color:var(--y)}.global-footer-logo{width:165px;max-height:55px;object-fit:contain;object-position:left center}.global-footer-bottom{width:min(1280px,100%);margin:42px auto 0;padding-top:18px;border-top:1px solid #1c282e;font-size:13px}
@media(max-width:850px){.global-nav{height:70px;width:calc(100% - 28px);flex-wrap:wrap}.global-brand img{width:125px}.global-menu-btn{display:block;margin-left:auto}.global-actions{display:none}.global-links{display:none;position:absolute;left:0;right:0;top:70px;background:#061116;border-bottom:1px solid #26343c;padding:18px 22px;flex-direction:column;gap:16px}.site-global-header.menu-open .global-links{display:flex}.global-footer-grid{grid-template-columns:1fr;gap:32px}}


/* === FINAL MOBILE OPTIMIERUNG + TOUCH-EFFEKTE === */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
img,video{max-width:100%;height:auto}
a,button{-webkit-tap-highlight-color:transparent}
button,input,textarea,select{font:inherit}

@media (max-width:850px){
  body{overflow-x:hidden}
  main,section{max-width:100%}
  .global-nav{height:68px;width:calc(100% - 24px);gap:10px}
  .global-brand img{width:118px;max-height:42px}
  .global-menu-btn{
    position:relative;display:grid;place-items:center;width:43px;height:43px;padding:0;
    border-radius:12px;border:1px solid rgba(255,255,255,.13);
    background:rgba(255,255,255,.035);transition:transform .2s ease,border-color .2s ease,background .2s ease
  }
  .global-menu-btn:active{transform:scale(.92);border-color:var(--y);background:rgba(239,255,0,.08)}
  .global-links{
    top:68px;padding:12px 14px 20px;gap:7px;background:rgba(3,12,17,.98);
    backdrop-filter:blur(20px);box-shadow:0 26px 50px rgba(0,0,0,.38);
    transform-origin:top;animation:mobileMenuIn .26s ease both
  }
  .global-links a{
    display:flex;align-items:center;min-height:48px;padding:0 13px;border-radius:12px;
    border:1px solid transparent;font-size:15px
  }
  .global-links a:active{background:rgba(239,255,0,.08);border-color:rgba(239,255,0,.28);color:var(--y)}
  .site-global-header{backdrop-filter:blur(18px)}
  .site-global-footer{padding:44px 18px 88px}
  .global-footer-grid{gap:28px}
  .global-footer-bottom{margin-top:28px}
  .cookie-link{bottom:12px;right:10px;max-width:44vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  .hero{
    min-height:auto!important;
    background-position:center top!important;
    background-attachment:scroll!important;
    transition:none!important
  }
  .heroIn{padding-left:18px!important;padding-right:18px!important}
  .hero h1{line-height:1!important;letter-spacing:-.045em}
  .lead{line-height:1.65}
  .actions,.heroActions{display:flex;flex-direction:column;align-items:stretch;gap:10px}
  .actions .btn,.heroActions .btn{width:100%;justify-content:center;text-align:center}

  .card,.project{
    transform:none!important;will-change:auto;border-radius:20px;
    transition:transform .22s ease,border-color .25s ease,box-shadow .25s ease
  }
  .card:active,.project:active{
    transform:scale(.985)!important;
    border-color:rgba(239,255,0,.36);
    box-shadow:0 16px 38px rgba(0,0,0,.34),0 0 24px rgba(239,255,0,.035)
  }
  .project img,.card img{
    transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .3s ease;
    object-fit:cover
  }
  .project.is-visible img,.card.is-visible img{transform:scale(1.018)}
  .project:active img,.card:active img{transform:scale(1.035)}

  .btn,.global-cta,.about-cta{
    position:relative;overflow:hidden;min-height:46px;touch-action:manipulation
  }
  .btn::after,.global-cta::after,.about-cta::after{
    content:"";position:absolute;inset:-80% auto -80% -45%;width:30%;
    transform:rotate(18deg) translateX(-220%);background:rgba(255,255,255,.32);
    transition:transform .5s ease;pointer-events:none
  }
  .btn.touch-shine::after,.global-cta.touch-shine::after,.about-cta.touch-shine::after{
    transform:rotate(18deg) translateX(600%)
  }

  .mobile-reveal{
    opacity:0;transform:translate3d(0,22px,0) scale(.99);
    transition:opacity .58s ease,transform .58s cubic-bezier(.2,.7,.2,1)
  }
  .mobile-reveal.is-visible{opacity:1;transform:none}
  .mobile-reveal[data-delay="1"]{transition-delay:.06s}
  .mobile-reveal[data-delay="2"]{transition-delay:.12s}
  .mobile-reveal[data-delay="3"]{transition-delay:.18s}

  .touch-ripple{
    position:fixed;width:18px;height:18px;border:1px solid rgba(239,255,0,.8);
    border-radius:50%;pointer-events:none;z-index:10020;
    transform:translate(-50%,-50%) scale(.3);opacity:.75;
    animation:touchRipple .62s ease-out forwards;
    box-shadow:0 0 18px rgba(239,255,0,.28)
  }

  .scroll-progress{
    position:fixed;left:0;top:0;height:2px;width:var(--scroll-p,0%);
    z-index:10030;background:var(--y);box-shadow:0 0 10px rgba(239,255,0,.65);
    pointer-events:none;transition:width .08s linear
  }

  .hero-cat,.cat,.cat-wrap img,img[src*="cat"]{
    transform-origin:50% 75%;
    animation:mobileCatFloat 4.6s ease-in-out infinite;
    will-change:transform
  }

  .about-v25{padding-left:18px!important;padding-right:18px!important}
  .about-hero h1{font-size:clamp(44px,14vw,72px)!important}
  .about-lead{font-size:17px!important}
  .about-card,.region-copy,.region-quote{border-radius:20px!important}
  .about-card{padding:28px 22px!important}
  .about-focus{margin-top:58px!important}
  .about-values{gap:12px!important}
}

@media (max-width:520px){
  .hero{min-height:auto!important;background-size:auto 315px!important}
  .heroIn{padding-top:270px!important;padding-bottom:50px!important}
  .hero h1{font-size:clamp(38px,12vw,50px)!important}
  .lead{font-size:16px!important}
  .global-brand img{width:108px}
  .project,.card{border-radius:18px}
  .cookie-banner{max-height:72vh;overflow:auto}
}

@keyframes mobileMenuIn{
  from{opacity:0;transform:translateY(-8px) scaleY(.97)}
  to{opacity:1;transform:none}
}
@keyframes touchRipple{
  0%{opacity:.75;transform:translate(-50%,-50%) scale(.3)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(5)}
}
@keyframes mobileCatFloat{
  0%,100%{transform:translate3d(0,0,0) rotate(-.4deg)}
  50%{transform:translate3d(0,-7px,0) rotate(.4deg)}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .mobile-reveal,.mobile-reveal.is-visible{opacity:1!important;transform:none!important;transition:none!important}
  .hero-cat,.cat,.cat-wrap img,img[src*="cat"]{animation:none!important}
  .touch-ripple,.scroll-progress{display:none!important}
}


/* === HERO FINAL EFFECTS: "Digitale Ideen. Echte Ergebnisse." + Hero-Bild === */
.hero{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.hero::before{
  content:"";
  position:absolute;
  inset:-12%;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at var(--hero-x,68%) var(--hero-y,36%),
      rgba(239,255,0,.12), transparent 22%),
    radial-gradient(circle at 22% 38%,
      rgba(255,255,255,.045), transparent 24%);
  transition:background-position .25s ease;
}
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(3,10,15,.72) 0%,rgba(3,10,15,.34) 46%,rgba(3,10,15,.06) 72%);
}
.heroIn{
  position:relative;
  z-index:3;
}
.hero h1{
  position:relative;
  display:inline-block;
  text-wrap:balance;
}
.hero h1 .hero-line{
  display:block;
  opacity:0;
  transform:translate3d(0,30px,0);
  filter:blur(8px);
  animation:heroLineIn .85s cubic-bezier(.16,.7,.2,1) forwards;
}
.hero h1 .hero-line:nth-child(2){
  animation-delay:.13s;
}
.hero h1 .hero-line-accent{
  position:relative;
}
.hero h1 .hero-line-accent::after{
  content:"";
  position:absolute;
  left:1%;
  bottom:-8px;
  width:0;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,#efff00,rgba(239,255,0,.15));
  box-shadow:0 0 18px rgba(239,255,0,.36);
  animation:heroUnderline 1s .72s cubic-bezier(.16,.7,.2,1) forwards;
}
.hero h1 .hero-word-glow{
  color:#efff00;
  text-shadow:0 0 22px rgba(239,255,0,.12);
}
.hero .lead,
.hero .actions,
.hero .heroActions{
  opacity:0;
  transform:translateY(16px);
  animation:heroFadeUp .65s .48s ease forwards;
}
.hero .actions,
.hero .heroActions{animation-delay:.62s}

/* Hero image / visual */
.hero img,
.hero .hero-media img,
.hero .hero-image img,
.hero picture img{
  position:relative;
  z-index:2;
  transform:translate3d(var(--hero-img-x,0px),var(--hero-img-y,0px),0) scale(1.035);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),filter .35s ease;
  filter:saturate(1.03) contrast(1.02);
  will-change:transform;
}
.hero .hero-media,
.hero .hero-image,
.hero picture{
  position:relative;
}
.hero .hero-media::after,
.hero .hero-image::after{
  content:"";
  position:absolute;
  inset:8% 4% 6%;
  z-index:1;
  pointer-events:none;
  border-radius:28px;
  box-shadow:0 0 52px rgba(239,255,0,.065);
}

/* Background-image hero fallback effect */
.hero.hero-bg-shift{
  background-position:
    calc(50% + var(--hero-bg-x,0px))
    calc(50% + var(--hero-bg-y,0px));
}

/* Mobile: same effect but lighter */
@media(max-width:850px){
  .hero::before{
    background:
      radial-gradient(circle at 72% 25%,rgba(239,255,0,.095),transparent 24%),
      radial-gradient(circle at 18% 44%,rgba(255,255,255,.035),transparent 28%);
  }
  .hero::after{
    background:linear-gradient(180deg,rgba(3,10,15,.12) 0%,rgba(3,10,15,.44) 42%,rgba(3,10,15,.86) 78%);
  }
  .hero h1 .hero-line{
    animation-duration:.72s;
    transform:translate3d(0,22px,0);
  }
  .hero h1 .hero-line-accent::after{
    bottom:-5px;
    height:2px;
  }
  .hero img,
  .hero .hero-media img,
  .hero .hero-image img,
  .hero picture img{
    transform:scale(1.02);
    animation:heroMobileFloat 5s ease-in-out infinite;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero h1 .hero-line,
  .hero .lead,
  .hero .actions,
  .hero .heroActions{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    animation:none!important;
  }
  .hero h1 .hero-line-accent::after{
    width:68%!important;
    animation:none!important;
  }
  .hero img,
  .hero .hero-media img,
  .hero .hero-image img,
  .hero picture img{
    transform:none!important;
    animation:none!important;
  }
}

@keyframes heroLineIn{
  to{opacity:1;transform:none;filter:blur(0)}
}
@keyframes heroFadeUp{
  to{opacity:1;transform:none}
}
@keyframes heroUnderline{
  to{width:68%}
}
@keyframes heroMobileFloat{
  0%,100%{transform:translate3d(0,0,0) scale(1.02)}
  50%{transform:translate3d(0,-6px,0) scale(1.028)}
}