/* Phase 20Q.5 — unified compact public category pages.
   Scoped to category.php through .q5-category-page so every managed category
   uses the same layout without affecting the main catalogue or other pages. */

.q5-category-page .q3-categoryhero{
  padding:24px 0 20px;
}
.q5-category-page .q3-categoryhero .eyebrow{
  font-size:.68rem;
  letter-spacing:.14em;
  margin-bottom:4px;
}
.q5-category-page .q3-categoryhero h1{
  margin:3px 0 7px;
  font-size:clamp(2rem,3.6vw,3rem);
  line-height:1;
}
.q5-category-page .q3-categoryhero p{
  max-width:760px;
  margin:0;
  font-size:.9rem;
  line-height:1.42;
}
.q5-category-page .categoryhero-actions{
  margin-top:12px;
  gap:7px;
}
.q5-category-page .categoryhero-actions .btn{
  min-height:39px;
  padding:8px 14px;
  font-size:.76rem;
}

.q5-category-page .public-category-nav--category{
  padding:9px 0;
}
.q5-category-page .public-category-chips{
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:6px;
}
.q5-category-page .public-category-chips a{
  min-height:47px;
  padding:7px 9px;
  border-radius:11px;
  box-shadow:none;
}
.q5-category-page .public-category-chips span{
  font-size:.78rem;
  line-height:1.06;
}
.q5-category-page .public-category-chips small{
  margin-top:3px;
  font-size:.64rem;
}

.q5-category-page .catalogue{
  padding:22px 0 52px;
}
.q5-category-page .q3-added{
  margin-bottom:11px;
  padding:9px 12px;
  border-radius:10px;
  font-size:.82rem;
}
.q5-category-page .category-result-heading{
  margin:0 0 12px;
  gap:6px;
}
.q5-category-page .category-result-heading strong{
  font-size:1.08rem;
}
.q5-category-page .category-result-heading span{
  font-size:.82rem;
}

.q5-category-page .grid{
  gap:14px;
}
.q5-category-page .product{
  border-radius:17px;
  box-shadow:0 8px 24px rgba(8,29,25,.075);
}
.q5-category-page .product:hover{
  transform:translateY(-2px);
  box-shadow:0 13px 30px rgba(8,29,25,.105);
}
.q5-category-page .productmedia{
  overflow:hidden;
}
.q5-category-page .media360-badge{
  top:9px;
  right:9px;
  padding:5px 8px;
  font-size:.65rem;
}
.q5-category-page .body{
  padding:14px;
}
.q5-category-page .badge{
  padding:4px 8px;
  font-size:.68rem;
}
.q5-category-page .body h2{
  margin:5px 0 3px;
  min-height:2.36em;
  font-size:1.06rem;
  line-height:1.18;
}
.q5-category-page .body .meta{
  min-height:2.6em;
  font-size:.79rem;
  line-height:1.3;
}
.q5-category-page .body .price{
  min-height:auto;
  margin:8px 0 5px;
  font-size:1.03rem;
}
.q5-category-page .actions{
  gap:7px;
  padding-top:10px;
}
.q5-category-page .actions form{
  min-width:0;
}
.q5-category-page .actions .btn{
  min-height:42px;
  padding:8px 10px;
  font-size:.76rem;
  line-height:1.1;
}
.q5-category-page .empty{
  margin-top:8px;
  padding:28px 20px;
  border-radius:16px;
}
.q5-category-page .empty h2{
  margin-bottom:6px;
  font-size:1.3rem;
}
.q5-category-page .empty p{
  margin-top:0;
  font-size:.88rem;
}

@media(max-width:1180px){
  .q5-category-page .public-category-chips{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media(max-width:850px){
  .q5-category-page .q3-categoryhero{
    padding:20px 0 17px;
  }
  .q5-category-page .q3-categoryhero h1{
    font-size:1.85rem;
  }
  .q5-category-page .q3-categoryhero p{
    font-size:.82rem;
  }
  .q5-category-page .public-category-nav--category{
    padding:8px 0;
  }
  .q5-category-page .public-category-chips{
    display:flex;
    overflow-x:auto;
    gap:7px;
    padding:1px 1px 6px;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }
  .q5-category-page .public-category-chips a{
    flex:0 0 auto;
    min-width:122px;
    min-height:44px;
    scroll-snap-align:start;
  }
  .q5-category-page .catalogue{
    padding:18px 0 44px;
  }
  .q5-category-page .grid{
    gap:12px;
  }
  .q5-category-page .body{
    padding:13px;
  }
  .q5-category-page .actions .btn{
    min-height:44px;
  }
}

@media(max-width:560px){
  .q5-category-page .q3-categoryhero{
    padding:17px 0 14px;
  }
  .q5-category-page .q3-categoryhero h1{
    font-size:1.56rem;
    margin-bottom:5px;
  }
  .q5-category-page .q3-categoryhero p{
    font-size:.78rem;
  }
  .q5-category-page .categoryhero-actions{
    margin-top:10px;
  }
  .q5-category-page .categoryhero-actions .btn{
    flex:1 1 130px;
    min-height:42px;
  }
  .q5-category-page .category-result-heading{
    margin-bottom:10px;
  }
  .q5-category-page .category-result-heading strong{
    font-size:1rem;
  }
  .q5-category-page .product{
    border-radius:15px;
  }
  .q5-category-page .body h2,
  .q5-category-page .body .meta{
    min-height:auto;
  }
  .q5-category-page .body h2{
    font-size:1.02rem;
  }
}