/* Hero section pour la page location */
@media (max-width: 700px) {
	.slide img { height: 140px; }
	.slider { min-height: 180px; }
}
.home-hero-media img {
	display: block;
	width: 100%;
	height: auto;
	border: none;
	box-shadow: none;
	background: none;
	padding: 0;
	margin: 0;
	border-radius: 0;
	opacity: 0;
	transform: translateY(32px) scale(1);
	animation: heroImgIn .9s cubic-bezier(.2,.9,.2,1) .2s forwards;
	transition: transform .35s cubic-bezier(.2,.9,.2,1), box-shadow .25s;
}
.home-hero-media img:hover {
	transform: translateY(0) scale(1.045);
	box-shadow: 0 8px 32px rgba(11,11,11,0.13);
	z-index: 2;
}
@keyframes heroImgIn {
	from { opacity: 0; transform: translateY(32px) scale(1.01); }
	to { opacity: 1; transform: none; }
}
.home-hero-media img {
	display: block;
	width: 100%;
	height: auto;
	border: none;
	box-shadow: none;
	background: none;
	padding: 0;
	margin: 0;
	border-radius: 0;
}
/* ---- Hero accueil large et immersif ---- */
.home-hero {
	background: linear-gradient(90deg, #181818 0%, #232323 55%, #f7ede4 100%);
	color: #fff;
	padding: 2.5rem 0 1.5rem 0;
	margin-bottom: 1.5rem;
	border-radius: 0 0 38px 38px;
	box-shadow: 0 8px 32px rgba(11,11,11,0.08);
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
}
.home-hero-grid {
	max-width: 98vw;
	width: 100%;
	display: grid;
	grid-template-columns: 1fr 420px;
	gap: 1.5rem;
	align-items: center;
	padding-left: 2.5rem;
	padding-right: 2.5rem;
}
@media (max-width: 1300px) {
	.home-hero {
		max-width: 99vw;
		border-radius: 0 0 24px 24px;
	}
	.home-hero-grid {
		padding-left: 1.2rem;
		padding-right: 1.2rem;
	}
}
/* Disposition compacte à deux colonnes pour les champs du formulaire */
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.1rem 2.2rem;
  width: 100%;
}
.form-group {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
}
.form-group[style*="grid-column: 1 / -1"] {
  grid-column: 1 / -1;
}

@media (max-width: 900px) {
  .form-row {
    grid-template-columns: 1fr;
    gap: 1rem 0;
  }
}
/* Styles pour la page de location */
body {
  background: linear-gradient(120deg, #f7f8fa 0%, #e0e7ff 100%);
  min-height: 100vh;
}
.location-form {
  max-width: 900px;
  margin: 2.5rem auto 1.5rem auto;
  background: rgba(255,255,255,0.75);
  border-radius: 28px;
  box-shadow: 0 16px 48px 0 rgba(11,11,11,0.18), 0 2px 12px rgba(255,106,0,0.10);
  padding: 2.8rem 2.5rem 2.2rem 2.5rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.7rem 2.7rem;
  position: relative;
  border: 2.5px solid #ffecd6;
  z-index: 1;
  align-items: start;
  backdrop-filter: blur(7px) saturate(1.2);
  animation: formFadeIn .9s cubic-bezier(.2,.9,.2,1);
  overflow: hidden;
}

@keyframes formFadeIn {
  from { opacity: 0; transform: translateY(32px) scale(1.01); }
  to { opacity: 1; transform: none; }
}
.location-form label {
  font-weight: 700;
  color: #ff6a00;
  margin-bottom: .18rem;
  letter-spacing: 0.01em;
  display: flex;
  align-items: center;
  gap: 0.4em;
  font-size: 1.13rem;
  grid-column: span 1;
  position: relative;
  transition: color .18s;
}
.location-form label:before {
  content: '';
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 0.4em;
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.7;
}
.location-form label[for="vehicule"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><path d="M3 13v-2l1-5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2l1 5v2M5 19a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm14 0a2 2 0 1 1 0-4 2 2 0 0 1 0 4z" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="duree"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="12" r="10" stroke="%23ff6a00" stroke-width="1.5" fill="none"/><path d="M12 6v6l4 2" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="dateDepart"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><rect x="3" y="4" width="18" height="18" rx="4" stroke="%23ff6a00" stroke-width="1.5" fill="none"/><path d="M16 2v4M8 2v4" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="heureDepart"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="12" r="10" stroke="%23ff6a00" stroke-width="1.5" fill="none"/><path d="M12 12l4 2" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="adresse"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="destination"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="nom"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="8" r="4" stroke="%23ff6a00" stroke-width="1.5" fill="none"/><path d="M4 20c0-4 8-4 8-4s8 0 8 4" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="email"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><rect x="2" y="6" width="20" height="12" rx="4" stroke="%23ff6a00" stroke-width="1.5" fill="none"/><path d="M2 6l10 7 10-7" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="contact"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><path d="M2 2h20v20H2z" fill="none"/><path d="M6 8h12M6 12h8" stroke="%23ff6a00" stroke-width="1.5"/></svg>'); }
.location-form label[for="chauffeur"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="8" r="4" stroke="%23ff6a00" stroke-width="1.5" fill="none"/><path d="M4 20c0-4 8-4 8-4s8 0 8 4" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form label[for="remarques"]:before { background-image: url('data:image/svg+xml;utf8,<svg fill="%23ff6a00" viewBox="0 0 24 24" width="18" height="18" xmlns="http://www.w3.org/2000/svg"><rect x="2" y="4" width="20" height="16" rx="4" stroke="%23ff6a00" stroke-width="1.5" fill="none"/><path d="M6 8h12M6 12h8" stroke="%23ff6a00" stroke-width="1.5" fill="none"/></svg>'); }
.location-form input,
.location-form select,
.location-form textarea {
  padding: .8rem 1.1rem;
  border-radius: 13px;
  border: 1.7px solid #e0e0e0;
  font-size: 1.13rem;
  background: rgba(246,248,250,0.92);
  margin-bottom: .18rem;
  transition: border 0.18s, box-shadow 0.18s, background .18s;
  width: 100%;
  box-sizing: border-box;
  grid-column: span 1;
  font-family: inherit;
  outline: none;
}
.location-form input:focus,
.location-form select:focus,
.location-form textarea:focus {
  border-color: #ff6a00;
  box-shadow: 0 0 0 3px #ffe3d1;
  background: #fffbe9;
}
.location-form input:disabled,
.location-form select:disabled,
.location-form textarea:disabled {
  background: #f3f3f3;
  color: #bbb;
}
.prix-vehicule {
  font-weight: 700;
  color: #fff;
  background: linear-gradient(90deg, #ff6a00 60%, #ffb86c 100%);
  margin-bottom: .5rem;
  font-size: 1.11rem;
  letter-spacing: 0.01em;
  grid-column: 1 / -1;
  border-radius: 8px;
  padding: .4em 1em;
  display: inline-block;
  box-shadow: 0 2px 8px rgba(255,106,0,0.08);
  margin-top: .2em;
  animation: badgeIn .7s cubic-bezier(.2,.9,.2,1);
}
@keyframes badgeIn {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: none; }
}
.location-form .btn {
  margin-top: 1.2rem;
  font-size: 1.18rem;
  padding: .9rem 1.5rem;
  border-radius: 13px;
  background: linear-gradient(90deg, #ff6a00 60%, #ffb86c 100%);
  color: #fff;
  border: none;
  cursor: pointer;
  font-weight: 800;
  transition: background .18s, box-shadow .18s, transform .13s;
  text-align: center;
  box-shadow: 0 2px 12px rgba(255,106,0,0.13);
  grid-column: 1 / -1;
  letter-spacing: 0.01em;
  outline: none;
}
.location-form .btn:hover, .location-form .btn:focus {
  background: linear-gradient(90deg, #181818 60%, #ff6a00 100%);
  box-shadow: 0 6px 24px rgba(255,106,0,0.18);
  transform: translateY(-2px) scale(1.03);
}
.confirmation-message {
  background: linear-gradient(90deg, #e6ffe6 60%, #e0e7ff 100%);
  color: #1a4d1a;
  border-radius: 12px;
  padding: 1.2rem 1.1rem;
  margin: 1.2rem auto 0 auto;
  max-width: 900px;
  text-align: center;
  font-size: 1.13rem;
  box-shadow: 0 2px 12px rgba(11,11,11,0.09);
}
@media (max-width: 900px) {
  .location-form {
    max-width: 99vw;
    grid-template-columns: 1fr;
    padding: 1.1rem .5rem 1rem .5rem;
    border-radius: 16px;
    box-shadow: 0 6px 18px rgba(11,11,11,0.13);
    gap: 1.1rem 0.7rem;
  }
  .confirmation-message {
    max-width: 99vw;
    padding: .7rem .3rem;
    border-radius: 8px;
  }
}

/* Animation d'entrée pour chaque .form-group */
.form-group {
  animation: groupFadeIn .7s cubic-bezier(.2,.9,.2,1);
  animation-delay: .12s;
  animation-fill-mode: both;
}
@keyframes groupFadeIn {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}

/* Ajout d'icônes pour les labels (optionnel, à compléter dans le HTML si souhaité) */
