body {
  margin: 0;
  font-family: 'Montserrat', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background: linear-gradient(120deg, #141b26 70%, #0a2239 100%);
  color: #e8eaed;
  min-height: 100vh;
}

/* Loader premium */
#loader {
  position: fixed;
  z-index: 999999;
  top: 0; left: 0;
  width: 100vw; height: 100vh;
  background: linear-gradient(120deg, #141b26 75%, #0a2239 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.7s cubic-bezier(.75,0,.25,1), visibility 0.6s;
}
#loader.hide-loader {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.loader-logo {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  animation: loaderAppear 0.7s cubic-bezier(.19,1,.22,1);
}
@keyframes loaderAppear {
  0% { transform: scale(0.8) rotate(-9deg); opacity:0;}
  50% { transform: scale(1.13) rotate(8deg); opacity:0.7;}
  100% { transform: scale(1) rotate(0deg); opacity:1;}
}
.loader-logo img {
  width: 120px;
  height: 120px;
  border-radius: 32px;
  box-shadow: 0 0 64px #00f2ff77, 0 4px 18px #00f2ff22;
  z-index: 2;
  animation: logoPulse 1.6s infinite alternate;
}
@keyframes logoPulse {
  0% { box-shadow: 0 0 22px #00f2ff55, 0 4px 18px #00f2ff22; }
  100% { box-shadow: 0 0 44px #00f2ffcc, 0 4px 18px #00f2ff22; }
}
.loader-halo {
  position: absolute;
  top: 58%;
  left: 50%;
  width: 130px;
  height: 44px;
  border-radius: 50%;
  transform: translate(-50%, 0);
  background: radial-gradient(ellipse at center, #00eaff33 0%, #00f2ff00 100%);
  filter: blur(5px);
  opacity: 0.7;
  z-index: 1;
  animation: haloSpread 1.4s infinite alternate;
}
@keyframes haloSpread {
  0% { opacity: 0.6; transform: translate(-50%,0) scaleX(1);}
  100% { opacity: 0.92; transform: translate(-50%,0) scaleX(1.16);}
}

/* Effet logo footer */
.footer-logo.large {
  transition: filter 0.28s, transform 0.22s, box-shadow 0.23s;
  cursor: pointer;
}
.footer-logo.large:hover {
  filter: drop-shadow(0 0 32px #00f2ff) drop-shadow(0 0 14px #94dfff);
  transform: scale(1.10) rotate(-2deg);
  box-shadow: 0 0 36px #00f2ff88, 0 0 14px #fff9;
  z-index: 3;
}

/* Effet map survol */
.map-container {
  transition: box-shadow 0.24s, border-color 0.22s;
}
.map-container:hover {
  box-shadow: 0 0 48px 0 #00f2ffcc, 0 0 12px #fff9;
  border: 2px solid #00f2ff77;
  z-index: 3;
}

/* --- Reste du design premium : identique à avant --- */
header {
  position: relative;
  height: 70vh;
  min-height: 340px;
  max-height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #141b26;
}
.video-banner {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
#introVideo {
  object-fit: contain !important;
  width: 100%;
  height: 100%;
  max-width: 100vw;
  max-height: 100%;
  display: block;
  background: #141b26;
}
.overlay {
  background: none !important;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.55);
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 20px;
}
section {
  background: rgba(32, 33, 36, 0.82);
  backdrop-filter: blur(8px);
  border: 1.5px solid rgba(113, 201, 255, 0.18);
  border-radius: 18px;
  box-shadow: 0 0 25px rgba(113, 201, 255, 0.09);
  padding: 50px 24px;
  margin: 36px auto;
  max-width: 960px;
  transition: box-shadow 0.2s;
}
section:hover {
  box-shadow: 0 0 60px 0 #00f2ff22, 0 4px 50px 0 #005ea033;
}
.centered {
  text-align: center;
}
ul {
  list-style: none;
  padding-left: 0;
}
ul li {
  margin: 10px 0;
  font-weight: 500;
  font-size: 1.1em;
}
.gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
}
.gallery img {
  width: 45%;
  border-radius: 12px;
  box-shadow: 0 2px 16px #05294d22;
  transition: transform 0.25s cubic-bezier(.19,1,.22,1), box-shadow 0.25s;
  background: #0a2239;
}
.gallery img:hover {
  transform: scale(1.04) rotate(-1deg);
  box-shadow: 0 8px 32px #00f2ff99;
  border: 2px solid #00eaff33;
  z-index: 2;
}
.map-container {
  margin: 30px 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 0 24px #00f2ff14;
}
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 600px;
  margin: 0 auto;
  background: rgba(17, 25, 40, 0.56);
  backdrop-filter: blur(3px);
  border-radius: 12px;
  padding: 28px 20px;
  box-shadow: 0 0 8px #00eaff15;
}
.contact-form label {
  text-align: left;
  margin-left: 8px;
  margin-bottom: 2px;
  font-weight: 600;
  letter-spacing: .02em;
}
.contact-form input,
.contact-form textarea {
  padding: 12px;
  border: none;
  border-radius: 6px;
  font-size: 1rem;
  background: rgba(32, 33, 36, 0.98);
  color: #e8eaed;
  box-shadow: 0 1px 6px #00eaff11 inset;
  font-family: inherit;
  outline: none;
  transition: box-shadow 0.2s, border 0.2s;
}
.contact-form input:focus,
.contact-form textarea:focus {
  border: 1.5px solid #00eaffaa;
  box-shadow: 0 0 12px #00f2ff40;
}
.contact-form button {
  padding: 14px;
  background: linear-gradient(90deg, #1a73e8 0%, #00f2ff 100%);
  color: white;
  border: none;
  border-radius: 8px;
  font-weight: bold;
  font-size: 1.12em;
  cursor: pointer;
  box-shadow: 0 4px 18px rgba(0,242,255,0.12);
  transition: transform 0.15s, box-shadow 0.2s, filter 0.2s;
}
.contact-form button:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 28px #00f2ff99;
  filter: brightness(1.1);
}
.whatsapp-button {
  display: inline-block;
  margin-top: 22px;
  padding: 13px 26px;
  background: linear-gradient(90deg, #25D366 50%, #11b858 100%);
  color: white;
  text-decoration: none;
  border-radius: 30px;
  font-weight: bold;
  font-size: 1.1em;
  box-shadow: 0 2px 16px #25D36644;
  transition: transform 0.18s, box-shadow 0.2s, background 0.18s;
}
.whatsapp-button:hover {
  transform: scale(1.08);
  background: linear-gradient(90deg, #11b858 0%, #25D366 100%);
  box-shadow: 0 8px 22px #25D36688;
}
.no-link {
  color: #e8eaed;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.15s;
}
.no-link:hover {
  color: #00f2ff;
  text-shadow: 0 0 4px #00f2ff80;
}
footer {
  background-color: #121212ee;
  text-align: center;
  padding: 24px;
  color: #aaa;
  margin-top: 60px;
  border-top: 1px solid #282b3a55;
  box-shadow: 0 -2px 22px #00f2ff11;
}
.footer-logo {
  width: 90px;
  margin-bottom: 18px;
  border-radius: 20px;
  filter: drop-shadow(0 0 10px #00f2ff55);
}
.bright-title {
  color: #f4fbff;
  text-shadow: 0 0 4px #71c9ff, 0 0 12px #52aaff77;
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.06em;
  margin-bottom: 18px;
  font-size: 2.2em;
  transition: letter-spacing 0.22s, color 0.4s;
}
.bright-title:hover {
  letter-spacing: 3px;
  color: #00f2ff;
}
h1, h2 {
  font-family: 'Montserrat', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
/* Responsive mobile */
@media (max-width: 768px) {
  .gallery img {
    width: 100%;
  }
  .contact-form {
    width: 100%;
    padding: 0 10px;
  }
  h1 {
    font-size: 1.8rem;
  }
  h2 {
    font-size: 1.4rem;
  }
  section {
    padding: 20px 6px;
  }
}
.page-title {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  padding: 20px 20px 0px;
}
.footer-logo.large {
  width: 160px;
  animation: realistic-cyclic-flicker 4s infinite;
  filter: drop-shadow(0 0 14px #00f2ffbb);
}
.language-switch {
  text-align: center;
  margin: 14px 0 0 0;
}
.lang-button {
  background-color: #282c34;
  color: #fff;
  padding: 7px 14px;
  margin: 0 5px;
  border-radius: 5px;
  text-decoration: none;
  font-weight: 700;
  font-size: 1.03em;
  transition: background 0.18s, color 0.18s;
  letter-spacing: 0.04em;
  border: none;
}
.lang-button:hover {
  background-color: #00f2ff;
  color: #111;
}
.lang-note {
  margin-top: 12px;
  font-size: 1rem;
  color: #00ffcc;
  text-align: center;
  font-weight: bold;
  animation: blink-glow 1.8s infinite;
}
@keyframes blink-glow {
  0%, 100% { opacity: 1; text-shadow: 0 0 6px #00ffcc, 0 0 12px #00ffcc; }
  50% { opacity: 0.4; text-shadow: none; }
}
.section-header {
  color: #e0f7ff;
  text-shadow: 0 0 2px #e0f7ff, 0 0 6px #94dfff, 0 0 12px #6bcfff;
  text-align: center;
  margin-top: 40px;
}
.emergency-fixed {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
}
.emergency-button {
  background: linear-gradient(90deg, #ff2c2c 40%, #ff8888 100%);
  color: white;
  padding: 14px 25px;
  font-size: 1.16em;
  font-weight: bold;
  text-decoration: none;
  border-radius: 13px;
  box-shadow: 0 0 20px #ff2c2cbb, 0 0 6px #fff3;
  border: none;
  animation: pulse 1.6s infinite;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: background 0.2s, transform 0.16s, box-shadow 0.19s;
}
.emergency-button:hover {
  background: linear-gradient(90deg, #ff8888 0%, #ff2c2c 100%);
  transform: scale(1.07);
  box-shadow: 0 0 40px #ff2c2c, 0 0 8px #fff9;
}
.phone-icon svg {
  display: inline-block;
  vertical-align: middle;
  filter: drop-shadow(0 0 7px #00f2ffbb);
}
@keyframes pulse {
  0% { box-shadow: 0 0 8px #ff2c2c; }
  50% { box-shadow: 0 0 32px #ff2c2c; }
  100% { box-shadow: 0 0 8px #ff2c2c; }
}
@keyframes realistic-cyclic-flicker {
  0%   { opacity: 1; filter: drop-shadow(0 0 14px #00f2ff); }
  2%   { opacity: 0; filter: none; }
  4%   { opacity: 1; filter: drop-shadow(0 0 18px #00eaff); }
  6%   { opacity: 0.2; filter: none; }
  8%   { opacity: 1; filter: drop-shadow(0 0 22px #00ccff); }
  10%  { opacity: 0; filter: none; }
  12%  { opacity: 1; filter: drop-shadow(0 0 20px #00f2ff); }
  15%  { opacity: 1; filter: drop-shadow(0 0 20px #00f2ff); }
  30%  { opacity: 1; filter: drop-shadow(0 0 22px #00f2ff); }
  35%  { opacity: 0.1; filter: none; }
  37%  { opacity: 1; filter: drop-shadow(0 0 18px #00eaff); }
  40%  { opacity: 1; filter: drop-shadow(0 0 18px #00f2ff); }
  50%  { opacity: 0; filter: none; }
  52%  { opacity: 1; filter: drop-shadow(0 0 24px #00ccff); }
  55%  { opacity: 0.4; filter: none; }
  57%  { opacity: 1; filter: drop-shadow(0 0 20px #00f2ff); }
  60%  { opacity: 1; filter: drop-shadow(0 0 22px #00f2ff); }
  70%  { opacity: 1; filter: drop-shadow(0 0 22px #00f2ff); }
  80%  { opacity: 0.2; filter: none; }
  82%  { opacity: 1; filter: drop-shadow(0 0 26px #00eaff); }
  85%  { opacity: 0.5; filter: none; }
  87%  { opacity: 1; filter: drop-shadow(0 0 24px #00ccff); }
  90%  { opacity: 0.1; filter: none; }
  92%  { opacity: 1; filter: drop-shadow(0 0 26px #00f2ff); }
  100% { opacity: 1; filter: drop-shadow(0 0 30px #00f2ff); }
}
.policy-link {
  color: #00ffcc;
  font-size: 1rem;
  margin-top: 24px;
  display: block;
  text-align: center;
}
a:focus, button:focus, input:focus, textarea:focus {
  outline: 2px solid #71c9ff;
  outline-offset: 2px;
}
.gyro-police {
  display: inline-block;
  vertical-align: middle;
  width: 34px;
  height: 22px;
  margin-right: 7px;
  position: relative;
}
.gyro-police .gyro-base {
  position: absolute;
  bottom: 0;
  left: 5px;
  width: 24px;
  height: 8px;
  background: #333d4d;
  border-radius: 7px 7px 12px 12px;
  z-index: 1;
  box-shadow: 0 2px 8px #0006;
}
.gyro-police .gyro-light {
  position: absolute;
  bottom: 7px;
  left: 10px;
  width: 6px;
  height: 10px;
  background: #298cfa;
  border-radius: 3px 3px 7px 7px;
  z-index: 2;
  animation: gyro-blue 0.95s infinite alternate;
  box-shadow: 0 0 15px 3px #3ab7ff77, 0 0 4px 2px #4fdcff77;
}
.gyro-police .gyro-light.r {
  left: 18px;
  background: #ff4040;
  animation: gyro-red 0.95s infinite alternate;
  box-shadow: 0 0 15px 3px #ff7070cc, 0 0 4px 2px #ffbabacc;
}
.gyro-police .gyro-flash {
  position: absolute;
  top: -7px;
  left: 4px;
  width: 26px;
  height: 12px;
  background: linear-gradient(90deg,#21a3fe66 0%,#fff5 50%,#ff6e7e66 100%);
  border-radius: 60% 60% 20% 20%;
  z-index: 0;
  opacity: 0.46;
  filter: blur(2.2px);
  animation: gyro-flash 0.95s infinite alternate;
  pointer-events: none;
}
@keyframes gyro-blue {
  0%   { background: #298cfa; box-shadow: 0 0 7px 2px #3ab7ff77; }
  38%  { background: #21a3fe; box-shadow: 0 0 22px 7px #3ab7ffbb; }
  60%  { background: #cce7ff; box-shadow: 0 0 34px 10px #3ab7ffcc; }
  100% { background: #298cfa; box-shadow: 0 0 7px 2px #3ab7ff77; }
}
@keyframes gyro-red {
  0%   { background: #ff4040; box-shadow: 0 0 7px 2px #ff7070cc; }
  50%  { background: #ffbabacc; box-shadow: 0 0 32px 12px #ffbabacc; }
  80%  { background: #ffeaea; box-shadow: 0 0 23px 7px #ffbabacc; }
  100% { background: #ff4040; box-shadow: 0 0 7px 2px #ff7070cc; }
}
@keyframes gyro-flash {
  0%   { opacity: 0.21;}
  35%  { opacity: 0.72;}
  100% { opacity: 0.41;}
}
.faq-urgence {
  color: #ff5276 !important;
  font-size: 1.26em;
  text-shadow: 0 0 10px #fff4, 0 0 4px #ee233166;
  letter-spacing: 0.02em;
  display: flex;
  align-items: center;
  gap: 7px;
}
@media (max-width: 600px) {
  .emergency-fixed {
    right: 10px;
    width: auto;
    max-width: 95vw;
    z-index: 11;
  }
  footer {
    z-index: 20;
    position: relative;
  }
}
@keyframes vibrate-phone {
  0% { transform: rotate(-8deg) scale(1.05);}
  10% { transform: rotate(6deg) scale(1.04);}
  20% { transform: rotate(-6deg) scale(1.03);}
  30% { transform: rotate(6deg) scale(1.02);}
  40% { transform: rotate(-4deg) scale(1.01);}
  50% { transform: rotate(4deg) scale(1.03);}
  60% { transform: rotate(-2deg) scale(1.02);}
  70% { transform: rotate(2deg) scale(1.01);}
  80% { transform: rotate(-1deg) scale(1);}
  90% { transform: rotate(1deg) scale(1.02);}
  100% { transform: rotate(0deg) scale(1);}
}

.emergency-button .phone-icon {
  display: inline-block;
  vertical-align: middle;
  animation: vibrate-phone 0.7s infinite linear;
  /* Tu peux ajuster la durée et la répétition si tu veux */
}