/* Mobile brand choice: all seven options are visible without horizontal scrolling. */
.brand-selector button:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
@media(max-width:950px){
 .brand-selector{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;overflow:visible;border:0;margin-bottom:26px}
 .brand-selector button{min-width:0;min-height:78px;padding:15px 30px 15px 15px;border:1px solid #c8dcd7;border-radius:6px;background:#fff;color:var(--petrol);transition:background .18s,border-color .18s,color .18s;touch-action:manipulation}
 .brand-selector span{font-size:16px;line-height:1.25}
 .brand-selector small{font-size:10px;line-height:1.45;white-space:normal;margin-top:6px;color:#577774}
 .brand-selector button:after{content:"";top:17px;right:12px;bottom:auto;left:auto;width:6px;height:10px;border:solid transparent;border-width:0 2px 2px 0;transform:rotate(45deg);background:none}
 .brand-selector button[aria-pressed=true]{color:#fff;background:var(--petrol);border-color:var(--petrol)}
 .brand-selector button[aria-pressed=true] small{color:#c7e8df}
 .brand-selector button[aria-pressed=true]:after{border-color:#b3e8d6;background:none}
}
@media(hover:hover) and (max-width:950px){.brand-selector button:not([aria-pressed=true]):hover{background:#e0f0ea;border-color:#89bdb0}}
@media(max-width:700px){
 .brand-selector{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .brand-selector button{padding:14px 27px 14px 13px;min-height:76px}
 .brand-selector button:last-child{grid-column:1/-1;min-height:64px}
 .brand-selector span{font-size:16px}
 .brand-selector small{font-size:10px}
}
@media(max-width:360px){.brand-selector span{font-size:15px}.brand-selector button{padding-left:11px;padding-right:23px}.brand-selector button:after{right:10px}}
@media(prefers-reduced-motion:reduce){.brand-selector button{transition:none}}