/* ==========================================================================
   Styles communs — L'Hovercraft
   Reprend le bloc <style> inline des maquettes, factorisé en un seul fichier.
   Le système de couleurs/typo est défini côté Tailwind (assets/js/tailwind-config.js).
   ========================================================================== */

html { scroll-behavior: smooth; }
body { font-family: 'Nunito Sans', sans-serif; }
h1, h2, h3, .font-display { font-family: 'Poppins', sans-serif; }

/* Animation d'apparition au défilement */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* Sélecteur de langue (flèche personnalisée) */
.lang-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23A9DCE8' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .5rem center;
  -webkit-appearance: none;
  appearance: none;
}

/* Champs de formulaire (page Contact) */
.fld {
  width: 100%;
  border: 1px solid rgba(11, 60, 93, .18);
  border-radius: 1rem;
  padding: .75rem 1rem;
  background: #fff;
  font-size: .95rem;
  transition: border-color .2s, box-shadow .2s;
}
.fld:focus {
  outline: none;
  border-color: #1B98B5;
  box-shadow: 0 0 0 3px rgba(27, 152, 181, .18);
}

.hublot {
  border-radius: 9999px;
  box-shadow:
          0 0 0 6px #FAF7F0,
          0 0 0 12px rgba(212,162,76,.45),
          0 18px 40px -12px rgba(11,60,93,.45);
  overflow: hidden;
}
.hublot img { width: 100%; height: 100%; object-fit: cover; }