/* ════════════════════════════════════════════════════════════════
   onefix — 모듈 반응형 스타일
   폰트 크기는 각 모듈 인라인 min()으로 자동 스케일됩니다.
   이 파일은 구조적 레이아웃(패딩·정렬·방향)만 담당합니다.
════════════════════════════════════════════════════════════════ */

/* ── Hero ─────────────────────────────────────────────────── */

@media (max-width: 768px) {
    /* 콘텐츠 내부 패딩 축소 */
    .hero-content {
        padding: 3rem 1.25rem !important;
    }

    /* 버튼 그룹: 모바일에서 줄 바꿈 허용 + 가운데 정렬 */
    .hero-btn-group {
        flex-wrap: wrap !important;
        justify-content: center !important;
    }
}

@media (max-width: 480px) {
    /* 버튼: 너무 좁아지지 않도록 최소 너비 보장 */
    .hero-btn-group a {
        min-width: 140px;
        justify-content: center;
    }
}

/* ── Text Columns ──────────────────────────────────────────── */

@media (max-width: 768px) {
    /* 3~4 컬럼: 태블릿에서 2열로 */
    .tc-grid[data-cols="3"],
    .tc-grid[data-cols="4"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    /* 모바일: 모든 컬럼 단일 열 */
    .tc-grid {
        grid-template-columns: 1fr !important;
    }
}