:root{
  --yellow:#FFE600; --yellow-strong:#FACC15; --cyan:#28B6D7; --teal:#00A8CC;
  --marine:#0A3B52; --ink:#0F172A; --muted:#64748B; --surface:#F8FAFC; --cream:#FFFBEA;
  --line:#D9E2EA; --white:#fff; --radius:22px; --container:1180px;
  --heading: Georgia, "Times New Roman", serif; --body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--body);color:var(--ink);background:#fff;line-height:1.55}img{display:block;max-width:100%;width:100%;height:100%;object-fit:cover}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}
.container{width:min(calc(100% - 40px),var(--container));margin-inline:auto}.narrow{max-width:820px}.centered{text-align:center}.section-space{padding:72px 0}.section-block{padding:76px 0}.section-tint{background:#F4F8FB}.eyebrow{display:inline-block;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:800;color:#27816F;margin-bottom:10px}.eyebrow-light{color:#BFEDE4}
h1,h2,h3{margin:0 0 16px;line-height:1.05}h1,h2{font-family:var(--heading)}h1{font-size:clamp(3rem,6vw,5.5rem);letter-spacing:-.04em}h2{font-size:clamp(2rem,3.6vw,3.2rem)}h3{font-size:1.1rem}p{margin:0 0 16px;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 18px;border-radius:999px;border:1px solid transparent;font-weight:800;cursor:pointer;transition:.2s ease}.btn:hover{transform:translateY(-1px)}.btn-yellow{background:var(--yellow);color:#050505;box-shadow:0 10px 20px rgba(255,230,0,.18)}.btn-cyan{background:var(--cyan);color:#07364A}.btn-outline{background:#fff;border-color:#0F172A;color:#0F172A}.btn-full{width:100%}.cta-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.text-link{font-weight:800;font-size:.9rem;color:#0F6A57}

.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(15,23,42,.06)}.header-inner{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:8px}.brand-mark{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:var(--yellow);font-weight:900;color:var(--marine);font-size:.75rem}.brand-copy{font-size:.8rem;line-height:1.05;color:#0F172A}.brand-copy small{font-size:.65rem;color:#B12C3D}.brand-divider{height:42px;width:1px;background:#CBD5E1}.brand-org{font-family:var(--heading);font-size:.62rem;line-height:1.05;color:#B12C3D}.main-nav{display:flex;align-items:center;gap:26px;font-size:.92rem;font-weight:800}.main-nav>a,.nav-dropdown-trigger{position:relative;padding:34px 0;border:0;background:none;color:#111827;cursor:pointer}.main-nav>a.is-active:after,.nav-dropdown-trigger.is-active:after{content:"";position:absolute;left:0;right:0;bottom:25px;height:3px;background:var(--yellow)}.nav-dropdown{position:relative}.nav-dropdown-trigger{display:flex;align-items:center;gap:5px}.nav-dropdown-trigger svg{width:14px}.nav-dropdown-menu{position:absolute;top:76px;left:-14px;min-width:200px;padding:10px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 40px rgba(15,23,42,.12);opacity:0;pointer-events:none;transform:translateY(8px);transition:.18s}.nav-dropdown-menu a{display:block;padding:10px 12px;border-radius:10px;font-size:.83rem}.nav-dropdown-menu a:hover{background:var(--cream)}.nav-dropdown:hover .nav-dropdown-menu,.nav-dropdown.is-open .nav-dropdown-menu{opacity:1;pointer-events:auto;transform:none}.nav-donation{padding:9px 18px!important;background:var(--yellow);border-radius:999px}.nav-toggle{display:none;border:0;background:none;padding:8px}.nav-toggle span{display:block;width:24px;height:2px;background:#111;margin:5px 0}

.media-frame{overflow:hidden;border-radius:24px;background:var(--cream);min-height:260px}.media-frame-hero{min-height:520px}.page-hero,.hero-home{background:linear-gradient(180deg,#fff,#FBFEF9)}.hero-home-grid,.two-column-hero,.split-feature-grid,.featured-news-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}.hero-home-copy p,.two-column-hero p{max-width:620px}.highlight-text{background:var(--yellow);padding:0 .12em}.outlined-text{border:2px solid var(--ink);padding:.04em .12em;border-radius:6px}

.section-heading{margin-bottom:28px}.section-heading.centered{text-align:center}.section-heading-row{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.section-heading p{max-width:680px}.section-heading-sm{margin-top:36px}.card-grid{display:grid;gap:18px}.card-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.card-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.card-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.card-grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.program-card,.article-card,.info-card,.feature-card,.story-card,.publication-card,.ambassador-card,.testimonial-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}.program-card-body,.article-body{padding:16px}.program-card img,.article-card img{aspect-ratio:1/.82}.chip{display:inline-flex;padding:5px 9px;border-radius:999px;background:#EAF7F1;color:#23705D;font-size:.68rem;font-weight:800}.program-card h3,.article-card h3{margin-top:10px}.program-card p,.article-card p{font-size:.83rem}.card-link{font-size:.73rem;font-weight:800;color:#238467}.article-card{display:flex;flex-direction:column}.article-card .article-body{display:flex;flex-direction:column;gap:4px;flex:1}.article-card .text-link{margin-top:auto}

.impact-panel{background:var(--cyan);color:#fff;padding:62px 0}.impact-panel h2{color:#fff}.impact-highlight{background:var(--marine);border:1px solid #94DAD9;border-radius:24px;padding:20px 28px;font-family:var(--heading);font-size:clamp(1.5rem,3vw,2.4rem);display:flex;align-items:center;justify-content:space-between;gap:20px;margin:18px 0}.impact-highlight strong{font-size:clamp(3rem,6vw,5.4rem);color:var(--yellow);font-weight:500}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.stat-card,.large-stat{padding:20px;background:var(--marine);color:#fff;border-radius:18px}.stat-card strong,.large-stat strong{display:block;font-family:var(--heading);font-size:2.4rem;color:var(--yellow);line-height:1}.stat-card span,.large-stat span{display:block;font-size:.72rem;margin-top:8px;color:#D7EFF0}

.newsletter-strip{padding:18px 0}.newsletter-strip-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 28px;background:#EDF8F2;border-radius:18px}.inline-form{display:flex;gap:8px;width:min(100%,460px)}.inline-form input,.text-input,.copy-link-row input{width:100%;min-height:44px;border:1px solid var(--line);border-radius:12px;padding:0 14px;outline:none;background:#fff}.partner-wall .logo-grid,.logo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.logo-grid-large{grid-template-columns:repeat(4,minmax(0,1fr))}.logo-placeholder{min-height:86px;display:grid;place-items:center;border:1px dashed #B9C5CF;border-radius:14px;color:#82909D;font-weight:800;letter-spacing:.06em}

.cta-banner{padding:0 0 40px;background:#fff}.cta-banner-inner{background:var(--yellow);padding:38px 48px;border-radius:28px;display:flex;align-items:center;justify-content:space-between;gap:32px;position:relative;overflow:hidden}.cta-banner-inner:after{content:"";position:absolute;width:55%;height:60px;border-radius:50%;background:rgba(255,255,255,.5);right:-6%;bottom:-20px}.cta-banner-inner>*{position:relative;z-index:1}.cta-banner h2{font-size:2.4rem}.cta-banner p{max-width:620px;color:#111}.site-footer{background:var(--yellow);padding:54px 0 18px;position:relative;overflow:hidden}.site-footer:after{content:"";position:absolute;left:30%;right:-8%;bottom:-48px;height:110px;border-radius:50%;background:rgba(255,255,255,.46)}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:36px;position:relative;z-index:1}.footer-grid h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em}.footer-grid>a,.footer-grid div>a{display:block;font-size:.8rem;margin:8px 0}.footer-brand strong{font-size:1.2rem}.footer-brand span{display:block;font-size:.7rem}.footer-brand p{max-width:360px;color:#111;font-size:.82rem}.social-row{display:flex;gap:8px}.social-row a{width:30px;height:30px;border:1px solid #111;border-radius:50%;display:grid!important;place-items:center;font-size:.65rem!important}.footer-bottom{margin-top:34px;padding-top:18px;border-top:1px solid rgba(0,0,0,.15);display:flex;justify-content:space-between;gap:20px;font-size:.67rem;position:relative;z-index:1}

.vision-card{background:var(--yellow);border-radius:20px;padding:28px;text-align:center}.vision-card p{font-size:1.25rem;color:#111;margin:0}.info-card{padding:20px}.card-number{color:#B9A900;font-weight:900}.timeline-panel{background:var(--cyan);color:#fff}.timeline{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:22px 72px}.timeline:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:4px;background:#fff;transform:translateX(-50%);border-radius:4px}.timeline-item{background:var(--marine);padding:20px;border-radius:18px;position:relative}.timeline-item:after{content:"";position:absolute;top:50%;width:18px;height:18px;background:var(--yellow);border-radius:50%;right:-53px;transform:translateY(-50%)}.timeline-item:nth-child(even):after{left:-53px;right:auto}.timeline-item span{font-family:var(--heading);color:var(--yellow);font-size:2rem}.timeline-item p{color:#fff;margin:6px 0 0}

.ambassador-card{padding:16px;display:grid;grid-template-columns:150px 1fr;gap:20px}.ambassador-card .media-frame{min-height:180px}.story-card{padding:0 0 18px}.story-card h3,.story-card p,.story-card .text-link{margin-left:16px;margin-right:16px}.story-card img{aspect-ratio:1/.85;margin-bottom:14px}.dark-photo-banner{padding:90px 0;background:linear-gradient(rgba(10,59,82,.72),rgba(10,59,82,.72)),url('../images/placeholder.svg') center/cover;color:#fff}.dark-photo-banner h2{max-width:840px;color:#fff}

.publication-header{padding-bottom:38px}.featured-news-grid{background:#F3F8FB;border-radius:26px;padding:22px}.news-layout{display:grid;grid-template-columns:1fr 320px;gap:24px}.sidebar{display:grid;gap:16px}.sidebar-card,.sidebar-cta{padding:20px;border:1px solid var(--line);border-radius:20px;background:#fff}.sidebar-card a{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:12px 0;border-top:1px solid #EEF2F5}.sidebar-card span{width:30px;height:30px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;font-size:.68rem;font-weight:900}.sidebar-card strong{font-size:.76rem}.sidebar-cta{background:var(--marine);color:#fff}.sidebar-cta p{color:#D7EFF0}.archive-hero{padding-bottom:38px}.archive-hero-inner{background:#FFFDE4;border-radius:0;min-height:250px;padding:38px 42px;display:flex;justify-content:space-between;align-items:center;gap:24px}.illustration-placeholder{min-width:260px;min-height:160px;display:grid;place-items:center;color:#7E7E36;background:radial-gradient(circle at 30% 35%,#fff 0 12%,transparent 13%),#FFF3AE;border-radius:30px}.filter-bar{background:#FCFAF3;border-block:1px solid #F2EDDB}.filter-bar-inner{display:flex;gap:10px;padding:14px 0;flex-wrap:wrap}.filter-pill{border:1px solid var(--line);background:#fff;padding:7px 14px;border-radius:999px;font-size:.76rem;cursor:pointer}.filter-pill.is-active{background:#0F4A3A;color:#fff;border-color:#0F4A3A}.featured-publication{max-width:940px;margin:auto;padding:22px;background:#fff;box-shadow:0 18px 40px rgba(15,23,42,.12);border-radius:24px;display:grid;grid-template-columns:280px 1fr;gap:28px;align-items:center}.cover-placeholder{position:relative}.cover-placeholder span{position:absolute;left:18px;bottom:18px;background:#0A3B52;color:#fff;padding:8px 10px;border-radius:8px;font-size:.7rem}.publication-card{border:0;overflow:visible}.publication-card .media-frame{min-height:240px;margin-bottom:10px}.publication-card h3{margin:4px 0}.publication-card small{color:#7C8794}.publication-card p{font-size:.78rem}.publication-card.is-hidden{display:none}

.donation-hero{background:linear-gradient(120deg,#F2FBFA,#FFF8EC)}.donation-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;align-items:start;gap:28px;max-width:980px}.donation-card{padding:28px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 12px 40px rgba(15,23,42,.06)}.field-group{margin-top:22px}.field-group label{display:block;font-weight:800;font-size:.82rem;margin-bottom:8px}.segmented-control,.amount-grid,.payment-grid{display:grid;gap:10px}.segmented-control{grid-template-columns:1fr 1fr}.amount-grid{grid-template-columns:repeat(3,1fr)}.payment-grid{grid-template-columns:repeat(2,1fr)}.segmented-option,.amount-option,.payment-option{min-height:48px;border:1px solid var(--line);background:#fff;border-radius:10px;font-weight:800;cursor:pointer}.segmented-option.is-active,.amount-option.is-active,.payment-option.is-active{background:#E6F6FA;border-color:#8DD7E8}.amount-option{font-size:.82rem}.payment-option{padding:12px;text-align:left}.payment-option span{display:block;font-size:.7rem;color:#8A96A3;margin-top:3px;font-weight:500}.donation-summary-inline{padding:16px;margin-top:16px;background:#E9F7FA;border-radius:12px}.donation-summary-inline strong{display:block}.donation-summary-inline span{font-size:.73rem;color:#80919D}.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.checkout-summary{position:sticky;top:112px;padding:24px;background:var(--cyan);border-radius:24px;color:#07364A}.summary-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0}.summary-row strong{font-weight:800}.summary-total{display:flex;justify-content:space-between;font-size:1.1rem;margin-bottom:20px}.summary-total strong{font-size:1.8rem;color:#062E3A}.checkout-summary small{display:block;text-align:center;margin-top:10px;color:#83B7C1}.status-icon{width:58px;height:58px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:#E7F6EB;color:#1D8A4A;font-size:1.8rem}.receipt-card{max-width:520px;margin:28px auto 0;padding:26px;text-align:left;border-radius:24px;background:#fff;box-shadow:0 18px 48px rgba(15,23,42,.12)}.receipt-head{display:flex;justify-content:space-between}.status-badge{background:#E7F6EB;color:#1D8A4A;padding:5px 9px;border-radius:999px;font-size:.72rem;font-weight:800}.receipt-amount{font-family:var(--heading);font-size:2.4rem;color:#0E4D3C;text-align:center;margin:20px 0 2px}.receipt-card dl{margin:20px 0;border-top:1px dashed #CBD5E1}.receipt-card dl>div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed #CBD5E1;gap:12px}.receipt-card dt{color:#82909D;font-size:.76rem}.receipt-card dd{margin:0;font-weight:800;font-size:.76rem}.quote-section{background:#F3FAF5}.testimonial-card{padding:22px}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#27816F;color:#fff;font-weight:900}.testimonial-card p{font-family:var(--heading);font-style:italic;color:#44515D}.share-card{max-width:820px;padding:38px;background:#EDF8F2;border-radius:26px;text-align:center}.share-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.copy-link-row{display:flex;gap:8px;margin-top:18px}.copy-link-row input{background:#fff}

.ticker{overflow:hidden;border-block:1px solid #EEF2F5;white-space:nowrap;background:#fff}.ticker-track{padding:12px 0;display:inline-block;animation:ticker 28s linear infinite;color:#CBD2D8;font-weight:800}@keyframes ticker{to{transform:translateX(-50%)}}.quote-banner{background:#fff}.quote-mark{font-family:var(--heading);font-size:5rem;color:#F0A000;line-height:1}.quote-banner blockquote{margin:0;font-size:1.35rem;font-style:italic;color:#4C5563}.program-features{background:#F1F6FA}.feature-card{padding:22px;background:#F8FBFD}.feature-icon{display:block;width:28px;height:28px;border-radius:8px;background:#B3BF00;margin-bottom:18px}.stats-band{background:#fff;padding:42px 0}.large-stat{background:transparent;color:var(--ink);text-align:center}.large-stat strong{color:var(--ink);font-size:2.9rem}.large-stat span{color:#6B7683;text-transform:uppercase;font-size:.6rem}.beneficiary-card{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding:22px;background:#F1F6FA;border:1px solid #DCE6EE;border-radius:24px}.beneficiary-card .media-frame{min-height:340px}.beneficiary-card blockquote{font-size:1.2rem;font-style:italic;margin:54px 0 60px}.beneficiary-meta{display:flex;gap:24px;flex-wrap:wrap;border-top:1px solid #D8E3EA;padding-top:16px;font-size:.72rem}.gallery-section{background:#F1F6FA}.gallery-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.gallery-grid .media-frame{min-height:120px;border-radius:14px}

@media (max-width: 1100px){
  .main-nav{gap:16px}.header-inner{gap:18px}.hero-home-grid,.two-column-hero,.split-feature-grid,.featured-news-grid{gap:34px}.card-grid-5{grid-template-columns:repeat(3,minmax(0,1fr))}.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width: 860px){
  .nav-toggle{display:block}.main-nav{position:fixed;inset:92px 0 auto 0;background:#fff;border-bottom:1px solid var(--line);padding:16px 20px 22px;display:none;flex-direction:column;align-items:stretch;gap:4px}.main-nav.is-open{display:flex}.main-nav>a,.nav-dropdown-trigger{padding:12px 0;text-align:left}.main-nav>a.is-active:after,.nav-dropdown-trigger.is-active:after{bottom:3px}.nav-dropdown-menu{position:static;opacity:1;pointer-events:auto;transform:none;box-shadow:none;border:0;display:none;padding:0 0 5px}.nav-dropdown.is-open .nav-dropdown-menu{display:block}.nav-donation{text-align:center!important;margin-top:8px}.hero-home-grid,.two-column-hero,.split-feature-grid,.featured-news-grid,.news-layout,.donation-layout,.beneficiary-card{grid-template-columns:1fr}.media-frame-hero{min-height:360px}.card-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.card-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.timeline{grid-template-columns:1fr}.timeline:before{left:10px}.timeline-item{padding-left:28px}.timeline-item:after,.timeline-item:nth-child(even):after{left:-1px;right:auto}.newsletter-strip-inner,.cta-banner-inner,.footer-bottom{flex-direction:column;align-items:flex-start}.footer-grid{grid-template-columns:1fr 1fr}.archive-hero-inner{flex-direction:column;align-items:stretch}.featured-publication{grid-template-columns:1fr}.checkout-summary{position:static}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 620px){
  .container{width:min(calc(100% - 28px),var(--container))}.header-inner{min-height:78px}.main-nav{inset:78px 0 auto 0}.brand-org,.brand-divider{display:none}.brand-copy{font-size:.72rem}.section-space,.section-block{padding:52px 0}.hero-home h1,h1{font-size:clamp(2.5rem,13vw,4rem)}.card-grid-5,.card-grid-4,.card-grid-3,.card-grid-2,.stats-grid,.form-grid-2,.payment-grid,.amount-grid,.logo-grid,.logo-grid-large{grid-template-columns:1fr}.impact-highlight{flex-direction:column;align-items:flex-start}.cta-banner-inner{padding:28px 22px}.footer-grid{grid-template-columns:1fr 1fr}.ambassador-card{grid-template-columns:1fr}.gallery-grid{grid-template-columns:1fr}.inline-form,.copy-link-row{flex-direction:column}.beneficiary-card blockquote{margin:26px 0 32px}.timeline-item{min-height:0}
}
@media print{.site-header,.site-footer,.cta-banner,.share-card,.site-header{display:none!important}.receipt-card{box-shadow:none}}

/* ------------------------------------------------------------------
   YKAI Phase 1 additions — header/footer scaffolding for the CI3 port.
   Copied from newdesign/public/assets/css/app.css; only additive rules
   below, scoped to the new layout classes (.site-header / .site-footer).
   Loaded exclusively by pages that opt in to the new layout, so no
   legacy Bootstrap page is affected.
   ------------------------------------------------------------------ */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--marine);color:#fff;padding:10px 16px;border-radius:0 0 12px 0;font-weight:800}
.skip-link:focus{left:0}
.brand-logo{height:52px;width:auto;object-fit:contain}
.brand-copy strong{display:block;font-size:.82rem;line-height:1.15}
.main-nav a:focus-visible,.nav-dropdown-trigger:focus-visible,.nav-toggle:focus-visible,.btn:focus-visible{outline:3px solid var(--marine);outline-offset:2px}
.nav-dropdown-menu a.is-active{background:var(--cream);font-weight:800}
.lang-switch{display:flex;align-items:center;gap:6px;font-size:.8rem;font-weight:800}
.lang-switch a{padding:4px 8px;border-radius:999px;border:1px solid var(--line)}
.lang-switch a.is-active{background:var(--marine);color:#fff;border-color:var(--marine)}
.footer-contact{font-size:.8rem;margin:8px 0;color:#111}
.footer-contact strong{display:block;font-size:.78rem}
.footer-legal{display:flex;gap:14px;flex-wrap:wrap}
@media (max-width:860px){.lang-switch{order:3}.header-inner{flex-wrap:wrap}}

/* ------------------------------------------------------------------
   YKAI Phase 3A additions — reusable Program template only.
   Scoped to .program-hero-gallery / .program-copy / .feature-card copy,
   classes that are not used by legacy pages.
   ------------------------------------------------------------------ */
.program-hero-gallery{display:grid;gap:14px}
.program-hero-gallery .media-frame{min-height:220px}
.program-copy p{max-width:820px;color:var(--ink)}
.feature-card p{margin:0;color:#26313D}
.gallery-section .gallery-grid .media-frame{min-height:150px}

/* ------------------------------------------------------------------
   YKAI Phase 5 additions — News listing and article detail only.
   New class names are not used by legacy pages.
   ------------------------------------------------------------------ */
.article-date{display:block;margin-top:6px;color:#7C8794}
.article-back{margin-bottom:24px}
.article-header{margin-bottom:28px}
.article-header h1{font-size:clamp(2.1rem,4.2vw,3.4rem);margin-bottom:14px}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;color:#64748B;font-size:.85rem;margin:0 0 18px}
.article-lead{font-size:1.12rem;line-height:1.65;color:#334155;max-width:820px}
.media-frame.article-hero{min-height:340px;margin-bottom:30px}
.article-prose{font-size:1rem;line-height:1.8;color:#1F2937;overflow-wrap:anywhere}
.article-prose p{margin:0 0 18px;color:inherit}
.article-prose img{height:auto;width:auto;max-width:100%;border-radius:14px;margin:18px 0}
.article-prose ul,.article-prose ol{margin:0 0 18px 22px;padding:0}
.article-prose h2,.article-prose h3,.article-prose h4{margin:28px 0 12px;color:var(--ink)}
.article-prose a{color:#0F6A57;text-decoration:underline}
.article-prose table{display:block;width:100%;overflow-x:auto}
.article-prose iframe,.article-prose video{max-width:100%}
.pagination{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:40px}
.pagination-link{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:.82rem;font-weight:800;color:var(--ink)}
.pagination-link:hover{border-color:#0F4A3A;color:#0F4A3A}
.pagination-link.is-active{background:#0F4A3A;border-color:#0F4A3A;color:#fff}
.pagination-link.is-disabled{opacity:.4;pointer-events:none}

/* ------------------------------------------------------------------
   YKAI Phase 6 additions — Homepage, FAQ, Privacy, Organization
   Structure, Event pages and Bank Account page only.
   New class names are not used by legacy pages.
   ------------------------------------------------------------------ */
.banner-card img{aspect-ratio:16/9}
.video-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}
.video-frame{position:relative;aspect-ratio:16/9;background:#0A3B52}
.video-placeholder{display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer;position:relative}
.video-placeholder:after{content:"\25B6";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:rgba(0,0,0,.62);color:#fff;font-size:1.25rem}
.video-placeholder img{height:100%;object-fit:cover}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ambassador-photos{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:6px 0 10px}
.ambassador-photos figure{margin:0}
.ambassador-photos figcaption{font-size:.68rem;color:#8A96A3;margin-bottom:4px}
.ambassador-photos img{aspect-ratio:3/4;border-radius:12px;object-fit:cover}
.partner-logo{margin:0;min-height:96px;display:grid;place-items:center;padding:14px;background:#fff;border:1px solid var(--line);border-radius:16px}
.partner-logo img{height:64px;width:auto;max-width:100%;object-fit:contain}
.faq-item{border:1px solid var(--line);border-radius:16px;background:#fff;margin-bottom:12px;overflow:hidden}
.faq-item summary{cursor:pointer;padding:18px 20px;font-weight:800;list-style:none;position:relative;padding-right:48px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:1.35rem;font-weight:500;color:#27816F}
.faq-item[open] summary:after{content:"\2212"}
.faq-answer{padding:0 20px 18px;border-top:1px solid #EEF2F5}
.faq-answer h3{margin:18px 0 8px;font-size:.98rem}
.faq-answer ul{margin:0 0 14px 20px;padding:0;color:var(--muted);font-size:.92rem}
.faq-answer li{margin-bottom:6px}
.faq-answer p{font-size:.92rem}
.policy-page .article-prose h2{font-size:1.3rem;margin:30px 0 10px}
.org-chart{margin:0;padding:18px;background:#fff;border:1px solid var(--line);border-radius:20px}
.org-chart img{width:100%;height:auto;object-fit:contain}
.bank-card{padding:28px;background:#fff;border:1px solid var(--line);border-radius:20px;text-align:center}
.bank-logo{height:56px;width:auto;margin:0 auto 18px;object-fit:contain}
.bank-card h3{font-size:1.5rem;letter-spacing:.04em}
.bank-qr{height:auto;max-width:220px;margin:0 auto 16px;object-fit:contain}
.bank-holder-label{font-size:.8rem;color:#BEBEBE;margin-bottom:2px}
.bank-holder{font-weight:700;color:#6C757D;font-size:.95rem}
.newsletter-strip .inline-form{flex-wrap:wrap;width:min(100%,560px)}
.newsletter-strip .inline-form input{flex:1 1 150px;min-width:0}
.newsletter-status{margin:10px 0 0;font-size:.82rem;min-height:1.2em}
@media (max-width:620px){.ambassador-photos{grid-template-columns:1fr 1fr}.bank-card{padding:20px}}

/* Phase 7 — donation form (presentation only) */
.donation-card .amount-option{position:relative;display:grid;padding:0;overflow:hidden;border:0;background:none}
.donation-card .amount-option input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.donation-card .amount-option span{display:grid;place-items:center;min-height:48px;padding:0 8px;border:1px solid var(--line);border-radius:10px;background:#fff;font-weight:800;font-size:.82rem;text-align:center}
.donation-card .amount-option input:checked + span{background:#E6F6FA;border-color:#8DD7E8}
.donation-card .amount-option input:focus-visible + span{outline:2px solid #8DD7E8;outline-offset:2px}
.donation-card .text-input{margin-top:10px}
.donation-card select.text-input{min-height:46px;padding:0 14px}
.donation-card .btn-full{margin-top:22px}
.donation-subheading{font-family:var(--heading);font-size:1.3rem;margin:28px 0 0}
.donation-anonymous{display:flex;align-items:center;gap:10px;margin-top:16px;font-weight:700;font-size:.85rem}
.donation-anonymous input{width:18px;height:18px}
.form-alert{margin-top:18px;padding:14px 16px;border:1px solid #F0C27A;border-radius:12px;background:#FFF4E5;color:#8A5200;font-weight:700;font-size:.85rem}
.form-alert-success{border-color:#9AD8B0;background:#E7F6EB;color:#1D6B3E}
.form-alert-error{border-color:#EFB4B4;background:#FDECEC;color:#8A1F1F}
.checkout-summary p{font-size:.85rem;line-height:1.5;margin:14px 0}
/* Visual QA fix: legacy small text colour (#83B7C1) fails contrast on --cyan. */
.checkout-summary small{color:#07364A;opacity:.85}

/* Visual QA fix (final phase): a percentage height on <img> cannot resolve inside
   a min-height-only .media-frame, so hero banner images stopped short of the frame.
   Inheriting the frame's min-height lets object-fit:cover fill it at every width. */
.media-frame-hero > img{min-height:inherit}

/* ------------------------------------------------------------------
   Final Visual QA & Mobile Responsiveness Fixes
   - Aligns language switcher and hamburger toggle horizontally in .header-actions
   - Prevents header stretching and establishes clean single-row mobile bar
   - Adds scrolling and depth shadow to open mobile navigation drawer
   - Collapses footer grid to 1fr on narrow mobile screens (<=500px) so
     long addresses and email do not truncate or awkwardly wrap
   - Adds responsive fluid font sizing to CTA banner heading
   ------------------------------------------------------------------ */
.header-actions{display:flex;align-items:center;gap:12px}
@media (max-width:860px){
  .header-inner{min-height:78px;flex-wrap:nowrap}
  .main-nav{inset:78px 0 auto 0;box-shadow:0 18px 40px rgba(15,23,42,.15);max-height:calc(100vh - 78px);overflow-y:auto;z-index:99}
}
@media (max-width:500px){
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .cta-banner h2{font-size:clamp(1.75rem,6vw,2.4rem)}
}