/* Nautea Piscine - Custom styles */
:root {
  --nautea-white: #FFFFFF;
  --nautea-teal: #0399A6;
  --nautea-lagoon: #0A7F8C;
  --nautea-cyan: #4FD1DB;
  --nautea-deep: #03354A;
  --nautea-aqua: #D4EDED;
}

html { scroll-behavior: smooth; }

body { font-family: 'DM Sans', system-ui, sans-serif; }

/* Fond turquoise façon "eau de piscine" (accueil) */
.bg-water {
  background:
    radial-gradient(ellipse 80% 60% at 15% 0%, rgba(255, 255, 255, 0.22), transparent 60%),
    radial-gradient(ellipse 70% 60% at 100% 100%, rgba(3, 53, 74, 0.45), transparent 70%),
    linear-gradient(160deg, #13B5C1 0%, #0399A6 45%, #0A7486 100%);
}

/* Lisibilité du texte blanc posé sur photo */
.text-shadow-hero { text-shadow: 0 2px 14px rgba(3, 53, 74, 0.55); }

/* Modal backdrop */
.modal-backdrop { backdrop-filter: blur(4px); }

@keyframes modalIn {
  from { opacity: 0; transform: translateY(12px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0)    scale(1); }
}
@keyframes backdropIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.modal-card-enter    { animation: modalIn     0.25s ease-out; }
.modal-backdrop-enter { animation: backdropIn  0.25s ease-out; }

@keyframes modalOut {
  from { opacity: 1; transform: translateY(0)    scale(1); }
  to   { opacity: 0; transform: translateY(12px) scale(0.97); }
}
@keyframes backdropOut {
  from { opacity: 1; }
  to   { opacity: 0; }
}
.modal-card-leave    { animation: modalOut    0.2s ease-in forwards; }
.modal-backdrop-leave { animation: backdropOut 0.2s ease-in forwards; }