/* ── Liste d'attente du lancement QR-cadre (page d'accueil FR/EN/IT) ──────
   Version minimaliste : un titre, une phrase, un champ, trois repères, et
   une ligne RGPD en tout petit. Cible : future mariée 29-39 ans — sobre,
   émotion avant technique, aucun effet « promo ».
   Les inscriptions partent vers l'API newsletter avec l'origine
   « Liste d'attente QR-cadre » : dans Finance Pro, filtre Origine.
   ────────────────────────────────────────────────────────────────────── */

.launch-waitlist {
    --lw-brand: #6661fc;
    --lw-brand-2: #a259ff;
    --lw-ink: #1e1b3a;
    --lw-muted: #6b6886;
    width: min(640px, 100%);
    margin: 56px auto 24px;
    text-align: center;
}

.launch-waitlist__card {
    padding: clamp(28px, 5vw, 44px) clamp(20px, 5vw, 48px);
    border: 1px solid rgba(102, 97, 252, 0.14);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 24px 60px -45px rgba(76, 60, 180, 0.5);
}

#liste-attente-qr-cadre h3 {
    margin: 0 0 16px;
    color: var(--lw-ink);
    font-size: clamp(1.5rem, 3.2vw, 2rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.02em;
    text-wrap: balance;
}
#liste-attente-qr-cadre h3 em {
    font-style: normal;
    background: linear-gradient(90deg, var(--lw-brand), var(--lw-brand-2));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* Le site stylise les <p> et <a> via #texte-content : l'identifiant du bloc reprend la main. */
#liste-attente-qr-cadre .launch-waitlist__lead {
    margin: 0 auto 22px;
    max-width: 42ch;
    color: var(--lw-muted);
    font-size: 1rem;
    line-height: 1.55;
    text-align: center;
    text-indent: 0;
}

.launch-waitlist__form {
    display: flex;
    gap: 6px;
    max-width: 460px;
    margin: 0 auto;
    padding: 5px;
    border: 1px solid rgba(102, 97, 252, 0.22);
    border-radius: 999px;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.launch-waitlist__form:focus-within {
    border-color: var(--lw-brand);
    box-shadow: 0 0 0 4px rgba(102, 97, 252, 0.12);
}
.launch-waitlist__form input[type="email"] {
    flex: 1;
    min-width: 0;
    padding: 0 16px;
    border: 0;
    background: transparent;
    color: var(--lw-ink);
    font: inherit;
    font-size: 0.98rem;
    outline: none;
}
.launch-waitlist__form input[type="email"]::placeholder { color: #9a97b3; }
.launch-waitlist__form button {
    flex: none;
    padding: 12px 22px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--lw-brand), var(--lw-brand-2));
    color: #fff;
    font: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    transition: filter 0.15s ease, transform 0.15s ease;
}
.launch-waitlist__form button:hover { filter: brightness(1.06); }
.launch-waitlist__form button:active { transform: scale(0.98); }
.launch-waitlist__form button:disabled { opacity: 0.7; cursor: wait; }

#liste-attente-qr-cadre .form-status { min-height: 1.2em; margin: 8px 0 0; font-size: 0.88rem; font-weight: 600; }

/* Trois repères sous le titre : apparition en cascade à l'entrée à l'écran
   (fondu qui monte, coche qui se dessine, reflet unique sur « bientôt »).
   Aucune boucle : l'élégance avant l'effet. La classe .is-inview est posée
   par launch-waitlist.js. */
.launch-waitlist__perks {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 4px 0 24px;
    padding: 0;
    list-style: none;
}
.launch-waitlist__perks li {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 14px 7px 10px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(102, 97, 252, 0.08);
    color: var(--lw-ink);
    font-size: 0.86rem;
    font-weight: 600;
    opacity: 0;
    transform: translateY(10px);
    filter: blur(4px);
    transition:
        opacity 0.7s ease calc(0.25s + var(--i) * 0.22s),
        transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) calc(0.25s + var(--i) * 0.22s),
        filter 0.7s ease calc(0.25s + var(--i) * 0.22s);
}
.launch-waitlist__perks svg { flex: none; width: 16px; height: 16px; }
.launch-waitlist__perks svg path {
    fill: none;
    stroke: var(--lw-brand);
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    transition: stroke-dashoffset 0.55s ease calc(0.65s + var(--i) * 0.22s);
}
/* « Ça arrive bientôt » : teinte dégradée et un seul reflet qui passe */
.launch-waitlist__perks li.is-soon {
    background: linear-gradient(90deg, rgba(102, 97, 252, 0.14), rgba(162, 89, 255, 0.16));
    color: #4b3fd8;
}
.launch-waitlist__perks li.is-soon::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, 0.85) 50%, transparent 70%);
    transform: translateX(-120%);
}
.launch-waitlist.is-inview .launch-waitlist__perks li { opacity: 1; transform: none; filter: none; }
.launch-waitlist.is-inview .launch-waitlist__perks svg path { stroke-dashoffset: 0; }
.launch-waitlist.is-inview .launch-waitlist__perks li.is-soon::after {
    animation: lw-sheen 1.1s ease-out 1.5s 1 forwards;
}
@keyframes lw-sheen { to { transform: translateX(120%); } }

@media (prefers-reduced-motion: reduce) {
    .launch-waitlist__perks li { opacity: 1; transform: none; filter: none; transition: none; }
    .launch-waitlist__perks svg path { stroke-dashoffset: 0; transition: none; }
    .launch-waitlist__perks li.is-soon::after { display: none; }
}

#liste-attente-qr-cadre .launch-waitlist__legal {
    margin: 14px 0 0;
    color: #a3a0b8;
    font-size: 0.68rem;
    line-height: 1.4;
    text-align: center;
    text-indent: 0;
}
/* Les liens du site sont grands et colorés : ici, ils restent une mention discrète. */
#liste-attente-qr-cadre .launch-waitlist__legal a {
    color: inherit;
    font-size: inherit;
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.launch-waitlist .hp-field-hidden { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.launch-waitlist .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

@media (max-width: 480px) {
    .launch-waitlist { margin-top: 40px; }
    .launch-waitlist__form { flex-direction: column; border-radius: 20px; }
    .launch-waitlist__form input[type="email"] { padding: 11px 14px; text-align: center; }
    .launch-waitlist__form button { width: 100%; }
}