/* css/committee.css — Committee_YYYY 공용 스타일
   원래 Committee_2027.php 안에 있던 <style> 블록을 그대로 옮긴 것.
   내용은 관리자 [Committee 관리] 에서 연도별로 편집하고, 이 파일이 모양을 맡는다. */

:root {
    --primary: #d50080;
    --primary-light: #ff1493;
    --text-dark: #1a1a2e;
    --text-body: #4a4a5a;
    --text-muted: #8a8a9a;
    --bg-pink: #fff5f9;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.06);
    --shadow-md: 0 8px 30px rgba(0,0,0,0.08);
}

.committee-container { max-width: 1400px; margin: 0 auto; }
.committee-hero { position: relative; border-radius: var(--radius-xl); overflow: hidden; margin-bottom: 3rem; box-shadow: var(--shadow-md); }
.committee-hero img { width: 100%; height: auto; display: block; }
.committee-section-title { text-align: center; font-size: 1.75rem; font-weight: 800; color: var(--text-dark); margin-bottom: 2.5rem; position: relative; }
.committee-section-title::after { content: ''; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 60px; height: 4px; background: linear-gradient(90deg, var(--primary), var(--primary-light)); border-radius: 2px; }
.president-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-bottom: 3rem; }
.president-card { background: linear-gradient(135deg, var(--bg-pink) 0%, #ffecf3 100%); border-radius: var(--radius-lg); padding: 2rem; text-align: center; border: 2px solid rgba(213,0,128,0.1); transition: all 0.3s ease; }
.president-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.president-role { display: inline-block; background: linear-gradient(135deg, var(--primary), var(--primary-light)); color: white; padding: 0.4rem 1rem; border-radius: 100px; font-size: 0.8rem; font-weight: 600; margin-bottom: 1rem; }
.president-name { font-size: 1.35rem; font-weight: 700; color: var(--text-dark); margin-bottom: 0.5rem; }
.president-affiliation { font-size: 0.95rem; color: var(--text-body); line-height: 1.5; }
.committee-group { margin-bottom: 2rem; }
.committee-group-title { font-size: 1.1rem; font-weight: 700; color: var(--primary); margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 2px solid rgba(213,0,128,0.15); }
.committee-members { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.75rem; }
.committee-member { background: white; border-radius: var(--radius-md); padding: 1rem 1.25rem; border: 1px solid rgba(0,0,0,0.06); transition: all 0.3s ease; }
.committee-member:hover { border-color: rgba(213,0,128,0.2); background: var(--bg-pink); }
.member-name { font-weight: 600; color: var(--text-dark); margin-bottom: 0.25rem; }
.member-affiliation { font-size: 0.85rem; color: var(--text-muted); }
.advisory-section { background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%); border-radius: var(--radius-xl); padding: 2.5rem; margin-top: 3rem; border: 1px solid rgba(0,0,0,0.06); }
.advisory-title { text-align: center; font-size: 1.5rem; font-weight: 800; color: var(--text-dark); margin-bottom: 2rem; }
.advisory-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 0.75rem; }
.advisory-member { background: white; border-radius: var(--radius-md); padding: 1rem 1.25rem; border: 1px solid rgba(0,0,0,0.06); }
.advisory-member .member-name { color: var(--text-dark); }
.steering-section { background: linear-gradient(135deg, #fff5f9 0%, #fff 100%); border-radius: var(--radius-xl); padding: 2.5rem; margin-top: 2rem; border: 1px solid rgba(213,0,128,0.1); }

@media (max-width: 1024px) { .president-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .president-grid { grid-template-columns: 1fr; } .committee-members, .advisory-grid { grid-template-columns: 1fr; } .advisory-section, .steering-section { padding: 1.5rem; } }