/* Kupiti brands: additive component stylesheet. Existing layout, navigation and product cards unchanged. */
.featured-brands{margin:44px 0 48px;min-width:0}
.featured-brands-heading{margin:0 0 20px;gap:12px}
.brand-all-link{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;white-space:nowrap;color:var(--ink)}
.brand-all-link .icon{width:15px;height:15px}
.featured-brand-track{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:12px}
.featured-brand-card{min-width:0;display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center;color:var(--ink)}
.featured-brand-art{width:100%;height:104px;min-width:0;display:flex;justify-content:center;align-items:center;background:#fff;border:1px solid var(--line);border-radius:13px;padding:14px;transition:border-color .18s,box-shadow .18s}
.featured-brand-card:hover .featured-brand-art,.featured-brand-card:focus-visible .featured-brand-art{border-color:#9eb985;box-shadow:0 5px 18px #173c350b}
.featured-brand-art img{max-width:100%;max-height:72px;width:auto;height:auto;object-fit:contain}
.featured-brand-wordmark{font-size:clamp(11px,1.2vw,17px);font-weight:800;line-height:1.22;overflow-wrap:anywhere}
.featured-brand-name{max-width:100%;font-size:12px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.brands-main{min-height:55vh}
.brand-crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--muted);margin:4px 0 32px}
.brand-crumbs a:hover{text-decoration:underline}
.brands-page-head h1,.brand-detail-hero h1{font-size:clamp(34px,5vw,54px);margin:12px 0 12px;letter-spacing:-1.8px}
.brands-page-head p{max-width:620px;margin:0 0 30px}
.brand-alphabet{display:flex;gap:5px;overflow-x:auto;padding:4px 0 17px;scrollbar-width:thin;white-space:nowrap}
.brand-alphabet a{padding:9px 12px;display:inline-flex;align-items:center;justify-content:center;min-width:36px;font-size:12px;font-weight:700;border-radius:8px;border:1px solid var(--line);background:#fff}
.brand-alphabet a[aria-current="page"],.brand-alphabet a:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.brands-results-title{display:flex;justify-content:space-between;align-items:baseline;gap:15px;margin:30px 0 18px}
.brands-results-title h2{font-size:25px;margin:0}.brands-results-title span{color:var(--muted);font-size:12px}
.brand-directory-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.brand-directory-card{min-width:0;display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:13px;transition:border-color .18s}
.brand-directory-card:hover{border-color:#9eb985}
.brand-directory-logo{display:flex;align-items:center;justify-content:center;flex:0 0 68px;height:62px;background:#f4f6f1;border-radius:9px;text-align:center;padding:6px}
.brand-directory-logo img{max-width:100%;max-height:52px;object-fit:contain}
.brand-directory-logo strong{font-size:11px;line-height:1.15;overflow-wrap:anywhere}
.brand-directory-content{flex:1;min-width:0;overflow-wrap:anywhere}
.brand-directory-content strong{display:block;font-size:13px}.brand-directory-content small{display:block;margin-top:5px;color:var(--muted);font-size:11px}
.brand-directory-card>.icon{width:14px;height:14px;color:var(--muted)}
.brand-pagination{display:flex;align-items:center;justify-content:center;gap:22px;margin:30px 0;font-size:12px}
.brand-pagination a{background:#fff;border:1px solid var(--line);border-radius:8px;padding:11px 15px;font-weight:700}
.brand-detail-hero{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:34px;background:#f0f4ec;border:1px solid var(--line);border-radius:18px;padding:30px 34px}
.brand-detail-logo{height:180px;display:flex;align-items:center;justify-content:center;border-radius:15px;background:#fff;border:1px solid var(--line);padding:25px;text-align:center}
.brand-detail-logo img{max-width:100%;max-height:125px;object-fit:contain}
.brand-detail-logo span{font-size:clamp(18px,3vw,29px);font-weight:800;overflow-wrap:anywhere}
.brand-detail-hero h1{margin-top:5px}.brand-detail-hero p{max-width:660px;margin-bottom:12px}
.brand-detail-count{display:inline-block;border-radius:30px;background:#d8ef75;padding:7px 13px;font-size:11px;font-weight:700}
.brand-products{margin-top:44px}
@media(max-width:1050px){.featured-brand-track{grid-template-columns:repeat(4,minmax(0,1fr))}.brand-directory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:680px){
 .featured-brands{margin:32px 0 34px}.featured-brands-heading{margin-bottom:14px}
 .featured-brands-heading h2{font-size:23px}.brand-all-link{font-size:11px}
 .featured-brand-track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:2px 1px 10px;overscroll-behavior-inline:contain}
 .featured-brand-track::-webkit-scrollbar{display:none}
 .featured-brand-card{flex:0 0 clamp(116px,39vw,145px);scroll-snap-align:start;gap:8px}
 .featured-brand-art{height:91px;padding:14px;border-radius:12px}.featured-brand-art img{max-height:62px}
 .featured-brand-name{font-size:11px}.featured-brand-wordmark{font-size:clamp(11px,3.4vw,15px)}
 .brand-crumbs{margin:0 0 22px;font-size:11px}
 .brands-page-head h1,.brand-detail-hero h1{font-size:34px}
 .brand-directory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .brand-directory-card{padding:10px;gap:8px}.brand-directory-logo{flex-basis:48px;height:51px;padding:5px}
 .brand-directory-logo strong{font-size:9px}.brand-directory-content strong{font-size:12px}.brand-directory-content small{font-size:10px}
 .brand-directory-card>.icon{display:none}
 .brand-detail-hero{grid-template-columns:1fr;padding:20px;gap:18px}.brand-detail-logo{height:115px;max-width:200px;padding:20px}
 .brand-detail-logo img{max-height:78px}.brand-products{margin-top:30px}
 .brand-pagination{gap:8px}
}
@media(prefers-reduced-motion:reduce){.featured-brand-art,.brand-directory-card{transition:none}}
