/* ==================== VARIABLES ==================== */
:root{
  --black: #0c0c0e;
  --black-soft: #141416;
  --charcoal: #1c1c1f;
  --gold: #cf9f52;
  --gold-light: #e3bd7a;
  --white: #f6f5f2;
  --grey: #9a9a9e;
  --off-white: #f7f6f3;
  --font: 'Poppins', sans-serif;
  --header-h: 88px; /* fallback; recalculated in JS to match the real header height */
}

*{ margin:0; padding:0; box-sizing:border-box; }

html{
  scroll-behavior:smooth;
  scroll-padding-top: var(--header-h); /* keeps anchored sections from hiding under the sticky header */
}

/* Every anchor target gets the same offset as a second safety net (older Safari, JS scrollIntoView, etc.) */
section[id], div#recherche{
  scroll-margin-top: var(--header-h);
}

body{
  font-family: var(--font);
  background: var(--black);
  color: var(--white);
  line-height:1.5;
  overflow-x:hidden;
}

a{ text-decoration:none; color:inherit; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
select{ font-family:inherit; }

.eyebrow{
  color: var(--gold);
  letter-spacing: 3px;
  font-size: 0.75rem;
  font-weight:600;
  margin-bottom: 14px;
}
.eyebrow.center{ text-align:center; }

/* ==================== BUTTONS ==================== */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 14px 26px;
  font-size: 0.78rem;
  font-weight:600;
  letter-spacing: 1.5px;
  border-radius: 4px;
  transition: all .25s ease;
  white-space:nowrap;
}
.btn span{ transition: transform .25s ease; }
.btn:hover span{ transform: translateX(4px); }

.btn-primary{
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  color: #1a1408;
}
.btn-primary:hover{ filter:brightness(1.08); }

.btn-outline{
  border: 1px solid var(--gold);
  color: var(--gold);
  background: transparent;
}
.btn-outline:hover{ background: var(--gold); color:#1a1408; }

.btn-ghost{
  border: 1px solid rgba(255,255,255,0.35);
  color: var(--white);
  background: transparent;
}
.btn-ghost:hover{ border-color: var(--gold); color: var(--gold); }

/* ==================== HEADER ==================== */
.site-header{
  position: sticky;
  top:0;
  z-index: 100;
  background: rgba(10,10,11,0.85);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.header-inner{
  width: 100%;
  padding: 8px 40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 20px;
}
.logo{
  display:flex;
  align-items:center;
  gap:12px;
  flex-shrink:0;
}
.logo img{
  height: 80px;
  width: auto;
  display:block;
}
.logo-mark{
  width:44px; height:44px;
  border:1px solid var(--gold);
  border-radius:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--gold);
  font-weight:700;
  font-size:1rem;
}
.logo-text{
  display:flex;
  flex-direction:column;
  font-weight:700;
  letter-spacing:1px;
  font-size:1.05rem;
  line-height:1.2;
}
.logo-text small{
  font-weight:400;
  font-size:0.6rem;
  letter-spacing:2px;
  color: var(--grey);
}

.main-nav{
  display:flex;
  gap: 28px;
  font-size: 0.78rem;
  font-weight:500;
  letter-spacing: 1px;
}
.main-nav a{
  color: rgba(255,255,255,0.85);
  position:relative;
  padding: 6px 0;
}
.main-nav a:hover{ color: var(--gold); }
.main-nav a.active{ color: var(--gold); }

/* ==================== SOCIAL LINKS ==================== */
.social-links{
  display:flex;
  align-items:center;
  gap: 16px;
  flex-shrink:0;
}
.social-links a{
  color: rgba(255,255,255,0.75);
  display:flex;
  transition: color .2s ease, transform .2s ease;
}
.social-links a:hover{
  color: var(--gold);
  transform: translateY(-2px);
}
.social-links svg{
  width: 19px;
  height: 19px;
}

.burger{
  display:none;
  flex-direction:column;
  gap:5px;
  width: 26px;
}
.burger span{
  height:2px;
  width:100%;
  background: var(--white);
  border-radius:2px;
}

/* ==================== HERO ==================== */
.hero{
  position:relative;
  padding: 60px 40px 70px;
  min-height: 68vh;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.hero-bg{
  position:absolute;
  inset:0;
  overflow:hidden;
  background-image:
    radial-gradient(circle at 78% 45%, rgba(207,159,82,0.10), transparent 45%),
    linear-gradient(120deg, #0a0a0b 0%, #141416 40%, #1d1c1a 65%, #0a0a0b 100%);
  z-index:0;
}
.hero-bg img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center;
  z-index:0;
}
.hero-bg::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(120deg, rgba(10,10,11,0.75) 0%, rgba(10,10,11,0.4) 40%, rgba(10,10,11,0.2) 65%, rgba(10,10,11,0.8) 100%);
  z-index:1;
}
.hero-bg::after{
  content:"";
  position:absolute;
  right: 4%;
  top: 8%;
  width: 55%;
  height: 85%;
  background:
    radial-gradient(ellipse at 50% 30%, rgba(207,159,82,0.18), transparent 60%),
    repeating-linear-gradient(100deg, rgba(255,255,255,0.02) 0px, rgba(255,255,255,0.02) 2px, transparent 2px, transparent 60px);
  border-radius: 40%;
  filter: blur(2px);
  opacity:0.9;
  z-index:2;
}

.scroll-tab{
  position:absolute;
  left:0;
  top: 42%;
  writing-mode: vertical-rl;
  font-size: 0.65rem;
  letter-spacing: 3px;
  color: var(--grey);
  border: 1px solid rgba(255,255,255,0.15);
  padding: 10px 6px;
  border-left:none;
}

.hero-content{
  max-width: 640px;
  padding-top: 40px;
  z-index:2;
}
.hero-content h1{
  font-size: clamp(2.2rem, 4.2vw, 3.4rem);
  font-weight:700;
  line-height:1.15;
  margin-bottom: 22px;
}
.hero-content .accent{ color: var(--gold); font-weight:400; }
.hero-sub{
  color: rgba(255,255,255,0.75);
  font-size: 1rem;
  max-width: 480px;
  margin-bottom: 30px;
}
.hero-actions{
  display:flex;
  gap: 24px;
  flex-wrap:wrap;
}
.hero-action{
  display:flex;
  flex-direction:column;
  gap: 8px;
}
.hero-action-note{
  font-size: 0.75rem;
  color: rgba(255,255,255,0.6);
  padding-left: 2px;
}

/* ==================== SEARCH PANEL (below hero image) ==================== */
.search-panel{
  padding: 0 40px 60px;
}

/* ==================== QUICK SEARCH ==================== */
.quick-search{
  position:relative;
  z-index:3;
  background: rgba(20,20,22,0.9);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 26px 32px;
  display:flex;
  align-items:center;
  gap: 30px;
  flex-wrap:wrap;
  margin-bottom: -1px;
}
.quick-search-label{
  color: var(--white);
  font-size: 1.3rem;
  line-height: 1.25;
  font-weight:700;
  letter-spacing: 0.5px;
  flex-shrink:0;
  max-width: 200px;
}
.quick-search-label .qs-accent{
  display:block;
  color: var(--gold);
}
.quick-search-fields{
  display:flex;
  align-items:flex-end;
  gap: 30px;
  flex-wrap: wrap;
  flex:1;
}
.field{
  display:flex;
  flex-direction:column;
  gap: 8px;
  min-width: 150px;
}
.field label{
  font-size: 0.65rem;
  letter-spacing: 1.5px;
  color: var(--grey);
  font-weight:600;
}
.field select{
  background:transparent;
  border:none;
  border-bottom: 1px solid rgba(255,255,255,0.15);
  color: var(--white);
  padding: 6px 0;
  font-size: 0.9rem;
}
.field select:focus{ outline:none; border-color: var(--gold); }
.field select.invalid{ border-color: #e28b86; }
.qs-msg{ flex-basis:100%; }

/* Le menu déroulant natif (popup des options) ne peut pas rester "transparent" :
   certains navigateurs (Edge, Brave...) le rendent alors sur fond blanc système,
   ce qui rend le texte blanc illisible. On force un fond opaque sombre ici. */
.field select option{
  background: var(--black-soft);
  color: var(--white);
}
.search-btn{ margin-left:auto; }

/* ==================== FEATURES STRIP ==================== */
.features-strip{
  background: var(--black);
  border: 1px solid rgba(255,255,255,0.06);
  border-top:none;
  border-radius: 0 0 10px 10px;
  padding: 34px 40px;
  display:grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 30px;
  /*margin-top: 40px;*/
}
.feature{
  display:flex;
  gap: 16px;
  align-items:flex-start;
}
.feature-icon{
  color: var(--gold);
  font-size: 1.3rem;
  flex-shrink:0;
  width: 34px;
}
.feature h3{
  font-size: 0.82rem;
  letter-spacing: 0.5px;
  margin-bottom: 6px;
}
.feature p{
  font-size: 0.82rem;
  color: var(--grey);
  line-height:1.4;
}

/* ==================== FLEET / GAMMES DE PRIX ==================== */
.fleet-section{
  background: var(--black);
  padding: 90px 40px 100px;
}
.fleet-heading{
  text-align:center;
  margin-bottom: 50px;
}
.fleet-heading h2{
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  font-weight:700;
}
.fleet-heading p{
  color: var(--grey);
  font-size: 0.95rem;
  margin-top: 12px;
}
.divider-center{
  margin-left:auto;
  margin-right:auto;
}
.fleet-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  max-width: 1300px;
  margin: 0 auto;
}
.fleet-card{
  position:relative;
  border-radius: 10px;
  overflow:hidden;
  aspect-ratio: 3 / 4;
  border: 1px solid rgba(255,255,255,0.06);
}
.fleet-card-media{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.fleet-card-media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.fleet-tier-1{ background-image: radial-gradient(ellipse at 40% 30%, rgba(207,159,82,0.14), transparent 55%), linear-gradient(160deg, #2a2a2d, #0c0c0e 75%); }
.fleet-tier-2{ background-image: radial-gradient(ellipse at 55% 35%, rgba(207,159,82,0.18), transparent 55%), linear-gradient(160deg, #232326, #0a0a0b 75%); }
.fleet-tier-3{ background-image: radial-gradient(ellipse at 50% 30%, rgba(207,159,82,0.22), transparent 55%), linear-gradient(160deg, #1c1c1f, #060607 80%); }

.fleet-card-overlay{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding: 26px;
  background: linear-gradient(180deg, rgba(10,10,11,0.75) 0%, rgba(10,10,11,0.15) 30%, rgba(10,10,11,0.15) 55%, rgba(10,10,11,0.92) 100%);
}
.fleet-card-top h3{
  font-size: 1.15rem;
  font-weight:700;
  margin-bottom: 6px;
}
.fleet-card-top p{
  font-size: 0.85rem;
  color: rgba(255,255,255,0.75);
}
.fleet-badge{
  display:inline-block;
  background: rgba(207,159,82,0.12);
  border: 1px solid rgba(207,159,82,0.4);
  color: var(--gold);
  font-size: 0.65rem;
  letter-spacing: 1px;
  font-weight:700;
  padding: 5px 12px;
  border-radius: 4px;
  margin-bottom: 12px;
}
.fleet-list{
  margin-bottom: 16px;
}
.fleet-list li{
  font-size: 0.85rem;
  color: rgba(255,255,255,0.85);
  padding-left: 22px;
  position:relative;
  margin-bottom: 6px;
}
.fleet-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  color: var(--gold);
  font-weight:700;
}
.fleet-price{
  font-size: 0.8rem;
  letter-spacing: 1px;
  font-weight:700;
  color: var(--gold);
}

/* ==================== SUPERCAR BANNER ==================== */
.supercar-banner{
  position:relative;
  background: var(--black-soft);
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  padding: 40px 60px;
  display:flex;
  align-items:center;
  gap: 30px;
  overflow:hidden;
}
.supercar-icon{
  width: 54px;
  height:54px;
  border-radius:50%;
  border: 1px solid rgba(207,159,82,0.4);
  color: var(--gold);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.supercar-icon svg{ width: 24px; height:24px; }
.supercar-text{ flex-shrink:0; }
.supercar-text h3{
  font-size: 1.1rem;
  letter-spacing: 1px;
  margin-bottom: 6px;
}
.supercar-text p{
  font-size: 0.85rem;
  color: var(--grey);
  line-height:1.5;
}
.supercar-media{
  flex:1;
  min-width: 0;
  height: 260px;
  border-radius: 8px;
  overflow:hidden;
  position:relative;
}
.supercar-media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: 50% 22%;
}

/* ==================== START PROJECT (page d'accueil) ==================== */
.start-project{
  background: var(--black);
  padding: 90px 40px 100px;
}
.start-project-box{
  max-width: 1300px;
  margin: 0 auto;
  background: var(--black-soft);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  padding: 60px 50px;
}
.method-path-tag{
  font-size: 0.72rem;
  letter-spacing: 0.5px;
  color: var(--gold);
  font-weight:600;
  margin: 14px 0 14px;
}
.method-path-btn-light{
  width:100%;
  justify-content:center;
  margin-bottom: 12px;
  background: var(--off-white);
  color: #16161a;
}
.method-path-btn-light:hover{ filter:brightness(0.95); }

.trust-strip{
  margin-top: 40px;
  padding-top: 30px;
  border-top: 1px solid rgba(255,255,255,0.08);
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.trust-item{
  display:flex;
  align-items:flex-start;
  gap: 12px;
}
.trust-icon{ font-size: 1.1rem; flex-shrink:0; }
.trust-item h5{
  font-size: 0.72rem;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}
.trust-item p{
  font-size: 0.74rem;
  color: var(--grey);
  line-height:1.4;
}

/* ==================== WHY US ==================== */
.why-us{
  background: var(--off-white);
  color: #16161a;
  padding: 100px 60px;
  display:grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 70px;
  align-items:center;
}
.why-us-text h2{
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  font-weight:700;
  line-height:1.25;
  margin-bottom: 22px;
}
.divider{
  width: 60px;
  height: 3px;
  background: var(--gold);
  margin-bottom: 22px;
}
.why-us-text p{
  color: #4a4a4f;
  font-size: 0.98rem;
  max-width: 460px;
  margin-bottom: 18px;
}
.signature{
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-size: 1.6rem;
  margin-top: 20px;
  margin-bottom: 4px;
}
.signature-role{
  font-size: 0.7rem;
  letter-spacing: 2px;
  color: var(--gold);
  font-weight:600;
}

.why-us-gallery{ display:flex; flex-direction:column; gap: 16px; }
.gallery-main{
  width: 100%;
  aspect-ratio: 20 / 9;
  border-radius: 10px;
  background-image:
    radial-gradient(ellipse at 35% 60%, rgba(207,159,82,0.25), transparent 55%),
    linear-gradient(135deg, #2b2b2e, #0e0e10 70%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position:relative;
  overflow:hidden;
}
.gallery-main::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 70% 30%, rgba(255,255,255,0.08), transparent 40%);
}
.gallery-main img,
.gallery-thumb img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center;
}
.gallery-sub{ display:grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.gallery-thumb{
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  background-image: linear-gradient(135deg, #26262a, #0e0e10);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position:relative;
  overflow:hidden;
}
.img-interior{ background-image: radial-gradient(circle at 60% 40%, rgba(207,159,82,0.3), transparent 50%), linear-gradient(135deg,#232326,#0d0d0f); }
.img-wheel{ background-image: radial-gradient(circle at 45% 45%, rgba(207,159,82,0.35), transparent 55%), linear-gradient(135deg,#1c1c1f,#0a0a0b); }

/* ==================== TESTIMONIALS ==================== */
.testimonials{
  background: var(--black);
  padding: 90px 40px;
  text-align:center;
}
.testimonial-track{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 20px;
  max-width: 1300px;
  margin: 30px auto 0;
}
.tcarousel-arrow{
  width: 42px; height:42px;
  border-radius:50%;
  border: 1px solid rgba(255,255,255,0.2);
  color: var(--white);
  font-size: 1.3rem;
  flex-shrink:0;
  transition: all .2s ease;
}
.tcarousel-arrow:hover{ border-color: var(--gold); color: var(--gold); }

.testimonial-cards{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  flex:1;
}
.testimonial-card{
  background: var(--charcoal);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 26px;
  text-align:left;
}
.tcard-top{
  display:flex;
  align-items:flex-start;
  gap: 14px;
  margin-bottom: 16px;
  position:relative;
}
.avatar{
  width: 46px; height:46px;
  border-radius:50%;
  flex-shrink:0;
  background: linear-gradient(135deg, #55555a, #2a2a2d);
}
.tcard-meta h4{ font-size: 0.9rem; margin: 4px 0 2px; }
.tcard-meta p{ font-size: 0.78rem; color: var(--grey); }
.stars{ color: var(--gold); font-size: 0.75rem; letter-spacing:2px; }
.quote-mark{
  margin-left:auto;
  font-size: 2rem;
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  line-height: 1;
}
.tcard-text{
  font-size: 0.88rem;
  color: rgba(255,255,255,0.8);
  line-height:1.6;
}

.tdots{
  display:flex;
  justify-content:center;
  gap: 10px;
  margin-top: 30px;
}
.dot{
  width: 8px; height:8px;
  border-radius:50%;
  background: rgba(255,255,255,0.25);
  cursor:pointer;
}
.dot.active{ background: var(--gold); }

/* ==================== CTA ==================== */
.cta{
  position:relative;
  background: linear-gradient(120deg, #0a0a0b 0%, #141416 55%, #0a0a0b 100%);
  padding: 100px 60px;
  display:grid;
  grid-template-columns: 0.9fr 1.1fr;
  align-items:center;
  gap: 40px;
  overflow:hidden;
}
.cta-car{
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 10px;
  background-image:
    radial-gradient(ellipse at 50% 55%, rgba(207,159,82,0.12), transparent 60%),
    linear-gradient(160deg, #1c1c1f 10%, #060607 80%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position:relative;
  overflow:hidden;
}
.cta-car img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center;
}
.cta-car::after{
  content:"CH";
  position:absolute;
  bottom: 24px;
  left: 30px;
  font-weight:700;
  letter-spacing:2px;
  color: rgba(207,159,82,0.5);
  border: 1px solid rgba(207,159,82,0.4);
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 0.85rem;
}
.cta-content h2{
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  font-weight:700;
  margin-bottom: 16px;
}
.cta-content p{
  color: var(--grey);
  max-width: 480px;
  margin-bottom: 28px;
}

/* ==================== CONTACT ==================== */
.contact-section{
  background: var(--black);
  padding: 100px 60px;
  display:grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 70px;
  align-items:flex-start;
}
.contact-intro h2{
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight:700;
  line-height:1.25;
  margin-bottom: 22px;
}
.contact-intro p{
  color: rgba(255,255,255,0.65);
  max-width: 440px;
  margin-bottom: 26px;
}
.contact-details{ display:flex; flex-direction:column; gap: 14px; }
.contact-paths{ margin-top: 30px; max-width: 380px; }
.contact-paths .cta-path{ flex-direction:column; align-items:flex-start; }
.contact-paths .cta-path-arrow{ margin-left:0; margin-top: 10px; }
.resultats-paths{ grid-column: 1 / -1; max-width:none; margin-top:36px; }
.resultats-paths .cta-path{ flex-direction:row; align-items:flex-start; }
.resultats-paths .cta-path-arrow{ margin-left:auto; margin-top:0; }
.contact-details li{
  display:flex;
  align-items:center;
  gap: 12px;
  font-size: 0.9rem;
  color: var(--white);
}
.contact-icon{
  width: 34px; height:34px;
  border: 1px solid rgba(207,159,82,0.4);
  border-radius: 50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--gold);
  font-size: 0.85rem;
  flex-shrink:0;
}

.contact-form{
  background: var(--charcoal);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 34px;
  display:flex;
  flex-direction:column;
  gap: 20px;
}
.form-row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.form-group{ display:flex; flex-direction:column; gap: 8px; }
.form-group label{
  font-size: 0.68rem;
  letter-spacing: 1.5px;
  color: var(--grey);
  font-weight:600;
}
.form-group input,
.form-group textarea{
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 6px;
  padding: 12px 14px;
  color: var(--white);
  font-family: inherit;
  font-size: 0.9rem;
  resize: vertical;
  transition: border-color .2s ease;
}
.form-group input::placeholder,
.form-group textarea::placeholder{ color: rgba(255,255,255,0.3); }
.form-group input:focus,
.form-group textarea:focus{
  outline:none;
  border-color: var(--gold);
}
.form-group input.invalid,
.form-group textarea.invalid{ border-color: #d9534f; }

.form-group select{
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 6px;
  padding: 12px 14px;
  color: var(--white);
  font-family: inherit;
  font-size: 0.9rem;
  transition: border-color .2s ease;
}
.form-group select:focus{ outline:none; border-color: var(--gold); }
.form-group select.invalid{ border-color: #d9534f; }
.form-group select option{
  background: var(--black-soft);
  color: var(--white);
}

/* Champ date : forcer un rendu sombre cohérent (icône calendrier native) */
.form-group input[type="date"]{ color-scheme: dark; }
.form-group input[type="date"]::-webkit-calendar-picker-indicator{
  filter: invert(1);
  cursor:pointer;
}

.checkbox-group{ display:flex; }
.checkbox-label{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.7);
  cursor:pointer;
  line-height:1.4;
}
.checkbox-label input[type="checkbox"]{
  flex-shrink:0;
  width: 17px;
  height: 17px;
  margin-top: 2px;
  accent-color: var(--gold);
  cursor:pointer;
}
.checkbox-label input[type="checkbox"].invalid{ outline: 1px solid #e28b86; outline-offset:3px; }

.captcha-box{ display:flex; flex-direction:column; gap: 8px; }
.captcha-box label{
  font-size: 0.68rem;
  letter-spacing: 1.5px;
  color: var(--grey);
  font-weight:600;
}
.captcha-inner{
  display:flex;
  align-items:center;
  gap: 14px;
}
.captcha-question{
  background: rgba(207,159,82,0.08);
  border: 1px dashed rgba(207,159,82,0.4);
  border-radius: 6px;
  padding: 12px 18px;
  color: var(--gold-light);
  font-weight:600;
  letter-spacing: 1px;
  min-width: 110px;
  text-align:center;
}
.captcha-inner input{
  flex:1;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 6px;
  padding: 12px 14px;
  color: var(--white);
  font-family: inherit;
  font-size: 0.9rem;
}
.captcha-inner input:focus{ outline:none; border-color: var(--gold); }
.captcha-refresh{
  width: 42px; height: 42px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.15);
  color: var(--white);
  font-size: 1.1rem;
  flex-shrink:0;
  transition: all .2s ease;
}
.captcha-refresh:hover{ border-color: var(--gold); color: var(--gold); transform: rotate(90deg); }

.form-msg{
  font-size: 0.85rem;
  min-height: 1.2em;
}
.form-msg.success{ color: #7fd88f; }
.form-msg.error{ color: #e28b86; }

.form-submit{ align-self:flex-start; }

/* ==================== FOOTER STATS ==================== */
.stats-footer{
  background: var(--black-soft);
  border-top: 1px solid rgba(255,255,255,0.06);
  padding: 40px 60px;
  text-align:center;
}
.stats-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
}
.stat-icon{ font-size: 1.4rem; margin-bottom: 10px; color: var(--gold); }

.footer-legal{
  font-size: 0.78rem;
  font-weight:500;
  letter-spacing: 1px;
  color: rgba(255,255,255,0.35);
  margin-top: 1cm;
}
.footer-social{
  display:flex;
  justify-content:center;
  align-items:center;
  gap: 22px;
  margin-top: 34px;
  padding-top: 30px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.footer-social a{
  color: rgba(255,255,255,0.75);
  display:flex;
  transition: color .2s ease, transform .2s ease;
}
.footer-social a:hover{
  color: var(--gold);
  transform: translateY(-2px);
}
.footer-social svg{
  width: 21px;
  height: 21px;
}
.stat-number{ font-size: 1.8rem; font-weight:700; color: var(--white); }
.stat-label{ font-size: 0.7rem; letter-spacing: 1.5px; color: var(--grey); margin-top: 6px; }

/* ==================== IMPORTATION PAGE ==================== */
.import-hero{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  align-items:center;
  padding: 70px 60px 90px;
  max-width: 1500px;
  margin: 0 auto;
}
.import-hero-text h1{
  font-size: clamp(2rem, 3.6vw, 2.9rem);
  font-weight:700;
  line-height:1.18;
  margin-bottom: 20px;
}
.import-hero-text h1 .accent{ color: var(--gold); font-weight:400; }
.import-hero-sub{
  color: rgba(255,255,255,0.75);
  font-size: 1rem;
  max-width: 480px;
  margin-bottom: 34px;
}
.import-mini-features{
  display:flex;
  flex-wrap:wrap;
  gap: 30px;
}
.import-mini-feature{
  display:flex;
  align-items:center;
  gap: 12px;
  min-width: 150px;
}
.import-mini-icon{
  width: 38px;
  height: 38px;
  border: 1px solid rgba(207,159,82,0.4);
  border-radius: 50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--gold);
  flex-shrink:0;
}
.import-mini-icon svg{ width: 18px; height:18px; }
.import-mini-feature span{
  font-size: 0.7rem;
  letter-spacing: 0.5px;
  font-weight:600;
  color: rgba(255,255,255,0.85);
  line-height:1.4;
}

.import-hero-visual{
  position:relative;
  aspect-ratio: 4 / 3;
  border-radius: 14px;
  overflow:hidden;
  background: #060608;
  border: 1px solid rgba(255,255,255,0.08);
}
.import-map-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: 60% 40%;
  opacity: 0.55;
}
.import-map-overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(6,6,8,0.15) 0%, rgba(6,6,8,0.35) 55%, rgba(6,6,8,0.85) 100%);
}
.import-map-svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.import-map-nodes circle{
  filter: drop-shadow(0 0 4px rgba(207,159,82,0.8));
}
.import-map-labels{
  position:absolute;
  inset:0;
}
.import-map-labels span{
  position:absolute;
  transform: translate(-50%, -50%);
  font-size: 0.62rem;
  letter-spacing: 1px;
  font-weight:600;
  color: var(--gold-light);
  white-space:nowrap;
  text-shadow: 0 1px 3px rgba(0,0,0,0.8);
}
.import-hero-car{
  position:absolute;
  left:50%;
  bottom:-4%;
  transform: translateX(-50%);
  width: 78%;
  object-fit:contain;
  filter: drop-shadow(0 20px 30px rgba(0,0,0,0.6));
}

/* ---- process ---- */
.import-process{
  background: var(--black);
  padding: 90px 40px 100px;
  text-align:center;
}
.process-track{
  position:relative;
  max-width: 1300px;
  margin: 50px auto 0;
  display:grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 20px;
}
.process-track::before{
  content:"";
  position:absolute;
  top: 20px;
  left: 8%;
  right: 8%;
  height: 1px;
  background-image: linear-gradient(90deg, rgba(207,159,82,0.6) 0 6px, transparent 6px 14px);
  background-size: 14px 1px;
  background-repeat: repeat-x;
  z-index:0;
}
.process-step{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.process-num{
  width: 40px;
  height:40px;
  border-radius:50%;
  background: var(--black);
  border: 1px solid var(--gold);
  color: var(--gold);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size: 0.95rem;
  margin-bottom: 16px;
}
.process-icon{
  color: var(--gold);
  margin-bottom: 14px;
}
.process-icon svg{ width: 26px; height:26px; }
.process-step h3{
  font-size: 0.82rem;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}
.process-step p{
  font-size: 0.78rem;
  color: var(--grey);
  line-height:1.5;
  max-width: 190px;
}
.process-media{
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  overflow:hidden;
  margin-top: 16px;
  border: 1px solid rgba(255,255,255,0.06);
}
.process-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.process-media-placeholder{
  background-image: radial-gradient(ellipse at 50% 30%, rgba(207,159,82,0.16), transparent 55%), linear-gradient(150deg, #232326, #0a0a0b 75%);
}

/* plain single-image hero visual (no map graphic) */
.method-hero-visual{ background:#060608; }
.method-hero-visual img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

/* ---- services ---- */
.import-services{
  background: var(--black-soft);
  padding: 90px 40px 100px;
  text-align:center;
}
.services-grid{
  max-width: 1300px;
  margin: 50px auto 0;
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}
.service-card{
  background: var(--charcoal);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 30px 22px;
  text-align:left;
}
.service-icon{
  width: 44px;
  height:44px;
  border-radius:10px;
  background: rgba(207,159,82,0.1);
  color: var(--gold);
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom: 18px;
}
.service-icon svg{ width: 22px; height:22px; }
.service-card h3{
  font-size: 0.85rem;
  letter-spacing: 0.5px;
  margin-bottom: 14px;
}
.check-list li{
  font-size: 0.8rem;
  color: rgba(255,255,255,0.8);
  padding-left: 20px;
  position:relative;
  margin-bottom: 8px;
  line-height:1.4;
}
.check-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  color: var(--gold);
  font-weight:700;
}

/* ---- countries ---- */
.import-countries{
  background: var(--black);
  padding: 90px 40px 100px;
  text-align:center;
}
.countries-grid{
  max-width: 1300px;
  margin: 50px auto 0;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.country-card{
  position:relative;
  border-radius: 10px;
  padding: 28px 24px;
  text-align:left;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,0.06);
}
.country-tier-1{ background-image: radial-gradient(ellipse at 75% 20%, rgba(207,159,82,0.16), transparent 55%), linear-gradient(150deg, #232326, #0a0a0b 75%); }
.country-tier-2{ background-image: radial-gradient(ellipse at 20% 25%, rgba(207,159,82,0.14), transparent 55%), linear-gradient(150deg, #262629, #0b0b0c 75%); }
.country-tier-3{ background-image: radial-gradient(ellipse at 70% 75%, rgba(207,159,82,0.15), transparent 55%), linear-gradient(150deg, #202023, #0a0a0b 75%); }
.country-tier-4{ background-image: radial-gradient(ellipse at 30% 70%, rgba(207,159,82,0.14), transparent 55%), linear-gradient(150deg, #242427, #0b0b0c 75%); }
.country-tier-5{ background-image: radial-gradient(ellipse at 65% 30%, rgba(207,159,82,0.17), transparent 55%), linear-gradient(150deg, #212124, #0a0a0b 75%); }
.country-tier-6{ background-image: radial-gradient(ellipse at 35% 65%, rgba(207,159,82,0.14), transparent 55%), linear-gradient(150deg, #232326, #0b0b0c 75%); }
.country-flag{
  width: 60px;
  height: 60px;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 14px;
}
.country-flag img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.country-card h3{
  font-size: 0.95rem;
  letter-spacing: 0.5px;
  margin-bottom: 10px;
}
.country-card p{
  font-size: 0.82rem;
  color: rgba(255,255,255,0.75);
  line-height:1.55;
}

/* ---- commitments ---- */
.import-commitments{
  background: var(--black-soft);
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  padding: 60px 40px;
  text-align:center;
}
.commitments-row{
  max-width: 1300px;
  margin: 40px auto 0;
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
}
.commitment{ text-align:center; }
.commitment-icon{
  width: 42px;
  height:42px;
  border-radius:50%;
  border: 1px solid rgba(207,159,82,0.4);
  color: var(--gold);
  display:flex;
  align-items:center;
  justify-content:center;
  margin: 0 auto 14px;
}
.commitment-icon svg{ width: 20px; height:20px; }
.commitment h4{
  font-size: 0.78rem;
  letter-spacing: 0.5px;
  margin-bottom: 6px;
}
.commitment p{
  font-size: 0.76rem;
  color: var(--grey);
  line-height:1.4;
}

/* ---- import cta ---- */
.import-cta{
  position:relative;
  background: var(--black);
  padding: 100px 60px;
  display:grid;
  grid-template-columns: 0.85fr 1.15fr;
  align-items:center;
  gap: 50px;
}
.import-cta-car{
  width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: 10px;
  overflow:hidden;
  position:relative;
}
.import-cta-car img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.import-cta-content h2{
  font-size: clamp(1.5rem, 2.8vw, 2.1rem);
  font-weight:700;
  margin-bottom: 14px;
}
.import-cta-content > p{
  color: var(--grey);
  max-width: 480px;
  margin-bottom: 30px;
}
.import-cta-paths{
  display:flex;
  align-items:center;
  gap: 20px;
  flex-wrap:wrap;
}
.cta-path{
  flex: 1 1 300px;
  display:flex;
  align-items:flex-start;
  gap: 16px;
  background: var(--charcoal);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 22px;
  transition: border-color .2s ease, transform .2s ease;
}
.cta-path:hover{ border-color: var(--gold); transform: translateY(-2px); }
.cta-path-icon{
  width: 40px;
  height:40px;
  border-radius:8px;
  background: rgba(207,159,82,0.1);
  color: var(--gold);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.cta-path-icon svg{ width: 20px; height:20px; }
.cta-path-text h4{
  font-size: 0.82rem;
  letter-spacing: 0.5px;
  color: var(--gold);
  margin-bottom: 6px;
}
.cta-path-text p{
  font-size: 0.78rem;
  color: var(--grey);
  line-height:1.45;
}
.cta-path-arrow{
  margin-left:auto;
  color: var(--gold);
  flex-shrink:0;
}
.cta-path-divider{
  width: 36px;
  height:36px;
  border-radius:50%;
  border: 1px solid rgba(255,255,255,0.2);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 0.7rem;
  color: var(--grey);
  flex-shrink:0;
}

/* ==================== METHOD CTA (double parcours + voitures en bordure) ==================== */
.method-cta{
  position:relative;
  background: var(--black);
  display:grid;
  grid-template-columns: 0.7fr 2.6fr 0.7fr;
  align-items:stretch;
  overflow:hidden;
}
.method-cta-car{
  position:relative;
  min-height: 100%;
}
.method-cta-car img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.method-cta-car.left img{ object-position: right center; }
.method-cta-car.right img{ object-position: left center; }
.method-cta-car::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(6,6,8,0.45);
}
.method-cta-content{
  position:relative;
  z-index:1;
  padding: 90px 40px;
  text-align:center;
}
.method-cta-paths{
  max-width: 1000px;
  margin: 0 auto;
  display:flex;
  align-items:center;
  gap: 24px;
}
.method-path-card{
  flex:1;
  background: var(--charcoal);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 30px 26px;
  text-align:left;
}
.method-path-card h4{
  font-size: 0.95rem;
  letter-spacing: 0.5px;
  color: var(--gold);
  margin: 16px 0 8px;
}
.method-path-card > p{
  font-size: 0.85rem;
  color: rgba(255,255,255,0.75);
  line-height:1.5;
  margin-bottom: 16px;
}
.method-path-card .check-list{
  margin-bottom: 22px;
}
.method-path-btn{
  width:100%;
  justify-content:center;
  margin-bottom: 12px;
}
.method-path-note{
  font-size: 0.75rem;
  color: var(--grey);
  text-align:center;
}
.method-cta-divider{
  width: 40px;
  height:40px;
  border-radius:50%;
  border: 1px solid rgba(255,255,255,0.2);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 0.72rem;
  color: var(--grey);
  flex-shrink:0;
  background: var(--black);
}

/* ==================== INSPECTION GRID ==================== */
.inspect-grid-section{ background: var(--black); }
.inspect-grid{
  max-width: 1400px;
  margin: 50px auto 0;
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}
.inspect-card{
  background: var(--charcoal);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 22px;
  display:flex;
  flex-direction:column;
}
.inspect-card-head{
  display:flex;
  align-items:center;
  gap: 12px;
  margin-bottom: 14px;
}
.inspect-card-head h3{
  font-size: 0.8rem;
  letter-spacing: 0.3px;
  line-height:1.3;
}
.inspect-card .check-list{ margin-bottom: 16px; }
.inspect-card .check-list li{ font-size: 0.74rem; }
.inspect-media{
  margin-top: auto;
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  overflow:hidden;
  margin-bottom: 14px;
}
.inspect-media img{ width:100%; height:100%; object-fit:cover; object-position:center; }
.inspect-tint-1{ background-image: radial-gradient(ellipse at 60% 30%, rgba(207,159,82,0.18), transparent 55%), linear-gradient(150deg, #232326, #0a0a0b 75%); }
.inspect-tint-2{ background-image: radial-gradient(ellipse at 30% 70%, rgba(207,159,82,0.15), transparent 55%), linear-gradient(150deg, #202023, #0a0a0b 75%); }
.inspect-tint-3{ background-image: radial-gradient(ellipse at 70% 25%, rgba(207,159,82,0.19), transparent 55%), linear-gradient(150deg, #242427, #0a0a0b 75%); }
.inspect-tint-4{ background-image: radial-gradient(ellipse at 40% 65%, rgba(207,159,82,0.14), transparent 55%), linear-gradient(150deg, #212124, #0a0a0b 75%); }
.inspect-tint-5{ background-image: radial-gradient(ellipse at 55% 40%, rgba(207,159,82,0.17), transparent 55%), linear-gradient(150deg, #232326, #0a0a0b 75%); }
.inspect-tint-6{ background-image: radial-gradient(ellipse at 35% 30%, rgba(207,159,82,0.16), transparent 55%), linear-gradient(150deg, #202023, #0a0a0b 75%); }
.inspect-tint-7{ background-image: radial-gradient(ellipse at 65% 60%, rgba(207,159,82,0.15), transparent 55%), linear-gradient(150deg, #212124, #0a0a0b 75%); }
.inspect-tint-8{ background-image: radial-gradient(ellipse at 45% 45%, rgba(207,159,82,0.18), transparent 55%), linear-gradient(150deg, #242427, #0a0a0b 75%); }
.inspect-badge{
  font-size: 0.7rem;
  letter-spacing: 1px;
  font-weight:700;
  color: var(--gold);
  text-align:center;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,0.08);
}

/* ==================== INSPECTION REPORT MOCKUP ==================== */
.report-section{
  background: var(--black-soft);
  padding: 100px 60px;
  display:grid;
  grid-template-columns: 0.8fr 1.5fr;
  gap: 60px;
  align-items:center;
}
.report-text h2{
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  font-weight:700;
  line-height:1.25;
  margin: 10px 0 18px;
}
.report-intro{
  color: var(--grey);
  margin-bottom: 20px;
}
.report-check-list li{ font-size: 0.85rem; margin-bottom: 10px; }

.report-preview{
  display:flex;
  align-items:center;
  gap: 14px;
  overflow:hidden;
}
.report-card{
  scroll-snap-align:center;
  background: var(--charcoal);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 16px;
  flex-shrink:0;
}
.report-card-side{
  width: 150px;
  opacity: 0.55;
  transform: scale(0.92);
}
.report-card-title{
  font-size: 0.62rem;
  letter-spacing: 0.5px;
  font-weight:700;
  color: var(--grey);
  margin-bottom: 12px;
  text-align:center;
}
.report-score{
  position:relative;
  width: 60px;
  height:60px;
  margin: 0 auto 10px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.report-score svg{ position:absolute; inset:0; width:100%; height:100%; }
.report-score span{ position:relative; font-size: 0.68rem; font-weight:700; color: var(--gold); }
.report-status{
  font-size: 0.66rem;
  color: #7fd88f;
  text-align:center;
  margin-bottom: 12px;
}
.report-dot-list li{
  display:flex;
  align-items:center;
  gap: 6px;
  font-size: 0.64rem;
  color: rgba(255,255,255,0.8);
  margin-bottom: 7px;
}
.report-dot-list li em{
  margin-left:auto;
  font-style:normal;
  color: #7fd88f;
  font-size: 0.6rem;
}
.dot-ok, .dot-warn, .dot-alert, .dot-off{
  width: 7px; height:7px;
  border-radius:50%;
  flex-shrink:0;
}
.dot-ok{ background:#7fd88f; }
.dot-warn{ background: var(--gold); }
.dot-alert{ background:#e28b86; }
.dot-off{ background: rgba(255,255,255,0.25); }

.report-card-main{
  width: 220px;
  padding: 22px 18px;
  border-color: rgba(207,159,82,0.5);
  box-shadow: 0 0 0 1px rgba(207,159,82,0.2), 0 20px 40px rgba(0,0,0,0.4);
  text-align:center;
}
.report-brand img{ height: 22px; margin: 0 auto 10px; display:block; }
.report-title{
  font-size: 0.72rem;
  letter-spacing: 1px;
  font-weight:700;
  color: var(--gold);
  margin-bottom: 14px;
}
.report-car-img{
  width: 100%;
  aspect-ratio: 16/10;
  border-radius: 8px;
  overflow:hidden;
  margin-bottom: 12px;
}
.report-car-img img{ width:100%; height:100%; object-fit:cover; }
.report-card-main h4{ font-size: 0.9rem; margin-bottom: 4px; }
.report-country{ font-size: 0.72rem; color: var(--grey); margin-bottom: 8px; }
.report-meta{ font-size: 0.62rem; color: var(--grey); margin-bottom: 2px; }

.report-diagram{ display:flex; justify-content:center; margin-bottom: 12px; }
.report-diagram svg{ width: 50px; height:80px; }
.report-legend li{
  display:flex;
  align-items:center;
  gap: 6px;
  font-size: 0.62rem;
  color: rgba(255,255,255,0.75);
  margin-bottom: 6px;
}
.report-stars-list li{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size: 0.62rem;
  color: rgba(255,255,255,0.8);
  margin-bottom: 9px;
  gap: 8px;
}
.report-stars-list li span{ color: var(--gold); letter-spacing: 1px; flex-shrink:0; }

/* ==================== ABOUT PAGE ==================== */
.about-hero-sub{ margin-bottom: 4px; }
.about-founders-visual{
  background-image: radial-gradient(ellipse at 60% 25%, rgba(207,159,82,0.18), transparent 55%), linear-gradient(150deg, #232326, #0a0a0b 75%);
}

.about-stats{
  max-width: 1400px;
  margin: 0 auto 90px;
  padding: 0 60px;
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  background: var(--black-soft);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 36px 50px;
}
.about-stat{
  display:flex;
  align-items:center;
  gap: 16px;
}
.about-stat-icon{
  width: 48px;
  height:48px;
  border-radius:50%;
  border: 1px solid rgba(207,159,82,0.4);
  color: var(--gold);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.about-stat-icon svg{ width: 24px; height:24px; }
.about-stat-number{
  font-size: 1.5rem;
  font-weight:700;
  color: var(--gold);
  line-height:1.1;
}
.about-stat p{
  font-size: 0.72rem;
  letter-spacing: 0.5px;
  font-weight:600;
  color: var(--white);
  margin-top: 4px;
  line-height:1.4;
}
.about-stat p span{
  display:block;
  font-size: 0.7rem;
  font-weight:400;
  letter-spacing:0;
  color: var(--grey);
  margin-top: 2px;
}

.accent-inline{ color: var(--gold); }

.history-section{
  background: var(--black);
  padding: 90px 60px;
  display:grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 60px;
  align-items:center;
}
.history-text h2{
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  font-weight:700;
  line-height:1.25;
  margin: 10px 0 20px;
}
.history-text p{
  color: rgba(255,255,255,0.75);
  margin-bottom: 16px;
  line-height:1.6;
}
.history-media{
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 12px;
  overflow:hidden;
}
.history-media img{ width:100%; height:100%; object-fit:cover; object-position:center; }
.history-media-placeholder{
  background-image: radial-gradient(ellipse at 45% 30%, rgba(207,159,82,0.16), transparent 55%), linear-gradient(150deg, #202023, #0a0a0b 75%);
}

.trust-photos-section{
  background: var(--black);
  padding: 90px 60px 100px;
  display:grid;
  grid-template-columns: 0.7fr 1.3fr;
  gap: 50px;
  align-items:center;
}
.trust-photos-text h2{
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  font-weight:700;
  line-height:1.25;
  margin-bottom: 24px;
}
.trust-photos-list li{ font-size: 0.9rem; margin-bottom: 12px; }

.trust-photos-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.trust-photo p{
  text-align:center;
  font-size: 0.72rem;
  letter-spacing: 0.5px;
  font-weight:600;
  color: var(--grey);
  margin-top: 10px;
}
.trust-photo-media{
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 10px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,0.06);
}
.trust-photo-media img{ width:100%; height:100%; object-fit:cover; object-position:center; }
.trust-tint-1{ background-image: radial-gradient(ellipse at 55% 30%, rgba(207,159,82,0.17), transparent 55%), linear-gradient(150deg, #232326, #0a0a0b 75%); }
.trust-tint-2{ background-image: radial-gradient(ellipse at 40% 65%, rgba(207,159,82,0.14), transparent 55%), linear-gradient(150deg, #202023, #0a0a0b 75%); }

/* ==================== RESPONSIVE ==================== */
@media (max-width: 1024px){
  .hero.video-playing .hero-content{ display:none; }
  .hero{ min-height: 85vh; }

  .fleet-grid{ grid-template-columns: 1fr; max-width: 480px; }
  .why-us{ grid-template-columns: 1fr; padding: 70px 30px; }
  .cta{ grid-template-columns: 1fr; }
  .features-strip{ grid-template-columns: repeat(3, 1fr); }
  .testimonial-cards{ grid-template-columns: 1fr; }
  .tcarousel-arrow{ display:none; }
  .stats-grid{ grid-template-columns: repeat(2, 1fr); gap: 30px; }
  .contact-section{ grid-template-columns: 1fr; padding: 70px 30px; }

  .import-hero{ grid-template-columns: 1fr; padding: 60px 30px 70px; }
  .import-hero-visual{ aspect-ratio: 16/10; }
  .process-track{ grid-template-columns: repeat(3, 1fr); row-gap: 44px; }
  .process-track::before{ display:none; }
  .services-grid{ grid-template-columns: repeat(2, 1fr); max-width: 700px; }
  .countries-grid{ grid-template-columns: repeat(2, 1fr); max-width: 700px; }
  .commitments-row{ grid-template-columns: repeat(3, 1fr); row-gap: 28px; }
  .import-cta{ grid-template-columns: 1fr; padding: 70px 30px; }
  .import-cta-car{ aspect-ratio: 16/9; }

  .method-cta{ grid-template-columns: 1fr; }
  .method-cta-car{ min-height: 180px; }
  .method-cta-paths{ flex-direction:column; }
  .method-cta-divider{ margin: 4px auto; }

  .inspect-grid{ grid-template-columns: repeat(2, 1fr); max-width: 700px; }
  .report-section{ grid-template-columns: 1fr; }

  .supercar-banner{ flex-wrap:wrap; padding: 30px 30px; }
  .supercar-media{ flex-basis: 100%; height: 140px; }
  .start-project-box{ padding: 50px 30px; }
  .trust-strip{ grid-template-columns: repeat(2, 1fr); }

  .about-stats{ grid-template-columns: repeat(2, 1fr); padding: 30px; }
  .history-section{ grid-template-columns: 1fr; padding: 60px 30px; }
  .trust-photos-section{ grid-template-columns: 1fr; padding: 60px 30px 70px; }
  .trust-photos-grid{ grid-template-columns: repeat(2, 1fr); max-width: 480px; }
}

@media (max-width: 640px){
  .form-row{ grid-template-columns: 1fr; }
  .captcha-inner{ flex-wrap: wrap; }
  .captcha-question{ flex:1; }
}

@media (max-width: 860px){
  .main-nav{
    display:none;
    position:absolute;
    top: 100%;
    left:0;
    right:0;
    background: var(--black-soft);
    border-bottom: 1px solid rgba(255,255,255,0.08);
    flex-direction:column;
    gap:0;
    padding: 10px 20px 20px;
  }
  .main-nav.open{ display:flex; }
  .main-nav a{ padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
  .nav-cta{ display:none; }
  .social-links{ gap: 12px; }
  .social-links svg{ width: 17px; height: 17px; }
  .burger{ display:flex; }
  .burger.active span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
  .burger.active span:nth-child(2){ opacity:0; }
  .burger.active span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }
  .site-header{ position:sticky; }
  .header-inner{ padding: 6px 20px; position:relative; }
  .hero{ padding: 40px 20px 40px; min-height: auto; }
  .search-panel{ padding: 0 20px 40px; }
  .quick-search{ padding: 20px; }
  .quick-search-fields{ gap: 18px; }
  .search-btn{ margin-left:0; width:100%; justify-content:center; }
  .features-strip{ padding: 26px 20px; grid-template-columns: 1fr; }
  .fleet-section{ padding: 60px 20px 70px; }
  .why-us{ padding: 60px 20px; gap: 40px; }
  .testimonials{ padding: 60px 20px; }
  .cta{ padding: 60px 20px; }
  .contact-section{ padding: 60px 20px; gap: 40px; }
  .contact-form{ padding: 24px; }
  .stats-footer{ padding: 30px 20px; }

  .import-hero{ padding: 40px 20px 50px; }
  .import-mini-features{ gap: 20px; }
  .import-process{ padding: 60px 20px 70px; }
  .process-track{ grid-template-columns: 1fr 1fr; }
  .import-services{ padding: 60px 20px 70px; }
  .services-grid{ grid-template-columns: 1fr; max-width: 420px; }
  .import-countries{ padding: 60px 20px 70px; }
  .countries-grid{ grid-template-columns: 1fr; max-width: 420px; }
  .import-commitments{ padding: 50px 20px; }
  .commitments-row{ grid-template-columns: 1fr 1fr; }
  .import-cta{ padding: 60px 20px; }
  .import-cta-paths{ flex-direction:column; }
  .cta-path-divider{ margin: 4px auto; }

  .method-cta-content{ padding: 60px 20px; }
  .method-path-card{ padding: 22px 18px; }

  .inspect-grid{ grid-template-columns: 1fr; max-width: 420px; }
  .report-section{ padding: 60px 20px; gap: 40px; }

  .supercar-banner{ padding: 26px 20px; }
  .supercar-text h3{ font-size: 1rem; }
  .start-project{ padding: 60px 20px 70px; }
  .start-project-box{ padding: 34px 20px; }
  .method-cta-paths{ flex-direction:column; }
  .method-cta-divider{ margin: 4px auto; }
  .trust-strip{ grid-template-columns: 1fr; gap: 18px; }

  .about-stats{ grid-template-columns: 1fr; padding: 24px 20px; gap: 20px; }
  .trust-photos-grid{ grid-template-columns: 1fr; max-width: 300px; margin: 0 auto; }
}

@media (max-width: 520px){
  .stats-grid{ grid-template-columns: 1fr 1fr; }
  .process-track{ grid-template-columns: 1fr; }
  .commitments-row{ grid-template-columns: 1fr 1fr; }
  .hero{ min-height: 92vh; }
}

/* Tablettes en portrait (iPad mini/Air/Pro, Android ~712-834px de large) */
@media (min-width: 521px) and (max-width: 900px){
  .hero{ min-height: 92vh; }
}

/* ---- legal page (mentions légales) ---- */
.legal-hero{
  padding: 160px 40px 50px;
  text-align:center;
  background: var(--black);
}
.legal-hero h1{
  font-size: 2.4rem;
  letter-spacing: 1px;
  margin: 14px 0;
}
.legal-content{
  max-width: 820px;
  margin: 0 auto;
  padding: 20px 40px 100px;
}
.legal-content h2{
  font-size: 1.05rem;
  letter-spacing: 0.5px;
  color: var(--gold);
  margin: 42px 0 12px;
}
.legal-content h2:first-child{
  margin-top: 0;
}
.legal-content p{
  font-size: 0.92rem;
  line-height: 1.75;
  color: rgba(255,255,255,0.75);
  margin-bottom: 10px;
}
.legal-content a{
  color: var(--gold-light);
  text-decoration: underline;
}

@media (max-width: 700px){
  .legal-hero{ padding: 140px 20px 40px; }
  .legal-hero h1{ font-size: 1.7rem; }
  .legal-content{ padding: 20px 20px 70px; }
}

/* ---- cookie banner ---- */
.cookie-banner{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  background: var(--black-soft);
  border-top: 1px solid rgba(255,255,255,0.1);
  box-shadow: 0 -6px 24px rgba(0,0,0,0.35);
  padding: 20px 30px;
  transform: translateY(110%);
  transition: transform 0.4s ease;
}
.cookie-banner.visible{
  transform: translateY(0);
}
.cookie-banner-inner{
  max-width: 1200px;
  margin: 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.cookie-text{
  font-size: 0.85rem;
  line-height: 1.6;
  color: rgba(255,255,255,0.8);
  flex: 1 1 380px;
}
.cookie-text a{
  color: var(--gold-light);
  text-decoration: underline;
}
.cookie-actions{
  display:flex;
  gap: 12px;
  flex-shrink: 0;
}
.cookie-actions .btn{
  padding: 10px 22px;
  font-size: 0.78rem;
}

@media (max-width: 600px){
  .cookie-banner{ padding: 16px 18px; }
  .cookie-banner-inner{ flex-direction: column; align-items: stretch; }
  .cookie-actions{ justify-content: flex-end; }
}

/* ---- video section (apropos.html) ---- */
.video-section{
  padding: 90px 40px 100px;
  text-align:center;
  background: var(--black);
}
.video-player-wrap{
  max-width: 960px;
  margin: 46px auto 0;
  aspect-ratio: 16 / 9;
  border-radius: 12px;
  overflow: hidden;
  background: #000;
  box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}
.video-player{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

@media (max-width: 700px){
  .video-section{ padding: 60px 20px 70px; }
  .video-player-wrap{ margin-top: 30px; border-radius: 8px; }
}

/* ---- hero video (index.html) ---- */
.hero-bg video.hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center;
  z-index:2;
}
.hero-video-controls{
  position:absolute;
  right: 24px;
  bottom: 24px;
  z-index:3;
  display:flex;
  gap: 10px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}
.hero-bg:hover .hero-video-controls,
.hero-bg:focus-within .hero-video-controls{
  opacity: 1;
  pointer-events: auto;
}
.hero-video-btn{
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(10,10,11,0.55);
  border: 1px solid rgba(255,255,255,0.25);
  backdrop-filter: blur(4px);
  color: var(--white);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: background 0.2s ease, border-color 0.2s ease;
}
.hero-video-btn:hover{
  background: rgba(207,159,82,0.85);
  border-color: var(--gold);
}
.hero-video-btn svg{
  width: 18px;
  height: 18px;
}

@media (max-width: 700px){
  .hero-video-controls{ right: 14px; bottom: 14px; opacity: 1; pointer-events: auto; }
}

/* ---- videos.html : playlist YouTube ---- */
.videos-section{
  padding: 90px 40px 100px;
  text-align:center;
  background: var(--black);
}
.videos-grid{
  max-width: 1200px;
  margin: 46px auto 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 28px;
}
.video-card-frame{
  aspect-ratio: 9 / 16;
  border-radius: 12px;
  overflow: hidden;
  background: #000;
  box-shadow: 0 16px 40px rgba(0,0,0,0.4);
}
.video-card-frame iframe{
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}
.video-card-title{
  margin-top: 12px;
  font-size: 0.82rem;
  line-height: 1.4;
  color: rgba(255,255,255,0.75);
  text-align: left;
}

@media (max-width: 700px){
  .videos-section{ padding: 60px 20px 70px; }
  .videos-grid{ grid-template-columns: repeat(2, 1fr); gap: 18px; margin-top: 30px; }
  .video-card-title{ font-size: 0.75rem; }
}

@media (max-width: 460px){
  .videos-grid{ grid-template-columns: 1fr; max-width: 320px; }
}
