:root{
  --green:#0B5D3B; --green-d:#0B4F32; --green-l:#4E9A6B; --mint:#E5EFE4; --mint-2:#EAF4EC;
  --gold:#E2A900; --gold-d:#8A6700; --red:#C8102E;
  --ink:#14261C; --muted:#4B5C52; --line:#DDE4D8; --bg:#F6F7F2; --card:#fff;
  --serif:'Fraunces',Georgia,serif; --sans:'Inter',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--green)}
button{font-family:inherit;cursor:pointer}
.wrap{max-width:1200px;margin:0 auto;padding-inline:24px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;border-radius:8px;z-index:9}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* header */
.top{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.top-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-block:10px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit}
.brand img{width:56px;height:56px;object-fit:contain}
.brand-txt{display:flex;flex-direction:column}
.brand-txt strong{font-family:var(--serif);font-size:19px;font-weight:600;color:var(--green-d)}
.brand-txt small{font-size:12.5px;color:var(--muted)}
.top-nav{display:flex;gap:8px;flex-wrap:wrap}
.top-nav a{text-decoration:none;font-size:13.5px;font-weight:500;color:var(--ink);padding:11px 16px;border:1px solid #D5DDD0;border-radius:999px;transition:.15s}
.top-nav a:hover{background:var(--mint-2);border-color:var(--green-l)}

/* hero */
.hero{background:var(--green-d);color:#fff;position:relative;overflow:hidden}
.ring{position:absolute;border-radius:50%;pointer-events:none}
.r1{right:-120px;top:-160px;width:520px;height:520px;border:70px solid rgba(255,255,255,.05)}
.r2{right:140px;top:90px;width:260px;height:260px;border:44px solid rgba(226,169,0,.18)}
.hero-in{position:relative;display:flex;flex-wrap:wrap;gap:40px;align-items:flex-end;justify-content:space-between;padding-block:64px 72px}
.hero-txt{flex:1 1 520px;max-width:660px}
.eyebrow{margin:0 0 18px;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:#F2C94C;font-weight:600}
h1{margin:0 0 20px;font-family:var(--serif);font-weight:500;font-size:clamp(34px,5vw,52px);line-height:1.08;letter-spacing:-.01em}
.lead{margin:0;font-size:17px;line-height:1.6;color:#D3E6DA;max-width:560px}
.hero-stats{flex:0 1 440px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:280px}
.stat{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:18px 20px;display:flex;flex-direction:column;gap:6px;backdrop-filter:blur(4px)}
.stat span{font-size:12px;color:#BBD6C6}
.stat b{font-family:var(--serif);font-size:30px;font-weight:500}
.stat b i{font:500 15px var(--sans)}
.stat em{font-style:normal;font-size:12.5px;color:#BBD6C6}

/* section */
main{padding-block:48px 24px}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:24px}
h2{margin:0;font-family:var(--serif);font-size:30px;font-weight:500;color:var(--green-d)}
.sub{margin:6px 0 0;font-size:14px;color:var(--muted)}
.tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.search{position:relative;display:block}
.search svg{position:absolute;left:14px;top:50%;width:18px;height:18px;transform:translateY(-50%);fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round}
.search input{width:300px;max-width:100%;height:46px;border:1px solid #C9D3C4;border-radius:999px;padding:0 18px 0 42px;font:400 14px var(--sans);background:#fff;color:var(--ink)}
.search input:focus{outline:3px solid var(--gold);outline-offset:1px;border-color:var(--green)}
.ghost{background:transparent;border:1px solid #C9D3C4;border-radius:999px;padding:0 18px;height:46px;font-size:13.5px;font-weight:500;color:var(--ink);transition:.15s}
.ghost:hover{background:var(--mint-2)}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.card{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:14px;padding:18px;min-height:156px;border-radius:18px;border:1.5px solid var(--line);background:var(--card);transition:transform .18s,box-shadow .18s,border-color .18s}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(11,93,59,.12);border-color:var(--green-l)}
.card:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.card.on{border-color:var(--green);background:var(--mint-2);box-shadow:0 8px 24px rgba(11,93,59,.16)}
.card-top{display:flex;align-items:center;justify-content:space-between}
.ico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--mint);color:var(--green);transition:.18s}
.ico svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.card.on .ico{background:var(--green);color:#fff}
.part{font-size:12px;font-weight:500;color:var(--muted)}
.card-name{font-family:var(--serif);font-size:17px;font-weight:600;line-height:1.25;color:var(--ink)}
.meter{margin-top:auto;display:flex;flex-direction:column;gap:7px}
.bar{display:block;height:6px;border-radius:99px;background:#E8EDE4;overflow:hidden}
.bar i{display:block;height:100%;border-radius:99px;background:var(--green-l);transition:width .5s cubic-bezier(.2,.8,.2,1)}
.card.on .bar i{background:var(--green)}
.meter small{font-size:13px;color:var(--muted)}
.empty{text-align:center;color:var(--muted);padding:32px}

/* detail */
.detail{margin-top:40px;scroll-margin-top:96px}
.detail:focus{outline:none}
.panel{background:#fff;border:1px solid var(--line);border-radius:24px;padding:36px;display:flex;flex-direction:column;gap:34px;animation:rise .35s ease}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.p-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px}
.p-head .kick{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#8A6700;font-weight:600}
.p-head h2{font-size:clamp(28px,4vw,38px);line-height:1.1;margin:8px 0}
.p-head p{margin:0;font-size:15.5px;color:var(--muted);max-width:680px}
.close{background:#fff;border:1px solid #C9D3C4;border-radius:999px;height:44px;padding:0 18px;font-size:13.5px;font-weight:500}
.close:hover{background:var(--mint-2)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.kpi{background:#F3F6EF;border-radius:16px;padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.kpi span{font-size:12.5px;color:var(--muted)}
.kpi b{font-family:var(--serif);font-size:28px;font-weight:500;color:var(--green-d)}
.kpi b i{font:500 14px var(--sans)}
h3{margin:0 0 14px;font-family:var(--serif);font-size:22px;font-weight:500}
.docs{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}
.doc{border:1px solid var(--line);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:12px;border-top:4px solid var(--green)}
.doc.rofe{border-top-color:var(--gold)}
.doc .tag{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.doc.rofe .tag{color:var(--gold-d)}
.doc .t{font-family:var(--serif);font-size:20px;font-weight:600;line-height:1.25}
.doc .m{font-size:13.5px;color:var(--muted)}
.doc .note{font-size:13px;color:var(--muted);background:#FBF6E4;border-radius:10px;padding:8px 12px;margin:0}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:4px}
.btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:600;font-size:14px;padding:0 22px;height:46px;border-radius:999px;background:var(--green);color:#fff;transition:.15s}
.btn:hover{background:var(--green-d);color:#fff;transform:translateY(-1px)}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rofe .btn{background:var(--gold);color:#1B1500}
.rofe .btn:hover{background:#c99600;color:#1B1500}
.btn.line{background:transparent;color:var(--ink);border:1px solid #C9D3C4}
.btn.line:hover{background:var(--mint-2);color:var(--ink)}
.mins{display:flex;flex-direction:column;gap:14px}
.min{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 150px;gap:16px;align-items:center}
.min .n{font-size:14px;line-height:1.35}
.min .n small{display:block;color:var(--muted);font-size:12px}
.min .bar{height:10px}
.min .bar i{background:var(--green)}
.min .v{font-size:14px;font-weight:600;text-align:right;white-space:nowrap}
.min .v small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.fin{display:flex;height:14px;border-radius:99px;overflow:hidden;background:#E8EDE4}
.fin i{display:block;height:100%}
.legend{display:flex;gap:24px;margin-top:10px;font-size:13px;color:var(--muted);flex-wrap:wrap}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}
.lines{width:100%;border-collapse:collapse;margin-top:18px;font-size:14px}
.lines th{font-weight:500;color:var(--muted);text-align:right;font-size:12.5px;padding:8px 10px;border-bottom:1px solid var(--line)}
.lines th:first-child,.lines td:first-child{text-align:left}
.lines td{padding:11px 10px;border-bottom:1px solid #EEF2EA;text-align:right}
.lines td:first-child{padding-left:0}
.tbl{overflow-x:auto}
.intro-docs{margin-top:8px}

.foot{padding-block:32px 56px;font-size:12.5px;color:var(--muted);line-height:1.65}

@media (max-width:700px){
  .panel{padding:22px}
  .min{grid-template-columns:1fr 110px}
  .min .bar{grid-column:1/-1;order:3}
  .search input{width:100%}
  .search,.tools{width:100%}
  .brand-txt small{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* par nature */
.fin.tall{height:22px;margin-bottom:6px}
.lines caption{text-align:left;font-weight:600;font-size:14px;padding:22px 0 4px}
.lines tr.sum td{font-weight:600;border-top:2px solid var(--line);border-bottom:0}
.callout{background:#FBF6E4;border:1px solid #EFE2B0;border-radius:18px;padding:22px 24px;margin-top:26px}
.callout h3{margin-bottom:6px}
.callout .min{grid-template-columns:minmax(0,1fr) 0 150px}

/* comparaison 2023 */
.dlt{font-style:normal;font-size:12.5px;font-weight:500}
.dlt.up,.lines td.up{color:#14261C}
.dlt.dn,.lines td.dn{color:#14261C}
.doc.old{border-top-color:#9AA79F}
.doc.old .tag{color:#5b6a61}

/* sélecteur d'exercice */
.yearbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:-6px 0 22px}
.yl{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--gold-d)}
.years{display:inline-flex;background:#fff;border:1px solid #C9D3C4;border-radius:999px;padding:4px;gap:2px}
.years button{border:0;background:transparent;border-radius:999px;min-height:40px;padding:0 22px;font-size:14px;font-weight:600;color:var(--ink);transition:.15s}
.years button:hover{background:var(--mint-2)}
.years button[aria-pressed=true]{background:var(--green);color:#fff}
.yn{margin:0;font-size:13px;color:var(--muted)}
/* comparaison ROFE / LdR */
.cmp-head{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:baseline;justify-content:space-between}
.cmp-head h3{margin:0}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 4px}
.badge{font-size:12px;font-weight:600;padding:5px 12px;border-radius:999px;background:var(--mint);color:var(--green-d)}
.badge.rofe{background:#FBF1CC;color:var(--gold-d)}
.badge.off{background:#EEF0EC;color:var(--muted)}
.cmp td.gap{font-weight:600}
.cmp .mut{color:var(--muted)}
.cmp-note{font-size:13px;color:var(--muted);background:#F3F6EF;border-radius:12px;padding:12px 16px;margin:14px 0 0}
.cmp-note b{color:var(--ink)}
.unavail{background:#F3F6EF;border-radius:16px;padding:18px 22px;color:var(--muted);font-size:14px}
.unavail b{color:var(--ink)}
@media (max-width:700px){.years button{padding:0 16px}}
.years{flex-wrap:wrap;border-radius:22px}
