.site-wrap {
  position: relative;
  overflow: clip;
  background: var(--color-bg);
}

.container {
  width: calc(100% - (var(--page-gutter) * 2));
  max-width: var(--container);
  margin-inline: auto;
}

.site-main {
  padding-top: var(--header-height);
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

:where([id]) {
  scroll-margin-top: calc(var(--header-height) + 18px);
}

.section {
  padding-block: 120px; /* 프리미엄 일관성 있는 넓은 섹션 패딩 */
}

.section--story,
.section--consult-guide,
.section--review-news,
.section--areas,
.care-system,
.section--faq {
  background: var(--color-white);
}

.section--event {
  background:
    linear-gradient(180deg, #eef4f0 0%, #f6f9f7 100%);
}

.section-head {
  max-width: 760px;
}

.section-head--left {
  margin-inline: 0;
  text-align: left;
}

.section-head h2 {
  color: var(--color-ink);
  font-size: inherit; /* design-system.css에서 표준 일괄 상속 */
  font-weight: inherit;
  line-height: inherit;
}

.section-head p {
  color: var(--color-muted);
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}


.text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--color-primary-dark);
  font-size: 14.72px;
  font-weight: 800;
}

.text-link::after {
  content: "";
  width: 18px;
  height: 10px;
  background: currentColor;
  clip-path: polygon(0 42%, 72% 42%, 72% 0, 100% 50%, 72% 100%, 72% 58%, 0 58%);
}

/* Include System Helper */
[data-include], #header:empty, #footer:empty, #quick:empty {
  display: contents;
}

/* SEO 상세페이지 내 공통 헤더 숨김 처리 (:has 가상 클래스로 조상 감지) */
body:has(.seo-page) .site-header,
body:has(.seo-page) [data-include="header"] {
  display: none !important;
}

body:has(.seo-page) .site-main,
.seo-page {
  padding-top: 0 !important;
}

/* SEO 상세페이지 내 .seo-hero 영역 디자인 오버라이드 (풀 배경 적용) */
.seo-page .seo-hero {
  background-image: linear-gradient(135deg, rgba(8, 12, 22, 0.88) 0%, rgba(8, 12, 22, 0.72) 100%),
                    url('../../assets/images/home-air-care-20260710/service-air-quality.webp') !important;
  background-size: cover !important;
  background-position: center 25% !important;
  background-repeat: no-repeat !important;
  position: relative;
  overflow: hidden;
}

/* 우측 초록색 테두리에 담겨있던 실물 이미지 박스 강제 숨김 */
.seo-page .seo-hero__media {
  display: none !important;
}

/* 실물 이미지가 숨겨짐에 따라 좌측 본문 영역을 전체 1열 너비로 최적화 */
.seo-page .seo-hero__inner {
  grid-template-columns: 1fr !important;
  max-width: 800px;
}

/* 흰색 버튼 내에 글자가 흰색으로 묻혀 안 보이는 버그 복구 (어두운 글씨색 강제 지정) */
.seo-page .seo-btn--primary {
  background: #ffffff !important;
  color: #0c1222 !important;
}
