/* Gallery grid, lightbox and contact page. Uses the tokens in style.css. */
.gallery-grid .gcard { margin-inline: 0; padding: 0; background: var(--forest-900); }
.gcard[hidden] { display: none; }
.gbtn { position: relative; display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; overflow: hidden; border-radius: var(--radius); }
.gbtn img { width: 100%; height: auto; transition: transform .8s var(--ease); }
.gbtn:hover img { transform: scale(1.05); }
.gbtn span { position: absolute; inset: auto 0 0; padding: 40px 16px 14px; text-align: left; font: 700 .85rem var(--font-body); color: var(--white); background: linear-gradient(0deg, rgba(12,36,23,.85), transparent); transform: translateY(100%); transition: transform .35s var(--ease); }
.gbtn:hover span, .gbtn:focus-visible span { transform: none; }

.lb { position: fixed; inset: 0; z-index: 200; background: rgba(6,18,11,.94); display: flex; align-items: center; justify-content: center; padding: 30px; }
.lb[hidden] { display: none; }
.lb figure { margin: 0; max-width: min(1100px, 86vw); text-align: center; }
.lb img { max-height: 78vh; margin-inline: auto; border-radius: 10px; object-fit: contain; }
.lb figcaption { color: var(--white); margin-top: 14px; }
.lb button { position: absolute; width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(255,255,255,.12); color: var(--white); font-size: 2rem; line-height: 1; cursor: pointer; transition: background .25s, color .25s; }
.lb button:hover { background: var(--leaf); color: var(--forest-900); }
.lb-x { top: 20px; right: 20px; } .lb-n { top: 50%; margin-top: -24px; } .lb .prev { left: 20px; } .lb .next { right: 20px; }

.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s8); align-items: start; }
.contact-grid h2 { font-size: clamp(2rem, 4vw, 3rem); margin: var(--s4) 0; }
.info { list-style: none; margin: var(--s6) 0 0; padding: 0; display: grid; gap: var(--s3); }
.info li { display: flex; gap: var(--s4); align-items: center; background: var(--white); padding: var(--s4) var(--s5); border-radius: var(--radius); box-shadow: var(--shadow); }
.info .ico { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--forest-900); color: var(--leaf-soft); display: grid; place-items: center; font-size: 1.2rem; }
.info strong { display: block; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--crimson); }
.info a { font-weight: 700; text-decoration: none; word-break: break-word; }
.info a:hover { text-decoration: underline; }
.cform { display: grid; gap: var(--s4); background: var(--white); padding: var(--s6); border-radius: var(--radius); box-shadow: var(--shadow); }
.cform label { display: grid; gap: 6px; font-weight: 700; font-size: .9rem; }
.cform input, .cform select, .cform textarea { font: inherit; font-weight: 400; padding: 12px 14px; border: 1.5px solid #d9d1bd; border-radius: 10px; background: var(--cream); color: var(--ink); }
.cform input:focus, .cform select:focus, .cform textarea:focus { outline: none; border-color: var(--leaf); box-shadow: 0 0 0 3px rgba(90,168,30,.28); }
.cform .btn { justify-content: center; }
.fnote { font-size: .9rem; color: var(--ink-soft); min-height: 1.2em; }
.fnote.err { color: var(--crimson); }
@media (max-width: 820px) { .contact-grid { grid-template-columns: 1fr; gap: var(--s7); } .lb { padding: 16px; } .lb .prev { left: 8px; } .lb .next { right: 8px; } }

/* Partners (home) */
.partners { background: var(--sand); }
.partners-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s8); align-items: center; }
.partner-photo { margin: 0; }
.partner-photo img { width: 100%; height: auto; border-radius: var(--radius) var(--radius) 160px var(--radius); box-shadow: var(--shadow); aspect-ratio: 4/3.4; object-fit: cover; }
.partner-photo figcaption { margin-top: var(--s3); font-size: .85rem; color: var(--ink-soft); }
.partners h2 { font-size: clamp(2rem, 4vw, 3rem); margin: var(--s4) 0; }
.partners p + p { margin-top: var(--s3); color: var(--ink-soft); }
.partner-pills { list-style: none; display: flex; flex-wrap: wrap; gap: var(--s3); margin: var(--s6) 0 0; padding: 0; }
.partner-pills li { background: var(--white); border: 2px solid var(--leaf); color: var(--forest-900); font: 600 1rem var(--font-display); padding: 10px 22px; border-radius: 999px; }
@media (max-width: 820px) { .partners-grid { grid-template-columns: 1fr; gap: var(--s7); } }

/* Content pages: about, careers, projects, impact, leadership */
.nav-links { gap: var(--s5); }
@media (min-width: 861px) { .nav-links li.nav-home { display: none; } }
@media (min-width: 861px) and (max-width: 1180px) { .nav-links { gap: var(--s4); } .nav-links a { font-size: .88rem; } .nav-links .btn { padding: 9px 16px; } .brand img { height: 72px; } }
.tint { background: var(--sand); }
.about-photo { margin: 0; }
.about-photo img { width: 100%; height: auto; aspect-ratio: 4/3.4; object-fit: cover; border-radius: var(--radius) var(--radius) 160px var(--radius); box-shadow: var(--shadow); }
.about-photo figcaption { margin-top: var(--s3); font-size: .85rem; color: var(--ink-soft); }
.mv { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s5); }
.mv-card { background: var(--forest-900); color: var(--white); padding: var(--s7) var(--s6); border-radius: var(--radius); }
.mv-card h3 { color: var(--leaf-soft); font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; font-family: var(--font-body); font-weight: 800; margin-bottom: var(--s4); }
.mv-card p { font: 400 clamp(1.25rem, 2.2vw, 1.7rem)/1.35 var(--font-display); }
.values { list-style: none; margin: var(--s6) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s3); }
.values li { background: var(--white); border: 2px solid var(--leaf); border-radius: 999px; padding: 10px 22px; }
.values b { font-family: var(--font-display); font-weight: 600; }
.areas, .regions { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s5); }
.regions { grid-template-columns: repeat(4, 1fr); }
.area, .region { background: var(--white); border-radius: var(--radius); padding: var(--s6); box-shadow: 0 1px 0 rgba(12,36,23,.08), var(--shadow); border-top: 4px solid var(--leaf); }
.area h3, .region h3 { font-size: 1.3rem; margin-bottom: var(--s3); }
.area p, .region p { color: var(--ink-soft); font-size: .96rem; }
.regions-note, .impact-note { margin-top: var(--s6); color: var(--ink-soft); }
.impact-note a { text-decoration: underline; text-underline-offset: 3px; }
.roles li { background: var(--white); }
.openings { margin-top: var(--s6); padding: var(--s5); background: var(--sand); border-radius: var(--radius); }
.openings h3 { font-size: 1.2rem; margin-bottom: var(--s2); }
.openings p { color: var(--ink-soft); }
.card > img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.bandtop { aspect-ratio: 4/3; position: relative; display: flex; align-items: flex-end; padding: var(--s5); background: linear-gradient(150deg, var(--forest-700), var(--forest-900)); overflow: hidden; isolation: isolate; }
.bandtop::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("../img/contours.svg") center/cover; opacity: .9; }
.bandtop span { font: 400 clamp(1.4rem, 2.4vw, 1.8rem)/1.1 var(--font-display); font-style: italic; color: var(--leaf-soft); }
.meta { list-style: none; margin: var(--s2) 0 0; padding: var(--s3) 0 0; border-top: 1px solid rgba(12,36,23,.12); display: grid; gap: 6px; font-size: .88rem; color: var(--ink-soft); }
.meta b { color: var(--forest-900); font-weight: 800; margin-right: 4px; }
.project[hidden] { display: none; }
.person .photo { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center top; display: block; }
.person .bio { font-size: .92rem; color: var(--ink-soft); line-height: 1.55; }
@media (max-width: 1024px) { .areas { grid-template-columns: repeat(2, 1fr); } .regions { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 820px) { .mv { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .areas, .regions { grid-template-columns: 1fr; } }

/* Strategy and news */
.plain { list-style: none; margin: var(--s4) 0 0; padding: 0; display: grid; gap: var(--s3); }
.plain li { padding-left: 26px; position: relative; color: var(--ink-soft); }
.plain li::before { content: ""; position: absolute; left: 0; top: .6em; width: 12px; height: 3px; background: var(--leaf); border-radius: 2px; }
.plain b { color: var(--forest-900); }
.mail { color: var(--leaf-soft); text-decoration: underline; text-underline-offset: 3px; font-weight: 700; }
.feeds { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s6); align-items: start; }
.feed { background: var(--white); border-radius: var(--radius); box-shadow: 0 1px 0 rgba(12,36,23,.08), var(--shadow); padding: var(--s5); min-height: 320px; }
.feed-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); margin-bottom: var(--s4); flex-wrap: wrap; }
.feed-head h2 { font-size: 1.8rem; }
.feed-head .btn { padding: 10px 20px; min-height: 42px; }
.feed-head .btn[hidden] { display: none; }
.feed-body iframe { display: block; width: 100%; max-width: 100%; border: 0; border-radius: 10px; margin-bottom: var(--s4); }
.feed-empty { color: var(--ink-soft); background: var(--sand); padding: var(--s5); border-radius: var(--radius); }
@media (max-width: 820px) { .feeds { grid-template-columns: 1fr; } }