/* Approved WF identity. Outlined lettering preserves the chosen artwork. */
.brand{gap:4px;color:var(--purple)}
.brand .brand-icon{width:64px;height:auto;flex:none}
.brand .brand-type{width:132px;height:auto;flex:none}
.footer .brand,.footer .brand-icon{color:#fff}
.theme-mini-nav .brand{gap:9px}
.theme-mini-nav .brand-icon{width:49px;height:auto}
.theme-mini-nav .brand-type{width:101px;height:auto}
.identity-symbol .brand-icon{width:min(100%,240px);height:auto}
/* More of the page in view: scale headings and spacing, preserve body readability. */
:root{--gutter:clamp(22px,4.2vw,64px)}
html{scroll-padding-top:88px}
.wrap{max-width:1480px}
.nav{height:76px;gap:28px}
.nav-links .nav-button{padding:11px 19px}
.palette-bar{padding-block:7px;gap:10px 20px}
.palette-bar-label{font-size:10px}
.palette-button{min-height:32px;padding:6px 11px;font-size:11px}
.palette-review-link{font-size:11px}
.hero{padding-top:34px}
.hero-top{grid-template-columns:1.5fr .8fr;gap:5vw;padding-bottom:30px;align-items:center}
.hero h1{font-size:clamp(62px,6.6vw,96px);line-height:.98;letter-spacing:-.06em}
.hero .eyebrow{margin-bottom:18px}
.hero-summary p{max-width:365px;margin-bottom:18px;font-size:14px}
.hero-summary .stamp-line{margin-top:16px;font-size:9px}
.hero .hero-picture{max-width:1200px;margin-inline:auto}
.hero h1 .highlight:after{height:6px}
.btn{padding:13px 22px;min-height:46px;gap:28px}
.values-strip{padding-block:18px;font-size:clamp(16px,1.4vw,21px)}
.values-strip svg{width:18px;height:18px}
.section{padding-block:76px}
h1{font-size:clamp(52px,6.2vw,90px)}
h2{font-size:clamp(36px,3.8vw,57px)}
.priority-heading h2,.mission h2,.pillar-lead h2,.spotlight h2,.blood-band h2,.accountability h2{font-size:clamp(36px,3.8vw,56px)}
.priority-heading,.section-heading{margin-bottom:32px}
.eyebrow{margin-bottom:19px}
.priority-card{padding:29px}
.priority-card .eyebrow{margin-bottom:22px}
.priority-card h3{font-size:clamp(30px,2.8vw,42px);margin-bottom:17px}
.priority-card p{margin-bottom:22px}
.work-row{padding-block:27px}
.work-row h3{font-size:clamp(27px,2.7vw,39px)}
.spotlight .copy{padding-block:40px}
.spotlight p{margin:21px 0 25px}
.drop-art{width:135px}
.campaign-card{min-height:340px;padding:25px}
.campaign-card h3{font-size:32px;margin-bottom:17px}
.campaign-card-top{margin-bottom:22px}
.campaign-card .campaign-no{font-size:38px}
.campaign-meta{margin-bottom:21px}
.vision-title{padding-block:44px}
.vision img{height:440px}
.join{padding-block:52px}
.join h2{font-size:clamp(39px,4.4vw,66px)}
.footer{padding-top:46px}
.footer-grid{padding-bottom:36px;gap:35px}
.footer-word{font-size:clamp(62px,11vw,170px)}
.page-hero{padding-block:38px 46px}
.page-hero .deck{font-size:17px;margin-top:23px}
.crumb{margin-bottom:22px}
.prose h2{font-size:35px}
.content-grid{gap:6vw}
.identity-symbol{min-height:230px}
.theme-mini-hero h3{font-size:clamp(30px,3.1vw,45px)}
@media(max-width:1100px){
 .hero-top{grid-template-columns:1.45fr .9fr;gap:32px}
 .hero h1{font-size:clamp(57px,6.6vw,73px)}
 .nav-links{gap:19px}
 .brand .brand-icon{width:58px}.brand .brand-type{width:120px}
}
@media(max-width:850px){
 .nav{height:72px}.nav-links{top:72px}
 .hero-top{grid-template-columns:1fr;gap:23px}
 .hero h1{font-size:clamp(55px,8.8vw,73px)}
 .hero-summary p{margin:0;max-width:440px}
 .hero-summary{gap:24px}
 .section{padding-block:60px}
 .page-hero h1{font-size:clamp(48px,7.6vw,65px)}
 .campaign-card{min-height:320px}
 .vision-title h2{font-size:42px}.vision img{height:360px}
 .theme-mini-nav{padding:18px}
 .theme-mini-nav .brand-icon{width:43px}.theme-mini-nav .brand-type{width:94px}
}
@media(max-width:600px){
 .nav{height:68px}.nav-links{top:68px}
 .brand{gap:3px}.brand .brand-icon{width:53px}.brand .brand-type{width:112px}
 .palette-bar{gap:9px;padding-block:9px}
 .palette-bar-label{width:auto;font-size:9px}
 .palette-buttons{gap:8px}.palette-button{min-height:36px;padding:6px 10px;font-size:10px}
 .palette-review-link{font-size:10px}
 .hero{padding-top:27px}.hero-top{padding-bottom:27px;gap:22px}
 .hero h1{font-size:clamp(38px,11.5vw,64px)}
 .hero .eyebrow{font-size:8px;letter-spacing:.065em;line-height:1.6}
 .hero-summary p{margin-bottom:19px;font-size:14px}
 .hero .hero-picture{max-width:none}
 .values-strip{padding-block:16px;font-size:15px;gap:13px}
 .section{padding-block:48px}
 h2,.priority-heading h2,.mission h2,.pillar-lead h2,.spotlight h2,.blood-band h2,.accountability h2{font-size:35px}
 .priority-card{padding:25px}.priority-card h3{font-size:31px}
 .priority-card p{font-size:14px}.priority-note{font-size:12px}
 .section-heading{gap:21px;margin-bottom:27px}
 .work-row{padding-block:23px}.work-row h3{font-size:28px}
 .spotlight .copy{padding:36px var(--gutter)}
 .drop-art{width:70px}
 .campaign-card,.campaign-card:last-child:nth-child(3){min-height:320px;padding:25px}
 .campaign-card h3{font-size:33px}.campaign-card p{font-size:14px}
 .vision-title{padding-block:35px}.vision-title h2{font-size:35px}.vision img{height:300px}
 .join{padding-block:40px}.join h2{font-size:39px}
 .footer-grid{gap:30px 22px}.footer-word{font-size:15vw}
 .page-hero{padding-block:29px 36px}.page-hero h1{font-size:clamp(35px,10.4vw,51px)}
 .page-hero .deck{font-size:15px}.prose h2{font-size:30px}
 .identity-symbol{min-height:180px}.identity-symbol .brand-icon{width:205px;height:auto}
 .theme-mini-nav .brand-icon{width:43px}.theme-mini-nav .brand-type{width:94px}
 .theme-mini-nav>span{font-size:7px}.theme-mini-hero h3{font-size:36px}
}
/* Two-tone WF mark: teal W, violet F. Single colour on dark backgrounds. */
:root{--mark-accent:#5730c7}
.brand .mark-accent{fill:var(--mark-accent)}
.footer .brand .mark-accent{fill:currentColor}
/* Violet accent from the WF mark: borders, markers and highlights only. Teal stays the primary colour. */
:root{--violet:#5730c7;--violet-soft:#e9e3fb;--focus:#5730c7}
.eyebrow:before{background:var(--violet)}
.text-link{border-bottom:2px solid var(--violet)}
.nav-links>a[aria-current=page]{box-shadow:inset 0 -2px 0 var(--violet)}
.values-strip svg{color:var(--violet)}
.callout{border-top-color:var(--violet)}
.principle-row span,.faq summary:after{color:var(--violet)}
.principle-list,.principle-row{border-color:var(--violet-soft)}
.prose blockquote{box-shadow:inset 0 0 0 1.5px var(--violet-soft)}
::selection{background:var(--violet-soft);color:var(--ink)}
/* Keep the bottom of FOUNDATION from being clipped at small sizes. */
.brand svg{overflow:visible}