.article-page { background: var(--paper); }
.article-hero, .article-layout { max-width: 1240px; margin: 0 auto; padding-right: 24px; padding-left: 24px; }
.article-hero { display: grid; grid-template-columns: minmax(0, .95fr) minmax(340px, 1.05fr); gap: clamp(36px, 7vw, 110px); padding-top: clamp(58px, 8vw, 118px); padding-bottom: clamp(65px, 9vw, 132px); }
.article-hero__copy { align-self: center; }
.article-hero .overline { color: var(--red); }
.article-kicker { margin: 0 0 17px; color: var(--forest); font: 800 11px Manrope, Arial, sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.article-hero h1 { max-width: 620px; margin: 0; font-size: clamp(43px, 5.2vw, 78px); letter-spacing: -.065em; line-height: .96; }
.article-lead { max-width: 560px; margin: 31px 0 0; color: #5a504a; font-size: 17px; line-height: 1.8; }
.article-hero__visual { position: relative; min-height: 460px; margin: 0; overflow: hidden; background: var(--cream); }
.article-hero__visual img { display: block; width: 100%; height: 100%; min-height: 460px; object-fit: cover; }
.article-hero__visual figcaption { position: absolute; right: 18px; bottom: 17px; left: 18px; color: #fffaf5; font: 800 10px Manrope, Arial, sans-serif; letter-spacing: .09em; line-height: 1.45; text-transform: uppercase; text-shadow: 0 1px 16px rgba(0,0,0,.55); }
.article-layout { display: grid; grid-template-columns: 210px minmax(0, 700px); justify-content: center; gap: clamp(38px, 8vw, 128px); padding-bottom: 120px; }
.article-aside { align-self: start; position: sticky; top: 28px; padding-top: 18px; border-top: 2px solid var(--red); }
.article-aside p { margin: 0 0 17px; color: var(--forest); font: 800 10px Manrope, Arial, sans-serif; letter-spacing: .11em; text-transform: uppercase; }
.article-aside ol { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; }
.article-aside a { color: #665d56; font-size: 12px; line-height: 1.45; }
.article-aside a:hover { color: var(--red); }
.article-content { min-width: 0; }
.article-intro { margin: 0 0 66px; color: var(--ink); font-family: Prata, Georgia, serif; font-size: clamp(21px, 2.2vw, 29px); line-height: 1.48; letter-spacing: -.035em; }
.article-content section { scroll-margin-top: 35px; margin-bottom: 72px; }
.article-number { margin: 0 0 16px; color: var(--red); font: 800 11px Manrope, Arial, sans-serif; letter-spacing: .13em; }
.article-content h2 { margin: 0 0 23px; font-size: clamp(32px, 3.3vw, 49px); line-height: 1.05; letter-spacing: -.055em; }
.article-content p:not(.article-number):not(.overline) { color: #514b45; font-size: 16px; line-height: 1.86; }
.article-note { margin: 35px 0 0; padding: 28px 31px; border-left: 3px solid var(--red); background: #f5e7db; color: #554b44; font-size: 15px; line-height: 1.75; }
.article-note strong { display: block; margin-bottom: 7px; color: var(--forest); font-family: Manrope, Arial, sans-serif; }
.article-content blockquote { margin: 37px 0 0; padding: 20px 0 20px 30px; border-left: 1px solid var(--forest); color: var(--forest); font-family: Prata, Georgia, serif; font-size: clamp(22px, 2.4vw, 31px); line-height: 1.42; letter-spacing: -.04em; }
.article-related { margin: 78px 0 84px !important; padding: 0 !important; }
.article-related__label { margin: 0 0 18px !important; color: var(--red) !important; font: 800 10px Manrope, Arial, sans-serif !important; letter-spacing: .12em; text-transform: uppercase; }
.article-related__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.article-related__grid a { display: flex; min-height: 204px; flex-direction: column; padding: 22px; border: 1px solid #e8ddd2; background: #fffaf5; color: var(--ink); transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.article-related__grid a:hover { border-color: var(--red); background: #f8eee6; transform: translateY(-2px); }
.article-related__grid span { color: var(--red); font: 800 9px Manrope, Arial, sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.article-related__grid strong { margin-top: 16px; font-family: Prata, Georgia, serif; font-size: 21px; font-weight: 400; line-height: 1.18; letter-spacing: -.04em; }
.article-related__grid small { margin-top: auto; padding-top: 17px; color: #655d56; font-size: 12px; line-height: 1.5; }
.article-cta { margin-top: 90px !important; margin-bottom: 0 !important; padding: clamp(35px, 5vw, 62px); background: var(--forest); color: #fffaf5; }
.article-cta .overline { color: #f5c69a; }
.article-cta h2 { max-width: 520px; color: #fffaf5; }
.article-content .article-cta p:not(.overline) { max-width: 510px; color: #e5eee8; }
.article-cta .dark-button { margin-top: 15px; background: #f5c69a; color: var(--forest); }
.article-cta .dark-button:hover { background: #fffaf5; }
@media (max-width: 800px) {
  .article-hero, .article-layout { padding-right: 20px; padding-left: 20px; }
  .article-hero { grid-template-columns: 1fr; }
  .article-hero__visual, .article-hero__visual img { min-height: 350px; }
  .article-layout { display: block; padding-bottom: 75px; }
  .article-aside { position: static; margin: 0 0 52px; }
  .article-aside ol { grid-template-columns: 1fr 1fr; column-gap: 22px; }
  .article-intro { margin-bottom: 52px; }
  .article-content section { margin-bottom: 55px; }
  .article-related { margin: 58px 0 62px !important; }
  .article-related__grid { grid-template-columns: 1fr; }
  .article-related__grid a { min-height: 0; }
  .article-note { padding: 24px; }
}
@media (max-width: 450px) { .article-aside ol { grid-template-columns: 1fr; } }

.journal-page { max-width: 1240px; margin: 0 auto; padding: clamp(64px, 9vw, 124px) 24px 120px; }
.journal-hero { max-width: 720px; margin-bottom: clamp(46px, 6vw, 80px); }
.journal-hero .overline { color: var(--red); }
.journal-hero h1 { margin: 0 0 28px; font-size: clamp(47px, 6vw, 88px); line-height: .95; letter-spacing: -.065em; }
.journal-hero h1 em { color: var(--red); }
.journal-hero > p:not(.overline):not(.journal-hero__links) { max-width: 520px; color: #5a504a; font-size: 17px; line-height: 1.8; }
.journal-hero__links { display: flex; flex-wrap: wrap; gap: 9px; margin: 28px 0 0 !important; }
.journal-hero__links a { padding: 10px 13px; border: 1px solid #d8c9bd; color: var(--forest); font: 800 10px Manrope, Arial, sans-serif; letter-spacing: .07em; text-transform: uppercase; }
.journal-hero__links a:hover { border-color: var(--red); color: var(--red); }
.journal-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.journal-card { display: flex; min-height: 520px; flex-direction: column; overflow: hidden; background: #f5eee7; }
.journal-card img { display: block; width: 100%; height: 310px; object-fit: cover; transition: transform .45s ease; }
.journal-card:hover img { transform: scale(1.03); }
.journal-card > div { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 30px; }
.journal-card p { margin: 0 0 16px; color: var(--red); font: 800 10px Manrope, Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.journal-card h2 { margin: 0; color: var(--ink); font-size: clamp(28px, 3vw, 43px); line-height: 1.05; letter-spacing: -.05em; }
.journal-card span { margin-top: auto; padding-top: 27px; color: var(--forest); font: 800 11px Manrope, Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
@media (max-width: 700px) { .journal-page { padding-right: 20px; padding-bottom: 75px; padding-left: 20px; } .journal-grid { grid-template-columns: 1fr; } .journal-card { min-height: 0; } .journal-card img { height: 270px; } }
