.brand-list-page { color: #f1ece2; background: #050505; }
.brand-list-main { max-width: 1460px; margin: 0 auto; padding: clamp(150px, 15vw, 210px) clamp(20px, 5vw, 72px) clamp(80px, 10vw, 140px); }
.brand-list-intro { display: grid; max-width: 1180px; grid-template-columns: minmax(0, 1fr) minmax(280px, .62fr); align-items: end; column-gap: clamp(42px, 8vw, 120px); margin-bottom: clamp(44px, 6vw, 76px); }
.brand-list-intro > p { grid-column: 1 / -1; margin: 0 0 18px; color: #d4af37; font: 600 10px/1.4 Montserrat, sans-serif; letter-spacing: .3em; text-transform: uppercase; }
.brand-list-intro h1 { margin: 0; color: #f5f0e7; font: 500 clamp(58px, 8vw, 106px)/.78 "Cormorant Garamond", serif; letter-spacing: -.045em; }
.brand-list-intro h1 em { color: #d4af37; font-weight: 500; }
.brand-list-intro > span { display: block; max-width: 520px; margin-bottom: 5px; color: rgba(245, 240, 231, .62); font: 500 16px/1.65 "Cormorant Garamond", serif; }
.brand-directory-toolbar { display: flex; min-height: 66px; align-items: center; justify-content: space-between; gap: 24px; border-block: 1px solid rgba(212, 175, 55, .35); }
.brand-directory-toolbar p,
.brand-directory-toolbar a { margin: 0; color: rgba(245, 240, 231, .66); font: 600 10px/1 Montserrat, sans-serif; letter-spacing: .18em; text-transform: uppercase; }
.brand-directory-toolbar p span,
.brand-directory-toolbar a span { color: #d4af37; }
.brand-directory-toolbar a { display: inline-flex; align-items: center; gap: 14px; color: #f5f0e7; }
.brand-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.brand-list a { display: flex; min-height: 92px; align-items: center; justify-content: space-between; gap: 20px; padding: 0 clamp(16px, 2vw, 28px); border-right: 1px solid rgba(212, 175, 55, .17); border-bottom: 1px solid rgba(212, 175, 55, .2); color: #eee7da; transition: color .2s ease, background-color .2s ease; }
.brand-list a:nth-child(3n+1) { border-left: 1px solid rgba(212, 175, 55, .17); }
.brand-list a strong { font: 500 clamp(20px, 1.75vw, 28px)/1.05 "Cormorant Garamond", serif; }
.brand-list a > span { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 12px; color: #d4af37; font: 500 13px/1 Montserrat, sans-serif; transition: transform .2s ease; }
.brand-list a small { color: rgba(245, 240, 231, .42); font: 600 8px/1 Montserrat, sans-serif; letter-spacing: .11em; text-transform: uppercase; }
.brand-list a:hover { color: #e1b867; background: #0c0b09; }
.brand-list a:hover > span { transform: translate(3px, -1px); }
@media (max-width: 980px) {
  .brand-list-intro { grid-template-columns: 1fr; row-gap: 24px; }
  .brand-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .brand-list a:nth-child(3n+1) { border-left: 0; }
  .brand-list a:nth-child(2n+1) { border-left: 1px solid rgba(212, 175, 55, .17); }
}
@media (max-width: 600px) {
  .brand-list-main { padding-top: 116px; }
  .brand-list-intro { margin-bottom: 36px; }
  .brand-list-intro h1 { font-size: clamp(54px, 17vw, 76px); }
  .brand-directory-toolbar { min-height: 74px; }
  .brand-directory-toolbar a { max-width: 110px; line-height: 1.45; text-align: right; }
  .brand-list { grid-template-columns: 1fr; }
  .brand-list a,
  .brand-list a:nth-child(3n+1) { min-height: 78px; border-left: 1px solid rgba(212, 175, 55, .17); }
  .brand-list a small { display: none; }
}
