/* Lagon Blanc — styles complémentaires (Tailwind via CDN gère l'essentiel) */

:root {
  --mana-blue: #0C8AA6;   /* lagon — turquoise profond (couleur primaire) */
  --deep-ocean: #063B4A;  /* récif — teal nuit */
  --mint: #34D6C3;        /* écume — aqua clair */
  --mint-wash: #E1FAF6;
  --sky-wash: #E8F6F8;
  --slate: #324750;
  --soft-grey: #8FA4AC;
  --coral: #FF6F61;
  --sunlight: #FFD27E;    /* sable / soleil */
  --lagoon-50: #F2FBFC;
  --lagoon-100: #DDF3F6;
}

html { scroll-behavior: smooth; }

body {
  font-feature-settings: "kern", "liga";
  -webkit-font-smoothing: antialiased;
}

/* Focus visible accessible et homogène */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--mint);
  outline-offset: 2px;
  border-radius: 6px;
}

/* Filet décoratif menthe */
.mint-rule {
  width: 56px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--mana-blue), var(--mint));
}

/* Cartes reveal (état initial avant GSAP) */
.reveal {
  opacity: 0;
  transform: translateY(24px);
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* Si GSAP absent ou reduced-motion : tout est visible */
.no-anim .reveal,
.reveal.gsap-shown {
  opacity: 1 !important;
  transform: none !important;
}

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

/* Halo doux derrière le hero */
.soft-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(72px);
  opacity: 0.42;
  pointer-events: none;
}

/* ----------------------------------------------------------------------------
 * Lagon Blanc — finitions visuelles (identité lagon)
 * -------------------------------------------------------------------------- */

/* Dégradé maillé "lagon" (fond hero / sections claires) */
.lagoon-mesh {
  background-color: var(--lagoon-50);
  background-image:
    radial-gradient(40rem 32rem at 8% -8%, rgba(52, 214, 195, .26), transparent 60%),
    radial-gradient(46rem 36rem at 108% 6%, rgba(12, 138, 166, .22), transparent 58%),
    radial-gradient(34rem 30rem at 50% 118%, rgba(255, 210, 126, .14), transparent 60%);
}

/* Voile dégradé sur images (hero, bandeaux) */
.img-veil::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(6, 59, 74, 0) 38%, rgba(6, 59, 74, .55) 100%);
  pointer-events: none;
}

/* Grain subtil (overlay) */
.grain {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .5;
  mix-blend-mode: soft-light;
  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='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
}

/* Texte dégradé lagon */
.text-lagoon {
  background: linear-gradient(110deg, var(--mana-blue) 8%, var(--mint) 92%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Bouton primaire : léger éclat au survol */
.btn-shine { position: relative; overflow: hidden; }
.btn-shine::before {
  content: "";
  position: absolute;
  top: 0; left: -120%;
  width: 60%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.35), transparent);
  transition: left .6s ease;
}
.btn-shine:hover::before { left: 130%; }

/* Carte : élévation douce au survol (cohérent partout) */
.card-lift { transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, border-color .35s ease; }
.card-lift:hover { transform: translateY(-4px); }

/* Anneau d'icône type "écume" */
.ring-foam { box-shadow: 0 0 0 6px rgba(52,214,195,.14); }

/* Séparateur vague (haut de section) */
.wave-top { display:block; width:100%; height:48px; }

@media (prefers-reduced-motion: reduce) {
  .btn-shine::before { transition: none; }
  .card-lift { transition: none; }
}

/* Carrousel avis : masque scrollbar */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Leaflet : coins arrondis */
.leaflet-container { border-radius: 16px; font-family: inherit; }

/* Coche de succès animée (confirmation RDV) */
.check-circle { stroke-dasharray: 166; stroke-dashoffset: 166; }
.check-path { stroke-dasharray: 48; stroke-dashoffset: 48; }

/* Étapes tunnel : transition douce */
[x-cloak] { display: none !important; }

/* Pilule de créneau */
.slot-pill { transition: transform .12s ease, background-color .12s ease, border-color .12s ease; }
.slot-pill:not(:disabled):hover { transform: translateY(-1px); }

/* Print espace patient / devis */
@media print {
  header, footer, .no-print { display: none !important; }
}