/* =====================================================================
   비급여 진료 항목 (noncovered) — Figma `비급여 진료 항목 · Desktop` 248:5622 (2026-09-29 리터치)
   공통(site.css · sub.css)과 다른 부분만 #price / 페이지 범위로 지정 (artifact 빌드에서는 전역 병합되므로 스코프 필수)
   ===================================================================== */

/* ---------- Price List (248:5625): 컨테이너 960 · 요소 간격 40 ---------- */
#price .container{width:min(960px,100% - var(--pad)*2)}
/* Heading Title(공통 h2 행 75 · #3F3732 / 이탤릭 #685F59) → 아래 40 · 기준일 오른쪽 정렬 → 아래 40 · 표 */
#price .sec-head{margin-bottom:40px}
#price .sec-head .title{flex:1;flex-direction:column;align-self:stretch;align-items:stretch;gap:40px}
#price .sec-head .title p{font-size:15px;line-height:1.7;color:var(--text-2);text-align:right}
#price .sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 표: 그룹마다 헤더 행(그룹명 · '비용') — 잉크 라인 · 항목 행은 헤어라인 · 금액 Cormorant 24 베이지
   (Figma 스트로크는 행 높이 안쪽 → 하단 패딩 1px 감산: 헤더 78 · 항목 67/92 · 행간 px 고정으로 선이 반픽셀에 걸리지 않게) */
#price .price-table .group th{padding:48px 8px 13px;border-bottom:1px solid var(--ink);font-size:12px;font-weight:500;line-height:16px;letter-spacing:.24em;text-transform:uppercase;text-align:left;color:var(--text-mid)}
#price .price-table .group th:last-child{padding-right:5px;text-align:right;color:var(--beige)}/* 자간 .24em 끝 여백 보정 */
#price .price-table td{padding:18px 8px 17px;border-bottom:1px solid var(--hair);font-size:16px;font-weight:400;line-height:27px;letter-spacing:-.01em;color:var(--text-mid)}
#price .price-table td.n{font-size:24px;font-weight:500;line-height:31px;letter-spacing:.02em;color:var(--beige)}
#price .price-table td.n small{margin-top:2px;font-size:13px;font-weight:400;line-height:23px;letter-spacing:-.01em;color:var(--text-2)}

/* 감수 라인: 오른쪽 정렬 · 본문 #6B6660 · 이름 #57524D · 점 린넨 */
#price .byline{justify-content:flex-end;margin-top:40px;gap:8px 18px;line-height:1.8;letter-spacing:-.01em;color:var(--text-2)}
#price .byline b{color:var(--text-mid)}
#price .byline span{gap:4px}
#price .byline span+span::before{margin-right:14px;background:var(--linen)}

/* Notice Box: 그레이지 · r8 · 정보 아이콘 + 13/150% */
#price .notice-box{display:flex;gap:10px;margin-top:40px;padding:14px 20px;border:0;border-radius:8px;background:var(--greige);font-size:13px;line-height:20px;letter-spacing:-.01em;color:var(--text-2)}
#price .notice-box svg{flex:0 0 auto;width:14px;height:14px;margin-top:3px}

/* FAQ (248:16717) 헤드는 공통 Heading Title 그대로(행 75 · 간격 20 · 설명 16 #57524D) */

/* ---------- Page CTA: 제목 #1E1B17 ---------- */
:is(body[data-page="noncovered"],#page-noncovered) .page-cta h2{color:var(--text)}

/* Figma 배너: h1 프레임 106(이탤릭 baseline 정렬로 글리프가 10px 아래) · 배너 높이 454 유지 — 데스크톱 전용(태블릿·모바일은 공통 page-hero 치수) */
@media (min-width:1280px){
:is(body[data-page="noncovered"],#page-noncovered) .page-hero h1 .en{padding-top:10px}
:is(body[data-page="noncovered"],#page-noncovered) .page-hero{padding-bottom:70px}
}

/* ===== Responsive ===== */
/* ---------- Tablet 768–1279 (Figma 398:37840): 상하 77 · 제목 44(공통) · 표는 데스크톱과 동일 치수 ---------- */
@media (max-width:1279px){
  /* Page hero: Figma 제목·국문명·설명이 7px 아래(데스크톱 10px 보정과 같은 이유) — 배너 높이 348 유지 */
  :is(body[data-page="noncovered"],#page-noncovered) .page-hero h1 .en{padding-top:7px}
  :is(body[data-page="noncovered"],#page-noncovered) .page-hero .container{margin-bottom:-7px}
  #price,:is(body[data-page="noncovered"],#page-noncovered) #faq{padding:77px 0}
  /* Page CTA: Figma 제목 30(모바일 24)/135% · 'Naon' #C2B093 */
  :is(body[data-page="noncovered"],#page-noncovered) .page-cta h2{line-height:1.35}
  :is(body[data-page="noncovered"],#page-noncovered) .page-cta h2 em{color:var(--beige)}
}
/* ---------- Mobile ≤767 (Figma 398:37875): 상하 61(FAQ 64) · 표는 2열 그대로 0.8배 축소(가로 스크롤 없음) ---------- */
@media (max-width:767px){
  :is(body[data-page="noncovered"],#page-noncovered) .page-hero h1 .en{padding-top:4px}
  :is(body[data-page="noncovered"],#page-noncovered) .page-hero .container{margin-bottom:-4px}
  #price{padding:61px 0}
  :is(body[data-page="noncovered"],#page-noncovered) #faq{padding:64px 0}
  #price .sec-head .title p{font-size:13px}
  #price .price-table .group th{padding:38.4px 6.4px 10.2px;font-size:11px;line-height:14px}
  #price .price-table .group th:last-child{padding-right:3.8px}
  #price .price-table td{padding:14.4px 6.4px 13.4px;font-size:13px;line-height:22px;word-break:keep-all}
  #price .price-table td.n{font-size:20px;line-height:26px}
  #price .price-table td.n small{margin-top:1.6px;font-size:11px;line-height:20px}
  #price .byline{font-size:11px}
  #price .notice-box{gap:8px;padding:11px 13px;border-radius:6px;font-size:11px;line-height:16.5px}
  #price .notice-box svg{width:11.3px;height:11.3px;margin-top:2.4px}
}
