/* 반응형 디자인 - 로얄에어멤버스 */

/* 모바일 우선 접근법 */

/* 작은 모바일 기기 (320px - 480px) */
@media (max-width: 480px) {
    /* 네비게이션 */
    nav .max-w-7xl {
        padding-left: 16px;
        padding-right: 16px;
    }
    
    nav .text-2xl {
        font-size: 1.5rem;
    }
    
    /* 히어로 섹션 */
    #hero {
        min-height: 100vh;
        padding: 80px 16px 40px;
    }
    
    #hero h1 {
        font-size: 2.5rem;
        line-height: 1.2;
        margin-bottom: 20px;
    }
    
    #hero p {
        font-size: 1rem;
        margin-bottom: 32px;
    }
    
    #hero .flex {
        flex-direction: column;
        gap: 16px;
    }
    
    #hero button {
        padding: 16px 24px;
        font-size: 1rem;
        width: 100%;
    }
    
    /* 섹션 패딩 */
    section {
        padding: 60px 0;
    }
    
    .max-w-7xl {
        padding-left: 16px;
        padding-right: 16px;
    }
    
    /* 제목 크기 조정 */
    .text-4xl, .text-5xl {
        font-size: 2rem;
        line-height: 1.3;
    }
    
    .text-3xl {
        font-size: 1.5rem;
    }
    
    .text-2xl {
        font-size: 1.25rem;
    }
    
    /* 그리드 레이아웃 */
    .grid {
        gap: 20px;
    }
    
    .md\:grid-cols-2,
    .md\:grid-cols-3,
    .lg\:grid-cols-4 {
        grid-template-columns: 1fr;
    }
    
    /* 멤버십 카드 */
    .membership-card {
        padding: 24px;
        margin-bottom: 20px;
    }
    
    .membership-card.featured {
        transform: none;
    }
    
    .membership-card:hover {
        transform: translateY(-4px);
    }
    
    /* 항공기 카드 */
    .bg-white.rounded-xl {
        margin-bottom: 20px;
    }
    
    /* 연락처 폼 */
    .form-input {
        padding: 14px 16px;
        font-size: 16px; /* iOS에서 줌 방지 */
    }
    
    /* 푸터 */
    footer .grid {
        grid-template-columns: 1fr;
        gap: 32px;
        text-align: center;
    }
    
    footer .flex {
        flex-direction: column;
        gap: 16px;
        align-items: center;
    }
}

/* 모바일 기기 (481px - 768px) */
@media (min-width: 481px) and (max-width: 768px) {
    /* 히어로 섹션 */
    #hero h1 {
        font-size: 3rem;
        line-height: 1.2;
    }
    
    #hero p {
        font-size: 1.125rem;
    }
    
    /* 버튼 그룹 */
    #hero .flex {
        flex-direction: row;
        justify-content: center;
        gap: 16px;
    }
    
    #hero button {
        padding: 14px 28px;
        font-size: 1rem;
        min-width: 140px;
    }
    
    /* 그리드 레이아웃 */
    .md\:grid-cols-2 {
        grid-template-columns: 1fr;
    }
    
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* 멤버십 카드 스타일 */
    .membership-card {
        padding: 28px;
    }
    
    /* 통계 섹션 */
    .stat-number {
        font-size: 2.5rem;
    }
}

/* 태블릿 (769px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    /* 네비게이션 */
    nav .space-x-8 > * + * {
        margin-left: 24px;
    }
    
    /* 히어로 섹션 */
    #hero h1 {
        font-size: 4rem;
        line-height: 1.1;
    }
    
    #hero p {
        font-size: 1.25rem;
    }
    
    /* 섹션 간격 */
    section {
        padding: 80px 0;
    }
    
    /* 그리드 레이아웃 */
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
    }
    
    .md\:grid-cols-3 {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
    
    /* 멤버십 카드 */
    .membership-card {
        padding: 32px;
    }
    
    /* 회사 소개 섹션 */
    .md\:grid-cols-2 {
        grid-template-columns: 1fr 1fr;
        gap: 48px;
    }
}

/* 데스크톱 (1025px - 1440px) */
@media (min-width: 1025px) and (max-width: 1440px) {
    /* 컨테이너 최대 너비 */
    .max-w-7xl {
        max-width: 1200px;
    }
    
    /* 히어로 섹션 */
    #hero h1 {
        font-size: 5rem;
        line-height: 1.1;
    }
    
    /* 섹션 간격 */
    section {
        padding: 100px 0;
    }
    
    /* 그리드 간격 */
    .grid {
        gap: 32px;
    }
    
    /* 카드 호버 효과 강화 */
    .card:hover {
        transform: translateY(-12px);
    }
    
    .membership-card:hover {
        transform: translateY(-16px) scale(1.03);
    }
}

/* 대형 데스크톱 (1441px+) */
@media (min-width: 1441px) {
    /* 컨테이너 최대 너비 */
    .max-w-7xl {
        max-width: 1400px;
    }
    
    /* 히어로 섹션 */
    #hero h1 {
        font-size: 6rem;
        line-height: 1.0;
    }
    
    #hero p {
        font-size: 1.5rem;
    }
    
    /* 섹션 간격 */
    section {
        padding: 120px 0;
    }
    
    /* 그리드 간격 */
    .grid {
        gap: 40px;
    }
    
    /* 카드 크기 조정 */
    .membership-card {
        padding: 40px;
    }
    
    /* 프리미엄 아이콘 크기 */
    .premium-icon {
        width: 100px;
        height: 100px;
    }
}

/* 가로형 모바일 (landscapeorientation) */
@media (max-height: 500px) and (orientation: landscape) {
    #hero {
        min-height: 100vh;
        padding: 60px 20px 20px;
    }
    
    #hero h1 {
        font-size: 2.5rem;
        margin-bottom: 16px;
    }
    
    #hero p {
        font-size: 1rem;
        margin-bottom: 24px;
    }
    
    #hero .flex {
        flex-direction: row;
        gap: 16px;
    }
    
    #hero button {
        padding: 12px 24px;
        font-size: 0.9rem;
    }
}

/* 고해상도 디스플레이 */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* 아이콘 및 이미지 선명도 향상 */
    .premium-icon,
    .hero-bg {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* 터치 디바이스 최적화 */
@media (hover: none) and (pointer: coarse) {
    /* 터치 타겟 크기 확대 */
    button,
    a,
    input,
    textarea,
    select {
        min-height: 44px;
        min-width: 44px;
    }
    
    /* 호버 효과 제거 */
    .card:hover,
    .membership-card:hover,
    .premium-icon:hover {
        transform: none;
        box-shadow: initial;
    }
    
    /* 터치 피드백 */
    button:active,
    a:active {
        transform: scale(0.98);
        transition: transform 0.1s ease;
    }
}

/* 다크 모드 반응형 */
@media (prefers-color-scheme: dark) {
    @media (max-width: 768px) {
        nav {
            background-color: rgba(17, 24, 39, 0.95);
        }
        
        .form-input {
            background: rgba(17, 24, 39, 0.8);
            border-color: rgba(75, 85, 99, 0.3);
        }
    }
}

/* 접근성 - 고대비 모드 */
@media (prefers-contrast: high) {
    .text-gold-600,
    .text-gold-500,
    .text-gold-400 {
        color: #d97706 !important;
        font-weight: 700;
    }
    
    .bg-gold-600 {
        background-color: #d97706 !important;
    }
    
    button,
    .card {
        border: 2px solid #d97706;
    }
}

/* 애니메이션 감소 모드 */
@media (prefers-reduced-motion: reduce) {
    .card,
    .membership-card,
    .premium-icon,
    button {
        transition: none !important;
        transform: none !important;
        animation: none !important;
    }
    
    .hero-bg {
        background-attachment: scroll !important;
    }
}

/* 세로 모드 최적화 */
@media (orientation: portrait) {
    .md\:grid-cols-2 {
        grid-template-columns: 1fr;
    }
    
    @media (max-width: 768px) {
        .lg\:grid-cols-4 {
            grid-template-columns: 1fr;
        }
        
        .md\:grid-cols-3 {
            grid-template-columns: 1fr;
        }
    }
}

/* 가로 모드 최적화 */
@media (orientation: landscape) {
    @media (min-width: 768px) {
        .lg\:grid-cols-4 {
            grid-template-columns: repeat(4, 1fr);
        }
        
        .md\:grid-cols-3 {
            grid-template-columns: repeat(3, 1fr);
        }
    }
}

/* 폴더블 디바이스 지원 */
@media (spanning: single-fold-vertical) {
    .max-w-7xl {
        max-width: calc(100vw - 40px);
    }
    
    .grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (spanning: single-fold-horizontal) {
    #hero {
        height: 100vh;
    }
    
    section {
        padding: 60px 0;
    }
}

/* 컨테이너 쿼리 지원 (실험적) */
@container (max-width: 400px) {
    .membership-card {
        padding: 20px;
    }
    
    .text-3xl {
        font-size: 1.25rem;
    }
}

/* 미디어 기능 지원 확인 */
@supports (display: grid) {
    .grid-fallback {
        display: none;
    }
}

@supports not (display: grid) {
    .grid {
        display: flex;
        flex-wrap: wrap;
    }
    
    .grid > * {
        flex: 1 1 300px;
        margin: 10px;
    }
}

/* iOS Safari 최적화 */
@supports (-webkit-touch-callout: none) {
    /* iOS에서 100vh 문제 해결 */
    #hero {
        height: -webkit-fill-available;
    }
    
    /* iOS에서 폰트 크기 자동 조정 방지 */
    body {
        -webkit-text-size-adjust: 100%;
    }
}

/* 인쇄 최적화 */
@media print {
    @page {
        margin: 2cm;
    }
    
    #hero {
        height: auto;
        min-height: auto;
        page-break-after: always;
    }
    
    section {
        padding: 20px 0;
        page-break-inside: avoid;
    }
    
    .grid {
        display: block;
    }
    
    .card,
    .membership-card {
        margin-bottom: 20px;
        page-break-inside: avoid;
        box-shadow: none;
        border: 1px solid #ccc;
    }
    
    nav,
    footer,
    .no-print {
        display: none !important;
    }
}