/* Giving Back with Evie — full NGO home page */
:root{--paper:#F6F4EF;--ink:#0D0E12;--mute:rgba(13,14,18,.62);--line:rgba(13,14,18,.12);--z:#DF055F;--zl:#FF3D86;--blush:#FCE6EF;--card:#fff;
  --fd:'Anton',Impact,sans-serif;--dw:400;--tt:uppercase;--ls:.005em;--f:'Inter',system-ui,sans-serif;--g:clamp(16px,4vw,64px);--r:14px;--sec:clamp(90px,11vw,160px)}
body{background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--f)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.eyebrow{display:flex;align-items:center;gap:10px;font:600 13px/1.2 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--z)}
.eyebrow.light{color:rgba(255,255,255,.8)}
h2{font:var(--dw) clamp(44px,5.6vw,92px)/.95 var(--fd);text-transform:var(--tt);letter-spacing:var(--ls)}
h3{font:700 22px/1.2 var(--f);letter-spacing:-.02em}
.btn{display:inline-flex;align-items:center;justify-content:center;height:46px;padding:0 24px;border-radius:99px;background:var(--z);color:#fff;font:600 15px var(--f);white-space:nowrap;transition:transform .35s cubic-bezier(.3,1.5,.5,1),background .3s,color .3s,box-shadow .3s}
.btn:hover{transform:translateY(-2px)}
.btn-lg{height:56px;padding:0 30px;font-size:16px}
.btn-white{background:#fff;color:var(--ink)}
.btn-dark{background:var(--ink);color:#fff}
.btn-ghost{background:transparent;box-shadow:inset 0 0 0 1.5px currentColor;color:inherit}
.btn-ghost-dark{background:transparent;box-shadow:inset 0 0 0 1.5px var(--ink);color:var(--ink)}
.pulse{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--z);animation:pulse 2s infinite;flex:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(223,5,95,.7)}70%{box-shadow:0 0 0 12px rgba(223,5,95,0)}100%{box-shadow:0 0 0 0 rgba(223,5,95,0)}}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:clamp(36px,4.5vw,64px)}
.sec-head>div{display:grid;gap:16px}
.sec-intro{max-width:42ch;color:var(--mute)}
.sec-intro a{color:var(--z);text-decoration:underline}

/* announcement + nav */
.announce{position:relative;z-index:60;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;padding:10px var(--g);background:var(--z);color:#fff;font-size:14px;text-align:center}
.announce b{font-weight:700}
.announce u{text-underline-offset:3px;margin-left:8px;font-weight:600}
.announce .pulse{background:#fff;animation:none}
.nav{position:absolute;top:41px;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px var(--g);color:#fff;transition:background .4s,color .4s,transform .5s,top .3s}
.nav.solid{position:fixed;top:0;background:rgba(246,244,239,.92);backdrop-filter:blur(14px);color:var(--ink);box-shadow:0 1px 0 var(--line)}
.nav.hide{transform:translateY(-100%)}
.brand{display:flex;align-items:center;gap:10px;font:700 14px/1.05 var(--f)}
.brand img{width:40px;height:40px}
.brand .m2,.nav.solid .m1{display:none}
.nav.solid .m2{display:block}
.links{display:flex;gap:30px;font:500 15px var(--f)}
.links a{position:relative}
.links a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--z);transform:scaleX(0);transform-origin:right;transition:transform .4s}
.links a:hover::after{transform:scaleX(1);transform-origin:left}
.nav-cta{display:flex;gap:10px}
.nav .btn{height:42px;font-size:14px}
.burger{display:none;width:44px;height:44px;border-radius:50%;background:var(--z);place-items:center;align-content:center;gap:5px}
.burger i{display:block;width:16px;height:2px;border-radius:2px;background:#fff;transition:transform .3s}
.menu{position:fixed;inset:0;z-index:45;background:var(--ink);color:#fff;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:var(--g);font:var(--dw) clamp(40px,11vw,72px)/1.1 var(--fd);text-transform:var(--tt);letter-spacing:var(--ls);clip-path:inset(0 0 100% 0);transition:clip-path .7s cubic-bezier(.7,0,.2,1)}
.menu a:last-child{color:var(--zl)}
.menu-open .menu{clip-path:inset(0)}
.menu-open .nav{position:fixed;top:0;color:#fff;background:transparent}
.menu-open .burger i:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-open .burger i:last-child{transform:translateY(-3.5px) rotate(-45deg)}

.sec-bg{display:none}
/* 1 hero */
.hero{position:relative;height:calc(100svh - 41px);min-height:680px;overflow:hidden;background:#000;color:#fff}
.stage{position:absolute;inset:0}
.layer{position:absolute;inset:0;display:flex}
.slice{position:relative;flex:1;overflow:hidden}
.slice img{position:absolute;top:0;height:100%;width:calc(100% * var(--n));max-width:none;left:calc(-100% * var(--i));object-fit:cover}
.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.35) 55%,rgba(0,0,0,.15) 100%),linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,.5) 100%)}
.hero-copy{position:absolute;left:var(--g);bottom:clamp(90px,12vh,140px);z-index:3;max-width:min(860px,64vw);display:grid;gap:22px}
.ttl{font:var(--dw) clamp(54px,7.4vw,124px)/.92 var(--fd);text-transform:var(--tt);letter-spacing:var(--ls)}
.ttl .ln{display:block;overflow:hidden;padding-bottom:.03em}
.ttl .ln>span{display:inline-block}
.lede{font-size:clamp(17px,1.35vw,20px);max-width:52ch;color:rgba(255,255,255,.88)}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.next-card{position:absolute;right:var(--g);bottom:clamp(90px,12vh,140px);z-index:3;width:min(340px,30vw);padding:24px;border-radius:var(--r);background:rgba(13,14,18,.5);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.16);display:grid;gap:10px}
.next-card h3{font:var(--dw) 34px/1 var(--fd);text-transform:var(--tt);letter-spacing:var(--ls)}
.nc-where{color:rgba(255,255,255,.75);font-size:15px}
.mini{display:flex;gap:18px;padding:12px 0;border-top:1px solid rgba(255,255,255,.15);border-bottom:1px solid rgba(255,255,255,.15)}
.mini span{display:grid;font-size:12px;color:rgba(255,255,255,.7)}
.mini b{font:var(--dw) 36px/1 var(--fd);color:#fff;font-variant-numeric:tabular-nums}
.nc-link{font-weight:600;color:var(--zl)}
.hero-foot{position:absolute;left:var(--g);right:var(--g);bottom:28px;z-index:3;display:flex;justify-content:space-between;align-items:center}
.counter{display:flex;align-items:center;gap:12px;font:var(--dw) 18px var(--fd)}
.counter .total{opacity:.5}
.counter .bar{width:90px;height:2px;background:rgba(255,255,255,.25);position:relative;overflow:hidden}
.counter .bar i{position:absolute;inset:0;background:var(--z);transform-origin:left;transform:scaleX(0)}
.scroll-cue{font:600 12px var(--f);letter-spacing:.16em;text-transform:uppercase;opacity:.7}

/* 2 impact */
.impact{background:var(--z);color:#fff;padding:clamp(50px,6vw,80px) var(--g)}
.impact .eyebrow{color:rgba(255,255,255,.85);margin-bottom:26px}
.stats{display:grid;grid-template-columns:repeat(4,1fr)}
.stats div{display:grid;gap:6px;padding:0 clamp(12px,2vw,30px);border-left:1px solid rgba(255,255,255,.3)}
.stats div:first-child{padding-left:0;border-left:0}
.stats b{font:var(--dw) clamp(52px,6.4vw,104px)/.95 var(--fd);font-variant-numeric:tabular-nums}
.stats span{font-weight:500;opacity:.9}

/* 3 about: a four-chapter story; the photo stays pinned and changes with each chapter */
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,110px);padding:var(--sec) var(--g)}
.ab-stick{position:sticky;top:max(40px,8vh);height:min(84vh,820px);display:flex;flex-direction:column;gap:14px;align-self:start}
.ab-pics{position:relative;flex:1;margin:0;overflow:hidden}
.ab-pics img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;clip-path:inset(100% 0 0 0)}
.ab-pics img:first-child{clip-path:inset(0)}
.ab-cap{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--mute)}
.ab-n{font:var(--dw) 18px var(--fd);color:var(--ink)}
.ab-bar{position:relative;width:110px;height:2px;background:var(--line);overflow:hidden}
.ab-bar i{position:absolute;inset:0;background:var(--z);transform-origin:left;transform:scaleX(.25);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.ab-steps{display:grid}
.ab-step{min-height:78vh;display:flex;flex-direction:column;justify-content:center;gap:22px;border-top:1px solid var(--line);opacity:.28;transition:opacity .5s}
.ab-step:first-child{border-top:0}
.ab-step.on{opacity:1}
.ab-step>p:not(.eyebrow):not(.ab-big){color:var(--mute);max-width:52ch;font-size:18px}
.ab-big{font:var(--dw) clamp(30px,3.2vw,54px)/1.06 var(--fd);letter-spacing:var(--ls);max-width:22ch}
.ab-step .btn{align-self:flex-start;margin-top:6px}
.ab-m{display:none}

/* 4 need */
.need{position:relative;color:#fff;padding:var(--sec) var(--g);overflow:hidden;background:var(--ink)}
.need-bg{position:absolute;inset:-10% 0}
.need-bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.28)}
.need-in{position:relative;display:grid;gap:22px;max-width:1100px}
.need-num{font:var(--dw) clamp(90px,15vw,260px)/.85 var(--fd);text-transform:var(--tt);letter-spacing:var(--ls);color:var(--zl)}
.need-big{font:600 clamp(26px,3.2vw,50px)/1.15 var(--f);letter-spacing:-.025em;max-width:26ch}
.need-row{display:flex;justify-content:space-between;align-items:end;gap:30px;padding-top:24px;border-top:1px solid rgba(255,255,255,.2)}
.need-row p{max-width:60ch;color:rgba(255,255,255,.8)}
.need-row .src-note{font-size:13px;opacity:.6;white-space:nowrap}

/* 5 programmes */
.programmes{padding:var(--sec) var(--g)}
.prog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,26px)}
.prog{position:relative;display:grid;align-content:start;gap:10px;padding:14px 14px 24px;border-radius:var(--r);background:var(--card);transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.prog:hover{transform:translateY(-6px);box-shadow:0 24px 50px -24px rgba(13,14,18,.25)}
.prog figure{margin:0 0 8px;aspect-ratio:16/10;border-radius:calc(var(--r) - 4px);overflow:hidden}
.prog figure img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.prog:hover figure img{transform:scale(1.07)}
.pn{position:absolute;top:24px;left:24px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--z);color:#fff;font:var(--dw) 16px var(--fd)}
.prog h3,.prog p,.prog a{padding:0 10px}
.prog p{color:var(--mute);font-size:15.5px}
.prog a{font-weight:600;color:var(--z);margin-top:4px}

/* 6 campaign */
.campaign{display:grid;grid-template-columns:1fr 1fr;background:var(--blush)}
.camp-pic{position:relative;margin:0;min-height:560px;overflow:hidden}
.camp-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.camp-tag{position:absolute;left:24px;top:24px;padding:8px 16px;border-radius:99px;background:var(--z);color:#fff;font-weight:600;font-size:14px}
.camp-copy{display:grid;gap:20px;align-content:center;padding:clamp(40px,6vw,100px) var(--g)}
.camp-facts{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.camp-facts li{display:grid;gap:2px}
.camp-facts span{font-size:13px;color:var(--mute);text-transform:uppercase;letter-spacing:.1em}
.camp-facts b{font-weight:600}
.goal{display:grid;gap:10px}
.goal-top{display:flex;justify-content:space-between;font-size:15px}
.goal-top span:last-child{font-weight:700;color:var(--z)}
.goal-bar{height:12px;border-radius:99px;background:rgba(13,14,18,.08);overflow:hidden}
.goal-bar i{display:block;height:100%;width:calc(var(--p) * 100%);border-radius:99px;background:var(--z);transform-origin:left}
.camp-cd{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.camp-cd div{display:grid;justify-items:center;padding:14px 6px;border-radius:12px;background:#fff}
.camp-cd b{font:var(--dw) clamp(32px,3.4vw,52px)/1 var(--fd);color:var(--z);font-variant-numeric:tabular-nums}
.camp-cd span{font-size:12px;color:var(--mute);text-transform:uppercase;letter-spacing:.1em}
.camp-btns{display:flex;gap:12px;flex-wrap:wrap}

/* 7 how */
.how{padding:var(--sec) var(--g)}
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.4vw,40px);padding-top:30px}
.steps::before{content:"";position:absolute;top:30px;left:0;right:0;height:2px;background:var(--line)}
.steps::after{content:"";position:absolute;top:30px;left:0;right:0;height:2px;background:var(--z);transform-origin:left;transform:scaleX(var(--drawn,0))}
.steps li{position:relative;display:grid;gap:12px;padding-top:34px}
.sn{position:absolute;top:-22px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--paper);border:2px solid var(--z);color:var(--z);font:var(--dw) 17px var(--fd);z-index:1}
.steps h3{font:var(--dw) clamp(30px,2.6vw,42px)/1 var(--fd);text-transform:var(--tt);letter-spacing:var(--ls)}
.steps p{color:var(--mute)}

/* 8 help */
.help{background:var(--ink);color:#fff;padding:var(--sec) var(--g)}
.help .sec-intro{color:rgba(255,255,255,.7)}
.help-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.hcard{display:flex;flex-direction:column;gap:14px;min-height:340px;padding:28px;border-radius:var(--r);background:#1A1B21;transition:transform .5s cubic-bezier(.2,.7,.2,1),background .4s}
.hcard:hover{transform:translateY(-8px);background:#24252c}
.hc-pink,.hc-pink:hover{background:var(--z)}
.hn{font:var(--dw) 18px var(--fd);opacity:.6}
.hcard h3{font:var(--dw) clamp(30px,2.6vw,40px)/1 var(--fd);text-transform:var(--tt);letter-spacing:var(--ls);margin-top:auto}
.hcard p{color:rgba(255,255,255,.75);font-size:15.5px}
.go{font-weight:600}
.hcard:not(.hc-pink) .go{color:var(--zl)}

/* 9 voices */
.voices{display:grid;grid-template-columns:1fr 1.6fr;gap:var(--g);align-items:center;padding:var(--sec) var(--g)}
.v-left{display:grid;gap:16px;align-content:start}
.v-dots{display:flex;gap:8px;margin-top:14px}
.v-dots button{width:34px;height:4px;border-radius:2px;background:var(--line);transition:background .3s,width .3s}
.v-dots button.on{background:var(--z);width:56px}
.v-stage{position:relative;min-height:300px}
.vq{position:absolute;inset:0;display:grid;align-content:center;gap:24px;opacity:0;pointer-events:none}
.vq.on{pointer-events:auto}
.vq blockquote{font:italic 500 clamp(26px,2.8vw,44px)/1.25 var(--f);letter-spacing:-.02em}
.vq figcaption{display:grid;color:var(--mute)}
.vq figcaption b{color:var(--ink);font-size:18px}

/* 10 field strip */
.field{padding:0 0 var(--sec);overflow:hidden}
.field .sec-head{padding:0 var(--g)}
.strip{display:flex;align-items:center;gap:14px;width:max-content;padding:0 var(--g)}
.strip figure{margin:0;width:clamp(240px,26vw,420px);aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;flex:none}
.strip figure.tall{width:clamp(200px,20vw,320px);aspect-ratio:4/5}
.strip img{width:100%;height:100%;object-fit:cover}

/* 11 stories */
.stories{padding:0 var(--g) var(--sec)}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,26px)}
.post{display:grid;gap:10px;align-content:start;padding:14px 14px 22px;border-radius:var(--r);background:var(--card);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.post:hover{transform:translateY(-6px)}
.post .reveal-img{aspect-ratio:16/10;border-radius:calc(var(--r) - 4px);overflow:hidden;margin-bottom:6px}
.post .reveal-img img{width:100%;height:100%;object-fit:cover}
.post .eyebrow,.post h3,.post .note{padding:0 8px}
.post h3{font-size:21px}
.post .note{color:var(--mute);font-size:14px}

/* 12 partners */
.partners{display:grid;grid-template-columns:1.1fr 1.6fr auto;gap:var(--g);align-items:center;padding:clamp(50px,6vw,80px) var(--g);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.partners>div{display:grid;gap:12px}
.partners h3{font-weight:600;font-size:19px;max-width:40ch}
.p-logos{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.p-logos span{display:grid;place-items:center;height:70px;border-radius:10px;border:1.5px dashed rgba(13,14,18,.2);color:rgba(13,14,18,.4);font-size:12px;font-weight:600}

/* 13 faq */
.faq{padding:var(--sec) var(--g)}
.qa{display:grid;border-top:1px solid var(--line)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0;cursor:pointer;list-style:none;font:600 clamp(18px,1.6vw,23px)/1.3 var(--f);letter-spacing:-.015em}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--card);color:var(--z);font-size:24px;font-weight:400;transition:transform .4s,background .3s,color .3s}
.qa details[open] summary::after{transform:rotate(45deg);background:var(--z);color:#fff}
.qa details p{padding:0 60px 26px 0;color:var(--mute);max-width:70ch}

/* 14 closing */
.closing{padding:0 var(--g) var(--sec)}
.cl-in{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--g);align-items:end;padding:clamp(40px,6vw,90px);border-radius:calc(var(--r) * 2);background:var(--z);color:#fff;overflow:hidden}
.cl-in h2{font-size:clamp(48px,6vw,104px)}
.cl-in h2 .ln{display:block;overflow:hidden}
.cl-in h2 .ln>span{display:inline-block}
.cl-right{display:grid;gap:18px}
.cl-right p{opacity:.9}
.sub{display:flex;gap:8px;padding:6px;border-radius:99px;background:rgba(255,255,255,.18)}
.sub input{flex:1;min-width:0;border:0;background:transparent;color:#fff;font:500 16px var(--f);padding:0 18px;outline:0}
.sub input::placeholder{color:rgba(255,255,255,.75)}

/* footer */
.foot{background:var(--ink);color:#fff;padding:clamp(60px,8vw,100px) var(--g) 24px;overflow:hidden}
.foot-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--g)}
.fb img{width:54px}
.fb p{max-width:40ch;color:rgba(255,255,255,.65);margin:16px 0}
.social{display:flex;gap:16px;font-weight:600}
.social a:hover,.foot ul a:hover{color:var(--zl)}
.foot ul{display:grid;gap:10px;align-content:start;color:rgba(255,255,255,.8)}
.fh{font:600 12px var(--f);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:6px}
.foot-name{margin:clamp(50px,7vw,100px) 0 14px;overflow:hidden}
.foot-name [data-fit]{font:var(--dw) 100px/.9 var(--fd);text-transform:var(--tt);letter-spacing:var(--ls);color:var(--z);padding-bottom:.04em}
.foot-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:16px;border-top:1px solid rgba(255,255,255,.15);font-size:13px;color:rgba(255,255,255,.5)}

@media (max-width:1100px){
  .help-grid{grid-template-columns:1fr 1fr}
  .partners{grid-template-columns:1fr}
}
@media (max-width:900px){
  .links,.nav-cta{display:none}
  .burger{display:grid}
  .announce{font-size:12.5px;justify-content:flex-start;text-align:left}
  .nav{top:auto;position:absolute}
  .hero{height:auto;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding:120px var(--g) 80px;gap:26px}
  .hero-copy,.next-card{position:relative;left:auto;right:auto;bottom:auto;max-width:none;width:auto}
  .hero-foot .scroll-cue{display:none}
  .stats{grid-template-columns:1fr 1fr;gap:26px 0}
  .stats div:nth-child(3){padding-left:0;border-left:0}
  .about,.campaign,.voices,.cl-in,.foot-top{grid-template-columns:1fr}
  .ab-stick{display:none}
  .ab-step{min-height:0;opacity:1;padding:34px 0}
  .ab-m{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
  .need-row{flex-direction:column;align-items:flex-start}
  .sec-head{flex-direction:column;align-items:flex-start}
  .prog-grid,.posts{grid-template-columns:1fr}
  .camp-pic{min-height:320px}
  .camp-cd{grid-template-columns:repeat(4,1fr);gap:6px}
  .steps{grid-template-columns:1fr;gap:34px;padding-top:0;padding-left:30px}
  .steps::before,.steps::after{top:0;bottom:0;left:0;right:auto;width:2px;height:auto;transform-origin:top;transform:scaleY(var(--drawn,0))}
  .steps::before{transform:none}
  .steps li{padding-top:0}
  .sn{top:0;left:-52px}
  .help-grid{grid-template-columns:1fr}
  .hcard{min-height:0}
  .hcard h3{margin-top:10px}
  .v-stage{min-height:340px}
  .p-logos{grid-template-columns:repeat(3,1fr)}
  .qa details p{padding-right:0}
}

/* when there is no outreach coming up (set by live.js once the date has passed, or ?outreach=none to preview) */
.no-next [data-when-next]{display:none!important}
html:not(.no-next) [data-when-none]{display:none!important}
.dot-off{display:inline-block;width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35)}
.between{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--g);align-items:stretch;padding:var(--sec) var(--g)}
.bt-copy{display:grid;gap:22px;align-content:start}
.bt-lede{color:var(--mute);max-width:56ch}
.bt-lede b{color:var(--ink)}
.bt-ways{display:grid;border-top:2px solid var(--ink);margin-top:8px}
.bt-ways a{display:grid;grid-template-columns:40px 1fr auto;align-items:baseline;gap:14px;padding:18px 0;border-bottom:1px solid var(--line);transition:padding .4s cubic-bezier(.2,.7,.2,1)}
.bt-ways a:hover{padding-left:12px}
.bt-ways span{font:700 12px var(--f);color:var(--z)}
.bt-ways b{font:var(--dw) clamp(22px,2vw,30px)/1.1 var(--fd);letter-spacing:var(--ls);text-transform:var(--tt)}
.bt-ways em{font-style:normal;color:var(--mute);font-size:14px;text-align:right}
.bt-pic{position:relative;margin:0;min-height:420px;overflow:hidden}
.bt-pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bt-pic figcaption{position:absolute;left:16px;bottom:16px;padding:8px 14px;background:var(--ink);color:#fff;font-size:13px;font-weight:600}
@media (max-width:900px){.between{grid-template-columns:1fr}.bt-ways em{display:none}.bt-pic{min-height:300px}}
/* no outreach coming up: the top bar is gone, so the opening takes the full screen height */
.no-next .hero,.no-next .dx .hero{height:100svh}
.no-next .nav{top:0}
/* the Clash Display logo (mark + name) in the top bar, side menu and footer */
.brand img{width:auto;height:44px}
.fb .fb-logo{width:auto;height:64px}