/**
 * Web Public — tối ưu mobile (≤ 767px) cho trang con & thành phần dùng chung.
 * Trang chủ kv-redesign: xem kv-redesign.css §7.
 */
@media (max-width: 767px) {
  html,
  body.kv-public {
    overflow-x: clip;
    max-width: 100%;
  }

  /* Header trang con: trắng / kính như PC */
  body.kv-public .kv-site-header {
    background: rgba(255, 255, 255, .92) !important;
    color: #102A24 !important;
    backdrop-filter: saturate(180%) blur(14px) !important;
    -webkit-backdrop-filter: saturate(180%) blur(14px) !important;
    border-bottom: 1px solid #DDEEE7 !important;
    box-shadow: 0 2px 16px -8px rgba(16, 42, 36, .18) !important;
    padding-top: env(safe-area-inset-top, 0);
  }
  body.kv-public .kv-desktop-nav a {
    color: #102A24 !important;
  }
  body.kv-public .kv-site-header .kv-header-inner {
    min-height: 56px;
    padding-right: 3.75rem !important;
  }

  .max-w-7xl {
    padding-inline: 1rem !important;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  /* Trang khóa học: không ẩn card khi scroll-reveal lỗi */
  body.kv-premium.kv-js-ready .kh-card,
  body.kv-premium.kv-js-ready .feat-card {
    opacity: 1 !important;
    transform: none !important;
  }

  /* Hero các trang con */
  .kh-hero,
  .lt-hero,
  .hp-hero,
  .gv-hero,
  .lh-hero,
  .vt-hero {
    min-height: clamp(220px, 58vw, 320px);
  }
  .kh-hero__content,
  .lt-hero__content,
  .hp-hero__content,
  .gv-hero__content,
  .lh-hero__content {
    padding: 2rem 1.15rem 2.5rem !important;
  }
  .kh-hero__content h1,
  .lt-hero__content h1,
  .hp-hero__content h1 {
    font-size: clamp(1.45rem, 6.5vw, 1.85rem) !important;
    line-height: 1.3 !important;
  }

  /* Toolbar / tabs cuộn ngang */
  .kh-toolbar-section,
  .lt-toolbar-section {
    margin-top: -1.25rem;
    margin-bottom: 1.25rem;
    padding-inline: 0;
  }
  .kh-tabs,
  .lt-tabs,
  .hp-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: .45rem;
    padding-bottom: .25rem;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .kh-tabs::-webkit-scrollbar,
  .lt-tabs::-webkit-scrollbar { display: none; }
  .kh-tab,
  .lt-tab,
  .hp-tab {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  /* Khóa học: card ngang (ảnh | nội dung) */
  #khCourseGrid.grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .75rem !important;
  }
  #khCourseGrid .kh-card {
    display: flex;
    flex-direction: row-reverse;
    align-items: stretch;
    min-height: 7.5rem;
    border-radius: 14px;
  }
  #khCourseGrid .kh-card__img {
    flex: 0 0 38%;
    width: 38%;
    height: auto !important;
    min-height: 7.5rem;
    object-fit: cover;
  }
  #khCourseGrid .kh-card__body {
    flex: 1;
    min-width: 0;
    padding: .85rem .9rem;
  }
  #khCourseGrid .kh-card__title {
    font-size: 14px !important;
  }
  #khCourseGrid .kh-card__desc {
    font-size: 12.5px;
    -webkit-line-clamp: 2;
  }

  /* Card grid khác → 1 cột */
  .kh-grid,
  .lt-grid,
  .gv-grid,
  .hp-grid,
  .vt-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .85rem !important;
  }
  .kh-card,
  .lt-pillar,
  .lt-prog,
  .gv-card,
  .hp-card,
  .vt-stat,
  .kd-rel-card {
    min-width: 0;
  }

  /* Form liên hệ / đăng ký */
  .lh-form,
  .lt-form,
  .kv-form-panel {
    padding: 1.15rem !important;
  }
  .lh-form .grid,
  .lt-form .grid,
  .kv-form-panel .grid {
    grid-template-columns: 1fr !important;
  }
  .lh-form input,
  .lh-form textarea,
  .lh-form select,
  .lt-form input,
  .lt-form textarea,
  .kv-form-panel input,
  .kv-form-panel textarea,
  .kv-form-panel select {
    font-size: 16px; /* tránh zoom iOS */
    min-height: 44px;
  }
  .lh-form button[type="submit"],
  .lt-form button[type="submit"],
  .kv-form-panel button[type="submit"] {
    width: 100%;
    min-height: 44px;
  }

  /* Bảng / nội dung dài */
  .table-responsive,
  .kv-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Footer bottom stack */
  .kv-footer__bottom-inner,
  .hp-footer__bottom-inner {
    padding-bottom: calc(4.5rem + env(safe-area-inset-bottom, 0));
  }
}