@charset "UTF-8";

/* ═══════ FONTS ═══════ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&family=Poppins:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,700;1,800;1,900&family=Unbounded:wght@400;500;600;700;800;900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable.css');

/* ═══════ RESET & BASE ═══════ */
* { margin:0; padding:0; box-sizing:border-box; }
img { -webkit-user-drag:none; user-select:none; }
::-webkit-scrollbar { width:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:rgba(0,0,0,0.1); border-radius:4px; }

html { overflow-x:hidden; scroll-behavior:smooth; -ms-overflow-style:none; scrollbar-width:none; }
html::-webkit-scrollbar { display:none; }
body { font-family:'Pretendard','Noto Sans KR',sans-serif; background:#FAFBFD; color:#1A1F36; overflow-x:hidden; }

/* ═══ MEGA NAV SYSTEM ═══ */
.mega-nav { position:fixed; top:0; left:0; right:0; z-index:7800; height:56px; display:flex; align-items:center; justify-content:center; padding:0 clamp(28px, 5vw, 72px); transition:all 0.5s cubic-bezier(0.22,1,0.36,1); }
.mega-nav.scrolled, .mega-nav.always-white { background:rgba(255,255,255,0.95); backdrop-filter:blur(16px); box-shadow:0 2px 20px rgba(0,0,0,0.06); }
.mega-nav-logo { position:absolute; left:clamp(28px, 5vw, 72px); font-family:'Poppins'; font-size:23px; font-weight:900; font-style:italic; letter-spacing:-0.03em; text-decoration:none; cursor:pointer; line-height:56px; transition:all 0.5s ease; }
.mega-nav-logo span { font-style:italic; }
.mega-nav.hero-mode .mega-nav-logo { color:#fff; opacity:0; pointer-events:none; }
.mega-nav.scrolled .mega-nav-logo, .mega-nav.always-white .mega-nav-logo { color:#1A1F36; opacity:1; pointer-events:auto; }
.mega-nav-links { display:flex; align-items:center; gap:6px; height:56px; }
.mn-link { font-family:'Pretendard'; font-size:15px; font-weight:600; color:#1A1F36; padding:10px 20px; border-radius:12px; cursor:pointer; transition:all 0.2s; text-decoration:none; line-height:1; display:flex; align-items:center; gap:4px; }
.mn-arrow { width:10px; height:10px; opacity:0.35; transition:transform 0.25s,opacity 0.2s; flex-shrink:0; }
.mn-link:hover .mn-arrow { opacity:0.7; }
.mn-link.drop-active .mn-arrow { transform:rotate(180deg); opacity:0.7; }
.mega-nav-actions { position:absolute; right:calc(clamp(28px, 5vw, 72px) + 56px); display:flex; align-items:center; gap:14px; height:56px; }
.mn-action-group { display:flex; align-items:center; gap:10px; padding:6px 8px; background:rgba(255,255,255,0.9); border:1px solid rgba(0,0,0,0.08); border-radius:16px; box-shadow:0 8px 18px rgba(0,0,0,0.06); }
.mn-group-label { font-family:'Pretendard'; font-size:14px; font-weight:800; color:#1A1F36; padding:0 10px 0 8px; }
.mn-login { font-family:'Pretendard'; font-size:13px; font-weight:800; color:#fff; border:none; border-radius:12px; padding:10px 16px; cursor:pointer; transition:transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease; line-height:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; box-shadow:0 6px 14px rgba(0,0,0,0.12); }
.mn-login:hover { box-shadow:0 10px 22px rgba(0,0,0,0.16); transform:translateY(-1px); }
.mn-teacher-btn { background:#5561FF; }
.mn-teacher-btn:hover { background:#4450E6; }
.mn-student-btn { background:#0284C7; }
.mn-student-btn:hover { background:#0369A1; }
.mn-login:active { transform:translateY(1px); }
.mega-nav.hero-mode .mn-link { color:rgba(255,255,255,0.85); }
.mega-nav.scrolled .mn-link, .mega-nav.always-white .mn-link { color:#1A1F36; }
.mn-link:hover { color:#14B8A6; background:rgba(20,184,166,0.06); }
.mega-nav.hero-mode .mn-link:hover { color:#fff; background:rgba(255,255,255,0.1); }
@media(max-width:980px) { .mega-nav-links { display:none; } }
@media(max-width:768px) { .mega-nav { padding:0 16px; height:48px; } .mega-nav-links { display:none; } .mega-nav-actions { height:48px; right:76px; gap:10px; } .mn-action-group { gap:8px; padding:5px 6px; border-radius:14px; box-shadow:0 6px 14px rgba(0,0,0,0.06); } .mn-group-label { font-size:12px; padding:0 8px 0 6px; } .mn-login { font-size:12px; padding:8px 10px; border-radius:11px; box-shadow:0 5px 12px rgba(0,0,0,0.12); } .mega-nav-logo { font-size:19px; left:16px; line-height:48px; } }
@media(max-width:520px) { .mn-group-label { display:none; } .mn-action-group { padding:5px; } }

/* Hamburger */
.mega-ham { position:fixed; top:8px; right:clamp(20px, 5vw, 72px); z-index:8000; width:40px; height:40px; border:none; background:transparent; cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.mega-ham span { display:block; width:20px; height:2px; border-radius:2px; transition:all 0.3s ease; }
.mega-nav.hero-mode ~ .mega-ham span { background:#fff; }
.mega-nav.scrolled ~ .mega-ham span, .mega-nav.always-white ~ .mega-ham span { background:#1A1F36; }
.mega-ham.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.mega-ham.open span:nth-child(2) { opacity:0; }
.mega-ham.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Side menu */
.mega-side { position:fixed; top:0; right:-340px; width:320px; height:100vh; z-index:7500; background:rgba(255,255,255,0.98); backdrop-filter:blur(20px); border-left:1px solid rgba(0,0,0,0.06); overflow-y:auto; transition:right 0.4s cubic-bezier(0.22,1,0.36,1); padding:80px 24px; scrollbar-width:thin; }
.mega-side.open { right:0; }
.mega-side-overlay { position:fixed; inset:0; z-index:7000; background:rgba(0,0,0,0.2); opacity:0; pointer-events:none; transition:opacity 0.3s; }
.mega-side-overlay.open { opacity:1; pointer-events:auto; }
.ms-header { margin-bottom:32px; padding-bottom:20px; border-bottom:1px solid rgba(0,0,0,0.06); }
.ms-logo { font-family:'Poppins'; font-size:28px; font-weight:900; font-style:italic; color:#1A1F36; letter-spacing:-0.03em; }
.ms-logo span { background:linear-gradient(135deg,#14B8A6,#0EA5E9); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.ms-tag { font-size:14px; color:rgba(26,31,54,0.5); margin-top:6px; font-weight:500; }
.ms-nav { display:flex; flex-direction:column; gap:4px; }
.ms-link { display:flex; align-items:center; gap:12px; font-size:16px; font-weight:600; color:rgba(26,31,54,0.75); text-decoration:none; padding:14px 16px; border-radius:10px; transition:all 0.2s; }
.ms-link:hover { background:rgba(20,184,166,0.08); color:#14B8A6; }
.ms-link svg { stroke:rgba(26,31,54,0.3); flex-shrink:0; }
.ms-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }

/* ═══ NAV DROPDOWN ═══ */
.drop { position:fixed; top:56px; left:0; right:0; z-index:7700; background:#fff; border-top:1px solid rgba(0,0,0,0.05); box-shadow:0 16px 48px rgba(0,0,0,0.07); opacity:0; transform:translateY(-6px); pointer-events:none; transition:all 0.25s cubic-bezier(0.22,1,0.36,1); }
.drop.show { opacity:1; transform:translateY(0); pointer-events:auto; }
.drop-inner { max-width:1100px; margin:0 auto; padding:28px 32px; display:flex; gap:0; }
.drop-narrow .drop-inner { max-width:300px; }
.drop-col { flex:1; padding:0 24px; border-right:1px solid rgba(0,0,0,0.04); }
.drop-col:first-child { padding-left:0; }
.drop-col:last-child { border-right:none; padding-right:0; }
.drop-cat { display:flex; align-items:center; gap:10px; font-size:15px; font-weight:800; color:#1A1F36; margin-bottom:14px; padding:0 0 10px 0; border-bottom:1.5px solid rgba(0,0,0,0.08); }
.drop-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.drop-item { display:block; font-family:'Pretendard'; font-size:14px; font-weight:500; color:rgba(26,31,54,0.65); text-decoration:none; padding:7px 0 7px 16px; border-left:2px solid transparent; transition:all 0.15s; cursor:pointer; }
.drop-item:hover { color:#14B8A6; border-left-color:#14B8A6; padding-left:19px; }
.drop-sub { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; letter-spacing:0.3px; margin-top:18px; margin-bottom:8px; padding:5px 12px; border-radius:6px; width:fit-content; }
.drop-sub::before { content:''; width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.drop-col .drop-sub:first-of-type { margin-top:0; }
.drop-sub[data-type="이론"] { background:rgba(104,137,190,0.08); color:#4A6FA5; }
.drop-sub[data-type="이론"]::before { background:#6889BE; }
.drop-sub[data-type="대결"] { background:rgba(230,126,34,0.08); color:#D35400; }
.drop-sub[data-type="대결"]::before { background:#E67E22; }
.drop-sub[data-type="산업"] { background:rgba(91,160,138,0.08); color:#3D8B6E; }
.drop-sub[data-type="산업"]::before { background:#5BA08A; }
@media(max-width:768px) { .drop { display:none; } }

/* ═══ FOOTER ═══ */
.site-footer { background:#0F172A; padding:48px 5% 24px; color:rgba(255,255,255,0.6); font-size:14px; }
.site-footer-inner { max-width:1200px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between; gap:40px; border-bottom:1px solid rgba(255,255,255,0.1); padding-bottom:20px; margin-bottom:20px; }
.ft-logo { font-family:'Poppins'; font-size:28px; font-weight:900; font-style:italic; color:#fff; margin-bottom:16px; }
.ft-logo span { color:#14B8A6; }
.ft-info { font-size:13px; line-height:2; color:rgba(255,255,255,0.4); }
.ft-info p { margin-bottom:6px; }
.ft-info p:last-child { margin-bottom:0; }
.ft-cols { display:flex; gap:40px; }
.ft-col h4 { color:#fff; font-weight:700; margin-bottom:16px; font-size:16px; }
.ft-col ul { display:flex; flex-direction:column; gap:10px; }
.ft-col a { color:rgba(255,255,255,0.5); text-decoration:none; font-size:13px; transition:color 0.2s; }
.ft-col a:hover { color:#fff; }
.ft-bottom { display:flex; justify-content:space-between; align-items:center; max-width:1200px; margin:0 auto; font-size:12px; color:rgba(255,255,255,0.25); }
@media(max-width:768px) { .site-footer { padding:40px 20px 24px; } .site-footer-inner { flex-direction:column; gap:32px; } .ft-cols { flex-wrap:wrap; } .ft-bottom { flex-direction:column; gap:8px; text-align:center; } }

/* ═══ FLOATING SOCIAL ═══ */
.floating-social { position:fixed; bottom:40px; right:40px; display:flex; flex-direction:column; align-items:flex-end; gap:14px; z-index:6000; }
.social-icon-btn { display:block; transition:all 0.3s ease; cursor:pointer; opacity:0.7; }
.social-icon-btn:hover { transform:translateY(-3px) scale(1.1); opacity:1; }
.social-icon-btn img { display:block; height:28px; width:auto; object-fit:contain; }
.social-icon-btn.kakao { opacity:1; }
.social-icon-btn.kakao img { height:48px; }
.social-icon-btn.kakao:hover { transform:translateY(-3px) scale(1.05); }
@media(max-width:768px) { .floating-social { bottom:20px; right:20px; gap:12px; } .social-icon-btn img { height:24px; } .social-icon-btn.kakao img { height:40px; } }