/* KUBOLAB redesign — Categoria + Loja (scoped under .kbl) */

.kbl .page-head{ padding:150px clamp(20px,4vw,48px) 40px; max-width:640px; }
.kbl .page-head h1{ font-weight:600; font-size:clamp(2.6rem,6vw,4rem); line-height:0.98; letter-spacing:-0.01em; margin:0 0 18px; }
.kbl .page-head p{ color:var(--text-soft); font-size:1rem; line-height:1.6; margin:0; max-width:52ch; }

/* ---------- filters ---------- */
.kbl .filters{
  display:flex; gap:10px 14px; flex-wrap:wrap; align-items:center; justify-content:space-between;
  padding:0 clamp(20px,4vw,48px) 28px; border-bottom:1px solid var(--line); margin-bottom:32px;
}
.kbl .filter-group{ display:flex; gap:10px; flex-wrap:wrap; }
.kbl .filter-chip{
  font-family:inherit; font-weight:500; font-size:12px; letter-spacing:0.04em;
  padding:8px 16px; border-radius:20px; border:1px solid var(--line-strong);
  background:transparent; color:var(--text-soft); cursor:pointer; transition:all .2s;
}
.kbl .filter-chip:hover{ border-color:var(--text); color:var(--text); }
.kbl .filter-chip.active{ background:var(--ink); color:var(--ink-contrast); border-color:var(--ink); }
.kbl .result-count{ font-size:12px; letter-spacing:0.04em; color:var(--text-faint); font-variant-numeric:tabular-nums; }

/* ---------- grid ---------- */
.kbl .grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);
  margin:0 clamp(20px,4vw,48px) 64px; border:1px solid var(--line);
}
.kbl .card{ background:var(--bg); display:flex; flex-direction:column; position:relative; overflow:hidden; }
.kbl .card.featured{ grid-column:span 2; grid-row:span 2; }
.kbl .card.hidden{ display:none; }
.kbl .card-img-wrap{ position:relative; aspect-ratio:1/1; overflow:hidden; background:var(--bg-panel); }
.kbl .card.featured .card-img-wrap{ aspect-ratio:auto; height:100%; min-height:520px; }
.kbl .card-img-wrap img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .5s cubic-bezier(.2,.7,.3,1);
}
.kbl .card:hover .card-img-wrap img{ transform:scale(1.06); }
.kbl .card-img-wrap.is-empty::after{
  content:""; position:absolute; inset:0; background:
    repeating-linear-gradient(45deg, var(--bg-panel) 0 10px, var(--bg-inset) 10px 20px);
  opacity:.6;
}
.kbl .card-info{ padding:16px 18px 20px; display:flex; flex-direction:column; gap:6px; }
.kbl .card-meta{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.kbl .card-name{ font-weight:600; font-size:1rem; }
.kbl .card-type{ font-weight:500; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-faint); }
.kbl .card-dots{ display:flex; gap:4px; flex-shrink:0; }
.kbl .card-dot{ width:9px; height:9px; border-radius:50%; border:1px solid var(--line-strong); }
.kbl .card-price{ font-weight:500; color:var(--text-soft); font-size:0.9rem; font-variant-numeric:tabular-nums; }
.kbl .card-price del{ opacity:.5; margin-right:6px; }
.kbl .card-price ins{ text-decoration:none; }

/* "Pronta entrega" — peça com estoque físico, envio imediato. */
.kbl .card-ready{
  position:absolute; top:10px; left:10px; z-index:2;
  font-weight:600; font-size:10px; letter-spacing:0.06em; text-transform:uppercase;
  padding:5px 9px; border-radius:2px;
  background:var(--ink); color:var(--ink-contrast);
}

@media (max-width:900px){
  .kbl .grid{ grid-template-columns:repeat(2,1fr); }
  .kbl .card.featured{ grid-column:span 2; grid-row:span 1; }
  .kbl .card.featured .card-img-wrap{ min-height:auto; aspect-ratio:1/1; }
}
@media (max-width:520px){
  .kbl .grid{ grid-template-columns:1fr; }
  .kbl .card.featured{ grid-column:span 1; }
}

/* ---------- ring size module ---------- */
.kbl .size-module{ margin:0 clamp(20px,4vw,48px) 80px; border:1px solid var(--line); background:var(--bg-panel); }
.kbl .size-toggle{
  width:100%; display:flex; justify-content:space-between; align-items:center;
  padding:20px 24px; background:none; border:none; cursor:pointer; font-family:inherit;
}
.kbl .size-toggle .t{ font-weight:600; font-size:1.05rem; color:var(--text); }
.kbl .size-toggle .icon{ font-size:1.3rem; color:var(--text-soft); transition:transform .25s; }
.kbl .size-toggle[aria-expanded="true"] .icon{ transform:rotate(45deg); }
.kbl .size-body{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.kbl .size-body.open{ max-height:1600px; }
.kbl .size-body-inner{ padding:0 24px 28px; }
.kbl .size-body-inner p{ color:var(--text-soft); font-size:0.92rem; margin:0 0 18px; max-width:60ch; }
.kbl table.size-table{ width:100%; border-collapse:collapse; }
.kbl table.size-table th, .kbl table.size-table td{
  text-align:left; padding:9px 12px; border-bottom:1px solid var(--line); font-size:0.88rem; font-variant-numeric:tabular-nums;
}
.kbl table.size-table th{ font-weight:600; color:var(--text-faint); text-transform:uppercase; font-size:11px; letter-spacing:0.06em; }
.kbl table.size-table td{ color:var(--text-soft); }
