/* HI-EDU GLOBAL SHELL — V01
   One header, one footer, one typography baseline across the public site. */
:root{
  --hi-font:"Inter","Noto Sans KR",sans-serif;
  --hi-bg:#f6f5f1;
  --hi-surface:#ffffff;
  --hi-text:#111315;
  --hi-muted:#6c6d69;
  --hi-line:#d9d7d0;
  --hi-accent:#111315;
  --hi-accent-text:#ffffff;
  --hi-green:#20c777;
  --hi-header-h:72px;
}
html{font-family:var(--hi-font)}
body{font-family:var(--hi-font)!important;color:var(--hi-text)}
body.dark{color:#f4f4f1}
.site-header,.lounge-header{
  position:sticky!important;top:0;z-index:100;
  height:var(--hi-header-h)!important;padding:0 6vw!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  background:color-mix(in srgb,var(--hi-bg) 90%,transparent)!important;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid color-mix(in srgb,var(--hi-line) 65%,transparent)!important;
}
body.dark .site-header,body.dark .lounge-header{
  background:color-mix(in srgb,#101112 90%,transparent)!important;
  border-bottom-color:#303235!important;
}
body.dark .icon-btn,body.dark .lang-btn,body.dark .menu-btn{background:#191b1d!important;color:#f4f4f1!important;border-color:#303235!important}
body.dark .mobile-menu{background:#191b1d!important;border-color:#303235!important}
body.dark .mobile-menu a{color:#f4f4f1!important}
body.dark .mobile-menu a:hover,body.dark .mobile-menu a.active{background:#242629!important}
.brand{display:flex!important;align-items:center!important;gap:10px!important;color:var(--hi-text)!important;text-decoration:none!important}
.brand-logo{width:35px!important;height:35px!important;display:block!important;flex:0 0 35px!important;overflow:hidden}
.brand-logo img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important}
.brand-name{font-family:var(--hi-font)!important;font-size:12px!important;font-weight:800!important;letter-spacing:2px!important;margin-left:3px!important;line-height:1!important}
.header-actions{display:flex!important;align-items:center!important;gap:7px!important}
.icon-btn,.lang-btn,.menu-btn{
  box-sizing:border-box!important;height:40px!important;min-width:40px!important;
  border:1px solid var(--hi-line)!important;background:var(--hi-surface)!important;
  color:var(--hi-text)!important;border-radius:999px!important;cursor:pointer;
}
.icon-btn,.lang-btn{display:grid!important;place-items:center!important}
.icon-btn{width:40px!important;padding:0!important}
.lang-btn{padding:0 12px!important;font-size:11px!important;font-weight:800!important}
.menu-btn{width:40px!important;padding:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;background:var(--hi-surface)!important}
.menu-btn i{display:block!important;width:16px!important;height:1.5px!important;flex:0 0 1.5px!important;margin:0!important;background:currentColor!important}
.header-about-link{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 14px;border:1px solid var(--hi-line);border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.01em;background:var(--hi-surface);color:var(--hi-text);text-decoration:none;white-space:nowrap;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.header-about-link:hover{transform:translateY(-1px);border-color:var(--hi-text)}
.header-about-link.active{background:var(--hi-text);color:var(--hi-surface);border-color:var(--hi-text)}
.mobile-menu{
  position:absolute!important;top:var(--hi-header-h)!important;left:auto!important;right:6vw!important;width:min(360px,calc(100vw - 12vw));
  background:var(--hi-surface)!important;border:1px solid var(--hi-line)!important;border-radius:18px!important;
  padding:10px!important;display:grid!important;gap:2px!important;
  transform:translateY(-14px)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;
  transition:opacity .25s ease,transform .25s ease,visibility .25s ease!important;
  box-shadow:0 18px 50px rgba(0,0,0,.12)!important;z-index:99!important;
}
.mobile-menu.open{transform:translateY(0)!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}
.mobile-menu a{display:block;padding:13px 12px!important;color:var(--hi-text)!important;text-decoration:none!important;font-size:13px!important;font-weight:700!important;line-height:1.3;border:0!important;border-radius:12px!important}
.mobile-menu a:hover,.mobile-menu a.active{background:var(--hi-bg)!important}
.mobile-menu .menu-kakao{margin-top:7px!important;background:var(--hi-accent)!important;color:var(--hi-accent-text)!important;border:0!important;text-align:center!important;border-radius:12px!important}
.footer{background:#111315!important;color:#fff!important;padding:42px 6vw 28px!important}
.footer-inner{max-width:1180px!important;margin:0 auto!important}
.footer-brand{display:flex!important;align-items:center!important;gap:10px!important;color:#fff!important;text-decoration:none!important;min-width:0}
.footer-brand img,.footer-logo img{width:35px!important;height:35px!important;object-fit:contain!important;display:block!important}
.footer-brand b,.footer-brand strong,.footer-brand p{font-family:var(--hi-font)!important;font-size:11px!important;font-weight:800!important;letter-spacing:2px!important;margin:0!important;color:#fff!important}
.footer-links{display:flex!important;gap:18px!important;flex-wrap:wrap!important;margin:28px 0!important;padding:0!important}
.footer-links a{color:rgba(255,255,255,.68)!important;text-decoration:none!important;font-size:11px!important;font-weight:600!important;line-height:1.4;transition:color .2s ease}
.footer-links a:hover{color:#fff!important}
.footer-bottom{border-top:1px solid rgba(255,255,255,.14)!important;padding-top:18px!important;margin-top:4px!important;display:flex!important;justify-content:space-between!important;gap:12px!important;color:rgba(255,255,255,.45)!important;font-size:9px!important;line-height:1.5}
.footer-bottom span{color:inherit!important}
@media(min-width:760px){
  :root{--hi-header-h:78px}
  .footer-links{justify-content:flex-end!important;margin-top:-24px!important}
}
@media(max-width:759px){
  .header-about-link{display:none}
  .mobile-menu{left:5vw!important;right:5vw!important;width:auto!important}
  .footer-bottom{flex-direction:column!important;align-items:flex-start!important}
}


/* V04 — legal/company information in every footer */
.footer-company{display:grid;gap:3px;margin-top:16px;max-width:760px;color:rgba(255,255,255,.52);font-size:9px;line-height:1.65}
.footer-company strong{font-size:10px;letter-spacing:.08em;color:rgba(255,255,255,.86)}
.footer-company a{color:rgba(255,255,255,.68);text-decoration:none}
.footer-company a:hover{color:#fff}
@media(min-width:760px){.footer-company{grid-template-columns:auto auto;column-gap:18px;align-items:baseline}.footer-company strong{grid-column:1/-1}}
@media(max-width:759px){.footer-company{margin-top:4px}}
