/* ===== Base ===== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: var(--gold-300); }
p { margin: 0 0 var(--space-4); }
h1, h2, h3 { margin: 0; }
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 var(--space-12); }
.measure { max-width: var(--measure); }
.center { text-align: center; margin-left: auto; margin-right: auto; }
.muted { color: var(--ink-muted); }
.small { font-size: 13px; color: var(--ink-muted); }
.gold { color: var(--gold-500); }
.section { padding: var(--space-24) 0; }
.section--surface { background: var(--bg-surface); border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); }
.section-head { margin-bottom: var(--space-12); }
.section-head .dr-overline { display: block; margin-bottom: var(--space-3); }
.h1 { font-size: 48px; }
.h2 { font-size: 32px; line-height: 1.05; }
.h3 { font-family: var(--font-display); font-weight: 800; font-size: 22px; line-height: 1.15; text-transform: uppercase; }
.lead { font-size: 20px; color: var(--ink); }
.title-gap { margin-bottom: var(--space-6); }
.cta-gap { margin-top: var(--space-8); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ===== Bandeau d'urgence (sticky) ===== */
.topbar { position: sticky; top: 0; z-index: 50; }
.topbar .dr-urgency { border-radius: 0; font-size: 14px; flex-wrap: wrap; }
.u-short { display: none; }
@media (max-width: 767px) { .u-long { display: none; } .u-short { display: inline; } .topbar .dr-urgency { flex-wrap: nowrap; } }

/* ===== Nav ===== */
.nav { display: flex; align-items: center; justify-content: space-between; padding: var(--space-6) 0; }
.logo { font-family: var(--font-display); font-weight: 900; font-size: 20px; letter-spacing: .02em; text-transform: uppercase; color: var(--gold-500); text-decoration: none; line-height: 1; }
.logo small { display: block; font-size: 11px; letter-spacing: .14em; color: var(--ink-muted); font-weight: 800; margin-top: 4px; }
.nav__link { font-family: var(--font-display); font-weight: 800; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; background: none; border: 0; cursor: pointer; }

/* ===== Placeholders photo ===== */
.photo { position: relative; border-radius: var(--radius-lg); overflow: hidden; background:
  radial-gradient(ellipse at 50% 35%, rgba(212,175,55,.28), transparent 60%), var(--bg-raised); }
.photo img { width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 1; }
.photo.is-placeholder img { display: none; }
.photo.is-placeholder { border: 2px dashed var(--gold-700); }
.photo__label { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-2);
  padding: var(--space-6); text-align: center; font-family: var(--font-display); font-weight: 800; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-500); }
.photo__label span { font-family: var(--font-body); font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--ink-muted); }
.photo:not(.is-placeholder) .photo__label { display: none; }
.ratio-4-5 { aspect-ratio: 4 / 5; }
.ratio-1-1 { aspect-ratio: 1 / 1; }
.ratio-16-9 { aspect-ratio: 16 / 9; }

/* ===== Hero plein cadre ===== */
.hero-wrap { position: relative; isolation: isolate; overflow: hidden; min-height: min(92vh, 900px); display: flex; flex-direction: column; background: var(--bg-base); }
.hero-wrap > .nav { position: relative; z-index: 2; }
.hero__bg { position: absolute; inset: 0 0 0 max(18%, calc(50% - 200px)); z-index: -1; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%;
  filter: contrast(1.12) saturate(1.05) brightness(.78); }
/* Étalonnage DA : fondu noir à gauche (texte), en haut (nav) et en bas (raccord section) + lueur dorée sur Enzo */
.hero__bg::after { content: ""; position: absolute; inset: 0; pointer-events: none; background:
  radial-gradient(ellipse 22% 38% at 48% 30%, rgba(212,175,55,.22), transparent 70%),
  linear-gradient(90deg, #0A0A0A 0%, rgba(10,10,10,.92) 16%, rgba(10,10,10,.45) 38%, rgba(10,10,10,.05) 58%, rgba(10,10,10,.35) 85%, rgba(10,10,10,.7) 100%),
  linear-gradient(180deg, rgba(10,10,10,.75) 0%, rgba(10,10,10,0) 22%, rgba(10,10,10,0) 60%, #0A0A0A 100%),
  linear-gradient(0deg, rgba(10,10,10,.35), rgba(10,10,10,.35)); }
/* Teinte : ciel tiré vers le noir/or, rouge préservé */
.hero__bg::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(140,115,35,.35) 0%, rgba(10,10,10,0) 55%); mix-blend-mode: multiply; }
.hero__bg::after { z-index: 2; }
.hero { position: relative; flex: 1; display: flex; align-items: center; padding: var(--space-8) 0 var(--space-16); }
.hero__content { max-width: 620px; }
.hero__content .dr-badge { margin-bottom: var(--space-4); }
.hero__overline { display: block; }
.hero__title { font-size: clamp(48px, 4.4vw, 72px); line-height: .95; letter-spacing: -.02em; margin: var(--space-4) 0 var(--space-6); text-shadow: none; }
.hero__sub { font-size: 20px; max-width: 34ch; margin-bottom: var(--space-8); color: #D4D4D4; }
.hero__proof { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-8); font-size: 14px; color: var(--ink-muted); }
.stars { color: var(--gold-500); letter-spacing: 2px; font-size: 18px; }

/* ===== Chiffres ===== */
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
.stat { text-align: center; padding: var(--space-8) var(--space-4); background: var(--bg-base); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); }
.stat__num { font-family: var(--font-display); font-weight: 900; font-size: 56px; line-height: 1; font-variant-numeric: tabular-nums; }
.stat__label { margin-top: var(--space-3); color: var(--ink-muted); font-size: 14px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }

/* ===== Qui est Enzo ===== */
.photo--graded { border: 2px solid var(--gold-500); box-shadow: var(--glow-gold), var(--shadow-card); }
.photo--graded img { filter: contrast(1.1) saturate(1.05) brightness(.85); }
.photo--graded::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; background:
  linear-gradient(180deg, rgba(140,115,35,.28) 0%, rgba(10,10,10,0) 35%),
  linear-gradient(0deg, rgba(10,10,10,.85) 0%, rgba(10,10,10,0) 30%),
  radial-gradient(ellipse 90% 80% at 50% 40%, transparent 55%, rgba(10,10,10,.55) 100%); }
.photo--graded .dr-badge { position: absolute; z-index: 3; left: 16px; bottom: 16px; }
.bio { display: grid; grid-template-columns: .8fr 1.2fr; gap: var(--space-12); align-items: start; }
.timeline { list-style: none; margin: var(--space-8) 0 0; padding: 0; border-left: 2px solid var(--gold-700); }
.timeline li { position: relative; padding: 0 0 var(--space-6) var(--space-6); }
.timeline li::before { content: ""; position: absolute; left: -7px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--gold-500); box-shadow: var(--glow-gold); }
.timeline strong { display: block; font-family: var(--font-display); font-weight: 900; color: var(--gold-500); font-size: 18px; }

/* ===== Parcours ===== */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6); counter-reset: step; }
.step { padding: var(--space-8) var(--space-6); background: var(--bg-surface); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); }
.step__num { font-family: var(--font-display); font-weight: 900; font-size: 40px; color: var(--gold-500); line-height: 1; margin-bottom: var(--space-4); }
.step p { color: var(--ink-muted); margin: var(--space-3) 0 0; font-size: 15px; }

/* ===== Témoignages ===== */
.testimonials { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-6); }
.tcard { background: var(--bg-base); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); }
.tcard__head { display: flex; align-items: center; gap: var(--space-3); }
.avatar { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: var(--bg-raised); border: 2px solid var(--gold-700);
  font-family: var(--font-display); font-weight: 900; color: var(--gold-500); flex: none; }
.tcard__name { font-weight: 700; line-height: 1.2; }
.tcard__meta { font-size: 13px; color: var(--ink-muted); }
.tcard__quote { margin: 0; font-size: 15px; }
.tcard__result { margin-top: auto; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--bg-raised); display: flex; justify-content: space-between; align-items: baseline; font-size: 13px; color: var(--ink-muted); }
.tcard__result b { font-family: var(--font-display); font-weight: 900; color: var(--gold-500); font-size: 22px; }

/* ===== Qualif ===== */
.qualif { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); }
.qualif__col { padding: var(--space-8); border-radius: var(--radius-lg); background: var(--bg-surface); border: 1px solid var(--border-subtle); }
.qualif__col--yes { border-color: var(--gold-700); }
.qualif ul { list-style: none; padding: 0; margin: var(--space-6) 0 0; display: grid; gap: var(--space-3); }
.qualif li { position: relative; padding-left: 28px; }
.qualif li::before { position: absolute; left: 0; top: 0; font-weight: 900; }
.qualif__col--yes li::before { content: "✓"; color: var(--gold-500); }
.qualif__col--no li::before { content: "✗"; color: var(--red-500); }

/* ===== Offre ===== */
.offer-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12); align-items: center; }
.offer-list { list-style: none; padding: 0; margin: var(--space-6) 0; display: grid; gap: var(--space-3); }
.offer-list li { display: flex; justify-content: space-between; gap: var(--space-4); padding-bottom: var(--space-3); border-bottom: 1px solid var(--border-subtle); }
.offer-list li span:last-child { color: var(--ink-muted); text-decoration: line-through; white-space: nowrap; }
.dr-offer .dr-overline { display: block; }
.offer-prices { display: flex; align-items: baseline; gap: var(--space-4); margin: var(--space-6) 0; flex-wrap: wrap; }
.offer-prices .dr-price-old { font-size: 22px; }
.offer-badges { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-8); }
.seats { margin-top: var(--space-4); text-align: center; font-size: 14px; font-weight: 700; color: var(--red-400); }
.seats__bar { height: 8px; border-radius: var(--radius-pill); background: var(--bg-base); margin-top: var(--space-2); overflow: hidden; }
.seats__bar i { display: block; height: 100%; width: 94%; background: linear-gradient(90deg, var(--red-700), var(--red-500)); }

/* ===== Avis ===== */
.rating { display: grid; grid-template-columns: auto 1fr; gap: var(--space-12); align-items: center; max-width: 820px; margin: 0 auto; }
.rating__score { text-align: center; }
.rating__score .dr-price { font-size: 72px; }
.bars { display: grid; gap: var(--space-2); }
.bar { display: grid; grid-template-columns: 36px 1fr 48px; gap: var(--space-3); align-items: center; font-size: 13px; color: var(--ink-muted); }
.bar__track { height: 10px; background: var(--bg-raised); border-radius: var(--radius-pill); overflow: hidden; }
.bar__track i { display: block; height: 100%; background: var(--gold-500); }

/* ===== FAQ ===== */
.faq { max-width: 780px; margin: 0 auto; display: grid; gap: var(--space-3); }
.faq details { background: var(--bg-surface); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); }
.faq summary { cursor: pointer; list-style: none; padding: var(--space-6); font-weight: 700; display: flex; justify-content: space-between; gap: var(--space-4); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--gold-500); font-family: var(--font-display); font-weight: 900; font-size: 22px; line-height: 1; }
.faq details[open] summary::after { content: "–"; }
.faq details p { padding: 0 var(--space-6) var(--space-6); margin: 0; color: var(--ink-muted); }

/* ===== Final ===== */
.final { text-align: center; padding: var(--space-32) 0; background: radial-gradient(ellipse 50% 60% at 50% 50%, rgba(230,57,70,.14), transparent 70%); }
.footer { padding: var(--space-12) 0 0; }
.footer__disclaimer { max-width: 780px; margin: 0 auto var(--space-8); text-align: center; font-size: 12px; color: var(--ink-muted); line-height: 1.5; }

/* ===== Toast « X vient de rejoindre » ===== */
.toast { position: fixed; right: var(--space-6); bottom: var(--space-6); z-index: 60; display: flex; align-items: center; gap: var(--space-3);
  max-width: 320px; padding: var(--space-3) var(--space-4); background: var(--bg-raised); border: 1px solid var(--gold-700); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); font-size: 14px; transform: translateY(140%); opacity: 0; transition: transform .35s ease, opacity .35s ease; }
.toast.is-visible { transform: none; opacity: 1; }
.toast .avatar { width: 36px; height: 36px; font-size: 14px; }
.toast small { display: block; color: var(--ink-muted); font-size: 12px; }

/* ===== Révélation ===== */
.dr-reveal[hidden] { display: none; }
.dr-reveal { justify-content: flex-start; }
.reveal__inner { margin: auto 0; width: 100%; max-width: 760px; display: flex; flex-direction: column; align-items: center; gap: var(--space-6); }
.reveal__video { width: 100%; aspect-ratio: 16 / 9; border-radius: var(--radius-lg); background: #000; box-shadow: var(--glow-gold); }
.reveal__title { font-size: 56px; line-height: .95; }
.reveal__title .red { color: var(--red-500); }
.clues { list-style: none; padding: 0; margin: 0; width: 100%; display: grid; gap: var(--space-3); text-align: left; }
.clues li { display: grid; grid-template-columns: 32px 1fr; gap: var(--space-3); padding: var(--space-4); background: var(--bg-surface); border: 1px solid var(--border-subtle); border-radius: var(--radius-md); }
.clues li b { display: block; color: var(--ink); }
.clues li div span { display: block; color: var(--ink-muted); font-size: 14px; }
.clues__num { font-family: var(--font-display); font-weight: 900; color: var(--red-500); font-size: 20px; line-height: 1.2; }
.reveal__actions { display: flex; gap: var(--space-4); flex-wrap: wrap; justify-content: center; align-items: center; }
.reveal__close { position: absolute; top: var(--space-4); right: var(--space-4); }
.reveal__close, .reveal__back { background: none; border: 0; color: var(--ink-muted); cursor: pointer; font: inherit; text-decoration: underline; text-underline-offset: 4px; }
.reveal__skip { display: none; }
.dr-reveal.has-video .reveal__skip { display: inline; }
body.is-locked { overflow: hidden; }

/* ===== Page légale ===== */
.legal { padding: var(--space-16) 0; }
.legal h1 { font-size: 40px; margin-bottom: var(--space-8); }
.legal h2 { font-family: var(--font-display); font-size: 20px; text-transform: uppercase; color: var(--gold-500); margin: var(--space-8) 0 var(--space-3); }
.legal .todo { color: var(--red-400); font-weight: 700; }

/* ===== Responsive ===== */
@media (max-width: 960px) {
  .bio, .offer-wrap { grid-template-columns: 1fr; }
  .steps { grid-template-columns: 1fr 1fr; }
  .testimonials { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .container { padding: 0 var(--space-4); }
  .section { padding: var(--space-16) 0; }
  .hero-wrap { min-height: 0; }
  .hero__bg { inset: 0; height: 520px; }
  .hero__bg img { object-position: 50% 18%; }
  .hero__bg::after { background:
    radial-gradient(ellipse 40% 30% at 45% 28%, rgba(212,175,55,.2), transparent 70%),
    linear-gradient(180deg, rgba(10,10,10,.7) 0%, rgba(10,10,10,.1) 25%, rgba(10,10,10,.35) 55%, #0A0A0A 100%); }
  .hero { padding: 300px 0 var(--space-16); }
  .hero__title { font-size: 44px; }
  .topbar .dr-urgency { font-size: 12px; gap: var(--space-2); padding: var(--space-2) var(--space-3); }
  .h1 { font-size: 34px; }
  .h2, .reveal__title { font-size: 26px; }
  .reveal__title { font-size: 34px; }
  .stats, .steps, .qualif { grid-template-columns: 1fr; }
  .stat__num { font-size: 44px; }
  .rating { grid-template-columns: 1fr; gap: var(--space-6); }
  .dr-cta { width: 100%; padding: var(--space-6); font-size: 19px; }
  .dr-cta--xl { font-size: 20px; padding: var(--space-6); }
  .nav .nav__link { display: none; }
  .toast { left: var(--space-4); right: var(--space-4); max-width: none; }
}

/* Titres : lignes équilibrées */
.dr-title { text-wrap: balance; }