/* Compact navigation, community carousels and centre directory. */
:root{--radius:18px}
body{font-size:15px}
header,body:has(.hero) header{margin:0 2.3% 8px;padding:9px 20px;border-radius:18px;gap:14px}
.brand .emblem{width:42px;height:42px}
nav{gap:18px}
nav a{font-size:12px}
.topline{padding-top:7px;padding-bottom:7px}
.centre-nav{position:static;box-shadow:none;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px 22px;margin:0 2.3% 12px;padding:10px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.centre-nav>span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.centre-nav a{font-size:13px;font-weight:650;color:var(--purple)}
.centre-nav a:hover{text-decoration:underline}
.social-rail{position:fixed;right:0;top:45%;z-index:30;padding:7px;background:var(--purple);color:white;border-radius:12px 0 0 12px;box-shadow:0 3px 14px #20173024}
.facebook-link{display:flex;align-items:center;gap:9px;font-size:13px}
.facebook-link svg{width:24px;height:24px;flex:none}
.social-rail .facebook-link{min-width:28px;min-height:32px;justify-content:center}
.social-rail span{display:none}
.help-card .facebook-link{margin:12px 0}
.article-carousel{margin:0 2.3% 12px;min-width:0}
.article-carousel:has(#articles-bottom){margin-top:12px}
.carousel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;font-size:11px;letter-spacing:.03em;color:var(--muted)}
.carousel-heading>div{display:flex;align-items:center;gap:6px}
.carousel-heading button{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:50%;width:28px;height:28px;display:grid;place-items:center;padding:0;font-size:14px}
.carousel-heading button:disabled{opacity:.35;cursor:default}
.carousel-position{font-size:10px;margin-right:5px}
.article-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--line) transparent;padding:2px 0 7px}
.article-tile{flex:0 0 calc((100% - 30px)/4);min-width:0;position:relative;scroll-snap-align:start;border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:10px 26px 10px 13px;min-height:86px;display:flex;flex-direction:column;justify-content:center;transition:background .2s}
.article-tile:nth-child(4n+1){background:#eee7f8}.article-tile:nth-child(4n+2){background:#edf3df}.article-tile:nth-child(4n+3){background:#f4eae0}.article-tile:nth-child(4n){background:#e7e4f4}
.article-tile small{font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);margin-bottom:4px}
.article-tile strong{font-size:12px;line-height:1.4;font-weight:550}
.article-tile>span{position:absolute;right:11px;top:12px;color:var(--purple)}
.section,body:has(.hero) .section{margin:36px 6%}
h2{font-size:clamp(29px,3vw,43px)}
.section-head{margin-bottom:20px}
.card,.feature,.report-banner,.panel,.social-grid a{border-radius:16px}
.cards,.social-grid{gap:16px}
.card>div,body:has(.hero) .card>div{padding:18px}
.card h3{font-size:22px}
.card>img,body:has(.hero) .card>img{height:180px}
.button{padding:11px 19px}
.help-card{padding:22px;border-radius:16px}
.help-card h2{font-size:27px}
.feature-photo,body:has(.hero) .feature-photo{min-height:320px}
.page-hero{min-height:280px;border-radius:18px}
.page-hero h1{font-size:clamp(34px,4vw,58px)}
footer{padding-top:35px}.footer-top{padding-bottom:28px}.footer-grid{padding-top:28px;padding-bottom:28px}
.centre-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.centre-card{padding:22px;background:var(--panel);border:1px solid var(--line)}
.centre-card h3{font-size:23px;color:var(--purple);margin-bottom:12px}.centre-card p{font-size:13px;margin-bottom:14px}.centre-card>span{font-size:12px}
.centre-note{font-size:12px;margin:14px 0 0}
.home-resources{display:grid;grid-template-columns:1fr 1fr;gap:8%;padding:28px 0;border-top:1px solid var(--line)}
.home-resources p{font-size:14px}.resource-links{display:grid;align-content:start}.resource-links a{padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.resource-links a:hover{color:var(--purple)}
[data-theme=dark] .article-tile:nth-child(4n+1),[data-theme=dark] .article-tile:nth-child(4n){background:#362849}
[data-theme=dark] .article-tile:nth-child(4n+2){background:#2e3926}
[data-theme=dark] .article-tile:nth-child(4n+3){background:#3c302a}
[data-theme=dark] .social-rail{background:#614c94}
@media(min-width:941px){.hero{height:460px;min-height:460px;max-height:460px}.hero-copy{top:30px}.hero h1{font-size:clamp(42px,4.4vw,61px)}}
@media(max-width:940px){nav a{font-size:15px}.article-tile{flex-basis:calc((100% - 10px)/2)}.centre-nav{gap:8px 16px}.centre-nav a{font-size:12px}.centre-nav>span{width:100%;text-align:center}}
@media(max-width:640px){header,body:has(.hero) header{padding:9px 12px;margin:0 3% 8px;gap:8px}.brand .emblem{width:34px;height:34px}.centre-nav{margin:0 3% 10px;gap:7px 14px;padding:9px}.centre-nav a{font-size:11px}.article-carousel{margin-left:3%;margin-right:3%}.article-tile{flex-basis:78%;min-height:76px}.carousel-heading{font-size:10px}.carousel-position{display:none}.social-rail{top:auto;bottom:24px;padding:5px}.social-rail .facebook-link{min-width:30px;min-height:34px}.section,body:has(.hero) .section{margin:30px 6%}.centre-grid,.home-resources{grid-template-columns:1fr;gap:16px}.centre-card{padding:18px}.centre-card h3{font-size:22px}.feature-photo,body:has(.hero) .feature-photo{min-height:0}.card>img,body:has(.hero) .card>img{height:200px}.home-resources{padding:22px 0}.hero{height:455px;min-height:455px;max-height:455px}.hero-copy{top:25px}.hero .eyebrow{margin-bottom:12px}.hero .buttons{gap:12px}}
/* Compact image-led article strips and tighter page rhythm. */
.article-track{gap:8px;padding-bottom:4px}.article-tile{flex-basis:calc((100% - 24px)/4);min-height:64px;height:64px;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px;padding:6px 22px 6px 6px;border-radius:11px}.article-tile>img{width:50px;height:50px;flex:none;object-fit:cover;border-radius:7px}.article-copy{min-width:0}.article-tile small{display:block;font-size:8px;letter-spacing:.07em;margin-bottom:3px}.article-tile strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:11px;line-height:1.35}.article-tile>span{right:8px;top:8px;font-size:13px}.carousel-heading{margin-bottom:3px;font-size:10px}.carousel-heading button{width:25px;height:25px}.article-carousel{margin-bottom:8px}.article-carousel:has(#articles-bottom){margin-top:8px}.section,body:has(.hero) .section{margin-top:28px;margin-bottom:28px}.section-head{margin-bottom:16px}.cards,.social-grid{gap:12px}.card>img,body:has(.hero) .card>img{height:155px}.card>div,body:has(.hero) .card>div{padding:16px}.card h3{font-size:21px;margin-bottom:8px}.card p{font-size:12px}.feature-photo,body:has(.hero) .feature-photo{min-height:280px}.feature-copy,body:has(.hero) .feature-copy{padding-top:25px;padding-bottom:25px}.centre-card{padding:18px}.centre-card h3{font-size:21px}.centre-card p{margin-bottom:10px}.home-resources{padding-top:20px;padding-bottom:20px}.impact{padding:14px 0}.impact strong{font-size:28px}.report-banner>div,body:has(.hero) .report-banner>div{padding:28px}.social-grid img,body:has(.hero) .social-grid img{height:185px}.footer-top h2{font-size:32px}.footer-top{padding-bottom:22px}footer{padding-top:28px}.footer-grid{padding-top:22px;padding-bottom:22px}header,body:has(.hero) header{padding-top:7px;padding-bottom:7px}.centre-nav{padding-top:8px;padding-bottom:8px;margin-bottom:8px}
@media(min-width:941px){.hero{height:415px;min-height:415px;max-height:415px}.hero-copy{top:25px}.hero h1{font-size:clamp(40px,4vw,56px);margin-bottom:14px}.hero .eyebrow{margin-bottom:12px}.hero .buttons{margin-top:15px}.hero-foot{bottom:17px}}
@media(max-width:940px){.article-tile{flex-basis:calc((100% - 8px)/2)}}
@media(max-width:640px){.article-tile{flex-basis:85%;height:62px;min-height:62px}.article-tile>img{width:48px;height:48px}.hero{height:430px;min-height:430px;max-height:430px}.hero-copy{top:23px}.hero .eyebrow{min-height:22px;margin-bottom:10px}.hero h1{margin-bottom:12px}.hero p{height:100px}.hero .buttons{margin-top:12px}.section,body:has(.hero) .section{margin-top:24px;margin-bottom:24px}.card>img,body:has(.hero) .card>img{height:170px}.feature-photo,body:has(.hero) .feature-photo{min-height:0;height:200px}.social-grid img,body:has(.hero) .social-grid img{height:200px}.centre-card{padding:16px}.centre-nav{padding:8px}.feature-copy,body:has(.hero) .feature-copy,body:has(.hero) .report-banner>div{padding:22px}}
@media(max-width:360px){.hero p{height:119px}}