@keyframes pdmHeroDrift{
  from{transform:scale(1.02) translate3d(0,0,0)}
  to{transform:scale(1.08) translate3d(-1.2%,0,0)}
}
@keyframes pdmTelemetrySweep{
  from{transform:translate3d(-42%,0,0);opacity:0}
  15%{opacity:.35}
  75%{opacity:.35}
  to{transform:translate3d(42%,0,0);opacity:0}
}
@keyframes pdmRise{
  from{opacity:0;transform:translate3d(0,22px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes pdmPulse{
  0%,100%{box-shadow:0 0 0 0 #c8fb4555}
  55%{box-shadow:0 0 0 8px #c8fb4500}
}
@keyframes pdmGlow{
  0%,100%{opacity:.12}
  50%{opacity:.22}
}
@keyframes pdmLap{
  from{transform:translateX(-100%)}
  to{transform:translateX(410%)}
}
@keyframes pdmTickerMove{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@keyframes pdmSpeedLines{
  from{transform:translate3d(26%,0,0)}
  to{transform:translate3d(-26%,0,0)}
}
@keyframes pdmLapTrace{
  from{transform:translateX(-115%)}
  to{transform:translateX(410%)}
}

.hero{position:relative;isolation:isolate;overflow:hidden;background:#071018}
.hero::before{
  content:"";position:absolute;inset:-4%;z-index:0;pointer-events:none;
  background-image:linear-gradient(90deg,#071018f5 0%,#071018d9 42%,#0710188c 68%,#07101855 100%),var(--pdm-home-image,url('assets/pdm-carrera-grid.jpg'));
  background-size:cover;background-position:center 51%;
  animation:pdmHeroDrift 22s ease-in-out infinite alternate;
}
.hero::after{
  content:"";position:absolute;inset:0 -55%;z-index:0;pointer-events:none;
  background:linear-gradient(105deg,transparent 46%,#6cd9e814 49%,#c8fb4515 50%,transparent 54%);
  animation:pdmTelemetrySweep 12s linear infinite;
}
.hero-grid{z-index:1}
.hero-copy .eyebrow{animation:pdmRise .65s both}
.hero-copy h1{animation:pdmRise .75s .12s both}
.hero-copy>p{animation:pdmRise .75s .26s both}
.hero-actions{animation:pdmRise .75s .38s both}
.hero-foot{animation:pdmRise .75s .52s both}
.hero-visual .visual-label{animation:pdmRise .8s .45s both}
.hero-visual .visual-bottom{animation:pdmRise .8s .65s both}
.hero-visual .big-number{animation:pdmGlow 7s ease-in-out infinite}
.hero-foot{position:relative;padding-top:16px;overflow:hidden}
.hero-foot::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:#d9e5de40}
.hero-foot::after{content:"";position:absolute;top:0;left:0;width:25%;height:2px;background:linear-gradient(90deg,transparent,var(--lime),var(--cyan));box-shadow:0 0 12px #c8fb4570;animation:pdmLapTrace 5.5s linear infinite}
.hero-visual::after{
  content:"";position:absolute;inset:-25%;pointer-events:none;opacity:.22;
  background:repeating-linear-gradient(112deg,transparent 0 74px,#c8fb4533 75px 77px,transparent 78px 126px,#6cd9e82b 127px 128px);
  animation:pdmSpeedLines 9s linear infinite;
}
body[data-portal="carreras"] .page-heading .eyebrow{animation:pdmRise .6s both}
body[data-portal="carreras"] .page-heading h1{animation:pdmRise .75s .12s both}
body[data-portal="carreras"] .page-heading>p{animation:pdmRise .75s .25s both}
body[data-portal="carreras"] .page-heading .notice{animation:pdmRise .75s .38s both}

.demo-pulse,.live-server-status.online::before{animation:pdmPulse 2.4s ease-out infinite}
.live-server-card.animate-in{animation:pdmRise .65s both}
.live-server-card.animate-in:nth-child(2){animation-delay:.1s}
.live-server-card.animate-in:nth-child(3){animation-delay:.2s}
.live-feed{position:relative;overflow:hidden}
.live-feed::before{
  content:"";position:absolute;top:0;left:0;width:25%;height:2px;
  background:linear-gradient(90deg,transparent,var(--lime),var(--cyan),transparent);
  box-shadow:0 0 16px #c8fb4570;
  animation:pdmLap 7s linear infinite;
}
.race-ticker-track{animation:pdmTickerMove 26s linear infinite}
.race-ticker:hover .race-ticker-track,.race-ticker:focus-within .race-ticker-track{animation-play-state:paused}
.motion-reveal{opacity:0;transform:translate3d(0,28px,0);transition:opacity .7s ease,transform .7s ease}
.motion-reveal.is-visible{opacity:1;transform:none}

.server-card,.live-server-card{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.server-card:hover,.live-server-card:hover{transform:translateY(-5px);border-color:#a2c854;box-shadow:0 18px 38px #0006}
.server-card .card-art{transition:background-size .4s ease,filter .4s ease;background-size:cover}
.server-card:hover .card-art{filter:brightness(1.12);background-size:108%}
.button-primary,.header-cta{transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease}
.button-primary:hover,.header-cta:hover{transform:translateY(-2px);box-shadow:0 8px 24px #c8fb4533}
.button-primary:active,.header-cta:active{transform:translateY(0)}
.button-primary span,.header-cta span{display:inline-block;transition:transform .25s ease}
.button-primary:hover span,.header-cta:hover span{transform:translate(4px,-3px)}
.site-header nav a,.section-link,.text-link{transition:color .2s ease,opacity .2s ease}

@media(max-width:760px){
  .hero::before{background-position:64% center;animation-duration:28s}
  .hero::after{opacity:.25}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  .hero::before{transform:none}
  .motion-reveal{opacity:1;transform:none}
}