/* Explain: Styles for mobile screen optimization. */
/* 전 사이트 모바일 전용 보기 개선 — 헤더 간격, 메뉴 터치 영역, 카드·조직도·회의 일정 가독성, 히어로, 타이포그래피.
   css/responsive.css 뒤에 로드되어 모바일 구간에서만 섬세하게 다듬습니다. */

/* ── 모바일 공통(≤767px) ── */
@media (max-width: 767px) {
    html {
        scroll-padding-top: 10rem;
    }

    .container-x {
        padding-inline: 1rem;
    }

    .section-pad {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .page-hero {
        padding-top: 10.5rem;
        padding-bottom: 2.5rem;
    }

    /* 히어로 캐러셀 — 고정 헤더를 가리지 않도록 위쪽 여백 확보 */
    .hero-carousel {
        min-height: 36rem;
    }

    .hero-slide {
        padding-top: 11rem;
        padding-bottom: 7rem;
    }

    .hero-nav-btn {
        height: 2.4rem;
        width: 2.4rem;
        font-size: 0.85rem;
    }

    .hero-quicklink {
        padding: 0.5rem 0.7rem;
    }

    /* 퀵 아이콘 그리드 */
    .quick-item {
        min-height: 5.25rem;
        padding: 0.7rem 0.3rem;
    }

    /* 소식·일정 패널, 공지 행 */
    .news-panel {
        padding: 1.1rem;
    }

    .notice-item {
        gap: 0.6rem;
        padding: 0.8rem 0.95rem;
    }

    .schedule-date {
        min-width: 3.5rem;
        padding: 0.5rem 0.4rem;
    }

    .schedule-date span:last-child {
        font-size: 1.45rem;
    }

    /* 카드형 콘텐츠 여백 */
    .affiliate-card,
    .project-card,
    .policy-card,
    .archive-card {
        padding: 1.25rem;
    }

    .affiliate-card-head {
        gap: 0.85rem;
    }

    .affiliate-logo {
        height: 3.25rem;
        width: 3.25rem;
    }

    .member-card {
        padding: 1.1rem;
    }

    .stat-card,
    .unit-card {
        padding: 1.1rem;
    }

    /* 조직도·임원 */
    .org-node {
        padding: 1.35rem 1.1rem;
    }

    .org-node img,
    .org-node figure img,
    .org-node .photo-wrapper img {
        width: 5.25rem !important;
        height: 5.25rem !important;
    }

    .org-committee-card {
        padding: 1.15rem;
    }

    .org-person {
        gap: 0.6rem;
        padding: 0.75rem 0.85rem;
    }

    /* 표·자료실 목록 가로 스크롤 안전 처리 */
    .table-responsive {
        margin-inline: -1rem;
        padding-inline: 1rem;
    }

    .resource-row {
        padding: 0.9rem 1rem;
    }

    .resource-icon {
        height: 2.6rem;
        width: 2.6rem;
    }

    /* 모바일 전체화면 메뉴 터치 영역 */
    #navOverlay .nav-close-link {
        min-height: 3rem;
    }
}

/* ── 좁은 화면 타이포그래피(≤639px, Tailwind sm 이전 구간) ── */
@media (max-width: 639px) {
    .section-pad h2 {
        font-size: 1.5rem;
        line-height: 1.4;
    }

    .hero-slide h1 {
        font-size: 1.8rem;
        line-height: 1.3;
    }

    .hero-badge {
        font-size: 0.72rem;
        padding: 0.32rem 0.8rem;
    }

    .quick-item span {
        font-size: 0.78rem;
    }
}

/* ── 초소형 화면(≤420px) ── */
@media (max-width: 420px) {
    .section-pad h2 {
        font-size: 1.4rem;
    }

    .hero-slide h1 {
        font-size: 1.65rem;
    }

    .quick-item span {
        font-size: 0.74rem;
    }

    .mobile-cta-btn {
        font-size: 0.8rem;
    }
}