/**
 * [전역 페이지 헤더]
 * - 역할: 목록·허브·마이페이지의 제목, 서브타이틀과 구분선 시각 규격 통일
 * - 작성/수정일: 2026-09-24
 */

.an-page-hero:not([data-an-mode="view"]):has(.an-page-hero__title),
.an-mp__main .an-mp-panel__head,
.an-site__main .an-site-panel__head,
.an-page-heading {
  --an-page-heading-title-size: clamp(30px, 2.6vw, 34px);
  --an-page-heading-desc-size: 15px;
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line-color, #eeeeee);
}

.an-page-hero__title,
.an-mp__main .an-mp-panel__title,
.an-site__main .an-site-panel__title,
.an-page-heading__title {
  margin: 0;
  color: var(--title-color, #171717);
  font-size: var(--an-page-heading-title-size, clamp(30px, 2.6vw, 34px));
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.035em;
  overflow-wrap: anywhere;
  word-break: keep-all;
}

.an-page-hero__desc,
.an-mp__main .an-mp-panel__lead,
.an-site__main .an-site-panel__lead,
.an-page-heading__desc {
  max-width: 680px;
  margin: 10px 0 0;
  color: var(--muted-color, #777777);
  font-size: var(--an-page-heading-desc-size, var(--fs-body, 15px));
  line-height: 1.6;
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
  word-break: keep-all;
}

@media (max-width: 575.98px) {
  .an-page-hero:not([data-an-mode="view"]):has(.an-page-hero__title),
  .an-mp__main .an-mp-panel__head,
  .an-site__main .an-site-panel__head,
  .an-page-heading {
    --an-page-heading-title-size: 24px;
    --an-page-heading-desc-size: 14px;
    margin-bottom: 22px;
    padding-bottom: 18px;
  }

  .an-page-hero__desc,
  .an-mp__main .an-mp-panel__lead,
  .an-site__main .an-site-panel__lead,
  .an-page-heading__desc {
    margin-top: 8px;
    line-height: 1.55;
  }
}