/* 레거시 정적 페이지(public/**) 헤더·푸터 «드리프트 교정» — 2026-08 1차 QA
 *
 * 이 파일이 왜 있나: 정적 페이지 헤더가 사실상 13벌로 갈라져 서로 다르게 굳었다.
 * 각 디렉터리의 style.css 5벌 + test_home 공유본을 따로 고치면 14벌째를 만드는 셈이라,
 * «덮어쓰기 규칙만» 여기 한 곳에 모으고 각 HTML 에서 마지막에 링크한다(출처 순서로 이긴다).
 *
 * ⚠️ 새 규칙을 각 페이지 style.css 에 넣지 말 것. 여기서만 고친다.
 * ⚠️ 절대경로(/css/legacy-header.css)로 링크한다 — 페이지마다 <base href> 가 다르다
 *    (family1 은 /{dir}/, family2 는 /test_home/).
 */

/* ── 1. GNB 글씨 크기·간격 통일 ────────────────────────────────────────
   about·adult-coaching·child-coaching·glp1-coaching·longevity-coaching 은
   `class="header-gnblink h5"`(24px) 였고 library·support·parenting·qna 는 `h5` 가 없어
   body 크기로 떨어졌다(2026-08 QA 「항목마다 메뉴 글씨 사이즈가 달라짐」).
   class 유무와 무관해지도록 «모든» GNB 링크에 직접 건다 — 다시 어긋날 수 없다.

   ⚠️ 큰 쪽(24px)이 아니라 «들어가는 쪽»으로 맞춘다. 실측하면 h5 계열은 이미 목록이
      2165px 인데 컨테이너가 1520px 이라 마지막 항목(고객센터)이 잘리고 있었다 —
      QA 가 다음에 볼 버그다. 24px 로 통일하면 support 계열까지 가로 스크롤이 생긴다.
      좌우 패딩도 7rem → 3rem 으로 낮춰 8개 항목이 실제로 한 줄에 들어가게 한다. */
.header-gnblink {
  font-family: var(--ff-ko1);
  font-size: 17px;
  font-weight: var(--fw-bold);
  line-height: 1.4;
  letter-spacing: -0.02em;
  padding-left: 1.6rem !important;
  padding-right: 1.6rem !important;
}

/* ── 2. 검색 UI 숨김 ───────────────────────────────────────────────────
   두 가지 이유로 «지운다». ① 동작하지 않는다: <form> 도 submit 핸들러도 /api/search 도
   없다(전체화면 변형의 type="submit" 은 form «밖»에 있어 아무 일도 안 한다).
   ② 겹친다: .header-top(absolute; top:0)과 .header-title(absolute; top:2rem)이 같은 띠를
   공유하고, 모바일에선 .block-active 가 .header-top 과 .header-gnb 를 «둘 다» top:100% 로
   보내 메뉴 첫 줄 위에 검색창이 포개진다(2026-08 QA 「로고와 검색 기능이 겹쳐 있고,
   검색기능은 활성화되지 않아 보입니다」).
   public/app/index.html 은 이미 같은 조치를 해 두었다 — 나머지를 여기서 맞춘다.
   ⚠️ 검색 백엔드가 생기면 이 블록을 지우는 것이 «되살리는» 방법이다. */
.header-search,
.header-top .form-box {
  display: none !important;
}

/* 검색을 뺀 자리의 상단 유틸바는 로그인/회원가입만 남는다. 오른쪽 정렬을 유지한다. */
.header-top .user-menu {
  justify-content: flex-end;
}

/* ── 3. 푸터 SNS 아이콘 숨김 ───────────────────────────────────────────
   아이콘 4개(인스타·유튜브·페이스북·카카오)가 전부 href="javascript:void(0)" 라
   눌러도 아무 일이 없다. 저장소 어디에도 «진짜 주소»가 없다(랜딩 푸터 쪽은 아예 <span>).
   눌리는데 아무 일도 안 일어나는 것이 안 보이는 것보다 나쁘다 — 주소가 생기면 되살린다. */
.footer-snslist {
  display: none !important;
}

/* ── 4. 로고 ───────────────────────────────────────────────────────────
   정적 페이지는 옛 가로 워드마크(logo_horizontal.png)를 썼다. React 헤더는 2026-07-30 에
   정사각 심볼(logo_mark.png) + 「miraelifelab」 텍스트로 이미 교체했다. 정적도 같은 모양으로
   맞춘다(마크에 글자가 없어 이름은 옆에 텍스트로 둔다). */
.header-title a {
  display: inline-flex !important;
  align-items: center;
  gap: 0.8rem;
  height: auto !important;
  line-height: 1;
  text-decoration: none;
}
/* ⚠️ px 로 고정한다. rem 을 쓰면 두 계열의 html font-size 가 달라 같은 로고가
   about 40px / support 50px 로 다르게 나온다(실측). 로고는 어느 페이지에서나 같아야 한다. */
.header-title img {
  width: 40px !important;
  height: 40px !important;
  flex-shrink: 0;
}
.header-title .brand-wordmark {
  font-size: 22px;
  font-weight: 800;
  color: #6a5cd8;
  letter-spacing: -0.5px;
  white-space: nowrap;
}