.article-page {
    --article-ink:#242320;
    --article-soft:#6f6a61;
    --article-paper:#f7f4ed;
    --article-line:#d9d1c3;
    --article-accent:#8b6b3f;
    color:var(--article-ink);
    background:#fff;
  }
  .article-page * { box-sizing:border-box; }
  .article-page .article-shell { width:min(1160px, calc(100% - 40px)); margin:0 auto; }
  .article-page .article-hero {
    background:linear-gradient(
      to bottom,
      rgba(247, 244, 237, 0) 0%,
      rgba(247, 244, 237, .45) 18%,
      var(--article-paper) 42%,
      var(--article-paper) 100%
    );
    border-bottom:1px solid var(--article-line);
    padding:clamp(44px, 7vw, 96px) 0;
  }
  .article-page .article-hero-grid {
    display:grid;
    grid-template-columns:minmax(0, 1.25fr) minmax(300px, .75fr);
    gap:clamp(38px, 7vw, 90px);
    align-items:center;
  }
  .article-page .article-kicker {
    margin:0 0 24px;
    color:var(--article-accent);
    font:700 .76rem/1.2 Arial, sans-serif;
    letter-spacing:.18em;
    text-transform:uppercase;
  }
  .article-page .article-title {
    max-width:780px;
    margin:0;
    color:var(--article-ink);
    font-family:Georgia, "Times New Roman", serif;
    font-size:clamp(2.35rem, 5.2vw, 5rem);
    font-weight:400;
    letter-spacing:-.035em;
    line-height:1.02;
  }
  .article-page .article-deck {
    max-width:650px;
    margin:28px 0 0;
    color:var(--article-soft);
    font-family:Georgia, "Times New Roman", serif;
    font-size:clamp(1.1rem, 1.7vw, 1.35rem);
    line-height:1.55;
  }
  .article-page .article-byline {
    display:flex;
    flex-wrap:wrap;
    gap:8px 18px;
    margin-top:34px;
    padding-top:20px;
    border-top:1px solid var(--article-line);
    color:var(--article-soft);
    font:600 .78rem/1.5 Arial, sans-serif;
    letter-spacing:.06em;
    text-transform:uppercase;
  }
  .article-page .article-cover { margin:0; }
  .article-page .article-cover img {
    display:block;
    width:100%;
    aspect-ratio:4/5;
    object-fit:cover;
    box-shadow:18px 18px 0 #e7dfd1;
  }
  .article-page .article-layout {
    display:grid;
    grid-template-columns:220px minmax(0, 760px);
    gap:clamp(42px, 7vw, 92px);
    justify-content:center;
    align-items:start;
    padding:clamp(54px, 8vw, 100px) 0 110px;
  }
  .article-page .article-toc {
    position:sticky;
    top:110px;
    padding-top:7px;
  }
  .article-page .article-toc-title {
    margin:0 0 18px;
    color:var(--article-accent);
    font:700 .72rem/1.2 Arial, sans-serif;
    letter-spacing:.15em;
    text-transform:uppercase;
  }
  .article-page .article-toc ol { margin:0; padding:0; list-style:none; counter-reset:toc; }
  .article-page .article-toc li { counter-increment:toc; border-top:1px solid var(--article-line); }
  .article-page .article-toc a {
    display:grid;
    grid-template-columns:24px 1fr;
    gap:8px;
    padding:10px 0;
    color:var(--article-soft);
    font:500 .78rem/1.35 Arial, sans-serif;
    text-decoration:none;
  }
  .article-page .article-toc a::before { content:counter(toc, decimal-leading-zero); color:var(--article-accent); font-size:.68rem; }
  .article-page .article-toc a:hover { color:var(--article-ink); }
  .article-page .article-chapter { scroll-margin-top:100px; padding:0 0 68px; margin:0 0 68px; border-bottom:1px solid var(--article-line); }
  .article-page .article-chapter:last-child { margin-bottom:0; }
  .article-page .article-content { color:var(--article-ink); line-height:1.82; }
  .article-page .section-title {
    margin:0 0 32px !important;
    color:var(--article-ink);
    font-family:Georgia, "Times New Roman", serif;
    font-size:clamp(1.85rem, 3.2vw, 2.65rem);
    font-weight:400;
    line-height:1.15;
  }
  .article-page .section-title::before { display:block; width:42px; height:2px; margin:0 0 20px; background:var(--article-accent); content:""; }
  .article-page .section-title a { color:inherit; text-decoration:none; }
  .article-page .article-paragraph { margin:0 0 1.25em; color:var(--article-ink); font-family:Georgia, "Times New Roman", serif; font-size:1.08rem; line-height:1.82; }
  .article-page .article-chapter:first-child .article-paragraph:first-of-type::first-letter {
    float:left;
    margin:.08em .12em 0 0;
    color:var(--article-accent);
    font-family:Georgia, "Times New Roman", serif;
    font-size:4.5em;
    line-height:.76;
  }
  .article-page .article-figure { margin:42px 0 12px; text-align:center; }
  .article-page .article-image { margin:42px 0 12px; }
  .article-page .article-figure img,
  .article-page .article-image img { display:block; width:100%; height:auto; }
  .article-page .article-caption { max-width:620px; margin:12px auto 0; color:var(--article-soft); font:italic .85rem/1.5 Georgia, serif; text-align:center; }
  .article-page .article-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:42px 0; }
  .article-page .article-gallery .article-figure { margin:0; }
  .article-page .article-gallery img { width:100%; height:100%; min-height:260px; object-fit:cover; }
  .article-page .article-gallery figcaption { grid-column:1/-1; }
  .article-page strong { font-weight:700; }
  .article-page .article-endmark { margin:0; color:var(--article-accent); font:400 2rem/1 Georgia, serif; text-align:center; }
  .article-page .article-related {
    margin:4px 0 54px;
    padding:28px 0;
    border-top:1px solid var(--article-line);
    border-bottom:1px solid var(--article-line);
  }
  .article-page .article-related-label {
    display:block;
    margin-bottom:10px;
    color:var(--article-accent);
    font:700 .7rem/1.2 Arial, sans-serif;
    letter-spacing:.15em;
    text-transform:uppercase;
  }
  .article-page .article-related a {
    color:var(--article-ink);
    font:400 clamp(1.25rem, 2.4vw, 1.65rem)/1.35 Georgia, "Times New Roman", serif;
    text-decoration:none;
  }
  .article-page .article-related a::after { content:" →"; color:var(--article-accent); }
  .article-page .article-related a:hover { color:var(--article-accent); }
  @media (max-width: 900px) {
    .article-page .article-hero-grid { grid-template-columns:1fr; }
    .article-page .article-cover { width:min(440px, 88%); }
    .article-page .article-layout { grid-template-columns:1fr; }
    .article-page .article-toc { position:static; padding:0 0 18px; border-bottom:1px solid var(--article-line); }
    .article-page .article-toc ol { columns:2; column-gap:30px; }
    .article-page .article-toc li { break-inside:avoid; }
  }
  @media (max-width: 620px) {
    .article-page .article-shell { width:min(100% - 28px, 1160px); }
    .article-page .article-hero { padding-top:38px; }
    .article-page .article-cover { width:calc(100% - 18px); }
    .article-page .article-cover img { box-shadow:12px 12px 0 #e7dfd1; }
    .article-page .article-toc ol { columns:1; }
    .article-page .article-chapter { padding-bottom:46px; margin-bottom:46px; }
    .article-page .article-gallery { grid-template-columns:1fr; }
    .article-page .article-gallery img { min-height:0; }
  }

/* =========================================================
   PAGE DE RECENSEMENT /articles/
   ========================================================= */

.articles-index-page {
  --article-ink:#242320;
  --article-soft:#6f6a61;
  --article-paper:#f7f4ed;
  --article-line:#d9d1c3;
  --article-accent:#8b6b3f;
  color:var(--article-ink);
  background:#fff;
}

.articles-index-page * { box-sizing:border-box; }

.articles-index-hero {
  padding:clamp(58px, 8vw, 112px) 0 clamp(46px, 7vw, 88px);
  background:linear-gradient(to bottom, rgba(247,244,237,0), var(--article-paper));
  border-bottom:1px solid var(--article-line);
}

.articles-index-title {
  max-width:880px;
  margin:0;
  color:var(--article-ink);
  font:400 clamp(2.8rem, 7vw, 6.4rem)/.95 Georgia, "Times New Roman", serif;
  letter-spacing:-.05em;
}

.articles-index-main {
  padding: 0 0 30px;
}

.articles-filters {
  display:flex;
  gap:10px;
  overflow-x:auto;
  margin:0;
  padding:28px 0 30px;
  scrollbar-width:thin;
}

.articles-filter {
  flex:0 0 auto;
  padding:9px 15px;
  border:1px solid var(--article-line);
  border-radius:999px;
  color:var(--article-soft);
  background:#fff;
  font:700 .7rem/1 Arial, sans-serif;
  letter-spacing:.08em;
  text-decoration:none;
  text-transform:uppercase;
  transition:background .2s ease, border-color .2s ease, color .2s ease;
}

.articles-filter:hover,
.articles-filter.is-active {
  color:#fff;
  border-color:var(--article-accent);
  background:var(--article-accent);
}

.articles-featured {
  display:grid;
  grid-template-columns:minmax(0, 1.35fr) minmax(310px, .65fr);
  gap:clamp(34px, 6vw, 80px);
  align-items:center;
  padding:clamp(28px, 5vw, 70px) 0 clamp(66px, 8vw, 104px);
}

.articles-featured-image {
  display:block;
  overflow:hidden;
  background:var(--article-paper);
}

.articles-featured-image img {
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  transition:transform .45s ease;
}

.articles-featured-image:hover img { transform:scale(1.025); }

.articles-featured-copy h2 {
  margin:0;
  color:var(--article-ink);
  font:400 clamp(2rem, 3.8vw, 3.6rem)/1.04 Georgia, "Times New Roman", serif;
  letter-spacing:-.035em;
}

.articles-featured-copy h2 a,
.articles-list-copy h3 a { color:inherit; text-decoration:none; }
.articles-featured-copy h2 a:hover,
.articles-list-copy h3 a:hover { color:var(--article-accent); }

.articles-featured-copy > p:not(.article-kicker) {
  margin:24px 0;
  color:var(--article-soft);
  font:400 1.02rem/1.7 Georgia, "Times New Roman", serif;
}

.articles-read-more,
.articles-text-link {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:11px 17px;
  border:1px solid var(--article-ink);
  border-radius:999px;
  color:var(--article-ink);
  font:700 .72rem/1 Arial, sans-serif;
  letter-spacing:.08em;
  text-decoration:none;
  text-transform:uppercase;
}

.articles-read-more::after,
.articles-text-link::after { content:"→"; color:var(--article-accent); }
.articles-read-more:hover,
.articles-text-link:hover { color:#fff; background:var(--article-ink); }

.articles-content-grid {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(240px, 310px);
  gap:clamp(50px, 8vw, 104px);
  align-items:start;
}

.articles-section-heading {
  margin-bottom:30px;
  padding-bottom:20px;
  border-bottom:1px solid var(--article-line);
}

.articles-section-heading .article-kicker { margin-bottom:12px; }

.articles-section-heading h2 {
  margin:0;
  color:var(--article-ink);
  font:400 clamp(1.8rem, 3vw, 2.7rem)/1.1 Georgia, "Times New Roman", serif;
}

.articles-list { display:grid; }

.articles-list-item {
  display:grid;
  grid-template-columns:minmax(150px, 220px) minmax(0, 1fr);
  gap:24px;
  padding:0 0 28px;
  margin:0 0 28px;
  border-bottom:1px solid var(--article-line);
}

.articles-list-image { display:block; overflow:hidden; background:var(--article-paper); }
.articles-list-image img {
  display:block;
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  transition:transform .35s ease;
}
.articles-list-image:hover img { transform:scale(1.035); }

.articles-card-meta {
  margin:0 0 9px;
  color:var(--article-accent);
  font:700 .66rem/1.35 Arial, sans-serif;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.articles-list-copy h3 {
  margin:0;
  color:var(--article-ink);
  font:400 clamp(1.2rem, 2vw, 1.55rem)/1.22 Georgia, "Times New Roman", serif;
}

.articles-list-copy > p:last-child {
  display:-webkit-box;
  overflow:hidden;
  margin:12px 0 0;
  color:var(--article-soft);
  font:400 .92rem/1.6 Georgia, "Times New Roman", serif;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
}

.articles-discovery {
  position:sticky;
  top:112px;
}

.articles-discovery-list { display:grid; gap:22px; }
.articles-discovery-item a {
  display:grid;
  grid-template-columns:92px minmax(0, 1fr);
  gap:14px;
  align-items:center;
  color:var(--article-ink);
  font:600 .9rem/1.35 Arial, sans-serif;
  text-decoration:none;
}
.articles-discovery-item img {
  display:block;
  width:92px;
  aspect-ratio:1;
  object-fit:cover;
  filter:saturate(.85);
}
.articles-discovery-item a:hover { color:var(--article-accent); }

.articles-pagination {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  margin-top:42px;
  padding-top:26px;
}

.articles-page-numbers { display:flex; gap:7px; align-items:center; }
.articles-page-number,
.articles-page-ellipsis {
  display:grid;
  width:40px;
  height:40px;
  place-items:center;
  border:1px solid var(--article-line);
  color:var(--article-soft);
  background:#fff;
  font:700 .78rem/1 Arial, sans-serif;
  text-decoration:none;
}
.articles-page-number:hover,
.articles-page-number.is-current {
  color:#fff;
  border-color:var(--article-accent);
  background:var(--article-accent);
}
.articles-page-arrow {
  color:var(--article-ink);
  font:700 .75rem/1.2 Arial, sans-serif;
  text-decoration:none;
}
.articles-page-arrow:hover { color:var(--article-accent); }

.articles-themes {
  margin-top:clamp(72px, 10vw, 130px);
  padding-top:clamp(50px, 7vw, 82px);
  border-top:1px solid var(--article-line);
}

.articles-theme-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  border-top:1px solid var(--article-line);
  border-left:1px solid var(--article-line);
}
.articles-theme-grid a {
  display:flex;
  justify-content:space-between;
  gap:20px;
  min-height:116px;
  padding:24px;
  border-right:1px solid var(--article-line);
  border-bottom:1px solid var(--article-line);
  color:var(--article-ink);
  background:#fff;
  font:400 1.15rem/1.3 Georgia, "Times New Roman", serif;
  text-decoration:none;
  transition:background .2s ease, color .2s ease;
}
.articles-theme-grid a:hover { color:#fff; background:var(--article-accent); }

.articles-empty { padding:90px 0; text-align:center; }
.articles-empty h2 { margin:0 0 28px; font:400 clamp(2rem, 4vw, 3.5rem)/1.1 Georgia, serif; }
.articles-empty-inline { color:var(--article-soft); font:400 1rem/1.7 Georgia, serif; }

@media (max-width:900px) {
  .articles-featured { grid-template-columns:1fr; }
  .articles-featured-copy { max-width:720px; }
  .articles-content-grid { grid-template-columns:1fr; }
  .articles-discovery { position:static; }
  .articles-discovery-list { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .articles-theme-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

@media (max-width:640px) {
  .articles-index-hero { padding-top:48px; }
  .articles-featured { padding-top:20px; }
  .articles-featured-image img { aspect-ratio:4/3; }
  .articles-list-item { grid-template-columns:118px minmax(0, 1fr); gap:16px; }
  .articles-list-copy > p:last-child { display:none; }
  .articles-discovery-list { grid-template-columns:1fr; }
  .articles-pagination { align-items:flex-start; flex-wrap:wrap; }
  .articles-page-numbers { order:3; width:100%; overflow-x:auto; }
  .articles-theme-grid { grid-template-columns:1fr; }
  .articles-theme-grid a { min-height:88px; }
}
/* Carte finale de la page Articles */

.articles-visit-cta {
  margin-top:clamp(40px, 6vw, 72px);
  margin-bottom:20px;
}

.articles-visit-cta-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:24px;
}

.articles-visit-cta-copy {
  max-width:760px;
}

.articles-visit-cta-copy .article-kicker {
  margin:0 0 10px;
}

.articles-visit-cta-copy h2 {
  margin:0 0 12px;
}

.articles-visit-cta-copy .muted {
  margin:0;
  line-height:1.7;
}

.articles-visit-cta-action {
  flex:0 0 auto;
}

@media (max-width:700px) {
  .articles-visit-cta {
    margin-top:40px;
    margin-bottom:12px;
  }

  .articles-visit-cta-inner {
    align-items:flex-start;
    gap:20px;
  }

  .articles-visit-cta-action,
  .articles-visit-cta-action .btn {
    width:100%;
  }

  .articles-visit-cta-action .btn {
    text-align:center;
  }
}
/* =========================================================
   CARTE DE VISITE ASSOCIÉE
   ========================================================= */

.article-page .article-related-visit {
  padding-bottom:0;
  margin-bottom:0;
  border-bottom:0;
}

.article-page .article-related-visit > .article-content {
  max-width:none;
}

.article-page .article-visit-card {
  display:grid;
  grid-template-columns:minmax(220px, 34%) minmax(0, 1fr);
  align-items:stretch;
  overflow:hidden;
  border:1px solid var(--article-line);
  border-radius:4px;
  background:var(--article-paper);
}

.article-page .article-visit-thumbnail {
  min-height:260px;
  margin:0;
}

.article-page .article-visit-thumbnail img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.article-page .article-visit-card-content {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:clamp(26px, 4vw, 48px);
}

.article-page .article-visit-card-content .section-title {
  margin-bottom:18px !important;
}

.article-page .article-visit-card-content .article-paragraph {
  margin-bottom:24px;
}

.article-page .article-visit-button {
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
}

.article-page .article-visit-button span {
  transition:transform .2s ease;
}

.article-page .article-visit-button:hover span {
  transform:translateX(4px);
}

@media (max-width:720px) {
  .article-page .article-visit-card {
    grid-template-columns:1fr;
  }

  .article-page .article-visit-thumbnail {
    min-height:0;
  }

  .article-page .article-visit-thumbnail img {
    aspect-ratio:16 / 9;
  }

  .article-page .article-visit-card-content {
    padding:26px 22px;
  }

  .article-page .article-visit-button {
    justify-content:center;
    width:100%;
  }
}
