/* Extra labels are mobile-only; the desktop header keeps its existing layout. */
.social-label {display:none;}
.mobile-social-panel {display:none;}

.site-header .header-tools {display:flex;align-items:center;justify-self:stretch;margin-left:4px;gap:20px;}
.site-header .header-call {margin-left:auto;}
.site-header .language-nav {justify-content:flex-start;gap:4px;}
.site-header .language-nav button {
  display:grid;place-items:center;min-width:44px;height:44px;padding:0 8px;
  border:0;border-bottom:1px solid transparent;background:transparent;cursor:pointer;
  font-size:13px;white-space:nowrap;
}
.site-header .language-nav button[aria-pressed=true] {border-bottom-color:#456c85;}
.site-header .language-nav button:is(:hover,:focus-visible) {background:#eaf2f7;}
.site-header .language-nav button:focus-visible {outline:2px solid #456c85;outline-offset:2px;}
.social-icon.kakao .kakao-mark {display:block;width:38px;height:38px;border-radius:50%;overflow:hidden;background:#fee500;filter:grayscale(1);transition:filter .25s;}
.social-icon.kakao .kakao-mark img {width:38px;height:38px;object-fit:none;object-position:-3px center;clip-path:inset(0 10px 0 0);filter:none;}
.social-icon.kakao:is(:hover,:focus-visible) .kakao-mark {filter:none;}

@media (max-width:900px) {
  .site-header .header-inner {
    height:82px;
    min-height:0;
    padding:12px;
    grid-template-columns:minmax(0,220px);
    grid-template-rows:auto;
    justify-content:center;
    gap:0;
  }
  .site-header .header-tools {display:none;}
  .site-header .header-call {display:none;}
  .site-header .brand {grid-column:1;grid-row:1;width:100%;min-width:0;align-self:center;justify-self:center;}
  .site-header .brand img {width:100%;}
  .site-header .menu-toggle {display:none;}
  .mobile-social-panel {
    display:flex;flex-direction:column;position:fixed;z-index:70;
    right:max(10px,env(safe-area-inset-right));bottom:calc(var(--bottom-space,80px) + 16px);
    width:64px;padding:4px;background:#fffffff2;backdrop-filter:blur(12px);
    border:1px solid #d1dfe7;border-radius:17px;box-shadow:0 5px 20px #244b641c;
  }
  .social-panel-toggle {
    display:flex;align-items:center;justify-content:center;gap:6px;
    width:100%;height:44px;padding:0;border:0;background:none;color:#456c85;
    font-family:SUITE,sans-serif;font-size:11px;font-weight:600;cursor:pointer;
    order:2;flex:0 0 44px;
  }
  .social-panel-chevron {width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(225deg);margin-top:3px;}
  .mobile-social-panel.is-collapsed .social-panel-chevron {transform:rotate(45deg);margin-top:-3px;}
  .mobile-social-panel .social-nav {
    width:100%;display:flex;flex-direction:column;gap:2px;order:1;
    max-height:max(54px,calc(100dvh - var(--bottom-space,80px) - 96px));overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
  }
  .mobile-social-panel.is-collapsed .social-nav {display:none;}
  .mobile-category-open .mobile-social-panel,.consult-expanded .mobile-social-panel {visibility:hidden;pointer-events:none;}
  .mobile-social-panel .social-icon {
    width:100%;height:54px;flex:0 0 54px;padding:5px 2px;
    display:flex;flex-direction:column;justify-content:center;gap:4px;
    border:0;border-radius:10px;background:transparent!important;overflow:visible;
    text-decoration:none;transform:none;touch-action:manipulation;
  }
  .mobile-social-panel .social-icon > img {width:27px;height:27px;object-fit:contain;}
  .mobile-social-panel .social-icon.kakao .kakao-mark {width:30px;height:30px;filter:none;}
  .mobile-social-panel .social-icon.kakao .kakao-mark img {width:30px;height:30px;object-position:-7px center;clip-path:inset(0 6px 0 0);}
  .mobile-social-panel .social-icon.instagram {filter:none;}
  .mobile-social-panel .social-icon svg {width:27px;height:27px;padding:4px;box-sizing:border-box;background:#a7aaac;border-radius:50%;color:#fff;}
  .mobile-social-panel .social-label {display:block;font-family:SUITE,sans-serif;font-size:9px;font-weight:500;line-height:1.4;color:var(--ink);white-space:nowrap;}
  .mobile-social-panel .blog svg {background:#03b75a;}
  .mobile-social-panel .blog .icon-letters {fill:#03b75a;}
  .mobile-social-panel .youtube svg {background:#f01820;}
  .mobile-social-panel .youtube .icon-cutout {fill:#f01820;}
  .mobile-social-panel :is(.social-icon,.social-panel-toggle):focus-visible {outline:2px solid #456c85;outline-offset:-2px;}
  .site-header .mobile-nav {
    display:block;position:relative;padding:0;width:100%;
    max-height:none;overflow:visible;background:#fff;border-top:1px solid var(--line);
  }
  .mobile-category-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));}
  .mobile-category {
    display:flex;align-items:center;justify-content:center;gap:6px;
    min-width:0;min-height:49px;padding:10px 6px;
    font-family:SUITE,sans-serif;font-size:14px;font-weight:500;line-height:1.35;
    color:var(--ink);background:#fff;border:0;border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);cursor:pointer;touch-action:manipulation;
  }
  .mobile-category:nth-child(3n) {border-right:0;}
  .mobile-category:nth-child(n+4) {border-bottom:0;}
  .mobile-category[aria-expanded=true] {background:#edf5f8;color:#244f67;}
  .mobile-category:focus-visible {outline:2px solid #456c85;outline-offset:-3px;}
  .category-chevron {width:6px;height:6px;flex:0 0 6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-top:-3px;}
  .mobile-category[aria-expanded=true] .category-chevron {transform:rotate(225deg);margin-top:3px;}
  .mobile-submenu {
    position:absolute;left:0;right:0;top:100%;z-index:2;
    padding:8px 16px 16px;background:#fffffffa;backdrop-filter:blur(12px);
    border-top:1px solid var(--line);border-bottom:1px solid #b8cdd8;
    box-shadow:0 14px 24px #244b6418;
    max-height:max(0px,calc(100dvh - var(--header-base-height,258px) - var(--bottom-space,80px) - 12px));
    overflow-y:auto;overscroll-behavior:contain;
  }
  .mobile-submenu-heading {display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:5px;}
  .mobile-submenu-heading h2 {font-family:SUITE,sans-serif;font-size:16px;font-weight:500!important;letter-spacing:0;margin:0;}
  .mobile-submenu-close {border:0;background:transparent;color:var(--ink);width:44px;height:44px;font-size:26px;line-height:1;cursor:pointer;flex:0 0 44px;}
  .site-header .mobile-submenu-links {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:0;margin:0;list-style:none;}
  .site-header .mobile-submenu-links a {display:flex;align-items:center;min-height:46px;padding:10px 12px;font-family:SUITE,sans-serif;font-size:14px;line-height:1.45;background:#eef5f8;color:var(--ink);overflow-wrap:anywhere;}
  .site-header .mobile-submenu-links a:is(:hover,:focus-visible) {background:#deebf1;}
  html[lang=en] .mobile-category {font-size:12px;}
  html[lang=en] .mobile-submenu-links a {font-size:13px;}
}

/* Landscape phones need enough space to scroll the full submenu. */
@media (max-width:900px) and (max-height:480px) {
  .mobile-submenu {position:fixed;top:12px;bottom:calc(var(--bottom-space,116px) + 12px);left:12px;right:12px;max-height:none;border:1px solid #b8cdd8;}
}
