:root{--brn-nuit:#11281d;--brn-nuit-clair:#1a3932;--brn-or:#61a173;--brn-or-vif:#92d6b7;--brn-lilas:#adefc0;--brn-texte:#9fe3d5;--brn-texte-vif:#bbfcde;--brn-texte-doux:#6daf91;--brn-texte-faible:#4b866b;--brn-corps:#79bcae;--brn-bord:#244a30;--brn-bord-vif:#2d5a46;--brn-pied:#071109}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--brn-nuit);color:var(--brn-texte);font-family:'Source Sans 3',system-ui,sans-serif;font-size:16px;line-height:1.7}
h1,h2,h3{font-family:'Crimson Pro',Georgia,serif;font-weight:600;line-height:1.22}
img{max-width:100%;display:block}
a{color:var(--brn-or);text-decoration:none}
a:hover{color:var(--brn-or-vif)}
.brn-wrap{max-width:1128px;margin:0 auto;padding:0 18px}

/* ---------- barre de tete ---------- */
.brn-bar{background:rgba(5,5,4,.22);padding:14px 0}
.brn-bar .brn-wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.brn-brand{font-weight:700;font-size:1.25rem;color:var(--brn-texte-vif)}
.brn-brand-em{color:var(--brn-or)}
.brn-nav{min-width:0}
.brn-nav-link{color:#85c999;font-size:.9rem;margin-left:22px}
.brn-nav-link:hover{color:var(--brn-or)}

/* ---------- scene centree ---------- */
.brn-hero{padding:56px 0 42px;text-align:center;position:relative;overflow:hidden}
.brn-hero-bg{position:absolute;inset:0;z-index:0}
.brn-hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.30}
.brn-hero-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,40,29,.55),rgba(17,40,29,.94))}
.brn-hero-inner{position:relative;z-index:2}
.brn-kicker{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--brn-or);margin-bottom:14px}
.brn-title{font-size:clamp(1.75rem,4vw,2.25rem);margin:0 auto 14px;max-width:34rem;color:var(--brn-texte-vif)}
.brn-title-em{color:var(--brn-or);font-style:normal}
.brn-lede{color:var(--brn-texte-doux);max-width:40rem;margin:0 auto;font-size:1.05rem}
.brn-pills{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-top:26px}
.brn-pill{border:1px solid var(--brn-bord-vif);color:#85c999;border-radius:20px;padding:6px 17px;font-size:.87rem}
.brn-pill:hover,.brn-pill-current{background:var(--brn-or);border-color:var(--brn-or);color:var(--brn-nuit);font-weight:600}

/* ---------- colonne de lecture ---------- */
.brn-read{padding:34px 0 8px}
.brn-column{max-width:44rem;margin:0 auto}
.brn-column p{margin-bottom:1.3rem;color:var(--brn-corps)}
.brn-h-2{font-size:1.4rem;margin:2.1rem 0 .6rem;color:var(--brn-texte-vif)}
.brn-h-3{font-size:1.08rem;margin:1.5rem 0 .4rem;color:var(--brn-lilas)}
.brn-figure{margin:0 0 28px}
.brn-figure img{border:1px solid var(--brn-bord);border-radius:10px}
.brn-figure-note{font-size:.8rem;color:var(--brn-texte-faible);margin-top:8px}
.brn-facts{border:1px solid var(--brn-bord);border-radius:12px;background:var(--brn-nuit-clair);padding:6px 20px;margin:0 0 28px}
.brn-fact{display:grid;grid-template-columns:12rem 1fr;gap:14px;padding:11px 0;border-bottom:1px solid var(--brn-bord)}
.brn-fact:last-child{border-bottom:0}
.brn-fact-key{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brn-texte-faible);padding-top:4px}
.brn-fact-val{color:var(--brn-lilas);margin:0}
.brn-points{list-style:none;margin:0 0 1.3rem}
.brn-points li{position:relative;padding-left:20px;margin-bottom:7px;color:var(--brn-corps)}
.brn-points li:before{content:"\25B8";position:absolute;left:2px;color:var(--brn-or)}

/* ---------- grille de cartes ---------- */
.brn-board{padding:16px 0 44px}
.brn-board-head{margin-bottom:22px}
.brn-board-title{font-size:1.4rem;color:var(--brn-texte-vif);margin-bottom:6px}
.brn-board-note{color:var(--brn-texte-doux);font-size:.93rem}
.brn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.brn-grid-four{grid-template-columns:repeat(4,1fr);gap:18px}
.brn-card{background:var(--brn-nuit-clair);border:1px solid var(--brn-bord);border-radius:12px;padding:22px;display:flex;flex-direction:column;transition:transform .16s,border-color .16s}
.brn-card:hover{transform:translateY(-3px);border-color:var(--brn-or)}
.brn-thumb{border-radius:8px;overflow:hidden;margin:-4px -4px 16px;border:1px solid var(--brn-bord)}
.brn-thumb img{width:100%;height:auto}
.brn-card-top{display:flex;align-items:center;gap:13px;margin-bottom:14px}
.brn-sigil{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#244a30,#37695f);display:flex;align-items:center;justify-content:center;font-size:1.15rem;font-weight:600;color:var(--brn-or);flex:0 0 52px}
.brn-card-name{font-weight:600;font-size:1.05rem;color:var(--brn-texte-vif);margin:0}
.brn-card-name a{color:var(--brn-texte-vif)}
.brn-card-name a:hover{color:var(--brn-or)}
.brn-card-kind{font-size:.8rem;color:var(--brn-texte-faible);margin:0}
.brn-flag{display:inline-block;background:rgba(97,161,115,.14);color:var(--brn-or);font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:3px 10px;border-radius:4px;margin-bottom:12px;align-self:flex-start}
.brn-card-text{font-size:.92rem;color:var(--brn-corps);line-height:1.65;flex:1;margin-bottom:16px}
.brn-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.brn-chips span{background:rgba(251,251,251,.06);color:#569488;font-size:.75rem;padding:3px 9px;border-radius:3px}
.brn-card-go{display:block;text-align:center;background:var(--brn-or);color:var(--brn-nuit);font-weight:700;font-size:.9rem;padding:11px;border-radius:7px}
.brn-card-go:hover{background:var(--brn-or-vif);color:var(--brn-nuit)}

/* ---------- clotures ---------- */
.brn-closing{background:var(--brn-nuit-clair);border-top:1px solid var(--brn-bord);padding:38px 0;text-align:center}
.brn-closing-title{font-size:1.4rem;margin-bottom:10px;color:var(--brn-texte-vif)}
.brn-closing-text{color:var(--brn-texte-doux);max-width:38rem;margin:0 auto}
.brn-routes{list-style:none;max-width:28rem;margin:0 auto}
.brn-routes li{padding:11px 0;border-bottom:1px solid var(--brn-bord)}
.brn-foot{background:var(--brn-pied);color:var(--brn-texte-faible);font-size:.86rem;padding:30px 0}
.brn-foot-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px}
.brn-foot-link{color:#85c999}

@media(max-width:1020px){.brn-grid-four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:880px){
.brn-grid,.brn-grid-four{grid-template-columns:1fr}
.brn-fact{grid-template-columns:1fr;gap:2px}
/* Sans min-width:0 et sans retour à la ligne, la barre de navigation — quatre libellés
   alignés par marge gauche — pousse la page au-delà du viewport sur un téléphone : un
   élément flex ne se réduit pas sous la largeur de son contenu, et tout le document se met
   à défiler horizontalement. */
.brn-nav{flex:1 1 100%;min-width:0}
.brn-nav-link{margin:0 18px 0 0;display:inline-block}
}
/* Mesuré au navigateur à 375 px : au-delà de deux lignes, un intitulé de section cesse de
   se lire d'un coup d'œil. C'est la taille qui descend, pas l'intitulé qu'on raccourcit —
   il porte du sens. */
@media(max-width:480px){
.brn-title{font-size:1.6rem}
.brn-h-2{font-size:1.18rem}
.brn-board-title,.brn-closing-title{font-size:1.2rem}
}