/* =============================================
   SayLife Assurance Pro — fiches produit publiques (v3.27, lot 8 · finitions lot 9)
   Charte de la page d’accueil saylife.fr : Poppins (titres en deux graisses) · Roboto · #237AFC · #001744 · #0D3276
   · #21355C · #DEE9FA. Tout sélecteur est porté par .slap-pp:not(#\#) (bat le kit Elementor / le thème).
   Mouvement : transform / opacity seulement, survols réservés aux pointeurs fins, retour au toucher partout,
   rien ne bouge avec « réduire les animations ». Sans JS (assets/js/product-page.js) tout reste visible.
   ============================================= */

.slap-pp:not(#\#) {
    --pp-blue: #237AFC;
    --pp-blue-press: #1B6CE6;
    --pp-blue-deep: #0D3276;
    --pp-navy: #001744;
    --pp-slate: #21355C;
    --pp-pale: #DEE9FA;
    --pp-bg: #F6F8FC;
    --pp-ink: #21355C;
    --pp-ink-soft: #4E5F80;
    --pp-hair: rgba(0, 23, 68, 0.08);
    --pp-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
    --pp-ease-io: cubic-bezier(0.77, 0, 0.175, 1);
    --pp-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
    --pp-ease: var(--pp-ease-out);
    /* Surfaces: a half-pixel ring instead of a border, a short contact shadow, a soft ambient one */
    --pp-shadow: 0 0 0 0.5px rgba(0, 23, 68, 0.07), 0 1px 2px rgba(0, 23, 68, 0.04), 0 12px 32px -18px rgba(13, 50, 118, 0.22);
    --pp-shadow-lift: 0 0 0 0.5px rgba(0, 23, 68, 0.08), 0 2px 4px rgba(0, 23, 68, 0.04), 0 28px 56px -26px rgba(13, 50, 118, 0.34);
    --pp-ring: 0 0 0 4px rgba(35, 122, 252, 0.22);
    --pp-section: clamp(72px, 8vw, 120px);
    position: relative;
    overflow: hidden;
    overflow: clip;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0 0 96px;
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 17px;
    line-height: 1.6;
    letter-spacing: 0;
    overflow-wrap: anywhere; /* one unbreakable word (a long name, an address) never widens a block past the screen */
    color: var(--pp-ink);
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-kerning: normal;
    -webkit-tap-highlight-color: transparent;
    -webkit-text-size-adjust: 100%;
}
.slap-pp:not(#\#) *, .slap-pp:not(#\#) *::before, .slap-pp:not(#\#) *::after { box-sizing: border-box; }
.slap-pp:not(#\#) a { color: inherit; text-decoration: none; }
.slap-pp:not(#\#) p { margin: 0 0 1em; }
.slap-pp:not(#\#) ul, .slap-pp:not(#\#) ol { margin: 0; padding: 0; list-style: none; }
.slap-pp:not(#\#) :is(a, button, summary) { touch-action: manipulation; }
.slap-pp:not(#\#) a:focus-visible, .slap-pp:not(#\#) summary:focus-visible { outline: 2px solid var(--pp-blue); outline-offset: 3px; border-radius: 8px; }

/* ---------- Layout ---------- */
.slap-pp:not(#\#) .slap-pp__wrap { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 32px; position: relative; z-index: 1; }
.slap-pp:not(#\#) .slap-pp__narrow { max-width: 860px; }
.slap-pp:not(#\#) .slap-pp__section { position: relative; padding: var(--pp-section) 0; }
.slap-pp:not(#\#) .slap-pp__section--tint { background: linear-gradient(180deg, #F5F7FB 0%, #F5F7FB 55%, #fff 100%); }
.slap-pp:not(#\#) .slap-pp__split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 64px; align-items: center; }
.slap-pp:not(#\#) .slap-pp__cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; margin-top: 48px; }
.slap-pp:not(#\#) .slap-pp__center { text-align: center; }

/* ---------- Titles: tracking per size, tight leading on the big ones ---------- */
.slap-pp:not(#\#) .slap-pp__h1,
.slap-pp:not(#\#) .slap-pp__h2 { font-family: 'Poppins', sans-serif; margin: 0 0 20px; text-transform: none; text-wrap: balance; }
.slap-pp:not(#\#) .slap-pp__h2 { display: block; font-size: clamp(34px, 4.2vw, 58px); line-height: 1.05; letter-spacing: -0.028em; color: var(--pp-blue-deep); }
.slap-pp:not(#\#) .slap-pp__h2 .slap-pp__light,
.slap-pp:not(#\#) .slap-pp__h2 .slap-pp__bold { display: block; }
.slap-pp:not(#\#) .slap-pp__h2 .slap-pp__light { letter-spacing: -0.022em; }
.slap-pp:not(#\#) .slap-pp__light { font-weight: 300; }
.slap-pp:not(#\#) .slap-pp__bold { font-weight: 700; }
.slap-pp:not(#\#) .slap-pp__h2--white { color: #fff; }
.slap-pp:not(#\#) .slap-pp__h3 { font-family: 'Poppins', sans-serif; font-size: 19px; font-weight: 600; line-height: 1.3; letter-spacing: -0.012em; color: var(--pp-blue-deep); margin: 0 0 12px; }
.slap-pp:not(#\#) .slap-pp__h3--center { text-align: center; margin-top: 64px; margin-bottom: 20px; }
.slap-pp:not(#\#) .slap-pp__lead { max-width: 34em; font-size: clamp(18px, 1.5vw, 21px); line-height: 1.5; letter-spacing: -0.008em; color: var(--pp-blue); font-family: 'Poppins', sans-serif; font-weight: 400; text-wrap: pretty; }
.slap-pp:not(#\#) .slap-pp__sub { font-family: 'Poppins', sans-serif; font-size: clamp(18px, 1.5vw, 21px); line-height: 1.45; letter-spacing: -0.008em; color: var(--pp-blue); margin: -4px 0 56px; text-wrap: balance; }

/* ---------- Hero (the homepage's rounded navy block, product photo under a navy veil) ---------- */
.slap-pp:not(#\#) .slap-pp__hero {
    position: relative; isolation: isolate; overflow: hidden; margin: 16px; border-radius: 32px; color: #fff;
    display: flex; flex-direction: column; justify-content: center;
    min-height: clamp(560px, calc(100svh - 140px), 800px);
    background: linear-gradient(160deg, #0D3276 0%, #001744 70%);
    box-shadow: 0 40px 80px -48px rgba(0, 23, 68, 0.6);
    padding: 88px 32px 80px; text-align: center;
}
.slap-pp:not(#\#) .slap-pp__hero::after {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(180deg, rgba(0, 23, 68, 0.38) 0%, rgba(0, 23, 68, 0.62) 55%, rgba(0, 23, 68, 0.9) 100%);
}
.slap-pp:not(#\#) .slap-pp__hero-img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; opacity: 1; }
.slap-pp:not(#\#) .slap-pp__hero-inner { width: 100%; max-width: 980px; margin: 0 auto; text-shadow: 0 2px 18px rgba(0, 23, 68, 0.55); }
.slap-pp:not(#\#) .slap-pp__hero--hub { min-height: clamp(440px, calc(70svh - 120px), 600px); padding-bottom: 72px; }
.slap-pp:not(#\#) .slap-pp__crumbs { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; font-size: 14px; letter-spacing: 0.005em; color: rgba(255, 255, 255, 0.74); margin-bottom: 32px; }
.slap-pp:not(#\#) .slap-pp__crumbs a { transition: color 150ms ease; }
.slap-pp:not(#\#) .slap-pp__crumbs a:focus-visible { outline-color: #9CC2FF; }
.slap-pp:not(#\#) .slap-pp__eyebrow {
    display: inline-block; margin: 0 0 24px; padding: 6px 14px; border-radius: 6px;
    background: var(--pp-blue); color: #fff; font-family: 'Poppins', sans-serif; font-size: 15px; font-weight: 400; line-height: 1.4; letter-spacing: 0;
    text-shadow: none;
}
.slap-pp:not(#\#) .slap-pp__h1 { font-size: clamp(40px, 5.3vw, 76px); line-height: 1.08; overflow-wrap: anywhere; -webkit-hyphens: auto; hyphens: auto; color: #fff; text-transform: uppercase; letter-spacing: -0.012em; margin-bottom: 0; }
.slap-pp:not(#\#) .slap-pp__h1 .slap-pp__light { display: block; font-weight: 400; letter-spacing: -0.004em; }
.slap-pp:not(#\#) .slap-pp__h1 .slap-pp__bold { display: block; }
.slap-pp:not(#\#) .slap-pp__answer { overflow-wrap: anywhere; max-width: 740px; margin: 28px auto 40px; font-size: clamp(17px, 1.45vw, 21px); line-height: 1.5; letter-spacing: -0.006em; color: rgba(255, 255, 255, 0.9); text-wrap: pretty; }
.slap-pp:not(#\#) .slap-pp__ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; text-shadow: none; }
.slap-pp:not(#\#) .slap-pp__ctas--left { justify-content: flex-start; margin: 28px 0 20px; }
.slap-pp:not(#\#) .slap-pp__reassure { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px; margin-top: 40px; font-family: 'Poppins', sans-serif; font-size: 15px; color: rgba(255, 255, 255, 0.94); }
.slap-pp:not(#\#) .slap-pp__reassure li { display: inline-flex; align-items: center; gap: 10px; }
.slap-pp:not(#\#) .slap-pp__reassure .slap-pp__tick { background: rgba(255, 255, 255, 0.16); color: #fff; }

/* ---------- Buttons: feedback on press, hover only with a mouse ---------- */
.slap-pp:not(#\#) .slap-pp__btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 6px 8px 6px 26px;
    border: 0; border-radius: 999px; cursor: pointer; font-family: 'Poppins', sans-serif; font-size: 16px; font-weight: 500; line-height: 1.2; letter-spacing: -0.006em;
    -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
    transition: transform 200ms var(--pp-ease-out), box-shadow 200ms var(--pp-ease-out), background-color 180ms ease;
}
.slap-pp:not(#\#) .slap-pp__btn i {
    display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
    background: rgba(255, 255, 255, 0.18); transition: transform 200ms var(--pp-ease-out);
}
.slap-pp:not(#\#) .slap-pp__btn svg { width: 18px; height: 18px; }
.slap-pp:not(#\#) .slap-pp__btn--primary { background: var(--pp-blue); color: #fff; box-shadow: 0 14px 30px -14px rgba(35, 122, 252, 0.9); }
.slap-pp:not(#\#) .slap-pp__btn:active { transform: scale(0.97); transition-duration: 100ms; }
.slap-pp:not(#\#) .slap-pp__btn--primary:active { background: var(--pp-blue-press); box-shadow: 0 8px 18px -12px rgba(35, 122, 252, 0.9); }
.slap-pp:not(#\#) .slap-pp__btn:focus-visible { outline: 2px solid #9CC2FF; outline-offset: 3px; }
.slap-pp:not(#\#) .slap-pp__btn--ghost {
    padding: 6px 24px; background: rgba(255, 255, 255, 0.1); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.38);
    -webkit-backdrop-filter: saturate(160%) blur(12px); backdrop-filter: saturate(160%) blur(12px);
}
.slap-pp:not(#\#) .slap-pp__btn--ghost:active { background: rgba(255, 255, 255, 0.2); }
.slap-pp:not(#\#) .slap-pp__btn--block { width: 100%; }

/* ---------- Cards, lists ---------- */
.slap-pp:not(#\#) .slap-pp__card {
    display: block; background: #fff; border: 0; border-radius: 24px; padding: 32px 32px 28px; box-shadow: var(--pp-shadow);
}
.slap-pp:not(#\#) .slap-pp__card p { color: var(--pp-ink-soft); }
.slap-pp:not(#\#) .slap-pp__card--soft { background: #F3F7FE; box-shadow: inset 0 0 0 1px #E0EAFA; }
.slap-pp:not(#\#) .slap-pp__card--link {
    display: flex; flex-direction: column; -webkit-touch-callout: none;
    transition: transform 220ms var(--pp-ease-out), box-shadow 220ms var(--pp-ease-out);
}
.slap-pp:not(#\#) .slap-pp__card--link p { flex: 1 1 auto; }
.slap-pp:not(#\#) .slap-pp__card--link:active { transform: scale(0.98); transition-duration: 120ms; }
.slap-pp:not(#\#) .slap-pp__card--link:focus-visible { outline: 2px solid var(--pp-blue); outline-offset: 4px; border-radius: 24px; }
.slap-pp:not(#\#) .slap-pp__tick {
    flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%;
    background: var(--pp-pale); color: var(--pp-blue);
}
.slap-pp:not(#\#) .slap-pp__tick svg { width: 15px; height: 15px; }
.slap-pp:not(#\#) .slap-pp__checks li { display: flex; align-items: flex-start; gap: 14px; padding: 11px 0; font-size: 17px; line-height: 1.5; color: var(--pp-ink); }
.slap-pp:not(#\#) .slap-pp__check-text { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.slap-pp:not(#\#) .slap-pp__checks li + li { border-top: 0.5px solid rgba(0, 23, 68, 0.12); }
.slap-pp:not(#\#) .slap-pp__checks--no .slap-pp__tick { background: #FDECEC; color: #C53030; }
.slap-pp:not(#\#) .slap-pp__law {
    display: inline-flex; align-items: center; gap: 10px; margin: 10px 0 0; padding: 10px 16px; border-radius: 12px;
    background: var(--pp-pale); color: var(--pp-blue-deep); font-size: 15px; font-weight: 500;
}
.slap-pp:not(#\#) .slap-pp__law svg { flex: 0 0 auto; }
.slap-pp:not(#\#) .slap-pp__audiences { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; margin-top: 56px; }
.slap-pp:not(#\#) .slap-pp__link { display: inline-flex; align-items: center; gap: 8px; font-family: 'Poppins', sans-serif; font-weight: 500; letter-spacing: -0.006em; color: var(--pp-blue); }
.slap-pp:not(#\#) .slap-pp__link svg { width: 16px; height: 16px; transition: transform 200ms var(--pp-ease-out); }
.slap-pp:not(#\#) a.slap-pp__link:active { opacity: 0.7; }

.slap-pp:not(#\#) .slap-pp__examples { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; margin-top: 8px; }
.slap-pp:not(#\#) .slap-pp__example,
.slap-pp:not(#\#) .slap-pp__quote {
    position: relative; margin: 0; padding: 26px 28px 24px 66px; border-radius: 20px; background: var(--pp-pale);
    color: var(--pp-blue-deep); font-style: italic; font-size: 16px; line-height: 1.6; border: 0;
}
.slap-pp:not(#\#) .slap-pp__example::before,
.slap-pp:not(#\#) .slap-pp__quote::before {
    content: "\201C"; position: absolute; left: 24px; top: 10px; font-family: Georgia, serif; font-style: normal; font-size: 52px; line-height: 1; color: var(--pp-blue-deep);
}
.slap-pp:not(#\#) .slap-pp__quote { max-width: 760px; margin: 8px 0 48px; font-size: 18px; }

.slap-pp:not(#\#) .slap-pp__warning {
    display: flex; gap: 14px; align-items: flex-start; margin: 0 0 8px; padding: 20px 24px; border-radius: 18px;
    background: #FFF8E9; color: #7A4B00; border: 0; box-shadow: inset 0 0 0 1px #F4D79B; font-size: 16px; line-height: 1.55;
}
.slap-pp:not(#\#) .slap-pp__warning svg { flex: 0 0 auto; width: 22px; height: 22px; margin-top: 1px; color: #D4880C; }

/* ---------- Price (no amount, ever) ---------- */
.slap-pp:not(#\#) .slap-pp__price {
    display: grid; grid-template-columns: 1fr 1fr; gap: 40px 64px; align-items: center; padding: 64px; border-radius: 32px;
    background: #F3F7FE; box-shadow: inset 0 0 0 1px #E0EAFA;
}
.slap-pp:not(#\#) .slap-pp__price .slap-pp__lead { margin-bottom: 0; }
.slap-pp:not(#\#) .slap-pp__factors { display: flex; flex-wrap: wrap; gap: 10px; }
.slap-pp:not(#\#) .slap-pp__factors li {
    padding: 10px 18px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 0.5px rgba(13, 50, 118, 0.14), 0 1px 2px rgba(13, 50, 118, 0.05); color: var(--pp-blue-deep);
    font-family: 'Poppins', sans-serif; font-size: 15px; letter-spacing: -0.004em;
}
.slap-pp:not(#\#) .slap-pp__price-cta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; }
.slap-pp:not(#\#) .slap-pp__fine { font-size: 14px; color: var(--pp-ink-soft); }

/* ---------- Why SayLife ---------- */
.slap-pp:not(#\#) .slap-pp__why { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.slap-pp:not(#\#) .slap-pp__why-item { padding: 30px 26px; border-radius: 24px; background: #fff; box-shadow: var(--pp-shadow); }
.slap-pp:not(#\#) .slap-pp__why-item p { margin: 0; font-size: 15.5px; line-height: 1.55; color: var(--pp-ink-soft); }
.slap-pp:not(#\#) .slap-pp__why-icon {
    display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 20px; border-radius: 14px;
    background: var(--pp-pale); color: var(--pp-blue);
}
.slap-pp:not(#\#) .slap-pp__why-icon svg { width: 24px; height: 24px; }

/* ---------- Steps (homepage « Étape n » pills) ---------- */
.slap-pp:not(#\#) .slap-pp__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; counter-reset: none; }
.slap-pp:not(#\#) .slap-pp__steps li { padding: 0; }
.slap-pp:not(#\#) .slap-pp__steps .slap-pp__h3 { color: var(--pp-blue); font-weight: 500; font-size: 21px; letter-spacing: -0.016em; }
.slap-pp:not(#\#) .slap-pp__steps p { font-size: 15.5px; line-height: 1.55; color: var(--pp-ink-soft); }
.slap-pp:not(#\#) .slap-pp__pill {
    display: inline-block; margin-bottom: 18px; padding: 8px 18px; border-radius: 999px; background: var(--pp-pale);
    color: var(--pp-blue-deep); font-family: 'Poppins', sans-serif; font-size: 15px; font-variant-numeric: tabular-nums;
}

/* ---------- FAQ: the answer opens on a 0fr → 1fr track (JS), the chevron turns with it ---------- */
.slap-pp:not(#\#) .slap-pp__faq { display: grid; gap: 12px; margin-top: 36px; }
.slap-pp:not(#\#) .slap-pp__faq details { border-radius: 20px; background: #fff; box-shadow: 0 0 0 0.5px rgba(0, 23, 68, 0.1), 0 1px 2px rgba(0, 23, 68, 0.03); transition: box-shadow 260ms var(--pp-ease-out); }
.slap-pp:not(#\#) .slap-pp__faq details[open]:not(.is-collapsed) { box-shadow: var(--pp-shadow); }
.slap-pp:not(#\#) .slap-pp__faq summary {
    position: relative; display: block; list-style: none; cursor: pointer; padding: 24px 68px 24px 28px; border-radius: 20px;
    font-family: 'Poppins', sans-serif; font-size: 17.5px; font-weight: 500; line-height: 1.4; letter-spacing: -0.01em; color: var(--pp-blue-deep); text-wrap: pretty;
    -webkit-user-select: none; user-select: none;
}
.slap-pp:not(#\#) .slap-pp__faq summary::-webkit-details-marker { display: none; }
.slap-pp:not(#\#) .slap-pp__faq summary::marker { content: ""; }
.slap-pp:not(#\#) .slap-pp__faq summary::before {
    content: ""; position: absolute; right: 22px; top: 50%; width: 32px; height: 32px; margin-top: -16px; border-radius: 50%;
    background: var(--pp-pale); transition: transform 140ms var(--pp-ease-out);
}
.slap-pp:not(#\#) .slap-pp__faq summary::after {
    content: ""; position: absolute; right: 31px; top: 50%; width: 14px; height: 14px; margin-top: -7px; background: var(--pp-blue);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2.5 5l4.5 4.5L11.5 5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2.5 5l4.5 4.5L11.5 5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
    transition: transform 260ms var(--pp-ease-out);
}
.slap-pp:not(#\#) .slap-pp__faq details[open]:not(.is-collapsed) summary::after { transform: rotate(180deg); }
.slap-pp:not(#\#) .slap-pp__faq summary:active::before { transform: scale(0.9); }
.slap-pp:not(#\#) .slap-pp__faq-a { display: grid; grid-template-rows: 1fr; transition: grid-template-rows 260ms var(--pp-ease-out); }
.slap-pp:not(#\#) .slap-pp__faq-a > div { min-height: 0; overflow: hidden; }
.slap-pp:not(#\#) .slap-pp__faq-a p { opacity: 1; transition: opacity 200ms ease; }
.slap-pp:not(#\#) .slap-pp__faq details.is-collapsed .slap-pp__faq-a { grid-template-rows: 0fr; }
.slap-pp:not(#\#) .slap-pp__faq details.is-collapsed .slap-pp__faq-a p { opacity: 0; transition-duration: 140ms; }
.slap-pp:not(#\#) .slap-pp__faq details p { margin: 0; padding: 0 28px 26px; color: var(--pp-ink-soft); text-wrap: pretty; }

/* ---------- Related / hub ---------- */
.slap-pp:not(#\#) .slap-pp__related { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 8px; }

/* ---------- Final block + callback form ---------- */
.slap-pp:not(#\#) .slap-pp__final { margin: 48px 16px 0; border-radius: 32px; background: linear-gradient(150deg, #0D3276 0%, #001744 75%); color: #fff; box-shadow: 0 40px 80px -48px rgba(0, 23, 68, 0.6); }
.slap-pp:not(#\#) .slap-pp__final-inner { max-width: 1180px; margin: 0 auto; padding: 88px 48px; display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 56px; align-items: center; }
.slap-pp:not(#\#) .slap-pp__final .slap-pp__h2 { font-size: clamp(32px, 3.6vw, 50px); }
.slap-pp:not(#\#) .slap-pp__final-text p { color: rgba(255, 255, 255, 0.84); font-size: 18px; line-height: 1.55; text-wrap: pretty; }
.slap-pp:not(#\#) .slap-pp__call a { color: #fff; font-weight: 500; text-decoration: underline; text-underline-offset: 3px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.slap-pp:not(#\#) .slap-pp__call a:focus-visible { outline-color: #9CC2FF; }
.slap-pp:not(#\#) .slap-pp__callback { padding: 36px; border-radius: 24px; background: rgba(255, 255, 255, 0.06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.1); }
.slap-pp:not(#\#) .slap-pp__callback .slap-pp__h3 { color: #fff; font-size: 21px; margin-bottom: 18px; }
.slap-pp:not(#\#) .slap-pp__field { display: block; margin-bottom: 18px; }
.slap-pp:not(#\#) .slap-pp__field span { display: block; font-size: 14px; color: rgba(255, 255, 255, 0.74); margin-bottom: 4px; }
.slap-pp:not(#\#) .slap-pp__field input {
    width: 100%; height: 46px; padding: 0 2px; border: 0; border-bottom: 2px solid var(--pp-blue); border-radius: 0; background: transparent;
    color: #fff; font-family: 'Poppins', sans-serif; font-size: 16px; outline: none; box-shadow: none; -webkit-appearance: none; appearance: none;
    transition: border-color 150ms ease;
}
.slap-pp:not(#\#) .slap-pp__field input:focus { border-bottom-color: #8DBAFF; }
.slap-pp:not(#\#) .slap-pp__consent { display: flex; gap: 10px; align-items: flex-start; margin: 6px 0 24px; font-size: 14px; color: rgba(255, 255, 255, 0.8); line-height: 1.45; cursor: pointer; }
.slap-pp:not(#\#) .slap-pp__consent input { flex: 0 0 auto; margin-top: 1px; width: 18px; height: 18px; accent-color: var(--pp-blue); }
.slap-pp:not(#\#) .slap-pp__consent input:focus-visible { outline: 2px solid #9CC2FF; outline-offset: 2px; }
.slap-pp:not(#\#) .slap-pp__callback .slap-pp__btn { width: 100%; padding: 6px 24px; }
.slap-pp:not(#\#) .slap-pp__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.slap-pp:not(#\#) .slap-pp__msg { padding: 12px 16px; border-radius: 12px; background: rgba(197, 48, 48, 0.18); color: #fff; font-size: 15px; }
.slap-pp:not(#\#) .slap-pp__msg--ok { background: rgba(14, 159, 110, 0.22); }

.slap-pp:not(#\#) .slap-pp__meta { margin-top: 40px; font-size: 14px; line-height: 1.6; color: var(--pp-ink-soft); }
.slap-pp:not(#\#) .slap-pp__preview { position: sticky; top: 0; z-index: 5; padding: 10px 16px; text-align: center; background: #FFF4D6; color: #7A4B00; font-size: 14px; font-weight: 500; }

/* ---------- Sticky quote bar (phone) ---------- */
.slap-pp:not(#\#) .slap-pp__sticky { display: none; }

/* ---------- Hover: only where a precise pointer can hover ---------- */
@media (hover: hover) and (pointer: fine) {
    .slap-pp:not(#\#) .slap-pp__crumbs a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
    .slap-pp:not(#\#) .slap-pp__btn--primary:hover { background: #1B6CE6; transform: translateY(-1px); box-shadow: 0 20px 36px -16px rgba(35, 122, 252, 0.95); }
    .slap-pp:not(#\#) .slap-pp__btn--primary:hover i { transform: translateX(2px); }
    .slap-pp:not(#\#) .slap-pp__btn--primary:active { transform: scale(0.97); }
    .slap-pp:not(#\#) .slap-pp__btn--ghost:hover { background: rgba(255, 255, 255, 0.18); }
    .slap-pp:not(#\#) .slap-pp__card--link:hover { transform: translateY(-3px); box-shadow: var(--pp-shadow-lift); }
    .slap-pp:not(#\#) .slap-pp__card--link:active { transform: scale(0.98); }
    .slap-pp:not(#\#) a:hover .slap-pp__link svg, .slap-pp:not(#\#) .slap-pp__link:hover svg { transform: translate(2px, -2px); }
    .slap-pp:not(#\#) .slap-pp__faq summary:hover::before { background: #D2E1F8; }
    .slap-pp:not(#\#) .slap-pp__call a:hover { text-decoration-thickness: 2px; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
    .slap-pp:not(#\#) .slap-pp__why { grid-template-columns: repeat(2, 1fr); }
    .slap-pp:not(#\#) .slap-pp__steps { grid-template-columns: repeat(2, 1fr); row-gap: 40px; }
    .slap-pp:not(#\#) .slap-pp__related { grid-template-columns: repeat(2, 1fr); }
    .slap-pp:not(#\#) .slap-pp__price { padding: 48px; }
}
@media (max-width: 820px) {
    .slap-pp:not(#\#) { --pp-section: 72px; font-size: 16px; padding-bottom: calc(120px + env(safe-area-inset-bottom, 0px)); }
    .slap-pp:not(#\#) .slap-pp__wrap { padding: 0 16px; }
    .slap-pp:not(#\#) .slap-pp__split,
    .slap-pp:not(#\#) .slap-pp__cols,
    .slap-pp:not(#\#) .slap-pp__audiences,
    .slap-pp:not(#\#) .slap-pp__price,
    .slap-pp:not(#\#) .slap-pp__final-inner { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .slap-pp:not(#\#) .slap-pp__cols { margin-top: 32px; gap: 16px; }
    .slap-pp:not(#\#) .slap-pp__audiences { margin-top: 32px; gap: 16px; }
    .slap-pp:not(#\#) .slap-pp__h2 { margin-bottom: 16px; }
    .slap-pp:not(#\#) .slap-pp__sub { margin-bottom: 40px; }
    .slap-pp:not(#\#) .slap-pp__h3--center { margin-top: 48px; }
    .slap-pp:not(#\#) .slap-pp__hero { margin: 8px; border-radius: 26px; min-height: 0; padding: 52px 18px 44px; }
    .slap-pp:not(#\#) .slap-pp__hero--hub { padding-bottom: 52px; }
    .slap-pp:not(#\#) .slap-pp__crumbs { margin-bottom: 24px; font-size: 13px; }
    .slap-pp:not(#\#) .slap-pp__answer { margin: 20px auto 30px; }
    .slap-pp:not(#\#) .slap-pp__ctas .slap-pp__btn { width: 100%; }
    .slap-pp:not(#\#) .slap-pp__reassure { flex-direction: column; align-items: center; gap: 10px; margin-top: 30px; }
    .slap-pp:not(#\#) .slap-pp__reassure li { max-width: 100%; text-align: left; }
    .slap-pp:not(#\#) .slap-pp__price { padding: 32px 20px 28px; border-radius: 26px; }
    .slap-pp:not(#\#) .slap-pp__price-cta .slap-pp__btn { width: 100%; }
    .slap-pp:not(#\#) .slap-pp__price-cta { justify-content: center; text-align: center; }
    .slap-pp:not(#\#) .slap-pp__card { padding: 26px 22px 22px; border-radius: 22px; }
    .slap-pp:not(#\#) .slap-pp__why-item { padding: 26px 22px; border-radius: 22px; }
    .slap-pp:not(#\#) .slap-pp__quote { margin-bottom: 32px; }
    .slap-pp:not(#\#) .slap-pp__faq summary { padding: 20px 60px 20px 22px; font-size: 16.5px; }
    .slap-pp:not(#\#) .slap-pp__faq summary::before { right: 16px; }
    .slap-pp:not(#\#) .slap-pp__faq summary::after { right: 25px; }
    .slap-pp:not(#\#) .slap-pp__faq details p { padding: 0 22px 22px; }
    .slap-pp:not(#\#) .slap-pp__final { margin: 40px 8px 0; border-radius: 26px; }
    .slap-pp:not(#\#) .slap-pp__final-inner { padding: 56px 18px 18px; }
    .slap-pp:not(#\#) .slap-pp__ctas--left .slap-pp__btn { width: 100%; }
    .slap-pp:not(#\#) .slap-pp__callback { padding: 26px 20px; border-radius: 20px; }

    /* The bar is a material: content scrolls under a frosted layer whose top edge fades out (no hard line) */
    .slap-pp:not(#\#) .slap-pp__sticky {
        display: flex; gap: 8px; position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; isolation: isolate;
        padding: 10px max(12px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
        background: transparent;
        transition: transform 320ms var(--pp-ease-drawer), visibility 0s;
    }
    .slap-pp:not(#\#) .slap-pp__sticky::before {
        content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; top: -18px; pointer-events: none;
        background: rgba(255, 255, 255, 0.72);
        -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
        -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 18px); mask-image: linear-gradient(to bottom, transparent 0, #000 18px);
    }
    .slap-pp:not(#\#) .slap-pp__sticky .slap-pp__btn { flex: 1 1 0; min-height: 50px; font-size: 15px; padding-left: 18px; gap: 8px; box-shadow: 0 10px 24px -14px rgba(35, 122, 252, 0.9); }
    .slap-pp:not(#\#) .slap-pp__sticky .slap-pp__btn i { width: 36px; height: 36px; }
    /* With JS: the bar comes up once the hero’s buttons have scrolled away, and steps aside for the final block */
    .slap-pp--bar:not(#\#) .slap-pp__sticky:not(.is-shown) {
        /* No opacity fade: an ancestor below 1 would isolate the ::before backdrop-filter and un-blur the glass */
        transform: translateY(calc(100% + 24px)); visibility: hidden; pointer-events: none;
        transition: transform 220ms var(--pp-ease-out), visibility 0s linear 220ms;
    }
}
@media (max-width: 560px) {
    .slap-pp:not(#\#) .slap-pp__why,
    .slap-pp:not(#\#) .slap-pp__steps,
    .slap-pp:not(#\#) .slap-pp__related { grid-template-columns: 1fr; }
    .slap-pp:not(#\#) .slap-pp__steps { row-gap: 32px; }
    .slap-pp:not(#\#) .slap-pp__h1 { font-size: clamp(24px, 8.2vw, 40px); line-height: 1.08; letter-spacing: -0.02em; }
    /* A long eyebrow reads as a caption, never a blue slab */
    .slap-pp:not(#\#) .slap-pp__eyebrow { max-width: 100%; padding: 5px 11px; font-size: 13px; line-height: 1.45; letter-spacing: 0.005em; text-wrap: balance; overflow-wrap: anywhere; }
    .slap-pp:not(#\#) .slap-pp__h2 { font-size: clamp(30px, 8.6vw, 38px); }
    .slap-pp:not(#\#) .slap-pp__example, .slap-pp:not(#\#) .slap-pp__quote { padding: 22px 22px 20px 58px; }
    .slap-pp:not(#\#) .slap-pp__example::before, .slap-pp:not(#\#) .slap-pp__quote::before { left: 18px; }
}
@media (max-width: 360px) {
    /* Small phones: a 20-letter capital word (« INTERPROFESSIONNELLE ») still fits on one line */
    .slap-pp:not(#\#) .slap-pp__h1 { font-size: max(22px, 7.2vw); }
}
@media (pointer: coarse) {
    .slap-pp:not(#\#) input, .slap-pp:not(#\#) select, .slap-pp:not(#\#) textarea { font-size: 16px; }
}

/* RGPD notice under the callback form: small print */
.slap-pp:not(#\#) .slap-pp__rgpd { margin-top: 16px; }
.slap-pp:not(#\#) .slap-pp__rgpd, .slap-pp:not(#\#) .slap-pp__rgpd p, .slap-pp:not(#\#) .slap-pp__rgpd a { font-size: 12px; line-height: 1.55; color: rgba(255, 255, 255, 0.7); }
.slap-pp:not(#\#) .slap-pp__rgpd p { margin: 0; }

/* ---------- Reveal on scroll (JS adds .slap-pp__rv only to blocks below the fold, never with reduced motion) ---------- */
.slap-pp:not(#\#) .slap-pp__rv { opacity: 0; transform: translateY(16px); transition: none; }
.slap-pp:not(#\#) .slap-pp__rv.is-in {
    opacity: 1; transform: none;
    transition: opacity 400ms var(--pp-ease-out) var(--pp-d, 0ms), transform 500ms var(--pp-ease-out) var(--pp-d, 0ms);
}

/* ---------- Continuity between pages (hub → fiche → questionnaire) ----------
   Cross-document view transition: the page crossfades instead of cutting (the theme header is in the root, so no movement),
   and a fiche’s hero grows out of the card that was clicked (hub, showcase, related cards: same name slap-pp-<slug>, set by the
   templates in --pp-vt; product-page.js keeps only the pair that matches the destination). */
@view-transition { navigation: auto; }
.slap-pp:not(#\#) .slap-pp__hero,
.slap-pp:not(#\#) .slap-pp__card--link { view-transition-name: var(--pp-vt, none); view-transition-class: slap-pp-morph; }
::view-transition-old(root) { animation: slapPpVtOut 180ms cubic-bezier(0.23, 1, 0.32, 1) both; }
::view-transition-new(root) { animation: slapPpVtIn 320ms cubic-bezier(0.23, 1, 0.32, 1) both; }
::view-transition-group(.slap-pp-morph) { animation-duration: 440ms; animation-timing-function: cubic-bezier(0.32, 0.72, 0, 1); }
::view-transition-old(.slap-pp-morph),
::view-transition-new(.slap-pp-morph) { width: 100%; height: 100%; object-fit: cover; }
::view-transition-old(.slap-pp-morph) { animation: slapPpVtOut 200ms cubic-bezier(0.23, 1, 0.32, 1) both; }
::view-transition-new(.slap-pp-morph) { animation: slapPpVtIn 300ms cubic-bezier(0.23, 1, 0.32, 1) both; }
@keyframes slapPpVtOut { to { opacity: 0; } }
@keyframes slapPpVtIn { from { opacity: 0; } }

/* ---------- Hero entrance on arrival (once per page load; the scroll reveal below the fold is separate) ---------- */
@keyframes slapPpRise { from { opacity: 0; transform: translateY(12px); } }
@keyframes slapPpFade { from { opacity: 0; } }
@keyframes slapPpSettle { from { transform: scale(1.04); } }
@media (prefers-reduced-motion: no-preference) {
    .slap-pp:not(#\#) .slap-pp__hero-inner > * { animation: slapPpRise 460ms cubic-bezier(0.23, 1, 0.32, 1) backwards; }
    .slap-pp:not(#\#) .slap-pp__hero-inner > .slap-pp__eyebrow { animation-delay: 55ms; }
    .slap-pp:not(#\#) .slap-pp__hero-inner > .slap-pp__h1 { animation-delay: 110ms; }
    .slap-pp:not(#\#) .slap-pp__hero-inner > .slap-pp__answer { animation-delay: 165ms; }
    .slap-pp:not(#\#) .slap-pp__hero-inner > .slap-pp__ctas,
    .slap-pp:not(#\#) .slap-pp__hero-inner > .slap-pp__reassure { animation-delay: 220ms; }
    /* The photo settles once, decorative and rare: it may take longer */
    .slap-pp:not(#\#) .slap-pp__hero-img { animation: slapPpSettle 900ms cubic-bezier(0.23, 1, 0.32, 1) backwards; }
}
@media (prefers-reduced-motion: reduce) {
    .slap-pp:not(#\#) .slap-pp__hero-inner > * { animation: slapPpFade 200ms ease backwards; }
    /* Opacity only between pages: no card growing into a hero */
    .slap-pp:not(#\#) .slap-pp__hero,
    .slap-pp:not(#\#) .slap-pp__card--link { view-transition-name: none; }
    ::view-transition-old(root) { animation: slapPpVtOut 200ms ease both; }
    ::view-transition-new(root) { animation: slapPpVtIn 200ms ease both; }
}

/* ---------- Accessibility preferences ---------- */
@media (prefers-reduced-motion: reduce) {
    /* Keep colour and opacity feedback, drop movement */
    .slap-pp:not(#\#) .slap-pp__btn,
    .slap-pp:not(#\#) .slap-pp__btn i,
    .slap-pp:not(#\#) .slap-pp__card--link,
    .slap-pp:not(#\#) .slap-pp__link svg,
    .slap-pp:not(#\#) .slap-pp__faq summary::before,
    .slap-pp:not(#\#) .slap-pp__faq summary::after { transform: none !important; }
    .slap-pp:not(#\#) .slap-pp__faq-a { transition: none; }
    /* Reduced motion: the bar cross-fades in place instead of sliding */
    .slap-pp:not(#\#) .slap-pp__sticky { transform: none !important; transition: opacity 200ms ease, visibility 0s; }
    .slap-pp--bar:not(#\#) .slap-pp__sticky:not(.is-shown) { transform: none !important; opacity: 0; transition: opacity 200ms ease, visibility 0s linear 200ms; }
    .slap-pp:not(#\#) .slap-pp__rv { opacity: 1; transform: none; transition: none; }
}
@media (prefers-reduced-transparency: reduce) {
    .slap-pp:not(#\#) .slap-pp__sticky::before { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; top: 0; -webkit-mask-image: none; mask-image: none; box-shadow: 0 -1px 0 rgba(0, 23, 68, 0.12); }
    .slap-pp:not(#\#) .slap-pp__btn--ghost { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(0, 23, 68, 0.55); }
}
@media (prefers-contrast: more) {
    .slap-pp:not(#\#) .slap-pp__card,
    .slap-pp:not(#\#) .slap-pp__why-item,
    .slap-pp:not(#\#) .slap-pp__faq details { box-shadow: none; border: 1px solid #5D6577; }
    .slap-pp:not(#\#) .slap-pp__card--soft, .slap-pp:not(#\#) .slap-pp__price { box-shadow: inset 0 0 0 1px #5D6577; }
    .slap-pp:not(#\#) .slap-pp__btn--ghost { box-shadow: inset 0 0 0 2px #fff; }
    .slap-pp:not(#\#) .slap-pp__sticky::before { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; top: 0; -webkit-mask-image: none; mask-image: none; box-shadow: 0 -1px 0 #5D6577; }
    .slap-pp:not(#\#) .slap-pp__checks li + li { border-top-color: #8E94A2; }
}
@media print {
    .slap-pp:not(#\#) .slap-pp__rv { opacity: 1 !important; transform: none !important; }
    .slap-pp:not(#\#) .slap-pp__sticky { display: none !important; }
}