/* ================================================================
   Sourdosphère — landing-sub-refonte.css
   Habillage des landings Pro et Café signe (chargé après leur CSS).
   Aucun texte modifié.
   ================================================================ */
:root{--font:'Schibsted Grotesk',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;--papier:#F7F6F2;--carte-bord:#E6E4DC}

/* ── .pro-* ─────────────────────────────────────────────────── */
.pro-body { font-family: var(--font); background: var(--papier); color: #1e2a24; font-size: 15px; }
.pro-body h1,.pro-body h2,.pro-body h3 { font-weight: 600; letter-spacing: -0.02em; }
.pro-body :focus-visible { outline: 3px solid #1D9E75; outline-offset: 3px; }

.pro-nav { background: var(--papier); border-bottom: 1px solid var(--carte-bord); }
.pro-nav__inner { height: 62px; }
.pro-nav__logo { color: #1a3a2e; font-weight: 600; font-size: 1.2rem; letter-spacing: -0.02em; }
.pro-nav__logo span { color: #1D9E75; }
.pro-nav__logo em { text-transform: none; letter-spacing: 0; font-size: 0.72rem; font-weight: 600; color: #0a6b4e; background: #E1F5EE; border: 0; border-radius: 999px; padding: 0.15rem 0.6rem; line-height: 1.5; }
.pro-nav__back { color: #2d2d2a; font-weight: 500; }
.pro-nav__back:hover { color: #1a3a2e; text-decoration: underline; text-underline-offset: 4px; }
.pro-nav__cta { background: #1D9E75; color: #072016; font-weight: 600; border-radius: 10px; padding: 0.55rem 1.1rem; }
.pro-nav__cta:hover { background: #1a3a2e; color: #fff; }

.pro-btn-primary { background: #1D9E75; color: #072016; border-radius: 10px; font-weight: 600; }
.pro-btn-primary:hover { background: #1a3a2e; color: #fff; transform: none; }
.pro-btn-primary--lg { padding: 0.95rem 2rem; }

.pro-hero__kicker, .pro-section-kicker {
    text-transform: none; letter-spacing: 0; font-size: 0.85rem; font-weight: 600;
    color: #1a3a2e; background: #E1F5EE; display: inline-flex; padding: 0.3rem 0.8rem;
    border-radius: 999px; margin-bottom: 1.1rem;
}
.pro-hero__kicker::before { display: none; }
.pro-hero__title { font-weight: 600; letter-spacing: -0.03em; font-size: clamp(2rem, 4.2vw, 3.1rem); line-height: 1.08; }
.pro-section-title { font-weight: 600; letter-spacing: -0.02em; color: #1a3a2e; }

/* sections : cartes séparées, rayon 14px */
.pro-profiles__grid { gap: 1rem; border: 0; background: transparent; }
.pro-profile-card, .pro-profiles__grid .pro-profile-card:nth-child(2n), .pro-profiles__grid .pro-profile-card:nth-last-child(-n+2) {
    background: #fff; border: 1px solid var(--carte-bord); border-radius: 14px;
}
.pro-profile-card__icon { border-radius: 10px; }
.pro-profile-card h3 { font-weight: 600; font-size: 1.02rem; }

.pro-steps__grid { gap: 1rem; }
.pro-step { border-radius: 14px; }
.pro-step__num { border-radius: 999px; }
.pro-step__arrow { display: none; }

.pro-benefits__list { gap: 0.75rem; }
.pro-benefit { background: #fff; border: 1px solid var(--carte-bord); border-radius: 14px; padding: 1.1rem 1.25rem; }
.pro-benefit__icon { border-radius: 10px; }
.pro-benefit__body h3 { font-weight: 600; }

.pro-faq__list { gap: 0.6rem; }
.pro-faq__item { background: #fff; border: 1px solid var(--carte-bord); border-radius: 14px; }
.pro-faq__item summary { font-weight: 600; }

.pro-cta { background: #1a3a2e; }
.pro-cta h2 { font-weight: 600; letter-spacing: -0.02em; }
.pro-footer { background: #12281f; }

/* ── .cs-* ─────────────────────────────────────────────────── */
.cs-body { font-family: var(--font); background: var(--papier); color: #1e2a24; font-size: 15px; }
.cs-body h1,.cs-body h2,.cs-body h3 { font-weight: 600; letter-spacing: -0.02em; }
.cs-body :focus-visible { outline: 3px solid #1D9E75; outline-offset: 3px; }

.cs-nav { background: var(--papier); border-bottom: 1px solid var(--carte-bord); }
.cs-nav__inner { height: 62px; }
.cs-nav__logo { color: #1a3a2e; font-weight: 600; font-size: 1.2rem; letter-spacing: -0.02em; }
.cs-nav__logo span { color: #1D9E75; }
.cs-nav__logo em { text-transform: none; letter-spacing: 0; font-size: 0.72rem; font-weight: 600; color: #0a6b4e; background: #E1F5EE; border: 0; border-radius: 999px; padding: 0.15rem 0.6rem; line-height: 1.5; }
.cs-nav__back { color: #2d2d2a; font-weight: 500; }
.cs-nav__back:hover { color: #1a3a2e; text-decoration: underline; text-underline-offset: 4px; }
.cs-nav__cta { background: #1D9E75; color: #072016; font-weight: 600; border-radius: 10px; padding: 0.55rem 1.1rem; }
.cs-nav__cta:hover { background: #1a3a2e; color: #fff; }

.cs-btn-primary { background: #1D9E75; color: #072016; border-radius: 10px; font-weight: 600; }
.cs-btn-primary:hover { background: #1a3a2e; color: #fff; transform: none; }
.cs-btn-primary--lg { padding: 0.95rem 2rem; }

.cs-hero__kicker, .cs-section-kicker {
    text-transform: none; letter-spacing: 0; font-size: 0.85rem; font-weight: 600;
    color: #1a3a2e; background: #E1F5EE; display: inline-flex; padding: 0.3rem 0.8rem;
    border-radius: 999px; margin-bottom: 1.1rem;
}
.cs-hero__kicker::before { display: none; }
.cs-hero__title { font-weight: 600; letter-spacing: -0.03em; font-size: clamp(2rem, 4.2vw, 3.1rem); line-height: 1.08; }
.cs-section-title { font-weight: 600; letter-spacing: -0.02em; color: #1a3a2e; }

/* sections : cartes séparées, rayon 14px */
.cs-profiles__grid { gap: 1rem; border: 0; background: transparent; }
.cs-profile-card, .cs-profiles__grid .cs-profile-card:nth-child(2n), .cs-profiles__grid .cs-profile-card:nth-last-child(-n+2) {
    background: #fff; border: 1px solid var(--carte-bord); border-radius: 14px;
}
.cs-profile-card__icon { border-radius: 10px; }
.cs-profile-card h3 { font-weight: 600; font-size: 1.02rem; }

.cs-steps__grid { gap: 1rem; }
.cs-step { border-radius: 14px; }
.cs-step__num { border-radius: 999px; }
.cs-step__arrow { display: none; }

.cs-benefits__list { gap: 0.75rem; }
.cs-benefit { background: #fff; border: 1px solid var(--carte-bord); border-radius: 14px; padding: 1.1rem 1.25rem; }
.cs-benefit__icon { border-radius: 10px; }
.cs-benefit__body h3 { font-weight: 600; }

.cs-faq__list { gap: 0.6rem; }
.cs-faq__item { background: #fff; border: 1px solid var(--carte-bord); border-radius: 14px; }
.cs-faq__item summary { font-weight: 600; }

.cs-cta { background: #1a3a2e; }
.cs-cta h2 { font-weight: 600; letter-spacing: -0.02em; }
.cs-footer { background: #12281f; }

.pro-body{background:var(--papier)}
.pro-hero{background:var(--papier);padding:4rem 1.5rem 4.5rem}
.pro-hero__title{color:#1a3a2e}
.pro-hero__title em{color:#0a6b4e;font-style:normal}
.pro-hero__desc{color:#2d2d2a}
.pro-btn-ghost{color:#1a3a2e;border-bottom-color:#1a3a2e}
.pro-hero__reassurance{color:#4a5a52}
.pro-hero__reassurance svg{color:#1D9E75}
.pro-hero__card-caption{color:#5b6b63}
.pro-card-preview{border:1px solid var(--carte-bord);border-radius:14px;box-shadow:0 12px 32px rgba(26,58,46,.10)}
.pro-numbers{background:#fff;border-top:1px solid var(--carte-bord);border-bottom:1px solid var(--carte-bord)}
.pro-number__val{color:#1a3a2e;font-weight:600}
.pro-profiles,.pro-faq{background:var(--papier)}
.pro-benefits{background:#fff;border-top:1px solid var(--carte-bord)}
.pro-quote{background:var(--papier)}
.pro-quote__text{font-style:normal;font-weight:500;color:#1a3a2e}
.pro-profiles__grid .pro-profile-card{padding:1.5rem}

.cs-body{background:var(--papier)}
.cs-hero{background:#0f1f18;padding:4.5rem 1.5rem 4.5rem;border-radius:0 0 28px 28px}
.cs-hero__title{color:#fff}
.cs-hero__title em{color:#5fd0a8}
.cs-hero__kicker{background:rgba(159,225,203,.14);color:#9FE1CB}
.cs-nav{background:var(--papier)}
.cs-btn-primary{border-radius:10px;color:#072016}
.cs-btn-ghost{color:#cfe7dc}
.cs-intro{background:var(--papier);border-top:0}
.cs-intro__text p{color:#2d2d2a}
.cs-profiles{background:var(--papier)}
.cs-benefits{background:#fff;border-top:1px solid var(--carte-bord)}
.cs-faq{background:var(--papier);border-top:0}
.cs-cta{background:#0f1f18}
.cs-footer{background:#0b1812}

@media (max-width:700px){.pro-hero,.cs-hero{padding:2.5rem 1.25rem 3rem}.pro-profiles__grid,.cs-profiles__grid{grid-template-columns:1fr}}

.pro-benefit:last-child,.cs-benefit:last-child{border-bottom:1px solid var(--carte-bord)}

/* ── Hero = un écran exactement ───────────────────────────────── */
:root { --nav-h: 63px; }
.landing-body, .pro-body, .cs-body { padding-top: var(--staging-banner-h, 0px); }
.pro-nav, .cs-nav { top: var(--staging-banner-h, 0px); }
.pro-hero, .cs-hero {
    min-height: calc(100vh - var(--nav-h) - var(--staging-banner-h, 0px));
    min-height: calc(100svh - var(--nav-h) - var(--staging-banner-h, 0px));
    display: flex; flex-direction: column; justify-content: center; box-sizing: border-box;
}
.pro-hero__inner, .cs-hero__inner { width: 100%; }
.pro-hero { padding-top: 1.5rem; padding-bottom: 3rem; }
.cs-hero  { padding-top: 1.5rem; padding-bottom: 3rem; }

/* ── FAQ ──────────────────────────────────────────────────────── */
.pro-faq__item, .cs-faq__item { padding: 0; overflow: hidden; }
.pro-faq__item summary, .cs-faq__item summary { padding: 1.1rem 1.4rem; }
.pro-faq__item p, .cs-faq__item p { padding: 0 1.4rem 1.25rem; }

/* ── Café signe : intro alignée sur la grille 1100px ──────────── */
.cs-intro__inner {
    max-width: 1100px; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    column-gap: 4rem; align-items: start;
}
.cs-intro__inner .cs-section-kicker, .cs-intro__inner .cs-section-title { grid-column: 1; }
.cs-intro__inner .cs-section-title { margin-bottom: 0; }
.cs-intro__text { grid-column: 2; grid-row: 1 / span 3; }
.cs-intro__text p:first-child { margin-top: 0; }
.cs-intro { padding: 5rem 1.5rem; }
@media (max-width: 800px) {
    .cs-intro__inner { display: block; }
    .cs-intro__inner .cs-section-title { margin-bottom: 1.25rem; }
}
.cs-intro__inner .cs-section-kicker{justify-self:start}

/* ── Pro, mobile : le hero occupe l'écran, l'exemple de fiche vient dessous ── */
@media (max-width: 900px) {
    .pro-hero { display: block; min-height: 0; padding: 0; }
    .pro-hero__inner { display: block; padding: 0; max-width: none; }
    .pro-hero__content {
        box-sizing: border-box; padding: 2rem 1.25rem 2.5rem;
        min-height: calc(100vh - var(--nav-h) - var(--staging-banner-h, 0px));
        min-height: calc(100svh - var(--nav-h) - var(--staging-banner-h, 0px));
        display: flex; flex-direction: column; justify-content: center;
    }
    .pro-hero__card { padding: 0 1.25rem 3rem; }
    .pro-card-preview { display: block; }
}