/* YSD 2026 · Stage 03 base design. Edit these shared tokens in Pinegrow.
   Pillar accent assignments are proposed design choices, not official identities. */
:root{--orange:#F36B23;--yellow:#FEE800;--green:#4CB748;--pink:#EF3867;--ink:#202823;--muted:#59615c;--line:#d8ddd8;--soft:#f5f7f5;--paper:#fff;--placeholder:#f1f3f0;--accent:var(--orange);--heading-font:'Outfit',sans-serif;--body-font:'Noto Sans',sans-serif}
body{font-family:var(--body-font);color:var(--ink);line-height:1.75}h1,h2,h3,.stat strong,.brand,.next-chapter strong{font-family:var(--heading-font)}h1{font-weight:600;letter-spacing:-.045em;line-height:1.05}h2{font-weight:500;letter-spacing:-.035em;line-height:1.13}h3{font-weight:500;letter-spacing:-.025em;line-height:1.25}.lead{color:var(--muted);line-height:1.75}.eyebrow{letter-spacing:.13em;font-size:.78rem;color:var(--ink)}.eyebrow:before{content:'';display:inline-block;width:18px;height:4px;background:var(--accent);vertical-align:middle;margin-right:10px}.small,.note{color:#59615c}.note{border-color:#aaa;font-size:.8rem}.draft-bar{background:#f3f5f2;color:#4b564f;border:0;font-weight:500}.draft-bar .container{padding-block:8px}.site-header{border-bottom:1px solid #e1e5e0}.header-inner{padding-block:22px}.brand{font-size:.88rem;line-height:1.2}.logo-box{background:var(--ink);border-radius:13px 13px 13px 0;border-bottom:4px solid var(--orange);font-size:1rem;letter-spacing:.02em}.brand b{font-weight:600}nav#site-nav{font-size:.77rem;gap:19px}nav#site-nav>a[aria-current=page]{text-decoration-color:var(--orange);text-decoration-thickness:3px}.nav-download{border:1px solid var(--ink);border-radius:30px;padding:11px 16px;font-weight:600}.nav-download:hover{background:var(--yellow);text-decoration:none}.impact-menu>div{border-color:var(--line);border-radius:12px;box-shadow:0 16px 32px #20282312}.impact-menu>div>a{border-radius:5px}.impact-menu>div>a:hover{background:#fff8d3}.impact-menu a[aria-current=page]{font-weight:600;text-decoration:underline;text-decoration-color:var(--orange)}.menu-toggle{border-color:#b8c1b8;border-radius:30px;padding:8px 17px}.hero{padding-block:82px 74px;gap:52px;position:relative}.hero h1{font-size:clamp(3rem,4.9vw,4.9rem);color:var(--ink)}.hero h1 span{color:var(--orange)}.hero .lead{font-size:1.13rem;max-width:440px}.hero-image{border-radius:140px 140px 18px 18px;min-height:480px}.placeholder{background:var(--placeholder);border:1px dashed #b6bfb5;border-radius:14px;color:#5a645d}.placeholder:before,.placeholder:after{background:#d9dfd7}.placeholder>span{background:#f1f3f0eb;color:#606b62;border-radius:4px;font-family:var(--body-font);font-size:.78rem}.placeholder i{color:#69786b}.hero-image>span{max-width:70%}.hero-image{border-radius:140px 140px 18px 18px}.button{font-family:var(--body-font);border-radius:30px;background:var(--yellow);border:1px solid var(--yellow);color:var(--ink);font-weight:600;padding:16px 23px;transition:background .16s,transform .16s}.button:hover{background:#f3dc00;color:var(--ink);transform:translateY(-2px)}.button span{font-size:1.1rem;line-height:1}.button.secondary{background:white;border-color:#a8b2a8;color:var(--ink)}.button.secondary:hover{background:#f1f5ee}.button:disabled,.button:disabled:hover{background:#e4e8df;color:#586253;border-color:#bcc6b6;transform:none}.overview{border:0;position:relative;background:#f7f9f4;padding:34px 38px 30px;border-radius:18px}.overview:before{content:'';position:absolute;top:0;left:30px;right:30px;height:5px;background:linear-gradient(to right,var(--orange) 0 25%,var(--yellow) 25% 50%,var(--green) 50% 75%,var(--pink) 75% 100%);border-radius:0 0 5px 5px}.stat{border-color:#d3dbcf}.stat strong{font-weight:500;letter-spacing:-.045em;color:var(--ink)}.stat span{color:var(--muted)}.overview .stat strong{font-size:clamp(2.4rem,4.2vw,3.7rem)}.section{padding-block:96px}.purpose .lead{font-size:1.3rem}.soft{background:#f5f8f3}.pillar-grid{gap:16px;border:0}.pillar-card{border:1px solid #d6dfd2;border-top:5px solid var(--orange);border-radius:12px;padding:28px 20px;transition:transform .2s,background .2s;min-height:265px}.pillar-card:nth-child(2){border-top-color:var(--yellow)}.pillar-card:nth-child(3){border-top-color:var(--green)}.pillar-card:nth-child(4){border-top-color:var(--pink)}.pillar-card:nth-child(5){border-top-color:var(--orange)}.pillar-card:hover{background:#fff;transform:translateY(-5px);box-shadow:0 9px 25px #2030200a}.card-number{color:#5b685d;font-size:.75rem}.pillar-card h3{font-size:1.35rem}.pillar-card p{font-size:.8rem;color:var(--muted)}.card-arrow{width:32px;height:32px;background:#f0f4ec;color:var(--ink);border-radius:50%;display:grid;place-items:center;font-size:1.1rem}.feature-split h2{max-width:450px}.text-link{border-color:var(--green);border-bottom-width:3px;font-weight:500}.feature-card{border-color:#d6dfd2;border-radius:16px;overflow:hidden}.feature-card>.placeholder{border:0;border-radius:0;background:#f1f3f0}.feature-card>div:not(.placeholder){padding:30px}.feature-card h3{font-size:1.6rem}.feature-card h3 span{color:var(--ink);background:var(--yellow);border-radius:50%;height:32px;min-width:32px;display:grid;place-items:center;font-size:1.15rem}.download-band{background:#e9f5e4;border:0;position:relative}.download-band:after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(to right,var(--orange) 0 25%,var(--yellow) 25% 50%,var(--green) 50% 75%,var(--pink) 75% 100%)}.download-inner .eyebrow:before{background:var(--green)}.download-inner h2{font-size:clamp(2rem,3.6vw,3.4rem)}body>footer{padding-top:48px}.footer-top>p{font-family:var(--heading-font);font-size:1.35rem;letter-spacing:-.025em}.footer-bottom{border-color:#d6dfd2;color:#667062}.page-intro{padding-block:32px 60px}.page-intro h1{max-width:1000px}.breadcrumb{color:#5a665c}.breadcrumb a{border-bottom:2px solid var(--accent)}.chapter-image{border-radius:24px;min-height:430px}.chapter-nav{border-color:#d6dfd2;font-size:.86rem}.chapter-nav a:hover{text-decoration-color:var(--accent);text-decoration-thickness:3px}.story-layout aside h2{font-size:2.8rem}.story-copy h3{font-size:1.6rem}.gallery .placeholder{border-radius:16px}.quote-section{background:#fff3f6;position:relative}.quote-section:before{content:'';position:absolute;left:0;top:0;height:100%;width:5px;background:var(--pink)}blockquote>p{font-family:var(--heading-font);font-weight:400;font-size:clamp(1.65rem,2.5vw,2.3rem);line-height:1.45;color:#34302f;letter-spacing:-.02em}blockquote footer{font-size:.85rem;color:#635960}.sdg-list{gap:12px}.sdg-list li{border-color:#d2decf;border-left:4px solid var(--green);border-radius:0 8px 8px 0;background:#f6f9f3;padding:14px 18px}.next-chapter{border-color:#d6dfd2}.next-chapter strong{font-size:1.55rem;font-weight:500}.next-chapter span{color:#64705f}.person .placeholder{border-radius:80px 80px 12px 12px}.person h3{font-weight:500}.person p{color:var(--muted)}.team-list{border-color:#d3ddce}.team-list>details{border-color:#d3ddce}.team-list summary{font-family:var(--heading-font);font-weight:500;font-size:1.35rem;padding:25px 10px}.team-list>details[open] summary{color:#285b27}.team-detail{padding:15px 10px 35px}.category-list li{border-color:#d3ddce}.category-list li:before{content:'';display:inline-block;height:9px;width:9px;border-radius:50%;margin-right:12px;background:var(--orange)}.category-list li:nth-child(2):before{background:var(--pink)}.category-list li:nth-child(3):before{background:var(--yellow)}.category-list li:nth-child(4):before{background:var(--green)}.category-list li:nth-child(5):before{background:var(--pink)}.category-list li:nth-child(6):before{background:var(--green)}table{font-size:.85rem}thead{background:#edf4e8}th,td{border-color:#d8e0d3;padding-block:20px}td{color:#5f6c5a}.table-scroll{border:1px solid #d8e0d3;border-radius:12px;padding:18px}caption{color:#59615c}.skip-link{border:2px solid var(--ink);border-radius:6px}a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
body[data-page='education']{--accent:var(--pink)}body[data-page='community-health']{--accent:var(--yellow)}body[data-page='environment']{--accent:var(--green)}body[data-page='arts-culture']{--accent:var(--pink)}body[data-page='sports']{--accent:var(--green)}
@media(max-width:1200px){nav#site-nav{gap:12px;font-size:.72rem}.nav-download{padding:10px 12px}.hero{gap:36px}.pillar-card{padding:25px 16px}.pillar-card h3{font-size:1.2rem}}
@media(max-width:1100px){.menu-toggle{display:block!important}.header-inner{flex-wrap:wrap}.js nav#site-nav:not(.is-open){display:none}nav#site-nav{width:100%;flex-direction:column;align-items:stretch;gap:0;font-size:.9rem}nav#site-nav>a,.impact-menu summary{padding:14px 0;border-bottom:1px solid #d6dfd2}.nav-download{margin-top:15px;padding:12px!important;text-align:center}.impact-menu>div{position:static;box-shadow:none;border:0;background:#f4f7f1;padding:10px}.hero h1{font-size:3.5rem}.hero-image{min-height:400px}.overview{padding-inline:30px}.pillar-grid{grid-template-columns:repeat(2,1fr)}.pillar-card:last-child{grid-column:1/-1;min-height:165px}.pillar-card{min-height:225px}.card-number{margin-bottom:28px}}
@media(max-width:600px){body{font-size:16px}.hero{padding-block:40px;gap:32px}.hero h1{font-size:2.95rem;line-height:1.05}.hero .lead{font-size:1.05rem}.hero-image{min-height:290px;border-radius:95px 95px 14px 14px}.button{font-size:.76rem;padding:14px 17px;gap:12px}.eyebrow{font-size:.68rem}.overview{padding:28px 22px}.overview:before{left:22px;right:22px}.overview .stat{grid-template-columns:1fr 1fr;gap:14px}.overview .stat strong{font-size:2.35rem}.overview .stat:last-child{grid-template-columns:1.2fr 1fr}.overview .stat:last-child strong{font-size:2.05rem}.section{padding-block:58px}.purpose .lead{font-size:1.12rem}.pillar-grid{gap:12px}.pillar-card{padding:20px 14px;min-height:225px}.pillar-card h3{font-size:1.22rem}.pillar-card p{font-size:.76rem}.section-heading h2,h2{font-size:2.2rem}.feature-card>div:not(.placeholder){padding:23px}.feature-card h3{font-size:1.4rem}.page-intro{padding-block:25px 40px}.page-intro h1{font-size:2.9rem}.chapter-image{min-height:265px;border-radius:15px}.chapter-nav{font-size:.79rem}.story-layout aside h2{font-size:2.2rem}.team-list summary{font-size:1.15rem}.person .placeholder{border-radius:55px 55px 10px 10px}.person h3{font-size:1.08rem;line-height:1.3}.person p{font-size:.77rem}.footer-top>p{font-size:1.1rem}.footer-bottom{font-size:.72rem}.next-chapter strong{font-size:1.3rem}.download-inner h2{font-size:2.35rem}.table-scroll{padding:12px}.placeholder>span{font-size:.72rem}}
@media(prefers-reduced-motion:reduce){.button,.pillar-card{transition:none}.button:hover,.pillar-card:hover{transform:none}}

/* Supplied YSD logo: original proportions and artwork preserved. */
.brand-logo{display:block;width:90px;height:auto;flex-shrink:0;object-fit:contain}.header-inner{padding-block:12px}.footer-top .brand-logo{width:100px}@media(max-width:600px){.brand-logo{width:76px}.header-inner{padding-block:10px}.footer-top .brand-logo{width:86px}}

/* Supplied homepage cover composition: preserve complete artwork without cropping. */
.hero-composition{width:100%;min-width:0;align-self:center}.hero-composition img{display:block;width:100%;height:auto;object-fit:contain;border:0;border-radius:0}@media(max-width:600px){.hero-composition{margin-top:4px}}
/* Larger cover composition, with more of the desktop hero allocated to artwork. */
.hero{grid-template-columns:.85fr 1.15fr;gap:32px;padding-block:54px}
@media(min-width:1101px){.hero-composition{width:calc(100% + 55px);margin-right:-55px}}
@media(min-width:601px) and (max-width:1100px){.hero{grid-template-columns:.85fr 1.15fr;gap:24px;padding-block:48px}}
@media(max-width:600px){.hero{grid-template-columns:1fr;gap:26px;padding-block:36px}.hero-composition{width:calc(100% + 24px);margin-left:-12px;margin-right:-12px}}
/* Our Impact: pillar accents follow the Gentle Echo gradient families. */
#our-impact .pillar-card{--pillar-start:#FEE800;--pillar-middle:#BFD82D;--pillar-end:#70C92F;--pillar-tint:#f5fae9;border-top:1px solid #d6dfd2;position:relative;overflow:hidden;padding-top:32px;background:linear-gradient(180deg,var(--pillar-tint),#fff 70%)}
#our-impact .pillar-card::before{content:'';position:absolute;top:0;left:0;right:0;height:7px;background:linear-gradient(110deg,var(--pillar-start),var(--pillar-middle),var(--pillar-end))}
#our-impact .pillar-card::after{content:'';position:absolute;top:0;left:0;right:0;height:7px;pointer-events:none;opacity:.3;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='32'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='white' filter='url(%23n)' d='M0 0h160v32H0z'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
#our-impact .pillar-card:nth-child(2){--pillar-start:#56BFC7;--pillar-middle:#B7DFB0;--pillar-end:#E7F29B;--pillar-tint:#edf8f4}
#our-impact .pillar-card:nth-child(3){--pillar-start:#FEE800;--pillar-middle:#BFD82D;--pillar-end:#70C92F;--pillar-tint:#f5fae9}
#our-impact .pillar-card:nth-child(4){--pillar-start:#AB70B1;--pillar-middle:#D85A97;--pillar-end:#EF3867;--pillar-tint:#fcf0f7}
#our-impact .pillar-card:nth-child(5){--pillar-start:#FEE800;--pillar-middle:#BFD82D;--pillar-end:#70C92F;--pillar-tint:#f5fae9}
#our-impact .pillar-card .card-arrow{background:linear-gradient(135deg,var(--pillar-start),var(--pillar-middle),var(--pillar-end));color:#202823}
#our-impact .pillar-card:hover{background:linear-gradient(180deg,var(--pillar-tint),#fff 95%);border-color:#b8c4b3}
@media(max-width:600px){#our-impact .pillar-card{padding-top:27px}}

/* Homepage volunteer and SDG sections. */
.sdg-connections-label{font-size:.85rem;font-weight:600;margin-top:26px;margin-bottom:12px}.sdg-pillar-links{display:flex;flex-wrap:wrap;gap:10px 20px}.sdg-pillar-links a{font-size:.85rem;min-height:44px;display:inline-flex;align-items:center;gap:10px;border-bottom:2px solid var(--green);padding:8px 0}.sdg-pillar-links a:hover{border-color:var(--orange)}#employee-volunteer-programmes .feature-image{min-height:420px}@media(max-width:600px){#employee-volunteer-programmes .feature-image{min-height:290px}.sdg-pillar-links{gap:8px 18px}}
/* SDG connections: compact, tactile pillar buttons. */
main .sdg-pillar-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:560px}
main .sdg-pillar-links a{--sdg-a:var(--yellow);--sdg-b:var(--orange);display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 18px;min-height:54px;border:1px solid color-mix(in srgb,var(--sdg-b) 28%,white);border-radius:16px;background-image:var(--grain),linear-gradient(120deg,color-mix(in srgb,var(--sdg-a) 20%,white),color-mix(in srgb,var(--sdg-b) 12%,white));background-size:160px 160px,100% 100%;color:#252525;font-size:.85rem;font-weight:600;line-height:1.4;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
main .sdg-pillar-links a:nth-child(2){--sdg-a:var(--green);--sdg-b:var(--yellow)}
main .sdg-pillar-links a:nth-child(3){--sdg-a:var(--yellow);--sdg-b:var(--green)}
main .sdg-pillar-links a:nth-child(4){--sdg-a:var(--pink);--sdg-b:var(--orange)}
main .sdg-pillar-links a:nth-child(5){--sdg-a:var(--green);--sdg-b:var(--yellow);grid-column:1/-1}
main .sdg-pillar-links a>span{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;border-radius:50%;background-image:var(--grain),linear-gradient(135deg,var(--sdg-a),var(--sdg-b));background-size:160px 160px,100% 100%;font-size:1rem;font-weight:400}
main .sdg-pillar-links a:is(:hover,:focus-visible){text-decoration:none;border-color:var(--sdg-b);transform:translateY(-2px);box-shadow:0 5px 14px #2028230b}
@media(max-width:600px){main .sdg-pillar-links{grid-template-columns:1fr}main .sdg-pillar-links a:nth-child(5){grid-column:auto}main .sdg-pillar-links a{padding:13px 17px}}
@media(prefers-reduced-motion:reduce){main .sdg-pillar-links a{transition:none}main .sdg-pillar-links a:is(:hover,:focus-visible){transform:none}}
body.motion-paused main .sdg-pillar-links a{transition:none;transform:none}