/* Selected composition, 12 October 2026.
   Hero 01; video/features 02; reviews/FAQ 03; shared offer/closing.
   Copy, source markup, images and original variants remain unchanged. */
html[data-variant="finale"] [data-mf="hero-panel"] {
  background:linear-gradient(155deg,#432048 0%,#321239 100%);
  border-color:rgba(255,246,229,.38);
  box-shadow:0 12px 28px #24092a24;
  backdrop-filter:none;
}
html[data-variant="finale"] [data-mf="hero-panel"] h1 + p {
  font-size:16px; line-height:1.4; color:#fff6e5;
}
html[data-variant="finale"] [data-mf="hero-price"] {
  background:rgba(255,246,229,.06); border-color:rgba(255,246,229,.28);
}
html[data-variant="finale"] [data-mf="hero-price"] .text-xs { font-size:13px; line-height:1.3; }
html[data-variant="finale"] [data-mf="hero-panel"] > div:last-child { margin-top:4px; }
html[data-variant="finale"] [data-mf="hero-panel"] [data-mf="cta"] {
  min-height:64px; font-size:22px; border:2px solid #fff6e5;
  box-shadow:0 4px 0 #ffc12e;
}
html[data-variant="finale"] [data-mf="hero-panel"] [data-mf="reassurance"] {
  margin-top:4px; font-size:14px; line-height:1.35;
}
html[data-variant="finale"] [data-mf="hero-panel"] :focus-visible { outline-color:#ffc12e; }

/* White video and feature sections; quiet sage reviews from option 03. */
html[data-variant="finale"] [data-section="come-funziona"],
html[data-variant="finale"] [data-section="domande"] { background:#fff; }
html[data-variant="finale"] [data-section="recensioni"] { background:#e6edd8; }
html[data-variant="finale"] [data-mf="review-card"] { border-color:#bac6a5; box-shadow:none; }
html[data-variant="finale"] details[open] { background:#ffe7a3; }
html[data-variant="finale"] details[open] > p { border-color:#bfa869; }
html[data-variant="finale"] summary { -webkit-tap-highlight-color:transparent; }
html[data-variant="finale"] summary:active { background:#ffe7a3; border-radius:18px; }

/* A larger hit area keeps the original pagination marks and the 16px slide gap. */
html[data-variant="finale"] [data-section="cosa-ottieni"] button[aria-label^="Vai alla scheda"],
html[data-variant="finale"] [data-section="recensioni"] button[aria-label^="Vai alla scheda"] {
  width:44px; min-width:44px; height:44px; border-radius:999px;
}
html[data-variant="finale"] button[aria-label^="Vai alla scheda"][aria-current="false"] > i {
  background:#907591;
}
@media (hover:hover) {
  html[data-variant="finale"] [data-mf="hero-panel"] [data-mf="cta"]:hover {
    background:#df4534; box-shadow:0 6px 0 #ffc12e; transform:translateY(-2px);
  }
  html[data-variant="finale"] [data-section="offerta"] [data-mf="cta"]:hover,
  html[data-variant="finale"] [data-section="prova"] [data-mf="cta"]:hover { box-shadow:2px 5px 0 #ffc12e; }
  html[data-variant="finale"] details:not([open]) summary:hover { background:#fff6e5; border-radius:18px; }
}
html[data-variant="finale"] [data-mf="hero-panel"] [data-mf="cta"]:active {
  transform:translateY(2px); box-shadow:0 2px 0 #ffc12e;
}

/* One gentle attention cue. Tailwind's original rotate:-4deg is preserved. */
html[data-variant="finale"] [data-mf="video-phone"][data-attention="playing"] {
  animation:mf-phone-attention 720ms ease-in-out 1;
  transform-origin:50% 72%;
}
@keyframes mf-phone-attention {
  0%,100% { transform:translateX(0) rotate(0); }
  15% { transform:translateX(-2px) rotate(-1.2deg); }
  32% { transform:translateX(2px) rotate(1.2deg); }
  49% { transform:translateX(-1.5px) rotate(-.8deg); }
  66% { transform:translateX(1px) rotate(.6deg); }
  83% { transform:translateX(-.5px) rotate(-.3deg); }
}
@media (prefers-reduced-motion:reduce) {
  html[data-variant="finale"] [data-mf="video-phone"] { animation:none; }
}
