/* Page commune ClimaScore. Externalise depuis seo/commune.html
   (etait 59.6 Ko de CSS inline repete sur ~525K pages) pour la mise en
   cache navigateur + un crawl plus rapide. Statique, tokens via _tokens.css. */
/* =================================================================== */
/*  PAGE COMMUNE PREMIUM : design tokens partages avec PDF             */
/*  Tous les styles utilisent les variables --ed-* / --space-* / etc.  */
/* =================================================================== */

.pc-page { padding-bottom: var(--space-16); }

/* Fil d'Ariane sobre */
.pc-crumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
    padding: var(--space-4) 0;
    font-size: var(--text-small);
    color: var(--ed-mute);
}
.pc-crumbs a { color: var(--ed-mute); text-decoration: none; }
.pc-crumbs a:hover { color: var(--ed-forest); text-decoration: underline; }
.pc-crumbs .sep { color: var(--ed-line-strong); }
.pc-crumbs [aria-current] { color: var(--ed-graphite); font-weight: 600; }

/* ============== Bandeau Niveau d'analyse (asymetrie pedagogique) =====
   Ancrage entre le hero et les sections data. Montre :
   - colonne gauche (sobre, blanc) : ce que la commune apporte
   - separateur central : un grand "+7" qui acte la promesse
   - colonne droite (teal premium + halo) : la cle qui ouvre 7
     indicateurs supplementaires + prix promo proeminent.
   La typographie monumentale, le halo discret et la promo barree
   donnent un effet "donner envie" sans tomber dans le hard sell. */
.pc-precision {
    position: relative;
    margin: 0 0 var(--space-9);
    padding: var(--space-8) var(--space-6);
    background:
        radial-gradient(circle at 0% 0%, var(--cs-teal-soft, #DCEEED) 0%, transparent 40%),
        radial-gradient(circle at 100% 100%, var(--cs-accent-soft, #FBE5D6) 0%, transparent 40%),
        var(--ed-paper, #FAF7F1);
    border: 1px solid var(--ed-line);
    border-radius: 20px;
    box-shadow: 0 4px 24px rgba(8,64,62,0.06), 0 1px 3px rgba(0,0,0,0.04);
    overflow: hidden;
}
.pc-precision::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(to right, rgba(127,184,182,0.08) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
    opacity: 0.5;
}
.pc-precision__inner { position: relative; max-width: 1080px; margin: 0 auto; }
.pc-precision__head { text-align: center; margin-bottom: var(--space-8); }
.pc-precision__eyebrow {
    font-family: var(--font-mono);
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--cs-teal, var(--ed-forest));
    display: inline-block;
    margin-bottom: var(--space-3);
    padding: 0.2rem 0.7rem;
    background: var(--cs-teal-soft, #DCEEED);
    border-radius: 999px;
}
.pc-precision__title {
    font-family: var(--font-display, var(--font-display-fallback));
    font-size: clamp(1.6rem, 2.6vw, 2.25rem);
    font-weight: 700;
    line-height: 1.22;
    color: var(--ed-graphite);
    margin: 0 0 var(--space-3);
    letter-spacing: -0.01em;
}
.pc-precision__title em {
    font-style: normal;
    color: var(--cs-teal-deep, #08403E);
    background: linear-gradient(transparent 65%, var(--cs-teal-soft, #DCEEED) 65%);
    padding: 0 0.15em;
}
.pc-precision__sub {
    font-family: var(--font-mono, monospace);
    font-size: 0.75rem;
    color: var(--ed-mute);
    letter-spacing: 0.02em;
    margin: 0;
}
.pc-precision__grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: var(--space-5);
    align-items: stretch;
}
.pc-precision__col {
    position: relative;
    padding: var(--space-6);
    border-radius: 16px;
    background: #fff;
    border: 1px solid var(--ed-line);
    display: flex;
    flex-direction: column;
    transition: transform 0.2s, box-shadow 0.2s;
}
.pc-precision__col--upgrade {
    background: linear-gradient(160deg, var(--cs-teal-deep, #08403E) 0%, var(--cs-teal, #0E5E5C) 100%);
    border-color: var(--cs-teal-deep, #08403E);
    color: #F1FAFA;
    box-shadow: 0 12px 32px -8px rgba(8,64,62,0.35);
    transform: translateY(-4px);
}
.pc-precision__col--upgrade:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px -10px rgba(8,64,62,0.45);
}
.pc-precision__col-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: var(--space-3);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--ed-line);
}
.pc-precision__col--upgrade .pc-precision__col-head {
    border-bottom-color: rgba(255,255,255,0.15);
}
.pc-precision__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
}
.pc-precision__badge--commune {
    background: var(--ed-paper-2, #F1ECE0);
    color: var(--ed-graphite);
}
.pc-precision__badge--adresse {
    background: rgba(255,255,255,0.18);
    color: #fff;
    backdrop-filter: blur(4px);
}
.pc-precision__col-count {
    font-family: var(--font-mono, monospace);
    font-size: 0.75rem;
    color: var(--ed-mute);
    letter-spacing: 0.04em;
}
.pc-precision__col--upgrade .pc-precision__col-count {
    color: rgba(255,255,255,0.7);
}
.pc-precision__col-count--bold {
    font-weight: 700;
    color: var(--cs-accent-soft, #FBE5D6) !important;
}
.pc-precision__col-lead {
    font-size: 0.9375rem;
    color: var(--ed-mute);
    margin: 0 0 var(--space-4);
    line-height: 1.55;
}
.pc-precision__col--upgrade .pc-precision__col-lead {
    color: rgba(255,255,255,0.82);
}
.pc-precision__col-lead em {
    font-style: normal;
    font-weight: 700;
    color: var(--ed-graphite);
}
.pc-precision__col--upgrade .pc-precision__col-lead em {
    color: #fff;
}
.pc-precision__list {
    list-style: none;
    padding: 0;
    margin: 0;
    flex: 1;
}
.pc-precision__list li {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: var(--ed-ink);
    padding: 0.55rem 0;
    border-bottom: 1px dashed var(--ed-line);
}
.pc-precision__list li:last-child { border-bottom: none; }
.pc-precision__col--upgrade .pc-precision__list li {
    color: rgba(255,255,255,0.94);
    border-bottom-color: rgba(255,255,255,0.12);
}
.pc-precision__check,
.pc-precision__plus {
    font-weight: 700;
    flex-shrink: 0;
    width: 1.4rem;
    height: 1.4rem;
    line-height: 1.4rem;
    text-align: center;
    border-radius: 50%;
    font-size: 0.85rem;
}
.pc-precision__check {
    color: var(--ed-forest, #1F5A3D);
    background: var(--ed-forest-soft, #E6F0EA);
}
.pc-precision__plus {
    color: var(--cs-accent-deep, #A4451A);
    background: var(--cs-accent-soft, #FBE5D6);
    font-size: 1rem;
}
.pc-precision__col-foot {
    margin-top: var(--space-3);
    padding-top: var(--space-3);
    border-top: 1px dashed var(--ed-line);
    font-size: 0.8125rem;
    color: var(--ed-mute);
    font-style: italic;
}
.pc-precision__cta {
    margin-top: var(--space-5);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: 0.9rem 1.4rem;
    background: var(--cs-accent, #C9591A);
    color: #fff;
    text-decoration: none;
    border-radius: 999px;
    font-weight: 700;
    font-size: 1rem;
    transition: transform 0.15s, box-shadow 0.15s, background 0.15s;
    box-shadow: 0 6px 16px -4px rgba(201,89,26,0.45);
}
.pc-precision__cta:hover {
    transform: translateY(-2px);
    background: var(--cs-accent-deep, #A4451A);
    box-shadow: 0 12px 24px -4px rgba(201,89,26,0.55);
}
.pc-precision__cta-price {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    font-family: var(--font-mono, monospace);
    font-size: 0.875rem;
}
.pc-precision__cta-price s {
    opacity: 0.7;
    font-size: 0.8em;
    text-decoration: line-through;
    font-weight: 500;
}
.pc-precision__cta-price strong {
    font-size: 1.05rem;
    font-weight: 800;
}
.pc-precision__promo {
    display: block;
    margin-top: var(--space-3);
    font-family: var(--font-mono, monospace);
    font-size: 0.75rem;
    color: rgba(255,255,255,0.9);
    text-align: center;
    letter-spacing: 0.04em;
}
.pc-precision__promo strong {
    color: var(--cs-accent-soft, #FBE5D6);
    font-weight: 700;
}

/* Separateur central : grand "+7" qui acte la promesse */
.pc-precision__divider {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0 var(--space-3);
    position: relative;
}
.pc-precision__divider::before {
    content: "";
    position: absolute;
    inset: 10% 50% 10% 50%;
    border-left: 2px dashed var(--cs-teal-line, #7FB8B6);
    opacity: 0.45;
}
.pc-precision__plus-big {
    position: relative;
    font-family: var(--font-display, var(--font-display-fallback));
    font-size: clamp(2.6rem, 5vw, 4rem);
    font-weight: 800;
    line-height: 1;
    color: var(--cs-teal-deep, #08403E);
    background: #fff;
    width: 2.6em;
    height: 2.6em;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 2px solid var(--cs-teal, #0E5E5C);
    box-shadow: 0 4px 16px rgba(8,64,62,0.15);
    letter-spacing: -0.04em;
}
.pc-precision__divider-lbl {
    position: relative;
    font-family: var(--font-mono, monospace);
    font-size: 0.75rem;
    color: var(--cs-teal-deep, #08403E);
    text-align: center;
    line-height: 1.25;
    background: var(--ed-paper, #FAF7F1);
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    letter-spacing: 0.02em;
    font-weight: 600;
}

@media (max-width: 880px) {
    .pc-precision { padding: var(--space-7) var(--space-4); }
    .pc-precision__grid { grid-template-columns: 1fr; gap: var(--space-4); }
    .pc-precision__col--upgrade { transform: none; }
    .pc-precision__divider {
        flex-direction: row;
        padding: var(--space-2) 0;
    }
    .pc-precision__divider::before {
        inset: 50% 10% 50% 10%;
        border-left: none;
        border-top: 2px dashed var(--cs-teal-line, #7FB8B6);
    }
    .pc-precision__plus-big {
        width: 3rem;
        height: 3rem;
        font-size: 1.4rem;
    }
    .pc-precision__title { font-size: 1.4rem; }
    .pc-precision__cta { font-size: 0.9375rem; padding: 0.8rem 1rem; }
}

/* ============== Section commune (cadre interieur uniforme) ============ */
/* Compactage v2 : sections plus denses, marges reduites de ~25 %. */
.pc-section { margin: 0 0 var(--space-9); scroll-margin-top: var(--space-8); }
.pc-section__head { margin-bottom: var(--space-5); }
.pc-section__eyebrow {
    font-family: var(--font-mono);
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ed-saffron);
    display: block;
    margin-bottom: var(--space-2);
}
.pc-section__title {
    font-family: var(--font-display);
    font-size: var(--text-h2);
    font-weight: 700;
    color: var(--ed-graphite);
    letter-spacing: var(--tracking-tight);
    line-height: var(--leading-snug);
    margin: 0 0 var(--space-2);
}
.pc-section__sub {
    font-size: var(--text-body);
    color: var(--ed-mute);
    margin: 0;
    max-width: 68ch;
    line-height: var(--leading-normal);
}

/* ============== 1. HERO premium 2 colonnes ============================ */
.pc-hero {
    background: var(--ed-paper);
    background-image: var(--ed-noise);
    background-size: 160px 160px;
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-9) var(--space-9) var(--space-8);
    margin-top: var(--space-2);
    margin-bottom: var(--space-8);
    position: relative;
}
.pc-hero::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 60px;
    height: 3px;
    background: var(--ed-forest);
    border-radius: var(--radius-lg) 0 0 0;
}
.pc-hero__grid {
    display: grid;
    grid-template-columns: 1.45fr 1fr;
    gap: var(--space-10);
    align-items: start;
}
.pc-hero__eyebrow {
    font-family: var(--font-mono);
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ed-forest);
    margin-bottom: var(--space-3);
    display: block;
}
.pc-hero__title {
    font-family: var(--cs-font-display);
    font-size: clamp(2.5rem, 5vw, 3.75rem);
    font-weight: 700;
    color: var(--cs-ink-deep);
    line-height: 1.05;
    letter-spacing: -0.025em;
    margin: 0 0 var(--space-3);
}
.pc-hero__title em {
    font-style: normal;
    color: var(--ed-forest);
}
.pc-hero__lead {
    font-size: var(--text-lead);
    color: var(--ed-ink);
    line-height: var(--leading-normal);
    margin: 0 0 var(--space-6);
    max-width: 56ch;
}
.pc-hero__stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-3);
    padding: var(--space-4) 0;
    border-top: 1px solid var(--ed-line);
    border-bottom: 1px solid var(--ed-line);
    margin-bottom: var(--space-5);
}
.pc-hero__stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.pc-hero__stat-lbl {
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ed-mute);
}
.pc-hero__stat-val {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--ed-graphite);
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}
.pc-hero__stat-val small {
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--ed-mute);
    margin-left: 2px;
}
.pc-hero__pills {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-bottom: var(--space-6);
}
.pc-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 9999px;
    background: var(--ed-paper-2);
    border: 1px solid var(--ed-line);
    font-size: var(--text-small);
    font-weight: 500;
    color: var(--ed-ink);
}
.pc-pill--forest {
    background: var(--ed-forest-soft);
    border-color: transparent;
    color: var(--ed-forest-deep);
}
.pc-pill--saffron {
    background: var(--ed-saffron-soft);
    border-color: var(--ed-saffron-line);
    color: var(--ed-saffron);
}
.pc-pill--terracotta {
    background: var(--ed-terracotta-soft);
    border-color: var(--ed-terracotta-line);
    color: var(--ed-terracotta);
}

/* Carte score hero (droite) : elevation high pour pop visuel */
.pc-hero__score {
    background: var(--cs-bg-elevated);
    border: 1px solid var(--cs-line);
    border-radius: var(--cs-radius-lg);
    padding: var(--cs-space-6);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--cs-space-3);
    text-align: center;
    position: relative;
    overflow: hidden;
    box-shadow: var(--cs-shadow-high);
}
.pc-hero__score::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: var(--cs-accent);
}
.pc-hero__score-eyebrow {
    font-family: var(--font-mono);
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ed-mute);
}
.pc-hero__score-letter {
    width: 132px;
    height: 132px;
    border-radius: var(--cs-radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--cs-font-mono);
    font-weight: 700;
    font-size: 5.5rem;
    color: #fff;
    background: var(--cs-ink);
    letter-spacing: -0.05em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.14), var(--cs-shadow-mid);
}
.pc-hero__score-letter.cl-a { background: var(--dpe-a); }
.pc-hero__score-letter.cl-b { background: var(--dpe-b); }
.pc-hero__score-letter.cl-c { background: var(--dpe-c); color: var(--ed-graphite); }
.pc-hero__score-letter.cl-d { background: var(--dpe-d); color: var(--ed-graphite); }
.pc-hero__score-letter.cl-e { background: var(--dpe-e); }
.pc-hero__score-letter.cl-f { background: var(--dpe-f); }
.pc-hero__score-label {
    font-family: var(--font-display);
    font-size: var(--text-h3);
    font-weight: 600;
    color: var(--ed-graphite);
}
.pc-hero__score-hint {
    font-size: var(--text-small);
    color: var(--ed-mute);
    line-height: var(--leading-normal);
    max-width: 28ch;
}
.pc-hero__score-rank {
    font-size: var(--text-small);
    color: var(--ed-forest-deep);
    background: var(--ed-forest-soft);
    padding: 6px 10px;
    border-radius: var(--radius-sm);
    font-weight: 600;
}

/* CTA primaire hero (large, sous le grid) */
.pc-hero__cta-wrap {
    margin-top: var(--space-6);
    padding-top: var(--space-6);
    border-top: 1px solid var(--ed-line);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-5);
}
/* CTA primaire commune : passe en accent terracotta pour pop visuel
   vs le teal omnipresent sur le reste de la page (radar, pills, links). */
.pc-cta-primary {
    display: inline-flex;
    align-items: center;
    gap: var(--cs-space-3);
    background: var(--cs-accent);
    color: #fff;
    padding: var(--cs-space-4) var(--cs-space-6);
    border-radius: var(--cs-radius);
    font-family: var(--cs-font-display);
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    transition: background 0.15s, transform 0.15s, box-shadow 0.15s;
    border: none;
    box-shadow: var(--cs-shadow-mid);
}
.pc-cta-primary:hover {
    background: var(--cs-accent-deep);
    transform: translateY(-1px);
    color: #fff;
    box-shadow: var(--cs-shadow-high);
}
.pc-cta-primary__price {
    background: rgba(255,255,255,0.18);
    padding: 2px 10px;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-variant-numeric: tabular-nums;
}
.pc-hero__cta-trust {
    font-size: var(--text-small);
    color: var(--ed-mute);
    line-height: var(--leading-normal);
}

@media (max-width: 960px) {
    .pc-hero { padding: var(--space-6); }
    .pc-hero__grid { grid-template-columns: 1fr; gap: var(--space-8); }
    .pc-hero__stats { grid-template-columns: repeat(2, 1fr); gap: var(--space-4); }
    .pc-hero__score-letter { width: 110px; height: 110px; font-size: 4.5rem; }
}

/* ============== 2. RADAR 9 dimensions ================================= */
.pc-radar-wrap {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: var(--space-8);
    align-items: center;
}
.pc-radar-svg { width: 100%; max-width: 460px; margin: 0 auto; display: block; }
.pc-radar-svg .axis-line { stroke: var(--ed-line); stroke-width: 1; }
.pc-radar-svg .ring { fill: none; stroke: var(--ed-line); stroke-width: 0.6; }
.pc-radar-svg .ring-outer { stroke: var(--ed-line-strong); stroke-width: 1; }
.pc-radar-svg .axis-label {
    font-family: var(--font-body);
    font-size: 11px;
    fill: var(--ed-slate);
    font-weight: 500;
}
.pc-radar-svg .axis-label--strong {
    font-weight: 700;
    fill: var(--ed-graphite);
}
.pc-radar-svg .poly-commune {
    fill: var(--ed-forest);
    fill-opacity: 0.18;
    stroke: var(--ed-forest);
    stroke-width: 2;
    stroke-linejoin: round;
}
.pc-radar-svg .poly-france {
    fill: none;
    stroke: var(--ed-mute);
    stroke-width: 1.2;
    stroke-dasharray: 4 3;
    stroke-linejoin: round;
}
.pc-radar-svg .poly-dot {
    fill: var(--ed-forest);
    stroke: #fff;
    stroke-width: 1.5;
}
.pc-radar-side h3 {
    font-family: var(--font-display);
    font-size: var(--text-h3);
    font-weight: 600;
    color: var(--ed-graphite);
    margin: 0 0 var(--space-3);
}
.pc-radar-side p {
    font-size: var(--text-body);
    color: var(--ed-ink);
    line-height: var(--leading-normal);
    margin: 0 0 var(--space-5);
}
.pc-radar-legend {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-bottom: var(--space-5);
}
.pc-radar-legend__row {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-size: var(--text-small);
    color: var(--ed-ink);
}
.pc-radar-legend__swatch {
    width: 24px; height: 2px;
    border-radius: 2px;
    flex-shrink: 0;
}
.pc-radar-legend__swatch.swatch-commune { background: var(--ed-forest); height: 3px; }
.pc-radar-legend__swatch.swatch-france {
    background: repeating-linear-gradient(90deg, var(--ed-mute) 0 4px, transparent 4px 7px);
    height: 2px;
}
.pc-radar-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-3);
}
.pc-radar-note {
    font-size: var(--text-small);
    color: var(--ed-mute);
    font-style: italic;
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px solid var(--ed-line);
}
@media (max-width: 900px) {
    .pc-radar-wrap { grid-template-columns: 1fr; padding: var(--space-6); }
}

/* ============== 3. MARCHE IMMOBILIER =================================== */
.pc-marche {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: var(--space-6);
    margin-bottom: var(--space-5);
}
.pc-marche-card {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
}
.pc-marche-card h3 {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
    color: var(--ed-graphite);
    margin: 0 0 var(--space-4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}
.pc-marche-card__src {
    font-size: 0.6875rem;
    color: var(--ed-mute);
    font-weight: 500;
    font-family: var(--font-mono);
    letter-spacing: 0.05em;
}

/* Distribution Q1 / median / Q3 */
.pc-distrib {
    margin: var(--space-4) 0;
    padding: var(--space-3) 0;
}
.pc-distrib-bar {
    position: relative;
    height: 12px;
    background: var(--ed-paper-2);
    border-radius: 9999px;
    margin: var(--space-8) 0 var(--space-2);
}
.pc-distrib-zone {
    position: absolute;
    top: 0; bottom: 0;
    background: var(--ed-saffron-soft);
    border-left: 2px solid var(--ed-saffron);
    border-right: 2px solid var(--ed-saffron);
    border-radius: 0;
}
.pc-distrib-median {
    position: absolute;
    top: -6px; bottom: -6px;
    width: 3px;
    background: var(--ed-forest-deep);
    border-radius: 2px;
}
.pc-distrib-marker {
    position: absolute;
    top: -28px;
    transform: translateX(-50%);
    font-size: 0.6875rem;
    color: var(--ed-mute);
    font-family: var(--font-mono);
    white-space: nowrap;
    text-align: center;
}
.pc-distrib-marker strong {
    display: block;
    font-family: var(--font-display);
    font-size: 0.875rem;
    color: var(--ed-graphite);
    font-weight: 700;
}
.pc-distrib-marker--center strong { color: var(--ed-forest-deep); font-size: 1rem; }

/* Evolution 5 ans : mini sparkline + delta */
.pc-evol {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}
.pc-evol-spark { width: 100%; height: 110px; display: block; }
.pc-evol-spark .line { fill: none; stroke: var(--ed-forest); stroke-width: 2; }
.pc-evol-spark .area { fill: var(--ed-forest-soft); opacity: 0.6; }
.pc-evol-spark .dot { fill: var(--ed-forest); stroke: #fff; stroke-width: 1.5; }
.pc-evol-spark .axis { stroke: var(--ed-line); stroke-width: 0.5; }
.pc-evol-spark .label {
    font-family: var(--font-mono);
    font-size: 9px;
    fill: var(--ed-mute);
}
.pc-evol-delta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    padding-top: var(--space-3);
    border-top: 1px solid var(--ed-line);
}
.pc-evol-delta__val {
    font-family: var(--font-display);
    font-size: 1.625rem;
    font-weight: 700;
    color: var(--ed-graphite);
    font-variant-numeric: tabular-nums;
}
.pc-evol-delta__val.is-pos { color: var(--ed-forest); }
.pc-evol-delta__val.is-neg { color: var(--ed-terracotta); }
.pc-evol-delta__lbl {
    font-size: 0.8125rem;
    color: var(--ed-mute);
    text-align: right;
    max-width: 18ch;
}

/* Prix par type */
.pc-prix-type {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    margin-bottom: var(--space-5);
}
.pc-prix-type__row {
    display: grid;
    grid-template-columns: 60px 1fr auto;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) 0;
    border-bottom: 1px dashed var(--ed-line);
}
.pc-prix-type__row:last-child { border-bottom: none; }
.pc-prix-type__type {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--ed-graphite);
    font-size: 0.9375rem;
}
.pc-prix-type__bar {
    height: 10px;
    background: var(--ed-paper-2);
    border-radius: 9999px;
    overflow: hidden;
    position: relative;
}
.pc-prix-type__fill {
    height: 100%;
    background: linear-gradient(90deg, var(--ed-forest) 0%, var(--ed-saffron) 100%);
    border-radius: 9999px;
}
.pc-prix-type__val {
    font-family: var(--font-mono);
    font-size: 0.875rem;
    color: var(--ed-graphite);
    font-weight: 600;
    text-align: right;
    font-variant-numeric: tabular-nums;
    min-width: 110px;
}
.pc-prix-type__val small {
    display: block;
    font-size: 0.6875rem;
    color: var(--ed-mute);
    font-weight: 400;
    margin-top: 2px;
}

/* Comparateur dept / France */
.pc-comparateur {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-3);
    padding: var(--space-5);
    background: var(--ed-paper-2);
    border-radius: var(--radius);
    margin-top: var(--space-4);
}
.pc-comparateur__cell {
    text-align: center;
    padding: 0 var(--space-2);
    border-right: 1px solid var(--ed-line-strong);
}
.pc-comparateur__cell:last-child { border-right: none; }
.pc-comparateur__cell--strong { background: rgba(255,255,255,0.6); border-radius: var(--radius-sm); }
.pc-comparateur__lbl {
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ed-mute);
    margin-bottom: 4px;
}
.pc-comparateur__val {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--ed-graphite);
    font-size: 1.25rem;
    font-variant-numeric: tabular-nums;
}
.pc-comparateur__delta {
    display: block;
    font-size: 0.75rem;
    margin-top: 2px;
    font-weight: 500;
}
.pc-comparateur__delta.is-up { color: var(--ed-saffron); }
.pc-comparateur__delta.is-down { color: var(--ed-forest); }

.pc-empty {
    padding: var(--space-6);
    background: var(--ed-paper-2);
    border: 1px dashed var(--ed-line-strong);
    border-radius: var(--radius);
    color: var(--ed-mute);
    font-size: var(--text-small);
    text-align: center;
    line-height: var(--leading-normal);
}
.pc-empty strong { color: var(--ed-graphite); }

@media (max-width: 860px) {
    .pc-marche { grid-template-columns: 1fr; }
    .pc-comparateur { grid-template-columns: 1fr; gap: var(--space-2); }
    .pc-comparateur__cell { border-right: none; border-bottom: 1px solid var(--ed-line-strong); padding: var(--space-3); }
    .pc-comparateur__cell:last-child { border-bottom: none; }
}

/* ============== 4. PROJECTION 2050 ===================================== */
.pc-2050 {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: var(--space-8);
    align-items: center;
}
.pc-2050-traj {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-5);
}
.pc-2050-pastille {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-2);
    text-align: center;
}
.pc-2050-disc {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
    border: 2px solid #fff;
    line-height: 1;
}
.pc-2050-disc--now { background: var(--ed-forest); }
.pc-2050-disc--futur { background: var(--ed-saffron); }
.pc-2050-pastille-lbl {
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ed-mute);
}
.pc-2050-pastille-year {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--ed-graphite);
    font-size: 1rem;
}
.pc-2050-arrow {
    flex-shrink: 0;
    color: var(--ed-graphite);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.pc-2050-arrow__delta {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--ed-saffron);
    background: var(--ed-saffron-soft);
    padding: 2px 8px;
    border-radius: 9999px;
}
.pc-2050-temp {
    text-align: left;
}
.pc-2050-temp__val {
    font-family: var(--font-display);
    font-size: 3.75rem;
    font-weight: 700;
    color: var(--ed-saffron);
    line-height: 1;
    letter-spacing: -0.04em;
    font-variant-numeric: tabular-nums;
}
.pc-2050-temp__val small {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--ed-mute);
}
.pc-2050-temp__lbl {
    font-family: var(--font-display);
    font-weight: 600;
    color: var(--ed-graphite);
    font-size: 1rem;
    margin: var(--space-2) 0 var(--space-3);
}
.pc-2050-temp__txt {
    font-size: 0.875rem;
    color: var(--ed-ink);
    line-height: var(--leading-normal);
    margin: 0 0 var(--space-3);
}
.pc-2050-temp__src {
    font-size: 0.75rem;
    color: var(--ed-mute);
    font-style: italic;
}
@media (max-width: 860px) {
    .pc-2050 { grid-template-columns: 1fr; padding: var(--space-6); }
}

/* ============== 5. GRID 9 risques ====================================== */
.pc-risques-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}
.pc-risque-card {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius);
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    transition: border-color 0.15s, transform 0.15s;
}
.pc-risque-card:hover {
    border-color: var(--ed-forest);
    transform: translateY(-1px);
}
.pc-risque-card__head {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}
.pc-risque-card__icon {
    width: 44px; height: 44px;
    border-radius: var(--cs-radius-sm);
    background: var(--cs-bg-subtle);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cs-ink);
    flex-shrink: 0;
}
.pc-risque-card__icon .cs-risk-icon {
    width: 26px;
    height: 26px;
}
/* Modificateurs par risque : fond soft de la rampe, teinte deep sur le picto */
.pc-risque-card__icon--flood  { background: var(--cs-risk-flood-soft);  color: var(--cs-risk-flood-deep); }
.pc-risque-card__icon--argile { background: var(--cs-risk-argile-soft); color: var(--cs-risk-argile-deep); }
.pc-risque-card__icon--fire   { background: var(--cs-risk-fire-soft);   color: var(--cs-risk-fire-deep); }
.pc-risque-card__icon--seism  { background: var(--cs-risk-seism-soft);  color: var(--cs-risk-seism-deep); }
.pc-risque-card__icon--radon  { background: var(--cs-risk-radon-soft);  color: var(--cs-risk-radon-deep); }
.pc-risque-card__icon--mvt    { background: var(--cs-risk-mvt-soft);    color: var(--cs-risk-mvt-deep); }
.pc-risque-card__icon--catnat { background: var(--cs-risk-catnat-soft); color: var(--cs-risk-catnat-deep); }
.pc-risque-card__icon--proj   { background: var(--cs-risk-proj-soft);   color: var(--cs-risk-proj-deep); }
.pc-risque-card__name {
    font-family: var(--font-display);
    font-weight: 600;
    color: var(--ed-graphite);
    font-size: 0.9375rem;
    line-height: var(--leading-snug);
}
.pc-risque-card__bar {
    height: 8px;
    background: var(--ed-paper-2);
    border-radius: 9999px;
    overflow: hidden;
}
.pc-risque-card__fill {
    height: 100%;
    border-radius: 9999px;
    transition: width 0.6s ease-out;
}
.pc-risque-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}
.pc-risque-card__level {
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 9999px;
    white-space: nowrap;
}
.pc-risque-card__level.lvl-eleve { background: var(--ed-terracotta-soft); color: var(--ed-terracotta); }
.pc-risque-card__level.lvl-modere { background: var(--ed-saffron-soft); color: var(--ed-saffron); }
.pc-risque-card__level.lvl-faible { background: var(--ed-forest-soft); color: var(--ed-forest-deep); }
.pc-risque-card__level.lvl-none { background: var(--ed-paper-2); color: var(--ed-mute); }
.pc-risque-card__hint {
    font-size: 0.8125rem;
    color: var(--ed-mute);
    line-height: var(--leading-normal);
    margin: 0;
}
.pc-risque-card__link {
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ed-forest);
    text-decoration: none;
    margin-top: auto;
    padding-top: var(--space-2);
    border-top: 1px dashed var(--ed-line);
}
.pc-risque-card__link:hover { color: var(--ed-forest-deep); text-decoration: underline; }
@media (max-width: 900px) { .pc-risques-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .pc-risques-grid { grid-template-columns: 1fr; } }

/* ============== 6. CARTE MapLibre (refonte premium) ==================== */
.pc-map-wrap {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    overflow: hidden;
    position: relative;
}
.pc-map {
    width: 100%;
    height: 520px;
    background: #e8e7e2;
    position: relative;
}
.pc-map .maplibregl-canvas { outline: none; }
.pc-map-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--ed-line);
    background: var(--ed-paper-2);
    font-size: var(--text-small);
    color: var(--ed-mute);
}
.pc-map-foot strong { color: var(--ed-graphite); font-weight: 600; }
.commune-pin {
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

/* Panel de couches risques (top-left, dans la carte) */
.cs-map-layers {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 5;
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius);
    padding: 10px 12px;
    font-size: 0.8125rem;
    color: var(--ed-ink);
    box-shadow: 0 4px 12px rgba(20, 24, 30, 0.06);
    max-width: 240px;
}
.cs-map-layers h4 {
    margin: 0 0 6px;
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ed-mute);
    font-weight: 600;
}
.cs-map-layers label {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    cursor: pointer;
    line-height: 1.25;
}
.cs-map-layers input[type=checkbox] {
    accent-color: #0E5E5C;
    cursor: pointer;
}

/* Slider temporel sous la carte */
.cs-map-timeline {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-5);
    border-top: 1px solid var(--ed-line);
    background: var(--ed-paper);
    font-size: var(--text-small);
}
.cs-map-timeline input[type=range] {
    flex: 1;
    accent-color: #0E5E5C;
    cursor: pointer;
    max-width: 360px;
}
.cs-map-timeline output {
    color: var(--ed-graphite);
    font-variant-numeric: tabular-nums;
}
.cs-map-timeline output strong { color: #0E5E5C; font-weight: 600; }

/* Popup editorial */
.cs-map-popup-wrap .maplibregl-popup-content {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius);
    padding: 12px 14px;
    box-shadow: 0 6px 18px rgba(20, 24, 30, 0.1);
    font-family: var(--font-body, 'Geist', system-ui, sans-serif);
    font-size: 0.8125rem;
    color: var(--ed-ink);
    max-width: 260px;
}
.cs-map-popup-wrap .maplibregl-popup-tip { border-top-color: var(--ed-line); }
.cs-map-popup__title {
    font-family: var(--font-display);
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--ed-graphite);
    margin-bottom: 6px;
}
.cs-map-popup__row {
    line-height: 1.45;
    color: var(--ed-mute);
}
.cs-map-popup__row strong { color: var(--ed-graphite); font-weight: 600; }
.cs-map-popup__classe {
    display: inline-block;
    padding: 1px 7px;
    border-radius: 4px;
    color: #fff;
    font-weight: 700;
    margin-left: 4px;
}
.cs-map-popup__classe.cl-a { background: var(--dpe-a, #319c41); }
.cs-map-popup__classe.cl-b { background: var(--dpe-b, #50b153); }
.cs-map-popup__classe.cl-c { background: var(--dpe-c, #c8d645); color: var(--ed-graphite); }
.cs-map-popup__classe.cl-d { background: var(--dpe-d, #f7a92b); color: var(--ed-graphite); }
.cs-map-popup__classe.cl-e { background: var(--dpe-e, #e96f29); }
.cs-map-popup__classe.cl-f { background: var(--dpe-f, #d7221c); }
.cs-map-popup__link {
    display: inline-block;
    margin-top: 8px;
    color: #0E5E5C;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid currentColor;
}
.cs-map-popup__link:hover { color: #C9591A; }

@media (max-width: 720px) {
    .pc-map { height: 380px; }
    .cs-map-layers { max-width: 180px; padding: 8px 10px; font-size: 0.75rem; }
    .cs-map-timeline { flex-direction: column; align-items: stretch; gap: var(--space-2); }
}

/* ============== 7. SINISTRALITE ======================================== */
.pc-sinistralite {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    display: grid;
    grid-template-columns: repeat(2, 1fr) 1.5fr;
    gap: var(--space-6);
    align-items: center;
}
.pc-sin-stat { text-align: left; }
.pc-sin-stat__val {
    font-family: var(--font-display);
    font-size: 3.25rem;
    font-weight: 700;
    color: var(--ed-graphite);
    line-height: 1;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
}
.pc-sin-stat__lbl {
    font-size: var(--text-small);
    color: var(--ed-mute);
    margin-top: var(--space-2);
    max-width: 24ch;
    line-height: var(--leading-normal);
}
.pc-sin-context {
    border-left: 2px solid var(--ed-saffron);
    padding-left: var(--space-5);
    font-size: var(--text-body);
    color: var(--ed-ink);
    line-height: var(--leading-normal);
}
.pc-sin-context strong { color: var(--ed-graphite); }
@media (max-width: 860px) {
    .pc-sinistralite { grid-template-columns: 1fr; padding: var(--space-6); }
    .pc-sin-context { border-left: none; padding-left: 0; border-top: 1px solid var(--ed-line); padding-top: var(--space-4); }
}

/* ============== 8. COMPARATEUR VOISINES ================================ */
.pc-voisines-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}
.pc-voisine-card {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s, transform 0.15s;
}
.pc-voisine-card:hover {
    border-color: var(--ed-forest);
    transform: translateY(-1px);
}
.pc-voisine-card__letter {
    width: 44px; height: 44px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 1.375rem;
    flex-shrink: 0;
    background: var(--ed-graphite);
    line-height: 1;
}
.pc-voisine-card__letter.cl-a { background: var(--dpe-a); }
.pc-voisine-card__letter.cl-b { background: var(--dpe-b); }
.pc-voisine-card__letter.cl-c { background: var(--dpe-c); color: var(--ed-graphite); }
.pc-voisine-card__letter.cl-d { background: var(--dpe-d); color: var(--ed-graphite); }
.pc-voisine-card__letter.cl-e { background: var(--dpe-e); }
.pc-voisine-card__letter.cl-f { background: var(--dpe-f); }
.pc-voisine-card__meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pc-voisine-card__name {
    font-family: var(--font-display);
    font-weight: 600;
    color: var(--ed-graphite);
    font-size: 0.9375rem;
    line-height: var(--leading-snug);
}
.pc-voisine-card__sub {
    font-size: 0.75rem;
    color: var(--ed-mute);
    line-height: 1.3;
}
@media (max-width: 900px) { .pc-voisines-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .pc-voisines-grid { grid-template-columns: 1fr; } }

/* ============== 9. CTA conversion 2 colonnes =========================== */
.pc-conv {
    background: var(--ed-forest-soft);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-10);
    position: relative;
    overflow: hidden;
}
.pc-conv::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: var(--ed-forest);
}
.pc-conv__head {
    text-align: center;
    max-width: 60ch;
    margin: 0 auto var(--space-8);
}
.pc-conv__title {
    font-family: var(--font-display);
    font-size: var(--text-h2);
    font-weight: 700;
    color: var(--ed-graphite);
    line-height: var(--leading-snug);
    letter-spacing: var(--tracking-tight);
    margin: 0 0 var(--space-3);
}
.pc-conv__sub {
    font-size: var(--text-body);
    color: var(--ed-mute);
    margin: 0;
}
.pc-conv__cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6);
    max-width: 880px;
    margin: 0 auto var(--space-8);
}
.pc-conv-col {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--radius);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}
.pc-conv-col--premium {
    border: 2px solid var(--ed-forest);
    box-shadow: 0 2px 0 var(--ed-forest-soft);
    position: relative;
}
.pc-conv-col__tag {
    position: absolute;
    top: -10px;
    right: var(--space-5);
    background: var(--ed-forest);
    color: #fff;
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 9999px;
}
.pc-conv-col__eyebrow {
    font-family: var(--font-mono);
    font-size: var(--text-eyebrow);
    font-weight: 600;
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--ed-mute);
}
.pc-conv-col__title {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--ed-graphite);
    margin: 0;
}
.pc-conv-col__price {
    font-family: var(--font-display);
    font-size: 1.875rem;
    font-weight: 700;
    color: var(--ed-graphite);
    line-height: 1;
    margin: var(--space-2) 0 var(--space-3);
    font-variant-numeric: tabular-nums;
}
.pc-conv-col__price small {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--ed-mute);
    margin-left: 4px;
}
.pc-conv-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}
.pc-conv-col li {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    font-size: 0.875rem;
    color: var(--ed-ink);
    line-height: var(--leading-normal);
}
.pc-conv-col li::before {
    content: '\2713';
    color: var(--ed-forest);
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
}
.pc-conv__footer {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
}
.pc-conv__trust {
    font-size: 0.8125rem;
    color: var(--ed-mute);
    line-height: var(--leading-normal);
    max-width: 60ch;
}
/* Mini-form d'adresse pre-rempli sur la commune. Place dans la section
   conversion, juste avant le bloc trust. Suffixe ville/CP en gris a
   droite de l'input pour signifier "vous etes deja dans cette commune".
   Le JS d'envoi ajoute le suffixe a l'adresse si l'utilisateur ne l'a
   pas tape lui-meme. */
.pc-conv-form {
    width: 100%;
    max-width: 640px;
    text-align: left;
}
.pc-conv-form__label {
    display: block;
    font-family: var(--font-mono, monospace);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ed-graphite);
    margin-bottom: 0.5rem;
}
.pc-conv-form__row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #fff;
    border: 2px solid var(--ed-line-strong);
    border-radius: 14px;
    padding: 0.4rem 0.4rem 0.4rem 1rem;
    box-shadow: var(--cs-shadow-low, 0 2px 8px rgba(0,0,0,0.05));
    transition: border-color 0.15s, box-shadow 0.15s;
}
.pc-conv-form__row:focus-within {
    border-color: var(--cs-teal, var(--ed-forest));
    box-shadow: 0 0 0 4px var(--cs-teal-soft, #DCEEED);
}
.pc-conv-form__input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    font-family: inherit;
    font-size: 1rem;
    padding: 0.5rem 0;
    color: var(--ed-graphite);
}
.pc-conv-form__input::placeholder {
    color: #94A3B8;
}
.pc-conv-form__suffix {
    font-size: 0.875rem;
    color: var(--ed-mute);
    padding: 0 0.5rem;
    border-left: 1px dashed var(--ed-line-strong);
    white-space: nowrap;
}
.pc-conv-form__btn {
    background: var(--cs-teal, var(--ed-forest));
    color: #fff;
    border: 0;
    border-radius: 10px;
    padding: 0.7rem 1.2rem;
    font-weight: 600;
    font-size: 0.9375rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    transition: background 0.15s, transform 0.15s;
    white-space: nowrap;
}
.pc-conv-form__btn:hover {
    background: var(--cs-teal-deep, var(--ed-forest-deep));
    transform: translateY(-1px);
}
.pc-conv-form__btn-arrow {
    font-size: 1.1rem;
    line-height: 1;
}
.pc-conv-form__hint {
    display: block;
    margin-top: 0.5rem;
    font-size: 0.8125rem;
    color: var(--ed-mute);
}
@media (max-width: 600px) {
    .pc-conv-form__row { flex-wrap: wrap; padding: 0.5rem; }
    .pc-conv-form__suffix {
        order: 3;
        flex: 1 0 100%;
        border-left: none;
        border-top: 1px dashed var(--ed-line-strong);
        padding: 0.4rem 0 0;
        font-size: 0.75rem;
    }
    .pc-conv-form__btn { order: 2; flex: 0 0 auto; }
}
.pc-conv__thumb {
    display: flex;
    gap: var(--space-2);
    margin: 0 0 var(--space-4);
}
.pc-conv__thumb-page {
    width: 70px; height: 92px;
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: 4px;
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.pc-conv__thumb-page::before {
    content: '';
    height: 14px;
    background: var(--ed-forest);
    border-radius: 2px;
    margin-bottom: 2px;
}
.pc-conv__thumb-page i {
    display: block;
    height: 3px;
    background: var(--ed-paper-3);
    border-radius: 2px;
}
.pc-conv__thumb-page i:nth-child(odd) { width: 80%; }
.pc-conv__thumb-page i:nth-child(2) { background: var(--ed-saffron); width: 50%; height: 6px; margin: 2px 0; }
@media (max-width: 760px) {
    .pc-conv { padding: var(--space-6); }
    .pc-conv__cols { grid-template-columns: 1fr; }
}

/* ============== 10. SEO long-tail + FAQ + maillage ===================== */
.pc-seo-prose {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-8);
    margin-bottom: var(--space-6);
}
.pc-seo-prose p {
    font-size: var(--text-body);
    color: var(--ed-ink);
    line-height: var(--leading-relaxed);
    margin: 0 0 var(--space-4);
}
.pc-seo-prose p:last-child { margin-bottom: 0; }
.pc-seo-prose strong { color: var(--ed-graphite); }

.pc-faq {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-4) var(--space-8);
    margin-bottom: var(--space-6);
}
.pc-faq details {
    border-bottom: 1px solid var(--ed-line);
    padding: var(--space-4) 0;
}
.pc-faq details:last-child { border-bottom: none; }
.pc-faq summary {
    list-style: none;
    cursor: pointer;
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
    color: var(--ed-graphite);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    line-height: var(--leading-snug);
}
.pc-faq summary::-webkit-details-marker { display: none; }
.pc-faq summary::after {
    content: '+';
    font-family: var(--font-mono);
    font-size: 1.25rem;
    color: var(--ed-mute);
    transition: transform 0.2s;
    flex-shrink: 0;
}
.pc-faq details[open] summary::after { content: '\2212'; }
.pc-faq__answer {
    font-size: 0.9375rem;
    color: var(--ed-ink);
    line-height: var(--leading-relaxed);
    margin: var(--space-3) 0 0;
    max-width: 70ch;
}

/* Maillage interne : 4 sous-grilles */
.pc-mesh {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
}
.pc-mesh-card {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
}
.pc-mesh-card h3 {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
    color: var(--ed-graphite);
    margin: 0 0 var(--space-4);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--ed-line);
}
.pc-mesh-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}
.pc-mesh-card li { padding: 0; }
.pc-mesh-card a {
    display: block;
    padding: var(--space-2) 0;
    font-size: var(--text-body);
    color: var(--ed-ink);
    text-decoration: none;
    border-bottom: 1px dashed transparent;
    transition: border-color 0.15s, color 0.15s;
}
.pc-mesh-card a:hover {
    color: var(--ed-forest);
    border-bottom-color: var(--ed-forest);
}
.pc-mesh-card a small {
    display: block;
    color: var(--ed-mute);
    font-size: 0.75rem;
    margin-top: 2px;
}
@media (max-width: 760px) {
    .pc-mesh { grid-template-columns: 1fr; }
}

/* ============== Profil du parc bati (KPI grid + DPE + climat 2050) ===== */
.pc-parc {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-3);
}
.pc-kpi {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-5) var(--space-4);
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s;
}
.pc-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px -10px rgba(8,64,62,0.18);
    border-color: var(--cs-teal-line, #7FB8B6);
}
.pc-kpi__lbl {
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ed-mute);
}
.pc-kpi__val {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cs-ink-deep, var(--ed-graphite));
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}
.pc-kpi__val small {
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--ed-mute);
    margin-left: 3px;
}
.pc-kpi__hint {
    font-size: 0.75rem;
    color: var(--ed-mute);
    line-height: 1.35;
    margin: 2px 0 0;
}
.pc-kpi__src {
    font-family: var(--font-mono);
    font-size: 0.625rem;
    color: var(--ed-mute);
    opacity: 0.7;
    letter-spacing: 0.04em;
    margin-top: auto;
    padding-top: var(--space-2);
}
@media (max-width: 880px) {
    .pc-parc { grid-template-columns: repeat(2, 1fr); }
}

/* ============== Distribution DPE (barre empilee A-G) ==================== */
.pc-dpe-wrap {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
}
.pc-dpe-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-bottom: var(--space-5);
}
.pc-dpe-head h3 {
    font-family: var(--font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--ed-graphite);
    margin: 0;
}
.pc-dpe-head__src {
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    color: var(--ed-mute);
    letter-spacing: 0.04em;
}
.pc-dpe-bar {
    display: flex;
    width: 100%;
    height: 56px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.06);
}
.pc-dpe-seg {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-mono);
    font-weight: 700;
    color: #fff;
    font-size: 0.875rem;
    transition: filter 0.15s, transform 0.15s;
    position: relative;
    min-width: 0;
}
.pc-dpe-seg:hover {
    filter: brightness(1.08);
    transform: scaleY(1.06);
    z-index: 2;
}
.pc-dpe-seg[data-classe="A"] { background: var(--dpe-a, #319c41); }
.pc-dpe-seg[data-classe="B"] { background: var(--dpe-b, #50b153); }
.pc-dpe-seg[data-classe="C"] { background: var(--dpe-c, #c8d645); color: var(--ed-graphite); }
.pc-dpe-seg[data-classe="D"] { background: var(--dpe-d, #f7a92b); color: var(--ed-graphite); }
.pc-dpe-seg[data-classe="E"] { background: var(--dpe-e, #e96f29); }
.pc-dpe-seg[data-classe="F"] { background: var(--dpe-f, #e7322a); }
.pc-dpe-seg[data-classe="G"] { background: var(--dpe-g, #d7221c); }
.pc-dpe-legend {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: var(--space-2);
    margin-top: var(--space-4);
}
.pc-dpe-legend__item {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: var(--space-2) var(--space-3);
    border-radius: 8px;
    background: var(--ed-paper-2);
    border: 1px solid var(--ed-line);
    font-variant-numeric: tabular-nums;
}
.pc-dpe-legend__cls {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: 0.875rem;
}
.pc-dpe-legend__pct {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 1rem;
    color: var(--ed-graphite);
}
.pc-dpe-legend__n {
    font-size: 0.6875rem;
    color: var(--ed-mute);
}
.pc-dpe-foot {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px dashed var(--ed-line);
    font-size: var(--text-small);
    color: var(--ed-mute);
}
.pc-dpe-foot strong { color: var(--ed-graphite); }
@media (max-width: 760px) {
    .pc-dpe-legend { grid-template-columns: repeat(4, 1fr); }
    .pc-dpe-seg { font-size: 0.75rem; }
}

/* ============== Confort climatique 2050 (KPI premium teal) ============== */
.pc-confort {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}
.pc-confort__cell {
    background: linear-gradient(160deg, var(--cs-teal-deep, #08403E) 0%, var(--cs-teal, #0E5E5C) 100%);
    color: #F1FAFA;
    border-radius: var(--radius-lg);
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    box-shadow: 0 6px 18px -8px rgba(8,64,62,0.35);
    position: relative;
    overflow: hidden;
}
.pc-confort__cell::after {
    content: "";
    position: absolute;
    inset: -40% -20% auto auto;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(201,89,26,0.18) 0%, transparent 60%);
    pointer-events: none;
}
.pc-confort__lbl {
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.75);
    position: relative;
}
.pc-confort__val {
    font-family: var(--font-display);
    font-size: 2.1rem;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    position: relative;
}
.pc-confort__val small {
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 500;
    margin-left: 4px;
    color: var(--cs-accent-soft, #FBE5D6);
}
.pc-confort__hint {
    font-size: 0.8125rem;
    color: rgba(255,255,255,0.82);
    line-height: 1.4;
    position: relative;
}
.pc-confort__src {
    font-family: var(--font-mono);
    font-size: 0.625rem;
    color: rgba(255,255,255,0.55);
    letter-spacing: 0.04em;
    margin-top: auto;
    padding-top: var(--space-2);
    position: relative;
}
@media (max-width: 760px) {
    .pc-confort { grid-template-columns: 1fr; }
}

/* ============== Top ventes (tableau interactif filtre JS) =============== */
.pc-ventes {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
}
.pc-ventes__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}
.pc-ventes__head h3 {
    font-family: var(--font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--ed-graphite);
    margin: 0;
}
.pc-ventes__filter {
    display: inline-flex;
    background: var(--ed-paper-2);
    border-radius: 999px;
    padding: 3px;
    border: 1px solid var(--ed-line);
}
.pc-ventes__btn {
    border: none;
    background: transparent;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ed-mute);
    padding: 6px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.pc-ventes__btn:hover { color: var(--ed-graphite); }
.pc-ventes__btn.is-active {
    background: var(--cs-teal, #0E5E5C);
    color: #fff;
    box-shadow: 0 2px 6px -2px rgba(8,64,62,0.35);
}
.pc-ventes__table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-small);
    font-variant-numeric: tabular-nums;
}
.pc-ventes__table thead th {
    text-align: left;
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ed-mute);
    padding: var(--space-3) var(--space-2);
    border-bottom: 1px solid var(--ed-line);
}
.pc-ventes__table tbody td {
    padding: var(--space-3) var(--space-2);
    border-bottom: 1px solid var(--ed-line);
    color: var(--ed-ink);
}
.pc-ventes__table tbody tr {
    transition: background 0.12s;
}
.pc-ventes__table tbody tr:hover {
    background: var(--cs-teal-soft, #DCEEED);
}
.pc-ventes__type {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    font-family: var(--font-mono);
    font-size: 0.6875rem;
    font-weight: 600;
    background: var(--ed-paper-2);
    color: var(--ed-graphite);
}
.pc-ventes__type--maison {
    background: var(--ed-forest-soft, #E6F0EA);
    color: var(--ed-forest-deep, #1F5A3D);
}
.pc-ventes__type--apt {
    background: var(--cs-teal-soft, #DCEEED);
    color: var(--cs-teal-deep, #08403E);
}
.pc-ventes__price {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--ed-graphite);
}
.pc-ventes__foot {
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px dashed var(--ed-line);
    font-size: var(--text-small);
    color: var(--ed-mute);
}
.pc-ventes__row[data-type="Maison"] .pc-ventes__type { background: var(--ed-forest-soft, #E6F0EA); color: var(--ed-forest-deep, #1F5A3D); }
.pc-ventes__row[data-type="Appartement"] .pc-ventes__type { background: var(--cs-teal-soft, #DCEEED); color: var(--cs-teal-deep, #08403E); }
@media (max-width: 760px) {
    .pc-ventes__table thead { display: none; }
    .pc-ventes__table tbody tr {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4px;
        padding: var(--space-3) 0;
    }
    .pc-ventes__table tbody td {
        border: none;
        padding: 2px 0;
    }
}

/* ============== Fade-in section au scroll (IntersectionObserver) ======== */
.pc-fade-target {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 0.45s ease, transform 0.45s ease;
}
.pc-fade-target.is-visible {
    opacity: 1;
    transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
    .pc-fade-target { opacity: 1; transform: none; transition: none; }
}