:root {
  --ink: #111214; --muted: #4b5058; --paper: #eef1f4; --card: #fff; --line: #d9dee4;
  --dewalt: #febd17; --makita: #00959f; --makita-dark: #006e76; --honda: #e3001b;
  --deere: #367c2b; --cub: #f4a300; --husq: #f35b04; --champion: #ffd200; --westinghouse: #1f6fd1;
  --good: #0a7d3b;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: "Helvetica Neue", Helvetica, Arial, "Segoe UI", sans-serif; background: var(--paper); color: var(--ink); line-height: 1.4; }
a { color: inherit; }
.wrap { max-width: 1160px; margin: 0 auto; padding: 0 14px; }

/* top bar + nav */
.topbar { background: #111; color: #fff; position: sticky; top: 0; z-index: 10; box-shadow: 0 2px 10px rgba(0,0,0,.3); }
.topbar .wrap { display: flex; align-items: center; gap: 16px; min-height: 54px; flex-wrap: wrap; }
.logo { font-weight: 900; font-size: 22px; letter-spacing: -0.01em; text-decoration: none; color: #fff; white-space: nowrap; }
.logo span { color: var(--dewalt); }
nav.main { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px 0; }
nav.main a { text-decoration: none; font-size: 13px; font-weight: 700; padding: 6px 10px; border-radius: 6px; color: #e9e9e9; white-space: nowrap; }
nav.main a:hover { background: #2a2a2e; color: #fff; }
nav.main a.on { background: var(--dewalt); color: #111; }
.brand-stripe { height: 6px; background: linear-gradient(90deg, var(--dewalt) 0 25%, var(--makita) 25% 50%, var(--honda) 50% 75%, var(--deere) 75% 100%); }
.note { font-size: 12px; color: #5a4a00; background: #fff6cc; border-bottom: 1px solid #f0cf55; }
.note .wrap { padding-top: 6px; padding-bottom: 6px; }

/* HOME */
/* Homepage hero heading — preview variants */
.home-hero { padding: 0 0 12px; }
.home-hero .brands { margin-top: 12px; }
.home-hero-band {
  position: relative; overflow: hidden; border-radius: 12px;
  background: #0b0c0e; color: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
}
.home-hero-inner { position: relative; z-index: 2; padding: 22px 18px 20px; }
.hh-kicker {
  margin: 0 0 8px; font-family: "Oswald", "Helvetica Neue", Arial, sans-serif;
  font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  color: #ffe27a;
}
.home-hero h1 {
  margin: 0; font-family: "Oswald", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700; text-transform: uppercase; line-height: .95;
  letter-spacing: .02em; font-size: clamp(28px, 7.2vw, 54px);
}
.hh-main { color: #fff; display: inline; }
.hh-tools {
  color: #111; background: var(--dewalt); display: inline-block;
  padding: .06em .22em .08em; border-radius: 4px; margin-left: .08em;
  box-shadow: 0 0 0 2px rgba(254,189,23,.25);
}
.hh-sub {
  margin: 10px 0 0; max-width: 36em;
  font-size: 15px; font-weight: 700; color: #d7dbe2; letter-spacing: .01em;
}

/* V2: faint tool photo backdrop + heavy Anton title */
.home-hero--v2 .home-hero-band {
  background:
    linear-gradient(105deg, rgba(8,9,11,.92) 0%, rgba(8,9,11,.78) 45%, rgba(8,9,11,.88) 100%),
    url("images/home-drills.jpg") center/cover no-repeat;
  border: 1px solid #2a2e35;
}
.home-hero--v2 .home-hero-band::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: repeating-linear-gradient(-45deg, transparent 0 14px, rgba(254,189,23,.07) 14px 16px);
}
.home-hero--v2 h1 { font-family: "Anton", Impact, "Arial Narrow", sans-serif; font-weight: 400; letter-spacing: .04em; font-size: clamp(30px, 7.6vw, 58px); }
.home-hero--v2 .hh-tools {
  background: transparent; color: var(--dewalt); padding: 0; box-shadow: none;
  border-bottom: 5px solid var(--dewalt); border-radius: 0; margin-left: .15em;
}
.home-hero--v2 .hh-kicker { color: #bbb; }
.home-hero--v2 .home-hero-band::after {
  content: ""; position: absolute; left: 14px; top: 14px; bottom: 14px; width: 5px; z-index: 3;
  background: var(--dewalt); border-radius: 3px;
}

@media (max-width: 420px) {
  .home-hero-inner { padding: 16px 14px 15px; }
  .hh-sub { font-size: 13.5px; }
  .hh-kicker { font-size: 10px; letter-spacing: .12em; }
  .home-hero--v2 .home-hero-band::after { left: 10px; top: 10px; bottom: 10px; width: 4px; }
}

/* keep old class harmless if referenced elsewhere */
.home-intro { padding: 18px 0 10px; display: flex; align-items: end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.home-intro h1 { font-size: 34px; margin: 0; font-weight: 900; letter-spacing: -0.01em; }
.home-intro p { margin: 4px 0 0; color: var(--muted); font-size: 15px; }
.brands { display: flex; flex-wrap: wrap; gap: 6px; }
.brands span { font-weight: 900; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; padding: 4px 9px; border-radius: 4px; }
.b-dewalt { background: var(--dewalt); color: #111; }
.b-makita { background: var(--makita); color: #fff; }
.b-honda { background: var(--honda); color: #fff; }
.b-deere { background: var(--deere); color: #ffde00; }
.b-cub { background: #111; color: var(--cub); }
.b-husq { background: var(--husq); color: #fff; }
/* Homepage: one uniform medium category tile grid */
.home-cats h3 { font-size: 14px; text-transform: uppercase; letter-spacing: .1em; margin: 8px 0 10px; color: var(--muted); }
.home-cat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding: 0 0 28px; }
.home-cat-tile { display: flex; flex-direction: column; background: #fff; border-radius: 12px; overflow: hidden; text-decoration: none; color: var(--ink); border: 1px solid var(--line); border-top: 5px solid #111; box-shadow: 0 3px 10px rgba(0,0,0,.08); transition: transform .15s ease, box-shadow .15s ease; min-height: 100%; }
.home-cat-tile:hover { box-shadow: 0 10px 22px rgba(0,0,0,.16); transform: translateY(-2px); }
.home-cat-tile img { width: 100%; height: 148px; object-fit: cover; background: #f4f6f8; display: block; }
.home-cat-tile span { padding: 10px 12px 12px; font-weight: 800; font-size: 15px; line-height: 1.25; }
/* Keep mini tiles for category pages (e.g. outdoor-power additions) */
.more h3 { font-size: 14px; text-transform: uppercase; letter-spacing: .1em; margin: 10px 0 8px; color: var(--muted); }
.more-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; padding-bottom: 26px; }
.mini-tile { display: flex; flex-direction: column; background: #fff; border-radius: 10px; overflow: hidden; text-decoration: none; border: 1px solid var(--line); border-top: 5px solid #111; box-shadow: 0 2px 6px rgba(0,0,0,.07); }
.mini-tile:hover { box-shadow: 0 8px 18px rgba(0,0,0,.15); transform: translateY(-2px); }
.mini-tile img { width: 100%; height: 110px; object-fit: contain; background: #fff; }
.mini-tile span { padding: 6px 10px 9px; font-weight: 800; font-size: 14px; }

/* CATEGORY PAGES */
.cat-hero { position: relative; height: 210px; overflow: hidden; background: #111; color: #fff; }
.cat-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(1.2) brightness(1.04); }
.cat-hero.plain img { object-fit: contain; background: #fff; }
.cat-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.15) 40%, rgba(0,0,0,0) 65%); }
.cat-hero .wrap { position: relative; z-index: 1; height: 100%; display: flex; align-items: center; }
.panel { background: rgba(12,12,14,.82); border-left: 6px solid var(--dewalt); border-radius: 10px; padding: 12px 16px; max-width: 420px; }
.crumbs { font-size: 12px; color: #ccc; }
.crumbs a { color: var(--dewalt); text-decoration: none; font-weight: 700; }
.panel h1 { margin: 2px 0 2px; font-size: 30px; font-weight: 900; }
.panel p { margin: 0; font-size: 13.5px; color: #eee; }
.controls { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; padding: 16px 0 6px; }
label { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; }
select, button { font: inherit; font-size: 14px; padding: 8px 12px; border-radius: 8px; border: 2px solid #111; background: #fff; color: var(--ink); font-weight: 600; }
button { background: #111; color: var(--dewalt); cursor: pointer; font-weight: 800; }
button.ghost { background: #fff; color: #111; }
button.active { background: #111; color: var(--dewalt); }
.hint { color: var(--muted); font-size: 13px; margin: 4px 0 12px; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: 10px; padding-bottom: 28px; }
.card { background: var(--card); border: 1px solid var(--line); border-top: 5px solid #8a929c; border-radius: 10px; padding: 8px; display: flex; flex-direction: column; gap: 5px; box-shadow: 0 2px 6px rgba(17,18,20,.08); transition: transform .12s ease, box-shadow .12s ease; }
.card:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(17,18,20,.16); }
.brand-dewalt { border-top-color: var(--dewalt); } .brand-makita { border-top-color: var(--makita); } .brand-honda { border-top-color: var(--honda); }
.brand-deere { border-top-color: var(--deere); } .brand-cub { border-top-color: var(--cub); } .brand-husq { border-top-color: var(--husq); }
.brand-champion { border-top-color: var(--champion); } .brand-westinghouse { border-top-color: var(--westinghouse); }
.product-photo { display: block; width: 100%; height: 104px; object-fit: contain; background: #fff; border-radius: 6px; }
.brand-chip { display: inline-block; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; padding: 1px 6px; border-radius: 3px; background: #111; color: #fff; margin-bottom: 2px; }
.brand-dewalt .brand-chip { background: var(--dewalt); color: #111; }
.brand-makita .brand-chip { background: var(--makita); color: #fff; }
.brand-honda .brand-chip { background: var(--honda); color: #fff; }
.brand-deere .brand-chip { background: var(--deere); color: #ffde00; }
.brand-cub .brand-chip { background: #111; color: var(--cub); }
.brand-husq .brand-chip { background: var(--husq); color: #fff; }
.brand-champion .brand-chip { background: #111; color: var(--champion); }
.brand-westinghouse .brand-chip { background: var(--westinghouse); color: #fff; }
.card h2 { font-size: 14px; margin: 0; line-height: 1.22; font-weight: 800; }
.spec { color: var(--muted); font-size: 11.5px; margin: 0; }
.scores { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.score { background: #f1f4f7; border-radius: 6px; padding: 3px 6px; }
.score span { display: block; font-size: 9.5px; color: var(--muted); font-weight: 600; }
.score strong { font-size: 15px; font-weight: 900; }
.stars { display: none; }
.prices { display: flex; flex-direction: column; gap: 6px; }
.price-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 8px; border: 1px solid var(--line); font-size: 15px; }
.price-row > span { white-space: nowrap; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.price-row strong { font-weight: 900; font-size: 17px; }
.price-row.best { background: #fff3c2; border-color: var(--dewalt); }
.best-tag { font-size: 10px; font-weight: 800; color: var(--dewalt); background: #111; padding: 2px 6px; border-radius: 4px; text-transform: uppercase; letter-spacing: .04em; margin-left: 0; vertical-align: 1px; }
.buy { font-weight: 800; font-size: 15px; color: var(--makita-dark); text-decoration: none; border-bottom: 1px solid transparent; }
.prices .buy { font-size: 15px; }
.buy:hover { border-bottom-color: var(--makita-dark); }
.tool-cell { display: flex; align-items: center; gap: 10px; }
.tool-thumb { width: 96px; height: 72px; flex: 0 0 96px; object-fit: contain; border-radius: 6px; background: #fff; border: 1px solid var(--line); }
table.cmp { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin-bottom: 32px; box-shadow: 0 2px 6px rgba(17,18,20,.08); }
table.cmp th, table.cmp td { text-align: left; padding: 8px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
table.cmp th { font-size: 12px; color: var(--dewalt); background: #111; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
table.cmp td.num { text-align: right; white-space: nowrap; }
.hidden { display: none !important; }
footer { border-top: 1px solid var(--line); background: #fff; padding: 22px 0 36px; color: var(--muted); font-size: 13.5px; }
@media (max-width: 900px) {
  .home-cat-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .home-cat-tile img { height: 136px; }
}
@media (max-width: 720px) {
  .home-cat-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .home-cat-tile img { height: 120px; }
  .home-cat-tile span { font-size: 14px; padding: 8px 10px 10px; }
  .cat-hero { height: 180px; }
  .panel h1 { font-size: 24px; }
  table.cmp { font-size: 13px; display: block; overflow-x: auto; }
  nav.main a { padding: 5px 7px; font-size: 12px; }
  .topbar { position: static; }
}
@media (max-width: 420px) {
  .home-cat-grid { grid-template-columns: 1fr 1fr; }
}

:root { --milwaukee: #db011c; --yamaha: #1b3fa0; --generac: #f47b20; }
.brand-milwaukee { border-top-color: var(--milwaukee); } .brand-yamaha { border-top-color: var(--yamaha); } .brand-generac { border-top-color: var(--generac); }
.brand-milwaukee .brand-chip { background: var(--milwaukee); color: #fff; }
.brand-yamaha .brand-chip { background: var(--yamaha); color: #fff; }
.brand-generac .brand-chip { background: var(--generac); color: #111; }
.b-milwaukee { background: var(--milwaukee); color: #fff; }
/* type tiles on category pages */
.type-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; padding: 14px 0 24px; }
.type-tile { display: flex; flex-direction: column; background: #fff; border-radius: 10px; overflow: hidden; text-decoration: none; border: 1px solid var(--line); border-bottom: 4px solid #111; box-shadow: 0 4px 12px rgba(0,0,0,.1); transition: transform .15s ease, box-shadow .15s ease; }
.type-tile:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0,0,0,.16); }
.type-tile img { width: 100%; height: 160px; object-fit: contain; background: #fff; display: block; }
.type-tile .tt { padding: 6px 10px 8px; background: #111; color: #fff; }
.type-tile h2 { margin: 0; font-size: 16px; font-weight: 900; }
.type-tile .desc { font-size: 11px; color: #ddd; margin: 1px 0 3px; }
.type-tile .makes { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.type-tile .makes span { display: none; }
.type-tile .makes .cta { display: inline; margin-left: 0; font-weight: 900; font-size: 11px; letter-spacing: .02em; text-transform: none; padding: 0; border-radius: 0; color: var(--dewalt); }
.type-tile .few { font-size: 11px; color: #ffd27a; }
.type-tile .tile-power { margin: 0 0 3px; }
.type-tile .power-badge { font-size: 9px; padding: 2px 6px; }
.type-tile .tile-power .tp-note { font-size: 10px; }
.mk-dewalt { background: var(--dewalt); color: #111; } .mk-makita { background: var(--makita); color: #fff; } .mk-milwaukee { background: var(--milwaukee); color: #fff; }
.mk-honda { background: var(--honda); color: #fff; } .mk-yamaha { background: var(--yamaha); color: #fff; } .mk-champion { background: var(--champion); color: #111; }
.mk-westinghouse { background: var(--westinghouse); color: #fff; } .mk-generac { background: var(--generac); color: #111; }
.mk-deere { background: var(--deere); color: #ffde00; } .mk-cub { background: var(--cub); color: #111; } .mk-husq { background: var(--husq); color: #fff; }
.mk-none { background: #555; color: #fff; }
.types-hint { font-size: 12px; font-weight: 800; color: #fff; background: rgba(0,0,0,.55); display: inline-block; padding: 2px 8px; border-radius: 4px; margin-top: 4px; }
.subnav { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 0 0; }
.subnav a { font-size: 12.5px; font-weight: 800; text-decoration: none; padding: 5px 10px; border-radius: 999px; background: #fff; border: 2px solid #111; color: #111; }
.subnav a.on { background: #111; color: var(--dewalt); }
body[data-type] .grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); max-width: 980px; gap: 14px; }
body[data-type] .product-photo { height: 110px; }
/* power source */
.chip-row { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin-bottom: 4px; }
.chip-row .brand-chip { margin: 0; }
.power-badge { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; line-height: 1.2; }
.power-badge.power-battery { background: #16a34a; color: #fff; }
.power-badge.power-corded { background: #111; color: #ffcd11; }
.tile-power { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin: 0 0 6px; }
.tile-power .tp-note { font-size: 11px; color: #bbb; }
.power-pick { max-width: 980px; box-sizing: border-box; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 14px 0 4px; padding: 10px 12px; background: #fff; border: 2px solid #111; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,.08); }
.pp-label { font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; margin-right: 4px; }
.power-tab { font-size: 16px; font-weight: 900; padding: 9px 16px; border-radius: 10px; border: 2px solid #111; background: #fff; color: #111; cursor: pointer; display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1.15; }
.power-tab small { font-size: 11px; font-weight: 700; opacity: .8; }
.power-tab.on { background: #111; color: #ffcd11; }
.power-tab.tab-battery.on { background: #16a34a; border-color: #16a34a; color: #fff; }
.group-head { grid-column: 1 / -1; border-radius: 10px; margin: 10px 0 0; font-size: 20px; font-weight: 900; padding: 8px 12px; border-radius: 10px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.group-head small { font-size: 12px; font-weight: 700; opacity: .85; }
.group-head.power-battery { background: #16a34a; color: #fff; }
.group-head.power-corded { background: #111; color: #ffcd11; }
.group-row td { font-weight: 900; font-size: 14px; }
.group-row.power-battery td { background: #16a34a; color: #fff; }
.group-row.power-corded td { background: #111; color: #ffcd11; }
@media (max-width: 640px) { .power-tab { font-size: 14px; padding: 8px 11px; } .pp-label { width: 100%; } }
.single-note { background: #fff6cc; border: 1px solid #f0cf55; border-radius: 8px; padding: 8px 12px; font-size: 13px; margin: 10px 0 0; }

/* Additional comparable manufacturers; no affiliation or paid placement implied. */
.b-ryobi, .mk-ryobi, .brand-ryobi .brand-chip { background: #a5bd00; color: #111; }
.brand-ryobi { border-top-color: #a5bd00; }
.b-ridgid, .mk-ridgid, .brand-ridgid .brand-chip { background: #ee681c; color: #fff; }
.brand-ridgid { border-top-color: #ee681c; }
.b-craftsman, .mk-craftsman, .brand-craftsman .brand-chip { background: #c52026; color: #fff; }
.brand-craftsman { border-top-color: #c52026; }
.b-husky, .mk-husky, .brand-husky .brand-chip { background: #b91c1c; color: #fff; }
.brand-husky { border-top-color: #b91c1c; }
.b-bosch, .mk-bosch, .brand-bosch .brand-chip { background: #00657a; color: #fff; }
.brand-bosch { border-top-color: #00657a; }
.b-kobalt, .mk-kobalt, .brand-kobalt .brand-chip { background: #174cbe; color: #fff; }
.brand-kobalt { border-top-color: #174cbe; }
.b-stihl, .mk-stihl, .brand-stihl .brand-chip { background: #f27620; color: #fff; }
.brand-stihl { border-top-color: #f27620; }
.b-ego, .mk-ego, .brand-ego .brand-chip { background: #73ad36; color: #111; }
.brand-ego { border-top-color: #73ad36; }
.b-toro, .mk-toro, .brand-toro .brand-chip { background: #cc2229; color: #fff; }
.brand-toro { border-top-color: #cc2229; }
.b-echo, .mk-echo, .brand-echo .brand-chip { background: #ec681f; color: #fff; }
.brand-echo { border-top-color: #ec681f; }
.b-klein, .mk-klein, .brand-klein .brand-chip { background: #e88b19; color: #fff; }
.brand-klein { border-top-color: #e88b19; }
.b-stanley, .mk-stanley, .brand-stanley .brand-chip { background: #ecb900; color: #111; }
.brand-stanley { border-top-color: #ecb900; }
.b-ariens, .mk-ariens, .brand-ariens .brand-chip { background: #e76f14; color: #fff; }
.brand-ariens { border-top-color: #e76f14; }
.b-honda, .mk-honda, .brand-honda .brand-chip { background: #c42026; color: #fff; }
.brand-honda { border-top-color: #c42026; }
.b-cub-cadet, .mk-cub-cadet, .brand-cub-cadet .brand-chip { background: #e4ad11; color: #111; }
.brand-cub-cadet { border-top-color: #e4ad11; }
.b-troy-bilt, .mk-troy-bilt, .brand-troy-bilt .brand-chip { background: #c52629; color: #fff; }
.brand-troy-bilt { border-top-color: #c52629; }
.b-husqvarna, .mk-husqvarna, .brand-husqvarna .brand-chip { background: #e97221; color: #fff; }
.brand-husqvarna { border-top-color: #e97221; }
.b-earthquake, .mk-earthquake, .brand-earthquake .brand-chip { background: #d32922; color: #fff; }
.brand-earthquake { border-top-color: #d32922; }
.b-sun-joe, .mk-sun-joe, .brand-sun-joe .brand-chip { background: #75ac22; color: #111; }
.brand-sun-joe { border-top-color: #75ac22; }
.b-champion, .mk-champion, .brand-champion .brand-chip { background: #e2b323; color: #111; }
.brand-champion { border-top-color: #e2b323; }
.b-generac, .mk-generac, .brand-generac .brand-chip { background: #ef841f; color: #fff; }
.brand-generac { border-top-color: #ef841f; }
.b-wayne, .mk-wayne, .brand-wayne .brand-chip { background: #226db2; color: #fff; }
.brand-wayne { border-top-color: #226db2; }
.b-simpson, .mk-simpson, .brand-simpson .brand-chip { background: #bb2525; color: #fff; }
.brand-simpson { border-top-color: #bb2525; }
.b-superior-pump, .mk-superior-pump, .brand-superior-pump .brand-chip { background: #256b9b; color: #fff; }
.brand-superior-pump { border-top-color: #256b9b; }
.b-red-lion, .mk-red-lion, .brand-red-lion .brand-chip { background: #c52c2d; color: #fff; }
.brand-red-lion { border-top-color: #c52c2d; }
.b-john-deere { background:#367c2b; color:#ffde00; }
main > .brands { display: none; }
/* Home Depot exclusives subgroup within a category/power section */
.group-head.hd-exclusives { background: #2a2e35; color: #fff; font-size: 17px; margin-top: 6px; }
.group-head.hd-exclusives small { color: #d7dbe2; opacity: 1; }
.group-row.hd-exclusives td { background: #2a2e35; color: #fff; }
.power-badge.power-gas, .group-head.power-gas, .group-row.power-gas td, .tab-gas.on { background:#a33e13; color:#fff; }
.outdoor-additions { padding-top:18px; }
@media (min-width:721px) { .topbar .wrap { gap:4px 16px; } }

/* Approved compact image logo; the wordmark appears only once in the header. */
.topbar { background:#000; }
.logo { display:block; flex:0 0 auto; padding:3px 0; line-height:0; }
.logo img { display:block; height:50px; width:auto; max-width:190px; object-fit:contain; }

/* Preview: header tagline to the right of the logo image */
.site-tagline { display:inline-block; font-weight:900; font-size:15px; line-height:1.15; color:#fff; letter-spacing:.01em; white-space:nowrap; flex:0 1 auto; margin:0 2px 0 0; }
.site-tagline span { color: var(--dewalt); }
.topbar .wrap { flex-wrap: wrap; }
@media (max-width: 720px) {
  .site-tagline { font-size:13px; }
  .logo img { height:44px; }
}
@media (max-width: 420px) {
  .site-tagline { font-size:11.5px; letter-spacing:0; }
}

@media (max-width:720px) { .logo img { height:46px; } }

/* Black Friday first-visit popup */
html.bf-open { overflow: hidden; }
.bf-backdrop { position: fixed; inset: 0; z-index: 1000; background: rgba(10, 14, 20, .62); display: flex; align-items: center; justify-content: center; padding: 16px; animation: bf-fade .18s ease-out; }
.bf-dialog { position: relative; width: 100%; max-width: 460px; max-height: calc(100vh - 32px); overflow: auto; background: #fff; color: #1b1f24; border-radius: 14px; box-shadow: 0 18px 50px rgba(0,0,0,.35); padding: 22px 22px 16px; border-top: 6px solid #111; }
.bf-dialog:focus { outline: none; }
.bf-close { position: absolute; top: 8px; right: 8px; width: 48px; height: 48px; border: 0; border-radius: 50%; background: #f1f3f5; color: #111; font-size: 32px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.bf-close:hover { background: #e2e6ea; }
.bf-close:focus-visible, .bf-nothanks:focus-visible, .bf-cta:focus-visible, .bf-secondary:focus-visible { outline: 3px solid #f5a623; outline-offset: 2px; }
.bf-kicker { margin: 0 56px 4px 0; font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #b3261e; }
.bf-dialog h2 { margin: 0 56px 12px 0; font-size: 22px; line-height: 1.25; }
.bf-lede { margin: 0 0 14px; font-size: 16px; line-height: 1.45; }
.bf-product { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 14px; }
.bf-product img { width: 120px; height: auto; border-radius: 8px; flex: 0 0 auto; background: #f4f4f4; }
.bf-name { margin: 0 0 6px; font-weight: 700; font-size: 16px; line-height: 1.3; }
.bf-price { margin: 0 0 4px; font-size: 22px; }
.bf-was { font-size: 14px; color: #555; }
.bf-note { margin: 0; font-size: 13px; color: #555; line-height: 1.4; }
.bf-actions { display: flex; flex-direction: column; gap: 8px; }
.bf-cta { display: block; text-align: center; background: #111; color: #fff; font-weight: 700; font-size: 17px; padding: 14px 16px; border-radius: 10px; text-decoration: none; min-height: 48px; box-sizing: border-box; }
.bf-cta:hover { background: #333; color: #fff; }
.bf-secondary { display: block; text-align: center; font-size: 15px; padding: 10px; color: #1a4fb4; min-height: 44px; box-sizing: border-box; }
.bf-nothanks { display: block; width: 100%; margin-top: 6px; min-height: 48px; border: 1px solid #c9ced4; background: #fff; color: #333; font-size: 16px; font-weight: 600; border-radius: 10px; cursor: pointer; }
.bf-nothanks:hover { background: #f4f6f8; }
@media (max-width: 480px) {
  .bf-backdrop { align-items: flex-end; padding: 0; }
  .bf-dialog { max-width: none; border-radius: 14px 14px 0 0; max-height: 92vh; }
  .bf-product img { width: 96px; }
}
@keyframes bf-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .bf-backdrop { animation: none; } }
