/*
 * POC Native · Phase 14.6
 * Interaction layer inspired by the restrained motion language developed for
 * danielecolombo.it. Hover effects are limited to devices that actually
 * support hover; touch layouts keep the approved static presentation.
 */

/* --- Focus states: visible, coherent, accessible --- */
.poc-homepage a:focus-visible,
[class*="poc-proto--"] a:focus-visible,
[class*="poc-proto--"] summary:focus-visible{
  outline:2px solid rgba(181,109,85,.52);
  outline-offset:4px;
  border-radius:4px;
}

/* --- Homepage: richer section rhythm without changing layout --- */
.poc-audience-card,
.poc-principle,
.poc-area-card,
.poc-credential,
.poc-step,
.poc-faq-list .wp-block-details,
.poc-text-link a,
.poc-homepage .wp-block-button__link{
  transition:
    transform .24s ease,
    box-shadow .24s ease,
    border-color .24s ease,
    background-color .24s ease,
    color .24s ease,
    opacity .24s ease;
}

.poc-text-link a{
  position:relative;
  display:inline-block;
  text-decoration:none;
  text-underline-offset:.22em;
}
.poc-text-link a::before{
  content:"";
  position:absolute;
  left:0;
  bottom:-.13rem;
  width:calc(100% - 1.15rem);
  height:1px;
  background:currentColor;
  opacity:.42;
  transform:scaleX(.22);
  transform-origin:left center;
  transition:transform .24s ease,opacity .24s ease;
}
.poc-text-link a::after{
  display:inline-block;
  transition:transform .24s ease;
}

.poc-principle{
  position:relative;
  padding-left:.15rem;
}
.poc-principle::before{
  content:"";
  position:absolute;
  left:-.75rem;
  top:.55rem;
  bottom:.55rem;
  width:2px;
  border-radius:999px;
  background:var(--poc-clay);
  opacity:0;
  transform:scaleY(.35);
  transition:opacity .24s ease,transform .24s ease;
}

.poc-area-icon{
  transition:transform .24s ease,background-color .24s ease,color .24s ease;
}
.poc-area-card h3,
.poc-step h3,
.poc-faq-list summary,
.poc-credential{
  transition:color .24s ease,background-color .24s ease,border-color .24s ease,transform .24s ease;
}

.poc-step{
  position:relative;
}
.poc-step-number{
  transition:color .24s ease,transform .24s ease;
}

.poc-faq-list .wp-block-details{
  padding-left:.35rem;
  padding-right:.35rem;
  border-radius:10px;
}
.poc-faq-list summary::after{
  display:inline-block;
  transition:transform .24s ease,color .24s ease;
}

/* --- Internal pages: shared interaction language across different sections --- */
[class*="poc-proto--"] .button,
[class*="poc-proto--"] .card,
[class*="poc-proto--"] .statement-card,
[class*="poc-proto--"] .duality-card,
[class*="poc-proto--"] .principle-card,
[class*="poc-proto--"] .area-card,
[class*="poc-proto--"] .experience,
[class*="poc-proto--"] .limit-card,
[class*="poc-proto--"] .therapy-card,
[class*="poc-proto--"] .abstract-card,
[class*="poc-proto--"] .hero-card,
[class*="poc-proto--"] .art-card,
[class*="poc-proto--"] .setting-item,
[class*="poc-proto--"] .return-item,
[class*="poc-proto--"] .step,
[class*="poc-proto--"] details{
  transition:
    transform .24s ease,
    box-shadow .24s ease,
    border-color .24s ease,
    background-color .24s ease,
    color .24s ease;
}

[class*="poc-proto--"] p > a:not(.button),
[class*="poc-proto--"] li > a:not(.button){
  position:relative;
  text-decoration:none;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0 1px;
  background-position:0 100%;
  background-repeat:no-repeat;
  transition:color .22s ease,background-size .22s ease;
}

[class*="poc-proto--"] summary{
  transition:color .22s ease,background-color .22s ease;
}
[class*="poc-proto--"] summary::after{
  transition:transform .24s ease,color .24s ease;
}

@media (hover:hover) and (pointer:fine){
  /* Buttons: a small lift, not a 'web-app' animation. */
  .poc-homepage .wp-block-button__link:hover,
  [class*="poc-proto--"] .button:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 32px rgba(24,51,49,.14);
  }

  /* Homepage textual links. */
  .poc-text-link a:hover::before,
  .poc-text-link a:focus-visible::before{
    transform:scaleX(1);
    opacity:.8;
  }
  .poc-text-link a:hover::after,
  .poc-text-link a:focus-visible::after{
    transform:translateX(4px);
  }

  /* Two audience cards: subtle movement and stronger reading cue. */
  .poc-audience-card:hover{
    transform:translateY(-5px);
    box-shadow:0 20px 48px rgba(27,50,47,.10);
    border-color:rgba(181,109,85,.28);
  }
  .poc-audience-card-dark:hover{
    box-shadow:0 22px 52px rgba(24,51,49,.20);
    border-color:rgba(255,255,255,.20);
  }
  .poc-audience-card:hover .poc-card-number{
    color:rgba(181,109,85,.58);
  }
  .poc-audience-card-dark:hover .poc-card-number{
    color:rgba(255,255,255,.20);
  }

  /* Principles: the row becomes active without becoming a card. */
  .poc-principle:hover{
    transform:translateX(5px);
  }
  .poc-principle:hover::before{
    opacity:1;
    transform:scaleY(1);
  }

  /* Areas: keep the existing lift and add a visual response in icon/title. */
  .poc-area-card:hover{
    transform:translateY(-5px);
    box-shadow:0 18px 44px rgba(27,50,47,.09);
    border-color:rgba(181,109,85,.18);
  }
  .poc-area-card:hover .poc-area-icon{
    transform:translateY(-2px) scale(1.04);
    background:var(--poc-clay);
    color:#fff;
  }
  .poc-area-card:hover h3{
    color:var(--poc-clay);
  }

  /* Credentials: small tactile response inside the dark section. */
  .poc-credential:hover{
    transform:translateY(-2px);
    background:rgba(255,255,255,.08);
    border-color:rgba(255,255,255,.38);
    color:#fff!important;
  }

  /* 'Come iniziare': movement only in typography, keeping the editorial grid. */
  .poc-step:hover .poc-step-number{
    transform:translateX(3px);
    color:#92513e;
  }
  .poc-step:hover h3{
    color:var(--poc-clay);
  }

  /* FAQ: feedback on the row, not just on the + sign. */
  .poc-faq-list .wp-block-details:hover{
    background:rgba(247,243,235,.58);
  }
  .poc-faq-list summary:hover{
    color:var(--poc-clay);
  }
  .poc-faq-list summary:hover::after{
    transform:rotate(90deg);
  }
  .poc-faq-list details[open] summary:hover::after{
    transform:none;
  }

  /* Internal-page text links: same restrained underline language. */
  [class*="poc-proto--"] p > a:not(.button):hover,
  [class*="poc-proto--"] p > a:not(.button):focus-visible,
  [class*="poc-proto--"] li > a:not(.button):hover,
  [class*="poc-proto--"] li > a:not(.button):focus-visible{
    color:var(--clay,var(--poc-clay));
    background-size:100% 1px;
  }

  /* Cards used across the different editorial sections. */
  [class*="poc-proto--"] .card:hover,
  [class*="poc-proto--"] .statement-card:hover,
  [class*="poc-proto--"] .duality-card:hover,
  [class*="poc-proto--"] .principle-card:hover,
  [class*="poc-proto--"] .experience:hover,
  [class*="poc-proto--"] .limit-card:hover,
  [class*="poc-proto--"] .therapy-card:hover,
  [class*="poc-proto--"] .abstract-card:hover,
  [class*="poc-proto--"] .hero-card:hover,
  [class*="poc-proto--"] .art-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 44px rgba(27,50,47,.09);
  }

  [class*="poc-proto--"] .area-card:hover{
    transform:translateY(-5px);
  }

  [class*="poc-proto--"] .setting-item:hover,
  [class*="poc-proto--"] .return-item:hover{
    transform:translateX(4px);
  }

  [class*="poc-proto--"] .step:hover h3{
    color:var(--clay,var(--poc-clay));
  }

  [class*="poc-proto--"] details:hover{
    border-color:rgba(181,109,85,.28);
  }
  [class*="poc-proto--"] summary:hover{
    color:var(--clay,var(--poc-clay));
  }
  [class*="poc-proto--"] summary:hover::after{
    transform:rotate(90deg);
  }
  [class*="poc-proto--"] details[open] summary:hover::after{
    transform:none;
  }
}

@media (max-width:900px){
  /* Touch/tablet layouts remain stable: no translated rows or raised cards. */
  .poc-principle,
  .poc-faq-list .wp-block-details{
    transform:none!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .poc-homepage *,
  [class*="poc-proto--"] *{
    scroll-behavior:auto!important;
  }
  .poc-homepage a,
  .poc-homepage .wp-block-button__link,
  .poc-homepage .poc-audience-card,
  .poc-homepage .poc-principle,
  .poc-homepage .poc-area-card,
  .poc-homepage .poc-credential,
  .poc-homepage .poc-step,
  .poc-homepage .wp-block-details,
  [class*="poc-proto--"] .button,
  [class*="poc-proto--"] .card,
  [class*="poc-proto--"] .statement-card,
  [class*="poc-proto--"] .duality-card,
  [class*="poc-proto--"] .principle-card,
  [class*="poc-proto--"] .area-card,
  [class*="poc-proto--"] .experience,
  [class*="poc-proto--"] .limit-card,
  [class*="poc-proto--"] .therapy-card,
  [class*="poc-proto--"] .abstract-card,
  [class*="poc-proto--"] .hero-card,
  [class*="poc-proto--"] .art-card,
  [class*="poc-proto--"] .setting-item,
  [class*="poc-proto--"] .return-item,
  [class*="poc-proto--"] .step,
  [class*="poc-proto--"] details,
  [class*="poc-proto--"] summary,
  [class*="poc-proto--"] summary::after{
    transition:none!important;
  }
}