/* About page styles */
/* Unified About Page Design System */
.about-section { text-align: center; padding: 2rem 0; }
.about-section+.about-section { border-top: 1px solid rgba(0, 137, 117, 0.06); }
.about-section-title { font-size: 2rem; font-weight: 800; color: var(--text-main); margin-bottom: 0.75rem; }
.about-section-subtitle { color: var(--text-muted); font-size: 1.05rem; max-width: 600px; margin: 0 auto 2.5rem; line-height: 1.6; }
.features-header { text-align: center; margin-bottom: 5rem; }
.features-header h1 { font-size: 2.8rem; font-weight: 800; margin-bottom: 1rem; background: linear-gradient(135deg, #0f172a 40%, var(--accent-primary) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.features-header p { color: var(--text-muted); font-size: 1.1rem; max-width: 600px; margin: 0 auto; line-height: 1.7; }
.card-grid { display: grid; gap: 2rem; }
.card-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.card-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 768px) { .features-header h2 { font-size: 2rem; } .card-grid.cols-2, .card-grid.cols-3 { grid-template-columns: 1fr; } }
.u-card { background: #ffffff; border: 1px solid var(--panel-border); border-radius: 20px; padding: 2.25rem 2rem; text-align: center; box-shadow: 0 4px 20px rgba(0, 137, 117, 0.02); transition: all 0.3s ease; }
.u-card:hover { border-color: var(--card-hover-border); transform: translateY(-3px); box-shadow: 0 12px 30px rgba(0, 137, 117, 0.07); }
.u-card-icon { font-size: 2.5rem; line-height: 1; margin-bottom: 1rem; display: block; }
.u-card h3 { font-size: 1.3rem; font-weight: 700; color: var(--accent-primary); margin-bottom: 0.75rem; }
.u-card p { color: var(--text-muted); font-size: 0.92rem; line-height: 1.65; margin-bottom: 0; }
.u-card p+p { margin-top: 0.75rem; }
.u-card ul { list-style: none; padding: 0; margin: 1rem 0 0; text-align: left; }
.u-card ul li { color: var(--text-muted); font-size: 0.88rem; line-height: 1.5; padding: 0.35rem 0 0.35rem 1.4rem; position: relative; }
.u-card ul li::before { content: '✦'; position: absolute; left: 0; color: var(--accent-primary); font-size: 0.7rem; top: 0.5rem; }
.u-card.stat-card .u-card-icon { font-size: 2.75rem; }
.u-card.stat-card h3 { font-size: 1.5rem; font-weight: 800; }
.u-card.wide-card { text-align: left; padding: 2.5rem; }
.u-card.wide-card h3 { font-size: 1.4rem; display: flex; align-items: center; gap: 12px; margin-bottom: 1.25rem; }
.u-card.wide-card h3::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--accent-primary), transparent); }