/* Scott's Performance — site theme (from design_mockups/homepage.html, 2026-07) */
:root{
  --red:#D81E27;
  --red-dark:#A5161C;
  --ink:#15171C;
  --steel:#22262E;
  --steel-2:#2E333D;
  --line:#e4e6ea;
  --muted:#6b7280;
  --bg:#f4f5f7;
  --white:#ffffff;
  --radius:10px;
  --shadow:0 6px 22px rgba(15,18,25,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.5}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}

/* ===== Announcement bar ===== */
.topbar{background:var(--ink);color:#cfd3da;font-size:13px}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:36px}
.topbar b{color:#fff}
.topbar .r a{margin-left:18px;color:#cfd3da}
.topbar .r a:hover{color:#fff}

/* ===== Header ===== */
header{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.head{display:flex;align-items:center;gap:24px;height:78px}
.logo img{height:44px}
nav.main{margin-left:auto;display:flex;gap:26px}
nav.main a{font-weight:700;font-size:14.5px;text-transform:uppercase;letter-spacing:.03em;padding:6px 0;position:relative}
nav.main a::after{content:"";position:absolute;left:0;bottom:-2px;height:3px;width:0;background:var(--red);transition:width .18s}
nav.main a:hover::after{width:100%}
.head .actions{display:flex;align-items:center;gap:14px}
.icon-btn{width:40px;height:40px;border:1px solid var(--line);border-radius:8px;display:grid;place-items:center;background:#fff;cursor:pointer}
.icon-btn:hover{border-color:var(--red);color:var(--red)}
.cart{background:var(--red);color:#fff;border:none;font-weight:800;padding:0 16px;height:40px;border-radius:8px;display:flex;align-items:center;gap:8px;text-transform:uppercase;font-size:13px;letter-spacing:.03em}
.cart-ico{width:19px;height:19px;flex-shrink:0}
.hamb{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}
.hamb span{width:24px;height:2px;background:var(--ink);display:block}
.m-search{display:none} /* expanded search input — mobile only */

/* ===== Hero ===== */
.hero{position:relative;background:linear-gradient(120deg,#15171c 0%,#22262e 55%,#2f333d 100%);color:#fff;overflow:hidden}
.hero::before{content:"";position:absolute;right:-8%;top:-30%;width:60%;height:180%;background:var(--red);transform:skewX(-14deg);opacity:.92}
.hero::after{content:"";position:absolute;right:-8%;top:-30%;width:60%;height:180%;background:linear-gradient(180deg,rgba(255,255,255,.12),transparent);transform:skewX(-14deg)}
.hero .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center;padding:56px 20px}
.hero .kicker{color:#ffd7d9;font-weight:800;letter-spacing:.14em;font-size:13px;text-transform:uppercase}
.hero h1{font-size:52px;line-height:.98;margin:12px 0 14px;text-transform:uppercase;letter-spacing:.005em}
.hero h1 em{font-style:normal;color:var(--red);-webkit-text-stroke:1px #fff}
.hero p{color:#d7dbe2;max-width:460px;font-size:17px}
.hero .cta{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;font-size:14px;padding:14px 22px;border-radius:8px;cursor:pointer;border:2px solid transparent}
.btn-red{background:var(--red);color:#fff}
.btn-red:hover{background:var(--red-dark)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn-ghost:hover{border-color:#fff}

/* Fitment finder card */
.finder{background:var(--white);color:var(--ink);border-radius:14px;box-shadow:var(--shadow);padding:22px;position:relative;z-index:2}
.finder h3{font-size:20px;text-transform:uppercase;letter-spacing:.02em;display:flex;align-items:center;gap:10px}
.finder h3 .dot{width:12px;height:12px;background:var(--red);border-radius:2px;transform:skewX(-14deg)}
.finder small{color:var(--muted)}
.finder .field{margin-top:14px}
.finder label{font-size:12px;font-weight:700;text-transform:uppercase;color:var(--muted);letter-spacing:.04em}
.finder select{width:100%;margin-top:5px;padding:12px;border:1px solid var(--line);border-radius:8px;font-size:15px;background:#fbfbfc;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#999 50%),linear-gradient(135deg,#999 50%,transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.finder .btn{width:100%;justify-content:center;margin-top:16px}

/* ===== Trust strip ===== */
.trust{background:var(--ink);color:#e7e9ee}
.trust .wrap{display:flex;justify-content:space-around;gap:18px;padding:16px 20px;flex-wrap:wrap;text-align:center}
.trust .item{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.03em}
.trust .item b{color:var(--red)}

/* ===== Sections ===== */
section.blk{padding:56px 0}
section.blk.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:26px}
.sec-head h2{font-size:30px;text-transform:uppercase;letter-spacing:.01em}
.sec-head h2 .bar{display:inline-block;width:44px;height:5px;background:var(--red);transform:skewX(-14deg);margin-right:12px;vertical-align:middle}
.sec-head a{color:var(--red);font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.03em}

.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.cat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .16s,box-shadow .16s}
.cat:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.cat .ph{height:150px;background:linear-gradient(135deg,#2e333d,#4a5160);position:relative;display:grid;place-items:center;overflow:hidden}
.cat .ph img{width:100%;height:100%;object-fit:cover}
.cat .ph span{color:rgba(255,255,255,.35);font-size:13px;text-transform:uppercase;letter-spacing:.1em}
.cat .ph::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:5px;background:var(--red)}
.cat .body{padding:16px}
.cat .body h4{font-size:17px;text-transform:uppercase;letter-spacing:.01em}
.cat .body p{color:var(--muted);font-size:13.5px;margin-top:4px}

/* What's New list */
.newlist{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 30px}
.newlist ul{list-style:none}
.newlist li{padding:11px 0;border-bottom:1px solid var(--line);font-size:15.5px}
.newlist li:last-child{border-bottom:none}
.newlist li::before{content:"";display:inline-block;width:9px;height:9px;background:var(--red);transform:skewX(-14deg);margin-right:12px}
.newlist li a:hover{color:var(--red)}
.newlist .hours{color:var(--red);font-weight:700}

/* Promo banners (legacy Index_Banners) */
.promos{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.promos a{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:#fff;transition:transform .16s,box-shadow .16s}
.promos a:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.promos img{width:100%;height:200px;object-fit:cover}

/* ===== Split feature ===== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.split .media{background:linear-gradient(135deg,#15171c,#2e333d);min-height:320px;display:grid;place-items:center;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:.1em;font-size:13px}
.split .media img{width:100%;height:100%;object-fit:cover}
.split .copy{background:#fff;padding:40px}
.split .copy .kicker{color:var(--red);font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-size:13px}
.split .copy h3{font-size:28px;text-transform:uppercase;margin:8px 0 12px}
.split .copy p{color:var(--muted);margin-bottom:8px}
.split .copy .btn{margin-top:14px}

/* ===== Footer ===== */
footer{background:var(--ink);color:#aeb4bd;margin-top:20px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;padding:46px 20px}
footer h5{color:#fff;text-transform:uppercase;font-size:14px;letter-spacing:.05em;margin-bottom:14px}
footer a{display:block;padding:5px 0;font-size:14px}
footer a:hover{color:#fff}
.foot .brand img{height:38px;margin-bottom:14px} /* logo.gif is white-on-transparent — no filter needed (invert on a JPG = the blank white box, fixed 2026-07-11) */
.foot .brand p{font-size:13.5px;max-width:280px}
.subbar{border-top:1px solid #2a2e36;text-align:center;padding:16px;font-size:13px}

/* ===== Mobile menu ===== */
.mobile{display:none;background:#fff;border-top:1px solid var(--line)}
.mobile .wrap{padding:10px 20px}
.mobile a{display:block;padding:12px 0;font-weight:700;text-transform:uppercase;border-bottom:1px solid var(--line)}
.mobile a:last-child{border-bottom:none}

@media(max-width:980px){
  .hero .wrap{grid-template-columns:1fr;padding:40px 20px}
  .hero h1{font-size:40px}
  .cats,.promos{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1fr}
  .foot{grid-template-columns:1fr 1fr}
}
/* ===== Shop Your Bike ===== */
.page-hero{background:linear-gradient(120deg,#15171c,#2e333d);color:#fff;padding:34px 0}
.page-hero .crumbs{font-size:13px;color:#aeb4bd;margin-bottom:10px;text-transform:uppercase;letter-spacing:.04em}
.page-hero .crumbs a{color:#d7dbe2}
.page-hero .crumbs a:hover{color:#fff}
.page-hero h1{font-size:32px;text-transform:uppercase;line-height:1.1}
.page-hero p{color:#d7dbe2;margin-top:6px}

.makes-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.make-card{--accent:var(--red);background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px 14px;text-align:center;font-weight:800;text-transform:uppercase;letter-spacing:.03em;font-size:14px;transition:transform .16s,box-shadow .16s;border-bottom:4px solid var(--accent)}
.make-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.make-card img{height:56px;margin:0 auto 10px;object-fit:contain}

.model-block{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px 22px;margin-bottom:14px}
.model-block h3{font-size:18px;text-transform:uppercase;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.type-tag{font-size:11px;background:var(--steel);color:#fff;padding:3px 8px;border-radius:4px;letter-spacing:.05em}
.year-links{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px}
.year-links a{border:1px solid var(--line);border-radius:6px;padding:6px 12px;font-weight:700;font-size:14px}
.year-links a:hover{border-color:var(--red);color:var(--red)}

.fit-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fit-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .16s,box-shadow .16s}
.fit-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.fit-card .num{position:absolute;top:10px;left:10px;background:var(--red);color:#fff;font-size:12px;font-weight:800;padding:4px 9px;border-radius:5px;z-index:2}
.fit-card .ph{height:180px;overflow:hidden;background:#fff;display:grid;place-items:center;color:#aeb4bd;font-size:12px;text-transform:uppercase;letter-spacing:.1em;padding:10px;border-bottom:1px solid var(--line)}
.fit-card .ph img{max-height:160px}
.fit-card .ph img{width:100%;height:100%;object-fit:contain}
.fit-card .body{padding:14px;display:flex;flex-direction:column;gap:6px;flex:1;background:#f8f9fb;border-top:3px solid var(--red)}
.fit-card .body h4{font-size:15.5px;line-height:1.3;font-weight:700;color:var(--ink)}
.fit-card .comment{color:var(--muted);font-size:13px}
.fit-card .price{font-weight:800;font-size:18px;color:var(--red);margin-top:auto}
.empty-note{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;color:var(--muted)}
.empty-note a{color:var(--red);font-weight:700}

/* ===== Purchase page ===== */
.purchase-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start}
.purchase-photo img{background:#fff;border:1px solid var(--line);border-radius:var(--radius);width:100%;object-fit:contain}
.purchase-photo .no-photo{background:#eef0f3;border-radius:var(--radius);height:320px;display:grid;place-items:center;color:#aeb4bd;text-transform:uppercase;letter-spacing:.1em;font-size:13px}
.purchase-photo .notes{margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px;color:var(--muted);font-size:14px}
.purchase-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.purchase-panel .comment{color:var(--muted);font-style:italic}
.purchase-panel .partno{font-size:13px;color:var(--muted);margin-top:4px}
.price-line{font-size:28px;font-weight:800;margin:14px 0;color:var(--red)}
.price-line del{color:var(--muted);font-weight:400;font-size:20px;margin-right:10px}
.info-only{background:#f8f9fa;border:1px solid var(--line);border-radius:8px;padding:18px}
.info-only a{color:var(--red);font-weight:800}
.order-form .field{margin-top:14px}
.order-form label{font-size:12px;font-weight:700;text-transform:uppercase;color:var(--muted);letter-spacing:.04em;display:flex;align-items:center;gap:8px}
.order-form select{width:100%;margin-top:5px;padding:11px;border:1px solid var(--line);border-radius:8px;font-size:14px;background:#fbfbfc}
.bars-select{font-family:ui-monospace,Consolas,monospace;font-size:12.5px}
.qty-row{display:flex;align-items:center;gap:12px;margin-top:20px}
.qty-row input{width:70px;padding:11px;border:1px solid var(--line);border-radius:8px;font-size:15px}
.cart-note{font-size:12.5px;color:var(--muted);margin-top:10px}
.back-link{margin-top:18px}
.back-link a{color:var(--red);font-weight:700}
.help{display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;background:var(--steel);color:#fff;font-size:11px;cursor:help;position:relative}
.help .help-pop{display:none;position:absolute;left:22px;top:-6px;z-index:20;background:var(--ink);color:#e7e9ee;padding:10px 12px;border-radius:8px;width:260px;font-weight:400;text-transform:none;letter-spacing:0;font-size:12.5px;line-height:1.45}
.help:hover .help-pop,.help:focus .help-pop{display:block}
.instructions{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}
.instructions h5{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:8px}
.instructions ul{list-style:none}
.instructions li{padding:4px 0}
.instructions a{color:var(--red);font-weight:700;font-size:14px}
.suggest-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}

/* ===== Catalog ===== */
.thumb-row{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.thumb-row img{width:64px;height:64px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:6px;cursor:pointer}
.thumb-row img:hover{border-color:var(--red)}
.fixed-attrib{margin-top:12px;font-size:14px;color:var(--muted)}
.fixed-attrib strong{color:var(--ink);text-transform:uppercase;font-size:12px;letter-spacing:.04em}
.fits-list{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}
.fits-list summary{cursor:pointer;font-weight:700;color:var(--red);font-size:14px}
.fits-list ul{list-style:none;margin-top:10px;max-height:220px;overflow-y:auto;font-size:13.5px;color:var(--muted)}
.fits-list li{padding:3px 0}
.bars-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px;font-size:14px;color:var(--muted)}
.bars-controls a{font-weight:700;color:var(--ink)}
.bars-controls a.active,.bars-controls a:hover{color:var(--red)}
.bars-table-wrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.bars-table{width:100%;border-collapse:collapse;font-size:14px}
.bars-table th{background:var(--ink);color:#fff;text-transform:uppercase;font-size:12px;letter-spacing:.04em;padding:12px 14px;text-align:left}
.bars-table td{padding:11px 14px;border-top:1px solid var(--line)}
.bars-table .name{font-weight:700}
.bars-table .price{font-weight:800;color:var(--red);white-space:nowrap}
.bars-table del{color:var(--muted);font-weight:400}
.btn-sm{padding:8px 14px;font-size:12px}
.index-nav{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px;position:sticky;top:78px;background:var(--bg);padding:10px 0;z-index:10}
.index-nav a{width:32px;height:32px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);border-radius:6px;font-weight:800;font-size:13px}
.index-nav a:hover{border-color:var(--red);color:var(--red)}
.index-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.index-card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px;text-align:center;font-size:13px;font-weight:700;display:flex;flex-direction:column;gap:8px;transition:transform .14s,box-shadow .14s;scroll-margin-top:140px}
.index-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.index-card .ph{height:70px;display:grid;place-items:center}
.index-card .ph img{max-height:70px;object-fit:contain}
.index-card.in-dev{opacity:.65}
.index-card.in-dev em{color:var(--red);font-size:11px;text-transform:uppercase;letter-spacing:.04em}

/* ===== Dealer portal ===== */
.dealer-badge{color:#ffd7d9;font-weight:700;margin-left:18px}
.dealer-box{max-width:520px}
.dealer-box h3{text-transform:uppercase;font-size:18px;margin:22px 0 6px}
.dealer-box .order-form input[type=text],.dealer-box .order-form input[type=password]{width:100%;margin-top:5px;padding:11px;border:1px solid var(--line);border-radius:8px;font-size:15px;background:#fbfbfc}
.alert{border-radius:8px;padding:13px 16px;margin-bottom:16px;font-size:14px}
.alert-error{background:#fdecec;border:1px solid #f5b5b8;color:#8f1418}
.alert-ok{background:#ecf8ee;border:1px solid #b9e3c1;color:#155724}
.dealer-notice{background:#fff;border:1px solid var(--line);border-left:4px solid var(--red);border-radius:8px;padding:16px;margin-bottom:18px;font-size:14.5px}
.forgot{color:var(--red);font-weight:700;font-size:14px}
.btn-ghost-dark{background:transparent;color:var(--muted);border:2px solid var(--line);display:inline-flex;align-items:center;font-weight:800;text-transform:uppercase;letter-spacing:.03em;font-size:13px;padding:10px 18px;border-radius:8px;cursor:pointer;margin-top:14px}
.btn-ghost-dark:hover{border-color:var(--ink);color:var(--ink)}
.dealer-tag{background:var(--ink);color:#fff;font-size:11px;font-weight:800;padding:3px 8px;border-radius:4px;vertical-align:middle;letter-spacing:.04em}
.retail-ref{display:block;font-size:13px;color:var(--muted);font-weight:400}

/* ===== Content pages ===== */
.content-prose{max-width:760px;font-size:15.5px}
.content-prose p{margin-bottom:14px}
.content-prose h2{font-size:22px;text-transform:uppercase;margin:26px 0 10px}
.content-prose a{color:var(--red);font-weight:700}
.content-prose.intro{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px 24px;margin-bottom:20px}
.faq-cat{font-size:22px;text-transform:uppercase;margin:26px 0 12px}
.faq-cat .bar{display:inline-block;width:34px;height:5px;background:var(--red);transform:skewX(-14deg);margin-right:10px;vertical-align:middle}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:8px;padding:14px 18px;margin-bottom:8px}
.faq-item summary{cursor:pointer;font-weight:700;font-size:15px}
.faq-item div{margin-top:10px;color:var(--muted);font-size:14.5px}
.contact-info p{margin-bottom:12px;font-size:14.5px}
.contact-info a{color:var(--red);font-weight:700}
.map-embed iframe{box-shadow:var(--shadow)}
.order-form textarea{width:100%;margin-top:5px;padding:11px;border:1px solid var(--line);border-radius:8px;font-size:14px;background:#fbfbfc;font-family:inherit}

/* ===== Dealer locator ===== */
.locator-form{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-bottom:24px}
.locator-form .field{margin:0;min-width:160px}
.locator-form label{font-size:12px;font-weight:700;text-transform:uppercase;color:var(--muted);letter-spacing:.04em;display:block}
.locator-form select,.locator-form input{width:100%;margin-top:5px;padding:11px;border:1px solid var(--line);border-radius:8px;font-size:14px;background:#fbfbfc}
.results-count{color:var(--muted);font-size:14px;margin-bottom:14px}
.dealer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dealer-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;font-size:14px}
.dealer-card h4{font-size:15.5px;margin-bottom:6px}
.dealer-card p{color:var(--muted);margin-bottom:6px}
.dealer-card a{color:var(--red);font-weight:700}
@media(max-width:980px){.dealer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.dealer-grid{grid-template-columns:1fr}}

/* ===== Lookup tools ===== */
.doc-list{list-style:none;margin-top:8px}
.doc-list li{padding:7px 0;border-top:1px solid var(--line);font-size:14.5px}
.doc-list li:first-child{border-top:none}
.doc-list a{color:var(--red);font-weight:700}
.doc-list span{color:var(--muted);display:block;font-size:13px}
.brand-links{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.brand-links a{background:#fff;border:1px solid var(--line);border-radius:8px;padding:14px;text-align:center;font-weight:700;font-size:13px;display:flex;flex-direction:column;gap:8px;align-items:center;transition:transform .14s,box-shadow .14s}
.brand-links a:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.brand-links img{max-height:44px;object-fit:contain}
@media(max-width:980px){.brand-links{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.brand-links{grid-template-columns:repeat(2,1fr)}}

/* ===== Stabilizer parts diagram ===== */
.parts-layout{display:grid;grid-template-columns:520px 1fr;gap:26px;align-items:start}
.parts-diagram{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:10px;position:sticky;top:100px}
.parts-diagram img{width:100%;height:auto}
.parts-list tr{scroll-margin-top:110px}
.parts-list tr:target{background:#fdecec}
.row-form{display:flex;gap:8px;align-items:center}
.row-form input[type=number]{width:58px;padding:7px;border:1px solid var(--line);border-radius:6px}
@media(max-width:980px){.parts-layout{grid-template-columns:1fr}.parts-diagram{position:static}}

/* ===== Galleries & videos ===== */
.make-card.active{border-color:var(--red);box-shadow:var(--shadow)}
.bike-rows{list-style:none;margin-top:10px}
.bike-rows li{border-top:1px solid var(--line)}
.bike-rows li:first-child{border-top:none}
.bike-rows a{display:flex;align-items:center;gap:14px;padding:11px 6px;font-size:14.5px;flex-wrap:wrap}
.bike-rows a:hover{background:#fbf5f5}
.bike-rows strong{min-width:220px}
.bike-rows .years{color:var(--muted);min-width:90px}
.bike-rows .go{margin-left:auto;color:var(--red);font-weight:700;font-size:13px;opacity:0;transition:opacity .12s}
.bike-rows a:hover .go{opacity:1}
@media(max-width:640px){.bike-rows .go{display:none}.bike-rows strong{min-width:0;width:100%}}
.bike-rows .row-line{display:flex;align-items:baseline;gap:14px;padding:11px 6px;flex-wrap:wrap}
.bike-rows .yrs{display:flex;flex-wrap:wrap;gap:6px}
.bike-rows .yrs a{border:1px solid var(--line);border-radius:6px;padding:3px 9px;font-weight:700;font-size:13px}
.bike-rows .yrs a:hover{border-color:var(--red);color:var(--red)}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.gallery-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin:0}
.gallery-card img{width:100%;height:240px;object-fit:cover;transition:transform .18s}
.gallery-card a:hover img{transform:scale(1.03)}
.gallery-card figcaption{padding:12px 14px;font-size:13.5px;color:var(--muted)}
.video-list{display:flex;flex-direction:column;gap:10px;max-width:760px}
.video-row{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px 20px;transition:transform .14s,box-shadow .14s}
.video-row:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.video-row h4{font-size:16px;color:var(--red)}
.video-row p{color:var(--muted);font-size:14px;margin-top:4px}
.video-embed{background:#000;border-radius:var(--radius);overflow:hidden;max-width:900px}
.video-embed iframe,.video-embed object,.video-embed embed,.video-embed video{width:100%;aspect-ratio:16/9;display:block;border:0}
@media(max-width:980px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.gallery-grid{grid-template-columns:1fr}}

/* ===== Search ===== */
.search-form{display:flex;gap:10px;max-width:640px;margin-bottom:28px}
.search-form input{flex:1;padding:13px 16px;border:1px solid var(--line);border-radius:8px;font-size:16px;background:#fff}
.search-form input:focus{outline:2px solid var(--red);border-color:var(--red)}
.search-results{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 18px}
.search-results a{background:#fff;border:1px solid var(--line);border-radius:8px;padding:11px 14px;font-size:14.5px;font-weight:600}
.search-results a:hover{border-color:var(--red);color:var(--red)}
@media(max-width:980px){.search-results{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.search-results{grid-template-columns:1fr}}
@media(max-width:980px){.index-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.index-grid{grid-template-columns:repeat(2,1fr)}.index-nav{top:64px}}

@media(max-width:980px){
  .makes-grid{grid-template-columns:repeat(3,1fr)}
  .fit-list{grid-template-columns:repeat(2,1fr)}
  .purchase-grid{grid-template-columns:1fr}
  .suggest-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:640px){
  nav.main,.head .actions .cart span,.topbar .r{display:none}
  /* Mobile header (Brian 2026-07-16): logo · hamburger · expanded search · cart.
     display:contents lifts the action buttons up to be .head flex items so
     they can be reordered around the search bar. */
  .head .actions{display:contents}
  .head{height:64px;gap:10px}
  .hamb{display:flex;order:1}
  .logo{order:2}
  .logo img{height:36px}
  .m-search{display:flex;order:3;flex:1;min-width:0}
  .m-search input{width:100%;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:8px;font-size:16px;background:#fbfbfc}
  .icon-btn{display:none}
  .cart{order:4;padding:0 12px;flex-shrink:0}
  .hero h1{font-size:32px}
  .cats{grid-template-columns:1fr 1fr}
  .promos{grid-template-columns:1fr}
  .foot{grid-template-columns:1fr}
  .sec-head h2{font-size:23px}
  .mobile.open{display:block}
}

/* Cross-sells on purchase pages — separate cart line items (2026-07-16) */
.cross-sells{border:1px solid var(--line);border-radius:8px;padding:12px 14px;background:#fbfbfc}
.cs-row{padding:6px 0}
.cs-row + .cs-row{border-top:1px solid var(--line)}
.cs-pick{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:600}
.cs-pick input{width:auto}
.cs-pick strong{color:var(--red)}
.cs-note{margin:2px 0 0 28px;font-size:12.5px;color:var(--muted)}

/* HelloBar promo bar (ported 2026-07-11) */
.hellobar{background:#D81E27;color:#fff;font-size:14px;text-align:center;padding:8px 12px}
.hellobar .wrap{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.hellobar-btn{display:inline-block;background:#fff;color:#D81E27;font-weight:700;text-decoration:none;padding:3px 14px;border-radius:3px;font-size:13px}
.hellobar-btn:hover{background:#1a1a1a;color:#fff}