.hero.bh{min-height:74vh}.hero.bh:before{background:url(https://gearplusgarage.com/wp-content/uploads/2026/10/Hero-Banner-Car-Brand-Service.webp) center/cover;opacity:.5;animation:none}
.hero.bh h1{font-size:var(--fs-h)}
.panel a small{margin-left:auto;color:var(--mut);font:600 11px Sora}.panel a small+.i{margin-left:12px}
.glass{backdrop-filter:none;background:linear-gradient(160deg,rgba(32,35,44,.94),rgba(16,18,24,.94))}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.intro p{color:#b7bfcc;font-size:17px}
.tools{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center;margin-bottom:40px}
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tabs button{padding:11px 20px;border-radius:50px;border:1px solid #d9d5e2;background:#fff;font:600 13px Sora;color:#10141a;cursor:pointer;transition:.3s}
.tabs button:hover{border-color:var(--red)}.tabs button.on{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 8px 20px rgba(240,54,27,.3)}
.sr{padding:13px 20px;border:1px solid #d9d5e2;border-radius:50px;font:500 14px Inter;min-width:260px;background:#fff;color:#10141a}.sr:focus{outline:2px solid var(--red)}
.grp{margin-bottom:56px;content-visibility:auto;contain-intrinsic-size:auto 500px}
.grp h3{font-size:clamp(20px,2vw,28px);color:#10141a;margin-bottom:20px;display:flex;align-items:center;gap:14px}
.grp h3 small{font:700 12px Sora;background:var(--red);color:#fff;padding:5px 12px;border-radius:50px}
.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px}
.bc{background:#fff;border:1px solid #e8e5ee;border-radius:20px;padding:14px;text-align:center;transition:.3s;display:block}
.bc:hover{border-color:var(--red);transform:translateY(-6px);box-shadow:0 18px 36px rgba(16,20,26,.12)}
.bi{height:110px;display:grid;place-items:center;margin-bottom:10px}.bi img{max-width:100%;max-height:100%;object-fit:contain}
.bc span{font:600 13px Sora;color:#10141a}
.none{text-align:center;color:#5b6472;padding:40px;display:none}
@media(max-width:1000px){.intro{grid-template-columns:1fr;gap:20px}}
@media(max-width:560px){.bgrid{grid-template-columns:repeat(2,1fr)}.sr{min-width:0;width:100%}}

/* brand card hover: Repair / Service / Maintenance */
.bc{position:relative;cursor:pointer}
.bc-sub{position:absolute;inset:0;z-index:2;border-radius:20px;background:rgba(16,20,26,.97);display:flex;flex-direction:column;justify-content:center;gap:6px;padding:12px;opacity:0;visibility:hidden;transform:scale(.97);transition:opacity .2s,transform .2s,visibility .2s}
.bc-sub b{font:700 12px Sora;color:#fff;text-align:center;margin-bottom:2px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-sub a{display:block;text-align:center;padding:8px 6px;border-radius:10px;background:rgba(255,255,255,.08);color:#fff;font:600 12.5px Sora;transition:background .15s}
.bc-sub a:hover{background:var(--red)}
.bc:hover .bc-sub,.bc:focus-within .bc-sub,.bc.open .bc-sub{opacity:1;visibility:visible;transform:none}