/* ==========================================================================
   MK Sports - About Page Styles
   关于我们页样式
   ========================================================================== */

.about-section { padding: 4rem 0; background: #0A0A0A; }
.about-intro h2 { font-size: 1.6rem; color: #E8D5C4; margin-bottom: 1.5rem; padding-bottom: 0.8rem; border-bottom: 2px solid #D4AF37; display: inline-block; }
.about-intro p { color: #bbb; font-size: 0.95rem; line-height: 2; margin-bottom: 1.2rem; }

/* Value Section */
.value-section { padding: 4rem 0; background: #2C1818; }
.value-section h2 { text-align: center; font-size: 2rem; color: #E8D5C4; margin-bottom: 3rem; }
.value-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.value-item { text-align: center; padding: 2rem 1.5rem; border: 1px solid rgba(212,175,55,0.15); transition: all 0.3s; }
.value-item:hover { border-color: rgba(212,175,55,0.4); background: rgba(212,175,55,0.05); }
.value-icon { width: 60px; height: 60px; line-height: 60px; margin: 0 auto 1rem; background: rgba(212,175,55,0.1); border: 1px solid rgba(212,175,55,0.3); color: #D4AF37; font-size: 1.5rem; font-weight: 900; font-family: "Noto Serif SC", serif; }
.value-item h3 { font-size: 1.1rem; color: #E8D5C4; margin-bottom: 0.5rem; }
.value-item p { color: #888; font-size: 0.8rem; line-height: 1.6; }

/* Process Section */
.process-section { padding: 4rem 0; background: #0A0A0A; }
.process-section h2 { text-align: center; font-size: 2rem; color: #E8D5C4; margin-bottom: 3rem; }
.process-list { max-width: 800px; margin: 0 auto; }
.process-item { display: flex; gap: 2rem; padding: 2rem 0; border-bottom: 1px solid rgba(255,255,255,0.05); align-items: flex-start; }
.process-num { font-family: "Oswald", sans-serif; font-size: 2rem; color: #8B3A3A; font-weight: 700; line-height: 1; min-width: 50px; }
.process-body h3 { font-size: 1.1rem; color: #E8D5C4; margin-bottom: 0.5rem; }
.process-body p { color: #888; font-size: 0.85rem; line-height: 1.7; }

/* Responsive */
@media (max-width: 768px) {
    .value-grid { grid-template-columns: repeat(2, 1fr); }
    .process-item { gap: 1rem; }
}