/* =========================================================
   PHASE 157 — CATEGORY BROWSE ELEVATION
   Refines category browsing hierarchy, alignment and mobile density.
   ========================================================= */

/* Desktop — quieter, sharper, more editorial. */
.category-page-header{
  padding:58px 4vw 30px!important;
  align-items:center!important;
  gap:44px!important;
}
.category-page-header .eyebrow{
  margin:0 0 16px!important;
  font-size:.56rem!important;
  letter-spacing:.22em!important;
}
.category-page-header h1{
  font-size:clamp(4.2rem,7.2vw,7.3rem)!important;
  line-height:.82!important;
  letter-spacing:-.065em!important;
}
.category-page-back{
  min-height:42px!important;
  padding:0 18px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  font-size:.57rem!important;
  letter-spacing:.16em!important;
  white-space:nowrap!important;
}

.discovery-summary{
  margin:0 4vw 12px!important;
  padding:12px 0!important;
  gap:0!important;
  border-top:0!important;
  border-bottom:1px solid #c9c5bc!important;
}
.discovery-summary strong{
  min-height:24px!important;
  display:flex!important;
  align-items:center!important;
  font-size:.55rem!important;
  line-height:1.2!important;
  letter-spacing:.17em!important;
  font-weight:760!important;
}
.discovery-summary strong:nth-child(2){justify-content:center!important}
.discovery-summary strong:nth-child(3){justify-content:flex-end!important}

.discovery-tools{
  grid-template-columns:minmax(280px,1.45fr) minmax(138px,.58fr) minmax(138px,.58fr) minmax(138px,.58fr) minmax(218px,.82fr) auto!important;
  gap:8px!important;
  margin:0 4vw 18px!important;
  padding-top:8px!important;
  align-items:center!important;
}
.discovery-tools .collection-browse-search,
.discovery-tools .collection-browse-sort{
  height:40px!important;
  min-height:40px!important;
  padding:0 12px!important;
  border-color:#c4c0b7!important;
  font-size:.56rem!important;
  letter-spacing:.105em!important;
  font-weight:650!important;
}
.discovery-tools .collection-browse-search{
  font-size:.62rem!important;
  letter-spacing:.085em!important;
}
.discovery-tools .collection-browse-search::placeholder{
  color:#85817a!important;
  opacity:1!important;
}
.discovery-view-toggle{
  height:40px!important;
  min-height:40px!important;
}
.discovery-view-toggle button{
  min-height:38px!important;
  padding:0 14px!important;
  font-size:.52rem!important;
  letter-spacing:.13em!important;
  font-weight:720!important;
}
.discovery-tools .collection-browse-count{
  padding-left:10px!important;
  font-size:.52rem!important;
  letter-spacing:.15em!important;
}

.discovery-active-bar{
  margin:-4px 4vw 14px!important;
  min-height:40px!important;
  padding:6px 0!important;
}
.discovery-filter-chip,.discovery-reset{
  min-height:30px!important;
  font-size:.52rem!important;
  letter-spacing:.12em!important;
}

.discovery-quick{
  margin:0 4vw 22px!important;
  gap:6px!important;
  flex-wrap:nowrap!important;
  padding-top:2px!important;
}
.discovery-quick>span{
  flex:0 0 auto!important;
  margin-right:8px!important;
  font-size:.51rem!important;
  letter-spacing:.18em!important;
}
.discovery-quick button{
  min-height:32px!important;
  padding:0 11px!important;
  font-size:.51rem!important;
  letter-spacing:.11em!important;
  white-space:nowrap!important;
}
.category-page-grid{
  padding-top:34px!important;
}

/* Tablet — keep controls compact without feeling crowded. */
@media(max-width:1180px) and (min-width:761px){
  .discovery-tools{
    grid-template-columns:minmax(240px,1.4fr) repeat(3,minmax(126px,.6fr))!important;
  }
  .discovery-tools .discovery-view-toggle{grid-column:1/3!important;width:max-content!important;min-width:220px!important}
  .discovery-tools .collection-browse-count{grid-column:3/5!important;text-align:right!important;padding-left:0!important}
  .discovery-quick{overflow-x:auto!important;scrollbar-width:none!important;padding-bottom:4px!important}
  .discovery-quick::-webkit-scrollbar{display:none!important}
}

/* iPhone / Android — compact editorial controls, not oversized SaaS blocks. */
@media(max-width:760px){
  .category-page-header{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:end!important;
    gap:16px!important;
    padding:34px max(18px,5vw) 22px!important;
  }
  .category-page-header>div{min-width:0!important}
  .category-page-header .eyebrow{
    margin-bottom:10px!important;
    font-size:.48rem!important;
    letter-spacing:.2em!important;
  }
  .category-page-header h1{
    font-size:clamp(3.15rem,15.5vw,4.7rem)!important;
    line-height:.84!important;
    margin:0!important;
  }
  .category-page-back{
    align-self:end!important;
    min-height:36px!important;
    height:36px!important;
    padding:0 10px!important;
    gap:7px!important;
    font-size:.46rem!important;
    letter-spacing:.12em!important;
  }
  .category-page-back .line-arrow{transform:scale(.78)!important;transform-origin:center!important}

  .discovery-summary{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    margin:0 max(18px,5vw) 10px!important;
    padding:10px 0!important;
    gap:8px!important;
  }
  .discovery-summary strong{
    display:block!important;
    min-height:0!important;
    font-size:.46rem!important;
    line-height:1.35!important;
    letter-spacing:.105em!important;
    text-align:left!important;
  }
  .discovery-summary strong:nth-child(2){text-align:center!important}
  .discovery-summary strong:nth-child(3){text-align:right!important}

  .discovery-tools{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    margin:0 max(18px,5vw) 14px!important;
    padding-top:6px!important;
    overflow:visible!important;
  }
  .discovery-tools .collection-browse-search{
    grid-column:1/-1!important;
    height:42px!important;
    min-height:42px!important;
    padding:0 12px!important;
    font-size:16px!important; /* prevents iOS focus zoom */
    letter-spacing:.02em!important;
    text-transform:none!important;
  }
  .discovery-tools .collection-browse-sort{
    height:38px!important;
    min-height:38px!important;
    padding:0 28px 0 10px!important;
    font-size:11px!important;
    letter-spacing:.025em!important;
    text-transform:uppercase!important;
  }
  .discovery-view-toggle{
    grid-column:1/-1!important;
    height:38px!important;
    min-height:38px!important;
  }
  .discovery-view-toggle button{
    flex:1!important;
    min-height:36px!important;
    font-size:.48rem!important;
    letter-spacing:.12em!important;
  }
  .discovery-tools .collection-browse-count{
    grid-column:1/-1!important;
    padding:1px 0 0!important;
    text-align:right!important;
    font-size:.46rem!important;
  }

  .discovery-active-bar{
    margin:0 max(18px,5vw) 12px!important;
    min-height:36px!important;
    padding:5px 0!important;
    gap:8px!important;
  }
  .discovery-filter-chip,.discovery-reset{
    min-height:30px!important;
    font-size:.47rem!important;
  }

  .discovery-quick{
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    gap:6px!important;
    margin:0 0 16px!important;
    padding:0 max(18px,5vw) 4px!important;
    scroll-padding-left:max(18px,5vw)!important;
  }
  .discovery-quick::-webkit-scrollbar{display:none!important}
  .discovery-quick>span{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:center!important;
    margin-right:5px!important;
    font-size:.47rem!important;
    letter-spacing:.16em!important;
  }
  .discovery-quick button{
    flex:0 0 auto!important;
    width:auto!important;
    min-height:34px!important;
    padding:0 10px!important;
    font-size:.48rem!important;
    letter-spacing:.09em!important;
  }
  .category-page-grid{
    padding-top:24px!important;
  }
}

@media(max-width:430px){
  .category-page-header{grid-template-columns:1fr!important;align-items:start!important}
  .category-page-back{justify-self:start!important}
  .discovery-summary{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
  .discovery-summary strong{font-size:.43rem!important;letter-spacing:.08em!important}
}