/**
 * ADONG HOMEPAGE - MOBILE PERFORMANCE OPTIMIZATIONS
 * PHASE 4A - Common utility classes for better performance
 */

/* ==========================================
 * PERFORMANCE UTILITY CLASSES (PHASE 4A)
 * ========================================== */

/* 텍스트 안전장치 공통 클래스 */
.text-safe {
  max-width: calc(100vw - 32px) !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  word-break: keep-all !important; /* 한국어 단어 보호 */
  hyphens: auto !important;
  white-space: normal !important;
  padding: 0 16px !important;
  box-sizing: border-box !important;
  line-height: 1.6 !important; /* 한국어 최적 줄간격 */
}

/* 반응형 타이포그래피 공통 클래스 */
.text-responsive-title {
  font-size: clamp(1.375rem, 6vw, 3rem) !important;
  line-height: 1.3 !important;
}

.text-responsive-subtitle {
  font-size: clamp(1.125rem, 5vw, 2.25rem) !important;
  line-height: 1.3 !important;
}

.text-responsive-body {
  font-size: clamp(0.875rem, 4vw, 1.25rem) !important;
  line-height: 1.5 !important;
}

/* 안전한 컨테이너 공통 클래스 */
.container-safe {
  width: 100% !important;
  max-width: calc(100vw - 32px) !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
  box-sizing: border-box !important;
}

/* Flexbox 레이아웃 공통 클래스 */
.flex-center-column {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1rem, 4vw, 2rem) !important;
}

.flex-text-safe {
  width: 100% !important;
  flex-shrink: 0 !important;
  text-align: center !important;
}

/* GPU 가속화 (성능 최적화) */
.gpu-accelerated {
  transform: translateZ(0);
  will-change: transform;
}

/* 터치 최적화 */
.touch-friendly {
  min-height: 44px !important;
  min-width: 44px !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

/* 이미지/비디오 최적화 */
.media-responsive {
  max-width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 auto !important;
}

/* ==========================================
 * PERFORMANCE HINTS
 * ========================================== */

/* 중요한 요소들에 대한 렌더링 힌트 */
.performance-critical {
  contain: layout style;
  content-visibility: auto;
}

/* 지연 로딩이 필요한 요소들 */
.lazy-load {
  content-visibility: auto;
  contain-intrinsic-size: 0 400px;
}