:root {
--color-background: var(--bg);
--color-text-primary: var(--fg);
--color-text-secondary: var(--fg-muted);
--color-text-muted: var(--fg-dim);
--color-accent: var(--accent);
--color-success: var(--success);
--color-primary: var(--accent);
--shadow-card: var(--shadow);
--shadow-card-hover: var(--shadow-lg);
--radius-full: 9999px;
--space-xs: 8px; --space-sm: 12px; --space-md: 16px;
--space-lg: 24px; --space-xl: 32px; --space-2xl: 48px; --space-3xl: 64px;
}
.about-section { padding: 72px 0; }
.about-section + .about-section { padding-top: 0; }
.mission-statement {
font-size: 1.25rem; line-height: 1.85; text-align: center;
max-width: 860px; margin: 0 auto; padding: 40px 36px;
background: rgba(255,255,255,0.04); border-radius: 28px;
border: 1px solid rgba(255,255,255,0.08); color: var(--fg);
}
.values-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 20px; margin-top: 32px; }
.value-card {
padding: 28px; text-align: center; background: rgba(255,255,255,0.04);
border-radius: 24px; border: 1px solid rgba(255,255,255,0.06); box-shadow: var(--shadow);
}
.value-icon { font-size: 2.5rem; margin-bottom: 16px; display: block; }
.team-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: 20px; margin-top: 32px; }
.team-card {
padding: 28px; text-align: center; background: rgba(255,255,255,0.04);
border-radius: 24px; border: 1px solid rgba(255,255,255,0.06); box-shadow: var(--shadow);
}
.team-avatar {
width: 96px; height: 96px; border-radius: 50%;
background: linear-gradient(135deg,var(--accent),#b8862e);
display: flex; align-items: center; justify-content: center;
font-size: 2.5rem; margin: 0 auto 18px; box-shadow: var(--shadow);
}
.team-name { font-size: 1.15rem; font-weight: 700; margin-bottom: 6px; color: var(--fg); }
.team-role { color: var(--accent); font-size: .875rem; font-weight: 600; margin-bottom: 12px; }
.team-bio { color: var(--fg-muted); font-size: .875rem; line-height: 1.65; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap: 18px; margin-top: 32px; }
.stat-card {
padding: 24px; text-align: center; background: rgba(255,255,255,0.04);
border-radius: 22px; border: 1px solid rgba(255,255,255,0.06);
}
.stat-number { font-size: 2.25rem; font-weight: 800; color: var(--accent); margin-bottom: 8px; }
.stat-label { font-size: .875rem; color: var(--fg-muted); font-weight: 600; }
.section-kicker {
display: inline-flex; align-items: center; gap: 8px;
padding: 8px 14px; border: 1px solid rgba(255,255,255,0.12); border-radius: 9999px;
background: rgba(255,255,255,0.05); color: var(--accent);
font-size: .85rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 16px;
}
.section-shell {
padding: 24px; border-radius: 28px;
background: linear-gradient(180deg,rgba(21,21,25,0.75),rgba(15,15,19,0.45));
border: 1px solid rgba(255,255,255,0.06);
}
@media (max-width: 768px) {
.about-section { padding: 48px 0; }
.mission-statement { padding: 24px 20px; font-size: 1.05rem; }
}
