/* ==========================================================================
   oracle-type-main.css — 메인(index) 타이포그래피 통일 override
   공유 스케일(px): 64 / 48 / 40 / 32 / 28 / 24 / 20 / 18 / 16 / 14
   oracle-utilities.css(컴파일본)에 존재하지 않는 크기만 최소한으로 보강한다.
   반드시 oracle.css 다음 순서로 로드할 것 (head.php add_stylesheet 참조).
   폰트 크기(및 크기 변경으로 명백히 어색해진 제목 line-height) 외에는
   어떤 속성도 선언하지 않는다.
   ※ 2026-07-21 예외: 섹션 eyebrow/제목의 서체·굵기·자간 불일치가 있어
     아래 "섹션 헤더 통일" 블록에 한해 font-family/weight/letter-spacing/color 를 선언한다.
   ========================================================================== */

/* 메인 Hero 타이틀: 64 (컴파일본에는 clamp 82px 계열만 존재) */
.oracle-home-visual-hero h1 {
    font-size: clamp(40px, 6vw, 64px);
}

/* 메인 Section Title: 48 (컴파일본에 48px 유틸리티 없음)
   적용 대상: #treatments · 오라클의 특별함(Why Oracle) · 의료진 소개 ·
   오시는 길 · home-consult 섹션의 h2 */
.oracle-home-section-title {
    font-size: clamp(32px, 5vw, 48px);
    line-height: 1.2;
}

/* 시술 에디토리얼 스플릿(데스크톱 패널) 타이틀: 최대값을 스케일 내 48로 고정
   (기존 clamp(34px,2.28vw,54px) → 최대 54를 48로) */
.oracle-home-panel-title {
    font-size: clamp(34px, 2.28vw, 48px);
}

/* 메인 히어로 eyebrow(Since 2007 · Dermatology Specialist): 가독성 위해 11px→19px,
   굵기는 살짝 얇게(semibold 600 → medium 500). 색상은 마크업에서 text-white로 처리 */
.oracle-hero-eyebrow {
    font-size: 19px;
    font-weight: 500;
}

/* ==========================================================================
   섹션 헤더 통일 (2026-07-21)
   대상: Why Oracle / YOUR SKIN CONCERN / Location / Consultation 등
        "영문 eyebrow + 한글 제목" 쌍. eyebrow 는 제목 바로 앞 형제다.

   고치는 문제 2가지
   1) 제목 서체: oracle.css 의 Pretendard 규칙이 `.oracle-main` 하위로만 걸려 있어
      그 밖의 섹션(오시는 길·상담)은 그누보드 default.css 의
      `h1~h6 { font-family:"Malgun Gothic" }` 로 떨어졌다.
   2) eyebrow: 크기(11/13px)·굵기(400/600)·자간·색이 제각각이고,
      Tailwind arbitrary 유틸(tracking-[0.2em] 등)이 컴파일본에 일부만 존재해
      같은 클래스인데도 자간이 적용되는 곳과 안 되는 곳이 갈렸다.
   ========================================================================== */

/* 1) 제목 서체를 테마 기본(Pretendard)으로 되돌린다.
      클래스 선택자라 default.css 의 요소 선택자(h1~h6)보다 우선한다. */
.oracle-home-section-title {
    font-family: var(--font-family);
}

/* 2) eyebrow 통일: 13px / semibold / 자간 0.2em / point 색.
      `:has()` 로 "제목 바로 앞 형제"를 잡아 마크업 수정 없이 적용한다. */
p:has(+ .oracle-home-section-title) {
    font-family: var(--font-family);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    /* oracle.css 의 `.text-sub { color: ... !important }` 를 이겨야 하므로 색만 !important */
    color: var(--accent-point) !important;
}