/*
 * Nightingale — ajustements ciblés de la vitrine
 * Duel des serveurs, contexte territorial et confort de navigation.
 */

#promesse,
#experiences,
#epoque,
#systemes,
#actualites,
#rejoindre {
    scroll-margin-top: 96px;
}

/* Les trois promesses reposent sur un fond continu, sombre et chaleureux.
 * Aucun motif répété : la profondeur vient uniquement de dégradés très légers. */
.vision-ledger {
    background:
        radial-gradient(circle at 12% 0%, rgba(111, 46, 41, .14), transparent 34%),
        linear-gradient(112deg, rgba(24, 14, 12, .98), rgba(9, 7, 6, .99) 52%, rgba(18, 10, 9, .97)) !important;
    box-shadow:
        0 2rem 5rem rgba(0, 0, 0, .46),
        inset 0 1px 0 rgba(238, 224, 199, .025),
        inset 0 -28px 70px rgba(0, 0, 0, .2) !important;
}
.vision-ledger > article {
    background:
        linear-gradient(180deg, rgba(238, 224, 199, .018), transparent 42%),
        linear-gradient(90deg, rgba(111, 46, 41, .025), transparent 58%) !important;
}
.vision-ledger > article::before,
.vision-ledger > article::after {
    background-image: none !important;
}

/* L'ouverture présente immédiatement les forces du projet.
 * !important neutralise définitivement l'ancienne signature de la feuille historique. */
.hero::before {
    content: "RP FRANCOPHONE  ·  ÉCRIT & VOCAL  ·  DEUX CHRONOLOGIES" !important;
}

/* Les textes du préchargement sont remplacés avant même l'exécution du correctif JS. */
.preloader-kicker,
.preloader-title,
.preloader-meta span:first-child {
    font-size: 0;
}
.preloader-kicker::after {
    content: "Nightingale · RP francophone · Écrit & vocal";
    font: 800 .62rem/1.5 Arial, sans-serif;
    letter-spacing: .25em;
    text-transform: uppercase;
}
.preloader-title::after {
    content: "Entrée dans Nightingale";
    font: 400 clamp(1.5rem, 4vw, 2.2rem)/1 "Nightingale Display", Impact, Georgia, serif;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.preloader-meta span:first-child::after {
    content: "Préparation des deux chronologies";
    font: 700 .56rem/1.4 Arial, sans-serif;
    letter-spacing: .16em;
    text-transform: uppercase;
}

/* Le diptyque reste parfaitement symétrique, même lorsqu'un volet est actif. */
.server-duel {
    width: min(1320px, calc(100vw - 64px)) !important;
    margin-inline: auto !important;
    grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr) !important;
}
.server-duel[data-active='written'],
.server-duel[data-active='voice'] {
    --written-size: 1fr !important;
    --voice-size: 1fr !important;
}
.server-duel .mode-story {
    min-height: clamp(540px, 52vw, 680px) !important;
}
.server-duel .mode-copy {
    width: 100% !important;
    max-width: none !important;
    padding: clamp(2rem, 3.4vw, 3.35rem) !important;
}
.server-duel .mode-copy::before,
.server-duel .server-panel-hint {
    display: none !important;
}
.server-duel .mode-label {
    margin-bottom: .85rem;
    color: #f3e5cf;
    text-shadow: 0 2px 12px rgba(0,0,0,.78);
}

/* Les filets s'arrêtent avant le cartouche central au lieu de le traverser. */
.server-duel-divider {
    overflow: hidden;
}
.server-duel-divider::before,
.server-duel-divider::after {
    z-index: 0 !important;
    height: calc(50% - 94px) !important;
    pointer-events: none;
}
.server-duel-reset {
    position: relative;
    z-index: 2 !important;
    width: 66px !important;
    min-height: 168px !important;
    padding: 1rem .45rem !important;
    overflow: hidden;
    border-color: rgba(169,134,89,.55) !important;
    background: linear-gradient(160deg, #21120e, #090706 72%) !important;
    box-shadow:
        0 1rem 3rem rgba(0,0,0,.6),
        inset 0 0 0 5px rgba(169,134,89,.045) !important;
}
.server-duel-reset strong,
.server-duel-reset span {
    position: relative;
    z-index: 2;
}
.server-duel-reset span {
    color: rgba(238,224,199,.76) !important;
    font-size: .5rem !important;
    letter-spacing: .12em !important;
    line-height: 1.35 !important;
}

/* Les textes longs des territoires restent aérés sans casser l'égalité des cartes. */
.era-card-copy {
    min-height: 350px;
}
.era-card-copy p + p {
    margin-top: .85rem;
}

/* Chronologie synthétique de l'expansion et des déplacements. */
.territory-chronology {
    position: relative;
    width: var(--page);
    margin: clamp(2rem, 4vw, 3.4rem) auto 0;
    grid-template-columns: 135px minmax(0, 1fr);
    align-items: stretch;
}
.territory-chronology .timeline-mark {
    min-height: 100%;
    padding-inline: .75rem;
}
.territory-chronology-content {
    min-width: 0;
}
.territory-chronology-content > p:not(.eyebrow) {
    max-width: 900px;
    margin: .75rem 0 0;
    color: var(--paper-dim);
}
.territory-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 1.8rem 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid rgba(169,134,89,.28);
    border-bottom: 1px solid rgba(169,134,89,.18);
}
.territory-steps li {
    position: relative;
    min-width: 0;
    padding: 1.25rem 1.15rem 1.35rem;
    border-left: 1px dashed rgba(169,134,89,.24);
}
.territory-steps li:first-child {
    border-left: 0;
}
.territory-steps li::before {
    content: attr(data-step);
    display: block;
    margin-bottom: .55rem;
    color: var(--ember-hot);
    font-family: var(--display);
    font-size: .8rem;
    letter-spacing: .08em;
}
.territory-steps strong {
    display: block;
    margin-bottom: .45rem;
    color: var(--paper);
    font-size: .92rem;
    line-height: 1.35;
}
.territory-steps p {
    margin: 0;
    color: var(--paper-dim);
    font-size: .84rem;
    line-height: 1.55;
}
.railway-note {
    position: relative;
    margin: 1.35rem 0 0 !important;
    padding-left: 1.2rem;
}
.railway-note::before {
    content: '';
    position: absolute;
    left: 0;
    top: .75em;
    width: 8px;
    height: 1px;
    background: var(--ember);
}

/* L'état vide de la Gazette accepte désormais une accroche textuelle. */
.news-empty-number {
    padding-inline: .75rem;
    text-align: center;
    font-size: 1.05rem;
    line-height: 1.15;
}

@media (max-width: 900px) {
    .server-duel {
        width: min(760px, calc(100vw - 32px)) !important;
        grid-template-columns: 1fr !important;
    }
    .server-duel .mode-story {
        min-height: 560px !important;
    }
    .server-duel-divider {
        overflow: visible;
    }
    .server-duel-divider::before,
    .server-duel-divider::after {
        width: calc(50% - 74px) !important;
        height: 1px !important;
    }
    .server-duel-reset {
        width: 136px !important;
        min-height: 56px !important;
        padding: .65rem .9rem !important;
    }
    .era-card-copy {
        min-height: auto;
    }
    .territory-chronology {
        grid-template-columns: 110px minmax(0, 1fr);
    }
    .territory-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .territory-steps li:nth-child(3) {
        border-left: 0;
        border-top: 1px dashed rgba(169,134,89,.24);
    }
    .territory-steps li:nth-child(4) {
        border-top: 1px dashed rgba(169,134,89,.24);
    }
}

@media (max-width: 620px) {
    #promesse,
    #experiences,
    #epoque,
    #systemes,
    #actualites,
    #rejoindre {
        scroll-margin-top: 78px;
    }
    .server-duel .mode-story {
        min-height: 520px !important;
    }
    .territory-chronology {
        grid-template-columns: 1fr;
    }
    .territory-chronology .timeline-mark {
        min-height: 58px;
        border-right: 0;
        border-bottom: 1px dashed var(--line);
    }
    .territory-steps {
        grid-template-columns: 1fr;
    }
    .territory-steps li,
    .territory-steps li:nth-child(3),
    .territory-steps li:nth-child(4) {
        border-left: 0;
        border-top: 1px dashed rgba(169,134,89,.24);
    }
    .territory-steps li:first-child {
        border-top: 0;
    }
}