.article-shell{
  max-width:1240px;
  margin-inline:auto;
  padding:38px 28px 0;
}
.article{max-width:100%}
.breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  font-size:.76rem;
  color:var(--muted);
  margin-bottom:28px;
}
.breadcrumbs a:hover{color:var(--energy)}

.article-header{
  max-width:960px;
  margin:0 auto 30px;
}
.article-category{
  display:inline-block;
  color:var(--orange);
  text-transform:uppercase;
  font-weight:800;
  font-size:.74rem;
  margin-bottom:12px;
}
.article-header h1{
  margin:0;
  color:var(--navy);
  font-size:clamp(2.45rem,5vw,4.5rem);
  line-height:.99;
  letter-spacing:-.045em;
  max-width:940px;
}
.article-standfirst{
  font-size:1.23rem;
  line-height:1.48;
  color:#44515A;
  max-width:860px;
  margin:22px 0 24px;
}
.article-byline{
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:13px 0;
  font-size:.78rem;
  color:var(--muted);
}
.article-byline>div:first-child{
  display:flex;
  flex-wrap:wrap;
  gap:8px 20px;
}
.article-byline a{font-weight:700;color:var(--navy)}
.article-actions{display:flex;gap:8px}
.article-actions button{
  border:1px solid var(--line);
  background:#fff;
  color:var(--navy);
  padding:7px 11px;
  font-size:.72rem;
  font-weight:700;
  cursor:pointer;
}
.article-actions button:hover{border-color:var(--energy);color:var(--energy)}

.article-hero{
  max-width:1120px;
  margin:0 auto 32px;
}
.article-hero img{
  width:100%;
  aspect-ratio:16/8.7;
  object-fit:cover;
}
.article-hero figcaption{
  color:var(--muted);
  font-size:.7rem;
  padding-top:6px;
}

.article-brief{
  max-width:860px;
  margin:0 auto 34px;
  background:var(--light);
  border-left:4px solid var(--orange);
  padding:20px 24px;
}
.article-brief h2{
  margin:0 0 10px;
  text-transform:uppercase;
  color:var(--navy);
  font-size:.92rem;
}
.article-brief ul{
  margin:0;
  padding-left:20px;
}
.article-brief li{
  margin:7px 0;
  font-size:.95rem;
}

.article-layout{
  max-width:1080px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,720px) 280px;
  gap:56px;
  align-items:start;
}
.article-body{
  min-width:0;
  font-size:1.07rem;
  line-height:1.76;
}
.article-body .lead{
  font-size:1.18rem;
  line-height:1.62;
  color:#303A40;
}
.article-body p{margin:0 0 22px}
.article-body h2{
  margin:42px 0 15px;
  color:var(--navy);
  font-size:1.72rem;
  line-height:1.18;
  letter-spacing:-.02em;
}
.article-body blockquote{
  margin:34px 0;
  padding:6px 0 6px 24px;
  border-left:4px solid var(--energy);
  color:var(--navy);
  font-size:1.38rem;
  line-height:1.42;
  font-weight:600;
}
.article-source-note{
  margin-top:36px;
  padding:18px 20px;
  background:var(--light);
  color:#56636C;
  font-size:.82rem;
  line-height:1.55;
}
.article-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:28px;
}
.article-tags a{
  border:1px solid var(--line);
  padding:7px 10px;
  font-size:.72rem;
  color:var(--navy);
  font-weight:700;
}
.article-tags a:hover{border-color:var(--energy);color:var(--energy)}

.article-aside{
  position:sticky;
  top:24px;
}
.aside-module{
  border-top:3px solid var(--navy);
  padding-top:12px;
  margin-bottom:30px;
}
.aside-module h2{
  margin:0 0 14px;
  color:var(--navy);
  text-transform:uppercase;
  font-size:.95rem;
}
.aside-module article{
  display:grid;
  grid-template-columns:92px 1fr;
  gap:10px;
  padding:10px 0;
  border-bottom:1px solid var(--line);
}
.aside-module article img{
  width:92px;
  height:62px;
  object-fit:cover;
}
.aside-module article a{
  font-size:.78rem;
  line-height:1.3;
  font-weight:700;
}
.aside-module article a:hover{color:var(--energy)}
.aside-module--popular ol{
  list-style:none;
  margin:0;
  padding:0;
  counter-reset:asidepop;
}
.aside-module--popular li{
  counter-increment:asidepop;
  display:grid;
  grid-template-columns:28px 1fr;
  gap:8px;
  padding:9px 0;
  border-bottom:1px solid var(--line);
}
.aside-module--popular li:before{
  content:counter(asidepop);
  color:var(--orange);
  font-weight:800;
}
.aside-module--popular a{
  font-size:.78rem;
  line-height:1.3;
  font-weight:700;
}

.related-section{
  max-width:1080px;
  margin:60px auto 0;
  padding-top:20px;
  border-top:1px solid var(--line);
}
.related-heading h2{
  margin:0 0 18px;
  color:var(--navy);
  text-transform:uppercase;
  font-size:1.1rem;
}
.related-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.related-grid img{
  width:100%;
  aspect-ratio:16/8.5;
  object-fit:cover;
  margin-bottom:10px;
}
.related-grid span{
  color:var(--orange);
  text-transform:uppercase;
  font-size:.66rem;
  font-weight:800;
}
.related-grid h3{
  margin:6px 0 0;
  font-size:1rem;
  line-height:1.28;
  color:var(--navy);
}

.article-newsletter{
  max-width:1080px;
  margin:50px auto 0;
  padding:30px;
  background:var(--navy);
  color:#fff;
  display:grid;
  grid-template-columns:1.4fr .8fr;
  gap:30px;
  align-items:center;
}
.article-newsletter h2{
  margin:10px 0 8px;
  font-size:1.45rem;
  line-height:1.18;
}
.article-newsletter p{
  margin:0;
  color:#d9e3e8;
}
.article-newsletter form{
  display:grid;
  grid-template-columns:1fr auto;
}
.article-newsletter input{
  min-width:0;
  border:0;
  height:44px;
  padding:0 12px;
}
.article-newsletter button{
  border:0;
  background:var(--orange);
  color:#fff;
  padding:0 18px;
  font-weight:800;
  text-transform:uppercase;
  font-size:.72rem;
}

@media (max-width:1050px){
  .article-layout{
    grid-template-columns:minmax(0,1fr) 250px;
    gap:36px;
  }
}
@media (max-width:820px){
  .article-shell{padding-inline:20px}
  .article-header h1{font-size:clamp(2.25rem,8vw,3.6rem)}
  .article-layout{grid-template-columns:1fr}
  .article-aside{position:static}
  .aside-module article{grid-template-columns:120px 1fr}
  .aside-module article img{width:120px;height:78px}
  .related-grid{grid-template-columns:1fr 1fr}
  .article-newsletter{grid-template-columns:1fr}
}
@media (max-width:560px){
  .article-shell{padding:26px 15px 0}
  .breadcrumbs{margin-bottom:22px}
  .article-header{margin-bottom:22px}
  .article-header h1{font-size:2.25rem}
  .article-standfirst{font-size:1.05rem}
  .article-byline{flex-direction:column}
  .article-actions{width:100%}
  .article-actions button{flex:1}
  .article-hero{margin-bottom:22px}
  .article-hero img{aspect-ratio:4/3}
  .article-brief{padding:18px 18px}
  .article-body{font-size:1rem;line-height:1.7}
  .article-body .lead{font-size:1.08rem}
  .article-body h2{font-size:1.5rem;margin-top:34px}
  .article-body blockquote{font-size:1.18rem}
  .related-grid{grid-template-columns:1fr}
  .article-newsletter{padding:22px 18px}
  .article-newsletter form{grid-template-columns:1fr}
  .article-newsletter button{height:42px}
}

.article-featured-photo{margin:22px 0 26px}.article-featured-photo img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid var(--line)}.article-featured-photo figcaption{margin-top:7px;color:var(--muted);font-size:.68rem;line-height:1.4}.article-featured-photo figcaption a{color:var(--energy);font-weight:600}