/* ============================================================
   SPO — ARTICLE EXPERIENCE V3.1 — LAYOUT
   Mission: SPO-ARTICLE-EXPERIENCE-V3.1-MOCKUP-20260922
   ============================================================ */

body.single-post #content.site-content > .container {
  width: 100%;
  max-width: none;
  padding-right: 0;
  padding-left: 0;
}

body.single-post .post--single.spo-articleV31 {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

body.single-post #content.site-content > .container > .spo-mediaArticleRow {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

body.single-post .spo-mediaArticleMain {
  display: block;
  float: none;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0;
}

body.single-post .spo-articleShell {
  width: min(1180px, calc(100% - 44px));
  margin-right: auto;
  margin-left: auto;
}

body.single-post .spo-articleOverview__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .95rem;
  align-items: start;
}

body.single-post .spo-articleOverview__grid.has-keypoints {
  grid-template-columns: minmax(0, 1.85fr) minmax(280px, .95fr);
}

body.single-post .spo-articleLayout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 320px);
  gap: clamp(1.55rem, 3vw, 2.4rem);
  justify-content: center;
  align-items: start;
}

body.single-post .spo-articleBody {
  width: 100%;
  max-width: 780px;
}

body.single-post .spo-articleRail {
  position: sticky;
  top: 22px;
  align-self: start;
}

@media (max-width: 1020px) {
  body.single-post .spo-articleShell {
    width: min(100% - 36px, 1080px);
  }

  body.single-post .spo-articleOverview__grid.has-keypoints {
    grid-template-columns: minmax(0, 1.55fr) minmax(250px, .95fr);
  }

  body.single-post .spo-articleLayout {
    grid-template-columns: minmax(0, 1fr) minmax(250px, 290px);
    gap: 1.5rem;
  }
}

@media (max-width: 800px) {
  body.single-post .spo-articleShell {
    width: min(100% - 28px, 720px);
  }

  body.single-post .spo-articleHero__metaRow {
    align-items: flex-start;
    flex-direction: column;
    gap: .72rem;
  }

  body.single-post .spo-articleMeta {
    justify-content: flex-start;
  }

  body.single-post .spo-articleOverview__grid,
  body.single-post .spo-articleOverview__grid.has-keypoints {
    grid-template-columns: minmax(0, 1fr);
  }

  body.single-post .spo-articleLayout {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.2rem;
    padding-top: 1rem;
  }

  body.single-post .spo-articleBody {
    max-width: none;
  }

  body.single-post .spo-articleRail {
    position: static;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .8rem;
  }

  body.single-post .spo-sideCard {
    margin: 0;
  }

  body.single-post .spo-sideCard--figures,
  body.single-post .spo-sideCard--repere {
    grid-column: 1 / -1;
  }

  body.single-post .spo-articleBody table {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  body.single-post .spo-articleRelated__head {
    align-items: flex-start;
    flex-direction: column;
    gap: .72rem;
  }

  body.single-post .spo-articleRelated__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  body.single-post .spo-relatedCard {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
  }

  body.single-post .spo-relatedCard__media {
    height: 100%;
    min-height: 150px;
    aspect-ratio: auto;
  }

  body.single-post .spo-articleFooter .post-navigation .nav-links {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 520px) {
  body.single-post .spo-articleShell {
    width: min(100% - 22px, 680px);
  }

  body.single-post .spo-breadcrumbs {
    margin-bottom: .82rem;
  }

  body.single-post .spo-breadcrumbs__item[aria-current="page"] {
    display: none;
  }

  body.single-post .spo-articleHero__topics a {
    display: none;
  }

  body.single-post .spo-articleHero h1 {
    font-size: clamp(1.95rem, 9.2vw, 2.65rem);
    line-height: 1.04;
    letter-spacing: -.038em;
    text-wrap: pretty;
  }

  body.single-post .spo-articleHero__lead {
    font-size: 1rem;
  }

  body.single-post .spo-articleMeta {
    display: grid;
    gap: .4rem;
  }

  body.single-post .spo-articleHero__media {
    margin-top: 1.1rem;
  }

  body.single-post .spo-articleHero__image {
    aspect-ratio: 16 / 9;
  }

  body.single-post .spo-articleRail {
    grid-template-columns: minmax(0, 1fr);
  }

  body.single-post .spo-articleBody h2.spo-sectionHeading {
    min-height: 38px;
    margin-top: 1.9rem;
    padding-left: 44px;
    font-size: 1.34rem;
  }

  body.single-post .spo-articleBody h2.spo-sectionHeading::before {
    width: 33px;
    height: 33px;
    border-radius: 7px;
    font-size: .86rem;
  }

  body.single-post .spo-articleBody h3 {
    font-size: 1.12rem;
  }

  body.single-post .spo-keyFigures {
    grid-template-columns: minmax(0, 1fr);
  }

  body.single-post .spo-keyFigure,
  body.single-post .spo-keyFigure:nth-child(even) {
    padding: .68rem 0;
    border-right: 0;
  }

  body.single-post .spo-keyFigure:nth-child(n+2) {
    border-top: 1px solid rgba(210, 90, 118, .16);
  }

  body.single-post .spo-relatedCard {
    grid-template-columns: minmax(0, 1fr);
  }

  body.single-post .spo-relatedCard__media {
    min-height: 0;
    aspect-ratio: 16 / 9;
  }
}

@media print {
  body.single-post .spo-articleOverview,
  body.single-post .spo-articleRail,
  body.single-post .spo-articleRelated,
  body.single-post .spo-articleFooter,
  body.single-post .spo-articleAction,
  body.single-post .spo-breadcrumbs {
    display: none !important;
  }

  body.single-post .spo-articleHero {
    padding-top: 0;
    background: #fff;
  }

  body.single-post .spo-articleLayout {
    display: block;
  }

  body.single-post .spo-articleBody {
    max-width: none;
  }
}
