/* Tere Nui — styles complémentaires (Tailwind via CDN gère le reste) */

:root {
  --ocean: #0E8FB8;
  --deep: #062A42;
  --lagoon: #3FD0DB;
  --sun: #F6B61C;
  --sand: #FCD667;
  --mist: #F1F6F8;
  --foam: #E4F4F7;
  --slate: #33424B;
  --reef: #1FBE8E;
  --coral: #E2553B;
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

.tnum { font-variant-numeric: tabular-nums; }

/* Titres : équilibre + léger resserrement */
.font-display { letter-spacing: -0.015em; text-wrap: balance; }

/* Reveal initial state — masqué seulement si GSAP est prêt */
.gsap-ready .reveal { opacity: 0; transform: translateY(40px); }

/* Petit trait décoratif */
.rule {
  width: 56px; height: 4px; border-radius: 9999px;
  background: linear-gradient(90deg, var(--sun), var(--sand));
}

/* Halo de section décoratif (blobs lumineux) */
.blob { position: absolute; border-radius: 9999px; filter: blur(64px); pointer-events: none; opacity: .5; }

/* Grain subtil pour les visuels héros */
.grain::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  opacity: .07; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Puce verre dépoli (badges hero) */
.chip-glass { background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.20); backdrop-filter: blur(8px); }

/* Étoile filante au survol des CTA sombres */
.sheen { position: relative; overflow: hidden; }
.sheen::before {
  content: ""; position: absolute; top: 0; left: -75%; width: 50%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.20), transparent);
  transform: skewX(-18deg); transition: left .7s ease;
}
.sheen:hover::before { left: 130%; }

/* Wave divider */
.wave-bottom { display: block; line-height: 0; }

/* Leaflet dans nos cartes arrondies */
.leaflet-container { border-radius: 1rem; font-family: 'Inter', sans-serif; z-index: 0; }

/* Focus visible accessible */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--lagoon);
  outline-offset: 2px;
}

/* Stepper inputs : retire les flèches natives */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }

/* Itinéraire pointillé animé (SVG) */
.route-dash { stroke-dasharray: 6 8; }
.gsap-ready .route-dash { stroke-dashoffset: 200; }

/* Carte cliquable hover */
.lift { transition: transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease; }
.lift:hover { transform: translateY(-6px); box-shadow: 0 28px 56px -22px rgba(6,42,66,.45); }

/* Soulignement animé des liens de nav */
.navline { position: relative; }
.navline::after {
  content: ""; position: absolute; left: 12px; right: 12px; bottom: 4px; height: 2px;
  border-radius: 9999px; background: var(--sun); transform: scaleX(0); transform-origin: left;
  transition: transform .3s ease;
}
.navline:hover::after { transform: scaleX(1); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .gsap-ready .reveal { opacity: 1 !important; transform: none !important; }
}

/* Scrollbar discrète pour les listes admin */
.thin-scroll::-webkit-scrollbar { height: 8px; width: 8px; }
.thin-scroll::-webkit-scrollbar-thumb { background: #cfd9df; border-radius: 9999px; }