/*
 * Level 3 article reading layout.
 * Longer paragraph groups use a calm editorial column rhythm on desktop;
 * tablet and mobile deliberately remain single-column.
 */
@media (min-width: 1100px) {
  .article-modal.has-long-article .article-body {
    width: 100% !important;
    max-width: 1040px !important;
  }

  .article-modal.has-long-article .article-copy-section.is-column-copy {
    max-width: 1040px;
    margin: clamp(38px, 4.5vw, 64px) 0;
    column-count: 3;
    column-gap: clamp(30px, 3.4vw, 52px);
    column-rule: 1px solid rgba(23, 30, 21, .07);
    text-wrap: pretty;
  }

  .article-modal.has-long-article .article-copy-section.is-column-copy > p {
    display: inline !important;
    max-width: none !important;
    margin: 0 !important;
    font-size: clamp(.98rem, 1vw, 1.08rem) !important;
    line-height: 1.68 !important;
    letter-spacing: 0 !important;
  }

  .article-modal.has-long-article .article-copy-section.is-column-copy > h3 {
    display: block !important;
    column-span: all;
    max-width: 840px !important;
    margin: 0 0 clamp(34px, 3.8vw, 50px) !important;
    font-size: clamp(1.55rem, 2.3vw, 2.5rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -.024em !important;
    font-weight: 650 !important;
    color: rgba(23, 30, 21, .94) !important;
  }

  .article-modal.has-long-article .article-copy-section.is-column-copy > p + p::before {
    content: " ";
  }

  .article-modal.has-long-article .article-copy-section.is-column-copy > p {
    font-weight: 390 !important;
    color: rgba(23, 30, 21, .62) !important;
    hyphens: auto;
  }
}

@media (min-width: 761px) and (max-width: 1099px) {
  .article-modal.has-long-article .article-copy-section > h3 {
    margin-top: clamp(34px, 4vw, 50px) !important;
  }
}
