/* Visual storytelling: photographic openings and editorial sequences. */
.page-hero--visual{
  min-height:660px;
  display:flex;
  align-items:center;
  padding:95px 0;
  background:#1a2437;
}
.page-hero-media{
  position:absolute;
  inset:0 0 0 26%;
  z-index:0;
  overflow:hidden;
}
.page-hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.page-hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,#1a2437 0%,rgba(26,36,55,.96) 16%,
      rgba(26,36,55,.78) 44%,rgba(26,36,55,.12) 100%),
    linear-gradient(0deg,rgba(26,36,55,.3),transparent 50%);
}
.page-hero--visual>.container{position:relative;z-index:1}
.page-hero-copy{max-width:68%}
.page-hero--visual .page-title{
  font-size:clamp(2.8rem,5.25vw,5.8rem);
  max-width:850px;
}
.page-hero--visual .lead{
  max-width:620px;
  color:#e2e1eb;
}
.page-hero--visual .eyebrow{color:#ded2ef}
.story-row{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:clamp(38px,6vw,95px);
  align-items:center;
}
.story-copy{min-width:0}
.story-copy .section-heading{margin-bottom:28px}
.story-copy h2{font-size:clamp(2rem,3.7vw,4.1rem)}
.story-copy .prose{max-width:600px}
.story-media{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  background:#e0d7eb;
  border-radius:2px;
}
.story-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.story-row--reverse .story-media{order:2}
.story-row--reverse .story-copy{order:1}
.story-media--digital{
  aspect-ratio:1;
  border-radius:48% 48% 2px 2px;
}
.visual-band{
  position:relative;
  width:100%;
  height:clamp(360px,52vw,760px);
  overflow:hidden;
  background:#1a2437;
}
.visual-band img{width:100%;height:100%;object-fit:cover}
.visual-band::after{
  content:"";
  position:absolute;
  inset:40% 0 0;
  background:linear-gradient(transparent,rgba(26,36,55,.85));
}
.visual-band figcaption{
  position:absolute;
  bottom:clamp(28px,6vw,90px);
  left:var(--gutter);
  right:var(--gutter);
  z-index:1;
  max-width:850px;
  color:white;
  font-size:clamp(2rem,4.2vw,4.6rem);
  line-height:1.08;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.article-thumb{
  width:100%;
  display:block;
  aspect-ratio:4/3;
  overflow:hidden;
  margin:0 0 25px;
  background:#e0d7eb;
}
.article-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .7s cubic-bezier(.22,1,.36,1);
}
.article-thumb:hover img{transform:scale(1.035)}
.article-grid .article-card{border-top:0;padding-top:0}
@media(max-width:1000px){
  .page-hero--visual{min-height:600px}
  .page-hero-copy{max-width:76%}
  .page-hero-media{left:12%}
  .story-row{gap:36px}
}
@media(max-width:760px){
  .page-hero--visual{
    display:flex;
    flex-direction:column;
    min-height:0;
    padding:0 0 56px;
    align-items:stretch;
  }
  .page-hero-media{
    position:relative;
    inset:auto;
    width:100%;
    height:clamp(260px,65vw,420px);
    flex:none;
  }
  .page-hero-media::after{
    background:linear-gradient(0deg,#1a2437 0%,transparent 50%);
  }
  .page-hero--visual>.container{margin-top:-20px}
  .page-hero-copy{max-width:none}
  .page-hero--visual .page-title{
    font-size:clamp(2.5rem,9vw,4.2rem);
    margin-top:15px;
  }
  .page-hero--visual .lead{font-size:1.05rem}
  .story-row{grid-template-columns:1fr;gap:35px}
  .story-row--reverse .story-media,
  .story-row--reverse .story-copy{order:initial}
  .story-media{aspect-ratio:5/4;max-height:500px}
  .story-copy h2{font-size:clamp(2.15rem,7vw,3.3rem)}
  .story-media--digital{aspect-ratio:1;max-height:480px}
  .visual-band{height:440px}
  .visual-band figcaption{font-size:clamp(2rem,7.6vw,3.1rem)}
}
@media(prefers-reduced-motion:reduce){
  .article-thumb img{transition:none}
  .article-thumb:hover img{transform:none}
}
@media print{
  .page-hero-media,.visual-band,.story-media,.article-thumb{display:none}
  .page-hero--visual{min-height:0;padding:20px 0}
  .page-hero-copy{max-width:none}
  .story-row{display:block}
}

figure.story-media,figure.visual-band{margin:0}.story-media--digital{min-width:0}.page-hero-media{z-index:0}.hero-paths{display:none}

/* A visual opening on phones, before the long editorial text. */
@media(max-width:760px){
 .hero-grid{display:flex;flex-direction:column;gap:0;padding-top:0}
 .hero-visual{order:-1;width:calc(100% + var(--gutter) * 2);margin-inline:calc(var(--gutter) * -1);height:310px;min-height:0;max-height:350px;aspect-ratio:auto;border-radius:0}
 .hero-content{padding-top:28px}
 .hero-visual::after{content:"";position:absolute;inset:50% 0 0;pointer-events:none;background:linear-gradient(transparent,#1a2437)}
 .hero-visual .visual-caption{z-index:3;bottom:20px}
}