/* WAF Forme V2 — Conversion (2.9.0) : bandeau d'accueil + 3 étapes */
.wcv-hero {
  position: relative; overflow: hidden; isolation: isolate;
  min-height: clamp(560px, calc(100svh - var(--waf-header-h, 168px)), 860px);
  display: flex; align-items: flex-end; background: var(--waf-dark); color: #ffffff;
}
.wcv-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; animation: wcv-zoom 14s ease-out both; }
@keyframes wcv-zoom { from { transform: scale(1.08); } to { transform: scale(1); } }
.wcv-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(13,11,11,.55) 0%, rgba(13,11,11,.15) 35%, rgba(13,11,11,.6) 70%, rgba(13,11,11,.95) 100%); }
.wcv-hero:not(.has-media) .wcv-shade { background: radial-gradient(120% 90% at 80% 0%, rgba(232,77,112,.35), transparent 60%), radial-gradient(90% 70% at 0% 100%, rgba(232,77,112,.18), transparent 60%); }
.wcv-in { width: 100%; max-width: calc(1440px + 2 * var(--wh-pad, 48px)); margin: 0 auto; box-sizing: border-box; padding: 96px var(--wh-pad, 48px) 56px; display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }
.wcv-in > * { animation: wcv-up .8s cubic-bezier(.2,.7,.2,1) both; }
.wcv-in > :nth-child(2) { animation-delay: .08s; } .wcv-in > :nth-child(3) { animation-delay: .16s; }
.wcv-in > :nth-child(4) { animation-delay: .24s; } .wcv-in > :nth-child(n+5) { animation-delay: .32s; }
@keyframes wcv-up { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.wcv-eyebrow { font-family: var(--waf-font-display); font-weight: 700; font-size: 13px; letter-spacing: .24em; text-transform: uppercase; color: var(--waf-rose-light, #f09ab0); }
.wcv-title { margin: 0; font-family: var(--waf-font-display); font-weight: 900; font-size: clamp(48px, 6.6vw, 108px); line-height: .88; letter-spacing: -.05em; text-transform: uppercase; color: #ffffff; max-width: 1100px; }
.wcv-title span { display: block; color: var(--waf-rose); }
.wcv-text { margin: 0; max-width: 560px; font-size: clamp(16px, 1.3vw, 19px); line-height: 1.6; color: #e8ddd8; }
.wcv-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.wcv-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 58px; padding: 0 30px; border-radius: 9999px; font-family: var(--waf-font-display); font-weight: 800; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; transition: transform .25s ease, background-color .25s ease, color .25s ease, box-shadow .25s ease; }
.wcv-btn--main { background: var(--waf-rose); color: var(--waf-dark) !important; box-shadow: 0 12px 32px rgba(232,77,112,.35); }
.wcv-btn--main:hover { transform: translateY(-2px); background: #ffffff; box-shadow: 0 16px 40px rgba(232,77,112,.45); }
.wcv-btn--ghost { border: 1.5px solid rgba(255,255,255,.5); color: #ffffff !important; }
.wcv-btn--ghost:hover { border-color: #ffffff; background: rgba(255,255,255,.08); }
.wcv-btn--main { animation: wcv-pulse 2.8s ease-in-out 2s 3; }
@keyframes wcv-pulse { 50% { box-shadow: 0 12px 32px rgba(232,77,112,.35), 0 0 0 10px rgba(232,77,112,.15); } }
.wcv-rassure { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 13px; color: #e8ddd8; }
.wcv-rassure li { display: inline-flex; align-items: center; gap: 8px; }
.wcv-rassure li::before { content: "✓"; color: var(--waf-rose); font-weight: 700; }
.wcv-proof { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 14px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.14); width: 100%; }
.wcv-rating { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: #e8ddd8; }
.wcv-rating b { color: #ffffff; font-weight: 600; }
.wcv-stars { color: #ffc83d; letter-spacing: .08em; }
.wcv-next { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 9999px; background: rgba(255,255,255,.1); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #e8ddd8 !important; font-size: 13px; text-decoration: none; }
.wcv-next:hover { background: rgba(255,255,255,.18); }
.wcv-next b { color: #ffffff; font-weight: 600; }
.wcv-next[hidden] { display: none; }
.wcv-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--waf-rose); box-shadow: 0 0 0 0 rgba(232,77,112,.6); animation: wcv-ping 2s ease-out infinite; }
@keyframes wcv-ping { 70%, 100% { box-shadow: 0 0 0 8px rgba(232,77,112,0); } }

/* 3 étapes */
.wcv-steps { background: var(--waf-rose); color: var(--waf-dark); }
.wcv-steps-in { max-width: calc(1440px + 2 * var(--wh-pad, 48px)); margin: 0 auto; box-sizing: border-box; padding: 28px var(--wh-pad, 48px); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 40px; }
.wcv-steps-h { margin: 0; font-family: var(--waf-font-display); font-weight: 900; font-size: 26px; line-height: .95; text-transform: uppercase; letter-spacing: -.03em; }
.wcv-steps-h span { display: block; color: #ffffff; }
.wcv-steps ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.wcv-steps li { display: flex; gap: 14px; align-items: flex-start; }
.wcv-steps li b { font-family: var(--waf-font-display); font-weight: 900; font-size: 30px; line-height: 1; color: #ffffff; }
.wcv-steps li span { font-size: 13px; line-height: 1.45; }
.wcv-steps li strong { display: block; font-family: var(--waf-font-display); font-weight: 800; font-size: 15px; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 2px; }
.wcv-steps .wcv-btn--main { background: var(--waf-dark); color: #ffffff !important; box-shadow: none; animation: none; min-height: 52px; }
.wcv-steps .wcv-btn--main:hover { background: #ffffff; color: var(--waf-dark) !important; }

@media (max-width: 1024px) {
  .wcv-steps-in { grid-template-columns: 1fr; gap: 20px; }
  .wcv-steps .wcv-btn { justify-self: start; }
}
@media (max-width: 767px) {
  .wcv-hero { min-height: calc(100svh - var(--waf-header-h, 98px) - 64px); }
  .wcv-in { padding: 72px 20px 32px; gap: 18px; }
  .wcv-ctas { width: 100%; }
  .wcv-btn { width: 100%; padding: 0 20px; }
  .wcv-rassure { font-size: 12px; gap: 6px 14px; }
  .wcv-steps-in { padding: 26px 20px; }
  .wcv-steps ol { grid-template-columns: 1fr; gap: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .wcv-media, .wcv-in > *, .wcv-btn--main, .wcv-dot { animation: none !important; }
}
