/* clean.css: the agreed consistency layer for TGLC + Partners, loaded last on every page.
   Only these changes, nothing else:
   1. page colour #FFFAEF (header bar included; footer stays navy as live)
   2. faint card fills rotating blue, yellow, green, rose, each with a faint outline
   3. the moving band full width under the hero, equal space above and below
   4. the quiet "We accept" payment line on Give
   (older articles get their editorial layout from the article block further down) */

/* 1. Page colour */
:root{--bg:#FFFAEF;--page:#FFFAEF!important;--cream:#FFFAEF!important}
html,html body,body.sp,body.gpv,header.gh,html body nav#nav .bar:not(#_){background-color:var(--bg)!important}
/* footer stays exactly as live (navy, white text and logo) */

/* 2. Card fills: every card keeps its original colour role (blue, yellow, green, red); the shades are the agreed faint ones, plus a faint outline */
:root{--t-blue:#EAF0FA!important;--t-gold:#FFF3D1!important;--t-green:#E5F3EA!important}
/* cards with their own original fill keep it and gain the same outline */
html body :is(.vm>div,.nums>.rv,.lab3-f>li,.lab3,.vm3-c,.nm3-c,.chips>.chip,.ways .wc,.ph>div,.yth-t,.dp-cta,.pg-sec,.pb-c,.ev-c,.pr-formcard,a.bro,.ic,.yth-card,a.nc,article.ldc,.lab3-lead,.dp-card,.steps4>li,.anytime,.form-closed){box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)!important}
html body :is(.pr-grid,.pr-steps,.pr-stats,.pg-grid,.dp-grid,.dp-swipe,.pc3-g,.sec7)>:is(.pr-card:not(.pr-pcard),li,.pg-card,.dp-card,.pc3){box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)!important}

/* 3. Moving band: full width, square, no edge fade; equal space above and below; neighbours give up their own gap */
:root{--bandgap:clamp(36px,5vw,64px)}
html body .mb3:not(#_),html body .vb:not(#_),html body.gpv .mq:not(#_){margin:var(--bandgap) 0!important;border-radius:0!important;-webkit-mask-image:none!important;mask-image:none!important;transform:none!important;max-width:none!important}
html body .vb .vb-band:not(#_){margin:0!important;border-radius:0!important}
html body :is(header,section,div):has(+ .mb3),html body :is(header,section,div):has(+ .vb),html body.gpv :is(header,section,div):has(+ .mq){padding-bottom:0!important;margin-bottom:0!important}
html body.gpv section:has(+ .mq) .chips{margin-bottom:0!important}
html body .mb3 + *,html body .vb + *,html body.gpv .mq + :not(.cap){margin-top:0!important;padding-top:0!important}
html body.gpv .mq + .cap{margin-top:0!important}

/* 4. Accepted payment methods: quiet inline line, not buttons */
html body ul.pr-chips:not(.pr-num){display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin:20px 0 0!important;padding:0!important}
html body ul.pr-chips:not(.pr-num)::before{content:"We accept";font:500 13px/1.4 Inter,sans-serif;color:#6b7280;width:100%;margin-bottom:2px}
html body ul.pr-chips:not(.pr-num) li{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important;
  font:500 14px/1.4 Inter,sans-serif!important;color:#4b5563!important;display:inline-flex;align-items:center;gap:7px;cursor:default;pointer-events:none}
html body ul.pr-chips:not(.pr-num) li::before{content:"";width:16px;height:16px;flex:none;background:#0D3C87;opacity:.75;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
html body ul.pr-chips:not(.pr-num) li:nth-child(1){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='6' y='2.5' width='12' height='19' rx='2.5'/%3E%3Cpath d='M10.5 18.5h3'/%3E%3C/svg%3E")}
html body ul.pr-chips:not(.pr-num) li:nth-child(2){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9.5 12 4l9 5.5M4.5 20.5h15M6 10.5v7M10 10.5v7M14 10.5v7M18 10.5v7'/%3E%3C/svg%3E")}
html body ul.pr-chips:not(.pr-num) li:nth-child(3){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='2.5'/%3E%3Cpath d='M2.5 10h19M6.5 15h4'/%3E%3C/svg%3E")}

/* ---------- Older news articles: same editorial layout as Miliarium ’26 and Linda ---------- */
html body main.nwa:not(.ax) .w{max-width:none!important}
html body main.nwa:not(.ax) article{max-width:680px;margin:0 auto;padding-top:clamp(8px,2vw,24px)}
html body main.nwa:not(.ax) .nwa-hd{background:none!important;padding:0!important;margin:0 0 clamp(28px,4vw,44px)!important;text-align:left;border:0!important}
html body main.nwa:not(.ax) .nwa-back{display:inline-block;font:500 14px/1 Inter,sans-serif;color:#0D3C87;text-decoration:none;margin:0 0 28px;opacity:.85}
html body main.nwa:not(.ax) .nw-meta{font:500 14px/1.4 Inter,sans-serif!important;color:#6e6e73!important;margin:0 0 12px!important;background:none!important;padding:0!important}
html body main.nwa:not(.ax) .nwa-hd .nw-meta b{display:none}
html body main.nwa:not(.ax) h1{font-size:clamp(32px,5vw,52px)!important;line-height:1.08!important;letter-spacing:-.025em!important;margin:0 0 18px!important;text-wrap:balance;max-width:none}
html body main.nwa:not(.ax) .nwa-dek{font-size:clamp(19px,2vw,22px)!important;line-height:1.45!important;color:#45474d!important;margin:0!important;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
html body main.nwa:not(.ax) .nwa-hero{margin:0 calc(50% - min(50vw - var(--edge,16px) - 8px,520px)) clamp(32px,5vw,56px)!important;max-width:none!important;padding:0!important;background:none!important}
html body main.nwa:not(.ax) .nwa-hero figure{margin:0}
html body main.nwa:not(.ax) .nwa-hero img{width:100%;height:auto;max-height:640px;object-fit:cover;border-radius:12px;display:block}
html body main.nwa:not(.ax) .nwa-body{max-width:none!important;font-size:clamp(17px,1.4vw,19px);line-height:1.62;color:#1d1d1f}
html body main.nwa:not(.ax) .nwa-body p{margin:0 0 1.15em!important;font-size:inherit!important;line-height:inherit!important}
html body main.nwa:not(.ax) .nwa-body p:has(>strong:only-child),html body main.nwa:not(.ax) .nwa-body h2,html body main.nwa:not(.ax) .nwa-body h3{font:600 clamp(21px,2vw,26px)/1.25 "Plus Jakarta Sans",Inter,sans-serif!important;letter-spacing:-.015em;margin:1.9em 0 .55em!important;color:#1d1d1f}
html body main.nwa:not(.ax) .nwa-body blockquote{border:0!important;background:none!important;padding:0 0 0 20px!important;margin:1.6em 0!important;box-shadow:inset 3px 0 0 #FFBF37;font-size:1.12em;color:#1d1d1f}
html body main.nwa:not(.ax) .nwa-body figure,html body main.nwa:not(.ax) .nwa-body .nwa-grid,html body main.nwa:not(.ax) .nwa-body .nwa-ph{margin:2em 0!important;background:none!important;padding:0!important;border:0!important;box-shadow:none!important}
html body main.nwa:not(.ax) .nwa-body img{border-radius:12px}
html body main.nwa:not(.ax) .nwa-body figcaption{font-size:14px;color:#6e6e73;margin-top:10px}
html body main.nwa:not(.ax) :is(.nw-stats,.nw-facts,.nwa-ev,.nwa-pts){background:none!important;box-shadow:none!important;border:0!important;padding:0!important}
html body main.nwa:not(.ax) .nwa-pts li:before{background:none!important;color:#0D3C87!important}
html body main.nwa:not(.ax) .nwa-rel{max-width:1040px;margin:clamp(56px,8vw,96px) auto 0!important;border:0!important;padding:0!important;background:none!important}
html body main.nwa:not(.ax) .nwa-rel h2{font-size:clamp(22px,2.4vw,28px)!important;margin:0 0 20px!important}
html body main.nwa:not(.ax) .nwa-rc{background:none!important;box-shadow:none!important;border:0!important;padding:0!important}
html body main.nwa:not(.ax) .nwa-rc .nw-im img{border-radius:12px}
html body main.nwa:not(.ax) .nwa-hd .nw-meta :is(time,span)::before,html body main.nwa:not(.ax) .nwa-hd .nw-meta::before{content:none!important;display:none!important}

html body main.nwa:not(.ax) .nwa-hd .nw-meta :is(time,span)::before,html body main.nwa:not(.ax) .nwa-hd .nw-meta::before{content:none!important;display:none!important}
/* the Partners home section after the band has its own fill, so it keeps its inner padding */

/* 5. Every moving band keeps clear space above and below, including the Partners home band before the closing card */
html body.gpv .mq2:not(#_){margin:var(--bandgap) 0!important}
html body.gpv :is(section,div):has(+ .mq2){margin-bottom:0!important}
html body.gpv .mq2 + *{margin-top:0!important}

/* 6. Rows of identical cards get distinct faint fills in turn: rose, blue, yellow, green */
html body .ways>.wc:nth-child(4n+1):not(#_){background-color:#FBE7E6!important}
html body .ways>.wc:nth-child(4n+2):not(#_){background-color:#EAF0FA!important}
html body .ways>.wc:nth-child(4n+3):not(#_){background-color:#FFF3D1!important}
html body .ways>.wc:nth-child(4n):not(#_){background-color:#E5F3EA!important}
html body .ways>.wc:not(#_){box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)!important}

/* 7. Sauder LIFT phases are information, not buttons: flat numbered rows, no fill, no box, no hover */
html body .ph>div:not(#_){background:none!important;box-shadow:none!important;border:0!important;border-top:1px solid rgba(0,0,0,.12)!important;border-radius:0!important;padding:12px 0 4px!important;transform:none!important;cursor:default}
html body .ph>div:not(#_):hover{background:none!important;box-shadow:none!important;transform:none!important}

/* 8. No shadows on buttons anywhere */
html body :is(.btn,a.btn,button,.sp-btn,[class*="btn"]):not(#_),html body :is(.btn,a.btn,button,.sp-btn,[class*="btn"]):not(#_):hover{box-shadow:none!important}

/* 9. Partners stat chips and Adopt a Lab steps: distinct faint fills in turn */
html body .chips>.chip:nth-child(4n+1):not(#_),html body .steps4>li:nth-child(4n+1):not(#_){background-color:#FBE7E6!important}
html body .chips>.chip:nth-child(4n+2):not(#_),html body .steps4>li:nth-child(4n+2):not(#_){background-color:#EAF0FA!important}
html body .chips>.chip:nth-child(4n+3):not(#_),html body .steps4>li:nth-child(4n+3):not(#_){background-color:#FFF3D1!important}
html body .chips>.chip:nth-child(4n):not(#_),html body .steps4>li:nth-child(4n):not(#_){background-color:#E5F3EA!important}

/* 10. Give on phones: the two-card "Other ways to give" row stacks, so nothing runs off the side */
@media(max-width:640px){html body .pr-grid.c2:not(#_){grid-template-columns:minmax(0,1fr)!important}html body .pr-kv:not(#_){grid-template-columns:minmax(0,1fr)!important}html body .pr-kv dd:not(#_){overflow-wrap:anywhere}}
/* the hero's own hairline would float above the band once the band has its gap, so drop it there */
html body :is(header,section):has(+ .mb3):not(#_){border-bottom:0!important}

/* no sideways scroll */
html,body{overflow-x:clip}
.mb3,.vb,.mq,.mq2{overflow:hidden}

/* Meet the leaders: transparent cards with a faint outline, labelled details as the original */
html body article.ldc:not(#_){background:transparent!important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)!important;border-radius:20px;height:100%}
html body article.ldc:not(#_) .ldc-i{background:transparent}
.ldg{align-items:stretch}
.ldc .ldc-l{flex:0 0 auto!important}
.ldc-d{margin:auto 0 0!important;padding:12px 0 0!important;border-top:1px solid rgba(22,35,58,.1);display:flex;flex-direction:column;gap:6px}
.ldc-b{display:flex;flex-direction:column}
.ldc .ldc-l{margin-bottom:14px!important}
.ldc-d>div{margin:0;font:400 12.5px/1.45 Inter,sans-serif;color:#4A5568}
.ldc-d dt{display:inline;font-weight:600;color:#16233A;margin:0}
.ldc-d dt::after{content:" "}
.ldc-d dd{display:inline;margin:0;overflow-wrap:anywhere}
@media(max-width:640px){.ldc-d>div{font-size:11.5px}}

/* v1021: shared heading scale, section rhythm, card padding, transparent tab tracks */
:root{--h1-hero:clamp(36px,4.4vw,56px);--h2-sec:clamp(26px,2.7vw,38px);--sec-pad:clamp(48px,5vw,72px);--card-pad:14px}
html body :is(body,main)>section h2:not(:is(footer,.rx-press,.nwa-body,.nc,.ev-c,.pb-c,.dp-card,.nw-sec,.nw-feat,.nw-more,.ax) h2):not(#_):not(#_){font-size:var(--h2-sec)!important;line-height:1.15!important}
html body .ab p:not(#_){font-size:18px!important;line-height:1.6!important}
html body :is(body,main)>section:has(h2):not(.hx,.gh,.vb,.mq,.mq2,.mb3,.band,.rx-press):not(#_){padding-top:var(--sec-pad)!important;padding-bottom:var(--sec-pad)!important;margin-top:0!important;margin-bottom:0!important}
html body .v7-tabs:not(#_){background:transparent!important;box-shadow:none!important;outline:1px solid rgba(0,0,0,.12);outline-offset:-1px}
html body :is(.nc,.ev-c,.pb-c):not(#_){padding:var(--card-pad)!important;display:flex!important;flex-direction:column;justify-content:flex-start}
html body .nc:not(#_) img{margin-bottom:var(--card-pad)!important}
html body .ev-b:not(#_){padding:var(--card-pad) 0 0!important;flex:1}
html body .pb-tx:not(#_)>*{margin-left:0!important;margin-right:0!important}
html body .pb-tx:not(#_)>.pk{margin-top:var(--card-pad)}
html body :is(.nc,.ev-c,.pb-c,.dp-card) h3:not(#_){display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
/* v1021: every moving band uses the home page band style (.vb on the TGLC home) */
html body :is(.mb3,.mq,.mq2):not(#_):not(#_){padding:22px 0!important}
html body :is(.mq,.mq2) .t:not(#_){gap:0!important;font:inherit!important}
html body :is(.mb3 .mb3-g>span,.mq .t>span,.mq2 .t>span):not(#_):not(#_){font:600 clamp(20px,3vw,32px)/1 "Plus Jakarta Sans",Inter,system-ui,sans-serif!important;letter-spacing:-.02em!important;padding:0 22px!important;gap:44px!important;display:flex!important;align-items:center!important;white-space:nowrap!important}
html body .mb3.mb3-s-dot .mb3-g>span:not(#_):not(#_)::after{content:""!important;width:10px!important;height:10px!important;border-radius:50%!important;margin:0!important;flex:none!important;font-size:0!important;background:currentColor!important;opacity:.55!important}
html body .mb3-y.mb3-s-dot .mb3-g>span:not(#_):not(#_)::after{background:#1F8A4C!important;opacity:.85!important}
html body :is(.mq,.mq2) .t>span:not(#_):not(#_){gap:0!important}
