/* Scenari Perfetti — Motion system v9.9.0
   Animazioni leggere, progressive enhancement e rispetto prefers-reduced-motion. */

:root{
  --sp-motion-duration:.85s;
  --sp-motion-stagger:70ms;
  --sp-motion-distance:42px;
  --sp-motion-parallax:8;
  --sp-motion-hover:6;
  --sp-motion-ease:cubic-bezier(.22,1,.36,1);
}

/* Loader cinematico */
.sp-page-loader{
  position:fixed;inset:0;z-index:99999;background:#050505;color:#fff;
  display:grid;align-items:end;padding:clamp(24px,5vw,72px);
  pointer-events:none;opacity:1;visibility:visible;
  transition:opacity .65s var(--sp-motion-ease),visibility .65s step-end;
  animation:sp-loader-failsafe .01s linear 5s forwards;
}
.sp-page-loader.is-leaving{opacity:0;visibility:hidden}
.sp-page-loader.is-skipped{display:none!important}
.sp-page-loader__inner{width:min(100%,680px);margin-left:auto}
.sp-page-loader__label{display:block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:20px;opacity:.65}
.sp-page-loader__progress{display:flex;align-items:flex-start;justify-content:flex-end;font-family:var(--sp-display-font,inherit);font-size:clamp(72px,12vw,170px);line-height:.8;letter-spacing:-.07em;font-weight:600}
.sp-page-loader__progress small{font-size:.18em;line-height:1;margin:.12em 0 0 .15em;letter-spacing:0}
.sp-page-loader__line{height:1px;background:rgba(255,255,255,.18);margin-top:30px;overflow:hidden}
.sp-page-loader__line span{display:block;width:100%;height:100%;background:#fff;transform:scaleX(0);transform-origin:left center}
@keyframes sp-loader-failsafe{to{opacity:0;visibility:hidden}}

/* Elementi reveal: la classe viene applicata solo dopo inizializzazione JS. */
.sp-motion-item{
  opacity:0;
  transform:translate3d(0,var(--sp-motion-distance),0);
  transition:opacity var(--sp-motion-duration) var(--sp-motion-ease),transform var(--sp-motion-duration) var(--sp-motion-ease);
  transition-delay:var(--sp-motion-delay,0ms);
  will-change:transform,opacity;
}
.sp-motion-item.sp-motion-from-left{transform:translate3d(calc(var(--sp-motion-distance) * -1),0,0)}
.sp-motion-item.sp-motion-from-right{transform:translate3d(var(--sp-motion-distance),0,0)}
.sp-motion-item.is-visible{opacity:1;transform:translate3d(0,0,0);will-change:auto}

/* Reveal tipografico per parole. */
.sp-motion-split{overflow:visible}
.sp-motion-word-wrap{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.22em .14em .24em;margin:-.22em -.14em -.24em}
.sp-motion-word{
  display:inline-block;transform:translate3d(0,112%,0) rotate(.001deg);
  transition:transform calc(var(--sp-motion-duration) * 1.05) var(--sp-motion-ease);
  transition-delay:var(--sp-word-delay,0ms);will-change:transform;
}
.sp-motion-split.is-visible .sp-motion-word{transform:translate3d(0,0,0);will-change:auto}

/* Hero: ingresso coordinato, senza alterare layout. */
.sp-motion-enabled.home .sp-home-hero .hero-swiper{transform:scale(1.035);transition:transform 2.2s cubic-bezier(.22,1,.36,1)}
.sp-motion-enabled.home.sp-motion-started .sp-home-hero .hero-swiper{transform:scale(1)}
.sp-motion-enabled.home .sp-home-hero .sp-hero-logo,
.sp-motion-enabled.home .sp-home-hero .sp-eyebrow,
.sp-motion-enabled.home .sp-home-hero .sp-hero-subtitle,
.sp-motion-enabled.home .sp-home-hero .sp-hero-actions,
.sp-motion-enabled.home .sp-home-hero .sp-scroll-cue{
  opacity:0;transform:translate3d(0,24px,0);
  transition:opacity .8s var(--sp-motion-ease),transform .8s var(--sp-motion-ease);
}
.sp-motion-enabled.home.sp-motion-started .sp-home-hero .sp-hero-logo{opacity:1;transform:none;transition-delay:.02s}
.sp-motion-enabled.home.sp-motion-started .sp-home-hero .sp-eyebrow{opacity:1;transform:none;transition-delay:.12s}
.sp-motion-enabled.home.sp-motion-started .sp-home-hero .sp-hero-subtitle{opacity:1;transform:none;transition-delay:.34s}
.sp-motion-enabled.home.sp-motion-started .sp-home-hero .sp-hero-actions{opacity:1;transform:none;transition-delay:.46s}
.sp-motion-enabled.home.sp-motion-started .sp-home-hero .sp-scroll-cue{opacity:1;transform:none;transition-delay:.62s}

/* Navbar entra dall'alto all'avvio pagina. */
.sp-motion-enabled .navbar{transition:background-color .35s ease,transform .85s var(--sp-motion-ease),opacity .7s ease}
.sp-motion-enabled:not(.sp-motion-started) .navbar{transform:translate3d(0,-110%,0);opacity:0}
.sp-motion-enabled.sp-motion-started .navbar{transform:translate3d(0,0,0);opacity:1}

/* Card e righe: microinterazioni premium, non "effetti giocattolo". */
@media (hover:hover) and (pointer:fine){
  .sp-motion-enabled .sp-capability-card,
  .sp-motion-enabled .sp-process-step,
  .sp-motion-enabled .sp-role-row,
  .sp-motion-enabled .sp-about-stat{
    transition:transform .5s var(--sp-motion-ease),border-color .35s ease,background-color .35s ease;
  }
  .sp-motion-enabled .sp-capability-card:hover,
  .sp-motion-enabled .sp-process-step:hover,
  .sp-motion-enabled .sp-about-stat:hover{transform:translate3d(0,-6px,0)}
  .sp-motion-enabled .sp-card-arrow{transition:transform .45s var(--sp-motion-ease)}
  .sp-motion-enabled .sp-capability-card:hover .sp-card-arrow{transform:translate3d(5px,-5px,0)}
  .sp-motion-enabled .sp-work-card{overflow:hidden}
  .sp-motion-enabled .sp-work-card img{transition:transform 1.1s var(--sp-motion-ease),filter .7s ease;transform:scale(1.025)}
  .sp-motion-enabled .sp-work-card:hover img{transform:scale(1.075)}
  .sp-motion-enabled .sp-work-card .sp-work-copy{transition:transform .65s var(--sp-motion-ease)}
  .sp-motion-enabled .sp-work-card:hover .sp-work-copy{transform:translate3d(0,-8px,0)}
  .sp-motion-magnetic{transition:transform .35s var(--sp-motion-ease)}
}

/* Immagini con parallax: il valore viene scritto dal JS in --sp-parallax-y. */
.sp-motion-parallax{transform:translate3d(0,var(--sp-parallax-y,0px),0) scale(1.06);will-change:transform}

/* Linee che "si disegnano" entrando in viewport. */
.sp-motion-enabled .sp-role-row,
.sp-motion-enabled .sp-process-step,
.sp-motion-enabled .sp-capability-card{position:relative}
.sp-motion-enabled .sp-role-row::after,
.sp-motion-enabled .sp-process-step::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;opacity:.22;
  transform:scaleX(0);transform-origin:left center;transition:transform 1s var(--sp-motion-ease) var(--sp-motion-delay,0ms);
}
.sp-motion-enabled .sp-role-row.is-visible::after,
.sp-motion-enabled .sp-process-step.is-visible::after{transform:scaleX(1)}

/* Cursore visivo sui link testuali: underline animato. */
.sp-motion-enabled .sp-text-link{background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:left 100%;transition:background-size .45s var(--sp-motion-ease)}
.sp-motion-enabled .sp-text-link:hover{background-size:100% 1px}

/* Animazioni anche per pagine interne/catalogo: reveal generico applicato dal JS. */
.sp-motion-enabled:not(.home) main > *:first-child{transition:opacity .7s var(--sp-motion-ease),transform .7s var(--sp-motion-ease)}

@media (max-width:767px){
  body.sp-motion-desktop-only .sp-motion-item,
  body.sp-motion-desktop-only .sp-motion-word,
  body.sp-motion-desktop-only .sp-home-hero .sp-hero-logo,
  body.sp-motion-desktop-only .sp-home-hero .sp-eyebrow,
  body.sp-motion-desktop-only .sp-home-hero .sp-hero-subtitle,
  body.sp-motion-desktop-only .sp-home-hero .sp-hero-actions,
  body.sp-motion-desktop-only .sp-home-hero .sp-scroll-cue,
  body.sp-motion-desktop-only .navbar{opacity:1!important;transform:none!important;transition:none!important}
  body.sp-motion-desktop-only .sp-page-loader{display:none!important}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  .sp-page-loader{display:none!important}
  .sp-motion-item,.sp-motion-word,.sp-motion-enabled .navbar,
  .sp-motion-enabled.home .sp-home-hero .hero-swiper,
  .sp-motion-enabled.home .sp-home-hero .sp-hero-logo,
  .sp-motion-enabled.home .sp-home-hero .sp-eyebrow,
  .sp-motion-enabled.home .sp-home-hero .sp-hero-subtitle,
  .sp-motion-enabled.home .sp-home-hero .sp-hero-actions,
  .sp-motion-enabled.home .sp-home-hero .sp-scroll-cue,
  .sp-motion-parallax{opacity:1!important;transform:none!important;transition:none!important;animation:none!important}
}

/* v9.10.0 — bleed tipografico e compatibilità Selected Work slideshow */
.sp-motion-split{padding:.06em .04em;margin:-.06em -.04em}
.sp-work-swiper .swiper-slide{will-change:opacity}
.sp-work-swiper .sp-work-nav,.sp-work-swiper .sp-work-pagination{transform:none}
