:root {
  --ink: #122b3b;
  --text: #3f4546;
  --muted: #69706f;
  --cream: #f6f3eb;
  --paper: #fbfaf6;
  --rust: #c84f2d;
  --rust-dark: #a93e22;
  --olive: #52623c;
  --blue-pale: #dcebf1;
  --peach: #f5ded2;
  --line: rgba(18,43,59,.16);
  --serif: "Fraunces", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
  --max: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background: var(--paper);
  font-family: var(--sans);
  line-height: 1.55;
}
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }
.container { width: min(var(--max), calc(100% - 80px)); margin: 0 auto; }

.site-header {
  height: 76px;
  background: rgba(251,250,246,.97);
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid rgba(18,43,59,.08);
}
.nav-wrap { height: 100%; display:flex; align-items:center; justify-content:space-between; }
.brand { position:relative; display:flex; flex-direction:column; line-height:.9; width:175px; }
.brand-name { font: 700 30px/1 var(--serif); color:var(--ink); }
.brand-sub { font: 700 10px/1 var(--sans); letter-spacing:3px; margin-top:5px; color:var(--ink); }
.brand-mark {
  position:absolute; left:88px; bottom:-5px; width:55px; height:12px;
  border-bottom: 5px solid #799d38; border-radius:50%;
  transform:rotate(-7deg);
}
.main-nav { display:flex; align-items:center; gap:34px; font-size:13px; font-weight:600; }
.main-nav a { padding:28px 0 8px; border-bottom:2px solid transparent; }
.main-nav a:hover, .main-nav a.active { color:var(--rust); border-bottom-color:var(--rust); }
.nav-toggle, .nav-toggle-label { display:none; }

.hero { position:relative; min-height:590px; display:flex; align-items:center; overflow:hidden; color:#fff; }
.hero-image {
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(8,29,35,.55), rgba(8,29,35,.12)),
    url("https://images.unsplash.com/photo-1544735716-392fe2489ffa?auto=format&fit=crop&w=2200&q=85") center/cover;
}
.hero-overlay { position:absolute; inset:0; background:linear-gradient(90deg, rgba(0,0,0,.25), transparent 65%); }
.hero-content { position:relative; z-index:2; padding:70px 0; max-width:650px; }
.eyebrow { color:var(--rust); font-size:11px; font-weight:700; letter-spacing:2.2px; margin:0 0 12px; }
.eyebrow.light { color:#f4d8ca; }
.hero h1 { font:600 clamp(54px,7vw,88px)/.88 var(--serif); letter-spacing:-2px; margin:0 0 25px; }
.hero h1 em { font-style:italic; color:#f3d6c7; }
.hero-lead { font:600 22px/1.2 var(--serif); max-width:570px; margin:0 0 16px; }
.hero-copy { max-width:590px; font-size:15px; margin-bottom:27px; }
.hero-script {
  position:absolute; right:6%; bottom:46px; z-index:2; color:white;
  font:italic 32px/1.05 var(--serif); transform:rotate(-7deg);
  text-align:center;
}
.hero-script span { font-size:24px; }

.button-row { display:flex; gap:12px; flex-wrap:wrap; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:18px;
  min-height:48px; padding:0 23px; border-radius:2px;
  font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase;
  transition:.2s ease;
}
.btn span { font-size:18px; line-height:0; }
.btn-primary { background:var(--rust); color:white; }
.btn-primary:hover { background:var(--rust-dark); transform:translateY(-1px); }
.btn-light { background:#fff; color:var(--ink); }
.btn-light:hover { background:#f2eee6; }

.intro-strip { background:var(--cream); border-bottom:1px solid var(--line); }
.three-cols { display:grid; grid-template-columns:repeat(3,1fr); }
.intro-card { padding:48px 45px 50px; border-right:1px solid var(--line); }
.intro-card:last-child { border-right:0; }
.icon { color:var(--rust); font-size:32px; height:42px; }
.icon.leaf { color:var(--olive); }
.icon.globe { color:#22627d; }
.intro-card h3 { font:600 30px/1 var(--serif); color:#17607b; margin:0 0 5px; }
.intro-card h4 { font:600 17px/1.2 var(--serif); color:var(--ink); margin:0 0 15px; }
.intro-card p { margin:0; font-size:14px; color:var(--muted); }

.tv-feature { display:grid; grid-template-columns:1fr 1fr; min-height:440px; }
.tv-photo {
  min-height:440px; position:relative;
  background:url("https://images.unsplash.com/photo-1516026672322-bc52d61a55d5?auto=format&fit=crop&w=1400&q=85") center/cover;
}
.tv-photo:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent 55%, rgba(220,235,241,.15)); }
.photo-caption { position:absolute; left:8%; bottom:45px; z-index:2; color:white; font:italic 26px/1.05 var(--serif); text-shadow:0 2px 12px rgba(0,0,0,.4); }
.tv-content { background:var(--blue-pale); padding:62px clamp(35px,6vw,85px); display:flex; flex-direction:column; justify-content:center; }
.tv-content h2 { font:600 clamp(42px,5vw,66px)/.95 var(--serif); color:var(--ink); margin:0; }
.tv-content h3 { font:600 22px/1.15 var(--serif); color:var(--ink); margin:8px 0 22px; }
.tv-content p { max-width:560px; font-size:15px; margin:0 0 12px; }
.tv-content .btn { align-self:flex-start; margin-top:15px; }

.work-fields { padding:70px 0; background:var(--paper); }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.field-card { display:grid; grid-template-columns:42% 58%; min-height:365px; overflow:hidden; }
.field-image { min-height:100%; background-position:center; background-size:cover; }
.youth .field-image { background-image:url("https://images.unsplash.com/photo-1529156069898-49953e39b3ac?auto=format&fit=crop&w=900&q=85"); }
.sdgs .field-image { background-image:url("https://images.unsplash.com/photo-1497250681960-ef046c08a56e?auto=format&fit=crop&w=900&q=85"); }
.field-content { padding:40px 38px; }
.youth .field-content { background:var(--peach); }
.sdgs .field-content { background:#e8eedf; }
.field-content h2 { font:600 40px/.95 var(--serif); margin:0 0 10px; color:var(--rust); }
.sdgs .field-content h2 { color:var(--ink); font-size:36px; }
.field-content h3 { font:600 19px/1.2 var(--serif); color:var(--ink); margin:0 0 15px; }
.field-content p { font-size:13.5px; margin:0 0 23px; color:#4f5554; }
.text-button { display:inline-flex; gap:15px; align-items:center; background:var(--rust); color:white; padding:12px 16px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:1px; }
.text-button.green { background:var(--olive); }
.text-button:hover { transform:translateY(-1px); }

.how-we-work { background:var(--cream); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.process-grid { display:grid; grid-template-columns:1.1fr repeat(4,1fr); }
.process-title, .process-item { padding:48px 28px; }
.process-item { border-left:1px solid var(--line); text-align:center; }
.process-title { padding-left:0; }
.process-title h2 { font:600 44px/.9 var(--serif); color:var(--ink); margin:0; }
.process-icon { font-size:35px; color:var(--rust); height:48px; }
.process-item:nth-child(3) .process-icon { color:#c34b31; }
.process-item:nth-child(4) .process-icon { color:var(--olive); }
.process-item:nth-child(5) .process-icon { color:#bd7c09; }
.process-item h3 { font:600 23px/1 var(--serif); color:var(--ink); margin:0 0 9px; }
.process-item p { font-size:13px; color:var(--muted); margin:0; }

.history { background:
  linear-gradient(rgba(18,43,59,.07),rgba(18,43,59,.07)),
  url("https://images.unsplash.com/photo-1500534623283-312aade485b7?auto=format&fit=crop&w=1800&q=80") center/cover;
}
.history-grid { display:grid; grid-template-columns:1fr 2.8fr auto; align-items:center; min-height:330px; gap:45px; }
.history-title h2 { font:600 50px/.9 var(--serif); color:var(--ink); margin:0 0 12px; }
.history-title p:last-child { max-width:250px; font:500 15px/1.3 var(--serif); }
.timeline { display:grid; grid-template-columns:repeat(3,1fr); position:relative; gap:30px; }
.timeline:before { content:""; position:absolute; left:0; right:0; top:10px; border-top:2px solid rgba(18,43,59,.45); }
.timeline article { position:relative; padding-top:28px; }
.timeline article:before { content:""; position:absolute; width:11px; height:11px; border-radius:50%; background:var(--ink); top:4px; left:0; }
.timeline article:last-child:before { background:var(--olive); }
.year { font:600 25px/1 var(--serif); color:var(--ink); }
.timeline h3 { font:600 16px/1.2 var(--serif); color:var(--ink); margin:7px 0 7px; }
.timeline p { font-size:12px; margin:0; color:#4d5758; }
.history-btn { white-space:nowrap; }

.projects { padding:70px 0 80px; }
.projects > .container > h2 { font:600 42px/1 var(--serif); color:var(--ink); margin:0 0 28px; }
.project-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.project-card { display:grid; grid-template-columns:115px 1fr; background:#fff; border:1px solid var(--line); transition:.2s ease; }
.project-card:hover { transform:translateY(-3px); box-shadow:0 10px 30px rgba(18,43,59,.08); }
.project-thumb { min-height:150px; background:center/cover; }
.tourism-thumb { background-image:url("https://images.unsplash.com/photo-1544986581-efac024faf62?auto=format&fit=crop&w=700&q=80"); }
.youth-thumb { background-image:url("https://images.unsplash.com/photo-1529156069898-49953e39b3ac?auto=format&fit=crop&w=700&q=80"); }
.sdg-thumb { background-image:url("https://images.unsplash.com/photo-1497250681960-ef046c08a56e?auto=format&fit=crop&w=700&q=80"); }
.project-card > div:last-child { padding:21px 20px; }
.project-card h3 { font:600 20px/1.05 var(--serif); color:var(--ink); margin:0 0 8px; }
.project-card p { font-size:12px; margin:0 0 12px; color:var(--muted); }
.project-card span { color:var(--rust); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; }

.site-footer { background:#162b27; color:#e8eee9; padding:48px 0 18px; }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr .8fr .8fr; gap:45px; align-items:start; }
.footer-brand { font:600 35px/1 var(--serif); }
.footer-brand small { display:block; font:700 9px/1 var(--sans); letter-spacing:3px; margin-top:5px; }
.footer-tagline { font-size:11px; letter-spacing:1px; opacity:.75; margin-top:15px; }
.footer-grid nav { display:grid; gap:8px; font-size:12px; }
.footer-grid nav a:hover { color:#e9a17f; }
.socials { display:flex; gap:9px; }
.socials a { width:30px; height:30px; border:1px solid rgba(255,255,255,.4); border-radius:50%; display:grid; place-items:center; font-size:12px; }
.footer-script { font:italic 25px/1.05 var(--serif); transform:rotate(-5deg); text-align:right; }
.footer-bottom { margin-top:38px; padding-top:15px; border-top:1px solid rgba(255,255,255,.15); display:flex; justify-content:space-between; font-size:10px; opacity:.65; }

@media (max-width: 1000px) {
  .container { width:min(var(--max), calc(100% - 48px)); }
  .main-nav { gap:18px; }
  .hero-script { right:3%; }
  .process-grid { grid-template-columns:repeat(2,1fr); }
  .process-title { grid-column:1/-1; padding-bottom:20px; }
  .history-grid { grid-template-columns:1fr; padding:50px 0; }
  .history-btn { justify-self:start; }
  .footer-grid { grid-template-columns:1.5fr 1fr 1fr; }
  .footer-script { display:none; }
}

@media (max-width: 760px) {
  .site-header { height:66px; }
  .nav-wrap { position:relative; }
  .brand-name { font-size:25px; }
  .brand { width:145px; }
  .brand-mark { left:72px; }
  .nav-toggle-label { display:flex; flex-direction:column; gap:5px; cursor:pointer; padding:10px; }
  .nav-toggle-label span { display:block; width:25px; height:2px; background:var(--ink); }
  .main-nav {
    position:absolute; left:0; right:0; top:66px; background:var(--paper);
    display:none; flex-direction:column; align-items:stretch; gap:0;
    border-bottom:1px solid var(--line); box-shadow:0 12px 20px rgba(0,0,0,.08);
  }
  .main-nav a { padding:15px 24px; border-bottom:1px solid var(--line); }
  .nav-toggle:checked ~ .main-nav { display:flex; }
  .hero { min-height:680px; align-items:flex-end; }
  .hero-content { padding:55px 0 65px; }
  .hero h1 { font-size:55px; }
  .hero-lead { font-size:19px; }
  .hero-copy { font-size:14px; }
  .hero-script { display:none; }
  .three-cols, .tv-feature, .field-grid, .project-grid { grid-template-columns:1fr; }
  .intro-card { border-right:0; border-bottom:1px solid var(--line); padding:35px 0; }
  .tv-photo { min-height:330px; }
  .tv-content { padding:48px 30px; }
  .field-card { grid-template-columns:1fr; }
  .field-image { min-height:230px; }
  .field-content { padding:35px 28px; }
  .process-grid { grid-template-columns:1fr 1fr; }
  .process-title { grid-column:1/-1; padding-left:0; }
  .process-item { padding:32px 15px; }
  .history-grid { gap:30px; }
  .timeline { grid-template-columns:1fr; gap:25px; }
  .timeline:before { left:5px; top:10px; bottom:0; right:auto; border-top:0; border-left:2px solid rgba(18,43,59,.45); }
  .timeline article { padding:0 0 0 28px; }
  .timeline article:before { left:0; top:4px; }
  .project-card { grid-template-columns:100px 1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:30px; }
  .footer-bottom { flex-direction:column; gap:6px; }
}

@media (max-width: 460px) {
  .container { width:calc(100% - 34px); }
  .button-row { flex-direction:column; align-items:stretch; }
  .btn { width:100%; }
  .process-grid { grid-template-columns:1fr; }
  .process-title { padding-bottom:0; }
  .footer-grid { grid-template-columns:1fr; }
  .socials { margin-top:5px; }
}