/* ============================================================
   iCALL ASSURE — Landing pages d'acquisition (lp.css)
   Charge APRES icall.css. Reutilise les variables --ica-*.
   Objectif : page simple, rapide, sans menu, formulaire en 1er.
   ============================================================ */

/* ---------- Reset local landing ---------- */
.lp-body {
    background: var(--ica-blanc);
    overflow-x: hidden;
}
.lp-main { display: block; }


/* ============================================================
   EN-TETE EPUREE (logo + badge ORIAS, aucun menu, aucun tel)
   ============================================================ */
.lp-header {
    position: sticky;
    top: 0;
    z-index: 200;
    background: var(--ica-blanc);
    box-shadow: 0 2px 14px rgba(15, 61, 124, 0.08);
    padding: 10px 0;
}
.lp-header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.lp-logo img {
    max-height: 44px;
    width: auto;
    display: block;
}
.lp-header-right {
    display: flex;
    align-items: center;
    gap: 16px;
}
.lp-header-badge {
    font-family: "Outfit", "Inter", sans-serif;
    display: inline-flex;
    align-items: center;
    gap: 22px;
}
.lp-hb-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ica-bleu-fonce);
    white-space: nowrap;
}
.lp-hb-item i { color: var(--ica-turquoise); font-size: 14px; }

/* Tablette : on retire "Service en ligne", on garde ORIAS */
@media (max-width: 767.98px) {
    .lp-header-badge { gap: 14px; }
    .lp-hb-online { display: none; }
}
@media (max-width: 575.98px) {
    .lp-hb-item { font-size: 11.5px; }
    .lp-logo img { max-height: 38px; }
}


/* ============================================================
   HERO — degrade iCA, formulaire a droite (desktop) / en 1er (mobile)
   ============================================================ */
.lp-hero {
    position: relative;
    overflow: hidden;
    background: var(--ica-degrade);
    padding: 44px 0 60px;
}
.lp-hero .container { position: relative; z-index: 1; width: 100%; }
.lp-hero-row { position: relative; z-index: 1; }

.lp-hero-deco {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}
.lp-hero-deco-1 {
    top: -140px; left: -120px;
    width: 340px; height: 340px;
    background: radial-gradient(circle, rgba(23, 163, 152, 0.25) 0%, transparent 60%);
}
.lp-hero-deco-2 {
    bottom: -170px; right: -130px;
    width: 420px; height: 420px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.07) 0%, transparent 60%);
}

/* ---------- Argumentaire ---------- */
.lp-hero-pitch { color: var(--ica-blanc); }
.lp-h1 {
    font-family: "Outfit", "Inter", sans-serif;
    font-size: clamp(30px, 4.8vw, 52px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.8px;
    margin: 6px 0 16px;
    color: var(--ica-blanc) !important;
}
.lp-h1 span {
    color: var(--ica-turquoise-clr) !important;
    -webkit-text-fill-color: var(--ica-turquoise-clr) !important;
    font-style: italic;
    font-weight: 800;
}
.lp-accroche {
    font-size: 17px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9) !important;
    margin: 0;
    max-width: 470px;
}
.lp-atouts {
    list-style: none;
    padding: 0;
    margin: 24px 0 0;
    display: flex;
    flex-direction: column;
    gap: 13px;
}
.lp-atouts li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 15px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.92);
}
.lp-atouts li i {
    flex-shrink: 0;
    width: 30px; height: 30px;
    margin-top: 1px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.22);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12.5px;
    color: var(--ica-turquoise-clr);
}
.lp-atouts li strong { color: var(--ica-blanc); font-weight: 700; }

.lp-cta-scroll {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 24px;
    padding: 13px 26px;
    border-radius: 30px;
    background: var(--ica-blanc);
    color: var(--ica-bleu-fonce) !important;
    font-family: "Outfit", "Inter", sans-serif;
    font-weight: 700;
    font-size: 14.5px;
    box-shadow: var(--ica-shadow-md);
}
.lp-cta-scroll:hover { color: var(--ica-turquoise) !important; }


/* ============================================================
   CARTE FORMULAIRE (embed KindiLab)
   ============================================================ */
.lp-form-card {
    background: var(--ica-blanc);
    border-radius: 24px;
    padding: 28px 32px 20px;
    box-shadow: 0 44px 100px rgba(9, 30, 63, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.55);
}
.lp-form-card-head { text-align: center; margin-bottom: 14px; }
.lp-form-card-head h2 {
    font-family: "Outfit", "Inter", sans-serif;
    font-size: 22px;
    font-weight: 800;
    color: var(--ica-bleu-fonce);
    margin: 0 0 4px;
    letter-spacing: -0.3px;
}
.lp-form-card-head p {
    font-size: 13.5px;
    color: var(--ica-gris-fonce);
    margin: 0;
}

/* Zone d'injection de l'embed.
   min-height mesuré sur le formulaire KindiLab réellement rendu, pour
   éviter le layout shift (CLS) au chargement du script async :
   - >= 576px (champs sur 2 colonnes) : ~474-493px mesurés -> 500px
   - <  576px (champs empilés sur 1 colonne) : ~793-848px mesurés -> 860px */
.lp-embed {
    position: relative;
    min-height: 500px;
}
@media (max-width: 575.98px) {
    .lp-embed { min-height: 860px; }
}
.lp-embed:empty::after {
    content: "Chargement du formulaire\2026";
    position: absolute;
    left: 0; right: 0;
    top: calc(50% + 22px);
    text-align: center;
    color: var(--ica-gris-fonce);
    font-size: 13.5px;
}
.lp-embed:empty::before {
    content: "";
    position: absolute;
    left: 50%;
    top: calc(50% - 14px);
    width: 30px; height: 30px;
    margin-left: -15px;
    border: 3px solid rgba(23, 163, 152, 0.20);
    border-top-color: var(--ica-turquoise);
    border-radius: 50%;
    animation: lp-spin 0.8s linear infinite;
}
@keyframes lp-spin { to { transform: rotate(360deg); } }

/* L'embed doit rester responsive quoi qu'il injecte */
.lp-embed iframe { width: 100% !important; border: 0; display: block; }
.lp-embed img, .lp-embed form, .lp-embed > div { max-width: 100%; }

.lp-embed-fallback {
    text-align: center;
    color: var(--ica-gris-fonce);
    font-size: 14px;
    padding: 34px 12px;
    margin: 0;
}

.lp-form-card-foot {
    margin: 14px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-size: 11.5px;
    color: var(--ica-gris-fonce);
    text-align: center;
}
.lp-form-card-foot i { color: var(--ica-turquoise); }


/* ============================================================
   FORMULAIRE PARTENAIRE KINDILAB (.dfe-*)
   Surcharge des styles par défaut de dynamic-form-engine.css.
   dynamic-form-engine.css est injecté APRÈS lp.css → on scope
   sous .lp-embed pour gagner en spécificité (0,2,0 > 0,1,0).
   Objectif : champs plus compacts, moins hauts, moins d'air.
   ============================================================ */
.lp-embed .dfe-form { line-height: 1.45; }

/* Champs : moins hauts, coins plus discrets */
.lp-embed .dfe-input,
.lp-embed .dfe-select,
.lp-embed .dfe-textarea {
    min-height: 42px;
    padding: 9px 13px;
    font-size: 0.9rem;
    border-radius: 10px;
    box-shadow: none;
}
.lp-embed .dfe-textarea { min-height: 88px; }
.lp-embed .dfe-select {
    padding-right: 36px;
    background-position: right 12px center;
}

/* Libellés plus discrets, moins d'espace sous */
.lp-embed .dfe-label { font-size: 0.8rem; margin-bottom: 5px; }

/* Indications de saisie (placeholder) : moins de contraste */
.lp-embed .dfe-input::placeholder,
.lp-embed .dfe-textarea::placeholder { color: #b6c0cc; opacity: 1; }
.lp-embed .dfe-input::-webkit-input-placeholder { color: #b6c0cc; }
.lp-embed .dfe-select.lp-empty { color: #b6c0cc; }   /* "Sélectionner..." tant qu'aucun choix */

/* Gouttières entre champs plus serrées */
.lp-embed .dfe-fields-row { margin: -7px; }
.lp-embed .dfe-field { padding: 7px; }

/* Messages d'erreur / aide plus compacts */
.lp-embed .dfe-error { font-size: 0.74rem; margin-top: 3px; }
.lp-embed .dfe-help  { font-size: 0.74rem; margin-top: 3px; }

/* Case à cocher consentement */
.lp-embed .dfe-checkbox-label { padding: 10px 12px; gap: 10px; }
.lp-embed .dfe-checkbox { width: 17px; height: 17px; }
.lp-embed .dfe-checkbox-text { font-size: 0.8rem; line-height: 1.45; }

/* Radios / cartes */
.lp-embed .dfe-radio-item { padding: 9px 13px; min-width: 100px; }
.lp-embed .dfe-radio-text { font-size: 0.85rem; }
.lp-embed .dfe-card-inner { padding: 16px 12px; }

/* En-tête d'étape + navigation : moins d'air */
.lp-embed .dfe-step-header { margin-bottom: 16px; }
.lp-embed .dfe-step-title { font-size: 1.15rem; }
.lp-embed .dfe-step-subtitle { font-size: 0.84rem; }
.lp-embed .dfe-step-nav { margin-top: 20px; padding-top: 16px; }
.lp-embed .dfe-progress-bar { margin-bottom: 18px; }
.lp-embed .dfe-submit-row { margin-top: 16px; padding-top: 8px; }

/* Boutons un peu plus bas */
.lp-embed .dfe-btn { min-height: 44px; }
.lp-embed .dfe-btn-submit { min-height: 48px; font-size: 0.98rem; transition: background .25s ease, box-shadow .25s ease, opacity .25s ease; }

/* Bouton « Envoyer » verrouillé tant que le formulaire n'est pas rempli */
.lp-embed .dfe-btn-submit:disabled,
.lp-embed .dfe-btn-primary:disabled {
    background: #cfd8e3 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: none !important;
    opacity: .85;
    cursor: not-allowed;
    pointer-events: none;
}


/* ============================================================
   PIED DE PAGE MINIMAL
   ============================================================ */
.lp-footer { background: var(--ica-noir); }
.lp-footer .ica-legal-strip { border-top: none; }
.lp-footer-bottom {
    background: #060d1a;
    padding: 16px 0;
}
.lp-footer-bottom .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 22px;
}
.lp-footer-copy {
    margin: 0;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.55);
}
.lp-footer-links {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 20px;
    margin: 0;
    padding: 0;
}
.lp-footer-links a {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.65);
}
.lp-footer-links a:hover { color: var(--ica-turquoise-clr); }

/* Logo et nom — style de référence */
.lp-logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--ica-bleu-fonce);
    text-decoration: none;
}

.lp-logo img {
    max-height: 44px;
    width: auto;
    display: block;
}

.lp-wordmark {
    font-family: "Outfit", "Inter", sans-serif;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 1px;
    line-height: 0.9;
    white-space: nowrap;
}

.lp-wordmark-brand {
    color: var(--ica-bleu-fonce);
    font-size: 21px;
    font-weight: 750;
    letter-spacing: -0.035em;
}

.lp-wordmark-brand::first-letter {
    color: var(--ica-turquoise);
}

.lp-wordmark-business {
    color: var(--ica-turquoise);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    padding-left: 1px;
}

@media (max-width: 575.98px) {
    .lp-logo img {
        max-height: 38px;
    }

    .lp-logo {
        gap: 7px;
    }

    .lp-wordmark-brand {
        font-size: 18px;
    }

    .lp-wordmark-business {
        font-size: 8px;
    }
}
/* ============================================================
   RESPONSIVE
   ============================================================ */
/* Desktop : hero quasi plein écran, contenu centré verticalement,
   carte formulaire large et haute (proportions type mutuelleclair) */
@media (min-width: 992px) {
    .lp-hero {
        min-height: calc(100vh - 66px);
        min-height: calc(100dvh - 66px);
        display: flex;
        align-items: center;
        padding-top: 48px;
        padding-bottom: 56px;
    }
    .lp-hero-pitch { padding-right: 12px; }
    .lp-form-card { padding: 34px 38px 24px; }
}
@media (min-width: 1200px) {
    .lp-hero > .container { max-width: 1320px; }
}
@media (min-width: 1440px) {
    .lp-hero > .container { max-width: 1400px; }
}
@media (max-width: 991.98px) {
    .lp-hero { padding: 26px 0 40px; }
    .lp-hero-row { justify-content: center; }
    .lp-hero-pitch { margin-top: 6px; text-align: center; }
    .lp-accroche { margin-left: auto; margin-right: auto; }
    .lp-atouts { align-items: flex-start; max-width: 420px; margin-left: auto; margin-right: auto; }
    .lp-form-card {
        box-shadow: 0 20px 45px rgba(9, 30, 63, 0.22);
        max-width: 560px;
        margin-left: auto;
        margin-right: auto;
    }
}
@media (max-width: 575.98px) {
    .lp-form-card { padding: 20px 16px 14px; }
    .lp-form-card-head h2 { font-size: 20px; }
    .lp-footer-bottom .container { justify-content: center; text-align: center; }
    .lp-embed .dfe-field.col-md-6 { width: 100%; }
}


/* ============================================================
   BANDEAU COOKIES — compact sur mobile (LP uniquement)
   Surcharge des styles icall.css, scopé .lp-body pour ne rien
   changer sur le reste du site.
   ============================================================ */
@media (max-width: 767.98px) {
    .lp-body:not(.lp-senior) #icaCookieBanner { padding: 12px 0; }
    .lp-body:not(.lp-senior) #icaCookieBanner .ica-cookie-banner-grid { gap: 10px; }
    .lp-body:not(.lp-senior) #icaCookieBanner .ica-cookie-banner-text strong { font-size: 13px; margin-bottom: 2px; }
    .lp-body:not(.lp-senior) #icaCookieBanner .ica-cookie-banner-text p { font-size: 11px; line-height: 1.4; }
}
@media (max-width: 575.98px) {
    /* 3 boutons : Refuser | Tout accepter  puis  Personnaliser pleine largeur */
    .lp-body:not(.lp-senior) #icaCookieBanner .ica-cookie-banner-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 7px;
    }
    .lp-body:not(.lp-senior) #icaCookieBanner .btn-cookie {
        width: 100%;
        padding: 9px 8px;
        font-size: 12px;
        border-width: 1.5px;
    }
    .lp-body:not(.lp-senior) #icaCookieBanner #icaCookieReject    { order: 1; }
    .lp-body:not(.lp-senior) #icaCookieBanner #icaCookieAcceptAll { order: 2; }
    .lp-body:not(.lp-senior) #icaCookieBanner #icaCookiePersonalize { order: 3; grid-column: 1 / -1; }
}

/* Bandeau compact réservé à mutuelle-sante-senior. */
.lp-senior .ica-cookie-banner-v2 {
    padding: 12px 0 max(12px, env(safe-area-inset-bottom));
    border-top: 1px solid #dbe5ea;
    box-shadow: 0 -4px 24px rgba(15, 26, 44, .09);
    max-height: 75vh;
    overflow-y: auto;
    visibility: hidden;
}
.lp-senior .ica-cookie-banner-v2.active { visibility: visible; }
.lp-senior .ica-cookie-banner-grid {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 20px;
    align-items: center;
}
.lp-senior .ica-cookie-banner-text strong { font-size: 15px; margin-bottom: 2px; }
.lp-senior .ica-cookie-banner-text p { display: inline; font-size: 13px; line-height: 1.5; }
.lp-senior .ica-cookie-more { color: var(--ica-bleu-fonce); font-size: 13px; margin-left: 5px; text-underline-offset: 3px; }
.lp-senior .ica-cookie-banner-actions { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 8px; }
.lp-senior .ica-cookie-banner-actions .btn-cookie {
    min-height: 44px;
    padding: 8px 14px;
    border-radius: 10px;
    border: 1px solid #cbd8e1;
    font-size: 13px;
    white-space: nowrap;
    box-shadow: none;
    background: #fff;
    color: var(--ica-bleu-fonce);
}
.lp-senior .ica-cookie-banner-actions .btn-cookie--accept,
.lp-senior .ica-cookie-banner-actions .btn-cookie--reject { background: #edf4f7; border-color: #cbd8e1; }
.lp-senior .ica-cookie-banner-actions .btn-cookie:hover { background: #dcebf0; transform: none; box-shadow: none; }
.lp-senior .ica-cookie-banner-v2 :focus-visible { outline: 3px solid var(--ica-bleu-fonce); outline-offset: 3px; }
@media (max-width: 991px) {
    .lp-senior .ica-cookie-banner-grid { grid-template-columns: 1fr; gap: 10px; }
    .lp-senior .ica-cookie-banner-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lp-senior .ica-cookie-banner-actions .btn-cookie { width: 100%; padding: 8px 4px; white-space: normal; overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
    .lp-senior .ica-cookie-banner-v2, .lp-senior .ica-cookie-banner-actions .btn-cookie { transition: none; }
}

/* Argumentaire senior : lecture confortable et garanties distinctes. */
.lp-senior .lp-hero-pitch { text-align: left; }
.lp-senior .lp-h1 { font-size: clamp(32px, 3vw, 44px); line-height: 1.18; letter-spacing: -.5px; margin: 20px 0; }
.lp-senior .lp-h1 span { display: block; margin-top: 12px; font-size: .72em; line-height: 1.35; font-style: normal; color: #b9f5ed !important; -webkit-text-fill-color: #b9f5ed !important; }
.lp-senior .lp-accroche { font-size: 19px; line-height: 1.65; max-width: 38em; color: #fff !important; }
.lp-senior .lp-atouts { gap: 12px; margin-top: 26px; max-width: none; align-items: stretch; }
.lp-senior .lp-atouts li { padding: 14px; border: none; border-radius: 0; background: transparent; font-size: 17px; line-height: 1.5; color: #fff; gap: 14px; }
.lp-senior .lp-atouts li i { width: 28px; height: 28px; font-size: 13px; line-height: 1; margin-top: 0; align-self: center; color: #b9f5ed; }
@media (max-width: 575.98px) {
    .lp-senior .lp-h1 { font-size: 32px; }
    .lp-senior .lp-atouts li { padding: 14px; gap: 12px; }
}

/* Titre senior continu : même taille et couleur, retours naturels. */
.lp-senior .lp-h1 { font-size: clamp(30px, 3vw, 40px); line-height: 1.25; letter-spacing: -.3px; color: #fff !important; }
.lp-senior .lp-h1 span { display: inline; font-size: inherit; line-height: inherit; font-weight: inherit; font-style: normal; margin: 0; color: #b9f5ed !important; -webkit-text-fill-color: #b9f5ed !important; }

/* Desktop : présentation et formulaire sur une même hauteur naturelle. */
@media (min-width: 992px) {
    .lp-senior .lp-hero-row { align-items: stretch !important; }
    .lp-senior .lp-hero-row > .col-lg-5,
    .lp-senior .lp-hero-row > .col-lg-7 { display: flex; }
    .lp-senior .lp-form-card { width: 100%; }
    .lp-senior .lp-hero-pitch { display: flex; flex-direction: column; width: 100%; }
    .lp-senior .lp-hero-pitch > .ica-form-hero-badge { align-self: flex-start; }
    .lp-senior .lp-h1 { font-size: clamp(28px, 2.4vw, 36px); margin: 16px 0; }
    .lp-senior .lp-accroche { font-size: 18px; line-height: 1.5; }
    .lp-senior .lp-atouts { flex: 1; justify-content: space-between; margin-top: 20px; margin-bottom: 0; gap: 10px; }
    .lp-senior .lp-atouts li { padding: 12px 14px; }
}

/* Garanties rapprochées, sans répartition sur toute la hauteur. */
.lp-senior .lp-atouts { flex: 0 0 auto; justify-content: flex-start; gap: 14px; }
.lp-senior .lp-atouts li { padding-top: 4px; padding-bottom: 4px; }

/* Accroche : première ligne jusqu’à 55 ans, suite en vert. */
.lp-senior .lp-h1 span { display: block; margin-top: 8px; }

/* Première ligne complète, taille adaptée à la largeur réelle du bloc. */
.lp-senior .lp-hero-pitch { container-type: inline-size; }
.lp-senior .lp-h1 { font-size: clamp(18px, 4.65cqi, 36px); }

/* Deuxième phrase légèrement plus petite que le titre principal. */
.lp-senior .lp-h1 span { font-size: .85em; }