@media (max-width:768px){

  /* =========================
     GLOBAL SAFETY (mobile only)
     ========================= */
  *, *::before, *::after{
    box-sizing:border-box;
  }

  html, body{
    width:100%;
    overflow-x:hidden;
  }

  /* =========================
     HIDE DESKTOP (HOME ONLY)
     ========================= */
  main.home-grid .sidecats,
  main.home-grid .category-grid-desktop{
    display:none !important;
  }

  .mobile-only{
    display:block !important;
  }

  /* =========================
     HOME GRID
     ========================= */
  main.home-grid{
    width:100%;
    margin:0;
    padding:0;
  }

  main.home-grid .home-main > section.container{
    width:100% !important;
    max-width:100% !important;
    padding:0 16px !important;
    margin:0 !important;
  }

  /* =========================
     PRODUCT GRID (HOME)
     ========================= */
  main.home-grid .card-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:12px;
    width:100%;
  }

  main.home-grid .product-card{
    width:100%;
    max-width:100%;
    padding:10px;
    border-radius:14px;
  }

  main.home-grid .product-card .img{
    height:130px;
    border-radius:12px;
  }

  main.home-grid .product-card .name{
    font-size:13px;
    line-height:1.35;
    min-height:36px;
  }

  /* =========================
     CATEGORY STRIP (HOME) ✅ FIX
     ========================= */

  .category-strip{
    background:#fff;
    margin-bottom:16px;
    overflow:hidden;
  }

  .category-scroll{
    overflow-x:auto;
    overflow-y:visible;
    -webkit-overflow-scrolling:touch;
  }

  .category-scroll::-webkit-scrollbar{
    display:none;
  }

  /* 🔒 ล็อกโครง grid ให้เสถียร */
  #category-row{
    display:grid !important;
    grid-auto-flow:column;

    /* 🔑 สำคัญ: ล็อกความสูงแถว */
    grid-template-rows:repeat(2, auto);
    grid-auto-columns:84px;

    gap:12px;
    padding:12px 16px;

    width:max-content;
    height:auto !important; /* 96*2 + gap */
  }

  /* การ์ดหมวดหมู่ */
  #category-row .cat{
    width:84px;
    min-height:96px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;

    padding:8px 6px;
    background:#fff;
    border-radius:14px;
    box-shadow:0 2px 8px rgba(0,0,0,.06);
  }

  /* รูป */
  #category-row .cat__img{
    width:40px !important;
    height:40px !important;
    margin-bottom:6px;
    flex-shrink:0;
  }

  /* ชื่อ */
  #category-row .cat__name{
    font-size:11px;
    line-height:1.25;
    text-align:center;

    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

}
