/* 모바일 반응형 오버라이드 — 768px 이하에서만 적용 (데스크톱 디자인 불변) */
@media (max-width: 768px) {

  /* ── 한글 줄바꿈: 단어 중간에서 자르지 않음 ── */
  body { word-break: keep-all; overflow-wrap: break-word; }

  /* ── 네비게이션: 로고 + 수강문의 버튼만 ── */
  nav a.nav-link { display: none !important; }
  nav > div {
    padding: 0 18px !important;
    height: 60px !important;
  }
  nav img { height: 36px !important; }

  /* ── 섹션 공통 여백 ── */
  section { padding: 64px 20px !important; }
  [style*="padding: 0px 40px"], [style*="padding:0 40px"] { padding: 0 20px !important; }
  [style*="padding: 80px 40px"], [style*="padding:80px 40px"] { padding: 48px 20px !important; }
  [style*="padding: 52px"], [style*="padding:52px"] { padding: 30px 24px !important; }

  /* ── 제목·큰 글씨 축소 ── */
  h2 { font-size: clamp(24px, 7vw, 32px) !important; line-height: 1.3 !important; }
  h3 { font-size: 19px !important; }
  [style*="font-size: 52px"], [style*="font-size:52px"] { font-size: 34px !important; }
  [style*="font-size: 46px"], [style*="font-size:46px"],
  [style*="font-size: 44px"], [style*="font-size:44px"] { font-size: 28px !important; }
  [style*="font-size: 42px"], [style*="font-size:42px"],
  [style*="font-size: 40px"], [style*="font-size:40px"] { font-size: 26px !important; }
  [style*="font-size: 38px"], [style*="font-size:38px"] { font-size: 25px !important; }
  [style*="font-size: 34px"], [style*="font-size:34px"] { font-size: 23px !important; }
  [style*="font-size: 30px"], [style*="font-size:30px"] { font-size: 21px !important; }

  /* ── 그리드: 다열 → 1열 (4칸 통계는 2×2) ── */
  [style*="grid-template-columns: 1fr 1fr"], [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1.1fr"], [style*="grid-template-columns:1.1fr"],
  [style*="grid-template-columns: 0.9fr"], [style*="grid-template-columns:0.9fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="repeat(4"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 20px !important; }
  div:has(> .why-kta-card) { grid-template-columns: 1fr !important; }

  /* ── 강사진 5열 그리드 → 2열 ── */
  #faculty [style*="repeat(5"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
  /* ── 그 외 5열 표: 글자 축소로 대응 ── */
  section:not(#faculty) [style*="repeat(5"] { font-size: 11px !important; }

  /* ── 자격증 FAQ 아코디언 ── */
  .kta-faq-list { margin-top: 36px !important; }
  .kta-faq-q { padding: 18px 18px !important; font-size: 15.5px !important; gap: 12px !important; }
  .kta-faq-q::after { font-size: 22px !important; }
  .kta-faq-a { padding: 0 18px 20px !important; font-size: 14px !important; }

  /* ── 비교 카드의 VS 원형 배지: 세로 배치에선 카드 제목을 가리므로 숨김 ── */
  #authority div[style*="z-index"][style*="translate(-50%"] { display: none !important; }

  /* ── 강사 상세 팝업: 1열 + 스크롤 ── */
  .faculty-overlay {
    grid-template-columns: 1fr !important;
    grid-template-rows: 34vh 1fr !important;
    width: 92vw !important;
    height: auto !important;
    max-height: 84vh !important;
    z-index: 200 !important;
  }
  .faculty-overlay-photo { height: 34vh !important; overflow: hidden; }
  .faculty-overlay-photo img { object-fit: cover; object-position: top; width: 100%; height: 100% !important; }
  .faculty-overlay-info { padding: 24px 22px !important; overflow-y: auto !important; min-height: 0; justify-content: flex-start !important; }

  /* ── 팝업: 모바일은 hover 대신 탭으로 열고 X로 닫음 ── */
  .faculty-card:hover .faculty-overlay {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  .faculty-card.overlay-open .faculty-overlay {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translate(-50%, -50%) scale(1) !important;
    pointer-events: auto !important;
  }
  .faculty-card { cursor: pointer !important; }
  /* hover 잔류로 인한 카드 흐려짐·배경 어둡게 효과 차단 */
  .faculty-card:not(:hover) { opacity: 1 !important; filter: none !important; }
  .faculty-card:hover { box-shadow: none !important; }
  .faculty-backdrop { display: none !important; }
  .overlay-close {
    display: flex;
    position: absolute;
    top: 10px;
    right: 10px;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 50%;
    background: rgba(12, 27, 46, 0.6);
    color: #fff;
    font-size: 24px;
    line-height: 1;
    z-index: 10;
    padding: 0;
  }
  .overlay-lock, .overlay-lock body { overflow: hidden !important; }
}

/* 데스크톱에서는 X 버튼 숨김 (hover 방식 유지) */
@media (min-width: 769px) {
  .overlay-close { display: none; }
}