.brand-strip-section { padding: 42px 0; color: #222; background: #fff; }
.brand-strip-section [hidden] { display: none !important; }
.brand-strip-heading { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.brand-strip-heading h2,.brand-strip-heading .brand-strip-title { font-size: clamp(24px,3vw,34px); font-weight: 700; letter-spacing: -.035em; margin: 0; }
.brand-strip-buttons { display: flex; gap: 10px; }
.brand-strip-buttons button { width: 44px; height: 44px; border: 1px solid #ddd; background: #fff; color: #222; font-size: 24px; cursor: pointer; }
.brand-strip-buttons button:hover { border-color: #222; }
.brand-strip-hint { margin: 12px 0 24px; font-size: 13px; color: #666; }
.brand-strip-track { display: flex; gap: 24px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: #555 #eee; padding: 12px 4px 22px; }
.brand-strip-track::-webkit-scrollbar { height: 6px; }
.brand-strip-track::-webkit-scrollbar-track { background: #eee; }
.brand-strip-track::-webkit-scrollbar-thumb { background: #555; border-radius: 3px; }
.brand-strip-logo { flex: 0 0 190px; height: 112px; display: flex; align-items: center; justify-content: center; padding: 18px; border: 1px solid transparent; transition: border-color .2s; }
.brand-strip-logo:hover, .brand-strip-logo[aria-current] { border-color: #222; }
.brand-strip-logo img { width: 100%; height: 80px; object-fit: contain; }
.brand-logo-fallback { text-align: center; font-size: 18px; font-weight: 600; color: #222; }
.brand-strip-section a:focus-visible, .brand-strip-section button:focus-visible, .brand-strip-track:focus-visible { outline: 2px solid #222; outline-offset: 3px; }
.brands-page .page-header { margin-bottom: 0; }
.brands-intro { max-width: 640px; text-align: center; margin: 16px 0 0; line-height: 1.8; }
.brand-story { padding: 42px 0 64px; scroll-margin-top: 100px; }
.brand-story-intro { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 50px; align-items: start; border-top: 1px solid #e5e5e5; padding-top: 40px; }
.brand-story-logo { width: 220px; height: 140px; object-fit: contain; padding: 20px; }
.brand-story h1 { font-size: clamp(26px,3vw,38px); letter-spacing: -.03em; }
.brand-story-description { font-size: 16px; line-height: 1.8; max-width: 850px; white-space: pre-line; }
.brand-story .btn { margin-top: 16px; padding: 14px 22px; font-size: 12px; }
.brand-recommendations { margin-top: 48px; }
.brand-recommendations > h2 { font-size: 24px; margin-bottom: 26px; }
.brand-recommendations .product-default figure img { width: 100%; aspect-ratio: 1; object-fit: contain; }
.brand-summary-carousel[hidden],.brand-summary-controls[hidden] { display: none !important; }
.brand-summary-carousel { margin-bottom: 25px; }
.brand-summary-viewport { overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
.brand-summary-viewport::-webkit-scrollbar { display: none; }
.brand-summary-viewport:focus-visible { outline: 2px solid #222529; outline-offset: 3px; }
.brand-summary-track { display: flex; align-items: stretch; }
.brand-summary-track > .brand-summary { flex: 0 0 100%; width: 100%; min-width: 0; margin: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.brand-summary-controls { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding-top: 12px; }
.brand-summary-controls button { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid #ded9d2; border-radius: 50%; background: #fff; color: #222529; font-size: 20px; line-height: 1; cursor: pointer; }
.brand-summary-controls button:hover,.brand-summary-controls button:focus-visible { border-color: #222529; background: #222529; color: #fff; outline: none; }
.brand-summary-position { min-width: 52px; color: #666; font-size: 12px; font-weight: 600; text-align: center; }
.brand-summary { display: flex; gap: 24px; padding: 24px; margin: 0 0 25px; background: #f7f5f1; align-items: center; }
.brand-summary img { width: 140px; height: 80px; object-fit: contain; flex: 0 0 140px; }
.brand-summary h2 { font-size: 20px; margin: 0 0 10px; }
.brand-summary p { font-size: 14px; line-height: 1.7; margin: 0 0 8px; }
.brand-summary a { font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }
@media(max-width: 575px) {
  .brand-strip-logo { flex-basis: 150px; height: 100px; }
  .brand-strip-track { gap: 10px; }
  .brand-story-intro { grid-template-columns: 1fr; gap: 12px; }
  .brand-story-logo { width: 180px; height: 90px; padding: 0; }
  .brand-summary { align-items: flex-start; flex-direction: column; padding: 20px; gap: 16px; }
  .brand-summary img { flex-basis: auto; }
}
@media(prefers-reduced-motion: reduce) { .brand-strip-logo { transition: none; } }
