@media (prefers-reduced-motion: no-preference){
  .nav{
    animation: nav-drop .68s cubic-bezier(.22,1,.36,1) both;
  }

  .framer-badge{
    animation: badge-rise .8s cubic-bezier(.22,1,.36,1) .45s both;
  }

  .reveal{
    opacity:0;
    transform:translateY(30px);
    transition:
      opacity .76s cubic-bezier(.22,1,.36,1),
      transform .76s cubic-bezier(.22,1,.36,1);
    transition-delay:var(--reveal-delay,0s);
    will-change:opacity,transform;
  }

  .reveal.is-visible{
    opacity:1;
    transform:none;
  }

  .btn,
  .round,
  .team-nav span,
  .testimonial-nav span,
  .service-tile .learn{
    transition:
      transform .32s cubic-bezier(.22,1,.36,1),
      filter .32s ease,
      background-color .32s ease,
      color .32s ease;
  }

  .btn:hover,
  .round:hover,
  .team-nav span:hover,
  .testimonial-nav span:hover,
  .service-tile .learn:hover{
    transform:translateY(-2px);
    filter:brightness(1.04);
  }

  .btn .arrow,
  .newsletter button .arrow,
  .open{
    transition:transform .36s cubic-bezier(.22,1,.36,1);
  }

  .btn:hover .arrow,
  .newsletter button:hover .arrow,
  .post-card:hover .open,
  .team-card:hover .open{
    transform:translate(2px,-2px) rotate(8deg);
  }

  .navlinks a{
    position:relative;
    transition:opacity .28s ease,transform .28s cubic-bezier(.22,1,.36,1);
  }

  .navlinks a:hover{
    opacity:.68;
    transform:translateY(-2px);
  }

  .logos span{
    animation: logo-breathe 4.6s ease-in-out infinite;
    animation-delay:calc(var(--logo-index,0) * .18s);
  }

  .mosaic-card,
  .info-card,
  .service-card,
  .expert-card,
  .feature,
  .plan,
  .quote,
  .post,
  .post-card,
  .team-card,
  .testimonial-card,
  .service-tile,
  .year,
  .contact-card,
  .form-card{
    transition:
      transform .42s cubic-bezier(.22,1,.36,1),
      box-shadow .42s ease,
      filter .42s ease;
  }

  .mosaic-card:hover,
  .info-card:hover,
  .service-card:hover,
  .expert-card:hover,
  .feature:hover,
  .plan:hover,
  .quote:hover,
  .post:hover,
  .post-card:hover,
  .team-card:hover,
  .testimonial-card:hover,
  .service-tile:hover,
  .year:hover{
    transform:translateY(-6px);
    box-shadow:0 24px 70px rgba(0,0,0,.10);
  }

  .post,
  .post-card .image-wrap,
  .testimonial-card,
  .team-card,
  .mosaic-card,
  .service-img{
    overflow:hidden;
  }

  .post img,
  .post-card img,
  .testimonial-card img,
  .team-card img,
  .mosaic-card img,
  .service-img img,
  .feature-post img,
  .why img{
    transition:transform .85s cubic-bezier(.22,1,.36,1),filter .85s ease;
  }

  .post:hover img,
  .post-card:hover img,
  .testimonial-card:hover img,
  .team-card:hover img,
  .mosaic-card:hover img,
  .service-img:hover img,
  .feature-post:hover img,
  .why img:hover{
    transform:scale(1.045);
  }

  .device-stack .black,
  .device-card.one,
  .lower-art-left .small1{
    animation: float-left 5.8s ease-in-out infinite;
  }

  .device-stack .white,
  .device-card.two,
  .lower-art-left .big{
    animation: float-right 5.8s ease-in-out infinite;
  }

  .orbit-rings{
    animation: ring-drift 9s ease-in-out infinite;
  }

  .orbit-rings span{
    animation: chip-float 4.8s ease-in-out infinite;
  }

  .orbit-rings span:nth-child(2){animation-delay:-1.4s}
  .orbit-rings span:nth-child(3){animation-delay:-2.8s}

  .cta,
  .closing-panel,
  .service-hero,
  .hero{
    isolation:isolate;
  }

  .cta::after,
  .closing-panel::after,
  .service-hero::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.42;
    background:linear-gradient(105deg,transparent 0 38%,rgba(255,255,255,.28) 48%,transparent 60% 100%);
    transform:translateX(-120%);
    animation: panel-sheen 8.5s ease-in-out infinite;
    z-index:1;
  }

  .cta,
  .closing-panel,
  .service-hero{
    position:relative;
  }

  .cta > *,
  .closing-panel > *,
  .service-hero > *{
    position:relative;
    z-index:2;
  }

  .field input,
  .field textarea,
  .newsletter input{
    transition:border-color .24s ease,box-shadow .24s ease,transform .24s ease;
  }

  .field input:focus,
  .field textarea:focus,
  .newsletter:focus-within{
    box-shadow:0 0 0 4px rgba(217,255,53,.22);
    border-color:rgba(17,17,17,.28);
  }

  .socials span{
    transition:transform .28s cubic-bezier(.22,1,.36,1),background-color .28s ease,color .28s ease;
  }

  .socials span:hover{
    transform:translateY(-3px) scale(1.06);
    background:var(--lime);
    color:#111;
  }

  .service-hero .float-row img{
    will-change:left,transform,opacity;
    filter:drop-shadow(0 28px 38px rgba(12,80,130,.22));
    animation: service-card-orbit 20s linear infinite;
  }

  .service-hero .float-row img:nth-child(1){animation-delay:0s}
  .service-hero .float-row img:nth-child(2){animation-delay:-2.5s}
  .service-hero .float-row img:nth-child(3){animation-delay:-5s}
  .service-hero .float-row img:nth-child(4){animation-delay:-7.5s}
  .service-hero .float-row img:nth-child(5){animation-delay:-10s}
  .service-hero .float-row img:nth-child(6){animation-delay:-12.5s}
  .service-hero .float-row img:nth-child(7){animation-delay:-15s}
  .service-hero .float-row img:nth-child(8){animation-delay:-17.5s}

  @keyframes nav-drop{
    from{opacity:0;transform:translateY(-16px)}
    to{opacity:1;transform:none}
  }

  @keyframes badge-rise{
    from{opacity:0;transform:translateY(14px)}
    to{opacity:1;transform:none}
  }

  @keyframes logo-breathe{
    0%,100%{opacity:.48}
    50%{opacity:.92}
  }

  @keyframes float-left{
    0%,100%{transform:rotate(-7deg) translateY(0)}
    50%{transform:rotate(-4deg) translateY(-9px)}
  }

  @keyframes float-right{
    0%,100%{transform:rotate(7deg) translateY(0)}
    50%{transform:rotate(4deg) translateY(9px)}
  }

  @keyframes ring-drift{
    0%,100%{transform:translateX(-50%) rotate(0deg)}
    50%{transform:translateX(-50%) rotate(4deg)}
  }

  @keyframes chip-float{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-8px)}
  }

  @keyframes panel-sheen{
    0%,58%{transform:translateX(-120%)}
    76%,100%{transform:translateX(120%)}
  }

  @keyframes service-card-orbit{
    0%,100%{left:51px;top:10px;width:192px;height:192px;opacity:.82;z-index:1;transform:perspective(760px) rotateY(48deg) rotateZ(-7deg) scale(.96)}
    12.5%{left:261px;top:0;width:204px;height:204px;opacity:.95;z-index:2;transform:perspective(760px) rotateY(34deg) rotateZ(-5deg) scale(.98)}
    25%{left:471px;top:-10px;width:214px;height:214px;opacity:1;z-index:3;transform:perspective(760px) rotateY(18deg) rotateZ(-2deg) scale(1)}
    37.5%{left:681px;top:-18px;width:224px;height:224px;opacity:1;z-index:4;transform:perspective(760px) rotateY(6deg) rotateZ(0deg) scale(1.02)}
    50%{left:891px;top:-18px;width:224px;height:224px;opacity:1;z-index:4;transform:perspective(760px) rotateY(-6deg) rotateZ(0deg) scale(1.02)}
    62.5%{left:1101px;top:-10px;width:214px;height:214px;opacity:1;z-index:3;transform:perspective(760px) rotateY(-18deg) rotateZ(2deg) scale(1)}
    75%{left:1311px;top:0;width:204px;height:204px;opacity:.95;z-index:2;transform:perspective(760px) rotateY(-34deg) rotateZ(5deg) scale(.98)}
    87.5%{left:1521px;top:10px;width:192px;height:192px;opacity:.82;z-index:1;transform:perspective(760px) rotateY(-48deg) rotateZ(7deg) scale(.96)}
  }
}

@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}
