/* ==========================================================================
   BILLETVOYAGE.FR — Module 11 : icônes cohérentes par rubrique + micro-animations
   Identité visuelle homogène — légère, moderne, mobile-first.
   Aucune dépendance externe (CSS pur) — pas d'impact sur performance.
   ========================================================================== */

/* ---- Icônes rubriques : SVG inline via classes (système d'icônes homogène) ---- */
.ic { display: inline-block; width: 1.35em; height: 1.35em; vertical-align: -0.32em; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ic--avion::before { content: "✈"; font-family: inherit; font-style: normal; }
.ic--maritime::before { content: "⚓"; font-style: normal; }
.ic--croisiere::before { content: "🛳"; font-style: normal; }
.ic--train::before { content: "🚆"; font-style: normal; }
.ic--bus::before { content: "🚌"; font-style: normal; }
.ic--hotel::before { content: "🏨"; font-style: normal; }
.ic--sejour::before { content: "🌍"; font-style: normal; }
.ic--activite::before { content: "🎯"; font-style: normal; }
.ic--destination::before { content: "📍"; font-style: normal; }
.ic--promo::before { content: "🏷"; font-style: normal; }
.ic--alerte::before { content: "🔔"; font-style: normal; }
.ic--client::before { content: "👤"; font-style: normal; }
.ic--service::before { content: "⚙"; font-style: normal; }

/* ---- Micro-animations légères (transform GPU, sous 0.3s) ---- */
@keyframes bv-fade-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes bv-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(0,168,204,.35); } 50% { box-shadow: 0 0 0 10px rgba(0,168,204,0); } }
@keyframes bv-slide-in { from { transform: translateX(-14px); opacity: 0; } to { transform: none; opacity: 1; } }

/* Entrée douce des cartes/sections (visibles au scroll) */
.carte-dossier, .fiche-ligne, .offre-band { animation: bv-fade-in .35s ease-out both; }

/* Bouton principal : pulse doux pour attirer l'œil (dynamisme commercial) */
.btn--principal:not(.btn-header) { transition: transform .18s ease, box-shadow .18s ease; }
.btn--principal:hover { transform: translateY(-2px); }
.whatsapp-float { animation: bv-pulse 2.4s infinite; }

/* Hover cartes : lift subtil (commercial, élégant) */
.carte-dossier:hover { transform: translateY(-3px); transition: transform .2s ease, box-shadow .2s ease; }

/* Accessibilité : réduire les animations si préféré */
@media (prefers-reduced-motion: reduce) {
  .carte-dossier, .btn--principal, .whatsapp-float { animation: none !important; }
  * { animation-duration: .01ms !important; transition-duration: .01s !important; }
}

/* ---- Hover images : zoom léger (cohérent partout) ---- */
.hero-photo { transition: transform .5s ease; }
.hero:hover .hero-photo { transform: scale(1.03); }

/* ---- Espace vide : cartes mieux équilibrées ---- */
.carte-dossier { min-height: auto; }
.carte-dossier small { line-height: 1.55; }

/* ---- Compteurs alertes / badges visibles ---- */
.badge { transition: background .15s ease; }