:root {
  --about-ink: #0b2421;
  --about-green: #0f4b43;
  --about-green-2: #0b6658;
  --about-gold: #c79a2b;
  --about-cream: #fbf7ed;
  --about-soft: #f1f6f5;
  --about-line: #d9e3e1;
  --about-muted: #60706d;
  --about-white: #fff;
  --about-shadow: 0 18px 50px rgba(13, 45, 40, .09);
}

.about-page { background: #fff; color: var(--about-ink); }
.about-shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.about-kicker { margin: 0 0 12px; color: var(--about-gold); font-size: .82rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.about-title { margin: 0; font-size: clamp(2.3rem, 5vw, 4.6rem); line-height: .98; letter-spacing: -.045em; }
.about-lead { margin: 22px 0 0; max-width: 720px; color: #d7e6e2; font-size: clamp(1.05rem, 1.8vw, 1.28rem); line-height: 1.7; }
.about-section-title { margin: 0; font-size: clamp(1.8rem, 3.5vw, 2.8rem); letter-spacing: -.035em; line-height: 1.05; }
.about-section-intro { margin: 12px auto 0; max-width: 720px; color: var(--about-muted); line-height: 1.7; }
.about-center { text-align: center; }

.about-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 82% 18%, rgba(199,154,43,.2), transparent 27%), linear-gradient(135deg, #071916 0%, #0f4b43 62%, #0b352f 100%); color: #fff; padding: clamp(64px, 9vw, 118px) 0; }
.about-hero::after { content:""; position:absolute; inset:auto -120px -180px auto; width:460px; height:460px; border:1px solid rgba(255,255,255,.08); border-radius:50%; box-shadow: 0 0 0 70px rgba(255,255,255,.025), 0 0 0 140px rgba(255,255,255,.02); }
.about-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); gap:56px; align-items:center; }
.about-hero-card { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); border-radius:28px; padding:18px; box-shadow:0 24px 70px rgba(0,0,0,.2); backdrop-filter: blur(10px); }
.about-hero-card img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:19px; }
.about-hero-note { display:flex; gap:12px; align-items:flex-start; margin-top:16px; padding:0 4px 2px; color:#dcebe8; font-size:.92rem; line-height:1.5; }
.about-hero-note span { color:var(--about-gold); font-weight:900; }
.about-hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:30px; }
.about-btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 20px; border-radius:12px; text-decoration:none; font-weight:800; transition:.2s ease; }
.about-btn-primary { background:var(--about-gold); color:#10241f; }
.about-btn-primary:hover { transform:translateY(-1px); filter:brightness(1.04); }
.about-btn-ghost { color:#fff; border:1px solid rgba(255,255,255,.32); background:rgba(255,255,255,.06); }

.about-story { padding:86px 0 36px; }
.about-story-grid { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:68px; align-items:start; }
.about-story-copy p { margin:0 0 20px; color:#465956; line-height:1.82; font-size:1.02rem; }
.about-not-charity { margin-top:28px; border-left:4px solid var(--about-gold); padding:18px 20px; background:var(--about-cream); border-radius:0 14px 14px 0; color:#4e5c58; line-height:1.65; }
.about-not-charity strong { color:var(--about-ink); }

.about-values { padding:54px 0 90px; }
.about-values-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:34px; }
.about-value { border:1px solid var(--about-line); border-radius:22px; padding:28px; background:#fff; box-shadow:0 12px 34px rgba(19,54,48,.05); }
.about-value-icon { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; margin-bottom:20px; background:#e7f3f0; color:var(--about-green-2); font-size:1.35rem; font-weight:900; }
.about-value h3 { margin:0 0 10px; font-size:1.2rem; }
.about-value p { margin:0; color:var(--about-muted); line-height:1.65; }

.about-impact { background:var(--about-ink); color:#fff; padding:38px 0; }
.about-impact-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.12); border-radius:22px; overflow:hidden; }
.about-stat { background:var(--about-ink); padding:28px 30px; text-align:center; }
.about-stat strong { display:block; color:#fff; font-size:clamp(1.8rem,4vw,2.8rem); letter-spacing:-.035em; }
.about-stat span { display:block; margin-top:6px; color:#aac3bd; font-size:.92rem; }

.about-process { padding:92px 0; background:var(--about-soft); }
.about-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:38px; counter-reset:steps; }
.about-step { position:relative; background:#fff; border:1px solid var(--about-line); border-radius:22px; padding:30px; }
.about-step::before { counter-increment:steps; content:counter(steps); width:42px; height:42px; border-radius:50%; display:grid; place-items:center; margin-bottom:20px; background:var(--about-green); color:#fff; font-weight:900; }
.about-step h3 { margin:0 0 10px; }
.about-step p { margin:0; color:var(--about-muted); line-height:1.65; }

.about-news { padding:90px 0; }
.about-section-head { display:flex; justify-content:space-between; gap:24px; align-items:end; margin-bottom:30px; }
.about-section-head p { margin:0; max-width:580px; color:var(--about-muted); line-height:1.6; }
.about-news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.about-news-card { overflow:hidden; border:1px solid var(--about-line); border-radius:22px; background:#fff; box-shadow:var(--about-shadow); }
.about-news-card img { width:100%; aspect-ratio:16/10; object-fit:cover; display:block; }
.about-news-body { padding:24px; }
.about-news-amount { display:inline-flex; padding:7px 10px; border-radius:999px; background:#e9f6ef; color:#0a724c; font-size:.78rem; font-weight:900; letter-spacing:.05em; text-transform:uppercase; }
.about-news-card h3 { margin:14px 0 10px; }
.about-news-card p { margin:0 0 18px; color:var(--about-muted); line-height:1.6; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.about-text-link { color:var(--about-green-2); font-weight:800; text-decoration:none; }

.about-next { padding:0 0 92px; }
.about-next-card { display:grid; grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr); overflow:hidden; border-radius:28px; background:linear-gradient(135deg,#0f4b43,#0b332e); color:#fff; box-shadow:0 26px 70px rgba(10,56,49,.18); }
.about-next-image { min-height:360px; }
.about-next-image img { width:100%; height:100%; object-fit:cover; display:block; }
.about-next-content { padding:clamp(34px,6vw,64px); align-self:center; }
.about-next-date { margin:0 0 10px; color:#f0c65a; font-weight:800; }
.about-next-content h2 { margin:0 0 16px; font-size:clamp(2rem,4vw,3.4rem); letter-spacing:-.04em; }
.about-next-content p { margin:0 0 26px; color:#d8e7e3; line-height:1.7; }

.about-network { padding:90px 0; background:#fbfcfc; border-top:1px solid var(--about-line); }
.about-network-block + .about-network-block { margin-top:68px; }
.about-network-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:28px; }
.about-network-card { display:flex; flex-direction:column; min-width:0; border:1px solid var(--about-line); border-radius:20px; background:#fff; overflow:hidden; }
.about-network-media { height:160px; padding:20px; display:grid; place-items:center; background:#f5f8f7; }
.about-network-media img { max-width:100%; max-height:120px; object-fit:contain; }
.about-network-card-body { display:flex; flex-direction:column; flex:1; padding:20px; }
.about-network-card h3 { margin:0 0 9px; font-size:1.08rem; }
.about-network-card p { margin:0 0 18px; color:var(--about-muted); line-height:1.55; font-size:.94rem; }
.about-network-card .about-text-link { margin-top:auto; }
.about-code { display:inline-block; margin-top:8px; padding:6px 9px; border-radius:8px; background:#fff4dd; color:#825d00; font-size:.8rem; font-weight:800; }

.about-sponsors { padding:86px 0; background:#081b18; color:#fff; }
.about-sponsors .about-section-intro { color:#a9c1bb; }
.about-sponsor-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:32px; }
.about-sponsor { border:1px solid rgba(255,255,255,.12); border-radius:22px; padding:24px; background:rgba(255,255,255,.055); }
.about-sponsor-logo { height:150px; border-radius:16px; padding:18px; display:grid; place-items:center; background:#fff; }
.about-sponsor-logo img { max-width:100%; max-height:110px; object-fit:contain; }
.about-sponsor h3 { margin:20px 0 8px; }
.about-sponsor p { margin:0 0 12px; color:#bfd0cc; line-height:1.55; }
.about-sponsor .about-text-link { color:#f0c65a; }

@media (max-width: 900px) {
  .about-hero-grid, .about-story-grid, .about-next-card { grid-template-columns:1fr; }
  .about-hero-card { max-width:640px; }
  .about-values-grid, .about-steps, .about-news-grid { grid-template-columns:1fr 1fr; }
  .about-network-grid { grid-template-columns:1fr 1fr; }
  .about-sponsor-grid { grid-template-columns:1fr; }
  .about-next-image { min-height:290px; max-height:420px; }
}

@media (max-width: 640px) {
  .about-shell { width:min(100% - 28px,1180px); }
  .about-hero { padding:54px 0 62px; }
  .about-hero-grid { gap:30px; }
  .about-hero-actions { flex-direction:column; }
  .about-btn { width:100%; }
  .about-story { padding-top:60px; }
  .about-story-grid { gap:28px; }
  .about-values { padding-bottom:62px; }
  .about-values-grid, .about-steps, .about-news-grid, .about-network-grid { grid-template-columns:1fr; }
  .about-impact-grid { grid-template-columns:1fr; }
  .about-section-head { align-items:flex-start; flex-direction:column; }
  .about-process, .about-news, .about-network, .about-sponsors { padding:64px 0; }
  .about-next { padding-bottom:64px; }
  .about-next-content { padding:30px 24px; }
  .about-next-image { min-height:230px; }
}
