/* VSE Standard Styles */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@300;400;500;600;700&display=swap');

:root {
  --primary-bg: #F2EFE9;
  --primary-text: #4B3621;
  --accent-olive: #6B705C;
}

body {
  font-family: 'Noto Serif KR', serif;
  background-color: var(--primary-bg);
  color: var(--primary-text);
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Hide default scrollbar */
::-webkit-scrollbar {
  display: none !important;
}

html {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Standard Spacing Utilities */
/* Mobile: py-24 (96px) / Desktop: py-32 (128px) */
.section-padding {
  padding-top: 6rem;
  /* 96px (Mobile) */
  padding-bottom: 6rem;
}

@media (min-width: 768px) {
  .section-padding {
    padding-top: 8rem;
    /* 128px (Desktop) */
    padding-bottom: 8rem;
  }
}

/* 정보 덩어리 브릿지: Mobile mt-24(96px) / Desktop mt-32(128px) */
.section-gap {
  margin-top: 6rem;
}

@media (min-width: 768px) {
  .section-gap {
    margin-top: 8rem;
  }
}

/* 모바일 컴포넌트 수직 간격 오버라이드 */
@media (max-width: 767px) {
  .mobile-mb-title {
    margin-bottom: 1.5rem !important;
  }

  /* 제목→이미지: 24px */
  .mobile-mb-image {
    margin-bottom: 2rem !important;
  }

  /* 이미지→본문: 32px */
  .mobile-chunk-gap {
    margin-bottom: 8rem !important;
  }

  /* 독립 아이템 구분: 128px */
}

/* Base Line Height for VSE */
p,
span,
h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.6;
}

/* Utilities */
.break-keep {
  word-break: keep-all;
}

.break-words {
  overflow-wrap: break-word;
  word-break: break-word;
}

.keep-all {
  word-break: keep-all;
}

/* Global Text Rules */
p,
h1,
h2,
h3,
h4,
h5,
h6,
span {
  word-break: keep-all;
  overflow-wrap: break-word;
}


/* High-End Interactions */
.hover-reveal {
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.hover-reveal:hover {
  transform: scale(1.05);
}

/* Mobile Layout Reordering */
@media (max-width: 768px) {
  .vse-mobile-reorder-container {
    display: flex !important;
    flex-direction: column !important;
  }

  .vse-mobile-contents {
    display: contents !important;
  }

  .vse-mobile-reorder-subheading {
    order: 1 !important;
    margin-bottom: 8px !important;
    /* 표준 간격: 소제목 -> 이미지 */
  }

  .vse-mobile-reorder-image {
    order: 2 !important;
    margin-bottom: 16px !important;
    /* 표준 간격: 이미지 -> 본문 */
  }

  .vse-mobile-reorder-body {
    order: 3 !important;
    margin-bottom: 0 !important;
  }
}