/* Long-form article : se charge APRES legal.css */
main{padding:0 0 90px}
.hero-art{background:var(--sand);padding:60px 0 52px;margin-bottom:52px;border-bottom:1px solid var(--line)}
.crumb{font-size:.78rem;letter-spacing:.05em;color:var(--faint);margin:0 0 1.2rem}
.crumb a{color:var(--soft);text-decoration:none}
.crumb a:hover{color:var(--forest);text-decoration:underline}
.hero-art h1{font-size:2.35rem;line-height:1.18;font-weight:200;letter-spacing:-.015em;margin:0 0 1.1rem;max-width:19ch}
.byline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:.84rem;color:var(--faint)}
.byline strong{color:var(--soft);font-weight:400}
.byline .dot{opacity:.5}
.chapo{font-size:1.14rem;line-height:1.8;color:var(--soft);margin:1.6rem 0 0;max-width:60ch}

article{font-size:1.02rem;line-height:1.85}
article p{margin:0 0 1.35rem;max-width:66ch}
article h2{font-size:1.42rem;font-weight:300;color:var(--forest);margin:3.2rem 0 1rem;letter-spacing:-.005em;max-width:26ch}
article h3{font-size:1.06rem;font-weight:500;margin:2.2rem 0 .7rem}
article ul,article ol{max-width:64ch;margin:0 0 1.5rem;padding-left:1.3rem}
article li{margin-bottom:.65rem}
article strong{font-weight:500;color:var(--ink)}
article em{font-style:italic}

.pull{border-left:3px solid var(--sage);padding:.3rem 0 .3rem 1.6rem;margin:2.2rem 0;
      font-size:1.14rem;line-height:1.7;color:var(--forest);font-weight:300;max-width:56ch}
.note{background:var(--sand);border-radius:12px;padding:1.5rem 1.7rem;margin:2.2rem 0;
      font-size:.94rem;line-height:1.75;max-width:64ch}
.note p:last-child{margin-bottom:0}
.note strong{color:var(--forest)}
.warn{background:#fdf7f4;border-left:3px solid var(--clay);border-radius:0 10px 10px 0;
      padding:1.4rem 1.7rem;margin:2.2rem 0;font-size:.94rem;line-height:1.75;max-width:64ch}
.warn p:last-child{margin-bottom:0}

.refs{margin-top:3rem;padding-top:1.6rem;border-top:1px solid var(--line);font-size:.82rem;
      line-height:1.7;color:var(--faint);max-width:66ch}
.refs h2{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);
         font-weight:600;margin:0 0 .9rem}
.refs ol{padding-left:1.2rem;margin:0}
.refs li{margin-bottom:.5rem}

.cta-art{background:var(--forest);color:var(--sand);border-radius:16px;padding:2.6rem 2.2rem;
         margin:3.4rem 0 0;text-align:center}
.cta-art h2{color:var(--cream);margin:0 0 .8rem;font-size:1.36rem;max-width:none}
.cta-art p{color:rgba(246,243,238,.8);max-width:46ch;margin:0 auto 1.7rem;font-size:.97rem}
.cta-art .btn{display:inline-block;padding:.9rem 1.9rem;border-radius:999px;background:var(--cream);
              color:var(--forest);text-decoration:none;font-size:.94rem;transition:transform .18s}
.cta-art .btn:hover{transform:translateY(-1px)}
.cta-art .sub{display:block;margin-top:1.1rem;font-size:.83rem;color:rgba(246,243,238,.62)}

.more{margin-top:3.4rem;padding-top:2rem;border-top:1px solid var(--line)}
.more h2{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);
         font-weight:600;margin:0 0 1.2rem}
.more-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.card{display:block;padding:1.4rem 1.5rem;border:1px solid var(--line);border-radius:12px;
      text-decoration:none;background:var(--cream);transition:border-color .18s,transform .18s}
.card:hover{border-color:var(--sage);transform:translateY(-2px)}
.card .k{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);display:block;margin-bottom:.5rem}
.card .t{font-size:1rem;line-height:1.5;color:var(--forest);font-weight:400}

.post-list{display:grid;gap:20px;margin-top:2.4rem}
.post{display:block;padding:1.9rem 2rem;border:1px solid var(--line);border-radius:14px;
      background:var(--cream);text-decoration:none;transition:border-color .18s,transform .18s}
.post:hover{border-color:var(--sage);transform:translateY(-2px)}
.post .meta{font-size:.76rem;letter-spacing:.06em;color:var(--faint);margin-bottom:.6rem}
.post h2{font-size:1.28rem;font-weight:400;color:var(--forest);margin:0 0 .6rem;line-height:1.35}
.post p{font-size:.94rem;color:var(--soft);margin:0;line-height:1.7}

@media(max-width:640px){
  .hero-art{padding:40px 0 34px;margin-bottom:36px}
  .hero-art h1{font-size:1.72rem;max-width:none}
  .chapo{font-size:1.04rem}
  article{font-size:1rem}
  article h2{font-size:1.24rem;max-width:none}
  .more-grid{grid-template-columns:1fr}
  .cta-art{padding:2rem 1.4rem}
}
