/**
 * NetShow Shell Polish — S24 (2026-06-14)
 *
 * Additive, load-LAST premium micro-interactions for the first-impression
 * shells (homepage 3-door, auth login/register). Uses the nsf-* motion
 * vocabulary from ns-motion.css.
 *
 * IMPORTANT: entrance animations use `backwards` fill (NOT forwards/both) so
 * they hold the hidden start-state only DURING the stagger delay and then
 * revert to the element's base transform — this is what lets the cards keep
 * their existing :hover lift (a forwards/both fill would pin the transform and
 * kill hover). End keyframes equal the base state, so there is no end-jump.
 *
 * Honors prefers-reduced-motion. Fully reversible: remove the <link>.
 */

/* ============================================================
 * HOMEPAGE — three-door hero (homepage-3door.blade.php)
 * Staggered entrance; the cards' own :hover translateY is preserved.
 * ============================================================ */
.td__eyebrow,
.td__title,
.td__subtitle {
  animation: nsf-fade-in 540ms var(--ns-ease-out, ease) backwards;
}
.td__title    { animation-delay: 40ms; }
.td__subtitle { animation-delay: 90ms; }

.td__grid > .td__card {
  animation: nsf-slide-up 480ms var(--ns-ease-out, ease) backwards;
}
.td__grid > .td__card:nth-child(1) { animation-delay: 130ms; }
.td__grid > .td__card:nth-child(2) { animation-delay: 200ms; }
.td__grid > .td__card:nth-child(3) { animation-delay: 270ms; }

/* ============================================================
 * AUTH — login / register card (auth-*-v2.css)
 * Gentle entrance + keyboard focus safety on the primary CTAs.
 * ============================================================ */
.auth-card {
  animation: nsf-slide-up 440ms var(--ns-ease-out, ease) backwards;
}

/* Social buttons read flat on hover today — add a subtle lift (no layout shift) */
.auth-social-btn,
.auth-social-btn-full {
  transition: transform var(--ns-transition-fast, 150ms ease),
              border-color var(--ns-transition-fast, 150ms ease),
              background var(--ns-transition-fast, 150ms ease);
}
.auth-social-btn:hover,
.auth-social-btn-full:hover {
  transform: translateY(-1px);
}
.auth-social-btn:active,
.auth-social-btn-full:active {
  transform: translateY(0);
}

/* Gold keyboard-focus ring on the shell CTAs (accessibility + brand) */
.landing-btn-primary:focus-visible,
.auth-submit:focus-visible,
.register-submit-btn:focus-visible {
  outline: 2px solid var(--ns-accent, #f59e0b);
  outline-offset: 2px;
}

/* ============================================================
 * REDUCED MOTION
 * ============================================================ */
@media (prefers-reduced-motion: reduce) {
  .td__eyebrow,
  .td__title,
  .td__subtitle,
  .td__grid > .td__card,
  .auth-card {
    animation: none;
  }
  .auth-social-btn,
  .auth-social-btn-full {
    transition: none;
  }
}