:root {
  --red: #1468d4;
  --red-dark: #0a4da8;
  --navy: #081c36;
  --ink: #10233f;
  --muted: #61718a;
  --paper: #f3f7fc;
  --white: #fff;
  --line: #dbe5f0;
  --soft-red: #eaf3ff;
  --success: #16805b;
  --warning: #a96100;
  --radius: 18px;
  --shadow: 0 16px 44px rgba(18, 73, 140, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color: inherit; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
svg { width: 1.35rem; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
iconify-icon { display: inline-block; width: 1em; height: 1em; vertical-align: -.13em; flex: 0 0 auto; }
a, button, summary { transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease, opacity .2s ease; }
button:active, .button:active, .quick-add:active { transform: translateY(1px) scale(.98); }
.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: 1rem; top: 1rem; z-index: 50; background: #fff; padding: .75rem 1rem; border-radius: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.utility-bar { background: var(--navy); color: #fff; font-size: .76rem; }
.utility-inner { max-width: 1480px; margin: auto; min-height: 34px; padding: 0 2rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.utility-inner p { margin: 0; display: flex; align-items: center; gap: 1.5rem; }
.utility-inner p strong, .utility-inner p span { display: inline-flex; align-items: center; gap: .35rem; }
.utility-inner p span { color: #cdd4df; }
.utility-inner a { color: #fff; font-weight: 750; text-decoration: none; }
.channel-switch { display: flex; align-items: center; gap: .65rem; }
.channel-switch form { margin: 0; }
.channel-switch button { border: 1px solid rgba(255,255,255,.55); border-radius: 999px; background: transparent; color: inherit; padding: .28rem .7rem; cursor: pointer; font: inherit; }
.channel-switch button:hover { background: #fff; color: var(--navy); transform: translateY(-1px); box-shadow: 0 5px 14px rgba(0,0,0,.16); }
.site-header { position: sticky; top: 0; z-index: 20; background: #fff; box-shadow: 0 4px 18px rgba(16, 24, 39, .06); }
.header-main { max-width: 1480px; margin: auto; min-height: 92px; padding: 1rem 2rem; display: grid; grid-template-columns: 245px minmax(320px, 1fr) auto; align-items: center; gap: 2rem; }
.brand { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; line-height: .9; }
.brand-mark { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; flex: 0 0 auto; background: var(--red); color: #fff; font-weight: 950; font-size: 1.05rem; letter-spacing: -.06em; transform: skew(-5deg); }
.brand-nameplate { display: grid; grid-template-columns: auto auto; align-items: baseline; letter-spacing: -.055em; }
.brand-nameplate span { font-weight: 750; }
.brand-nameplate strong { font-weight: 950; }
.brand-nameplate small { grid-column: 1 / -1; margin-top: .45rem; color: var(--red); font-size: .6rem; letter-spacing: .18em; font-weight: 850; }
.header-search { height: 50px; display: flex; overflow: hidden; border: 2px solid var(--red); border-radius: 13px; background: #fff; box-shadow: 0 8px 24px rgba(20, 104, 212, .13); }
.header-search input { width: 100%; min-width: 0; padding: .75rem 1rem; border: 0; outline: 0; color: var(--ink); }
.header-search input::placeholder { color: #8e96a5; }
.header-search button { display: flex; align-items: center; gap: .45rem; border: 0; padding: 0 1.25rem; background: var(--red); color: #fff; font-weight: 850; cursor: pointer; }
.header-search button:hover { background: var(--red-dark); padding-inline: 1.45rem; }
.header-actions { display: flex; align-items: center; gap: 1rem; }
.header-actions > a { text-decoration: none; }
.header-actions > a:first-child { display: flex; align-items: center; gap: .55rem; padding: .5rem 1rem .5rem .65rem; border-right: 1px solid var(--line); border-radius: 10px 0 0 10px; }
.header-actions > a:first-child > iconify-icon { color: var(--red); font-size: 1.65rem; }
.header-actions > a:first-child > span { display: grid; }
.header-actions > a:first-child:hover { background: var(--soft-red); transform: translateY(-2px); }
.action-kicker { color: var(--muted); font-size: .67rem; }
.header-actions strong { font-size: .86rem; }
.mobile-channel-switch { display: none; margin: 0; }
.mobile-channel-switch button { min-height: 34px; display: inline-flex; align-items: center; gap: .3rem; padding: .35rem .65rem; border: 1px solid #bed5ed; border-radius: 999px; background: #edf6ff; color: var(--navy); font: inherit; font-size: .68rem; font-weight: 850; cursor: pointer; }
.mobile-channel-switch button:hover { border-color: var(--red); background: var(--red); color: #fff; transform: translateY(-1px); }
.cart-action { display: flex; align-items: center; gap: .5rem; color: var(--red); font-weight: 850; }
.cart-action svg { width: 1.65rem; }
.primary-nav { border-top: 1px solid var(--line); background: #fff; }
.primary-inner { max-width: 1480px; min-height: 50px; margin: auto; padding: 0 2rem; display: flex; align-items: center; gap: 2rem; }
.primary-inner > a { text-decoration: none; font-size: .88rem; font-weight: 750; }
.primary-inner > a:hover { color: var(--red); transform: translateY(-2px); }
.primary-inner .nav-repair { display: inline-flex; align-items: center; gap: .4rem; color: var(--red); }
.primary-inner .nav-repair iconify-icon { font-size: 1.25rem; }
.primary-inner .nav-highlight { margin-left: auto; color: var(--red); }
.category-menu { position: relative; align-self: stretch; }
.category-menu summary { height: 100%; min-width: 215px; padding: 0 1.25rem; display: flex; align-items: center; gap: .7rem; list-style: none; background: var(--red); color: #fff; font-weight: 900; cursor: pointer; }
.category-menu summary::-webkit-details-marker { display: none; }
.category-dropdown { position: absolute; left: 0; top: 100%; width: min(1040px, 92vw); overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 0 0 18px 18px; box-shadow: 0 24px 60px rgba(16, 24, 39, .18); }
.category-dropdown a { text-decoration: none; }
.mega-menu-heading { min-height: 70px; padding: 1rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--line); }
.mega-menu-heading > div { display: grid; }
.mega-menu-heading strong { font-size: 1rem; }
.mega-menu-heading span { color: var(--muted); font-size: .72rem; }
.mega-menu-heading > a { color: var(--red); font-size: .78rem; font-weight: 850; }
.mega-menu-body { position: relative; min-height: 455px; background: #fff; }
.mega-groups { width: 300px; max-height: 455px; padding: .6rem; overflow-y: auto; border-right: 1px solid var(--line); background: #fafbfc; }
.mega-group { position: static; }
.mega-parent { min-height: 42px; padding: .55rem .7rem; display: flex; align-items: center; justify-content: space-between; gap: .7rem; border-radius: 9px; font-size: .8rem; font-weight: 750; }
.mega-parent > span { display: flex; align-items: center; gap: .5rem; }
.mega-parent > span iconify-icon { color: #7f91aa; font-size: 1.1rem; }
.mega-parent > iconify-icon { color: #98a2b3; font-size: 1.1rem; }
.mega-group:hover > .mega-parent, .mega-group:focus-within > .mega-parent, .mega-group.is-active > .mega-parent { background: var(--soft-red); color: var(--red); }
.subcategory-panel { position: absolute; z-index: 1; left: 285px; right: 0; top: 0; bottom: 0; padding: 1.5rem 1.5rem 1.5rem 2.4rem; overflow-y: auto; visibility: hidden; opacity: 0; background: #fff; transition: opacity .12s ease; }
.mega-group:first-child .subcategory-panel, .mega-group:hover .subcategory-panel, .mega-group:focus-within .subcategory-panel, .mega-group.is-active .subcategory-panel { visibility: visible; opacity: 1; }
.mega-groups:has(.mega-group:hover) .mega-group:first-child:not(:hover) .subcategory-panel, .mega-groups:has(.mega-group:focus-within) .mega-group:first-child:not(:focus-within) .subcategory-panel, .mega-groups:has(.mega-group.is-active) .mega-group:not(.is-active) .subcategory-panel { visibility: hidden; opacity: 0; }
.subcategory-title { margin-bottom: 1.25rem; display: flex; justify-content: space-between; align-items: end; gap: 1rem; }
.subcategory-title small { color: var(--red); font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.subcategory-title h2 { margin: .2rem 0 0; font-size: 1.7rem; letter-spacing: -.035em; }
.subcategory-title > a { color: var(--red); font-size: .75rem; font-weight: 850; }
.subcategory-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.subcategory-links a { min-width: 0; padding: .8rem; display: flex; align-items: center; gap: .65rem; border: 1px solid var(--line); border-radius: 11px; font-size: .78rem; font-weight: 700; }
.subcategory-links a span { width: 31px; height: 31px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: #f3f5f8; color: var(--red); font-size: .72rem; font-weight: 950; }
.subcategory-links a:hover { border-color: #8bbcff; color: var(--red); box-shadow: 0 8px 20px rgba(16, 24, 39, .06); }

.retail-hero { max-width: 1480px; min-height: 520px; margin: 1.2rem auto 0; padding: clamp(2.2rem, 5vw, 5.2rem); display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: clamp(2rem, 6vw, 6rem); overflow: hidden; border-radius: 24px; color: #fff; background: radial-gradient(circle at 82% 8%, rgba(118, 190, 255, .42), transparent 25%), radial-gradient(circle at 5% 95%, rgba(10, 48, 107, .6), transparent 30%), linear-gradient(125deg, #082d64 0%, #126bd9 50%, #083f91 100%); box-shadow: 0 26px 70px rgba(8, 64, 145, .28); }
.hero-copy h1 { max-width: 780px; margin: .3rem 0 1.25rem; font-size: clamp(3rem, 5.8vw, 5.9rem); line-height: .94; letter-spacing: -.065em; }
.hero-copy h1 span { color: #9ed0ff; }
.hero-copy > p:not(.eyebrow) { max-width: 650px; margin-bottom: 1.8rem; color: #e5f2ff; font-size: 1.08rem; }
.eyebrow { margin: 0 0 .55rem; color: var(--red); font-size: .73rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.retail-hero .eyebrow { display: flex; align-items: center; gap: .4rem; color: #fff; }
.hero-actions { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border: 0; border-radius: 10px; background: var(--red); color: #fff; padding: .85rem 1.3rem; text-decoration: none; font-weight: 850; cursor: pointer; box-shadow: 0 8px 18px rgba(20, 104, 212, .18); }
.button:hover, .button:focus-visible { background: var(--red-dark); transform: translateY(-3px); box-shadow: 0 13px 26px rgba(20, 104, 212, .27); }
.button-light { background: #fff; color: var(--red); }
.button-light:hover { background: #eef7ff; color: var(--red-dark); }
.button-dark { background: var(--navy); }
.button-dark:hover { background: #000; }
.button-secondary { background: #fff; color: var(--red); border: 1px solid var(--red); }
.hero-link { display: inline-flex; align-items: center; gap: .35rem; color: #fff; font-weight: 800; text-underline-offset: 4px; }
.hero-link:hover { gap: .65rem; color: #b9dcff; transform: translateY(-2px); }
.hero-showcase { min-width: 0; padding: 1.2rem; border-radius: 22px; background: rgba(255, 255, 255, .97); color: var(--ink); box-shadow: 0 30px 70px rgba(4, 33, 74, .35); transform: rotate(1deg); transition: transform .35s ease, box-shadow .35s ease; }
.hero-showcase:hover { transform: rotate(0) translateY(-5px); box-shadow: 0 38px 80px rgba(4, 33, 74, .42); }
.showcase-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .25rem .2rem 1rem; color: var(--muted); font-size: .75rem; }
.promo-pill { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .65rem; border-radius: 99px; background: var(--soft-red); color: var(--red); font-weight: 850; }
.showcase-product { display: grid; grid-template-columns: .8fr 1.2fr; gap: 1.25rem; align-items: center; padding: 1.1rem; border-radius: 16px; background: #f7f8fa; }
.showcase-product small { color: var(--red); font-weight: 850; }
.showcase-product strong { display: block; margin: .35rem 0; font-size: clamp(1.5rem, 3vw, 2.5rem); letter-spacing: -.04em; }
.showcase-product p { margin: 0; color: var(--muted); font-size: .85rem; }
.showcase-art { position: relative; min-height: 185px; display: grid; place-items: center; overflow: hidden; border-radius: 14px; background: linear-gradient(145deg, #181f2d, #313d54); color: #fff; }
.showcase-art span { z-index: 2; font-size: 3rem; font-weight: 950; letter-spacing: -.12em; }
.showcase-art i, .showcase-art b { position: absolute; width: 110px; height: 110px; border: 18px solid #3d94ff; border-radius: 50%; opacity: .65; }
.showcase-art i { left: -40px; top: -35px; }
.showcase-art b { right: -45px; bottom: -45px; border-color: #fff; opacity: .12; }
.showcase-stats { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; padding-top: .8rem; }
.showcase-stats span { padding: .8rem; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .1rem .5rem; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); font-size: .75rem; }
.showcase-stats span > iconify-icon { grid-row: 1 / 3; color: var(--red); font-size: 1.55rem; }
.showcase-stats strong { display: block; color: var(--ink); font-size: .86rem; }

.benefit-strip { max-width: 1480px; margin: 1.2rem auto; padding: 1rem 1.5rem; display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.benefit-strip > div { min-width: 0; display: flex; align-items: center; gap: .8rem; padding: .45rem 1.1rem; border-right: 1px solid var(--line); }
.benefit-strip > div:last-child { border: 0; }
.benefit-icon { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--soft-red); color: var(--red); font-weight: 900; }
.benefit-strip p { display: grid; margin: 0; }
.benefit-strip strong { font-size: .84rem; }
.benefit-strip small { color: var(--muted); font-size: .72rem; }

.section, .catalog-shell, .narrow, .status-card, .product-detail { max-width: 1480px; margin: 0 auto; padding: 3.25rem 2rem; }
.section-heading, .catalog-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.5rem; }
.section-heading h2, .catalog-heading h1 { margin: 0; font-size: clamp(2rem, 3.4vw, 3.2rem); line-height: 1; letter-spacing: -.045em; }
.catalog-heading p:last-child { margin-bottom: 0; color: var(--muted); }
.section-link { color: var(--red); font-weight: 850; text-decoration: none; }
.section-link::after { content: "  →"; }
.section-link:hover { color: var(--red-dark); transform: translateX(4px); }
.category-grid { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: .8rem; }
.category-grid a { min-width: 0; padding: 1rem .75rem; display: grid; justify-items: center; gap: .45rem; background: #fff; border: 1px solid var(--line); border-radius: 14px; text-align: center; text-decoration: none; transition: transform .2s, border-color .2s, box-shadow .2s; }
.category-grid a:hover { transform: translateY(-4px); border-color: #8bbcff; box-shadow: var(--shadow); }
.category-grid strong { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; }
.category-grid small { color: var(--muted); font-size: .68rem; }
.category-icon { width: 68px; height: 68px; display: grid; place-items: center; border-radius: 18px; background: #f3f5f8; color: var(--red); font-size: 1.4rem; font-weight: 950; }
.category-icon iconify-icon { font-size: 2rem; transition: transform .25s ease; }
.category-grid a:hover .category-icon iconify-icon { transform: scale(1.14) rotate(-5deg); }
.category-icon-2, .category-icon-6 { background: #edf7f3; color: #14795c; }
.category-icon-3, .category-icon-7 { background: #eef3ff; color: #315dbe; }
.category-icon-4, .category-icon-8 { background: #fff7e8; color: #a96100; }

.product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.product-rail { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.product-card { min-width: 0; overflow: hidden; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 15px; transition: transform .2s, box-shadow .2s, border-color .2s; }
.product-card:hover { transform: translateY(-4px); border-color: #8bbcff; box-shadow: var(--shadow); }
.product-image { position: relative; aspect-ratio: 1.15; display: grid; place-items: center; overflow: hidden; background: linear-gradient(145deg, #fff, #f4f5f7); text-decoration: none; }
.product-image img { width: 100%; height: 100%; object-fit: contain; padding: .75rem; }
.product-image img, .product-image > span { transition: transform .3s ease; }
.product-card:hover .product-image img { transform: scale(1.045); }
.product-card:hover .product-image > span { transform: rotate(0) scale(1.04); }
.product-image > span { width: 92px; height: 92px; display: grid; place-items: center; border-radius: 24px; background: var(--navy); color: #fff; font-size: 1.7rem; font-weight: 950; letter-spacing: -.1em; transform: rotate(-5deg); }
.card-badge { position: absolute; left: .75rem; top: .75rem; padding: .32rem .58rem; display: inline-flex; align-items: center; gap: .25rem; border-radius: 6px; background: var(--red); color: #fff; font-size: .62rem; font-style: normal; font-weight: 850; }
.product-body { flex: 1; padding: 1rem; display: flex; flex-direction: column; }
.brand-name { color: var(--muted); font-size: .67rem; font-weight: 850; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.product-body h3 { min-height: 3.8em; margin: .35rem 0 .4rem; font-size: .94rem; line-height: 1.28; font-weight: 700; }
.product-body h3 a { text-decoration: none; }
.sku, .muted { color: var(--muted); font-size: .78rem; }
.stock { margin: .6rem 0; display: flex; align-items: center; gap: .35rem; font-size: .72rem; font-weight: 800; }
.stock span { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.stock-local, .stock-local_and_supplier { color: var(--success); }
.stock-supplier { color: var(--warning); }
.stock-unavailable { color: #8b3b46; }
.price { margin: auto 0 .75rem; color: var(--red); font-size: 1.35rem; font-weight: 900; letter-spacing: -.03em; }
.price small { display: block; color: var(--muted); font-size: .65rem; font-weight: 600; letter-spacing: 0; }
.price b { color: var(--muted); font-size: .63rem; letter-spacing: 0; }
.card-actions { position: relative; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding-top: .75rem; border-top: 1px solid var(--line); }
.text-link { display: inline-flex; align-items: center; gap: .25rem; font-size: .78rem; font-weight: 850; text-decoration: none; }
.text-link:hover { gap: .5rem; color: var(--red); }
.quick-add { width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 9px; background: var(--red); color: #fff; cursor: pointer; }
.quick-add:hover { background: var(--red-dark); transform: translateY(-3px) rotate(-4deg); box-shadow: 0 8px 18px rgba(20,104,212,.28); }
.quick-feedback { position: absolute; z-index: 3; left: 0; right: 0; top: calc(100% + .5rem); }
.quick-feedback:empty { display: none; }
.quick-feedback .notice { margin: 0; box-shadow: var(--shadow); }

.promo-band { max-width: 1416px; margin: 2rem auto; padding: clamp(2rem, 4vw, 3.5rem); display: flex; align-items: end; justify-content: space-between; gap: 2rem; border-radius: 20px; background: linear-gradient(115deg, #fff 0%, #fff 60%, #dcecff 100%); border: 1px solid #b8d7fb; box-shadow: var(--shadow); }
.promo-band h2 { max-width: 850px; margin: .4rem 0 .8rem; font-size: clamp(2rem, 4vw, 3.8rem); line-height: 1; letter-spacing: -.05em; }
.promo-band p { max-width: 820px; margin-bottom: 0; color: var(--muted); }
.promo-kicker { color: var(--red); font-size: .75rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.brand-row { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .75rem; }
.brand-row a { min-width: 0; padding: .8rem; display: flex; align-items: center; gap: .65rem; background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; text-decoration: none; font-size: .8rem; font-weight: 750; }
.brand-row a > span { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: var(--navy); color: #fff; font-size: .62rem; text-transform: uppercase; }
.brand-row a:hover { border-color: var(--red); color: var(--red); }

.directory-shell { max-width: 1480px; margin: 0 auto; padding: 2.25rem 2rem 4rem; }
.breadcrumbs { margin-bottom: 1.25rem; display: flex; align-items: center; gap: .55rem; color: var(--muted); font-size: .75rem; }
.breadcrumbs a { text-decoration: none; }
.breadcrumbs a:hover { color: var(--red); }
.directory-hero { margin-bottom: 1.25rem; padding: clamp(1.8rem, 4vw, 3.2rem); display: grid; grid-template-columns: 1fr minmax(320px, 520px); align-items: end; gap: 2rem; border-radius: 20px; background: linear-gradient(125deg, #fff 0%, #fff 62%, #e5f1ff 100%); border: 1px solid var(--line); }
.directory-hero h1 { margin: .25rem 0 .7rem; font-size: clamp(2.7rem, 5vw, 5rem); line-height: .95; letter-spacing: -.055em; }
.directory-hero p:last-child { max-width: 720px; margin-bottom: 0; color: var(--muted); }
.directory-search { height: 50px; display: flex; overflow: hidden; border: 1px solid #cfd4dc; border-radius: 11px; background: #fff; }
.directory-search input { width: 100%; min-width: 0; padding: .75rem 1rem; border: 0; outline: 0; }
.directory-search:focus-within { outline: 2px solid #8fc3ff; border-color: var(--red); }
.directory-search button { padding: 0 1.2rem; border: 0; background: var(--red); color: #fff; font-weight: 850; cursor: pointer; }
.alphabet-nav { margin: 1rem 0; padding: .8rem; display: flex; gap: .35rem; overflow-x: auto; background: #fff; border: 1px solid var(--line); border-radius: 13px; }
.alphabet-nav a { min-width: 32px; height: 32px; padding: 0 .45rem; display: grid; place-items: center; border-radius: 7px; color: var(--muted); font-size: .72rem; font-weight: 850; text-decoration: none; }
.alphabet-nav a:first-child { min-width: 62px; }
.alphabet-nav a:hover, .alphabet-nav a.active { background: var(--red); color: #fff; }
.directory-summary { margin: 1.2rem 0; color: var(--muted); font-size: .85rem; }
.directory-summary strong { color: var(--ink); font-size: 1rem; }
.directory-summary a { color: var(--red); font-weight: 800; }
.brand-directory-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .8rem; }
.brand-directory-grid > a { min-width: 0; min-height: 138px; padding: 1rem; display: grid; align-content: center; justify-items: center; gap: .45rem; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 13px; text-align: center; text-decoration: none; }
.brand-directory-grid > a > span { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 13px; background: var(--navy); color: #fff; font-size: .78rem; font-weight: 950; text-transform: uppercase; }
.brand-directory-grid > a strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; }
.brand-directory-grid > a small { color: var(--muted); font-size: .68rem; }
.brand-directory-grid > a:hover { transform: translateY(-3px); border-color: #8bbcff; color: var(--red); box-shadow: var(--shadow); }
.directory-empty { grid-column: 1 / -1; }
.category-directory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.category-directory-card { min-width: 0; padding: 1.15rem; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 15px; }
.category-directory-title { display: flex; align-items: center; gap: .85rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); text-decoration: none; }
.category-directory-title > span { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 12px; background: var(--soft-red); color: var(--red); font-size: 1.15rem; font-weight: 950; }
.category-directory-title small { color: var(--muted); font-size: .62rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.category-directory-title h2 { margin: .1rem 0 0; font-size: 1.15rem; letter-spacing: -.02em; }
.category-directory-title:hover { color: var(--red); }
.category-directory-links { padding: .75rem 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .15rem .65rem; }
.category-directory-links a { min-width: 0; padding: .42rem .35rem; display: flex; align-items: center; justify-content: space-between; gap: .4rem; border-radius: 7px; color: #4b5565; font-size: .74rem; text-decoration: none; }
.category-directory-links a:hover { background: var(--soft-red); color: var(--red); }
.category-directory-all { margin-top: auto; padding-top: .75rem; color: var(--red); font-size: .72rem; font-weight: 850; text-decoration: none; }
.category-search-results { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .8rem; }
.category-search-results > a { min-width: 0; padding: .9rem; display: flex; align-items: center; gap: .7rem; background: #fff; border: 1px solid var(--line); border-radius: 11px; text-decoration: none; }
.category-search-results > a > span { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: var(--soft-red); color: var(--red); font-weight: 900; }
.category-search-results > a strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .78rem; }
.category-search-results > a:hover { border-color: var(--red); color: var(--red); }
.filters { margin-bottom: 2rem; padding: 1rem; display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 1rem; align-items: end; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 8px 25px rgba(16, 24, 39, .04); }
.filters label, .request-form label, .detail-main label { display: grid; gap: .35rem; color: #394152; font-size: .76rem; font-weight: 800; }
.filters input, .filters select, .request-form input, .request-form select, .request-form textarea, .detail-main input { width: 100%; border: 1px solid #cfd4dc; border-radius: 8px; background: #fff; padding: .7rem; color: var(--ink); }
.filters input:focus, .filters select:focus, .request-form input:focus, .request-form textarea:focus { outline: 2px solid #8fc3ff; border-color: var(--red); }
.price-filter { display: flex; gap: .6rem; }
.catalog-wide { max-width: 1720px; }
.catalog-shell.catalog-wide { padding-top: 1.35rem; }
.catalog-heading-wide { min-height: 52px; align-items: center; margin-bottom: .85rem; padding: 0 0 .75rem; border-bottom: 1px solid var(--line); }
.catalog-heading-title { min-width: 0; display: flex; align-items: center; gap: .65rem; }
.catalog-heading-title > iconify-icon { width: 34px; height: 34px; padding: .42rem; flex: 0 0 auto; border-radius: 9px; background: var(--soft-red); color: var(--red); font-size: 1.25rem; }
.catalog-heading-wide .catalog-heading-title h1 { overflow: hidden; font-size: clamp(1.35rem, 2vw, 1.9rem); line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
.catalog-heading-facts { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .42rem; }
.catalog-heading-facts span, .catalog-heading-facts a { min-height: 30px; padding: .35rem .62rem; display: inline-flex; align-items: center; gap: .28rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--muted); font-size: .66rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.catalog-heading-facts strong { color: var(--ink); font-size: .72rem; }
.catalog-heading-facts a { border-color: #a8caf1; background: var(--soft-red); color: var(--red); }
.catalog-heading-facts a strong { color: inherit; }
.catalog-heading-facts a:hover { border-color: var(--red); transform: translateY(-1px); }
.catalog-layout { display: grid; grid-template-columns: 325px minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.filter-sidebar { position: sticky; top: 190px; z-index: 5; }
.filter-disclosure { overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 10px 30px rgba(16, 24, 39, .05); }
.filter-disclosure > summary { display: none; }
.filter-sidebar form { display: block; }
.filter-sidebar-heading { min-height: 74px; padding: 1rem; display: flex; align-items: center; justify-content: space-between; gap: .8rem; border-bottom: 1px solid var(--line); }
.filter-sidebar-heading > div { display: flex; align-items: center; gap: .7rem; }
.filter-sidebar-heading > a { color: var(--red); font-size: .7rem; font-weight: 850; text-decoration: none; }
.filter-sidebar-heading strong, .filter-sidebar-heading small { display: block; }
.filter-sidebar-heading small { color: var(--muted); font-size: .66rem; }
.filter-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: var(--red); color: #fff; font-size: 1.1rem; font-weight: 950; }
.filter-search { padding: 1rem; display: grid; gap: .35rem; color: #394152; font-size: .72rem; font-weight: 850; border-bottom: 1px solid var(--line); }
.filter-search input, .facet-search input, .price-range-filter input, .sort-filter select { width: 100%; min-width: 0; padding: .68rem .72rem; border: 1px solid #cfd4dc; border-radius: 8px; background: #fff; color: var(--ink); outline: 0; }
.filter-search input:focus, .facet-search input:focus, .price-range-filter input:focus, .sort-filter select:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(20, 104, 212, .12); }
.filter-search small { color: var(--muted); font-size: .62rem; font-weight: 500; }
.facet-group { border-bottom: 1px solid var(--line); }
.facet-group > summary { min-height: 50px; padding: .7rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: .8rem; list-style: none; font-size: .78rem; font-weight: 900; cursor: pointer; }
.facet-group > summary::-webkit-details-marker { display: none; }
.facet-group > summary > span { display: inline-flex; align-items: center; gap: .45rem; }
.facet-group > summary > span iconify-icon { color: var(--red); font-size: 1.1rem; }
.facet-group > summary::after { content: "+"; margin-left: auto; color: var(--muted); font-size: 1rem; }
.facet-group[open] > summary::after { content: "−"; }
.facet-group > summary b { min-width: 25px; padding: .18rem .35rem; border-radius: 99px; background: #f1f3f6; color: var(--muted); font-size: .6rem; text-align: center; }
.facet-body { padding: 0 1rem 1rem; }
.facet-search { display: block; margin-bottom: .55rem; }
.facet-search input { padding: .55rem .65rem; font-size: .72rem; }
.facet-options { display: grid; gap: .12rem; }
.brand-facet-options, .category-facet-options { max-height: 275px; padding-right: .2rem; overflow-y: auto; scrollbar-width: thin; }
.facet-category-group { padding-bottom: .3rem; }
.facet-option { min-width: 0; padding: .36rem .25rem; display: grid; grid-template-columns: 17px minmax(0, 1fr) auto; align-items: center; gap: .5rem; border-radius: 6px; color: #424b5d; font-size: .7rem; cursor: pointer; }
.facet-option:hover { background: #f7f8fa; color: var(--red); }
.facet-option input { width: 16px; height: 16px; margin: 0; accent-color: var(--red); }
.facet-option span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.facet-option small { color: #98a2b3; font-size: .6rem; }
.facet-parent { color: var(--ink); font-weight: 850; }
.facet-child { padding-left: 1rem; }
.facet-directory-link { display: block; margin-top: .65rem; color: var(--red); font-size: .66rem; font-weight: 850; text-decoration: none; }
.price-range-filter { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.price-range-filter label { display: grid; gap: .3rem; color: var(--muted); font-size: .65rem; font-weight: 750; }
.sort-filter { padding: 1rem; display: grid; gap: .4rem; color: #394152; font-size: .72rem; font-weight: 850; }
.sort-filter select { font-size: .72rem; }
.filter-actions { padding: 0 1rem 1rem; display: grid; gap: .6rem; text-align: center; }
.filter-actions .button { width: 100%; }
.filter-actions > a { color: var(--muted); font-size: .68rem; font-weight: 750; }
.catalog-main { min-width: 0; }
.catalog-main .product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.results-toolbar { min-height: 52px; margin-bottom: .8rem; padding: .7rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: #fff; border: 1px solid var(--line); border-radius: 11px; }
.results-toolbar strong { color: var(--ink); font-size: 1rem; }
.results-toolbar span { color: var(--muted); font-size: .72rem; }
.active-filters { margin-bottom: .9rem; display: flex; align-items: center; flex-wrap: wrap; gap: .45rem; }
.active-filters > span { margin-right: .2rem; color: var(--muted); font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.active-filters a { padding: .4rem .58rem; display: inline-flex; align-items: center; gap: .35rem; border-radius: 99px; background: #fff; border: 1px solid #a8caf1; color: #164f91; font-size: .67rem; font-weight: 750; text-decoration: none; }
.active-filters a:hover { border-color: var(--red); background: var(--soft-red); }
.active-filters .clear-filters { border-color: transparent; background: transparent; color: var(--muted); text-decoration: underline; }
.results { min-height: 50vh; }
.result-count { color: var(--muted); }
.pagination { min-width: 0; display: flex; align-items: center; justify-content: center; gap: .45rem; }
.pagination-top { justify-content: flex-end; padding: 0; }
.pagination-bottom { margin-top: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.pagination-pages { min-width: 0; display: flex; align-items: center; justify-content: center; gap: .25rem; }
.pagination-direction, .pagination-page { min-width: 34px; min-height: 34px; padding: .42rem .62rem; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: #344054; font-size: .7rem; font-weight: 800; line-height: 1; text-decoration: none; white-space: nowrap; transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease; }
.pagination-page { padding-inline: .5rem; }
.pagination a:hover { border-color: #8bbcff; background: var(--soft-red); color: var(--red); box-shadow: 0 5px 12px rgba(20, 104, 212, .09); transform: translateY(-1px); }
.pagination-page.is-current { border-color: var(--red); background: var(--red); color: #fff; box-shadow: 0 5px 12px rgba(20, 104, 212, .18); }
.pagination-direction.is-disabled { color: #a3adba; background: #f5f7f9; cursor: not-allowed; }
.pagination-ellipsis { min-width: 22px; color: var(--muted); font-size: .8rem; text-align: center; }
.channel-wholesale .pagination-page.is-current { background: #3d89a9; border-color: #3d89a9; }
.empty { padding: 3rem; background: #fff; border: 1px dashed #c6cbd3; border-radius: 16px; text-align: center; }
.empty-icon { width: 72px; height: 72px; margin: auto; display: grid; place-items: center; border-radius: 20px; background: var(--soft-red); color: var(--red); font-weight: 950; }

.product-detail { display: grid; grid-template-columns: 1.05fr .95fr; gap: 4rem; }
.detail-image { aspect-ratio: 1; display: grid; place-items: center; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 18px; }
.detail-image img { width: 100%; height: 100%; object-fit: contain; }
.detail-image span { width: 140px; height: 140px; display: grid; place-items: center; border-radius: 32px; background: var(--navy); color: #fff; font-size: 2.8rem; font-weight: 950; transform: rotate(-5deg); }
.detail-main { padding-top: 2rem; }
.detail-main h1 { margin: .55rem 0 1rem; font-size: clamp(2.1rem, 4vw, 4.2rem); line-height: 1.02; letter-spacing: -.05em; }
.detail-price { font-size: 2rem; }
.availability { margin: 1.5rem 0; padding: 1rem; border-radius: 12px; background: #fff; border: 1px solid var(--line); }
.availability p { margin: .35rem 0; color: var(--muted); }
.availability strong, .availability p { display: flex; align-items: center; gap: .4rem; }
.availability iconify-icon, .detail-description h2 iconify-icon, .characteristics h2 iconify-icon { color: var(--red); }
.detail-description h2, .characteristics h2 { display: flex; align-items: center; gap: .55rem; }
.detail-buy { display: flex; align-items: end; gap: 1rem; }
.detail-buy label { max-width: 110px; }
.detail-description, .characteristics { grid-column: 1 / -1; max-width: 1000px; }
.characteristics dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
.characteristics dl div { display: grid; grid-template-columns: 1fr 1fr; padding: .7rem; border-bottom: 1px solid var(--line); }
.characteristics dt { font-weight: 800; }
.characteristics dd { margin: 0; }
.notice, .warning { padding: .9rem 1rem; border-radius: 9px; background: #fff3d8; color: #684106; font-size: .82rem; }
.notice { background: #eaf8f2; color: #0c5f43; }
.narrow, .status-card { max-width: 880px; }
.narrow h1, .status-card h1 { margin: .3rem 0 1rem; font-size: clamp(2.3rem, 5vw, 4.5rem); line-height: 1; letter-spacing: -.05em; }
.cart-list { display: grid; gap: .7rem; margin: 2rem 0; }
.cart-list article { padding: 1.2rem; display: grid; grid-template-columns: 1fr auto auto; gap: 1rem; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.cart-list article p { margin: .3rem 0 0; }
.cart-price { color: var(--red); font-weight: 900; }
.link-button { border: 0; background: none; color: #165aab; text-decoration: underline; cursor: pointer; }
.request-form { display: grid; gap: 1rem; padding: 2rem; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.request-form .errorlist { color: #9a2f45; }
.status-card { margin-top: 5rem; background: #fff; border-radius: 18px; box-shadow: var(--shadow); }
.page-icon { width: 58px; height: 58px; display: grid; place-items: center; margin-bottom: 1rem; border-radius: 17px; background: var(--soft-red); color: var(--red); font-size: 2rem; }

footer { margin-top: 4rem; background: var(--navy); color: #fff; }
.footer-inner { max-width: 1480px; margin: auto; padding: 3.5rem 2rem; display: grid; grid-template-columns: 1.65fr .75fr .75fr 1.2fr; gap: 3rem; }
.footer-inner > div:not(.footer-brand) { display: grid; align-content: start; gap: .6rem; }
.footer-inner a, .footer-inner span { color: #c7d7e9; text-decoration: none; font-size: .85rem; }
.footer-inner > div:not(.footer-brand) > a { display: flex; align-items: center; gap: .4rem; }
.footer-inner > div:not(.footer-brand) > a:hover { color: #fff; transform: translateX(4px); }
.footer-brand p { max-width: 560px; color: #c7ced9; }
.brand-inverse { color: #fff; }
.brand-inverse .brand-nameplate small { display: none; }
.footer-legal { max-width: 1480px; margin: auto; padding: 1rem 2rem 1.5rem; border-top: 1px solid #31394a; color: #929cac; font-size: .75rem; }
.footer-legal a { color: #b9d7fa; text-underline-offset: 3px; }
.footer-legal a:hover { color: #fff; }
.footer-location > a { align-items: flex-start !important; line-height: 1.45; }
.footer-location > a > iconify-icon { margin-top: .1rem; color: #64aaff; font-size: 1.35rem; }
.footer-location > a span { color: inherit; }
.mobile-nav { display: none; }

/* Repair-first merchandising */
.repair-feature { max-width: 1480px; margin: 1.8rem auto 0; padding: clamp(2.2rem, 5vw, 5rem); display: grid; grid-template-columns: 1fr .82fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; overflow: hidden; border-radius: 24px; background: linear-gradient(135deg, #071b35 0%, #0b2f62 58%, #0d5fc5 100%); color: #fff; box-shadow: 0 22px 58px rgba(7, 40, 84, .22); }
.repair-copy .eyebrow { display: flex; align-items: center; gap: .4rem; color: #80bcff; }
.repair-copy h2 { margin: .35rem 0 1rem; font-size: clamp(2.7rem, 5vw, 5.4rem); line-height: .94; letter-spacing: -.06em; }
.repair-copy h2 span { color: #8cc5ff; }
.repair-copy > p:not(.eyebrow) { max-width: 680px; color: #d2e2f5; font-size: 1.05rem; }
.repair-actions { margin: 1.7rem 0; display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; }
.repair-secondary { display: inline-flex; align-items: center; gap: .35rem; color: #fff; font-weight: 800; text-decoration: none; }
.repair-secondary:hover { gap: .65rem; color: #9dcdff; transform: translateY(-2px); }
.repair-device-list { display: flex; flex-wrap: wrap; gap: .55rem; }
.repair-device-list span { padding: .5rem .72rem; display: inline-flex; align-items: center; gap: .35rem; border: 1px solid rgba(255,255,255,.19); border-radius: 999px; background: rgba(255,255,255,.07); color: #e5f2ff; font-size: .75rem; font-weight: 750; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.repair-device-list span:hover { border-color: rgba(145,200,255,.7); background: rgba(71,151,241,.16); transform: translateY(-2px); }
.repair-device-list iconify-icon { color: #72b5ff; font-size: 1.1rem; }
.repair-console { padding: 1rem; border: 1px solid rgba(255,255,255,.22); border-radius: 23px; background: rgba(255,255,255,.96); color: var(--ink); box-shadow: 0 30px 70px rgba(0,0,0,.27); transform: rotate(-1deg); transition: transform .35s ease, box-shadow .35s ease; }
.repair-console:hover { transform: rotate(0) translateY(-5px); box-shadow: 0 38px 78px rgba(0,0,0,.34); }
.repair-console-head { padding: .2rem .2rem 1rem; display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: .75rem; font-weight: 800; }
.repair-console-head span { display: flex; align-items: center; gap: .4rem; }
.repair-console-head i { width: 8px; height: 8px; border-radius: 50%; background: #22a875; box-shadow: 0 0 0 5px rgba(34,168,117,.12); }
.repair-console-head > iconify-icon { color: var(--red); font-size: 1.45rem; }
.repair-device { position: relative; min-height: 260px; display: grid; place-items: center; overflow: hidden; border-radius: 17px; background: radial-gradient(circle, #e9f4ff, #dcecff 55%, #c6def8); }
.repair-device > iconify-icon { color: #0b539f; font-size: clamp(8rem, 16vw, 13rem); filter: drop-shadow(0 18px 18px rgba(8,62,121,.18)); }
.scan-line { position: absolute; left: 12%; right: 12%; height: 2px; top: 20%; background: #35a5ff; box-shadow: 0 0 18px 5px rgba(53,165,255,.4); animation: scan 3.4s ease-in-out infinite; }
@keyframes scan { 0%, 100% { top: 18%; opacity: .45; } 50% { top: 80%; opacity: 1; } }
.repair-checks { padding-top: .75rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; }
.repair-checks span { padding: .7rem; display: flex; align-items: center; gap: .35rem; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); font-size: .68rem; font-weight: 750; }
.repair-checks iconify-icon { color: var(--success); }
.repair-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.repair-steps article { position: relative; min-height: 260px; padding: 1.6rem; overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 18px; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.repair-steps article:hover { transform: translateY(-7px); border-color: #94c2f4; box-shadow: var(--shadow); }
.repair-steps article > span { position: absolute; right: 1rem; top: .7rem; color: #e4eef9; font-size: 3.8rem; font-weight: 950; letter-spacing: -.08em; }
.repair-steps article > iconify-icon { position: relative; color: var(--red); font-size: 3rem; }
.repair-steps h3 { position: relative; margin: 1.5rem 0 .5rem; font-size: 1.25rem; }
.repair-steps p { position: relative; margin: 0; color: var(--muted); }

/* Live location */
.location-section { max-width: 1480px; min-height: 470px; margin: 3rem auto; display: grid; grid-template-columns: .72fr 1.28fr; overflow: hidden; border: 1px solid var(--line); border-radius: 24px; background: #fff; box-shadow: var(--shadow); }
.location-copy { padding: clamp(2rem, 4vw, 4rem); display: flex; flex-direction: column; justify-content: center; }
.location-copy .eyebrow { display: flex; align-items: center; gap: .4rem; }
.location-copy h2 { margin: .3rem 0 1rem; font-size: clamp(2.4rem, 4vw, 4.3rem); line-height: .98; letter-spacing: -.055em; }
.location-copy > p { max-width: 520px; color: var(--muted); }
.location-copy address { margin: 1rem 0 1.5rem; padding: 1rem; display: flex; align-items: flex-start; gap: .7rem; border-radius: 13px; background: var(--soft-red); color: #24466f; font-style: normal; }
.location-copy address iconify-icon { margin-top: .15rem; color: var(--red); font-size: 1.5rem; }
.location-copy .button { align-self: flex-start; }
.map-widget { position: relative; min-height: 470px; overflow: hidden; background: #dce8f5; }
.map-widget iframe { width: 100%; height: 100%; min-height: 470px; display: block; border: 0; filter: saturate(.8) contrast(1.03); }
.map-label { position: absolute; z-index: 2; left: 1rem; bottom: 1rem; padding: .8rem 1rem; display: grid; grid-template-columns: auto 1fr; gap: 0 .55rem; align-items: center; border: 1px solid rgba(255,255,255,.7); border-radius: 13px; background: rgba(255,255,255,.94); color: var(--ink); box-shadow: 0 12px 30px rgba(8,42,84,.2); backdrop-filter: blur(10px); }
.map-label iconify-icon { grid-row: 1 / 3; color: var(--red); font-size: 1.8rem; }
.map-label small { color: var(--muted); }

a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid rgba(20,104,212,.28); outline-offset: 3px; }

@media (max-width: 1180px) {
  .header-main { grid-template-columns: 220px 1fr auto; gap: 1rem; }
  .header-actions > a:first-child { display: none; }
  .primary-inner { gap: 1.25rem; }
  .category-grid { grid-template-columns: repeat(4, 1fr); }
  .product-rail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .brand-row { grid-template-columns: repeat(4, 1fr); }
  .catalog-layout { grid-template-columns: 290px minmax(0, 1fr); gap: 1rem; }
  .catalog-main .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .brand-directory-grid { grid-template-columns: repeat(4, 1fr); }
  .category-directory-grid { grid-template-columns: repeat(2, 1fr); }
  .category-search-results { grid-template-columns: repeat(3, 1fr); }
  .footer-inner { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-location { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
  .utility-bar, .primary-nav { display: none; }
  .site-header { position: sticky; }
  .header-main { min-height: auto; grid-template-columns: 1fr auto; padding: .75rem 1rem; }
  .header-search { grid-column: 1 / -1; grid-row: 2; height: 46px; }
  .header-actions > a:first-child { display: none; }
  .mobile-channel-switch { display: flex; }
  .cart-action span { display: none; }
  .retail-hero { margin: .7rem; grid-template-columns: 1fr; padding: 3.5rem 2rem; }
  .hero-showcase { max-width: 650px; }
  .repair-feature { margin: .7rem; grid-template-columns: 1fr; padding: 3.5rem 2rem; }
  .repair-console { max-width: 650px; }
  .location-section { margin: 1rem; grid-template-columns: 1fr; }
  .map-widget, .map-widget iframe { min-height: 390px; }
  .benefit-strip { margin: .7rem; grid-template-columns: repeat(2, 1fr); }
  .benefit-strip > div:nth-child(2) { border-right: 0; }
  .benefit-strip > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .product-grid { grid-template-columns: repeat(3, 1fr); }
  .product-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 34vw); grid-template-columns: none; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; padding: .25rem 0 1rem; }
  .product-rail .product-card { scroll-snap-align: start; }
  .filters { grid-template-columns: repeat(2, 1fr); }
  .product-detail { grid-template-columns: 1fr; gap: 1rem; }
  .detail-description, .characteristics { grid-column: auto; }
  .promo-band { margin: 1rem; align-items: start; flex-direction: column; }
  .directory-hero { grid-template-columns: 1fr; align-items: start; }
  .catalog-heading-wide { align-items: center; }
  .catalog-layout { grid-template-columns: 1fr; }
  .filter-sidebar { position: static; }
  .filter-disclosure > summary { min-height: 52px; padding: .75rem 1rem; display: flex; align-items: center; justify-content: space-between; list-style: none; color: #fff; background: var(--red); font-weight: 900; cursor: pointer; }
  .filter-disclosure > summary::-webkit-details-marker { display: none; }
  .filter-disclosure > summary b { min-width: 26px; padding: .15rem .4rem; border-radius: 99px; background: #fff; color: var(--red); font-size: .65rem; text-align: center; }
  .filter-sidebar-heading { display: none; }
  .brand-facet-options, .category-facet-options { max-height: 235px; }
  .catalog-main .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  body { padding-bottom: 70px; }
  .brand-mark { width: 39px; height: 39px; border-radius: 10px; font-size: .88rem; }
  .brand-nameplate { font-size: .84rem; }
  .brand-nameplate small { font-size: .52rem; }
  .header-search button span { display: none; }
  .header-search button { padding: 0 1rem; }
  .retail-hero { min-height: auto; padding: 2.8rem 1.2rem; border-radius: 18px; }
  .hero-copy h1 { font-size: clamp(3rem, 15vw, 4.8rem); }
  .showcase-product { grid-template-columns: 1fr; }
  .showcase-art { min-height: 130px; }
  .showcase-stats { grid-template-columns: 1fr; }
  .repair-feature { padding: 2.8rem 1.2rem; border-radius: 18px; }
  .repair-copy h2 { font-size: clamp(2.7rem, 13vw, 4.4rem); }
  .repair-device { min-height: 190px; }
  .repair-checks { grid-template-columns: 1fr; }
  .repair-steps { grid-template-columns: 1fr; }
  .repair-steps article { min-height: 220px; }
  .location-section { border-radius: 18px; }
  .location-copy { padding: 2rem 1.2rem; }
  .map-widget, .map-widget iframe { min-height: 330px; }
  .benefit-strip { grid-template-columns: 1fr; padding: .5rem 1rem; }
  .benefit-strip > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .benefit-strip > div:nth-child(3) { border-bottom: 1px solid var(--line); }
  .section, .catalog-shell, .narrow, .status-card, .product-detail { padding: 2.4rem 1rem; }
  .section-heading, .catalog-heading { align-items: start; }
  .catalog-shell.catalog-wide { padding-top: .85rem; }
  .catalog-heading-wide { min-height: 44px; margin-bottom: .65rem; padding-bottom: .6rem; align-items: center; }
  .catalog-heading-title > iconify-icon { width: 30px; height: 30px; padding: .35rem; }
  .catalog-heading-wide .catalog-heading-title h1 { font-size: 1.25rem; }
  .catalog-heading-facts { justify-content: flex-start; gap: .3rem; }
  .catalog-heading-facts span, .catalog-heading-facts a { min-height: 27px; padding: .28rem .5rem; font-size: .6rem; }
  .catalog-heading-facts span:nth-child(2), .catalog-heading-facts span:nth-child(3) { display: none; }
  .results-toolbar { align-items: stretch; flex-direction: column; }
  .results-toolbar > div:first-child { display: flex; align-items: baseline; gap: .25rem; }
  .pagination-top { width: 100%; justify-content: space-between; }
  .pagination-bottom { padding: .7rem; }
  .pagination-direction-label { display: none; }
  .pagination-direction, .pagination-page { min-width: 31px; min-height: 31px; padding: .38rem; }
  .pagination-pages { overflow-x: auto; justify-content: flex-start; scrollbar-width: none; }
  .pagination-pages::-webkit-scrollbar { display: none; }
  .category-grid { display: grid; grid-auto-flow: column; grid-auto-columns: 135px; grid-template-columns: none; overflow-x: auto; padding-bottom: .7rem; scroll-snap-type: inline mandatory; }
  .category-grid a { scroll-snap-align: start; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
  .product-rail { grid-auto-columns: minmax(235px, 77vw); }
  .product-body { padding: .8rem; }
  .product-body h3 { font-size: .86rem; }
  .product-image > span { width: 72px; height: 72px; font-size: 1.35rem; }
  .brand-row { display: flex; overflow-x: auto; }
  .brand-row a { min-width: 170px; }
  .directory-shell { padding: 1.4rem 1rem 3rem; }
  .directory-hero { padding: 1.5rem; }
  .directory-search { width: 100%; }
  .brand-directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .category-directory-grid, .category-search-results { grid-template-columns: 1fr; }
  .category-directory-links { grid-template-columns: 1fr 1fr; }
  .filters { grid-template-columns: 1fr; }
  .price-filter { flex-direction: column; }
  .detail-main { padding-top: 0; }
  .detail-buy { align-items: stretch; flex-direction: column; }
  .detail-buy label { max-width: none; }
  .characteristics dl { grid-template-columns: 1fr; }
  .characteristics dl div { grid-template-columns: 1fr; gap: .25rem; }
  .cart-list article { grid-template-columns: 1fr; }
  .request-form { padding: 1.2rem; }
  .footer-inner { grid-template-columns: 1fr; gap: 2rem; padding: 2.5rem 1rem; }
  .footer-legal { padding-inline: 1rem; }
  .mobile-nav { position: fixed; z-index: 30; left: 0; right: 0; bottom: 0; height: 68px; display: grid; grid-template-columns: repeat(5, 1fr); background: rgba(255, 255, 255, .97); border-top: 1px solid var(--line); box-shadow: 0 -8px 25px rgba(16, 24, 39, .1); backdrop-filter: blur(10px); }
  .mobile-nav a { display: grid; place-items: center; align-content: center; gap: .12rem; color: var(--muted); font-size: .65rem; font-weight: 750; text-decoration: none; }
  .mobile-nav a:first-child, .mobile-nav a:hover { color: var(--red); }
  .mobile-nav iconify-icon { font-size: 1.3rem; }
  .mobile-nav .mobile-repair { position: relative; color: #fff; }
  .mobile-nav .mobile-repair::before { content: ""; position: absolute; z-index: -1; width: 50px; height: 50px; top: -10px; border-radius: 16px; background: var(--red); box-shadow: 0 8px 20px rgba(20,104,212,.3); }
}

@media (max-width: 400px) {
  .product-grid:not(.product-rail) { grid-template-columns: 1fr; }
  .hero-copy h1 { font-size: 2.8rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Channel identity and catalog-first home */
body.channel-retail { --channel-accent: #1468d4; --channel-deep: #082d64; }
body.channel-wholesale {
  --red: #176b9b;
  --red-dark: #0b4d76;
  --navy: #071e2c;
  --ink: #102b3a;
  --muted: #607681;
  --paper: #eef4f6;
  --line: #d4e1e6;
  --soft-red: #e5f2f6;
  --channel-accent: #1b7899;
  --channel-deep: #061d2b;
  --radius: 12px;
}
.channel-wholesale .site-header { border-bottom: 2px solid #b8d1db; box-shadow: 0 5px 20px rgba(4, 37, 54, .08); }
.channel-wholesale .brand-mark, .channel-wholesale .filter-icon { border-radius: 5px; transform: none; }
.channel-wholesale .header-search, .channel-wholesale .product-card, .channel-wholesale .filter-disclosure { border-radius: 7px; }
.channel-wholesale .primary-nav { background: #f8fbfc; }
.channel-wholesale .category-menu > summary { background: linear-gradient(135deg, #2f83aa, #4898b9); box-shadow: inset 0 -1px 0 rgba(5, 46, 65, .12); }
.channel-wholesale .mega-group:hover > .mega-parent, .channel-wholesale .mega-group:focus-within > .mega-parent, .channel-wholesale .mega-group.is-active > .mega-parent { background: #edf8fb; color: #2b7898; }
.channel-wholesale .subcategory-title small, .channel-wholesale .subcategory-title > a, .channel-wholesale .subcategory-tree-all { color: #3181a1; }
.channel-wholesale .subcategory-initial, .channel-wholesale .subcategory-tree-leaf > span { background: #edf8fb; color: #3d8eac; }
.channel-switch { padding: .18rem; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; background: rgba(255,255,255,.07); }
.channel-switch-label { margin-left: .45rem; color: #acbac9; font-size: .64rem; text-transform: uppercase; letter-spacing: .08em; }
.channel-switch form { display: flex; }
.channel-switch button, .channel-current { min-height: 28px; padding: .25rem .62rem; display: inline-flex; align-items: center; gap: .3rem; border-radius: 999px; white-space: nowrap; }
.channel-current { background: #fff; color: var(--navy); font-size: .7rem; }
.channel-switch button { border: 0; color: #dce7f2; }
.channel-switch button:hover { box-shadow: none; }

.channel-hero { max-width: 1480px; min-height: 455px; margin: 1.2rem auto 0; padding: clamp(2.2rem, 5vw, 4.6rem); display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: clamp(2rem, 6vw, 6rem); overflow: hidden; border-radius: 24px; color: #fff; }
.channel-hero .hero-copy h1 { font-size: clamp(3rem, 5.4vw, 5.5rem); }
.retail-shopping-hero { min-height: 455px; }
.retail-picks { padding: .9rem; display: grid; gap: .6rem; border-radius: 20px; background: rgba(255,255,255,.97); color: var(--ink); box-shadow: 0 30px 70px rgba(4,33,74,.34); }
.retail-picks-head { padding: .45rem .6rem .8rem; display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: .78rem; font-weight: 800; }
.retail-picks-head iconify-icon { color: var(--red); font-size: 1.4rem; }
.retail-picks > a { min-height: 82px; padding: .85rem 1rem; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .8rem; border: 1px solid var(--line); border-radius: 13px; text-decoration: none; }
.retail-picks > a > iconify-icon:first-child { width: 44px; height: 44px; padding: .55rem; border-radius: 12px; background: var(--soft-red); color: var(--red); font-size: 1.45rem; }
.retail-picks > a > iconify-icon:last-child { color: #9aa7b7; }
.retail-picks > a span { display: grid; }
.retail-picks > a strong { font-size: .92rem; }
.retail-picks > a small { color: var(--muted); font-size: .72rem; }
.retail-picks > a:hover { transform: translateX(5px); border-color: #88baff; color: var(--red); box-shadow: 0 8px 22px rgba(8,70,150,.08); }
.wholesale-hero { border-radius: 12px; background: radial-gradient(circle at 85% 10%, rgba(61,182,209,.25), transparent 27%), linear-gradient(120deg, #061c2a 0%, #0c3d57 58%, #126b82 100%); box-shadow: 0 24px 65px rgba(4,43,62,.25); }
.wholesale-hero .hero-copy h1 span { color: #7ed2df; }
.wholesale-console { padding: 1rem; border: 1px solid rgba(150,220,231,.3); border-radius: 9px; background: rgba(6,27,40,.72); box-shadow: 0 28px 70px rgba(0,0,0,.28); backdrop-filter: blur(10px); }
.console-title { padding: .35rem .35rem 1rem; display: flex; justify-content: space-between; color: #9fc0cf; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
.console-title span { display: inline-flex; align-items: center; gap: .4rem; }
.console-title i { width: 7px; height: 7px; border-radius: 50%; background: #4cdbb3; box-shadow: 0 0 0 5px rgba(76,219,179,.1); }
.console-title strong { color: #d9f5fa; }
.console-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.console-metrics article { padding: 1rem; display: grid; border: 1px solid rgba(150,220,231,.18); border-radius: 6px; background: rgba(255,255,255,.05); }
.console-metrics small, .console-metrics span { color: #9eb8c5; font-size: .65rem; }
.console-metrics strong { color: #fff; font-size: 2rem; line-height: 1.1; }
.wholesale-console dl { margin: .7rem 0 0; display: grid; gap: .45rem; }
.wholesale-console dl div { padding: .7rem .8rem; display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px solid rgba(150,220,231,.12); font-size: .72rem; }
.wholesale-console dt { display: inline-flex; align-items: center; gap: .4rem; color: #dff7fa; font-weight: 800; }
.wholesale-console dd { margin: 0; color: #9eb8c5; text-align: right; }
.channel-benefits { max-width: 1480px; margin: .8rem auto 0; padding: .75rem 1rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; background: #fff; border: 1px solid var(--line); border-radius: 13px; }
.channel-benefits span { padding: .55rem 1rem; display: flex; align-items: center; justify-content: center; gap: .45rem; border-right: 1px solid var(--line); color: var(--muted); font-size: .75rem; }
.channel-benefits span:last-child { border-right: 0; }
.channel-benefits iconify-icon { color: var(--red); font-size: 1.25rem; }
.channel-benefits b { color: var(--ink); }
.first-merchandising-section { padding-top: 2.1rem; }

.brand-showcase { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: .65rem; }
.brand-showcase a { min-width: 0; min-height: 105px; padding: .8rem; display: grid; align-content: space-between; border: 1px solid var(--line); border-radius: 12px; background: #fff; text-decoration: none; }
.brand-showcase strong { overflow: hidden; color: var(--ink); font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.brand-showcase span { display: flex; align-items: center; gap: .25rem; color: var(--muted); font-size: .62rem; }
.brand-showcase a:hover { transform: translateY(-4px); border-color: var(--red); box-shadow: var(--shadow); }
.brand-showcase a:hover span { color: var(--red); }
.product-image-placeholder { width: 100% !important; height: 100% !important; padding: 1rem; display: grid !important; place-items: center; align-content: center; gap: .45rem; border-radius: 0 !important; background: linear-gradient(145deg,#f7faff,#edf3fa) !important; color: var(--red) !important; transform: none !important; }
.product-image-placeholder iconify-icon { font-size: 4rem; opacity: .72; }
.product-image-placeholder small { max-width: 90%; overflow: hidden; color: var(--muted); font-size: .67rem; font-weight: 850; letter-spacing: .08em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.channel-wholesale .product-image-placeholder { background: linear-gradient(145deg,#f4f8f9,#e5eef1) !important; }
.product-card-technical .product-body h3 { min-height: 3.2em; font-size: .86rem; }
.technical-identifiers { display: grid; gap: .15rem; padding: .5rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted); font: .65rem/1.35 ui-monospace, SFMono-Regular, Consolas, monospace; }
.technical-identifiers span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.technical-identifiers b { color: var(--ink); font-size: .56rem; letter-spacing: .06em; }
.technical-stock { margin: 0 0 .55rem; display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
.technical-stock span { padding: .38rem .45rem; display: flex; align-items: center; justify-content: space-between; border-radius: 4px; background: #edf4f6; }
.technical-stock small { color: var(--muted); font-size: .58rem; text-transform: uppercase; }
.technical-stock b { color: var(--ink); font-size: .72rem; }
.price em { display: block; color: var(--muted); font-size: .56rem; font-style: normal; font-weight: 600; letter-spacing: 0; }
.channel-wholesale .product-card:hover { transform: translateY(-2px); border-color: #71a9bb; box-shadow: 0 10px 25px rgba(8,53,69,.11); }

/* Collapsible category facets and directory */
.collapsible-category-options { gap: .35rem; }
.facet-category-group { padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.facet-category-group > summary { min-height: 37px; padding: .5rem .55rem; display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: .35rem; list-style: none; cursor: pointer; }
.facet-category-group > summary::-webkit-details-marker { display: none; }
.facet-category-group > summary span { overflow: hidden; font-size: .68rem; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.facet-category-group > summary small { color: var(--muted); font-size: .55rem; }
.facet-category-group > summary iconify-icon { color: var(--muted); transition: transform .2s ease; }
.facet-category-group[open] > summary { background: var(--soft-red); color: var(--red); }
.facet-category-group[open] > summary iconify-icon { transform: rotate(180deg); }
.facet-category-children { padding: .25rem .35rem .45rem; border-top: 1px solid var(--line); }
.facet-category-children .facet-child { padding-left: .8rem; }
.facet-category-node { margin-left: .35rem; border-left: 1px solid #dce7f5; }
.facet-category-node > summary { min-height: 34px; padding: .42rem .4rem .42rem .65rem; display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: .3rem; list-style: none; cursor: pointer; color: #424b5d; }
.facet-category-node > summary::-webkit-details-marker { display: none; }
.facet-category-node > summary span { overflow: hidden; font-size: .66rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.facet-category-node > summary small { color: var(--muted); font-size: .54rem; }
.facet-category-node > summary iconify-icon { color: var(--muted); transition: transform .2s ease; }
.facet-category-node[open] > summary { color: var(--red); }
.facet-category-node[open] > summary iconify-icon { transform: rotate(180deg); }
.facet-category-node-children { padding-left: .25rem; }
.collapsible-directory-grid { align-items: start; }
.category-directory-card { padding: 0; overflow: hidden; }
.category-directory-card > summary { padding: 1rem; border-bottom: 0; list-style: none; cursor: pointer; }
.category-directory-card > summary::-webkit-details-marker { display: none; }
.category-directory-card[open] > summary { border-bottom: 1px solid var(--line); background: var(--soft-red); }
.category-toggle-icon { margin-left: auto; color: var(--muted); transition: transform .2s ease; }
.category-directory-card[open] .category-toggle-icon { transform: rotate(180deg); color: var(--red); }
.category-directory-content { padding: .2rem 1rem 1rem; }
.category-tree-links { display: block; }
.category-tree-node { border-bottom: 1px solid #eef2f6; }
.category-tree-node > summary { min-height: 38px; padding: .45rem .35rem; display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: .45rem; list-style: none; cursor: pointer; color: #3e4a5d; }
.category-tree-node > summary::-webkit-details-marker { display: none; }
.category-tree-node > summary span { overflow: hidden; font-size: .75rem; font-weight: 800; text-overflow: ellipsis; }
.category-tree-node > summary small { min-width: 22px; color: var(--muted); font-size: .6rem; text-align: right; }
.category-tree-node > summary iconify-icon { color: var(--muted); transition: transform .2s ease; }
.category-tree-node[open] > summary { color: var(--red); }
.category-tree-node[open] > summary iconify-icon { transform: rotate(180deg); }
.category-tree-children { margin-left: .45rem; padding-left: .65rem; border-left: 1px solid #dce7f5; }
.category-tree-all, .category-tree-leaf { min-height: 34px; padding: .4rem .35rem; display: flex; align-items: center; justify-content: space-between; gap: .4rem; border-radius: 7px; color: #4b5565; font-size: .72rem; text-decoration: none; }
.category-tree-all { color: var(--red); font-weight: 800; }
.category-tree-all:hover, .category-tree-leaf:hover { padding-left: .55rem; background: var(--soft-red); color: var(--red); }
.subcategory-tree { display: block; }
.subcategory-tree-node { margin-bottom: .55rem; border: 1px solid var(--line); border-radius: 11px; overflow: hidden; }
.subcategory-tree-node > summary { min-height: 51px; padding: .55rem .7rem; display: grid; grid-template-columns: 31px minmax(0,1fr) auto auto; align-items: center; gap: .65rem; list-style: none; cursor: pointer; }
.subcategory-tree-node > summary::-webkit-details-marker { display: none; }
.subcategory-tree-node > summary strong { overflow: hidden; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.subcategory-tree-node > summary small { color: var(--muted); font-size: .6rem; }
.subcategory-tree-node > summary iconify-icon { color: var(--muted); transition: transform .2s ease; }
.subcategory-tree-node[open] > summary { background: var(--soft-red); color: var(--red); }
.subcategory-tree-node[open] > summary iconify-icon { transform: rotate(180deg); }
.subcategory-initial, .subcategory-tree-leaf > span { width: 31px; height: 31px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: #f3f5f8; color: var(--red); font-size: .72rem; font-weight: 950; }
.subcategory-tree-children { padding: .55rem .65rem .65rem 1rem; border-top: 1px solid var(--line); }
.subcategory-tree-all { display: block; margin-bottom: .4rem; color: var(--red); font-size: .68rem; font-weight: 850; text-decoration: none; }
.subcategory-tree-leaf { min-width: 0; margin-bottom: .35rem; padding: .55rem .65rem; display: flex; align-items: center; gap: .65rem; border: 1px solid var(--line); border-radius: 9px; font-size: .75rem; font-weight: 700; text-decoration: none; }
.subcategory-tree-leaf:hover { border-color: #8bbcff; color: var(--red); box-shadow: 0 8px 20px rgba(16, 24, 39, .06); transform: translateX(2px); }

/* Accessible double-ended price range */
.price-range-filter { display: grid; grid-template-columns: 1fr; gap: .7rem; }
.price-range-values { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
.price-range-values label { display: grid; gap: .25rem; }
.price-range-values label > span { padding: .42rem .5rem; display: flex; align-items: center; gap: .2rem; border: 1px solid #cfd9df; border-radius: 6px; background: #fff; color: var(--muted); }
.price-range-values input { min-width: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none !important; font-size: .7rem; }
.price-range-values input::-webkit-inner-spin-button { appearance: none; }
.dual-range { position: relative; height: 30px; margin: 0 .4rem; }
.dual-range-track { position: absolute; left: 0; right: 0; top: 13px; height: 5px; border-radius: 99px; background: linear-gradient(to right, #d7e0e6 0 var(--range-start), var(--red) var(--range-start) var(--range-end), #d7e0e6 var(--range-end) 100%); }
.dual-range input[type="range"] { position: absolute; left: 0; top: 2px; width: 100%; height: 26px; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; appearance: none; pointer-events: none; }
.dual-range input[type="range"]::-webkit-slider-runnable-track { height: 5px; background: transparent; }
.dual-range input[type="range"]::-webkit-slider-thumb { width: 20px; height: 20px; margin-top: -7px; border: 3px solid #fff; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 1px var(--red), 0 3px 9px rgba(10,60,100,.25); appearance: none; pointer-events: auto; cursor: grab; }
.dual-range input[type="range"]::-moz-range-track { height: 5px; background: transparent; }
.dual-range input[type="range"]::-moz-range-thumb { width: 15px; height: 15px; border: 3px solid #fff; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 1px var(--red); pointer-events: auto; cursor: grab; }
.dual-range input[type="range"]:focus-visible::-webkit-slider-thumb { outline: 3px solid rgba(20,104,212,.25); outline-offset: 2px; }
.price-range-output { display: flex; justify-content: space-between; color: var(--muted); font-size: .65rem; }
.price-range-output output { color: var(--ink); font-weight: 850; }

.repair-page-hero { margin-top: 1.2rem; }
.repair-copy h1 { margin: .35rem 0 1rem; font-size: clamp(2.7rem,5vw,5.4rem); line-height: .94; letter-spacing: -.06em; }
.repair-copy h1 span { color: #8cc5ff; }

@media (max-width: 1180px) {
  .brand-showcase { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .channel-switch-label { display: none; }
}
@media (max-width: 900px) {
  .channel-hero { margin: .7rem; grid-template-columns: 1fr; padding: 3.3rem 2rem; }
  .channel-benefits { margin: .7rem; }
  .brand-showcase { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@media (max-width: 680px) {
  .channel-hero { min-height: auto; padding: 2.6rem 1.2rem; border-radius: 18px; }
  .wholesale-hero { border-radius: 9px; }
  .channel-hero .hero-copy h1 { font-size: clamp(2.8rem,14vw,4.6rem); }
  .channel-benefits { grid-template-columns: 1fr; padding: .4rem 1rem; }
  .channel-benefits span { justify-content: flex-start; border-right: 0; border-bottom: 1px solid var(--line); }
  .channel-benefits span:last-child { border-bottom: 0; }
  .console-title { align-items: start; flex-direction: column; gap: .25rem; }
  .wholesale-console dl div { align-items: start; flex-direction: column; }
  .wholesale-console dd { text-align: left; }
  .brand-showcase { display: flex; overflow-x: auto; scroll-snap-type: inline mandatory; }
  .brand-showcase a { min-width: 150px; scroll-snap-align: start; }
  .technical-stock { grid-template-columns: 1fr; }
  .collapsible-directory-grid { grid-template-columns: 1fr; }
  .category-directory-card[open] .category-directory-links { grid-template-columns: 1fr; }
  .repair-copy h1 { font-size: clamp(2.7rem,13vw,4.4rem); }
}