/* ===========================================================
   CosCor — Motion condiviso (reveal, hover card, tab)
   Caricato in <head> DOPO lo <style> di pagina perché vinca
   sulle regole esistenti a parità di specificità.
   Tutto entro prefers-reduced-motion: no-preference.
   =========================================================== */

@media (prefers-reduced-motion: no-preference) {

  /* ---- 1. SCROLL REVEAL ---- */
  html.cc-anim [data-reveal] {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity .7s cubic-bezier(.16,.8,.3,1),
                transform .7s cubic-bezier(.16,.8,.3,1);
    will-change: opacity, transform;
  }
  html.cc-anim [data-reveal].cc-in {
    opacity: 1;
    transform: none;
  }

  /* ---- 4. HOVER CARD MACCHINA ---- */
  .mach-img-wrap img {
    transition: transform .55s cubic-bezier(.2,.7,.3,1);
  }
  .mach-big:hover .mach-img-wrap img {
    transform: scale(1.07) translateY(-3px);
  }
  /* linea blu superiore: resta sempre, all'hover si ispessisce e schiarisce */
  .mach-img-wrap::after {
    transition: height .45s cubic-bezier(.16,.8,.3,1),
                background .45s ease, box-shadow .45s ease;
  }
  .mach-big:hover .mach-img-wrap::after {
    height: 5px;
    background: var(--blue2, #7ab8e4);
    box-shadow: 0 0 18px rgba(122,184,228,.7);
  }

  /* ---- 6. TRANSIZIONE TAB ---- */
  .tab-content.active {
    animation: ccTabIn .5s cubic-bezier(.16,.8,.3,1) both;
  }
  @keyframes ccTabIn {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: none; }
  }
}

/* ===========================================================
   Badge certificazioni nel footer (accanto al logo)
   =========================================================== */
.f-certs{display:inline-flex;flex-direction:column;gap:.6rem;margin-top:1.2rem;text-decoration:none;
  padding:.85rem .95rem;border:1px solid rgba(122,184,228,.22);border-radius:12px;
  background:rgba(122,184,228,.05);max-width:240px;transition:border-color .18s,background .18s}
.f-certs:hover{border-color:rgba(122,184,228,.5);background:rgba(122,184,228,.09)}
.f-certs-label{font-family:var(--fd,'Outfit',sans-serif);font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.45);line-height:1.5}
.f-certs-label strong{display:block;color:#fff;font-weight:700;font-size:.78rem;letter-spacing:.05em;margin-top:.15rem}
.f-certs-pills{display:flex;flex-wrap:wrap;gap:.35rem}
.f-certs-pills span{font-family:var(--fd,'Outfit',sans-serif);font-size:.6rem;font-weight:700;letter-spacing:.04em;
  color:var(--blue2,#7ab8e4);background:rgba(122,184,228,.12);border:1px solid rgba(122,184,228,.28);
  padding:.24rem .55rem;border-radius:100px}
