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

html, body {
  width:100%; height:100%;
  overflow:hidden;
  background:#111;
  font-family:'Inter-Medium', sans-serif;
  touch-action:pan-x;
}

/* ── SLIDESHOW ── */
.slideshow { position:relative; width:100%; height:100%; }

.slide {
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity 1.1s ease;
  pointer-events:none;
}
.slide.active { opacity:1; pointer-events:auto; }

.placeholder {
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; letter-spacing:0.1em;
  text-transform:uppercase; color:rgba(255,255,255,0.12);
}

/* ── OVERLAY ── */
.overlay {
  position:absolute; inset:0;
  background: linear-gradient(
    to right,
    rgba(0,0,0,0.82) 0%,
    rgba(0,0,0,0.50) 50%,
    rgba(0,0,0,0.15) 100%
  );
}

/* ── BADGE ARCHITECTE ── */
.badge {
  position:absolute;
  top:28px; left:36px;
  display:flex; flex-direction:column; gap:3px;
}
.badge-label {
  font-family:'Inter-light', sans-serif;
  font-size:10px;
  letter-spacing:0.20em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.45);
}
.badge-name {
  font-family:'Inter-Bold', sans-serif;
  font-size:20px;
  color:#fff;
  letter-spacing:0.04em;
  text-transform:uppercase;
  line-height:1;
}
.badge-spec {
  font-family:'Inter-light', sans-serif;
  font-size:11px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.50);
  margin-top:1px;
}

/* ── CONTENU PRINCIPAL ── */
.content {
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding: 0 7% 70px;
  max-width:66%;
}

.tag {
  font-family:'Inter-light', sans-serif;
  font-size:11px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.40);
  margin-bottom:16px;
}

.headline {
  font-family:'Inter-Bold', sans-serif;
  font-size:clamp(40px, 7vw, 82px);
  color:#fff;
  line-height:1.08;
  margin-bottom:22px;
  letter-spacing:-0.01em;
}

.sub {
  font-family:'Inter-light', sans-serif;
  font-size:clamp(15px, 2vw, 20px);
  color:rgba(255,255,255,0.65);
  line-height:1.6;
  max-width:480px;
}

/* ── PRIX PROMO ── */
.prix-row {
  display:flex;
  align-items:baseline;
  gap:14px;
  margin-bottom:18px;
}
.prix-new {
  font-family:'Inter-Bold', sans-serif;
  font-size:clamp(36px, 5.5vw, 64px);
  color:#fff;
  line-height:1;
}
.prix-old {
  font-family:'Inter-light', sans-serif;
  font-size:clamp(18px, 2.5vw, 28px);
  color:rgba(255,255,255,0.35);
  text-decoration:line-through;
}

/* ── BARRE PROGRESSION ── */
.progress-bar {
  position:absolute; bottom:0; left:0;
  height:3px; width:100%;
  background:rgba(255,255,255,0.12);
}
.progress-fill {
  height:100%; background:#fff; width:0%;
  transition:width linear;
}

/* ── DOTS ── */
.dots {
  position:absolute; bottom:18px; left:50%;
  transform:translateX(-50%);
  display:flex; gap:8px; align-items:center;
}
.dot {
  width:6px; height:6px; border-radius:50%;
  background:rgba(255,255,255,0.28);
  transition:all 0.3s; cursor:pointer;
}
.dot.active { background:#fff; width:22px; border-radius:3px; }