:root{
  --navy:#0D2B5C; --navy-2:#1F3864; --navy-ink:#081C3D;
  --gold:#C9A227; --gold-2:#B8860B; --gold-soft:#F4ECD3;
  --green:#1B4B3A;
  --paper:#FBF9F4; --card:#FFFFFF; --line:#E6E0D2; --ink:#14213D; --muted:#5E6676;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --wrap:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:var(--gold);color:var(--navy-ink)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 16px}
@media(min-width:720px){.wrap{padding:0 32px}}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* Bilingue */
html[lang="fr"] [lang="en"]:not(html){display:none!important}
html[lang="en"] [lang="fr"]:not(html){display:none!important}

/* Utilitaires */
.kicker{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-2)}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:14px 22px;border:2px solid transparent;transition:.2s ease;cursor:pointer}
.btn-gold{background:var(--gold);color:var(--navy-ink)}
.btn-gold:hover{background:#d8b33a;transform:translateY(-1px)}
.btn-ghost{border-color:currentColor}
.btn-ghost:hover{background:rgba(255,255,255,.08)}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-2)}

/* Fil d'actualités */
.ticker{background:var(--navy-ink);color:#E9EDF5;position:sticky;top:0;z-index:50;display:flex;align-items:stretch;font-family:var(--mono);font-size:12px;border-bottom:2px solid var(--gold)}
.ticker-label{background:var(--gold);color:var(--navy-ink);font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:10px 16px;display:flex;align-items:center;gap:8px;white-space:nowrap;flex-shrink:0}
.ticker-label .dot{width:8px;height:8px;border-radius:50%;background:var(--navy-ink);animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
.ticker-track{overflow:hidden;flex:1;display:flex;align-items:center;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.ticker-move{display:flex;gap:48px;white-space:nowrap;padding-left:24px;animation:scroll 45s linear infinite}
.ticker:hover .ticker-move{animation-play-state:paused}
.ticker-move span b{color:var(--gold);margin-right:8px}
@keyframes scroll{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ticker-move{animation:none}.ticker-label .dot{animation:none}}

/* En-tête */
.masthead{background:var(--card);border-bottom:1px solid var(--line)}
.masthead-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.06em}
.lang-switch{display:flex;border:1px solid var(--line)}
.lang-switch button{font:inherit;background:none;border:0;padding:4px 10px;cursor:pointer;color:var(--muted)}
.lang-switch button[aria-pressed="true"]{background:var(--navy);color:#fff}
.brand-row{display:flex;flex-direction:column;gap:20px;padding:28px 0 22px}
@media(min-width:900px){.brand-row{flex-direction:row;align-items:flex-end;justify-content:space-between}}
.brand{display:flex;align-items:center;gap:16px}
.mark{width:58px;height:58px;flex-shrink:0;background:var(--navy);color:var(--gold);display:grid;place-items:center;font-family:var(--serif);font-weight:900;font-size:22px;letter-spacing:-.02em;position:relative}
.mark::after{content:"";position:absolute;inset:5px;border:1px solid rgba(201,162,39,.5)}
.brand h1{font-family:var(--serif);font-weight:900;font-size:clamp(34px,6vw,60px);line-height:1;letter-spacing:-.02em;color:var(--navy)}
.brand h1 em{font-style:italic;font-weight:500;color:var(--gold-2)}
.brand p{font-size:13px;color:var(--muted);margin-top:6px;max-width:440px}
.brand-actions{display:flex;flex-wrap:wrap;gap:10px}
.nav{display:flex;gap:4px;overflow-x:auto;border-top:1px solid var(--line);scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav a{padding:14px 14px;font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap;border-bottom:3px solid transparent}
.nav a:hover,.nav a.on{color:var(--navy);border-bottom-color:var(--gold)}

/* Une */
main{padding:40px 0 64px}
section{margin-bottom:56px}
.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:2px solid var(--navy);padding-bottom:10px;margin-bottom:24px}
.section-head h2{font-family:var(--serif);font-size:clamp(24px,3vw,32px);color:var(--navy);font-weight:700}
.section-head a{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-2)}
.une{display:grid;gap:24px}
@media(min-width:960px){.une{grid-template-columns:1.65fr 1fr}}
.lead{background:var(--navy);color:#fff;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;min-height:440px}
.lead::before{content:"N°13";position:absolute;right:-10px;bottom:-40px;font-family:var(--serif);font-weight:900;font-size:220px;line-height:1;color:rgba(201,162,39,.09);pointer-events:none}
.lead-body{padding:32px;position:relative}
@media(min-width:720px){.lead-body{padding:44px}}
.tag{display:inline-block;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:6px 10px;background:var(--gold);color:var(--navy-ink)}
.meta{font-family:var(--mono);font-size:11px;color:#AEB9CF;letter-spacing:.06em;margin:18px 0 12px}
.lead h3{font-family:var(--serif);font-weight:700;font-size:clamp(26px,3.4vw,42px);line-height:1.12;letter-spacing:-.01em}
.lead h3 span{color:var(--gold)}
.lead p{color:#D3DAE8;font-size:15px;margin-top:16px;max-width:600px}
.versus{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;margin-top:26px;max-width:560px}
.versus div{border:1px solid rgba(255,255,255,.2);padding:12px 14px;font-size:13px;font-weight:600}
.versus small{display:block;font-family:var(--mono);font-size:10px;color:var(--gold);letter-spacing:.12em;text-transform:uppercase;margin-bottom:2px}
.versus .vs{border:0;font-family:var(--serif);font-style:italic;color:var(--gold);font-size:22px;padding:0}
.lead-foot{border-top:1px solid rgba(255,255,255,.15);padding:18px 32px;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;position:relative}
@media(min-width:720px){.lead-foot{padding:18px 44px}}
.lead-foot span{font-family:var(--mono);font-size:11px;color:#AEB9CF}

.side{display:flex;flex-direction:column;gap:24px}
.card{background:var(--card);border:1px solid var(--line)}
.wire{padding:22px 24px}
.wire h4{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--navy);padding-bottom:12px;border-bottom:1px solid var(--line)}
.live{display:inline-flex;align-items:center;gap:6px;color:var(--green)}
.live::before{content:"";width:7px;height:7px;border-radius:50%;background:#2E9E6B}
.wire ol{list-style:none}
.wire li{padding:16px 0;border-bottom:1px solid var(--line)}
.wire li:last-child{border-bottom:0;padding-bottom:0}
.wire time{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--gold-2);letter-spacing:.08em;text-transform:uppercase}
.wire li a{display:block;font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.3;color:var(--navy);margin-top:4px}
.wire li a:hover{color:var(--gold-2)}
.wire li p{font-size:13px;color:var(--muted);margin-top:4px}

.afrea{background:var(--gold-soft);border:1px solid #E6D6A3;padding:22px 24px;display:flex;gap:18px;align-items:center}
.afrea .date{flex-shrink:0;text-align:center;background:var(--navy);color:#fff;padding:10px 12px;min-width:74px}
.afrea .date b{display:block;font-family:var(--serif);font-size:26px;line-height:1;color:var(--gold)}
.afrea .date small{font-family:var(--mono);font-size:10px;letter-spacing:.1em}
.afrea h4{font-family:var(--serif);font-size:18px;color:var(--navy);line-height:1.25}
.afrea p{font-size:13px;color:var(--muted);margin-top:4px}

/* Insights */
.grid3{display:grid;gap:20px}
@media(min-width:720px){.grid3{grid-template-columns:repeat(3,1fr)}}
.issue{padding:24px;display:flex;flex-direction:column;gap:10px;transition:.2s ease;border-top:4px solid var(--navy)}
.issue:hover{border-top-color:var(--gold);transform:translateY(-2px);box-shadow:0 10px 30px -18px rgba(13,43,92,.35)}
.issue .num{font-family:var(--serif);font-weight:900;font-size:44px;line-height:1;color:var(--gold)}
.issue h3{font-family:var(--serif);font-size:20px;line-height:1.25;color:var(--navy)}
.issue p{font-size:13.5px;color:var(--muted);flex:1}
.issue .more{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.issue:hover .more{color:var(--gold-2)}

/* OPERAPLUS */
.opera{background:var(--navy-ink);color:#fff;display:grid;gap:0}
@media(min-width:960px){.opera{grid-template-columns:1fr 1.4fr}}
.opera-intro{padding:36px 32px;border-bottom:1px solid rgba(255,255,255,.12)}
@media(min-width:960px){.opera-intro{border-bottom:0;border-right:1px solid rgba(255,255,255,.12);padding:44px}}
.opera-intro h2{font-family:var(--serif);font-size:clamp(26px,3vw,36px);line-height:1.15;margin:12px 0 14px}
.opera-intro h2 span{color:var(--gold)}
.opera-intro p{color:#C7D0E2;font-size:14.5px;margin-bottom:22px}
.tools{display:grid;grid-template-columns:1fr}
@media(min-width:600px){.tools{grid-template-columns:1fr 1fr}}
.tool{padding:26px 28px;border-bottom:1px solid rgba(255,255,255,.1);transition:background .2s}
@media(min-width:600px){.tool:nth-child(odd){border-right:1px solid rgba(255,255,255,.1)}.tool:nth-last-child(-n+2){border-bottom:0}}
.tool:hover{background:rgba(201,162,39,.08)}
.tool .ico{width:36px;height:36px;border:1px solid var(--gold);display:grid;place-items:center;color:var(--gold);margin-bottom:14px}
.tool .ico svg{width:18px;height:18px}
.tool h3{font-size:15px;font-weight:700}
.tool p{font-size:13px;color:#AEB9CF;margin-top:4px}

/* CTA */
.cta{background:var(--card);border:1px solid var(--line);padding:40px 28px;display:grid;gap:28px;position:relative;overflow:hidden}
@media(min-width:900px){.cta{grid-template-columns:1.4fr 1fr;padding:56px;align-items:center}}
.cta::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(var(--gold),var(--navy))}
.cta h2{font-family:var(--serif);font-weight:700;font-size:clamp(28px,4vw,46px);line-height:1.1;color:var(--navy);margin:10px 0 14px}
.cta h2 em{color:var(--gold-2)}
.cta p{color:var(--muted);font-size:15px;max-width:560px}
.perks{list-style:none;display:grid;gap:12px}
.perks li{display:flex;gap:12px;font-size:14px;align-items:flex-start}
.perks li::before{content:"";flex-shrink:0;width:18px;height:18px;margin-top:2px;background:var(--gold);clip-path:polygon(14% 52%,0 66%,38% 100%,100% 22%,86% 8%,38% 72%)}
.cta-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.cta-actions .note{font-family:var(--mono);font-size:11px;color:var(--muted);align-self:center}

/* Footer */
footer{background:var(--navy);color:#C7D0E2;padding:48px 0 24px;font-size:13px}
.foot{display:grid;gap:32px}
@media(min-width:800px){.foot{grid-template-columns:1.4fr 1fr 1fr 1.2fr}}
footer h5{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
footer ul{list-style:none;display:grid;gap:8px}
footer a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.foot-brand strong{font-family:var(--serif);font-size:24px;color:#fff;display:block;margin-bottom:8px}
.newsletter{display:flex;margin-top:4px}
.newsletter a{flex:1;text-align:center}
.legal{border-top:1px solid rgba(255,255,255,.12);margin-top:36px;padding-top:18px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-family:var(--mono);font-size:11px;color:#8E9AB3}
/* ═════════ Ajouts : bouton admin et dynamisme ═════════ */
:root{--ease:cubic-bezier(.2,.7,.2,1)}

/* Bouton administrateur */
.btn-admin{color:var(--navy);border-color:var(--navy);background:transparent;position:relative;overflow:hidden}
.btn-admin svg{width:15px;height:15px;flex:none;transition:transform .3s var(--ease)}
.btn-admin::before{content:"";position:absolute;inset:0;background:var(--navy);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease);z-index:0}
.btn-admin > *{position:relative;z-index:1}
.btn-admin:hover{color:#fff}
.btn-admin:hover::before{transform:scaleX(1)}
.btn-admin:hover svg{transform:translateY(-1px) rotate(-8deg)}
@media(min-width:900px){.brand-actions{flex-shrink:0;flex-wrap:nowrap}}

/* Barre de lecture sous le fil d'actualités */
.read-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:60;background:linear-gradient(90deg,var(--gold-2),var(--gold));transform-origin:0 50%;transform:scaleX(0);pointer-events:none}

/* Boutons : flèche qui avance, léger relief */
.btn{transition:background .2s,color .2s,border-color .2s,transform .2s var(--ease),box-shadow .25s}
.btn:hover{transform:translateY(-2px)}
.btn-navy:hover{box-shadow:0 12px 24px -14px rgba(13,43,92,.7)}
.btn-gold:hover{box-shadow:0 12px 24px -14px rgba(184,134,11,.8)}
.btn .arrow-anim{display:inline-block;transition:transform .25s var(--ease)}
.btn:hover .arrow-anim{transform:translateX(4px)}

/* Logo et titre : entrée au chargement */
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes drawIn{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.js .brand .mark{animation:rise .7s var(--ease) both}
.js .brand h1{animation:rise .8s .08s var(--ease) both}
.js .brand p{animation:rise .8s .16s var(--ease) both}
.js .brand-actions{animation:rise .8s .24s var(--ease) both}
.mark{transition:transform .4s var(--ease)}
.brand:hover .mark{transform:rotate(-6deg) scale(1.04)}

/* Navigation : soulignement animé et onglet actif au défilement */
.nav a{position:relative;border-bottom-color:transparent!important;transition:color .2s}
.nav a::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:3px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:hover::after,.nav a.on::after{transform:scaleX(1)}

/* Apparition au défilement */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .reveal.in{opacity:1;transform:none}

/* Une : halo lent, titre souligné, versus animé */
.lead h3 span{background:linear-gradient(var(--gold),var(--gold)) left 100%/0 2px no-repeat;transition:background-size 1.1s .5s var(--ease)}
.lead.in h3 span{background-size:100% 2px}
.versus div{transition:border-color .3s,background .3s,transform .3s var(--ease)}
.versus div:not(.vs):hover{border-color:var(--gold);background:rgba(201,162,39,.08);transform:translateY(-2px)}

/* Dépêches */
.live::before{animation:livePulse 2s ease-out infinite}
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(46,158,107,.5)}70%,100%{box-shadow:0 0 0 7px rgba(46,158,107,0)}}
.wire li{box-shadow:inset 0 0 0 0 var(--gold);transition:padding-left .3s var(--ease),box-shadow .3s}
.wire li:hover{box-shadow:inset 3px 0 0 0 var(--gold)}

/* Agenda : compte à rebours */
.afrea{transition:transform .3s var(--ease),box-shadow .3s}
.afrea:hover{transform:translateY(-2px);box-shadow:0 14px 30px -20px rgba(13,43,92,.45)}
.countdown{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--navy)}
.countdown b{background:var(--navy);color:var(--gold);padding:3px 8px;font-variant-numeric:tabular-nums}

/* Insights et outils */
.issue .num{font-variant-numeric:tabular-nums;transition:transform .35s var(--ease)}
.issue:hover .num{transform:translateX(4px)}
.issue .more{display:inline-flex;gap:6px;transition:gap .25s var(--ease),color .2s}
.issue:hover .more{gap:10px}
.tool{position:relative}
.tool::after{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.tool:hover::after{transform:scaleX(1)}
.tool .ico{transition:background .3s,color .3s,transform .35s var(--ease)}
.tool:hover .ico{background:var(--gold);color:var(--navy-ink);transform:rotate(-6deg)}

/* Appel à l'action */
.cta::before{transform:scaleY(0);transform-origin:top;transition:transform 1s var(--ease)}
.cta.in::before{transform:scaleY(1)}
.perks li{transition:transform .3s var(--ease)}
.perks li:hover{transform:translateX(4px)}

/* Retour en haut */
.to-top{position:fixed;right:18px;bottom:18px;z-index:45;width:44px;height:44px;display:grid;place-items:center;background:var(--navy);color:var(--gold);border:1px solid var(--gold);cursor:pointer;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .3s,transform .3s var(--ease),background .2s}
.to-top.show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{background:var(--navy-2)}
.to-top svg{width:18px;height:18px}

/* ═════════ Exigences UX : clarté, accessibilité, hiérarchie ═════════ */
html{scroll-padding-top:64px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Lien d'évitement clavier */
.skip{position:fixed;left:16px;top:-60px;z-index:100;background:var(--navy);color:#fff;padding:12px 18px;font-weight:700;font-size:14px;transition:top .2s}
.skip:focus{top:12px}

/* Contraste : texte doré lisible sur fond clair (AA) */
.kicker,.section-head a,.wire time,.issue:hover .more{color:#8A6510}
.wire li a:hover{color:#8A6510}

/* Fil d'actualités : pause explicite (mobile et clavier) */
.ticker-toggle{flex-shrink:0;width:44px;display:grid;place-items:center;background:var(--navy-ink);color:var(--gold);border:0;border-left:1px solid rgba(201,162,39,.35);cursor:pointer;transition:background .2s}
.ticker-toggle:hover{background:var(--navy)}
.ticker-toggle svg{width:14px;height:14px}
.ticker-toggle .i-play{display:none}
.ticker.paused .ticker-toggle .i-play{display:block}
.ticker.paused .ticker-toggle .i-pause{display:none}
.ticker.paused .ticker-move,.ticker:focus-within .ticker-move{animation-play-state:paused}

/* Cibles tactiles d'au moins 44 px */
.btn{min-height:46px}
.lang-switch button{min-width:44px;min-height:32px;font-weight:700;transition:background .2s,color .2s}
.lang-switch button:hover{color:var(--navy)}
.lang-switch button[aria-pressed="true"]:hover{color:#fff}
.nav a{padding:16px 14px}

/* Hiérarchie des actions : principale pleine, admin secondaire */
.btn-admin{border-width:1.5px;letter-spacing:.1em}
.btn-admin:focus-visible{color:#fff}
.btn-admin:focus-visible::before{transform:scaleX(1)}
@media(max-width:599px){
  .brand-actions{display:grid;grid-template-columns:1fr}
  .brand-actions .btn{justify-content:center}
}

/* Indication explicite des liens externes (nouvel onglet) */
a[target="_blank"] .ext{display:inline-block;margin-left:4px;font-size:.9em;opacity:.75}

/* Aide sous le bouton principal du débat */
.lead-foot .hint{display:block;width:100%;text-align:right;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:#AEB9CF;margin-top:-4px}
@media(max-width:719px){.lead-foot .hint{text-align:left}}

/* Navigation : défilement horizontal signalé sur mobile */
@media(max-width:719px){.nav{mask-image:linear-gradient(90deg,#000 85%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent)}}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .reveal{opacity:1;transform:none}
}

/* ═════════ Ajout : section « À propos » (description + chiffres) ═════════ */
.about{display:grid;border:1px solid var(--line);background:var(--card)}
@media(min-width:960px){.about{grid-template-columns:1.15fr 1fr}}
.about-text{padding:34px 28px}
@media(min-width:720px){.about-text{padding:44px}}
.about-text h2{font-family:var(--serif);font-weight:700;font-size:clamp(24px,3vw,34px);line-height:1.15;color:var(--navy);margin:10px 0 16px;letter-spacing:-.01em;max-width:560px}
.about-text p{font-size:15px;color:var(--muted);max-width:540px}
.about-facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.about-facts li{font-size:13px;font-weight:600;color:var(--navy);border:1px solid var(--line);background:var(--paper);padding:7px 14px}

.about-stats{background:var(--navy-ink);color:#fff;padding:34px 28px;display:flex;flex-direction:column;justify-content:center;gap:30px;border-top:1px solid rgba(255,255,255,.12)}
@media(min-width:720px){.about-stats{padding:44px}}
@media(min-width:960px){.about-stats{border-top:0;border-left:1px solid rgba(255,255,255,.12)}}
.stat-total{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.stat-num{font-family:var(--serif);font-weight:900;font-size:clamp(56px,8vw,88px);line-height:1;color:var(--gold);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.stat-label{font-size:15px;color:#C7D0E2}
.gender h3{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#AEB9CF;margin-bottom:14px}
.g-bar{display:flex;gap:3px;height:16px;background:rgba(255,255,255,.08)}
.g-bar i{display:block;height:100%;width:var(--w);transition:width 1.2s var(--ease)}
.g-bar .g-f,.g-legend .g-f{--c:var(--gold)}
.g-bar .g-m,.g-legend .g-m{--c:#8FA8D6}
.g-bar i{background:var(--c)}
.js .about-stats:not(.in) .g-bar i{width:0}
.g-legend{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
.g-legend > div{border-top:3px solid var(--c);padding-top:10px;display:flex;flex-direction:column;line-height:1.35;font-size:14px;color:#E9EDF5}
.g-legend b{font-family:var(--serif);font-weight:700;font-size:clamp(28px,3.4vw,38px);line-height:1.1;color:#fff;font-variant-numeric:tabular-nums}
.g-legend small{font-family:var(--mono);font-size:11px;color:#AEB9CF;margin-top:2px;font-variant-numeric:tabular-nums}