/* Motoclub de Saint-Mihiel — styles complémentaires Tailwind */

:root {
  --moto-ink: #1f2937;
  --moto-forest: #2f7a4a;
  --moto-accent: #e8924a;
  --moto-cream: #f5f1e8;
}

/* Polices locales (fonts via Google Fonts dans le head) */
.font-display {
  font-family: "Barlow Condensed", system-ui, sans-serif;
}

/* Lien de navigation */
.nav-link {
  @apply relative rounded-md px-3 py-2 text-sm font-medium text-zinc-300 transition hover:text-amber-300;
}
.nav-link[aria-current="page"] {
  @apply text-amber-300;
}
.nav-link[aria-current="page"]::after {
  content: "";
  @apply absolute inset-x-3 -bottom-0.5 h-0.5 rounded-full bg-amber-400;
}
.mobile-link {
  @apply block rounded-lg px-3 py-2.5 text-base font-medium text-zinc-300 transition hover:bg-zinc-800 hover:text-amber-300;
}
.mobile-link[aria-current="page"] {
  @apply bg-zinc-800 text-amber-300;
}
.footer-link {
  @apply text-zinc-400 transition hover:text-amber-300;
}

/* Boutons */
.btn-cta {
  @apply inline-flex items-center justify-center rounded-full bg-amber-400 px-6 py-3 font-semibold text-zinc-900 shadow-md transition hover:brightness-110 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-amber-300;
}
.btn-ghost {
  @apply inline-flex items-center justify-center rounded-full border border-zinc-300 bg-transparent px-6 py-3 font-semibold text-zinc-100 transition hover:border-amber-400 hover:text-amber-300;
}

/* Utilitaires */
.prose-moto {
  @apply text-zinc-300 leading-relaxed;
}
.prose-moto a {
  @apply font-medium text-amber-300 underline decoration-amber-300/40 underline-offset-2 transition hover:text-amber-200;
}
.eyebrow {
  @apply font-display text-sm font-semibold uppercase tracking-[0.25em] text-amber-400;
}

/* Révélation au scroll */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Entrée hero séquencée */
.anim-in {
  opacity: 0;
  transform: translateY(16px);
  animation: fadeUp 0.8s ease forwards;
}
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: none;
  }
}

/* Chemin de balade (petite carte de style) */
.road-line {
  stroke-dasharray: 6 6;
  stroke: #e8924a;
  stroke-width: 2;
}