/* ====================================
   Enhanced Mobile Responsive Design
   더욱 정밀한 모바일 반응형 개선
   ==================================== */

/* ====================================
   초소형 모바일 (320px - iPhone SE, Galaxy Fold)
   ==================================== */
@media (max-width: 360px) {
    :root {
        /* 더 작은 기본 폰트 */
        font-size: 13px;
    }
    
    /* 로고 텍스트 크기 조정 */
    .logo h1 {
        font-size: 1rem !important;
    }
    
    .logo-subtitle {
        font-size: 0.65rem !important;
    }
    
    /* 페이지 타이틀 */
    .page-title {
        font-size: 1.5rem !important;
        line-height: 1.3 !important;
    }
    
    .page-subtitle {
        font-size: 0.85rem !important;
    }
    
    /* 섹션 타이틀 */
    .section-title {
        font-size: 1.4rem !important;
        line-height: 1.3 !important;
    }
    
    .section-description {
        font-size: 0.85rem !important;
    }
    
    /* 버튼 */
    .btn {
        font-size: 0.85rem !important;
        padding: 0.875rem 1.25rem !important;
    }
    
    /* 카드 제목 */
    .product-title,
    .value-card h3,
    .about-menu-card h3 {
        font-size: 1rem !important;
    }
    
    /* 본문 텍스트 */
    p, li, .product-description {
        font-size: 0.875rem !important;
        line-height: 1.6 !important;
    }
    
    /* 컨테이너 패딩 최소화 */
    .container {
        padding: 0 0.75rem !important;
    }
    
    /* 카드 패딩 */
    .product-card,
    .value-card,
    .about-menu-card {
        padding: 1rem !important;
    }
    
    /* 폼 입력 필드 */
    .form-group input,
    .form-group select,
    .form-group textarea {
        font-size: 0.875rem !important;
    }
}

/* ====================================
   소형 모바일 (361px - 414px) 
   iPhone 12 mini, Galaxy S21
   ==================================== */
@media (min-width: 361px) and (max-width: 414px) {
    :root {
        font-size: 14px;
    }
    
    .page-title {
        font-size: 1.75rem !important;
        line-height: 1.25 !important;
    }
    
    .section-title {
        font-size: 1.5rem !important;
        line-height: 1.3 !important;
    }
    
    .product-title,
    .value-card h3 {
        font-size: 1.1rem !important;
    }
    
    p, li {
        font-size: 0.9rem !important;
    }
    
    .container {
        padding: 0 1rem !important;
    }
}

/* ====================================
   중형 모바일 (415px - 480px)
   iPhone 14, Galaxy S22
   ==================================== */
@media (min-width: 415px) and (max-width: 480px) {
    :root {
        font-size: 14.5px;
    }
    
    .page-title {
        font-size: 2rem !important;
        line-height: 1.3 !important;
    }
    
    .section-title {
        font-size: 1.6rem !important;
    }
    
    .product-title {
        font-size: 1.15rem !important;
    }
    
    p, li {
        font-size: 0.95rem !important;
    }
}

/* ====================================
   대형 모바일 (481px - 599px)
   iPhone 14 Pro Max, Galaxy S22 Ultra
   ==================================== */
@media (min-width: 481px) and (max-width: 599px) {
    :root {
        font-size: 15px;
    }
    
    .page-title {
        font-size: 2.25rem !important;
    }
    
    .section-title {
        font-size: 1.75rem !important;
    }
    
    /* 2열 그리드 가능 */
    .products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1rem !important;
    }
    
    .company-info-grid,
    .info-cards-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* ====================================
   소형 태블릿 (600px - 768px)
   iPad Mini
   ==================================== */
@media (min-width: 600px) and (max-width: 768px) {
    :root {
        font-size: 15.5px;
    }
    
    .products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1.5rem !important;
    }
    
    .company-info-grid,
    .info-cards-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    .about-menu-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* ====================================
   가로 모드 모바일 (Landscape)
   ==================================== */
@media (max-height: 500px) and (orientation: landscape) {
    /* 네비게이션 높이 줄이기 */
    .header {
        padding: 0.5rem 0 !important;
    }
    
    .nav-container {
        min-height: 60px !important;
    }
    
    /* Hero 섹션 높이 줄이기 */
    .page-hero {
        padding: 3rem 0 !important;
        min-height: auto !important;
    }
    
    .page-title {
        font-size: 1.75rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    /* 섹션 패딩 줄이기 */
    section {
        padding: 2rem 0 !important;
    }
}

/* ====================================
   텍스트 정렬 및 줄바꿈 개선
   ==================================== */
@media (max-width: 768px) {
    /* 모든 텍스트 요소에 단어 줄바꿈 개선 */
    h1, h2, h3, h4, h5, h6,
    p, li, span, a {
        word-wrap: break-word !important;
        word-break: keep-all !important;
        overflow-wrap: break-word !important;
        hyphens: auto !important;
    }
    
    /* 영문 텍스트는 단어 단위로 줄바꿈 */
    :lang(en) h1, :lang(en) h2, :lang(en) h3,
    :lang(en) p, :lang(en) li {
        word-break: break-word !important;
    }
    
    /* 긴 단어나 URL 강제 줄바꿈 */
    .product-description,
    .value-card p,
    .about-menu-card p {
        word-break: break-word !important;
    }
    
    /* 테이블 텍스트 */
    table {
        font-size: 0.85rem !important;
    }
    
    th, td {
        padding: 0.5rem !important;
        word-break: break-word !important;
    }
}

/* ====================================
   특정 디바이스 최적화
   ==================================== */

/* iPhone SE (375x667) */
@media (width: 375px) and (height: 667px) {
    .page-title {
        font-size: 1.85rem !important;
    }
    
    .section-title {
        font-size: 1.55rem !important;
    }
}

/* iPhone 12/13/14 (390x844) */
@media (width: 390px) and (height: 844px) {
    .page-title {
        font-size: 1.95rem !important;
    }
    
    .section-title {
        font-size: 1.65rem !important;
    }
}

/* iPhone 14 Pro Max (430x932) */
@media (width: 430px) and (height: 932px) {
    .products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* Galaxy S20/S21 (360x800, 360x740) */
@media (width: 360px) {
    .page-title {
        font-size: 1.7rem !important;
    }
    
    .container {
        padding: 0 0.875rem !important;
    }
}

/* ====================================
   폰트 크기 Fine-tuning
   ==================================== */
@media (max-width: 768px) {
    /* Hero 섹션 */
    .hero-title {
        font-size: clamp(1.5rem, 5vw, 2.5rem) !important;
        line-height: 1.25 !important;
    }
    
    .hero-subtitle {
        font-size: clamp(0.9rem, 3vw, 1.1rem) !important;
    }
    
    /* 페이지 Hero */
    .page-title {
        font-size: clamp(1.75rem, 6vw, 2.5rem) !important;
        line-height: 1.3 !important;
        margin-bottom: 0.5rem !important;
    }
    
    .page-subtitle {
        font-size: clamp(0.85rem, 2.5vw, 1.1rem) !important;
    }
    
    /* 섹션 헤더 */
    .section-title {
        font-size: clamp(1.4rem, 5vw, 2rem) !important;
        line-height: 1.3 !important;
        margin-bottom: 0.75rem !important;
    }
    
    .section-description {
        font-size: clamp(0.85rem, 2.5vw, 1rem) !important;
        line-height: 1.6 !important;
    }
    
    /* 카드 제목 */
    .product-title,
    .value-card h3,
    .about-menu-card h3 {
        font-size: clamp(1rem, 4vw, 1.25rem) !important;
        line-height: 1.3 !important;
    }
    
    /* 본문 텍스트 */
    .product-description,
    .value-card p,
    .about-menu-card p,
    .info-text {
        font-size: clamp(0.875rem, 2.5vw, 1rem) !important;
        line-height: 1.6 !important;
    }
    
    /* Feature 리스트 */
    .product-features li,
    .value-card ul li {
        font-size: clamp(0.85rem, 2.5vw, 0.95rem) !important;
    }
    
    /* 버튼 */
    .btn,
    .category-tab,
    .inquiry-tab {
        font-size: clamp(0.85rem, 2.5vw, 1rem) !important;
    }
    
    /* 네비게이션 */
    .nav-link {
        font-size: clamp(0.95rem, 3vw, 1.1rem) !important;
    }
    
    /* 로고 */
    .logo h1 {
        font-size: clamp(1rem, 4vw, 1.3rem) !important;
    }
    
    .logo-subtitle {
        font-size: clamp(0.65rem, 2vw, 0.85rem) !important;
    }
    
    /* Footer */
    .footer-title {
        font-size: clamp(1rem, 3.5vw, 1.2rem) !important;
    }
    
    .footer-info li,
    .footer-legal {
        font-size: clamp(0.8rem, 2vw, 0.9rem) !important;
    }
}

/* ====================================
   라인 높이 개선 (가독성)
   ==================================== */
@media (max-width: 768px) {
    h1, h2, h3, h4, h5, h6 {
        line-height: 1.3 !important;
        margin-bottom: 0.75rem !important;
    }
    
    p {
        line-height: 1.65 !important;
        margin-bottom: 1rem !important;
    }
    
    li {
        line-height: 1.6 !important;
        margin-bottom: 0.5rem !important;
    }
}

/* ====================================
   간격 조정
   ==================================== */
@media (max-width: 480px) {
    /* 섹션 간격 */
    section {
        padding: 2.5rem 0 !important;
    }
    
    /* 카드 간격 */
    .products-grid,
    .info-cards-grid,
    .about-menu-grid {
        gap: 1rem !important;
    }
    
    /* 내부 패딩 */
    .product-card,
    .value-card,
    .about-menu-card {
        padding: 1.25rem !important;
    }
    
    .product-content {
        padding: 1.25rem !important;
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    section {
        padding: 3rem 0 !important;
    }
    
    .products-grid,
    .info-cards-grid {
        gap: 1.5rem !important;
    }
    
    .product-card,
    .value-card {
        padding: 1.5rem !important;
    }
}

/* ====================================
   터치 영역 최적화
   ==================================== */
@media (max-width: 768px) {
    /* 버튼 최소 크기 */
    .btn,
    .category-tab,
    .inquiry-tab,
    .nav-link {
        min-height: 44px !important;
        padding: 0.75rem 1.25rem !important;
    }
    
    /* 입력 필드 */
    input, select, textarea {
        min-height: 44px !important;
        font-size: 16px !important; /* iOS zoom 방지 */
    }
    
    /* 체크박스/라디오 */
    input[type="checkbox"],
    input[type="radio"] {
        min-width: 20px !important;
        min-height: 20px !important;
    }
}

/* ====================================
   스크롤 개선
   ==================================== */
@media (max-width: 768px) {
    /* 부드러운 스크롤 */
    html {
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }
    
    /* 가로 스크롤 탭 */
    .category-tabs,
    .inquiry-tabs,
    .about-tabs {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        padding-bottom: 0.5rem;
    }
    
    /* 스크롤바 스타일 (webkit) */
    .category-tabs::-webkit-scrollbar,
    .inquiry-tabs::-webkit-scrollbar,
    .about-tabs::-webkit-scrollbar {
        height: 4px;
    }
    
    .category-tabs::-webkit-scrollbar-thumb,
    .inquiry-tabs::-webkit-scrollbar-thumb,
    .about-tabs::-webkit-scrollbar-thumb {
        background: var(--primary-color);
        border-radius: 2px;
    }
}

/* ====================================
   이미지 최적화
   ==================================== */
@media (max-width: 768px) {
    img {
        max-width: 100% !important;
        height: auto !important;
    }
    
    .product-image {
        height: auto !important;
        min-height: 200px !important;
        max-height: 300px !important;
    }
    
    .logo-image {
        width: auto !important;
        max-width: 50px !important;
        height: auto !important;
    }
}

/* ====================================
   중국어/일본어 폰트 최적화
   ==================================== */
@media (max-width: 768px) {
    /* 일본어 */
    :lang(ja) {
        line-height: 1.75 !important;
        letter-spacing: 0.02em !important;
    }
    
    :lang(ja) h1, :lang(ja) h2, :lang(ja) h3 {
        line-height: 1.4 !important;
    }
    
    /* 중국어 */
    :lang(zh) {
        line-height: 1.7 !important;
        letter-spacing: 0.01em !important;
    }
    
    :lang(zh) h1, :lang(zh) h2, :lang(zh) h3 {
        line-height: 1.35 !important;
    }
}