.hero {
  background-image: linear-gradient(90deg, #031118f7 0%, #031118e8 40%, #03111870 74%), url('realisation-interieur-sans-escabeau.png');
}
.header { height: 112px; }
.header .brand { width: 152px; height: 108px; }
.header nav { gap: 42px; }
.header nav a { font-size: 17px; font-weight: 800; }
.header .btn-small { font-size: 13px; padding: 14px 20px; }
.footer-grid img { width: 155px; height: 150px; }

.brands-section {
  padding: 90px 0;
  background: #e9edef;
}
.brands-intro {
  max-width: 720px;
  color: var(--muted);
  font-size: 18px;
}
.brand-groups {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 38px;
}
.brand-groups article {
  background: #fff;
  border-top: 4px solid var(--blue);
  padding: 34px;
}
.brand-groups small {
  color: #1296cd;
  text-transform: uppercase;
  letter-spacing: .13em;
  font-weight: 800;
}
.brand-groups h3 {
  font-size: 25px;
  margin: 18px 0 10px;
}
.brand-groups p,
.brand-note { color: var(--muted); }
.brand-note {
  font-size: 12px;
  margin-top: 20px;
}
.charger-hero {
  min-height: 620px;
  background-image: linear-gradient(90deg, #031118f7 0%, #031118df 42%, #03111855 78%), url('borne-blitz-murale.jpeg');
  background-position: center;
  background-size: cover;
}
.charger-cards { grid-template-columns: repeat(2, 1fr); }
.charger-gallery {
  display: grid;
  grid-template-columns: 1.35fr .65fr;
  gap: 18px;
  margin-top: 55px;
}
.charger-gallery figure {
  position: relative;
  min-height: 520px;
  margin: 0;
  overflow: hidden;
  background: var(--ink);
}
.charger-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.charger-gallery figure:first-child img { object-position: center 48%; }
.charger-gallery figure:last-child img { object-position: center 43%; }
.gallery figure { cursor: zoom-in; }
.gallery figure:focus-visible { outline: 4px solid var(--blue); outline-offset: 3px; }
.auto-gallery {
  display: flex;
  gap: 16px;
  overflow: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.auto-gallery::-webkit-scrollbar { display: none; }
.auto-gallery figure {
  flex: 0 0 calc((100% - 32px) / 3);
  height: 410px;
  cursor: default;
  scroll-snap-align: start;
}
.carousel-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-top: 24px;
}
.carousel-controls button {
  width: 48px;
  height: 48px;
  border: 0;
  background: var(--ink);
  color: #fff;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
}
.carousel-controls button:hover { background: var(--blue); color: var(--ink); }
.carousel-status { min-width: 92px; text-align: center; color: var(--muted); font-size: 13px; font-weight: 800; }
.gallery-cta { display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-top: 38px; padding: 28px 32px; background: #fff; border-left: 4px solid var(--blue); }
.gallery-cta p { margin: 0; font-size: 19px; font-weight: 800; }
.conversion-strip { padding: 44px 0; background: var(--ink2); color: #fff; }
.conversion-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.conversion-grid div { padding-left: 18px; border-left: 3px solid var(--blue); }
.conversion-grid strong,.conversion-grid span { display: block; }
.conversion-grid span { margin-top: 5px; color: #c5d0d5; font-size: 13px; }
.whatsapp-float { position: fixed; z-index: 45; right: 22px; bottom: 22px; padding: 14px 19px; background: #25d366; color: #062015; font-weight: 800; box-shadow: 0 8px 28px #0004; }
body.lightbox-open { overflow: hidden; }
.lightbox {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 70px 90px;
  background: #020a0eeF;
}
.lightbox.open { display: flex; }
.lightbox figure {
  position: relative;
  width: min(1100px, 100%);
  height: min(78vh, 760px);
  margin: 0;
}
.lightbox img { width: 100%; height: 100%; object-fit: contain; }
.lightbox figcaption {
  background: linear-gradient(transparent, #031118ef);
  text-align: center;
  pointer-events: none;
}
.lightbox button {
  position: absolute;
  z-index: 2;
  border: 0;
  color: #fff;
  background: #071922c9;
  cursor: pointer;
}
.lightbox-close { top: 20px; right: 25px; width: 52px; height: 52px; font-size: 38px; line-height: 1; }
.lightbox-prev,.lightbox-next { top: 50%; width: 58px; height: 72px; margin-top: -36px; font-size: 50px; }
.lightbox-prev { left: 20px; }
.lightbox-next { right: 20px; }
.lightbox-count { position: absolute; bottom: 22px; right: 28px; color: #fff; font-weight: 800; }
@media (max-width: 800px) {
  .header { height: 80px; }
  .header .brand { width: 105px; height: 78px; }
  .header nav { top: 80px; }
  .header nav a { font-size: 17px; }
  .brand-groups { grid-template-columns: 1fr; }
  .brands-section { padding: 65px 0; }
  .charger-hero { min-height: 700px; background-position: 58% center; }
  .charger-cards,
  .charger-gallery { grid-template-columns: 1fr; }
  .charger-gallery figure { min-height: 390px; }
  .charger-gallery figure:last-child { min-height: 520px; }
  .auto-gallery figure { flex-basis: 100%; height: 430px; }
  .gallery-cta { align-items: stretch; flex-direction: column; padding: 24px; }
  .conversion-grid { grid-template-columns: 1fr 1fr; }
  .whatsapp-float { display: none; }
  .lightbox { padding: 65px 12px 85px; }
  .lightbox figure { height: 72vh; }
  .lightbox-prev,.lightbox-next { top: auto; bottom: 15px; width: 70px; height: 55px; margin: 0; }
  .lightbox-prev { left: calc(50% - 78px); }
  .lightbox-next { right: calc(50% - 78px); }
  .lightbox-count { right: 18px; bottom: 31px; }
}