/**
 * Page Comparatif — Loop vs Digiforma · Dendreo · Ypareo
 * Charte Loop : Inter / DM Sans, orange #ff8a4c, vert #1d9e75, ink #0c1222.
 * Tout est scopé sous .lxc-comparatif.
 *
 * @package Loop_Formation
 */

.lxc-comparatif {
    --lxcc-ink: #0c1222;
    --lxcc-soft: #3d4a63;
    --lxcc-muted: #64708b;
    --lxcc-line: rgba(12, 18, 34, 0.1);
    --lxcc-coral: #ff8a4c;
    --lxcc-coral-d: #ff6b2c;
    --lxcc-green: #1d9e75;
    --lxcc-green-d: #0e7d67;
    --lxcc-mint: #ecf6ef;
    --lxcc-warn: #c53030;
    --lxcc-warn-soft: #fef2f2;

    background: #fff;
    color: var(--lxcc-ink);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 16px;
    line-height: 1.6;
}

.lxc-comparatif *,
.lxc-comparatif *::before,
.lxc-comparatif *::after {
    box-sizing: border-box;
}

.lxc-comparatif .lxcc-shell {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

/* ─── HERO ─── */
.lxc-comparatif .lxcc-hero {
    padding: 80px 0 56px;
    background: linear-gradient(180deg, var(--lxcc-mint) 0%, #f6faf7 55%, #fff 100%);
    position: relative;
    overflow: hidden;
    text-align: center;
}

.lxc-comparatif .lxcc-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 50% at 85% 20%, rgba(255, 138, 76, 0.1), transparent 55%),
                radial-gradient(ellipse 50% 40% at 10% 30%, rgba(29, 158, 117, 0.12), transparent 50%);
    pointer-events: none;
}

.lxc-comparatif .lxcc-hero > * {
    position: relative;
    z-index: 1;
}

.lxc-comparatif .lxcc-hero__eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--lxcc-green);
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(29, 158, 117, 0.1);
    margin: 0 0 16px;
}

.lxc-comparatif .lxcc-hero__title {
    font-size: clamp(2rem, 5vw, 3.6rem);
    font-weight: 900;
    letter-spacing: -0.03em;
    line-height: 1.05;
    color: var(--lxcc-ink);
    margin: 0 auto 18px;
    max-width: 22ch;
}

.lxc-comparatif .lxcc-hero__title em {
    font-style: normal;
    color: var(--lxcc-coral);
    position: relative;
    display: inline-block;
}

.lxc-comparatif .lxcc-hero__title em::after {
    content: "";
    position: absolute;
    left: -4%;
    right: -4%;
    bottom: 6px;
    height: 12px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M2 7c30-6 60-6 96-3s60 3 100-2' fill='none' stroke='%23ff8a4c' stroke-width='9' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 100% 100%;
    z-index: -1;
    opacity: 0.5;
}

.lxc-comparatif .lxcc-hero__lead {
    max-width: 46rem;
    margin: 0 auto 28px;
    font-size: 1.1rem;
    line-height: 1.65;
    color: var(--lxcc-soft);
}

.lxc-comparatif .lxcc-hero__stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    max-width: 900px;
    margin: 40px auto 0;
}

@media (max-width: 720px) {
    .lxc-comparatif .lxcc-hero__stats {
        grid-template-columns: repeat(2, 1fr);
    }
}

.lxc-comparatif .lxcc-hero__stat {
    background: #fff;
    border: 1px solid var(--lxcc-line);
    border-radius: 16px;
    padding: 18px 16px;
    box-shadow: 0 12px 28px -18px rgba(12, 18, 34, 0.18);
}

.lxc-comparatif .lxcc-hero__stat-num {
    font-size: 1.75rem;
    font-weight: 900;
    color: var(--lxcc-green);
    letter-spacing: -0.02em;
    line-height: 1;
    margin: 0;
}

.lxc-comparatif .lxcc-hero__stat-lbl {
    font-size: 12px;
    font-weight: 600;
    color: var(--lxcc-soft);
    margin: 8px 0 0;
    line-height: 1.4;
}

/* ─── SECTION COMMUNS ─── */
.lxc-comparatif .lxcc-section {
    padding: 80px 0;
}

.lxc-comparatif .lxcc-section--alt {
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}

.lxc-comparatif .lxcc-section--dark {
    background: linear-gradient(180deg, #0c1222 0%, #151b2e 100%);
    color: #fff;
}

.lxc-comparatif .lxcc-section--dark .lxcc-section__title,
.lxc-comparatif .lxcc-section--dark .lxcc-section__deck {
    color: #fff;
}

.lxc-comparatif .lxcc-section--dark .lxcc-section__deck {
    color: rgba(232, 236, 244, 0.78);
}

.lxc-comparatif .lxcc-section__eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--lxcc-coral);
    margin: 0 0 12px;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255, 138, 76, 0.1);
}

.lxc-comparatif .lxcc-section__head {
    text-align: center;
    margin-bottom: 48px;
}

.lxc-comparatif .lxcc-section__title {
    font-size: clamp(1.75rem, 4vw, 2.6rem);
    font-weight: 900;
    letter-spacing: -0.03em;
    line-height: 1.05;
    color: var(--lxcc-ink);
    margin: 0 auto 14px;
    max-width: 26ch;
}

.lxc-comparatif .lxcc-section__title em {
    font-style: normal;
    color: var(--lxcc-coral);
}

.lxc-comparatif .lxcc-section__deck {
    max-width: 44rem;
    margin: 0 auto;
    font-size: 1rem;
    line-height: 1.65;
    color: var(--lxcc-soft);
}

/* ─── MATRIX TABLE ─── */
.lxc-comparatif .lxcc-matrix-wrap {
    background: #fff;
    border: 1px solid var(--lxcc-line);
    border-radius: 18px;
    box-shadow: 0 24px 48px -28px rgba(12, 18, 34, 0.18);
    overflow-x: auto;
}

.lxc-comparatif .lxcc-matrix {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    min-width: 860px;
}

.lxc-comparatif .lxcc-matrix thead th {
    background: #0c1222;
    color: #fff;
    padding: 18px 16px;
    text-align: left;
    font-weight: 700;
    font-size: 14px;
    position: sticky;
    top: 0;
}

.lxc-comparatif .lxcc-matrix thead th.is-loop {
    background: linear-gradient(135deg, var(--lxcc-green), var(--lxcc-green-d));
    position: relative;
}

.lxc-comparatif .lxcc-matrix thead th.is-loop::after {
    content: "★ RECOMMANDÉ";
    position: absolute;
    top: 6px;
    right: 10px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.12em;
    background: #fff;
    color: var(--lxcc-green);
    padding: 2px 6px;
    border-radius: 4px;
}

.lxc-comparatif .lxcc-matrix th .brand {
    display: block;
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 2px;
}

.lxc-comparatif .lxcc-matrix th .meta {
    display: block;
    font-size: 11px;
    font-weight: 500;
    opacity: 0.7;
}

.lxc-comparatif .lxcc-matrix tbody tr {
    border-top: 1px solid var(--lxcc-line);
}

.lxc-comparatif .lxcc-matrix tbody tr:hover {
    background: #fafbfc;
}

.lxc-comparatif .lxcc-matrix tbody td {
    padding: 14px 16px;
    vertical-align: top;
    font-size: 13.5px;
}

.lxc-comparatif .lxcc-matrix tbody tr td:first-child {
    font-weight: 700;
    color: var(--lxcc-ink);
    background: #fafbfc;
    width: 28%;
    border-right: 1px solid var(--lxcc-line);
}

.lxc-comparatif .lxcc-matrix tbody tr td.is-loop {
    background: rgba(29, 158, 117, 0.05);
    font-weight: 600;
    border-right: 1px solid rgba(29, 158, 117, 0.18);
}

.lxc-comparatif .lxcc-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    padding: 3px 9px;
    border-radius: 999px;
}

.lxc-comparatif .lxcc-badge-yes {
    background: rgba(29, 158, 117, 0.16);
    color: var(--lxcc-green);
}

.lxc-comparatif .lxcc-badge-paid {
    background: rgba(255, 138, 76, 0.16);
    color: var(--lxcc-coral);
}

.lxc-comparatif .lxcc-badge-no {
    background: rgba(197, 48, 48, 0.12);
    color: var(--lxcc-warn);
}

.lxc-comparatif .lxcc-badge-partial {
    background: rgba(245, 158, 11, 0.16);
    color: #b45309;
}

.lxc-comparatif .lxcc-cell-note {
    display: block;
    font-size: 11.5px;
    font-weight: 500;
    color: var(--lxcc-muted);
    margin-top: 4px;
    line-height: 1.4;
}

/* ─── DIFFERENTIATORS (cards, short) ─── */
.lxc-comparatif .lxcc-diff-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 32px;
}

@media (max-width: 900px) {
    .lxc-comparatif .lxcc-diff-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 560px) {
    .lxc-comparatif .lxcc-diff-grid {
        grid-template-columns: 1fr;
    }
}

.lxc-comparatif .lxcc-diff-card {
    padding: 26px 22px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--lxcc-line);
    box-shadow: 0 16px 36px -22px rgba(12, 18, 34, 0.18);
    transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
}

.lxc-comparatif .lxcc-diff-card:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 138, 76, 0.4);
    box-shadow: 0 24px 48px -22px rgba(255, 138, 76, 0.28);
}

.lxc-comparatif .lxcc-diff-card__ico {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--lxcc-green), var(--lxcc-green-d));
    color: #fff;
    font-size: 22px;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.lxc-comparatif .lxcc-diff-card h3 {
    margin: 0 0 10px;
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--lxcc-ink);
    line-height: 1.3;
}

.lxc-comparatif .lxcc-diff-card p {
    margin: 0;
    font-size: 14px;
    color: var(--lxcc-soft);
    line-height: 1.55;
}

/* ─── PRICING CARDS ─── */
.lxc-comparatif .lxcc-pricing {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

@media (max-width: 900px) {
    .lxc-comparatif .lxcc-pricing {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 560px) {
    .lxc-comparatif .lxcc-pricing {
        grid-template-columns: 1fr;
    }
}

.lxc-comparatif .lxcc-price {
    padding: 26px 22px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--lxcc-line);
    box-shadow: 0 16px 36px -22px rgba(12, 18, 34, 0.16);
    display: flex;
    flex-direction: column;
}

.lxc-comparatif .lxcc-price.is-loop {
    background: linear-gradient(165deg, var(--lxcc-green), var(--lxcc-green-d));
    color: #fff;
    border-color: var(--lxcc-green);
    box-shadow: 0 28px 56px -24px rgba(29, 158, 117, 0.4);
    position: relative;
}

.lxc-comparatif .lxcc-price.is-loop::before {
    content: "★ Loop, le tout-inclus";
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--lxcc-coral);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    padding: 5px 12px;
    border-radius: 999px;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.lxc-comparatif .lxcc-price__brand {
    font-size: 1.1rem;
    font-weight: 900;
    margin-bottom: 4px;
    color: inherit;
}

.lxc-comparatif .lxcc-price__plan {
    font-size: 12px;
    font-weight: 700;
    color: var(--lxcc-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 14px;
}

.lxc-comparatif .lxcc-price.is-loop .lxcc-price__plan {
    color: rgba(255, 255, 255, 0.8);
}

.lxc-comparatif .lxcc-price__tag {
    font-size: 2.2rem;
    font-weight: 900;
    letter-spacing: -0.03em;
    line-height: 1;
    margin: 0 0 4px;
}

.lxc-comparatif .lxcc-price__tag small {
    font-size: 0.55em;
    color: var(--lxcc-muted);
    font-weight: 700;
}

.lxc-comparatif .lxcc-price.is-loop .lxcc-price__tag small {
    color: rgba(255, 255, 255, 0.75);
}

.lxc-comparatif .lxcc-price__detail {
    font-size: 12px;
    font-weight: 600;
    color: var(--lxcc-muted);
    margin-bottom: 18px;
    line-height: 1.5;
}

.lxc-comparatif .lxcc-price.is-loop .lxcc-price__detail {
    color: rgba(255, 255, 255, 0.85);
}

.lxc-comparatif .lxcc-price__list {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
}

.lxc-comparatif .lxcc-price__list li {
    font-size: 13px;
    padding: 6px 0 6px 22px;
    position: relative;
    color: var(--lxcc-soft);
    line-height: 1.45;
}

.lxc-comparatif .lxcc-price.is-loop .lxcc-price__list li {
    color: rgba(255, 255, 255, 0.92);
}

.lxc-comparatif .lxcc-price__list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--lxcc-green);
    font-weight: 900;
}

.lxc-comparatif .lxcc-price.is-loop .lxcc-price__list li::before {
    color: #7FD1B9;
}

.lxc-comparatif .lxcc-price__list li.neg {
    color: var(--lxcc-warn);
}

.lxc-comparatif .lxcc-price__list li.neg::before {
    content: "+";
    color: var(--lxcc-coral);
    font-weight: 900;
}

/* ─── REAL CALC (Loop vs Digiforma side-by-side) ─── */
.lxc-comparatif .lxcc-realcalc {
    background: #fff;
    border: 1px solid var(--lxcc-line);
    border-radius: 22px;
    overflow: hidden;
    margin-top: 32px;
    box-shadow: 0 24px 48px -28px rgba(12, 18, 34, 0.2);
}

.lxc-comparatif .lxcc-realcalc__head {
    padding: 28px 32px 12px;
    text-align: center;
}

.lxc-comparatif .lxcc-realcalc__title {
    font-size: 1.25rem;
    font-weight: 900;
    margin: 0;
}

.lxc-comparatif .lxcc-realcalc__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--lxcc-line);
}

@media (max-width: 720px) {
    .lxc-comparatif .lxcc-realcalc__grid {
        grid-template-columns: 1fr;
    }
}

.lxc-comparatif .lxcc-realcalc__col {
    padding: 32px;
}

.lxc-comparatif .lxcc-realcalc__col + .lxcc-realcalc__col {
    background: linear-gradient(165deg, var(--lxcc-green), var(--lxcc-green-d));
    color: #fff;
}

@media (min-width: 721px) {
    .lxc-comparatif .lxcc-realcalc__col + .lxcc-realcalc__col {
        border-left: 1px solid rgba(255, 255, 255, 0.15);
    }
}

.lxc-comparatif .lxcc-realcalc__col-lbl {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--lxcc-muted);
    margin-bottom: 18px;
}

.lxc-comparatif .lxcc-realcalc__col + .lxcc-realcalc__col .lxcc-realcalc__col-lbl {
    color: rgba(255, 255, 255, 0.7);
}

.lxc-comparatif .lxcc-realcalc__table {
    width: 100%;
    font-size: 14px;
    border-collapse: collapse;
}

.lxc-comparatif .lxcc-realcalc__table tr {
    border-bottom: 1px dotted rgba(12, 18, 34, 0.12);
}

.lxc-comparatif .lxcc-realcalc__col + .lxcc-realcalc__col .lxcc-realcalc__table tr {
    border-bottom-color: rgba(255, 255, 255, 0.2);
}

.lxc-comparatif .lxcc-realcalc__table td {
    padding: 10px 0;
}

.lxc-comparatif .lxcc-realcalc__table td:last-child {
    text-align: right;
    font-weight: 700;
}

.lxc-comparatif .lxcc-realcalc__total td {
    border-top: 2px solid var(--lxcc-ink);
    padding-top: 14px !important;
    font-weight: 800;
    font-size: 15px;
    color: var(--lxcc-warn);
}

.lxc-comparatif .lxcc-realcalc__col + .lxcc-realcalc__col .lxcc-realcalc__total td {
    border-top-color: rgba(255, 255, 255, 0.4);
    color: #fff;
}

.lxc-comparatif .lxcc-realcalc__total td:last-child {
    font-size: 1.5rem;
    font-weight: 900;
}

.lxc-comparatif .lxcc-realcalc__notes {
    font-size: 11px;
    color: var(--lxcc-muted);
    margin: 14px 0 0;
    line-height: 1.5;
    font-style: italic;
}

.lxc-comparatif .lxcc-realcalc__col + .lxcc-realcalc__col .lxcc-realcalc__notes {
    color: rgba(255, 255, 255, 0.78);
}

/* ─── FINAL CTA ─── */
.lxc-comparatif .lxcc-final-cta {
    background: linear-gradient(165deg, #0c1222, #1a2235);
    color: #fff;
    padding: 96px 0;
    text-align: center;
}

.lxc-comparatif .lxcc-final-cta h2 {
    font-size: clamp(1.75rem, 4vw, 2.6rem);
    font-weight: 900;
    line-height: 1.1;
    margin: 0 auto 18px;
    max-width: 26ch;
}

.lxc-comparatif .lxcc-final-cta h2 em {
    font-style: normal;
    color: #7FD1B9;
}

.lxc-comparatif .lxcc-final-cta p {
    color: rgba(255, 255, 255, 0.78);
    max-width: 42rem;
    margin: 0 auto 32px;
    font-size: 1rem;
}

.lxc-comparatif .lxcc-cta-btns {
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
}

.lxc-comparatif .lxcc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 16px 28px;
    border-radius: 12px;
    font-weight: 800;
    font-size: 15px;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
    border: 1px solid transparent;
    cursor: pointer;
}

.lxc-comparatif .lxcc-btn-primary {
    background: linear-gradient(135deg, var(--lxcc-coral), var(--lxcc-coral-d));
    color: #fff;
    box-shadow: 0 16px 32px -12px rgba(255, 138, 76, 0.55);
}

.lxc-comparatif .lxcc-btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 40px -12px rgba(255, 138, 76, 0.7);
}

.lxc-comparatif .lxcc-btn-ghost {
    color: #fff;
    background: transparent;
    border-color: rgba(255, 255, 255, 0.3);
}

.lxc-comparatif .lxcc-btn-ghost:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.5);
}

/* ============ CALCULATEUR INTERACTIF — light + brand ============ */
.lxc-comparatif .lxcc-calc {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 0;
    background: #fff;
    border: 1px solid var(--lxcc-line);
    border-radius: 22px;
    overflow: hidden;
    margin-top: 40px;
    box-shadow: 0 32px 64px -28px rgba(12, 18, 34, 0.22);
}

@media (max-width: 900px) {
    .lxc-comparatif .lxcc-calc {
        grid-template-columns: 1fr;
    }
}

.lxc-comparatif .lxcc-calc__controls {
    padding: 40px 36px;
    border-right: 1px solid var(--lxcc-line);
    background: linear-gradient(180deg, #fafbff 0%, #fff 100%);
}

@media (max-width: 900px) {
    .lxc-comparatif .lxcc-calc__controls {
        border-right: none;
        border-bottom: 1px solid var(--lxcc-line);
    }
}

.lxc-comparatif .lxcc-calc__results {
    padding: 40px 36px;
    background: #fff;
}

.lxc-comparatif .lxcc-calc__block { margin-bottom: 32px; }
.lxc-comparatif .lxcc-calc__block:last-child { margin-bottom: 0; }

.lxc-comparatif .lxcc-calc__label {
    display: block;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--lxcc-coral);
    font-weight: 900;
    margin-bottom: 14px;
}

.lxc-comparatif .lxcc-calc__slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px;
    background: linear-gradient(90deg, var(--lxcc-coral) 0%, var(--lxcc-coral) 50%, #e2e8f0 50%, #e2e8f0 100%);
    outline: none;
    margin: 14px 0 8px;
    border-radius: 4px;
}

.lxc-comparatif .lxcc-calc__slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 26px;
    height: 26px;
    background: #fff;
    cursor: pointer;
    border-radius: 50%;
    border: 4px solid var(--lxcc-coral);
    box-shadow: 0 6px 16px -4px rgba(255, 138, 76, 0.55);
}

.lxc-comparatif .lxcc-calc__slider::-moz-range-thumb {
    width: 26px; height: 26px;
    background: #fff;
    cursor: pointer;
    border-radius: 50%;
    border: 4px solid var(--lxcc-coral);
    box-shadow: 0 6px 16px -4px rgba(255, 138, 76, 0.55);
}

.lxc-comparatif .lxcc-calc__slider-value {
    font-size: 2.1rem;
    font-weight: 900;
    color: var(--lxcc-ink);
    letter-spacing: -0.03em;
    line-height: 1.1;
}

.lxc-comparatif .lxcc-calc__slider-range {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: var(--lxcc-muted);
    letter-spacing: 0.08em;
    margin-top: 6px;
    font-weight: 700;
    text-transform: uppercase;
}

.lxc-comparatif .lxcc-calc__toggles {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

@media (max-width: 560px) {
    .lxc-comparatif .lxcc-calc__toggles {
        grid-template-columns: 1fr;
    }
}

.lxc-comparatif .lxcc-calc__toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid var(--lxcc-line);
    border-radius: 10px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, color 0.15s, box-shadow 0.15s;
    font-size: 14px;
    color: var(--lxcc-soft);
    user-select: none;
    font-weight: 600;
}

.lxc-comparatif .lxcc-calc__toggle:hover {
    border-color: var(--lxcc-coral);
    color: var(--lxcc-ink);
    box-shadow: 0 4px 12px -6px rgba(255, 138, 76, 0.4);
}

.lxc-comparatif .lxcc-calc__toggle input {
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border: 1.5px solid var(--lxcc-muted);
    background: transparent;
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
}

.lxc-comparatif .lxcc-calc__toggle input:checked {
    background: var(--lxcc-coral);
    border-color: var(--lxcc-coral);
}

.lxc-comparatif .lxcc-calc__toggle input:checked::after {
    content: "✓";
    position: absolute;
    color: #fff;
    font-size: 14px;
    font-weight: 900;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    line-height: 1;
}

.lxc-comparatif .lxcc-calc__toggle.is-on {
    background: rgba(255, 138, 76, 0.06);
    border-color: var(--lxcc-coral);
    color: var(--lxcc-ink);
    font-weight: 700;
}

/* === Résultats === */
.lxc-comparatif .lxcc-calc__results .lxcc-calc__label {
    color: var(--lxcc-muted);
    margin-bottom: 18px;
}

.lxc-comparatif .lxcc-calc__row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 22px 0;
    gap: 18px;
    border-bottom: 1px solid var(--lxcc-line);
}

.lxc-comparatif .lxcc-calc__row:last-of-type { border-bottom: none; }

.lxc-comparatif .lxcc-calc__row.is-loop {
    margin: -8px -18px;
    padding: 22px 18px;
    background: linear-gradient(90deg, rgba(29, 158, 117, 0.07), rgba(29, 158, 117, 0.02));
    border-left: 4px solid var(--lxcc-green);
    border-radius: 12px;
    border-bottom: 1px solid var(--lxcc-line);
}

.lxc-comparatif .lxcc-calc__brand {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.lxc-comparatif .lxcc-calc__brand-name {
    font-size: 1.15rem;
    font-weight: 900;
    color: var(--lxcc-ink);
    letter-spacing: -0.01em;
}

.lxc-comparatif .lxcc-calc__brand-plan {
    font-size: 12px;
    color: var(--lxcc-muted);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.lxc-comparatif .lxcc-calc__missing {
    list-style: none;
    margin: 8px 0 0;
    padding: 0;
}

.lxc-comparatif .lxcc-calc__missing li {
    font-size: 12px;
    color: var(--lxcc-coral);
    font-weight: 700;
    padding: 3px 0;
    line-height: 1.4;
}

.lxc-comparatif .lxcc-calc__price-cell {
    text-align: right;
    flex-shrink: 0;
}

.lxc-comparatif .lxcc-calc__price {
    display: block;
    font-size: 2.4rem;
    font-weight: 900;
    color: var(--lxcc-ink);
    line-height: 1;
    letter-spacing: -0.04em;
}

.lxc-comparatif .lxcc-calc__row.is-loop .lxcc-calc__price {
    color: var(--lxcc-green);
}

.lxc-comparatif .lxcc-calc__price-unit {
    display: block;
    font-size: 11px;
    color: var(--lxcc-muted);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 4px;
    font-weight: 800;
}

.lxc-comparatif .lxcc-calc__price-extra {
    display: block;
    font-size: 12px;
    color: var(--lxcc-coral);
    margin-top: 6px;
    font-weight: 800;
}

.lxc-comparatif .lxcc-calc__vs {
    margin: 32px 0 0;
    padding: 20px 24px;
    background: linear-gradient(135deg, rgba(255, 138, 76, 0.06), rgba(29, 158, 117, 0.04));
    border: 1px dashed var(--lxcc-coral);
    border-radius: 14px;
    text-align: center;
    font-size: 16px;
    color: var(--lxcc-ink);
    line-height: 1.55;
    font-weight: 600;
}

.lxc-comparatif .lxcc-calc__vs strong {
    color: var(--lxcc-green);
    font-size: 1.35em;
    font-weight: 900;
    letter-spacing: -0.02em;
}

.lxc-comparatif .lxcc-calc__disclaimer {
    margin: 18px 0 0;
    font-size: 12px;
    color: var(--lxcc-muted);
    line-height: 1.6;
    font-style: italic;
}

.lxc-comparatif .lxcc-calc__disclaimer a { color: var(--lxcc-coral); }

/* La section ".lxcc-section--dark" qui contient le calc devient plus douce */
.lxc-comparatif .lxcc-section--dark {
    background: linear-gradient(180deg, #1a2235 0%, #0c1222 100%);
}

.lxc-comparatif .lxcc-section--dark .lxcc-section__title em {
    color: var(--lxcc-coral);
}

.lxc-comparatif .lxcc-section--dark .lxcc-section__eyebrow {
    color: var(--lxcc-coral) !important;
    background: rgba(255, 138, 76, 0.14) !important;
}

/* =====================================================================
   PAGE SIMULATEUR — additions spécifiques (breadcrumb, TL;DR, FAQ, why)
   ===================================================================== */
.lxc-comparatif .lxc-sim-breadcrumb {
    font-size: 12px;
    margin: 0 0 24px;
}

.lxc-comparatif .lxc-sim-breadcrumb ol {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    justify-content: center;
}

.lxc-comparatif .lxc-sim-breadcrumb li {
    color: var(--lxcc-muted);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
}

.lxc-comparatif .lxc-sim-breadcrumb li + li::before {
    content: "›";
    color: var(--lxcc-muted);
    margin-right: 2px;
}

.lxc-comparatif .lxc-sim-breadcrumb a {
    color: var(--lxcc-green);
    text-decoration: none;
}

.lxc-comparatif .lxc-sim-breadcrumb a:hover {
    text-decoration: underline;
}

/* TL;DR — encart résumé en haut, ciblé pour les moteurs IA */
/* === TL;DR structuré : headline + grille de cartes prix === */
.lxc-comparatif .lxc-sim-tldr {
    max-width: 980px;
    margin: 40px auto 0;
    padding: 24px 28px 22px;
    background: #fff;
    border: 1px solid var(--lxcc-line);
    border-left: 5px solid var(--lxcc-coral);
    border-radius: 16px;
    text-align: left;
    box-shadow: 0 20px 40px -22px rgba(12, 18, 34, 0.18);
}

.lxc-comparatif .lxc-sim-tldr__label {
    margin: 0 0 10px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--lxcc-coral);
}

.lxc-comparatif .lxc-sim-tldr__headline {
    margin: 0 0 18px;
    font-size: 15px;
    line-height: 1.55;
    color: var(--lxcc-soft);
}

.lxc-comparatif .lxc-sim-tldr__headline strong {
    color: var(--lxcc-ink);
    font-weight: 800;
}

/* Grille — 4 colonnes par défaut (simulateur), 2 colonnes pour les pages alt */
.lxc-comparatif .lxc-sim-tldr__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.lxc-comparatif .lxc-sim-tldr__grid--two {
    grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 760px) {
    .lxc-comparatif .lxc-sim-tldr__grid,
    .lxc-comparatif .lxc-sim-tldr__grid--two {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 440px) {
    .lxc-comparatif .lxc-sim-tldr__grid,
    .lxc-comparatif .lxc-sim-tldr__grid--two {
        grid-template-columns: 1fr;
    }
}

/* Carte prix — sobre, scannable */
.lxc-comparatif .lxc-sim-tldr__item {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 14px 14px 12px;
    background: #fafbfc;
    border: 1px solid var(--lxcc-line);
    border-radius: 12px;
    position: relative;
    text-align: left;
}

.lxc-comparatif .lxc-sim-tldr__item.is-loop {
    background: linear-gradient(165deg, var(--lxcc-green), var(--lxcc-green-d));
    color: #fff;
    border-color: var(--lxcc-green);
    box-shadow: 0 14px 28px -16px rgba(29, 158, 117, 0.5);
}

.lxc-comparatif .lxc-sim-tldr__brand {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--lxcc-muted);
}

.lxc-comparatif .lxc-sim-tldr__item.is-loop .lxc-sim-tldr__brand {
    color: rgba(255, 255, 255, 0.78);
}

.lxc-comparatif .lxc-sim-tldr__price {
    font-size: 1.7rem;
    font-weight: 900;
    letter-spacing: -0.03em;
    line-height: 1;
    color: var(--lxcc-ink);
    margin: 4px 0 0;
}

.lxc-comparatif .lxc-sim-tldr__item.is-loop .lxc-sim-tldr__price {
    color: #fff;
}

.lxc-comparatif .lxc-sim-tldr__unit {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lxcc-muted);
    margin-bottom: 6px;
}

.lxc-comparatif .lxc-sim-tldr__item.is-loop .lxc-sim-tldr__unit {
    color: rgba(255, 255, 255, 0.78);
}

.lxc-comparatif .lxc-sim-tldr__note {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--lxcc-soft);
    line-height: 1.4;
    margin-top: auto;
}

.lxc-comparatif .lxc-sim-tldr__item.is-loop .lxc-sim-tldr__note {
    color: rgba(255, 255, 255, 0.92);
}

.lxc-comparatif .lxc-sim-tldr__foot {
    margin: 16px 0 0;
    font-size: 12.5px;
    font-style: italic;
    color: var(--lxcc-muted);
    line-height: 1.5;
}

/* FAQ section (FAQPage schema) */
.lxc-comparatif .lxc-sim-faq {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lxc-comparatif .lxc-sim-faq__item {
    background: #fff;
    border: 1px solid var(--lxcc-line);
    border-radius: 14px;
    box-shadow: 0 8px 20px -16px rgba(12, 18, 34, 0.14);
    overflow: hidden;
}

.lxc-comparatif .lxc-sim-faq__item summary {
    list-style: none;
    cursor: pointer;
    padding: 18px 22px;
    font-size: 16px;
    font-weight: 800;
    color: var(--lxcc-ink);
    position: relative;
    padding-right: 56px;
    transition: background 0.18s ease;
}

.lxc-comparatif .lxc-sim-faq__item summary::-webkit-details-marker { display: none; }
.lxc-comparatif .lxc-sim-faq__item summary::after {
    content: "+";
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255, 138, 76, 0.12);
    color: var(--lxcc-coral);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 900;
    transition: transform 0.22s ease, background 0.22s ease;
}

.lxc-comparatif .lxc-sim-faq__item[open] summary::after {
    content: "−";
    background: var(--lxcc-coral);
    color: #fff;
}

.lxc-comparatif .lxc-sim-faq__item:hover summary {
    background: #fafbfc;
}

.lxc-comparatif .lxc-sim-faq__a {
    padding: 18px 24px 24px;
    font-size: 15px;
    line-height: 1.75;
    color: var(--lxcc-soft);
    border-top: 1px solid var(--lxcc-line);
    background: #fcfdfe;
    text-align: left;
    word-break: normal;
    overflow-wrap: break-word;
    hyphens: none;
}

.lxc-comparatif .lxc-sim-faq__a p {
    margin: 0 0 12px;
    color: var(--lxcc-soft);
}

.lxc-comparatif .lxc-sim-faq__a p:last-child {
    margin-bottom: 0;
}

.lxc-comparatif .lxc-sim-faq__a strong,
.lxc-comparatif .lxc-sim-faq__a b {
    color: var(--lxcc-ink);
    font-weight: 800;
}

/* Listes structurées dans une réponse FAQ (quand on a des chiffres) */
.lxc-comparatif .lxc-sim-faq__a ul,
.lxc-comparatif .lxc-sim-faq__a ol {
    margin: 10px 0 14px;
    padding-left: 22px;
}

.lxc-comparatif .lxc-sim-faq__a li {
    margin: 0 0 6px;
    line-height: 1.65;
}

.lxc-comparatif .lxc-sim-faq__a li:last-child {
    margin-bottom: 0;
}

.lxc-comparatif .lxc-sim-faq__a li strong {
    color: var(--lxcc-coral);
}

.lxc-comparatif .lxc-sim-faq__a a {
    color: var(--lxcc-green);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

/* Lit le défilement de la liste numérique d'options (ex : Q3 frais cachés) */
.lxc-comparatif .lxc-sim-faq__a em {
    font-style: normal;
    color: var(--lxcc-muted);
    font-size: 0.95em;
}

/* Why (dl liste) */
.lxc-comparatif .lxc-sim-why {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    max-width: 880px;
    margin: 0 auto;
}

.lxc-comparatif .lxc-sim-why__item {
    background: #fff;
    border: 1px solid var(--lxcc-line);
    border-radius: 16px;
    padding: 24px 26px;
    box-shadow: 0 16px 36px -22px rgba(12, 18, 34, 0.18);
}

.lxc-comparatif .lxc-sim-why__item dt {
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--lxcc-ink);
    margin: 0 0 10px;
    line-height: 1.3;
}

.lxc-comparatif .lxc-sim-why__item dd {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--lxcc-soft);
}