:root {
    --gks-primary: #0052cc;
    --gks-primary-dark: #003d99;
    --gks-accent: #00d4ff;
    --gks-dark-bg: #0a1128;
    --gks-light-bg: #f8f9fa;
    --gks-text-main: #333333;
    --gks-text-muted: #666666;
    --gks-border: #e0e0e0;
    --gks-container: 1200px;
    --gks-se-nav-height: 72px;
}
body {
    margin: 0;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: var(--gks-text-main);
    line-height: 1.7;
    background-color: #fff;
}
.gks-container { max-width: var(--gks-container); margin: 0 auto; padding: 0 20px; }
.gks-btn-primary { display: inline-block; padding: 14px 32px; background-color: var(--gks-primary); color: #fff; text-decoration: none; border-radius: 4px; font-weight: 600; transition: background 0.3s ease; }
.gks-btn-primary:hover { background-color: var(--gks-primary-dark); }
.gks-section { padding: 80px 0; }
.gks-section-title { text-align: center; margin-bottom: 60px; }
.gks-section-title h2 { font-size: 32px; color: var(--gks-dark-bg); margin-bottom: 15px; }
.gks-section-title p { color: var(--gks-text-muted); font-size: 16px; }
.gks-about-hero { padding: calc(var(--gks-se-nav-height) + 80px) 0 80px; background-color: var(--gks-dark-bg); color: #fff; text-align: center; position: relative; overflow: hidden; }
.gks-about-hero::before { content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: radial-gradient(circle at center, rgba(0,82,204,0.15) 0%, transparent 60%); z-index: 1; }
.gks-about-hero .gks-container { position: relative; z-index: 2; }
.gks-about-hero h1 { font-size: 42px; line-height: 1.3; margin-bottom: 20px; font-weight: 700; }
.gks-about-hero h1 span { color: var(--gks-accent); }
.gks-about-hero p { font-size: 18px; color: rgba(255,255,255,0.8); max-width: 800px; margin: 0 auto 40px; }
.gks-hero-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; max-width: 900px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 40px; }
.gks-stat-item .num { font-size: 36px; font-weight: 700; color: var(--gks-accent); margin-bottom: 8px; }
.gks-stat-item .label { font-size: 14px; color: rgba(255,255,255,0.6); }
.gks-story-section { background-color: #fff; position: relative; }
.gks-story-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.gks-story-text h2 { font-size: 32px; color: var(--gks-dark-bg); margin-bottom: 20px; line-height: 1.3; }
.gks-story-text blockquote { font-size: 20px; font-weight: 600; color: var(--gks-primary); border-left: 4px solid var(--gks-primary); padding-left: 20px; margin: 0 0 30px 0; font-style: italic; line-height: 1.5; }
.gks-story-text p { color: var(--gks-text-muted); margin-bottom: 20px; font-size: 16px; }
.gks-story-img { border-radius: 8px; overflow: hidden; box-shadow: 0 15px 40px rgba(0,0,0,0.1); position: relative; }
.gks-story-img img { width: 100%; height: auto; display: block; }
.gks-story-badge { position: absolute; bottom: -20px; left: -20px; background: var(--gks-primary); color: #fff; padding: 20px 30px; border-radius: 8px; box-shadow: 0 10px 20px rgba(0,82,204,0.3); }
.gks-story-badge span { display: block; font-size: 28px; font-weight: 700; line-height: 1; }
.gks-story-badge small { font-size: 14px; opacity: 0.8; }
.gks-ecosystem-section { background-color: var(--gks-light-bg); }
.gks-eco-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.gks-eco-card { background: #fff; border-radius: 8px; padding: 40px 30px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); position: relative; overflow: hidden; transition: transform 0.3s ease; border-top: 4px solid var(--gks-primary); }
.gks-eco-card:hover { transform: translateY(-10px); }
.gks-eco-num { font-size: 60px; font-weight: 800; color: rgba(0,82,204,0.05); position: absolute; top: 10px; right: 20px; line-height: 1; }
.gks-eco-card h3 { font-size: 22px; color: var(--gks-dark-bg); margin-bottom: 15px; }
.gks-eco-card p { color: var(--gks-text-muted); font-size: 15px; margin-bottom: 20px; }
.gks-eco-list { list-style: none; padding: 0; margin: 0; }
.gks-eco-list li { position: relative; padding-left: 20px; margin-bottom: 10px; font-size: 14px; color: var(--gks-text-main); }
.gks-eco-list li::before { content: '▪'; position: absolute; left: 0; color: var(--gks-primary); font-size: 18px; line-height: 1; }
.gks-mission-layout { display: flex; align-items: center; gap: 60px; margin-bottom: 80px; }
.gks-mission-layout:last-child { margin-bottom: 0; }
.gks-mission-layout.reverse { flex-direction: row-reverse; }
.gks-mission-img { flex: 1; border-radius: 8px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.08); }
.gks-mission-img img { width: 100%; height: auto; display: block; }
.gks-mission-info { flex: 1; }
.gks-mission-info h3 { font-size: 26px; margin-bottom: 20px; color: var(--gks-dark-bg); }
.gks-mission-info p { color: var(--gks-text-muted); margin-bottom: 20px; }
.gks-mission-list { list-style: none; padding: 0; margin: 0; }
.gks-mission-list li { position: relative; padding-left: 24px; margin-bottom: 12px; color: var(--gks-text-main); }
.gks-mission-list li::before { content: '✓'; position: absolute; left: 0; color: var(--gks-primary); font-weight: bold; }
.gks-timeline-section { background-color: #fff; }
.gks-timeline { position: relative; max-width: 800px; margin: 0 auto; }
.gks-timeline::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; background: var(--gks-border); transform: translateX(-50%); }
.gks-timeline-item { display: flex; justify-content: flex-end; padding-right: 30px; position: relative; margin-bottom: 40px; width: 50%; }
.gks-timeline-item:nth-child(even) { justify-content: flex-start; padding-left: 30px; padding-right: 0; margin-left: 50%; }
.gks-timeline-item::after { content: ''; position: absolute; top: 0; right: -8px; width: 16px; height: 16px; background: var(--gks-primary); border-radius: 50%; border: 4px solid #fff; box-shadow: 0 0 0 2px var(--gks-primary); }
.gks-timeline-item:nth-child(even)::after { left: -8px; right: auto; }
.gks-timeline-content { background: var(--gks-light-bg); padding: 24px; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,0.05); width: 100%; border-top: 4px solid var(--gks-primary); }
.gks-timeline-year { font-size: 20px; font-weight: 700; color: var(--gks-primary); margin-bottom: 8px; display: block; }
.gks-timeline-content h4 { margin: 0 0 10px; font-size: 18px; }
.gks-timeline-content p { margin: 0; color: var(--gks-text-muted); font-size: 15px; }
.gks-values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.gks-value-card { background: #fff; padding: 40px 30px; border-radius: 8px; text-align: center; box-shadow: 0 4px 20px rgba(0,0,0,0.05); transition: transform 0.3s ease; }
.gks-value-card:hover { transform: translateY(-5px); }
.gks-value-card h4 { font-size: 20px; margin: 20px 0 15px; color: var(--gks-dark-bg); }
.gks-value-card p { color: var(--gks-text-muted); font-size: 15px; margin: 0; }
.gks-value-icon { width: 64px; height: 64px; margin: 0 auto; background: rgba(0,82,204,0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--gks-primary); }
.gks-value-icon svg { width: 32px; height: 32px; }
.gks-about-cta { background: linear-gradient(135deg, var(--gks-primary-dark) 0%, var(--gks-primary) 100%); color: #fff; padding: 80px 0; text-align: center; }
.gks-about-cta h2 { font-size: 32px; margin-bottom: 15px; }
.gks-about-cta p { color: rgba(255,255,255,0.8); font-size: 18px; margin-bottom: 30px; }
.gks-about-cta .gks-btn-primary { background-color: #fff; color: var(--gks-primary); }
.gks-about-cta .gks-btn-primary:hover { background-color: #f0f0f0; }
@media (max-width: 992px) {
    .gks-hero-stats { grid-template-columns: repeat(2, 1fr); }
    .gks-story-layout { grid-template-columns: 1fr; }
    .gks-story-badge { bottom: 10px; left: 10px; }
    .gks-eco-grid { grid-template-columns: 1fr; }
    .gks-mission-layout, .gks-mission-layout.reverse { flex-direction: column; }
    .gks-mission-img { width: 100%; }
    .gks-values-grid { grid-template-columns: 1fr; }
    .gks-timeline::before { left: 20px; }
    .gks-timeline-item { width: 100%; justify-content: flex-start; padding-left: 50px; padding-right: 0; }
    .gks-timeline-item:nth-child(even) { margin-left: 0; padding-left: 50px; }
    .gks-timeline-item::after, .gks-timeline-item:nth-child(even)::after { left: 12px; right: auto; }
}
@media (max-width: 576px) {
    .gks-hero-stats { grid-template-columns: 1fr; }
    .gks-about-hero h1 { font-size: 28px; }
}