/* ============================================================
 * Ville styles — rcv-* prefix
 * Complète silo.css. Chargé après rc-main + silo.
 * ============================================================ */

/* ============================================================
 * Grille de data ville (8 cartes : dept, region, cp, pop, climat, pluvio, materiau, habitat)
 * ============================================================ */
.rcv-data-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: 1fr 1fr;
    margin: 1.75rem 0 0;
}
@media (min-width: 640px) { .rcv-data-grid { grid-template-columns: repeat(4, 1fr); } }

.rcv-data-card {
    background: var(--rc-color-bg-soft);
    border: 1px solid var(--rc-color-border);
    border-radius: var(--rc-radius);
    padding: 0.85rem 1rem;
}
.rcv-data-card__label {
    color: var(--rc-color-text-l);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.3rem;
    font-weight: 600;
}
.rcv-data-card__value {
    color: var(--rc-color-primary);
    font-weight: 700;
    font-size: 0.95rem;
    line-height: 1.3;
}

/* ============================================================
 * Villes voisines (chips)
 * ============================================================ */
.rcv-voisines {
    background: var(--rc-color-bg-soft);
}
.rcv-voisines__list {
    list-style: none; padding: 0;
    margin: 1.5rem auto 0;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: 1fr;
    max-width: 900px;
}
@media (min-width: 640px) { .rcv-voisines__list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .rcv-voisines__list { grid-template-columns: repeat(3, 1fr); } }

.rcv-voisines__list li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1.25rem;
    background: #fff;
    color: var(--rc-color-primary) !important;
    border: 1px solid var(--rc-color-border);
    border-radius: var(--rc-radius);
    text-decoration: none !important;
    font-weight: 500;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.rcv-voisines__list li a:hover {
    background: var(--rc-color-primary);
    color: #fff !important;
    border-color: var(--rc-color-primary);
    transform: translateY(-2px);
}
.rcv-voisines__list li a strong {
    font-weight: 700;
}
.rcv-voisines__dept {
    display: inline-block;
    background: var(--rc-color-bg-alt);
    color: var(--rc-color-text-l);
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    transition: background 0.15s ease, color 0.15s ease;
}
.rcv-voisines__list li a:hover .rcv-voisines__dept {
    background: rgba(255,255,255,0.2);
    color: #fff;
}

/* ============================================================
 * Liste 50 villes par région (silo /couvreur/)
 * ============================================================ */
.rcs-villes-list {
    padding: 4rem 0;
    background: var(--rc-color-bg-soft);
    border-top: 1px solid var(--rc-color-border);
}
.rcs-villes-region {
    margin: 2rem 0;
}
.rcs-villes-region__name {
    margin: 0 0 1rem;
    color: var(--rc-color-primary);
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 2px solid var(--rc-color-accent);
    padding-bottom: 0.4rem;
    display: inline-block;
}
.rcs-villes-region__list {
    list-style: none; padding: 0; margin: 0;
    display: grid;
    gap: 0.5rem 0.75rem;
    grid-template-columns: 1fr;
}
@media (min-width: 640px) { .rcs-villes-region__list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .rcs-villes-region__list { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1200px){ .rcs-villes-region__list { grid-template-columns: repeat(4, 1fr); } }

.rcs-villes-region__list li a {
    display: flex; justify-content: space-between; align-items: center; gap: 0.5rem;
    padding: 0.6rem 0.9rem;
    background: #fff;
    color: var(--rc-color-primary) !important;
    border: 1px solid var(--rc-color-border);
    border-radius: var(--rc-radius);
    text-decoration: none !important;
    font-size: 0.9rem;
    font-weight: 500;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.rcs-villes-region__list li a:hover {
    background: var(--rc-color-primary);
    color: #fff !important;
    border-color: var(--rc-color-primary);
}
.rcs-villes-region__list li a:hover .rcv-voisines__dept {
    background: rgba(255,255,255,0.2);
    color: #fff;
}

/* ============================================================
 * Glossaire (page trust)
 * ============================================================ */
.rcs-glossary {
    padding: 3rem 0;
}
.rcs-glossary__group-title {
    color: var(--rc-color-primary);
    font-size: 1.15rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 2px solid var(--rc-color-accent);
    padding-bottom: 0.4rem;
    margin: 0 0 1.5rem;
    display: inline-block;
}
.rcs-glossary__list {
    margin: 0; padding: 0;
}
.rcs-glossary__term {
    color: var(--rc-color-primary);
    font-weight: 700;
    font-size: 1rem;
    margin: 1.25rem 0 0.4rem;
}
.rcs-glossary__def {
    color: var(--rc-color-text);
    font-size: 0.95rem;
    line-height: 1.65;
    margin: 0 0 1rem;
    padding: 0;
}
.rcs-glossary__def strong { color: var(--rc-color-primary); }

/* ============================================================
 * Signature page (auteur + date mise à jour)
 * ============================================================ */
.rcs-signature {
    padding: 1.25rem 0 2rem;
    background: var(--rc-color-bg);
    border-top: 1px dashed var(--rc-color-border);
}
.rcs-signature__author {
    text-align: center;
    color: var(--rc-color-text-l);
    font-size: 0.82rem;
    line-height: 1.5;
    margin: 0;
}
.rcs-signature__author a {
    color: var(--rc-color-primary);
    text-decoration: underline;
}

/* ============================================================
 * Blocs spécifiques aux variants T4 (touche visuelle subtile)
 * ============================================================ */
.rcs-block--abf .rcs-intro__title,
.rcs-block--neige .rcs-intro__title,
.rcs-block--gel .rcs-intro__title {
    border-left: 3px solid var(--rc-color-primary);
    padding-left: 0.75rem;
}
.rcs-block--mistral .rcs-intro__title,
.rcs-block--cevenols .rcs-intro__title,
.rcs-block--tempete .rcs-intro__title {
    border-left: 3px solid var(--rc-color-accent);
    padding-left: 0.75rem;
}
.rcs-block--marin .rcs-intro__title,
.rcs-block--aides .rcs-intro__title {
    border-left: 3px solid var(--rc-color-gold);
    padding-left: 0.75rem;
}

/* Accentuation variant hero */
.rcs-variant--urbain .rcs-hero__bg {
    background:
        radial-gradient(70% 50% at 70% 0%, rgba(43, 92, 176, 0.65) 0%, transparent 70%),
        linear-gradient(160deg, #0f2752 0%, #1a3a6e 60%, #1d4280 100%);
}
.rcs-variant--mediterraneen .rcs-hero__bg {
    background:
        radial-gradient(80% 60% at 80% 0%, rgba(245, 158, 11, 0.45) 0%, transparent 70%),
        linear-gradient(160deg, #b45309 0%, #1a3a6e 60%, #0f2752 100%);
}
.rcs-variant--littoral .rcs-hero__bg {
    background:
        radial-gradient(80% 60% at 60% 0%, rgba(20, 184, 166, 0.4) 0%, transparent 70%),
        linear-gradient(160deg, #134e4a 0%, #1a3a6e 60%, #0f2752 100%);
}
.rcs-variant--montagne .rcs-hero__bg {
    background:
        radial-gradient(80% 50% at 50% 0%, rgba(96, 165, 250, 0.35) 0%, transparent 70%),
        linear-gradient(160deg, #1e3a8a 0%, #1a3a6e 60%, #0f2752 100%);
}
.rcs-variant--periurbain .rcs-hero__bg {
    /* défaut, identique au standard */
}