/* EDGE Worldwide · Feature article clean design
   Scoped to #page-article and limited to the existing palette. */

#page-article{overflow:clip;background:var(--f-parch)}
#page-article .ahdr{padding:clamp(64px,7vw,104px) 0 clamp(54px,6vw,88px)}
#page-article .ahdr .in{display:grid;grid-template-columns:minmax(0,8fr) minmax(300px,4fr);gap:20px clamp(44px,7vw,96px);align-items:end}
#page-article .aback,#page-article .ahdr .eye{grid-column:1}
#page-article .ahdr h1{grid-column:1;max-width:14ch;font-size:clamp(48px,7vw,92px);line-height:.94;letter-spacing:-.042em}
#page-article .ahdr .deck{grid-column:2;grid-row:2;align-self:end;margin:0;padding-left:clamp(24px,3vw,40px);border-left:1px solid rgba(255,255,255,.22)}
#page-article .ahdr .aplace{grid-column:2;grid-row:3;margin-top:18px}
#page-article .iw{max-width:1280px;margin:0 auto;background:var(--f-sage)}
#page-article .iw-img{height:auto!important;max-height:none;aspect-ratio:16/9}
#page-article .iw img{object-position:center}

#page-article .abody{max-width:1180px;padding-top:clamp(58px,7vw,96px);padding-bottom:clamp(70px,8vw,112px)}
#page-article .abody>p,#page-article .abody>h2,#page-article .abody>h3,#page-article .abody>ul,#page-article .abody>ol{max-width:70ch}
#page-article .abody>p{font-size:clamp(15.5px,1.05vw,17px);line-height:1.82;margin-bottom:1.42em}
#page-article .abody>p:first-of-type{max-width:58ch;font-family:var(--disp)!important;font-size:clamp(20px,1.75vw,25px)!important;line-height:1.55!important;color:var(--f-ink)!important}
#page-article .ah2{margin-top:clamp(58px,6vw,88px);margin-bottom:24px;padding-top:0;border-top:0;font-size:clamp(28px,3vw,42px)}
#page-article .ah2::before{content:"";display:block;width:42px;height:2px;margin-bottom:20px;background:var(--f-terra)}

#page-article .afig{max-width:980px;margin-top:clamp(42px,5vw,68px);margin-bottom:clamp(42px,5vw,68px)}
#page-article .afig-img{aspect-ratio:3/2}
#page-article .acap{max-width:68ch;margin-top:14px;padding-left:0;border-left:0;color:var(--f-body)}
#page-article .avid-link{aspect-ratio:16/9}
#page-article .agrid3{gap:16px;margin-top:clamp(42px,5vw,68px);margin-bottom:clamp(42px,5vw,68px)}
#page-article .agrid3 .afig-img{aspect-ratio:4/3}

#page-article .astats{max-width:980px;margin:clamp(42px,5vw,68px) auto;padding:clamp(26px,3vw,38px) 0}
#page-article .astats .sc{padding-left:clamp(12px,2vw,26px);padding-right:clamp(12px,2vw,26px)}
#page-article .astats .sc:first-child{padding-left:0}
#page-article .apull{max-width:38ch;margin-top:clamp(46px,5vw,72px);margin-bottom:clamp(46px,5vw,72px);padding:0;border-left:0;font-size:clamp(24px,2.7vw,38px);line-height:1.22;text-align:center}
#page-article .apull::before{content:"“";display:block;margin-bottom:4px;font-family:var(--disp);font-size:48px;line-height:.7;color:var(--f-terra)}
#page-article .aquote{max-width:66ch;margin-top:clamp(46px,5vw,72px);margin-bottom:clamp(46px,5vw,72px);padding:28px 0 28px clamp(24px,3vw,42px);border-left:2px solid var(--f-terra);background:transparent}
#page-article .ahuman{max-width:70ch;margin-top:clamp(46px,5vw,72px);margin-bottom:clamp(46px,5vw,72px);padding:clamp(28px,3.4vw,44px) 0;border:0;border-top:1px solid var(--f-line-d);border-bottom:1px solid var(--f-line-d)}
#page-article .aclose{max-width:56ch}
#page-article .enote{max-width:70ch}
#page-article .gov{max-width:980px;margin-top:clamp(42px,5vw,66px);padding:clamp(36px,4vw,56px);border:0!important;background:var(--f-forest);text-align:left}
#page-article .gov h2{font-family:var(--disp);font-size:clamp(26px,3vw,40px)!important;letter-spacing:-.02em;text-transform:none;color:#fff;margin-bottom:14px}
#page-article .gov p{max-width:48ch;color:rgba(255,255,255,.78)}
#page-article .gov>div{justify-content:flex-start!important}
#page-article .gov .btn{width:auto;max-width:100%;justify-content:center;text-align:center;line-height:1.25}
#page-article .gov .btn-white{background:#fff;color:var(--f-forest);border-color:#fff}
#page-article .gov .btn-white:hover{background:var(--f-sage);color:var(--f-forest);border-color:var(--f-sage)}
#page-article .gov .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
#page-article .gov .btn-ghost:hover{background:#fff;color:var(--f-forest);border-color:#fff}

@media(max-width:820px){
  #page-article .ahdr .in{grid-template-columns:1fr;gap:18px}
  #page-article .aback,#page-article .ahdr .eye,#page-article .ahdr h1,#page-article .ahdr .deck,#page-article .ahdr .aplace{grid-column:1;grid-row:auto}
  #page-article .ahdr .deck{margin-top:16px;padding:24px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.22)}
  #page-article .iw{max-width:none}
}
@media(max-width:600px){
  #page-article .ahdr h1{font-size:clamp(42px,13vw,62px)}
  #page-article .iw-img{aspect-ratio:4/3}
  #page-article .apull{text-align:left}
  #page-article .apull::before{text-align:left}
  #page-article .aquote{padding-left:22px}
  #page-article .gov{padding:30px 22px}
  #page-article .gov>div{display:grid!important;grid-template-columns:1fr}
  #page-article .gov .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  #page-article .avid-link img{transition:none}
}

/* ── Uniform article measure ──────────────────────────────────────────
   Every block in the article body shares one left edge and one right
   edge. Mixed max-widths (58ch lede, 70ch body, 980px figures, centred
   38ch pull-quotes) were making the column edges wander down the page. */
#page-article .abody{--a-measure:72ch}
#page-article .abody>*{max-width:var(--a-measure);margin-left:0;margin-right:0}
#page-article .abody>p,
#page-article .abody>p:first-of-type,
#page-article .abody>h2,#page-article .abody>h3,
#page-article .abody>ul,#page-article .abody>ol,
#page-article .abody>.afig,#page-article .abody>.agrid3,
#page-article .abody>.astats,#page-article .abody>.apull,
#page-article .abody>.aquote,#page-article .abody>.ahuman,
#page-article .abody>.enote,#page-article .abody>.adiamond{max-width:var(--a-measure);margin-left:0;margin-right:0}
#page-article .abody>.apull{text-align:left}
#page-article .abody>.apull::before{text-align:left}
#page-article .abody>.adiamond{text-align:left}
#page-article .acap{max-width:var(--a-measure)}
@media(max-width:700px){#page-article .abody{--a-measure:100%}}

/* Article imagery: one aspect per role, cover-cropped so nothing stretches. */
#page-article .afig-img{aspect-ratio:3/2;overflow:hidden;background:#e7eae1}
#page-article .afig-img img{width:100%;height:100%;object-fit:cover;display:block}
#page-article .agrid3{display:grid;grid-template-columns:repeat(3,1fr)}
#page-article .agrid3 .afig{max-width:none}
#page-article .agrid3 .afig-img{aspect-ratio:4/5}
#page-article .avid-link{display:block;position:relative;aspect-ratio:16/9;overflow:hidden}
#page-article .avid-link img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:700px){#page-article .agrid3{grid-template-columns:1fr}#page-article .agrid3 .afig-img{aspect-ratio:3/2}}

/* Centre the article column so the gutters match left and right. */
#page-article .abody{max-width:min(860px,92vw);margin-left:auto;margin-right:auto;--a-measure:100%}

/* Wider measure: less dead space either side of the read. */
#page-article .abody{max-width:min(1020px,94vw)}
#page-article .art-cta-in,#page-article .abody{--a-measure:100%}
/* The editor's note already closes the read with its own rule and spacing;
   the band's full bottom padding on top of it left a large empty gap above
   the support panel. */
#page-article .abody{padding-bottom:clamp(30px,3.4vw,48px)}

/* Scroll reveal, self-contained to the article. */
#page-article .ar{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
#page-article.article-motion-ready .ar:not(.ar-in){opacity:0;transform:translate3d(0,22px,0)}
#page-article.article-motion-ready .ar:focus-within{opacity:1;transform:none}
#page-article .ar-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){#page-article .ar,#page-article.article-motion-ready .ar:not(.ar-in){opacity:1;transform:none;transition:none}}
