/* 헬스키퍼 반응형 — 모바일/태블릿
   인라인 레이아웃을 속성 선택자 + !important 미디어쿼리로 모바일에서 재배치한다. */

*, *::before, *::after { box-sizing: border-box; }
img, svg, iframe { max-width: 100%; }
html, body { overflow-x: hidden; }

/* 햄버거 버튼 — 기본(데스크톱) 숨김 */
.hk-hamburger { display: none; }

/* 우측 슬라이드 드로어(모바일 메뉴) — 기본 숨김 */
.hk-drawer-wrap { display: none; }
.hk-drawer-backdrop { position: absolute; inset: 0; background: rgba(11, 53, 88, 0.42); opacity: 0; transition: opacity .25s ease; }
.hk-drawer {
  position: absolute; top: 0; right: 0; height: 100%; width: 290px; max-width: 86vw;
  background: var(--surface-card); box-shadow: var(--shadow-lg);
  display: flex; flex-direction: column;
  transform: translateX(100%); transition: transform .28s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ───────── ≤ 860px : 드로어 활성 + 관리자 사이드바 → 상단바 ───────── */
@media (max-width: 860px) {
  .hk-drawer-wrap { display: block; position: fixed; inset: 0; z-index: 60; pointer-events: none; }
  .hk-drawer-wrap.open { pointer-events: auto; }
  .hk-drawer-wrap.open .hk-drawer-backdrop { opacity: 1; }
  .hk-drawer-wrap.open .hk-drawer { transform: translateX(0); }

  .hk-ashell  { flex-direction: column !important; }
  .hk-asidebar{ width: 100% !important; height: auto !important; position: static !important;
                border-right: none !important; border-bottom: 1px solid var(--border-default) !important; }
  .hk-anav    { display: none !important; }
  .hk-auser   { display: none !important; }
  .hk-amain   { padding: 22px 16px !important; max-width: 100% !important; }
  .hk-asidebar .hk-hamburger,
  .hk-abrand .hk-hamburger { display: inline-flex !important; }

  /* 2 / 1.x 컬럼 → 1 컬럼 */
  [style*="1fr 300px"],
  [style*="1fr 1fr"],
  [style*="1.5fr 1fr"],
  [style*="1.1fr 1fr"] { grid-template-columns: 1fr !important; }
}

/* ───────── ≤ 640px : 회원 헤더 → 로고 + 햄버거, 그리드 collapse ───────── */
@media (max-width: 640px) {
  [style*="repeat(2"],
  [style*="repeat(3"],
  [style*="repeat(5"] { grid-template-columns: 1fr !important; }
  [style*="repeat(4"] { grid-template-columns: 1fr 1fr !important; }
  .hk-cycle-steps { grid-template-columns: 1fr !important; }

  [style*="width: 360px"],
  [style*="width: 420px"],
  [style*="width: 440px"],
  [style*="width: 460px"] { width: 100% !important; max-width: 100% !important; }

  .hk-mheader { padding: 0 16px !important; gap: 12px !important; }
  .hk-mnav    { display: none !important; }
  .hk-mactions{ display: none !important; }
  .hk-mheader .hk-hamburger { display: inline-flex !important; }

  main, section { padding-left: 18px !important; padding-right: 18px !important; }
  h1 { font-size: 28px !important; line-height: 1.22 !important; }
  h2 { font-size: 22px !important; }

  [style*="position: sticky"] { position: static !important; }
}