

.a-wrap{max-width:68ch;margin:0 auto;padding:0 24px}

.a-tete{padding:38px 0 8px}
.a-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:13px;color:var(--mut);margin-top:14px}
.a-meta .pastille{background:var(--bdx-soft);color:var(--bdx-deep);border-radius:var(--r-full);padding:4px 11px;font-weight:800;font-size:12px}

.ariane{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--mut)}
.ariane a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:3px}

.a-corps{font-size:17.5px;line-height:1.72;padding-bottom:20px}
.a-corps p{margin:0 0 20px}
.a-corps h2{font-family:var(--display);font-weight:700;font-size:27px;line-height:1.18;
  letter-spacing:-.02em;margin:44px 0 14px;scroll-margin-top:80px}
.a-corps h3{font-weight:800;font-size:19px;margin:30px 0 10px;letter-spacing:-.01em}
.a-corps ul,.a-corps ol{margin:0 0 20px;padding-left:22px}
.a-corps li{margin-bottom:9px}

.a-corps a:not(.btn){color:var(--bdx-deep);text-decoration:underline;text-underline-offset:3px}
.a-corps strong,.a-corps b{font-weight:800}

.a-chapo{font-size:19.5px;line-height:1.6;color:var(--mut);margin:18px 0 30px}

.a-table{width:100%;border-collapse:collapse;margin:0 0 26px;font-size:15.5px}
.a-table th,.a-table td{padding:12px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.a-table th{font-weight:800;font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--mut-l)}
.a-table .age{white-space:nowrap;font-weight:800;color:var(--bdx-deep)}
.a-table .oblig{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--bdx-deep)}
.a-table .reco{font-size:12px;color:var(--mut)}

.a-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:26px}
.a-scroll .a-table{margin-bottom:0}

.a-note{background:var(--paper);border-left:3px solid var(--bdx-light);border-radius:var(--r-md);
  padding:18px 20px;margin:0 0 26px;font-size:16px;line-height:1.62}
.a-note p:last-child{margin-bottom:0}
.a-note .titre{font-weight:800;margin-bottom:6px;display:block}

.a-sources{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:22px 24px;margin:38px 0 0;font-size:15px}
.a-sources h2{font-size:14px;text-transform:uppercase;letter-spacing:.08em;
  font-family:var(--body);font-weight:800;color:var(--mut-l);margin:0 0 12px}
.a-sources ul{margin:0;padding-left:20px}
.a-sources li{margin-bottom:8px;color:var(--mut)}
.a-sources a{color:var(--bdx-deep)}
.a-sources .verif{margin:14px 0 0;font-size:13px;color:var(--mut-l)}

.posts{display:grid;gap:16px;max-width:760px;margin:0 auto}
.post{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:24px;box-shadow:var(--sh-sm);transition:transform var(--ease),box-shadow var(--ease)}
.post:hover{transform:translateY(-2px);box-shadow:var(--sh-md)}
.post h2{font-family:var(--display);font-weight:700;font-size:23px;line-height:1.2;
  letter-spacing:-.02em;margin:8px 0 8px}
.post h2 a{text-decoration:none}
.post p{margin:0;color:var(--mut);font-size:16px;line-height:1.6}
.post .a-meta{margin-top:12px}

@media(max-width:520px){
  .a-corps{font-size:17px}
  .a-corps h2{font-size:24px}
  .a-wrap{padding:0 18px}
}

.edito{margin:22px 0 24px;padding-left:22px;font-size:16.5px;line-height:1.68}
.edito li{margin-bottom:14px}
.edito li::marker{color:var(--bdx-deep);font-weight:800}
.edito strong{font-weight:800}
.edito a{color:var(--bdx-deep);text-decoration:underline;text-underline-offset:3px}

.post{position:relative}
.post h2 a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.post{cursor:pointer}

.post-img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;
  object-position:center 26%;border-radius:var(--r-md);margin-bottom:14px;
  background:var(--cream)}

.a-figure{margin:30px 0}
.a-figure img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;
  object-position:center 26%;border-radius:var(--r-lg);box-shadow:var(--sh-md)}
.a-figure figcaption{margin-top:9px;font-size:14px;color:var(--mut-l);
  line-height:1.5;text-align:center}

@media(max-width:620px){

  .post-img{aspect-ratio:3/2}
  .a-figure img{aspect-ratio:4/3}
}
