/* ═══════════════════════════════════════════════
   FIRST POINT ENTREPRISES — Global Stylesheet
   ═══════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;0,700;1,300&family=Rajdhani:wght@400;500;600;700&display=swap');

:root {
  --rouge:      #8B0000;
  --rouge-vif:  #C0001A;
  --rouge-dark: #5a0000;
  --blanc:      #FAFAFA;
  --blanc-casse:#F2EEE8;
  --noir:       #0D0D0D;
  --gris:       #1A1A1A;
  --gris2:      #2C2C2C;
  --or:         #C9A84C;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  background: var(--noir);
  color: var(--blanc);
  font-family: 'Rajdhani', sans-serif;
  overflow-x: hidden;
}
::-webkit-scrollbar { width:3px; }
::-webkit-scrollbar-track { background:var(--noir); }
::-webkit-scrollbar-thumb { background:var(--rouge-vif); }

/* ── NAV ── */
nav {
  position: fixed;
  top:0; left:0; right:0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 60px;
  height: 84px;
  background: rgba(10,0,0,0.93);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(139,0,0,0.25);
  transition: all .4s;
}
nav.scrolled {
  height:68px;
  background: rgba(5,0,0,0.98);
  border-bottom-color: rgba(139,0,0,0.5);
}
.nav-logo {
  display:flex; align-items:center; gap:14px; text-decoration:none;
}
.nav-logo-icon {
  width:40px; height:40px;
  background: linear-gradient(135deg, var(--rouge-vif), var(--rouge));
  border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  font-family:'Cormorant Garamond',serif;
  font-size:16px; font-weight:700; color:white; letter-spacing:-1px;
  box-shadow:0 0 20px rgba(192,0,26,.4);
  flex-shrink:0;
}
.nav-brand { display:flex; flex-direction:column; line-height:1; }
.nav-brand .top {
  font-size:15px; font-weight:700; letter-spacing:3px;
  text-transform:uppercase; color:rgba(255,255,255,.8);
}
.nav-brand .bot {
  font-size:19px; font-weight:700; letter-spacing:4px;
  text-transform:uppercase; color:var(--rouge-vif); margin-top:2px;
}
.nav-links {
  display:flex; align-items:center; gap:36px; list-style:none;
}
.nav-links a {
  color:rgba(255,255,255,.6); text-decoration:none;
  font-size:15px; font-weight:600; letter-spacing:2px; text-transform:uppercase;
  transition:color .3s; position:relative;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0;
  width:0; height:1px; background:var(--rouge-vif); transition:width .3s;
}
.nav-links a:hover, .nav-links a.active { color:var(--blanc); }
.nav-links a:hover::after, .nav-links a.active::after { width:100%; }
.nav-cta {
  background:var(--rouge-vif) !important; color:white !important;
  padding:10px 24px; border-radius:2px;
  transition:background .3s, transform .2s !important;
}
.nav-cta::after { display:none !important; }
.nav-cta:hover { background:var(--rouge) !important; transform:translateY(-1px); }
.nav-toggle {
  display:none; flex-direction:column; gap:5px; cursor:pointer; padding:8px;
}
.nav-toggle span { display:block; width:24px; height:2px; background:white; border-radius:2px; transition:all .3s; }

/* Mobile nav drawer */
.mobile-menu {
  display:none; position:fixed; top:84px; left:0; right:0; z-index:999;
  background:rgba(5,0,0,0.97); border-bottom:1px solid rgba(139,0,0,.3);
  padding:20px 30px 30px; flex-direction:column; gap:18px;
}
.mobile-menu.open { display:flex; }
.mobile-menu a {
  color:rgba(255,255,255,.7); text-decoration:none;
  font-size:18px; font-weight:600; letter-spacing:2px; text-transform:uppercase;
  padding:8px 0; border-bottom:1px solid rgba(255,255,255,.05);
  transition:color .3s;
}
.mobile-menu a:hover { color:var(--rouge-vif); }

/* ── PAGE HERO (inner pages) ── */
.page-hero {
  min-height:380px;
  display:flex; align-items:flex-end;
  padding:122px 60px 60px;
  position:relative; overflow:hidden;
}
.page-hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  filter:brightness(.25) saturate(.8);
  /* Agrandi : laisse de la marge pour le deplacement parallax
     (js/parallax.js, +/-65px) sans jamais laisser voir un bord vide.
     scale(1.4) sur le plus petit .page-hero (380px) donne 76px de marge
     de chaque cote, toujours superieure au deplacement max. */
  transform:scale(1.4);
  will-change:transform;
}
.page-hero-overlay {
  position:absolute; inset:0;
  /* Deuxieme plan du parallax (js/parallax.js) : bouge moins que la photo,
     pour une impression de profondeur entre les deux. scale(1.15) sur le
     plus petit .page-hero (380px) donne 28.5px de marge, superieure au
     deplacement max de ce calque (25px). */
  transform:scale(1.15);
  will-change:transform;
  background: linear-gradient(to right, rgba(5,0,0,.9) 40%, rgba(139,0,0,.2) 100%);
}
.page-hero-content { position:relative; z-index:2; }
.page-eyebrow {
  font-size:15px; font-weight:700; letter-spacing:4px; text-transform:uppercase;
  color:var(--rouge-vif); display:flex; align-items:center; gap:12px; margin-bottom:14px;
}
.page-eyebrow::before { content:''; width:28px; height:1px; background:var(--rouge-vif); }
.page-title {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(38px,5vw,64px); font-weight:300; line-height:1.05;
}
.page-title strong { font-weight:700; }
.breadcrumb {
  margin-top:16px; display:flex; align-items:center; gap:8px;
  font-size:15px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase;
  color:rgba(255,255,255,.35);
}
.breadcrumb a { color:rgba(255,255,255,.35); text-decoration:none; transition:color .3s; }
.breadcrumb a:hover { color:rgba(255,255,255,.6); }
.breadcrumb span { color:var(--rouge-vif); }

/* ── SECTION BASE ── */
section { position:relative; }
.section-inner { max-width:1200px; margin:0 auto; padding:0 60px; }
.section-pad { padding:100px 0; }
.section-pad-sm { padding:70px 0; }

.eyebrow {
  font-size:15px; font-weight:700; letter-spacing:4px; text-transform:uppercase;
  color:var(--rouge-vif); display:flex; align-items:center; gap:12px; margin-bottom:18px;
}
.eyebrow::before { content:''; width:28px; height:1px; background:var(--rouge-vif); }
.eyebrow.center { justify-content:center; }
.eyebrow.center::before { display:none; }

.h2 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(34px,3.5vw,52px); font-weight:300; line-height:1.1;
}
.h2 strong { font-weight:700; }
.h2.dark { color:var(--noir); }
.lead {
  font-size:20px; line-height:1.8; color:rgba(255,255,255,.5); max-width:540px; margin-top:14px;
}
.lead.dark { color:rgba(0,0,0,.5); }

/* ── BUTTONS ── */
.btn {
  display:inline-block; text-decoration:none; border-radius:2px;
  font-size:15px; font-weight:700; letter-spacing:3px; text-transform:uppercase;
  transition:all .3s; cursor:pointer;
}
.btn-red {
  background:var(--rouge-vif); color:white; padding:16px 40px;
  box-shadow:0 8px 28px rgba(192,0,26,.3);
}
.btn-red:hover { background:var(--rouge); transform:translateY(-2px); box-shadow:0 12px 38px rgba(192,0,26,.45); }
.btn-outline {
  border:1px solid rgba(255,255,255,.2); color:rgba(255,255,255,.7); padding:14px 36px;
}
.btn-outline:hover { border-color:rgba(255,255,255,.5); color:white; transform:translateY(-2px); }
.btn-outline-dark {
  border:1px solid rgba(0,0,0,.2); color:rgba(0,0,0,.6); padding:14px 36px;
}
.btn-outline-dark:hover { border-color:var(--rouge-vif); color:var(--rouge-vif); transform:translateY(-2px); }

/* ── REVEAL ── */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.d1 { transition-delay:.1s; }
.d2 { transition-delay:.2s; }
.d3 { transition-delay:.3s; }
.d4 { transition-delay:.4s; }

/* ── SCROLL TO TOP ── */
#scrollTop {
  position:fixed; bottom:100px; right:28px;
  width:44px; height:44px;
  background:var(--rouge-vif); border:none; border-radius:2px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  opacity:0; transform:translateY(10px);
  transition:all .3s; z-index:998;
  box-shadow:0 6px 24px rgba(192,0,26,.4);
}
#scrollTop.visible { opacity:1; transform:translateY(0); }
#scrollTop:hover { background:var(--rouge); transform:translateY(-2px); }
#scrollTop svg { width:18px; height:18px; fill:none; stroke:white; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }

/* ── WHATSAPP FLOAT ── */
#wa-btn {
  position:fixed; bottom:36px; right:28px; z-index:998;
  width:54px; height:54px; border-radius:50%;
  background:#25D366; display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 28px rgba(37,211,102,.4);
  text-decoration:none; transition:all .3s;
  animation: waPulse 3s infinite;
}
#wa-btn:hover { transform:scale(1.1); box-shadow:0 10px 36px rgba(37,211,102,.5); }
#wa-btn svg { width:28px; height:28px; fill:white; }
@keyframes waPulse {
  0%,100% { box-shadow:0 6px 28px rgba(37,211,102,.4); }
  50% { box-shadow:0 6px 36px rgba(37,211,102,.65); }
}

/* ── FOOTER ── */
footer {
  background:var(--noir);
  border-top:1px solid rgba(139,0,0,.2);
}
.footer-main {
  max-width:1200px; margin:0 auto; padding:60px 60px 40px;
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:50px;
}
.footer-brand-col .logo { display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.footer-icon {
  width:46px; height:46px;
  background:linear-gradient(135deg,var(--rouge-vif),var(--rouge));
  border-radius:8px; display:flex; align-items:center; justify-content:center;
  font-family:'Cormorant Garamond',serif; font-size:17px; font-weight:700; color:white;
}
.footer-name { font-size:19px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:white; display:block; }
.footer-slogan { font-size:15px; color:rgba(255,255,255,.3); letter-spacing:2px; font-style:italic; margin-top:2px; display:block; }
.footer-desc { font-size:17px; line-height:1.8; color:rgba(255,255,255,.35); }
.footer-col h4 {
  font-size:15px; font-weight:700; letter-spacing:3px; text-transform:uppercase;
  color:var(--rouge-vif); margin-bottom:20px;
}
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.footer-col ul li a {
  font-size:17px; font-weight:500; color:rgba(255,255,255,.4);
  text-decoration:none; transition:color .3s;
}
.footer-col ul li a:hover { color:rgba(255,255,255,.75); }
.footer-col .info-item { display:flex; align-items:flex-start; gap:10px; margin-bottom:12px; }
.footer-col .info-icon { font-size:16px; margin-top:2px; flex-shrink:0; }
.footer-col .info-text { font-size:16px; color:rgba(255,255,255,.4); line-height:1.55; }
.footer-bottom {
  border-top:1px solid rgba(255,255,255,.05);
  padding:22px 60px;
  max-width:1200px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.footer-copy { font-size:15px; color:rgba(255,255,255,.2); }
.footer-tags { display:flex; gap:10px; }
.footer-tag {
  padding:4px 12px; border:1px solid rgba(255,255,255,.07); border-radius:2px;
  font-size:15px; font-weight:700; letter-spacing:2px; text-transform:uppercase;
  color:rgba(255,255,255,.2);
}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  nav { padding:0 30px; }
  .nav-links { gap:22px; }
  .section-inner { padding:0 30px; }
  .page-hero { padding:122px 30px 50px; }
  .footer-main { grid-template-columns:1fr 1fr; gap:36px; padding:50px 30px 36px; }
  .footer-bottom { padding:18px 30px; }
}
@media(max-width:768px){
  .nav-links { display:none; }
  .nav-toggle { display:flex; }
  .section-pad { padding:70px 0; }
  .footer-main { grid-template-columns:1fr; gap:28px; }
}

/* ── LOGO IMAGE ── */
.nav-logo-img {
  height: 60px;
  width: auto;
  display: block;
  object-fit: contain;
  filter: brightness(1.05);
}
nav.scrolled .nav-logo-img {
  height: 48px;
}
.footer-logo-img {
  height: 56px;
  width: auto;
  display: block;
  object-fit: contain;
  filter: brightness(1.05);
  margin-bottom: 14px;
}

/* ── CATALOGUE DE VEHICULES ── */
.catalogue-filtres {
  display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-bottom:48px;
}
.catalogue-filtres button {
  font-family:'Rajdhani',sans-serif; font-size:15px; font-weight:700;
  letter-spacing:2px; text-transform:uppercase;
  padding:11px 24px; border-radius:2px; cursor:pointer;
  border:1px solid rgba(139,0,0,.25); background:transparent; color:rgba(0,0,0,.55);
  transition:all .25s;
}
.catalogue-filtres button:hover { border-color:var(--rouge-vif); color:var(--rouge-vif); }
.catalogue-filtres button[aria-pressed="true"] {
  background:var(--rouge-vif); border-color:var(--rouge-vif); color:white;
}
.catalogue-filtres button:focus-visible { outline:2px solid var(--rouge-vif); outline-offset:3px; }

.catalogue-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
@media(max-width:1024px){ .catalogue-grid { grid-template-columns:repeat(2,1fr); gap:24px; } }
@media(max-width:768px){ .catalogue-grid { grid-template-columns:1fr; } }

.vcard {
  background:white; border:1px solid rgba(0,0,0,.07); border-radius:4px;
  overflow:hidden; display:flex; flex-direction:column;
  box-shadow:0 10px 34px rgba(0,0,0,.06); transition:transform .3s, box-shadow .3s;
}
.vcard:hover { transform:translateY(-4px); box-shadow:0 18px 48px rgba(0,0,0,.11); }
.vcard-media { position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--noir); }
.vcard-media img { width:100%; height:100%; object-fit:cover; display:block; }
.vcard-badge {
  position:absolute; top:14px; left:14px; padding:6px 14px; border-radius:2px;
  font-size:15px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:white;
}
.vcard-badge.loue  { background:rgba(0,0,0,.72); }
.vcard-badge.vendu { background:var(--rouge); }

.vcard-corps { padding:24px 26px 26px; display:flex; flex-direction:column; gap:12px; flex:1; }
.vcard-cat {
  font-size:15px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase;
  color:var(--rouge-vif);
}
.vcard-nom { font-family:'Cormorant Garamond',serif; font-size:26px; font-weight:700; line-height:1.15; }
.vcard-desc { font-size:16px; line-height:1.6; color:rgba(0,0,0,.55); }
.vcard-prix {
  font-family:'Cormorant Garamond',serif; font-size:28px; font-weight:700; color:var(--rouge-vif);
  font-variant-numeric:tabular-nums;
}
.vcard-devis { font-size:15px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:rgba(0,0,0,.4); }
.vcard-unite { font-family:'Rajdhani',sans-serif; font-size:15px; font-weight:600; color:rgba(0,0,0,.45); margin-left:4px; }
.vcard-specs {
  display:flex; flex-wrap:wrap; gap:8px 18px; padding-top:14px;
  border-top:1px solid rgba(0,0,0,.07); font-size:15px; color:rgba(0,0,0,.5);
}
.vcard-specs span { display:inline-flex; align-items:center; gap:6px; }
.vcard .btn { margin-top:auto; text-align:center; }
.vcard .btn[disabled], .vcard .btn[aria-disabled="true"] {
  opacity:.45; pointer-events:none;
}

.catalogue-etat { text-align:center; padding:80px 20px; color:rgba(0,0,0,.5); font-size:18px; }
.catalogue-etat strong { display:block; font-family:'Cormorant Garamond',serif; font-size:28px; color:var(--noir); margin-bottom:10px; }

.squelette { background:white; border:1px solid rgba(0,0,0,.07); border-radius:4px; overflow:hidden; }
.squelette .barre { background:linear-gradient(90deg,#EFEFEF 25%,#F7F7F7 50%,#EFEFEF 75%); background-size:200% 100%; animation:chargement 1.4s infinite; }
.squelette .barre.media { aspect-ratio:16/10; }
.squelette .barre.ligne { height:16px; margin:18px 26px; border-radius:2px; }
.squelette .barre.ligne.courte { width:45%; }
@keyframes chargement { from{background-position:200% 0;} to{background-position:-200% 0;} }
@media(prefers-reduced-motion:reduce){ .squelette .barre { animation:none; } }

/* ── GALERIE ── */
.galerie {
  position:fixed; inset:0; z-index:2000; display:none;
  background:rgba(5,0,0,.94); padding:40px 20px;
  flex-direction:column; align-items:center; justify-content:center; gap:20px;
}
.galerie.ouverte { display:flex; }
.galerie-image { max-width:min(1100px,92vw); max-height:70vh; object-fit:contain; border-radius:4px; }
.galerie-vignettes { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.galerie-vignettes img {
  width:84px; height:56px; object-fit:cover; border-radius:2px; cursor:pointer;
  opacity:.45; border:2px solid transparent; transition:opacity .2s, border-color .2s;
}
.galerie-vignettes img[aria-current="true"] { opacity:1; border-color:var(--rouge-vif); }
.galerie-titre { color:white; font-family:'Cormorant Garamond',serif; font-size:26px; }
.galerie-fermer {
  position:absolute; top:22px; right:26px; background:none; border:0; cursor:pointer;
  color:rgba(255,255,255,.75); font-size:34px; line-height:1; padding:8px;
}
.galerie-fermer:hover { color:white; }
.galerie-fermer:focus-visible { outline:2px solid var(--rouge-vif); outline-offset:2px; }
@media(max-width:768px){ .galerie-image { max-height:52vh; } }

.vcard-photos {
  position:absolute; bottom:12px; right:12px; padding:8px 16px; border:0; border-radius:2px;
  background:rgba(0,0,0,.68); color:white; cursor:pointer;
  font-family:'Rajdhani',sans-serif; font-size:15px; font-weight:700;
  letter-spacing:1.5px; text-transform:uppercase; transition:background .25s;
}
.vcard-photos:hover { background:var(--rouge-vif); }
.vcard-photos:focus-visible { outline:2px solid white; outline-offset:2px; }

/* ── MODALE DE DEMANDE ── */
.modale { position:fixed; inset:0; z-index:1900; display:none; background:rgba(5,0,0,.86); overflow-y:auto; padding:40px 20px; }
.modale.ouverte { display:block; }
.modale-boite { background:white; max-width:640px; margin:0 auto; border-radius:4px; padding:38px 40px 34px; }
.modale-titre { font-family:'Cormorant Garamond',serif; font-size:30px; font-weight:700; margin-bottom:6px; }
.modale-vehicule { font-size:16px; color:var(--rouge-vif); font-weight:600; margin-bottom:26px; }
.champ { display:flex; flex-direction:column; gap:6px; margin-bottom:18px; }
.champ label { font-size:15px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:rgba(0,0,0,.5); }
.champ input, .champ textarea, .champ select {
  font-family:'Rajdhani',sans-serif; font-size:17px; padding:12px 14px;
  border:1px solid rgba(0,0,0,.18); border-radius:2px; background:white; color:var(--noir);
}
.champ input:focus, .champ textarea:focus { outline:2px solid var(--rouge-vif); outline-offset:0; border-color:transparent; }
.champ .erreur { font-size:15px; color:var(--rouge-vif); }
.champ-duo { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media(max-width:768px){ .champ-duo { grid-template-columns:1fr; gap:0; } .modale-boite { padding:28px 22px; } }
.champ-case { flex-direction:row; align-items:center; gap:10px; }
.champ-case label { text-transform:none; letter-spacing:0; font-size:16px; color:var(--noir); }
.modale-actions { display:flex; gap:14px; flex-wrap:wrap; margin-top:26px; }
.modale-confirmation { text-align:center; padding:20px 0; }
.modale-reference {
  font-family:'Cormorant Garamond',serif; font-size:34px; font-weight:700;
  color:var(--rouge-vif); letter-spacing:2px; margin:16px 0 8px;
}