/* 공통 상단 메뉴(.topbar) 모양 — wireframe.css·home.css 에서 뽑은 규칙. 학교분석 페이지가 다른 페이지와 같은 머리글을 쓰게 한다. */
.topbar{position:sticky;top:0;background:var(--accent);border-bottom:1px solid rgba(255,255,255,.15);z-index:10}
.nav{max-width:1180px;margin:auto;padding:14px 24px;display:flex;justify-content:space-between;gap:20px;align-items:center}
.brand{font-weight:800;text-decoration:none;display:inline-flex;align-items:center;gap:8px;color:#fff}
.brand-logo{height:32px;width:auto;display:block}
.navlinks{display:flex;gap:8px;flex-wrap:wrap}
.navlinks>a{text-decoration:none;padding:7px 10px;border-radius:0;position:relative;color:#fff}
.navlinks>a::after{content:"";position:absolute;left:10px;right:10px;bottom:-15px;height:2px;background:#8FBFA0;transform:scaleX(0);transition:transform .2s}
.navlinks>a:hover::after{transform:scaleX(1)}
.navdrop{position:relative}
.navdrop>a{text-decoration:none;padding:7px 10px;border-radius:0;display:inline-block;position:relative;color:#fff}
.navdrop>a::before{content:"";position:absolute;left:10px;right:18px;bottom:-15px;height:2px;background:#8FBFA0;transform:scaleX(0);transition:transform .2s}
.navdrop:hover>a::before{transform:scaleX(1)}
.navdrop>a::after{content:"▾";margin-left:4px;font-size:11px;color:rgba(255,255,255,.65)}
.navdrop-menu{display:flex;position:absolute;top:calc(100% + 15px);left:0;margin-top:0;background:rgba(0,0,0,.7);border-radius:0;box-shadow:0 18px 36px rgba(0,0,0,.25);width:max-content;min-width:100px;max-width:200px;padding:6px;flex-direction:column;z-index:20;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .22s ease,transform .22s ease,visibility .22s}
.navdrop-menu a{display:block;padding:10px 14px;border-radius:0;font-size:14px;letter-spacing:-.01em;text-decoration:none;white-space:nowrap;color:#fff;transition:background .15s,color .15s}
.navdrop-menu a:hover{background:rgba(255,255,255,.12);color:#8FBFA0}
.navdrop:hover .navdrop-menu{opacity:1;visibility:visible;transform:translateY(0)}
.hamburger{display:flex;margin-left:auto;flex-shrink:0;background:none;border:none;padding:8px;flex-direction:column;gap:5px;cursor:pointer}
.hamburger span{width:22px;height:2px;background:#fff;border-radius:0;display:block}
.mobile-drawer-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:240}
.mobile-drawer-overlay.open{display:block}
.mobile-drawer{display:none;position:fixed;top:0;right:0;bottom:0;width:min(260px,78vw);background:var(--accent);flex-direction:column;box-shadow:-6px 0 28px rgba(0,0,0,.2);overflow-y:auto;z-index:250}
.mobile-drawer.open{display:flex}
.mobile-drawer-head{position:relative;display:flex;align-items:center;justify-content:flex-end;padding:44px 16px 22px;border-bottom:1px solid rgba(255,255,255,.15);margin-bottom:6px}
.mobile-drawer-head img{height:110px;opacity:.5}
.mobile-drawer-close{position:absolute;top:12px;right:16px;background:none;border:none;color:#fff;font-size:24px;line-height:1;cursor:pointer;padding:4px}
.mobile-drawer-close:hover{color:rgba(255,255,255,.65)}
.mobile-drawer-links{display:flex;flex-direction:column;gap:2px;padding:10px 16px 6px}
.mobile-drawer-linktitle{color:#fff;font-size:17px;font-weight:800;padding:14px 16px 12px}
.mobile-drawer-linklist{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:0 16px 14px}
.mobile-drawer-linklist a{color:rgba(255,255,255,.72);text-decoration:none;font-size:15px;transition:.15s}
.mobile-drawer-linklist a:hover{color:#fff}
@media(max-width:800px){.navlinks{display:none}}
/* school.css 의 옛 머리글 규칙(.nav, .navlinks 서랍)보다 우선하도록 선택자를 좁힌다 */
header.topbar{--accent:#16282B;position:sticky;top:0;z-index:100;background:#16282B;border-bottom:1px solid rgba(255,255,255,.15)}
header.topbar .nav{display:flex;justify-content:space-between;align-items:center;flex-wrap:nowrap;gap:20px;max-width:1180px;margin:auto;padding:14px 24px}
header.topbar .navlinks{display:flex;position:static;flex-direction:row;align-items:center;flex-wrap:wrap;width:auto;background:none;padding:0;box-shadow:none;overflow:visible;z-index:auto;gap:8px}
header.topbar .brand{color:#fff;text-decoration:none}
@media(max-width:800px){header.topbar .navlinks{display:none}}
