/*==========================================
📌 상단 커버 노출시 데이터베이스 h1 숨김*/
/* [1] */
.super-content-header h1:first-of-type,
.super-content-header__content,
.notion-header__title {
  display: none !important;
}
/* [2] 본문 내의 H1은 강제로 다시 살리기 */
main .super-content h1,
.notion-page__content h1,
.notion-header + .notion-page__content h1 {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
}
/* [3] 본문 H1의 글자 크기를 시스템 변수와 동기화 (변수명 수정) */
.notion-page__content h1 {
  font-size: var(--pc-h1-size) !important; 
  font-weight: var(--pc-h1-weight) !important;
  line-height: var(--pc-h1-line) !important;
  letter-spacing: var(--pc-h1-letter) !important;
}
@media (max-width: 768px) {
  .notion-page__content h1 {
    font-size: var(--mb-h1-size) !important;
    line-height: var(--mb-h1-line) !important;
    letter-spacing: var(--mb-h1-letter) !important;
  }
}
/*========================================== 
📌 커버 이미지 화이트 풀와이드 배경
- 섹션 설정 
=========================================*/
.notion-callout:not(.bg-gray-light):has(h1, h2) {
    position: relative !important;
    background: transparent !important;
    border: none !important;
    
    /* 상단 밀착 및 하단 확장용 패딩 */
    margin-top: -65px !important; 
    margin-bottom: 0px !important; 
    padding: 50px 0 0px 0 !important; /* 하단 패딩을 크게 주어 아래 영역까지 포함 */
    
    width: 100vw !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}

/* 배경 레이어 - 하단으로 여유 있게 확장 */
.notion-callout:not(.bg-gray-light):has(h1, h2)::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100% !important; /* 위에서 준 padding(50+80)만큼 높이 자동 확보 */
    background-color: #ffffff !important;
    z-index: -1 !important;
}

/* 내부 콘텐츠 제어 */
.notion-callout:not(.bg-gray-light):has(h1, h2) > .notion-callout__content {
    max-width: 1150px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
/* [모바일 그리드 정렬 수정] */
@media (max-width: 768px) {
.notion-callout:not(.bg-gray-light):has(h1, h2) > .notion-callout__content
{
        /* 기존 20px에서 모바일 그리드에 맞춰 33px~40px로 조정 */
        padding-left: 33px !important;
        padding-right: 33px !important;
    }
    
    /* 혹시 모바일에서 가로 스크롤이 생긴다면 추가 */
    body {
        overflow-x: hidden !important;
    }
}