/* ==========================================================================
   United Sikhs Newsroom — design tokens
   Colours taken from the United Sikhs logo: blue #0B79BF, teal #1EB8D0, saffron #FBAF44.
   ========================================================================== */
:root{
  --ink:#0F2238; --neela:#0B79BF; --neela-d:#085E95; --teal:#1EB8D0; --kesri:#FBAF44; --kesri-t:#A85F00;
  --paper:#FBFCFE; --mist:#EEF5FB; --line:#D8E4EF; --muted:#52657A; --night:#0A2B47;
  --serif:"Newsreader", Georgia, "Times New Roman", serif;
  --sans:"Hanken Grotesk", "Segoe UI", system-ui, -apple-system, sans-serif;
  --r-lg:18px; --r-md:12px; --r-sm:6px;
  --wrap:1240px; --gut:clamp(18px,4vw,40px);
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
html{scroll-behavior:smooth; scroll-padding-top:90px}
*,*::before,*::after{box-sizing:inherit}
body{margin:0; background:var(--paper); color:var(--ink); font:400 17px/1.6 var(--sans); -webkit-font-smoothing:antialiased}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
h1,h2,h3{font-family:var(--serif); font-weight:500; line-height:1.15; margin:0; letter-spacing:-.01em}
p{margin:0}
:focus-visible{outline:3px solid var(--kesri); outline-offset:3px; border-radius:4px}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 var(--gut)}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
.skip{position:absolute; left:-999px; top:8px; background:var(--ink); color:#fff; padding:8px 14px; z-index:100; border-radius:6px}
.skip:focus{left:8px}
.center{text-align:center; margin-top:40px}

/* Buttons ----------------------------------------------------------------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; font:600 15px/1 var(--sans); padding:14px 22px; border-radius:999px; border:1.5px solid transparent; cursor:pointer; transition:background .2s, color .2s, border-color .2s}
.btn--ink{background:var(--neela); color:#fff}
.btn--ink:hover{background:var(--neela-d)}
.btn--kesri{background:var(--kesri); color:var(--ink)}
.btn--kesri:hover{background:#FFC066}
.btn--line{border-color:var(--ink); color:var(--ink)}
.btn--line:hover{background:var(--ink); color:#fff}
.btn--light{border-color:rgba(255,255,255,.5); color:#fff}
.btn--light:hover{background:#fff; color:var(--night)}
.btn--block{width:100%}
.icon-btn{display:inline-grid; place-items:center; width:42px; height:42px; border-radius:50%; border:0; background:transparent; color:inherit; cursor:pointer}
.icon-btn:hover{background:var(--mist)}

/* Meta / categories ------------------------------------------------------- */
.meta{display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; font-size:13.5px; color:var(--muted)}
.cat{font-weight:600; color:var(--kesri-t)}
.cat--press{color:var(--neela)}
.more{display:inline-block; font-weight:600; font-size:15px; color:var(--neela); border-bottom:1.5px solid currentColor; padding-bottom:1px}
.more:hover{color:var(--kesri-t)}
.more--light{color:#FBAF44}


/* 1. Trending strip ------------------------------------------------------- */
.trend{background:var(--night); color:#DCE9F5; font-size:14px}
.trend__in{display:flex; align-items:center; gap:18px; height:40px}
.trend__tag{flex:none; background:var(--kesri); color:var(--ink); font-weight:700; font-size:12.5px; padding:4px 10px; border-radius:var(--r-sm)}
.trend__list{display:flex; gap:28px; margin:0; padding:0; list-style:none; overflow-x:auto; white-space:nowrap; scrollbar-width:none; scroll-snap-type:x mandatory}
.trend__list::-webkit-scrollbar{display:none}
.trend__list li{scroll-snap-align:start; position:relative}
.trend__list li+li::before{content:""; position:absolute; left:-16px; top:50%; width:5px; height:5px; background:var(--kesri); transform:translateY(-50%) rotate(45deg)}
.trend__list a:hover{color:#fff; text-decoration:underline}

/* Header ------------------------------------------------------------------ */
.site-head{position:sticky; top:0; z-index:40; background:rgba(251,252,254,.94); backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.site-head__in{display:flex; align-items:center; gap:24px; height:84px}
.brand{display:flex; align-items:center; gap:12px}
.brand__logo{height:60px; width:auto}
.nav{display:flex; gap:4px; margin-left:auto}
.nav a{font-weight:500; font-size:15.5px; padding:8px 12px; border-radius:999px; color:#24394F}
.nav a:hover{background:var(--mist)}
.nav a[aria-current="page"]{color:var(--neela); box-shadow:inset 0 -2px 0 var(--kesri); border-radius:0}
.head-actions{display:flex; align-items:center; gap:6px}
.head-cta{padding:11px 18px; font-size:14.5px}
.burger{display:none; flex-direction:column; gap:5px}
.burger span{display:block; width:20px; height:2px; background:currentColor; border-radius:2px}

/* Drawer + search overlays */
.drawer,.search,.vmodal{position:fixed; inset:0; z-index:60; visibility:hidden; opacity:0; transition:opacity .25s, visibility .25s}
.drawer.is-open,.search.is-open,.vmodal.is-open{visibility:visible; opacity:1}
.drawer{background:rgba(10,43,71,.5)}
.drawer__panel{position:absolute; right:0; top:0; height:100%; width:min(380px,88vw); background:var(--paper); padding:calc(18px + env(safe-area-inset-top,0px)) 24px 28px; display:flex; flex-direction:column; gap:20px; transform:translateX(100%); transition:transform .3s ease}
.drawer.is-open .drawer__panel{transform:none}
.drawer__top{display:flex; justify-content:space-between; align-items:center}
.drawer__top .brand__logo{height:44px}
.drawer__nav{display:flex; flex-direction:column; border-top:1px solid var(--line)}
.drawer__nav a{font:500 24px/1.2 var(--serif); padding:14px 0; border-bottom:1px solid var(--line)}
.drawer__search{background:var(--mist); border:0; border-radius:var(--r-md); padding:14px 16px; text-align:left; font:500 15px var(--sans); color:var(--muted); cursor:pointer}
.search{background:rgba(10,43,71,.6); display:grid; align-items:start; justify-items:center; padding:12vh 18px 0}
.search__panel{width:min(720px,100%); background:var(--paper); border-radius:var(--r-lg); padding:22px; transform:translateY(-12px); transition:transform .3s}
.search.is-open .search__panel{transform:none}
.search__form{display:flex; gap:10px; align-items:center; border-bottom:2px solid var(--ink); padding-bottom:10px}
.search__form input{flex:1; border:0; background:none; font:400 24px var(--serif); color:var(--ink); outline:none; min-width:0}
.search__hint{margin:18px 0 8px; font-size:13.5px; color:var(--muted); font-weight:600}
.search__list{list-style:none; margin:0; padding:0}
.search__list a{display:block; padding:10px 0; border-bottom:1px solid var(--line)}
.search__list a:hover{color:var(--neela)}

/* Sections ---------------------------------------------------------------- */
.sec{padding:clamp(64px,8vw,104px) 0}
.sec--mist{background:var(--mist)}
.sec__head{margin-bottom:36px}
.sec__head--split{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:20px}
.sec__title{font-size:clamp(30px,3.6vw,44px)}
.sec__sub{color:var(--muted); margin-top:8px}

/* 2. Hero ----------------------------------------------------------------- */
.hero{padding-top:clamp(36px,5vw,64px)}
.hero__grid{display:grid; grid-template-columns:5fr 7fr; gap:clamp(28px,5vw,64px); align-items:center; padding-bottom:clamp(40px,5vw,64px)}
.kicker{font-weight:600; color:var(--kesri-t); margin-bottom:18px; display:flex; align-items:center; gap:10px}
.kicker::before{content:""; width:10px; height:10px; background:var(--kesri); transform:rotate(45deg)}
.hero h1{font-size:clamp(40px,5.6vw,72px); font-weight:500; line-height:1.02; letter-spacing:-.025em; max-width:12ch}
.hero__lede{font-size:clamp(17px,1.5vw,19px); color:#34485E; margin-top:22px; max-width:46ch}
.hero__ctas{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px}
.hero__card{position:relative; display:block; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:7/5; background:var(--night)}
.hero__img{margin:0; position:absolute; inset:0}
.hero__img img{width:100%; height:100%; object-fit:cover; transition:transform .8s ease}
.hero__card:hover .hero__img img{transform:scale(1.03)}
.hero__cap{position:absolute; left:0; right:0; bottom:0; padding:clamp(20px,3vw,36px); background:linear-gradient(0deg,rgba(10,43,71,.92) 0,rgba(10,43,71,.6) 60%,transparent); color:#fff}
.hero__cap .meta{color:#C9DCEC}
.hero__cap .cat{color:#FBAF44}
.hero__cap h2{font-size:clamp(22px,2.4vw,32px); margin-top:10px; max-width:24ch}
/* single orchestrated load moment */
@media (prefers-reduced-motion:no-preference){
  .hero__text>*{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
  .hero__text>*:nth-child(2){animation-delay:.08s}
  .hero__text>*:nth-child(3){animation-delay:.16s}
  .hero__text>*:nth-child(4){animation-delay:.24s}
  .hero__card{animation:reveal 1s .15s cubic-bezier(.2,.7,.2,1) both}
}
@keyframes rise{from{opacity:0; transform:translateY(18px)}}
@keyframes reveal{from{opacity:0; clip-path:inset(0 0 0 30% round 18px)}}

/* 2b. Logo slider --------------------------------------------------------- */
.logos{padding:clamp(28px,4vw,44px) 0; background:var(--mist)}
.logos__head{display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin-bottom:22px}
.logos__title{font:600 16px/1.3 var(--sans); color:var(--muted); letter-spacing:0}
.logos__viewport{overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.logos__track{display:flex; gap:16px; width:max-content; margin:0; padding:4px 0; list-style:none; animation:marquee 90s linear infinite}
.logos__viewport:hover .logos__track,.logos__viewport:focus-within .logos__track{animation-play-state:paused}
.logo-tile{display:grid; place-items:center; width:172px; height:84px; padding:12px 18px; background:#fff; border-radius:var(--r-md)}
.logo-tile img{max-width:100%; max-height:56px; width:auto; height:auto; object-fit:contain; filter:grayscale(1); opacity:.72; transition:filter .25s, opacity .25s}
.logo-tile:hover img,.logo-tile:focus-visible img{filter:none; opacity:1}
.logo-tile__name{font:600 15px/1.2 var(--serif); color:var(--ink); text-align:center}
@keyframes marquee{to{transform:translateX(calc(-50% - 8px))}}
@media (max-width:640px){.logo-tile{width:136px; height:70px}.logos__head .more{display:none}}
@media (prefers-reduced-motion:reduce){
  .logos__viewport{overflow-x:auto; -webkit-mask-image:none; mask-image:none}
  .logos__track li[aria-hidden]{display:none}
}

/* 3. Featured ------------------------------------------------------------- */
.feat{display:grid; grid-template-columns:7fr 5fr; gap:clamp(28px,4vw,56px)}
.feat__img{display:block; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:16/10; margin-bottom:22px}
.feat__img img{width:100%; height:100%; object-fit:cover}
.feat__lead h3{font-size:clamp(26px,2.8vw,38px); margin:10px 0 14px; max-width:26ch}
.feat__lead h3 a:hover,.mini h3 a:hover,.card h3 a:hover{color:var(--neela)}
.feat__ex{color:#34485E; max-width:60ch; margin-bottom:18px}
.feat__side{display:flex; flex-direction:column}
.mini{display:grid; grid-template-columns:132px 1fr; gap:18px; padding:22px 0; border-top:1px solid var(--line)}
.mini:first-child{border-top:0; padding-top:0}
.mini__img{border-radius:var(--r-md); overflow:hidden; aspect-ratio:1}
.mini__img img{width:100%; height:100%; object-fit:cover}
.mini h3{font-size:20px; margin-top:6px; line-height:1.25}

/* 4. Updates grid --------------------------------------------------------- */
.tabs{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding:4px; background:#fff; border-radius:999px; border:1px solid var(--line); max-width:100%}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none; border:0; background:none; font:600 14px var(--sans); color:var(--muted); padding:10px 16px; border-radius:999px; cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--neela); color:#fff}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:28px}
.card{background:#fff; border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; border:1px solid var(--line)}
.card[hidden]{display:none}
.card__img{position:relative; aspect-ratio:3/2; display:block; overflow:hidden}
.card__img img{width:100%; height:100%; object-fit:cover}
.card__play{position:absolute; left:16px; bottom:16px; width:40px; height:40px; border-radius:50%; background:var(--kesri)}
.card__play::after{content:""; position:absolute; left:16px; top:12px; border:8px solid transparent; border-left:12px solid var(--ink); border-right:0}
.card__body{padding:22px 22px 26px; display:flex; flex-direction:column; gap:10px; flex:1}
.card h3{font-size:22px; line-height:1.22}
.card__ex{color:#45596F; font-size:15.5px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.card .more{margin-top:auto; align-self:flex-start}
.empty{text-align:center; color:var(--muted); padding:30px 0}

/* 5. In the media --------------------------------------------------------- */
.media{display:grid; grid-template-columns:4fr 8fr; gap:clamp(28px,5vw,72px); align-items:start}
.media__intro{position:sticky; top:110px}
.media__intro p{color:var(--muted); margin:12px 0 24px; max-width:30ch}
.media__list{list-style:none; margin:0; padding:0; border-top:2px solid var(--ink)}
.media__item{display:grid; grid-template-columns:200px 1fr auto; gap:24px; align-items:baseline; padding:26px 0; border-bottom:1px solid var(--line)}
.media__pub{font:600 italic 22px/1.15 var(--serif); color:var(--neela)}
.media__body h3{font-size:21px; line-height:1.3; margin-bottom:6px}
.media__body h3 a:hover{text-decoration:underline; text-decoration-color:var(--kesri); text-underline-offset:4px}
.media__go{font-weight:600; font-size:14.5px; color:var(--kesri-t); white-space:nowrap}
.media__go:hover{color:var(--ink)}

/* 6. Voices --------------------------------------------------------------- */
.voices{display:grid; grid-template-columns:repeat(4,1fr); gap:24px}
.voice{background:#fff; border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column}
.voice__img{aspect-ratio:5/6; width:100%; object-fit:cover}
.voice__body{padding:20px 20px 24px; display:flex; flex-direction:column; gap:8px; flex:1}
.voice h3{font-size:22px}
.voice__role{font-size:14px; color:var(--muted); line-height:1.4}
.voice blockquote{margin:6px 0 10px; font:italic 400 18px/1.4 var(--serif); color:var(--ink); padding-left:14px; border-left:3px solid var(--kesri)}
.voice .more{margin-top:auto; align-self:flex-start}

/* 7. Press releases (dark) ------------------------------------------------ */
.sec--night{background:var(--night); color:#E6F0F8; position:relative}
.sec--night .sec__title{color:#fff}
.pr{display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.18)}
.pr__item{padding:32px 32px 8px 0; display:flex; flex-direction:column; gap:12px}
.pr__item+.pr__item{padding-left:32px; border-left:1px solid rgba(255,255,255,.18)}
.pr__date{font-size:14px; color:#A9C3DA; display:flex; align-items:baseline; gap:8px}
.pr__date b{font:500 46px/1 var(--serif); color:#FBAF44}
.pr__tag{font-size:13px; font-weight:600; color:var(--kesri)}
.pr__item h3{font-size:24px; color:#fff; line-height:1.25}
.pr__item h3 a:hover{text-decoration:underline; text-underline-offset:4px}
.pr__item p:not(.pr__tag){color:#B8CFE3; font-size:15.5px}
.pr__item .more{align-self:flex-start; margin-top:auto}

/* 8. Videos --------------------------------------------------------------- */
.vids{grid-template-columns:2fr 1fr 1fr; align-items:start}
.vid__thumb{position:relative; display:block; width:100%; padding:0; border:0; border-radius:var(--r-lg); overflow:hidden; cursor:pointer; aspect-ratio:4/5; background:var(--night); margin-bottom:16px}
.vid--wide .vid__thumb{aspect-ratio:16/11}
.vid__thumb img{width:100%; height:100%; object-fit:cover; transition:transform .6s ease, filter .6s}
.vid__thumb::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(10,43,71,.55),transparent 55%)}
.vid__play{position:absolute; left:50%; top:50%; z-index:2; width:66px; height:66px; border-radius:50%; display:grid; place-items:center; background:var(--kesri); color:var(--ink); transform:translate(-50%,-50%); transition:transform .3s}
.vid__play::before{content:""; position:absolute; inset:-8px; border-radius:50%; border:2px solid rgba(243,201,139,.7); transition:inset .3s, opacity .3s}
.vid__thumb:hover img{transform:scale(1.04)}
.vid__thumb:hover .vid__play{transform:translate(-50%,-50%) scale(1.06)}
.vid__thumb:hover .vid__play::before{inset:-14px; opacity:0}
.vid__dur{position:absolute; right:14px; bottom:14px; z-index:2; color:#fff; font-size:13px; font-weight:600; background:rgba(10,43,71,.7); padding:4px 8px; border-radius:var(--r-sm)}
.vid h3{font-size:21px; margin-top:6px}
.vid--wide h3{font-size:clamp(22px,2.2vw,28px)}
.vmodal{background:rgba(6,26,44,.85); display:grid; place-items:center; padding:20px}
.vmodal__panel{position:relative; width:min(960px,100%)}
.vmodal__frame{aspect-ratio:16/9; background:#000; border-radius:var(--r-md); overflow:hidden; display:grid; place-items:center; color:#C9DCEC; text-align:center; padding:20px}
.vmodal__frame iframe{width:100%; height:100%; border:0}
.vmodal__close{position:absolute; top:-52px; right:0; color:#fff}
.vmodal__close:hover{background:rgba(255,255,255,.12)}

/* 9. Stats ---------------------------------------------------------------- */
.stats{background:linear-gradient(135deg,var(--night) 0%,#0B4F7C 100%); color:#fff; position:relative; overflow:hidden}
.stats::after{content:""; position:absolute; right:-160px; top:-160px; width:440px; height:440px; border-radius:50%; background:var(--teal); opacity:.18}
.stats .sec__title{color:#fff; margin-bottom:40px}
.stats__grid{display:grid; grid-template-columns:repeat(4,1fr); margin:0; position:relative; z-index:1}
.stat{padding:8px 24px 8px 0}
.stat+.stat{padding-left:24px; border-left:1px solid rgba(255,255,255,.22)}
.stat__num{font:500 clamp(48px,6vw,84px)/1 var(--serif); letter-spacing:-.03em; color:#FBAF44; font-variant-numeric:tabular-nums}
.stat dd{margin:12px 0 0; font-size:16px; color:#D7E6F3; max-width:18ch}
.stats__src{margin-top:36px; font-size:13.5px; color:#A9C3DA; position:relative; z-index:1}

/* 10. Newsletter ---------------------------------------------------------- */
.news-cta{padding:clamp(56px,7vw,88px) 0}
.news-cta__in{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:24px; padding:clamp(28px,4vw,56px)}
.news-cta p{color:var(--muted); margin-top:10px; max-width:42ch}
.nl{display:flex; flex-wrap:wrap; gap:10px}
.nl input{flex:1 1 240px; min-width:0; font:400 16px var(--sans); padding:15px 20px; border-radius:999px; border:1.5px solid var(--line); background:var(--paper); color:var(--ink)}
.nl input:focus{outline:none; border-color:var(--neela)}
.nl__msg{flex-basis:100%; font-size:14.5px; min-height:1.4em; margin:2px 0 0 8px}
.nl__msg.is-err{color:#B42318}
.nl__msg.is-ok{color:#1E7A44}

/* Footer ------------------------------------------------------------------ */
.site-foot{background:var(--night); color:#C9DCEC; font-size:15px}
.foot-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1.3fr; gap:40px; padding-top:56px; padding-bottom:40px}
.foot-logo{display:inline-block; background:#fff; padding:12px 16px; border-radius:var(--r-md)}
.foot-logo .brand__logo{height:48px}
.foot-brand p{margin-top:16px; max-width:32ch}
.site-foot h3{font:600 15px var(--sans); color:#fff; margin-bottom:14px}
.site-foot ul{list-style:none; margin:0; padding:0; display:grid; gap:9px}
.site-foot a:hover{color:#FBAF44}
.foot-bottom{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; padding-top:22px; padding-bottom:28px; border-top:1px solid rgba(255,255,255,.14); font-size:14px}

/* Responsive -------------------------------------------------------------- */
@media (max-width:1100px){
  .nav a{padding:8px 9px; font-size:15px}
  .voices{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:980px){
  .nav,.head-cta{display:none}
  .burger{display:inline-flex}
  .hero__grid,.feat,.media,.news-cta__in{grid-template-columns:1fr}
  .hero h1{max-width:16ch}
  .media__intro{position:static}
  .grid3{grid-template-columns:repeat(2,1fr)}
  .vids{grid-template-columns:1fr 1fr}
  .vid--wide{grid-column:1/-1}
  .vid--wide .vid__thumb{aspect-ratio:16/9; height:auto}
  .pr{grid-template-columns:1fr}
  .pr__item,.pr__item+.pr__item{padding:28px 0; border-left:0; border-bottom:1px solid rgba(255,255,255,.18)}
  .stats__grid{grid-template-columns:repeat(2,1fr); row-gap:36px}
  .stat:nth-child(3){padding-left:0; border-left:0}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
}
@media (max-width:640px){
  body{font-size:16px}
  .site-head__in{height:64px}
  .brand__logo{height:42px}
  .grid3,.vids,.voices{grid-template-columns:1fr}
  .mini{grid-template-columns:96px 1fr; gap:14px}
  .mini h3{font-size:18px}
  .media__item{grid-template-columns:1fr; gap:8px}
  .media__pub{font-size:19px}
  .hero__card{aspect-ratio:4/5}
  .vid__thumb{aspect-ratio:16/10}
  .sec__head--split .btn{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important; transition:none!important}
  html{scroll-behavior:auto}
}

/* ==========================================================================
   Inner pages — In the news / Publication
   ========================================================================== */
.sec--tight{padding:clamp(36px,4vw,56px) 0}
.sec-filters{padding:0 0 8px; position:sticky; top:84px; z-index:30}
@media (max-width:980px){.sec-filters{position:static}}
.sec__title--sm{font-size:clamp(26px,2.6vw,34px)}
.notice{background:#fff; border:1px solid var(--line); border-radius:var(--r-md); padding:22px 24px; color:var(--muted)}
.notice .more{margin-left:8px}
.page-hero{padding:clamp(36px,5vw,64px) 0 clamp(24px,3vw,36px); background:linear-gradient(180deg,#fff,var(--paper))}
.page-hero h1{font-size:clamp(38px,5vw,60px); letter-spacing:-.02em}
.page-hero__lede{color:#34485E; font-size:18px; margin-top:14px; max-width:58ch}
.page-hero__facts{display:flex; flex-wrap:wrap; gap:10px; list-style:none; margin:22px 0 0; padding:0}
.page-hero__facts li{background:var(--mist); border-radius:999px; padding:8px 16px; font-size:15px; color:var(--muted)}
.page-hero__facts b{color:var(--ink); font-weight:700}
.crumbs{display:flex; flex-wrap:wrap; gap:8px; font-size:14px; color:var(--muted); margin-bottom:18px}
.crumbs a{color:var(--neela)}
.crumbs a:hover{text-decoration:underline}

.filters{display:flex; flex-wrap:wrap; gap:12px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:14px}
.filters__search{flex:1 1 280px; display:flex; align-items:center; gap:10px; background:var(--paper); border:1.5px solid var(--line); border-radius:999px; padding:0 16px; color:var(--muted)}
.filters__search:focus-within{border-color:var(--neela)}
.filters__search input{flex:1; min-width:0; border:0; background:none; font:400 16px var(--sans); padding:12px 0; color:var(--ink); outline:none}
.filters select{font:500 15px var(--sans); color:var(--ink); padding:12px 38px 12px 16px; border-radius:999px; border:1.5px solid var(--line); background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2352657A' stroke-width='1.8' fill='none'/%3E%3C/svg%3E") no-repeat right 16px center; -webkit-appearance:none; appearance:none; max-width:220px}
.filters .btn{padding:12px 22px}
.filters__clear{font-weight:600; font-size:14.5px; color:var(--kesri-t)}

.pub-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:14px; list-style:none; margin:0; padding:0}
.pub-grid--compact{grid-template-columns:repeat(6,1fr)}
.pub-card{display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; background:#fff; border:1px solid var(--line); border-radius:var(--r-md); padding:16px 12px 14px; height:100%; transition:border-color .2s, transform .2s}
.pub-card:hover{border-color:var(--neela); transform:translateY(-2px)}
.pub-card__logo{display:grid; place-items:center; width:100%; height:56px}
.pub-card__logo img{max-width:100%; max-height:56px; object-fit:contain}
.pub-card__name{font:600 15px/1.25 var(--sans)}
.pub-card__count{font-size:13px; color:var(--muted)}

.cov-group+.cov-group{margin-top:48px}
.cov-group__name{font-size:clamp(22px,2.2vw,28px); margin-bottom:18px; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px}
.cov-group__name span{font:500 15px var(--sans); color:var(--muted)}
.cov-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.cov-card{display:flex; flex-direction:column; gap:12px; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:20px 22px; transition:border-color .2s, box-shadow .2s}
.cov-card:hover{border-color:var(--neela); box-shadow:0 10px 30px -18px rgba(11,121,191,.6)}
.cov-card__pub{display:flex; align-items:center; gap:12px}
.cov-card__pub img{width:52px; height:36px; object-fit:contain; border-radius:6px; background:var(--paper); flex:none}
.cov-card__pub b{display:block; font-size:14.5px; color:var(--neela)}
.cov-card__pub small{display:block; font-size:12.5px; color:var(--muted)}
.cov-card__title{font:500 20px/1.3 var(--serif); color:var(--ink)}
.cov-card__ex{font-size:15px; color:#45596F; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.cov-card__foot{margin-top:auto; display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:13.5px; color:var(--muted); padding-top:6px}
.cov-card__go{display:inline-flex; align-items:center; gap:4px; font-weight:600; color:var(--kesri-t)}
.cov-card:hover .cov-card__go{color:var(--neela)}

.pub-head{display:flex; align-items:center; gap:clamp(18px,3vw,32px)}
.pub-head__logo{flex:none; width:clamp(120px,16vw,180px); aspect-ratio:3/2; display:grid; place-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:16px}
.pub-head__logo img{max-width:100%; max-height:100%; object-fit:contain}

@media (max-width:1100px){.pub-grid,.pub-grid--compact{grid-template-columns:repeat(4,1fr)}.cov-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){
  .pub-grid,.pub-grid--compact{grid-template-columns:repeat(2,1fr)}
  .cov-grid{grid-template-columns:1fr}
  .filters select{max-width:none; flex:1 1 100%}
  .filters .btn{flex:1}
  .pub-head{flex-direction:column; align-items:flex-start}
}
@media (max-width:640px){.filters>label:not(.filters__search){flex:1 1 100%}.filters select{width:100%}}

/* ==========================================================================
   Press releases / Videos pages
   ========================================================================== */
.result-count{color:var(--muted); margin:0 0 16px}
.pr-lead{display:grid; grid-template-columns:7fr 5fr; gap:clamp(24px,4vw,48px); align-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; margin-bottom:28px}
.pr-lead:not(:has(.pr-lead__img)){grid-template-columns:1fr}
.pr-lead__img{display:block; height:100%; min-height:300px}
.pr-lead__img img{width:100%; height:100%; object-fit:cover}
.pr-lead__body{padding:clamp(24px,3vw,40px)}
.pr-lead:not(:has(.pr-lead__img)) .pr-lead__body{max-width:820px}
.pr-lead h2{font-size:clamp(26px,2.8vw,36px); margin:12px 0}
.pr-lead h2 a:hover{color:var(--neela)}
.pr-lead__ex{color:#34485E; margin-bottom:22px}
.pr-list{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.pr-row{display:grid; grid-template-columns:110px 1fr auto; gap:24px; align-items:start; padding:24px 0; border-bottom:1px solid var(--line)}
.pr-row__date{display:flex; flex-direction:column; color:var(--muted); font-size:14px}
.pr-row__date b{font:500 40px/1 var(--serif); color:var(--neela)}
.pr-row h3{font-size:22px; line-height:1.3}
.pr-row h3 a:hover{color:var(--neela)}
.pr-row__body p{color:#45596F; margin-top:6px; max-width:70ch}
.pr-row__go{font-weight:600; color:var(--kesri-t); white-space:nowrap; padding-top:6px}
.pr-row__go:hover{color:var(--neela)}
.pager-front{display:flex; justify-content:center; align-items:center; gap:22px; margin-top:36px; color:var(--muted)}
.pager-front a{font-weight:600; color:var(--neela)}

.release__head{padding-top:clamp(36px,5vw,64px)}
.release__head>*{max-width:900px}
.release__head h1{font-size:clamp(34px,4.6vw,56px); letter-spacing:-.02em; line-height:1.08}
.release__dek{font-size:clamp(18px,1.6vw,21px); color:#34485E; margin-top:18px; max-width:62ch}
.release__meta{margin-top:20px}
.release__img{margin:clamp(28px,4vw,44px) auto 0}
.release__img img{width:100%; max-height:560px; object-fit:cover; border-radius:var(--r-lg)}
.release__grid{display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:clamp(32px,5vw,72px); padding-top:clamp(32px,4vw,48px); padding-bottom:clamp(56px,7vw,96px)}
.prose{font-size:18px; line-height:1.75; color:#1E3349; max-width:70ch}
.prose>*+*{margin-top:1.1em}
.prose h2{font-size:28px; margin-top:1.6em}
.prose h3{font-size:22px; margin-top:1.4em}
.prose a{color:var(--neela); text-decoration:underline; text-underline-offset:3px}
.prose blockquote{margin-left:0; padding-left:20px; border-left:3px solid var(--kesri); font:italic 400 21px/1.5 var(--serif); color:var(--ink)}
.prose ul,.prose ol{padding-left:1.3em}
.prose li+li{margin-top:.4em}
.dateline{font-weight:700; font-size:15px; letter-spacing:.02em; color:var(--ink)}
.release__end{text-align:center; color:var(--muted); letter-spacing:.3em; margin-top:2em!important}
.release__side{display:flex; flex-direction:column; gap:16px; position:sticky; top:110px; align-self:start}
.side-box{background:var(--mist); border-radius:var(--r-md); padding:20px}
.side-box h2{font:600 15px var(--sans); margin-bottom:10px}
.side-box a{color:var(--neela)}
.share{display:flex; flex-wrap:wrap; gap:8px}
.share a,.share__copy{font:600 13.5px var(--sans); padding:8px 12px; border-radius:999px; background:#fff; border:1px solid var(--line); color:var(--ink); cursor:pointer}
.share a:hover,.share__copy:hover{border-color:var(--neela); color:var(--neela)}

.tabs--links{display:inline-flex; margin-bottom:28px}
.tabs--links a{flex:none; font:600 14px var(--sans); color:var(--muted); padding:10px 16px; border-radius:999px}
.tabs--links a[aria-current]{background:var(--neela); color:#fff}
.vid--lead{display:grid; grid-template-columns:3fr 2fr; gap:clamp(20px,3vw,40px); align-items:center; margin-bottom:40px}
.vid--lead .vid__thumb{aspect-ratio:16/9; margin:0}
.vid--lead h3{font-size:clamp(24px,2.6vw,34px)}
.vid__desc{color:#45596F; margin-top:12px}
.vid-grid .vid__thumb{aspect-ratio:16/9}

@media (max-width:980px){
  .pr-lead,.vid--lead{grid-template-columns:1fr}
  .pr-lead__img{min-height:220px}
  .release__grid{grid-template-columns:1fr}
  .release__side{position:static}
}
@media (max-width:640px){
  .pr-row{grid-template-columns:1fr; gap:8px}
  .pr-row__date{flex-direction:row; align-items:baseline; gap:8px}
  .pr-row__date b{font-size:26px}
  .prose{font-size:17px}
}

/* Rich content from the editor */
.prose img{height:auto; border-radius:10px}
.prose .align-left{float:left; margin:6px 24px 14px 0; max-width:50%}
.prose .align-right{float:right; margin:6px 0 14px 24px; max-width:50%}
.prose .align-center{display:block; margin-left:auto; margin-right:auto}
.prose figure{margin:1.6em 0}
.prose figure.align-left,.prose figure.align-right{margin-top:6px}
.prose figcaption{font-size:14px; color:var(--muted); margin-top:8px}
.prose hr{border:0; border-top:1px solid var(--line); margin:2em 0}
.prose table{border-collapse:collapse; width:100%; font-size:16px; display:block; overflow-x:auto}
.prose th,.prose td{border:1px solid var(--line); padding:10px 12px; text-align:left}
.prose th{background:var(--mist)}
.prose::after{content:""; display:block; clear:both}
.video-embed__frame{position:relative; aspect-ratio:16/9; border-radius:12px; overflow:hidden; background:var(--night)}
.video-embed__frame iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.prose a.file-link{display:inline-flex; align-items:center; gap:10px; padding:12px 16px; border:1px solid var(--line); border-radius:10px; text-decoration:none; font-weight:600; background:#fff}
.prose a.file-link::before{content:"PDF"; font:800 11px/1 var(--sans); color:#fff; background:#B42318; padding:6px 7px; border-radius:5px}
.prose a.file-link:hover{border-color:var(--neela)}
@media (max-width:640px){.prose .align-left,.prose .align-right{float:none; max-width:100%; margin:1em 0}}

.vid__cta{display:inline-block; margin-top:10px}

/* ==========================================================================
   Events
   ========================================================================== */
.ev-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}
.ev-card{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; transition:border-color .2s, box-shadow .2s}
.ev-card:hover{border-color:var(--neela); box-shadow:0 14px 34px -22px rgba(11,121,191,.55)}
.ev-card__img{aspect-ratio:16/9; overflow:hidden}
.ev-card__img img{width:100%; height:100%; object-fit:cover}
.ev-card__main{display:flex; gap:18px; padding:22px; flex:1}
.ev-date{flex:none; width:64px; text-align:center; border-radius:12px; overflow:hidden; border:1px solid var(--line); align-self:flex-start; background:#fff}
.ev-date span{display:block; background:var(--neela); color:#fff; font:700 12px/1 var(--sans); letter-spacing:.06em; padding:6px 0; text-transform:uppercase}
.ev-date b{display:block; font:500 30px/1.1 var(--serif); color:var(--ink); padding-top:6px}
.ev-date small{display:block; font-size:12px; color:var(--muted); padding-bottom:7px}
.ev-card__body{display:flex; flex-direction:column; gap:10px; min-width:0; flex:1}
.ev-card h3{font-size:21px; line-height:1.25}
.ev-meta{list-style:none; margin:0; padding:0; display:grid; gap:5px; font-size:14px; color:var(--muted)}
.ev-meta li{display:grid; grid-template-columns:15px 1fr; gap:8px; align-items:start}
.ev-meta svg{flex:none; margin-top:3px; color:var(--kesri-t)}
.ev-meta__t{display:block; color:var(--ink); font-weight:500}
.ev-card__sum{font-size:15px; color:#45596F}
.ev-card__cta{align-self:flex-start; margin-top:auto; padding:11px 20px; font-size:14.5px}
.ev-card__done{margin-top:auto; font-size:13.5px; font-weight:600; color:var(--muted)}
.ev-card--past .ev-date span{background:#7C8DA0}
.ev-list{display:grid; gap:18px}
.ev-list .ev-card{flex-direction:row}
.ev-list .ev-card__img{flex:none; width:300px; aspect-ratio:auto}
.ev-list .ev-card__sum{max-width:70ch}
@media (max-width:980px){.ev-grid{grid-template-columns:1fr 1fr}.ev-list .ev-card{flex-direction:column}.ev-list .ev-card__img{width:100%; aspect-ratio:16/9}}
@media (max-width:640px){.ev-grid{grid-template-columns:1fr}.ev-card__main{gap:14px; padding:18px}}

/* ==========================================================================
   v4 — placeholders, logo carousel, spotlight slider, mobile header
   ========================================================================== */
/* Branded placeholder when an item has no image */
.ph{display:grid; place-items:center; width:100%; height:100%; min-height:100%; background:linear-gradient(135deg,var(--night),#0B4F7C); position:relative; overflow:hidden}
.ph::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 78% 28%,rgba(251,175,68,.55) 0 18%,transparent 19%),radial-gradient(circle at 20% 110%,rgba(30,184,208,.45) 0 40%,transparent 41%)}
.ph::after{position:relative; font:600 13px/1 var(--sans); color:#fff; background:rgba(255,255,255,.14); padding:8px 12px; border-radius:999px; letter-spacing:.02em}
.ph--press::after{content:"Press release"} .ph--video::after{content:"Video"} .ph--event::after{content:"Event"} .ph--news::after{content:"In the news"}
.ph--logo{background:#fff; border-bottom:1px solid var(--line); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:18px}
.ph--logo::before,.ph--logo::after{display:none}
.ph--logo img{max-width:70%; max-height:60%; object-fit:contain}
.ph--logo b{font:600 14px var(--sans); color:var(--muted); text-align:center}
.hero__img .ph,.feat__img .ph,.card__img .ph,.mini__img .ph{position:absolute; inset:0}
.feat__img,.card__img,.mini__img{position:relative}

/* Logo carousel — 5 per view desktop, 4 tablet, 2 mobile */
.logos{padding:clamp(36px,5vw,56px) 0; background:var(--mist)}
.logos__head{display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:22px}
.logos__title{font:500 clamp(22px,2.2vw,28px)/1.2 var(--serif); color:var(--ink)}
.logos__nav{display:flex; align-items:center; gap:10px}
.logos__nav .more{margin-right:8px}
.lc{--per:5; display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - (var(--per) - 1) * 18px) / var(--per)); gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; list-style:none; margin:0; padding:4px 0 8px; scrollbar-width:none}
.lc::-webkit-scrollbar{display:none}
.lc li{scroll-snap-align:start}
.lc__tile{display:grid; place-items:center; height:130px; padding:20px 26px; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); transition:border-color .2s, transform .2s, box-shadow .2s}
.lc__tile:hover{border-color:var(--neela); transform:translateY(-3px); box-shadow:0 14px 30px -22px rgba(11,121,191,.6)}
.lc__tile img{max-width:100%; max-height:84px; width:auto; height:auto; object-fit:contain}
.lc__name{font:600 17px/1.2 var(--serif); color:var(--ink); text-align:center}
@media (max-width:1100px){.lc{--per:4}}
@media (max-width:760px){.lc{--per:2}.lc__tile{height:100px; padding:14px}.lc__tile img{max-height:62px}.logos__nav .more{display:none}}

/* Arrow buttons */
.spot-arrows{display:flex; gap:10px}
.spot-arrow{width:46px; height:46px; border-radius:50%; border:1.5px solid var(--line); background:#fff; color:var(--ink); display:grid; place-items:center; cursor:pointer; transition:background .2s, border-color .2s, color .2s; flex:none}
.spot-arrow:hover{background:var(--neela); border-color:var(--neela); color:#fff}
.spot-arrow--light{background:transparent; border-color:rgba(255,255,255,.35); color:#fff}
.head-tools{display:flex; align-items:center; gap:18px}

/* Spotlight slider (big feature + side list) */
.spot{display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:clamp(20px,3vw,40px); background:var(--mist); border-radius:24px; padding:clamp(16px,2.4vw,32px)}
.spot__stage{position:relative; min-width:0}
.spot__slide{display:none; flex-direction:column; gap:18px; animation:spotIn .45s ease both}
.spot__slide.is-active{display:flex}
@keyframes spotIn{from{opacity:0; transform:translateY(8px)}}
.spot__media{position:relative; display:block; width:100%; aspect-ratio:16/9; border-radius:18px; overflow:hidden; background:var(--night); border:0; padding:0; cursor:pointer}
.spot__media img{width:100%; height:100%; object-fit:cover; transition:transform .6s ease}
.spot__media:hover img{transform:scale(1.03)}
.spot__media .ph{position:absolute; inset:0}
.spot__badge{position:absolute; left:16px; top:16px; background:#fff; color:var(--ink); font:600 13px/1 var(--sans); padding:8px 12px 8px 24px; border-radius:999px}
.spot__badge::before{content:""; position:absolute; left:11px; top:50%; width:7px; height:7px; border-radius:50%; background:var(--kesri); transform:translateY(-50%)}
.spot__play{position:absolute; left:50%; top:50%; width:84px; height:84px; transform:translate(-50%,-50%); border-radius:50%; background:#fff; color:var(--ink); display:grid; place-items:center; box-shadow:0 10px 30px rgba(0,0,0,.25); transition:transform .25s}
.spot__media:hover .spot__play{transform:translate(-50%,-50%) scale(1.08)}
.spot__info h3{font-size:clamp(24px,2.5vw,34px); line-height:1.15; letter-spacing:-.01em}
.spot__info h3 a:hover{color:var(--neela)}
.spot__info .meta{margin-top:10px}
.spot__ex{color:#45596F; margin-top:10px; max-width:62ch; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.spot__cta{margin-top:16px; padding:12px 20px; font-size:14.5px}
.spot__list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; min-width:0; max-height:640px; overflow-y:auto; scrollbar-width:thin}
.spot__li{display:grid; grid-template-columns:150px 1fr; gap:16px; align-items:center; width:100%; text-align:left; background:transparent; border:0; border-radius:14px; padding:8px; cursor:pointer; color:var(--ink); font:inherit; transition:background .2s}
.spot__li:hover{background:rgba(255,255,255,.7)}
.spot__li.is-active{background:#fff; box-shadow:0 8px 24px -16px rgba(10,43,71,.45)}
.spot__thumb{position:relative; aspect-ratio:16/10; border-radius:10px; overflow:hidden; background:var(--night); display:block}
.spot__thumb img{width:100%; height:100%; object-fit:cover}
.spot__thumb .ph{position:absolute; inset:0}
.spot__thumb .ph::after{font-size:10.5px; padding:5px 8px}
.spot__mini-play{position:absolute; left:50%; top:50%; width:30px; height:30px; transform:translate(-50%,-50%); border-radius:50%; background:rgba(255,255,255,.92)}
.spot__mini-play::after{content:""; position:absolute; left:12px; top:9px; border:6px solid transparent; border-left:9px solid var(--ink); border-right:0}
.spot__li-text{display:flex; flex-direction:column; gap:6px; min-width:0}
.spot__li-text b{font:500 18px/1.3 var(--serif); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.spot__li-text small{font-size:13.5px; color:var(--muted)}
.spot__li.is-active b{color:var(--neela)}
.sec--night .spot{background:rgba(255,255,255,.05)}
@media (max-width:980px){
  .spot{grid-template-columns:1fr}
  .spot__list{flex-direction:row; max-height:none; overflow-x:auto; overflow-y:visible; scroll-snap-type:x mandatory; padding-bottom:6px}
  .spot__list li{flex:0 0 min(78%,320px); scroll-snap-align:start}
  .spot__li{grid-template-columns:110px 1fr; gap:12px}
  .spot__li-text b{font-size:16px}
}
@media (max-width:640px){
  .spot{border-radius:18px; padding:12px; margin-left:calc(var(--gut) * -0.4); margin-right:calc(var(--gut) * -0.4)}
  .spot__play{width:62px; height:62px}
  .head-tools .more{display:none}
}

/* Featured voices placeholder */
.voice__img--ph{display:grid; place-items:center; aspect-ratio:5/6; background:linear-gradient(135deg,var(--night),#0B4F7C); color:#fff; font:500 64px var(--serif)}

/* Mobile header fix */
@media (max-width:980px){
  .site-head__in{gap:12px}
  .head-actions{margin-left:auto; gap:4px}
  .burger{display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:44px; height:44px; border-radius:12px; border:1.5px solid var(--line); background:#fff}
  .burger span{width:20px}
  .brand__logo{height:48px}
}
@media (max-width:640px){
  .site-head__in{height:68px}
  .brand__logo{height:42px}
  .trend__in{height:38px; gap:12px}
  .trend__tag{font-size:11.5px; padding:4px 8px}
}

.ev-card__img{position:relative}
.ev-card__img .ph{position:absolute; inset:0}
.ev-card__body .btn{align-self:flex-start}
.ev-grid .ev-card__sum{display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
/* Mobile: long card grids become swipe rows */
@media (max-width:640px){
  #updatesGrid,.ev-grid{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:14px; padding-bottom:8px; margin-right:calc(var(--gut) * -1); padding-right:var(--gut); scrollbar-width:none}
  #updatesGrid::-webkit-scrollbar,.ev-grid::-webkit-scrollbar{display:none}
  #updatesGrid>.card,.ev-grid>.ev-card{flex:0 0 84%; scroll-snap-align:start}
  #updatesGrid>.card[hidden]{display:none}
  .hero__ctas{flex-wrap:nowrap}
  .hero__ctas .btn{padding:13px 18px; font-size:14.5px}
}
/* Inner pages: tighter hero, section heads with arrows */
.page-hero{padding-bottom:clamp(20px,2.5vw,28px)}
.sec-filters{padding-top:6px}
.spot-head{display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:20px}
.spot-head h2{font-size:clamp(24px,2.4vw,32px)}
.list-head{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; margin:clamp(36px,5vw,56px) 0 18px}
.list-head h2{font-size:clamp(24px,2.4vw,32px)}
.list-head .tabs--links{margin-bottom:0}
.vid-grid{margin-top:0}
.vid-grid .vid{background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column}
.vid-grid .vid__thumb{border-radius:0; margin:0}
.vid-grid .vid__body{padding:16px 18px 20px; display:flex; flex-direction:column; gap:6px; flex:1}
.vid-grid .vid h3{font-size:19px; margin:0}
.vid-grid .vid__cta{margin-top:auto; align-self:flex-start}
.vid__thumb .ph{position:absolute; inset:0}
@media (max-width:980px){.vid-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.vid-grid{grid-template-columns:1fr}}

.sec--tight>.wrap>.tabs--links:first-child{margin-bottom:24px}

/* Rich content safety: pasted content never breaks the layout */
.prose{overflow-wrap:break-word; min-width:0}
.prose img,.prose video,.prose iframe{max-width:100%; height:auto}
.prose figure,.prose [style*="width"]{max-width:100%}
.prose figure img{display:block}
.prose pre{white-space:pre-wrap}
.release__grid>*{min-width:0}

/* Homepage: Latest updates is now the first section */
.sec--top{padding-top:clamp(40px,5vw,64px)}
.sec--top h1.sec__title{font-size:clamp(34px,4vw,52px); letter-spacing:-.02em}

/* "Our work has been covered by" — publication cards in the slider */
.logos{background:var(--paper)}
.lc--cards{gap:20px; grid-auto-columns:calc((100% - (var(--per) - 1) * 20px) / var(--per)); padding:6px 2px 12px}
.lc__card{display:flex; flex-direction:column; height:100%; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; transition:border-color .2s, transform .25s, box-shadow .25s}
.lc__card:hover{border-color:var(--neela); transform:translateY(-4px); box-shadow:0 18px 36px -24px rgba(11,121,191,.55)}
.lc__logo{display:grid; place-items:center; height:120px; padding:18px 22px; background:#fff}
.lc__logo img{max-width:100%; max-height:76px; width:auto; height:auto; object-fit:contain; transition:transform .3s}
.lc__card:hover .lc__logo img{transform:scale(1.05)}
.lc__meta{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 16px; border-top:1px solid var(--line); background:var(--mist); margin-top:auto}
.lc__meta b{display:block; font:600 14.5px/1.25 var(--sans); color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:170px}
.lc__meta small{display:block; font-size:12.5px; color:var(--muted); margin-top:2px}
.lc__go{flex:none; width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:#fff; color:var(--neela); border:1px solid var(--line); transition:background .2s, color .2s}
.lc__card:hover .lc__go{background:var(--neela); color:#fff; border-color:var(--neela)}
@media (max-width:760px){.lc__logo{height:96px; padding:14px}.lc__logo img{max-height:58px}.lc__meta{padding:10px 12px}.lc__meta b{font-size:13.5px; max-width:110px}}
/* Publication cards: 4 per view on desktop, 3 tablet, 2 mobile */
.lc--cards{--per:4}
@media (max-width:1100px){.lc--cards{--per:3}}
@media (max-width:760px){.lc--cards{--per:2}}
.lc--cards .lc__logo{height:140px}
.lc--cards .lc__logo img{max-height:88px}
.lc--cards .lc__meta b{max-width:210px}
@media (max-width:760px){.lc--cards .lc__logo{height:96px}.lc--cards .lc__logo img{max-height:58px}.lc--cards .lc__meta b{max-width:110px}}

/* Header: Donate Now */
.head-donate{display:inline-flex; align-items:center; gap:8px}
.head-donate svg{flex:none}
.nav{gap:8px}

/* ---------- Mobile: Latest updates as a clean compact list ---------- */
@media (max-width:640px){
  .sec--top .sec__head--split{flex-direction:column; align-items:stretch; gap:16px}
  #updates .tabs{flex-wrap:wrap; gap:8px; background:none; border:0; padding:0; border-radius:0; overflow:visible}
  #updates .tabs button{padding:8px 14px; font-size:13.5px; border:1.5px solid var(--line); background:#fff}
  #updates .tabs button[aria-selected="true"]{background:var(--neela); border-color:var(--neela); color:#fff}
  #updatesGrid{display:flex; flex-direction:column; gap:0; overflow:visible; margin:0; padding:0; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg)}
  #updatesGrid>.card{flex:none; display:grid; grid-template-columns:96px minmax(0,1fr); gap:14px; align-items:start; background:transparent; border:0; border-radius:0; border-bottom:1px solid var(--line); padding:14px; overflow:visible}
  #updatesGrid>.card:last-of-type{border-bottom:0}
  #updatesGrid>.card[hidden]{display:none}
  #updatesGrid .card__img{aspect-ratio:1; border-radius:10px; overflow:hidden}
  #updatesGrid .card__play{left:8px; bottom:8px; width:28px; height:28px}
  #updatesGrid .card__play::after{left:11px; top:8px; border-width:6px; border-left-width:9px}
  #updatesGrid .card__body{padding:0; gap:5px}
  #updatesGrid .card .meta{font-size:12.5px; gap:2px 10px}
  #updatesGrid .card h3{font-size:17px; line-height:1.3; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
  #updatesGrid .card__ex,#updatesGrid .card .more{display:none}
  #updatesGrid .ph::after{font-size:9.5px; padding:4px 6px}
  #updatesGrid .ph--logo{padding:8px; gap:0}
  #updatesGrid .ph--logo b{display:none}
  #updates .center{margin-top:22px}
}

/* ---------- Mobile: one publication card at a time ---------- */
@media (max-width:640px){
  .lc--cards{--per:1}
  .lc--cards .lc__logo{height:130px}
  .lc--cards .lc__logo img{max-height:80px}
  .lc--cards .lc__meta b{max-width:220px}
  .logos__head{align-items:flex-start}
}
.head-donate{white-space:nowrap}
@media (max-width:980px){.head-cta.head-donate{display:inline-flex}}
@media (max-width:640px){
  .head-cta.head-donate{padding:9px 13px; font-size:13.5px; gap:6px}
  .head-cta.head-donate svg{width:14px; height:14px}
  .head-actions{gap:2px}
  .brand__logo{height:38px}
  #updatesGrid .ph--logo{border-bottom:0}
}
@media (max-width:360px){.head-cta.head-donate svg{display:none}}