/*
 * Linea T Moda — micro-interazioni editoriali
 * Modulo indipendente: impostare data-atelier-interactions="off" su <html>
 * oppure rimuovere questo stylesheet per tornare agli hover originali.
 */

@media (hover: hover) and (pointer: fine) {
  [data-atelier-interactions="on"] .wordmark {
    transition: letter-spacing 420ms cubic-bezier(.2,.75,.25,1), color 250ms ease;
  }

  [data-atelier-interactions="on"] .wordmark:hover {
    letter-spacing: .045em;
  }

  [data-atelier-interactions="on"] .wordmark .italic {
    display: inline-block;
    transition: transform 420ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .wordmark:hover .italic {
    transform: translateX(3.45px) skewX(-3deg);
  }

  [data-atelier-interactions="on"] .nav a:not(.nav-cta)::before {
    content: "";
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: -2px;
    height: 1px;
    background: var(--ink);
    transition: left 300ms cubic-bezier(.2,.75,.25,1), right 300ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .nav a:not(.nav-cta):hover::before {
    left: 0;
    right: 0;
  }

  [data-atelier-interactions="on"] .btn,
  [data-atelier-interactions="on"] .nav a.nav-cta {
    position: relative;
    overflow: hidden;
    transform: translateY(0);
    transition:
      transform 320ms cubic-bezier(.2,.75,.25,1),
      background-color 280ms ease,
      color 280ms ease,
      border-color 280ms ease,
      letter-spacing 320ms ease;
  }

  [data-atelier-interactions="on"] .btn::before,
  [data-atelier-interactions="on"] .nav a.nav-cta::before {
    content: "";
    position: absolute;
    inset: 4px;
    border: 1px dashed currentColor;
    border-radius: inherit;
    opacity: 0;
    transform: scale(.94);
    transition: opacity 240ms ease, transform 360ms cubic-bezier(.2,.75,.25,1);
    pointer-events: none;
  }

  [data-atelier-interactions="on"] .btn:hover,
  [data-atelier-interactions="on"] .nav a.nav-cta:hover {
    transform: translateY(-2.3px);
    letter-spacing: .045em;
  }

  [data-atelier-interactions="on"] .btn:hover::before,
  [data-atelier-interactions="on"] .nav a.nav-cta:hover::before {
    opacity: .403;
    transform: scale(1);
  }

  [data-atelier-interactions="on"] .btn:active,
  [data-atelier-interactions="on"] .nav a.nav-cta:active {
    transform: translateY(0);
  }

  [data-atelier-interactions="on"] .section--dark .btn:hover {
    background: transparent !important;
    border-color: var(--bg-ink) !important;
    color: var(--bg-ink) !important;
  }

  [data-atelier-interactions="on"] .link-inline {
    border-bottom-color: transparent;
    background-image: linear-gradient(90deg, var(--ink) 0 45%, transparent 45% 55%, var(--ink) 55% 100%);
    background-repeat: no-repeat;
    background-position: 100% 100%;
    background-size: 0 1px;
    transition: color 250ms ease, background-size 420ms cubic-bezier(.2,.75,.25,1), background-position 0s 420ms;
  }

  [data-atelier-interactions="on"] .link-inline:hover {
    border-bottom-color: transparent;
    background-position: 0 100%;
    background-size: 100% 1px;
  }

  [data-atelier-interactions="on"] .service-card,
  [data-atelier-interactions="on"] main article.reveal {
    position: relative;
    isolation: isolate;
    transition: background-color 420ms ease, transform 420ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .service-card::before,
  [data-atelier-interactions="on"] main article.reveal::before {
    content: "";
    position: absolute;
    inset: 13px;
    z-index: 1;
    opacity: 0;
    pointer-events: none;
    background:
      linear-gradient(var(--sand-deep), var(--sand-deep)) left top / 18px 1px no-repeat,
      linear-gradient(var(--sand-deep), var(--sand-deep)) left top / 1px 18px no-repeat,
      linear-gradient(var(--sand-deep), var(--sand-deep)) right bottom / 18px 1px no-repeat,
      linear-gradient(var(--sand-deep), var(--sand-deep)) right bottom / 1px 18px no-repeat;
    transform: scale(.97);
    transition: opacity 320ms ease, transform 460ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .service-card:hover,
  [data-atelier-interactions="on"] main article.reveal:hover {
    background-color: rgba(246, 241, 231, .78) !important;
    transform: translateY(-4.6px);
  }

  [data-atelier-interactions="on"] .service-card:hover::before,
  [data-atelier-interactions="on"] main article.reveal:hover::before {
    opacity: .805;
    transform: scale(1);
  }

  [data-atelier-interactions="on"] .service-card h3,
  [data-atelier-interactions="on"] main article.reveal h2,
  [data-atelier-interactions="on"] main article.reveal h3 {
    transition: color 300ms ease, transform 420ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .service-card:hover h3,
  [data-atelier-interactions="on"] main article.reveal:hover h2,
  [data-atelier-interactions="on"] main article.reveal:hover h3 {
    color: var(--sand-text);
    transform: translateX(4.6px);
  }

  [data-atelier-interactions="on"] .spec-row {
    position: relative;
    transition: padding-left 360ms cubic-bezier(.2,.75,.25,1), color 260ms ease, background-color 260ms ease;
  }

  [data-atelier-interactions="on"] .spec-row::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 0;
    height: 1px;
    background: var(--sand-deep);
    transition: width 360ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .spec-row:hover {
    padding-left: 30px;
    background: rgba(246, 241, 231, .6);
  }

  [data-atelier-interactions="on"] .spec-row:hover::before { width: 18.4px; }
  [data-atelier-interactions="on"] .spec-row:hover .title { color: var(--sand-text); }

  [data-atelier-interactions="on"] .faq__item {
    position: relative;
  }

  [data-atelier-interactions="on"] .faq__item::before {
    content: "";
    position: absolute;
    inset: 0 -18px;
    z-index: -1;
    background: var(--paper);
    opacity: 0;
    transform: scaleX(.985);
    transition: opacity 280ms ease, transform 380ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .faq__item:hover::before {
    opacity: .828;
    transform: scaleX(1);
  }

  [data-atelier-interactions="on"] .faq__item summary::after {
    transition: transform 360ms cubic-bezier(.2,.75,.25,1), color 260ms ease;
  }

  [data-atelier-interactions="on"] .faq__item:not([open]):hover summary::after {
    transform: rotate(90deg);
    color: var(--ink);
  }

  [data-atelier-interactions="on"] .image-interactive,
  [data-atelier-interactions="on"] .hero-visual,
  [data-atelier-interactions="on"] .service-row > :first-child,
  [data-atelier-interactions="on"] .phase > :last-child {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  [data-atelier-interactions="on"] .image-interactive::after,
  [data-atelier-interactions="on"] .hero-visual::after,
  [data-atelier-interactions="on"] .service-row > :first-child::after,
  [data-atelier-interactions="on"] .phase > :last-child::after {
    content: "";
    position: absolute;
    inset: 14px;
    z-index: 2;
    pointer-events: none;
    opacity: 0;
    background:
      linear-gradient(var(--bg-ink), var(--bg-ink)) left top / 24px 1px no-repeat,
      linear-gradient(var(--bg-ink), var(--bg-ink)) left top / 1px 24px no-repeat,
      linear-gradient(var(--bg-ink), var(--bg-ink)) right bottom / 24px 1px no-repeat,
      linear-gradient(var(--bg-ink), var(--bg-ink)) right bottom / 1px 24px no-repeat;
    transition: opacity 350ms ease;
  }

  [data-atelier-interactions="on"] .image-interactive img,
  [data-atelier-interactions="on"] .hero-visual img,
  [data-atelier-interactions="on"] .service-row > :first-child img,
  [data-atelier-interactions="on"] .phase > :last-child img {
    transition: transform 900ms cubic-bezier(.2,.75,.25,1), filter 650ms ease;
    will-change: transform;
  }

  [data-atelier-interactions="on"] .image-interactive:hover img,
  [data-atelier-interactions="on"] .hero-visual:hover img,
  [data-atelier-interactions="on"] .service-row:hover > :first-child img,
  [data-atelier-interactions="on"] .phase:hover > :last-child img {
    transform: scale(1.035);
    filter: contrast(1.025) saturate(1.04);
  }

  [data-atelier-interactions="on"] .image-interactive:hover::after,
  [data-atelier-interactions="on"] .hero-visual:hover::after,
  [data-atelier-interactions="on"] .service-row:hover > :first-child::after,
  [data-atelier-interactions="on"] .phase:hover > :last-child::after {
    opacity: 1;
  }

  [data-atelier-interactions="on"] .service-row .service-title,
  [data-atelier-interactions="on"] .phase .phase-title {
    transition: color 320ms ease, transform 460ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .service-row:hover .service-title,
  [data-atelier-interactions="on"] .phase:hover .phase-title {
    color: var(--sand-text);
    transform: translateX(5.75px);
  }

  [data-atelier-interactions="on"] .service-deliverables span {
    transition: border-color 260ms ease, color 260ms ease, transform 300ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .service-deliverables span:hover {
    border-color: var(--sand-deep);
    color: var(--sand-text);
    transform: translateY(-2.3px);
  }

  [data-atelier-interactions="on"] .site-footer a {
    position: relative;
    transition: color 250ms ease, padding-left 300ms cubic-bezier(.2,.75,.25,1);
  }

  [data-atelier-interactions="on"] .site-footer li a:hover {
    padding-left: 8px;
  }
}

[data-atelier-interactions="on"] .field input:focus,
[data-atelier-interactions="on"] .field select:focus,
[data-atelier-interactions="on"] .field textarea:focus {
  border-bottom-width: 2px;
}

@media (prefers-reduced-motion: reduce) {
  [data-atelier-interactions="on"] .btn,
  [data-atelier-interactions="on"] .nav a,
  [data-atelier-interactions="on"] .link-inline,
  [data-atelier-interactions="on"] .spec-row,
  [data-atelier-interactions="on"] main img,
  [data-atelier-interactions="on"] main article {
    transform: none !important;
  }
}

@media print {
  [data-atelier-interactions="on"] .service-card::before,
  [data-atelier-interactions="on"] main article.reveal::before,
  [data-atelier-interactions="on"] .image-interactive::after,
  [data-atelier-interactions="on"] .hero-visual::after {
    display: none !important;
  }
}