/* 전체 요소 기본 설정 */
* {
  word-break: keep-all !important;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* 기본 폰트 사이즈: 1rem = 16px 기준 */
html {
  font-size: 100%; /* 1rem = 16px */
}

/* 컨테이너 너비 조정 */
.container, .site, .site-content, #main {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 1rem !important; /* 약 16px */
}

/* 모바일 (768px 이하) */
@media (max-width: 768px) {
  html {
    font-size: 87.5%; /* 1rem = 14px */
  }

  h1, .main-title {
    font-size: 2rem !important; /* 28px */
    font-weight: 900 !important;
    transform: scale(1.05);
    transform-origin: center;
    text-rendering: geometricPrecision;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  h2, h3 {
    font-size: 1.5rem !important; /* 24px */
  }

  h4, h5, h6 {
    font-size: 1.25rem !important; /* 20px */
  }

  p, .content-text {
    font-size: 1rem !important; /* 16px */
  }

  .section, .container, #main {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}

/* 더 작은 모바일 (480px 이하) */
@media (max-width: 480px) {
  html {
    font-size: 81.25%; /* 1rem = 13px */
  }

  h1, .main-title {
    font-size: 1.8rem !important; /* ~23px */
    font-weight: 900 !important;
    transform: scale(1.05);
    transform-origin: center;
    text-rendering: geometricPrecision;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  h2, h3 {
    font-size: 1.4rem !important; /* ~18px */
  }

  h4, h5, h6 {
    font-size: 1.2rem !important; /* ~15px */
  }

  p, .content-text {
    font-size: 0.95rem !important; /* ~12px */
  }

  .section, .container, #main {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }
}