/* PINAPP — MICROANIMATIONS AWARDS-LEVEL V7
   Subtil mais perceptible. Pas de reveal au scroll (charte zéro-scroll).
   Aucune animation intrusive si prefers-reduced-motion.
*/
@import url("./tokens-legacy.css");

/* === FOCUS VISIBLE === */
*:focus-visible {
  outline: 2px solid var(--pp-cyan, #00e5b0);
  outline-offset: 4px;
  border-radius: 4px;
  transition: outline-offset 150ms cubic-bezier(0.16, 1, 0.3, 1);
}
button:focus-visible,
a:focus-visible {
  outline-offset: 6px;
}

/* === SKIP LINK === */
.skip-link {
  position: absolute;
  top: -40px;
  left: 16px;
  background: var(--pp-cyan, #00e5b0);
  color: #08090e;
  padding: 8px 16px;
  border-radius: 6px;
  font-weight: 500;
  font-size: 14px;
  text-decoration: none;
  z-index: 9999;
  transition: top 200ms cubic-bezier(0.16, 1, 0.3, 1);
}
.skip-link:focus,
.skip-link:focus-visible {
  top: 16px;
}

/* === SÉLECTION === */
::selection {
  background: var(--pp-cyan, #00e5b0);
  color: #08090e;
}
::-moz-selection {
  background: var(--pp-cyan, #00e5b0);
  color: #08090e;
}

/* === SCROLLBAR (webkit) === */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: rgba(8, 9, 14, 0.6);
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(0, 229, 176, 0.4), rgba(155, 109, 255, 0.4));
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(0, 229, 176, 0.7), rgba(155, 109, 255, 0.7));
}

/* === LIENS NUS (corps de texte) === */
a:not([class]):not(.skip-link),
.legal-main a {
  position: relative;
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0% 1px;
  background-position: 0% 100%;
  background-repeat: no-repeat;
  transition: background-size 250ms cubic-bezier(0.16, 1, 0.3, 1);
}
a:not([class]):not(.skip-link):hover,
.legal-main a:hover {
  background-size: 100% 1px;
}

/* === HALO AU SURVOL (CTA / submit) — pointer fine uniquement === */
@media (hover: hover) and (pointer: fine) {
  .cta-magnetic,
  .hero-v6__cta-primary,
  .diag-v6__submit {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }
  .cta-magnetic::before,
  .hero-v6__cta-primary::before,
  .diag-v6__submit::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
      circle at var(--mx, 50%) var(--my, 50%),
      rgba(255, 255, 255, 0.1) 0%,
      transparent 55%
    );
    opacity: 0;
    transition: opacity 200ms ease-out;
    pointer-events: none;
    z-index: -1;
  }
  .cta-magnetic:hover::before,
  .hero-v6__cta-primary:hover::before,
  .diag-v6__submit:hover::before {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}