/* ============================================================
   Pistone Rappresentanze — Marchi
   marchi.css
   ============================================================ */

.brand-tabs {
  position: sticky; top: 74px; z-index: 400;
  background: rgba(246,242,234,.94); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line-2);
}
.brand-tabs-in { display:flex; gap: clamp(.4rem,2vw,1.5rem); justify-content:center; flex-wrap:wrap; padding: .7rem clamp(1rem,5vw,4rem); }
.btab {
  font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; font-weight:500;
  color: var(--txt-body); padding:8px 16px; border-radius:100px; border:1px solid transparent;
  transition: color .25s, background .25s, border-color .25s;
}
.btab:hover { color: var(--ink); border-color: var(--line); background: var(--cream); }

.catsec { scroll-margin-top: 130px; }
.catsec:nth-child(even) { background: var(--paper-2); }
.catsec-head { display:flex; justify-content:space-between; align-items:flex-start; gap:2rem; margin-bottom: clamp(1.8rem,3vw,2.6rem); }
.catsec-head .sec-ttl { margin-bottom:1rem; }
.catsec-desc { font-size:.95rem; color: var(--txt-body); line-height:1.8; font-weight:300; max-width:46rem; }
.catsec-count {
  flex-shrink:0; font-family:'Cormorant Garamond', serif; font-size:1rem; color: var(--brass);
  border:1px solid var(--line); border-radius:100px; padding:8px 18px; white-space:nowrap; letter-spacing:.04em;
}

.catnote { background: var(--ink); }
.catnote-in { max-width: 46rem; margin:0 auto; text-align:center; }
.catnote-in p { color: rgba(255,255,255,.6); font-size:.92rem; line-height:1.85; font-weight:300; }

@media (max-width: 640px) {
  .catsec-head { flex-direction:column; gap:1rem; }
}