/* Burkhart Engineering · Performance, with precision. */
:root {
  --ink: #131616;
  --dark: #101313;
  --dark-soft: #1b1e1e;
  --paper: #f4f4f0;
  --white: #fff;
  --gold: #c4a44b;
  --gold-light: #e7cd83;
  --muted: #707574;
  --line: #dcded8;
  --glass-line: rgba(255,255,255,.16);
  --radius: 4px;
  --wide: 1392px;
  --font: Arial, Helvetica, sans-serif;
  --display: "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--font); font-size: 15px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body:has(dialog[open]) { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
button { color: inherit; }
button, input, textarea, select { -webkit-tap-highlight-color: transparent; }
button { border: 0; }
img { display: block; max-width: 100%; }
svg { width: 21px; height: 21px; flex: 0 0 auto; vertical-align: middle; }
button svg, a svg { pointer-events: none; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.08; }
h1, h2 { font-family: var(--display); letter-spacing: -.045em; font-weight: 800; }
h2 { margin-bottom: 0; font-size: clamp(31px, 3.8vw, 56px); }
h3 { font-size: 23px; letter-spacing: -.025em; }
p { margin-bottom: 1.15em; }
button, a, input, select, textarea, summary { outline-offset: 5px; }
:focus-visible { outline: 2px solid var(--gold); }
::selection { color: #141717; background: #dbc376; }
[hidden], .hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 8px; left: 16px; z-index: 200; background: var(--gold); color: var(--ink); padding: 10px 16px; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.container { width: min(var(--wide), calc(100% - 112px)); margin-inline: auto; }
.accent { color: var(--gold); }
.topbar { min-height: 32px; color: #c7c9c6; background: #090b0b; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.topbar .container { display: flex; justify-content: space-between; align-items: center; min-height: 32px; gap: 16px; }
.topbar a { color: #e6e7e2; }
.topbar a:hover { color: var(--gold); }
.topbar span { display: inline-flex; align-items: center; gap: 8px; }
.topbar svg { width: 12px; height: 12px; }
.site-header { position: sticky; top: 0; z-index: 50; color: #fff; background: rgba(17,20,20,.94); border-bottom: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(22px) saturate(130%); -webkit-backdrop-filter: blur(22px) saturate(130%); }
.header-inner { width: min(1512px, calc(100% - 64px)); height: 85px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.logo { width: 218px; min-width: 150px; display: flex; align-items: center; flex-shrink: 0; }
.logo img { width: 100%; max-height: 48px; object-fit: contain; }
.desktop-nav { display: flex; height: 100%; align-items: center; gap: 30px; }
.nav-link { position: relative; display: inline-flex; align-items: center; height: 100%; gap: 6px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.nav-link::after { content: ""; position: absolute; bottom: 21px; left: 0; width: 0; height: 2px; background: var(--gold); transition: width .2s; }
.nav-link:hover::after, .nav-link.active::after { width: 100%; }
.nav-link.active { color: var(--gold-light); }
.nav-link svg { width: 13px; height: 13px; }
.header-actions { display: flex; gap: 8px; align-items: center; }
.icon-btn { position: relative; min-width: 42px; height: 42px; padding: 10px; display: inline-flex; justify-content: center; align-items: center; background: transparent; color: inherit; border-radius: 50%; transition: background .2s, color .2s; }
.icon-btn:hover { background: rgba(255,255,255,.09); color: var(--gold-light); }
.cart-count { position: absolute; top: 0; right: 0; display: grid; place-content: center; min-width: 17px; height: 17px; padding: 0 4px; background: var(--gold); color: #111; border-radius: 50%; font-size: 9px; font-weight: 800; }
.mobile-toggle, .mobile-nav { display: none; }
.hero { position: relative; min-height: 680px; height: min(780px, 78vw); overflow: hidden; isolation: isolate; color: #fff; background: #181c1b; }
.hero-media, .hero-media img, .hero-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-media { z-index: -3; }
.hero-media img, .hero-media video { object-position: 66% center; }
img.hero-media, video.hero-media { z-index: -3; object-position: 66% center; }
.hero-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg,rgba(6,10,10,.86) 0%,rgba(6,10,10,.58) 38%,rgba(6,10,10,.04) 78%),linear-gradient(0deg,rgba(6,10,10,.55),transparent 35%); }
.hero::after { content: ""; width: 46%; height: 1px; position: absolute; left: 0; bottom: 0; background: var(--gold); }
.hero-content { position: relative; padding-top: 100px; padding-bottom: 156px; }
.eyebrow, .section-kicker { display: flex; align-items: center; gap: 11px; margin: 0 0 23px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.eyebrow::before, .section-kicker::before { content: ""; width: 25px; height: 2px; background: currentColor; flex: 0 0 auto; }
.hero h1 { max-width: 870px; margin-bottom: 25px; font-size: clamp(64px,7.7vw,118px); line-height: .93; letter-spacing: -.065em; text-transform: uppercase; font-style: italic; font-weight: 900; }
.hero h1 .accent { display: inline-block; }
.hero-copy { max-width: 430px; color: #d5d8d5; font-size: 15px; line-height: 1.8; }
.hero-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 32px; }
.btn { position: relative; min-height: 51px; padding: 15px 24px; display: inline-flex; align-items: center; justify-content: center; gap: 25px; border: 1px solid transparent; border-radius: var(--radius); font-size: 11px; line-height: 1.4; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; transition: background .2s, transform .2s, border-color .2s; }
.btn:hover { transform: translateY(-2px); }
.btn:disabled { opacity: .42; cursor: not-allowed; transform: none; }
.btn svg { width: 17px; height: 17px; }
.btn-gold { color: #181b16; background: linear-gradient(125deg,#dac074,#c4a44b); border-color: #dbc178; box-shadow: inset 0 1px 0 #ffffff4d; }
.btn-gold:hover { background: #e0c678; }
.btn-outline { color: #fff; background: rgba(255,255,255,.045); border-color: rgba(255,255,255,.35); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.btn-outline:hover { border-color: var(--gold); background: rgba(255,255,255,.1); }
.btn-dark { color: #fff; background: #181c1a; border-color: #181c1a; }
.btn-dark:hover { background: #303630; }
.hero-bottom { position: absolute; bottom: 85px; left: 0; right: 0; display: flex; align-items: end; justify-content: space-between; }
.hero-caption { display: flex; flex-direction: column; gap: 2px; color: #c5c8c3; font-size: 10px; text-transform: uppercase; letter-spacing: .14em; }
.hero-caption strong { color: #fff; font-size: 12px; font-weight: 600; }
.hero-index { font-size: 11px; letter-spacing: .15em; display: flex; align-items: center; gap: 16px; }
.hero-index::after { content: ""; width: 75px; height: 1px; background: #ffffff66; }
.vehicle-finder { position: relative; z-index: 5; display: flex; align-items: center; gap: 36px; margin-top: -47px; padding: 25px 30px; color: #fff; background: linear-gradient(120deg,rgba(44,49,47,.97),rgba(20,25,23,.96)); border: 1px solid rgba(255,255,255,.21); border-radius: 8px; box-shadow: 0 16px 45px #0002, inset 0 1px 0 #ffffff12; backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
.finder-copy { flex-shrink: 0; padding-right: 28px; border-right: 1px solid #ffffff26; }
.finder-copy p, .finder-copy span { margin: 4px 0 0; color: #a8aea7; font-size: 11px; }
.finder-copy h2, .finder-copy h3, .finder-copy strong { display: block; margin: 0; font-family: var(--font); font-size: 17px; line-height: 1.3; font-weight: 700; letter-spacing: -.025em; }
.finder-controls { display: flex; gap: 12px; align-items: end; width: 100%; }
.finder-controls label { flex: 1 1 0; min-width: 0; color: #9ca39d; font-size: 9px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.finder-controls select { display: block; width: 100%; min-height: 44px; margin-top: 7px; padding: 8px 28px 8px 13px; color: #f5f6f2; border: 1px solid #ffffff25; background: #ffffff07; border-radius: 3px; font-size: 12px; text-transform: none; }
.finder-controls select option { color: var(--ink); background: #fff; }
.finder-controls .btn { min-height: 44px; padding-inline: 22px; white-space: nowrap; }
.benefits { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; padding-block: 38px; border-bottom: 1px solid var(--line); }
.benefit { display: flex; align-items: center; justify-content: center; gap: 13px; color: #6a706a; font-size: 11px; line-height: 1.5; }
.benefit svg { width: 25px; height: 25px; color: #9c812e; stroke-width: 1.4; }
.benefit strong { display: block; color: #272d28; font-size: 11px; font-weight: 700; }
.section { padding-block: 84px; }
.section-light { color: var(--ink); background: var(--paper); }
.section-dark { color: #f4f5f0; background: var(--dark); }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 35px; }
.section-heading h2 { text-transform: uppercase; }
.section-heading p:not(.section-kicker) { margin: 12px 0 0; max-width: 460px; color: var(--muted); font-size: 13px; }
.section-kicker { margin-bottom: 14px; font-size: 9px; color: #99802e; }
.section-dark .section-kicker { color: var(--gold); }
.section-dark .section-heading p:not(.section-kicker) { color: #9ca29c; }
.text-link { display: inline-flex; align-items: center; gap: 22px; padding-bottom: 6px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; border-bottom: 1px solid #babeb7; white-space: nowrap; }
.text-link:hover { color: #9f7f25; border-color: var(--gold); }
.text-link svg { width: 16px; height: 16px; }
.category-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 18px; }
.category-card { position: relative; min-height: 350px; display: flex; align-items: end; overflow: hidden; color: #fff; background: #222824; border-radius: var(--radius); isolation: isolate; }
.category-card::after { content: ""; z-index: -1; position: absolute; inset: 0; background: linear-gradient(0deg,#050a08c9,transparent 70%); }
.category-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .7s cubic-bezier(.2,.65,.3,1); }
.category-card:hover .category-image { transform: scale(1.045); }
.category-content { width: 100%; padding: 30px; }
.category-content > span { display: block; margin-bottom: 11px; color: #dddeda; font-size: 9px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.category-content h3 { margin-bottom: 16px; font-size: 33px; font-weight: 800; text-transform: uppercase; }
.category-content .text-link { color: #fff; border-color: #ffffff5c; }
.category-content .text-link:hover { color: var(--gold-light); }
.category-number { position: absolute; top: 22px; left: 25px; color: #ffffffad; font-size: 11px; letter-spacing: .12em; }
.brand-strip { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 33px 0; border-top: 1px solid #dcded8; border-bottom: 1px solid #dcded8; }
.brand-name { color: #6b706a; font-size: 18px; font-style: italic; font-weight: 900; letter-spacing: -.045em; white-space: nowrap; }
.brand-name:first-child { color: #b29745; }
.brand-name small { display: block; font-size: 8px; font-style: normal; letter-spacing: .18em; text-align: center; }
.product-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 21px; }
.product-card { min-width: 0; position: relative; }
.product-media { position: relative; display: block; aspect-ratio: 1.04; overflow: hidden; background: #fff; border: 1px solid #e5e7e0; border-radius: var(--radius); }
.product-media img { width: 100%; height: 100%; object-fit: contain; padding: 22px; mix-blend-mode: multiply; transition: transform .45s; }
.product-card:hover .product-media img { transform: scale(1.06); }
.product-badge { position: absolute; left: 14px; top: 14px; z-index: 1; padding: 4px 8px; color: #424936; background: #edeee7; border: 1px solid #e2e4d8; border-radius: 2px; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.product-badge.gold, .product-badge.sale { background: #ddc57c; color: #38311d; border-color: #d2b660; }
.favorite-btn { position: absolute; right: 11px; top: 11px; z-index: 2; width: 31px; height: 31px; display: grid; place-content: center; color: #747a71; border-radius: 50%; background: #ffffffcc; }
.favorite-btn:hover, .favorite-btn.active { color: #9c7b22; background: #f5edda; }
.favorite-btn svg { width: 16px; height: 16px; }
.favorite-btn.active svg { fill: #c4a44b33; }
.product-info { padding: 17px 0 0; }
.product-brand { display: block; margin-bottom: 6px; color: #8b7330; font-size: 8px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.product-name { display: block; margin: 0 0 7px; font-size: 14px; line-height: 1.45; letter-spacing: -.015em; font-weight: 700; }
.product-name:hover { color: #8f7327; }
.product-fitment { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 30px; color: #7c8179; font-size: 10px; line-height: 1.45; }
.product-bottom { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin-top: 16px; }
.product-price { display: block; font-size: 19px; font-weight: 750; letter-spacing: -.035em; line-height: 1.2; }
.product-price del { display: inline-block; margin-right: 6px; color: #91958b; font-size: 12px; font-weight: 400; }
.product-price small { margin-right: 3px; font-size: 11px; font-weight: 400; letter-spacing: 0; }
.product-tax { display: block; margin-top: 5px; color: #8c9189; font-size: 8px; line-height: 1.45; }
.product-action { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; border: 1px solid #d4d8ce; border-radius: 3px; background: transparent; transition: background .2s,color .2s; }
.product-action svg { width: 15px; height: 15px; }
.product-action:hover { background: #171d17; color: #fff; border-color: #171d17; }
.workshop-split { display: grid; grid-template-columns: 1.08fr 1fr; min-height: 570px; color: #fff; background: #141817; }
.workshop-image { position: relative; min-height: 500px; overflow: hidden; }
.workshop-image img { width: 100%; height: 100%; object-fit: cover; }
img.workshop-image { width: 100%; height: 100%; object-fit: cover; }
.workshop-copy { display: flex; flex-direction: column; justify-content: center; padding: 70px clamp(36px,5vw,82px); }
.workshop-copy h2 { margin-bottom: 22px; max-width: 470px; font-size: clamp(35px,4vw,59px); text-transform: uppercase; }
.workshop-copy > p:not(.section-kicker) { color: #aeb5ac; font-size: 13px; max-width: 460px; }
.workshop-copy .btn { align-self: flex-start; margin-top: 26px; }
.service-list { padding: 0; margin: 10px 0 0; list-style: none; }
.service-list li { padding: 13px 0; border-bottom: 1px solid #ffffff17; font-size: 12px; color: #e3e6df; }
.service-list li::before { content: "+"; margin-right: 13px; color: var(--gold); font-size: 16px; }
.journal-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 27px; }
.journal-card { display: block; min-width: 0; }
.journal-card > img, .journal-card > a > img { width: 100%; aspect-ratio: 1.62; object-fit: cover; border-radius: var(--radius); filter: saturate(.82); transition: filter .25s; }
.journal-card:hover img { filter: saturate(1); }
.journal-body { padding: 22px 0 0; }
.journal-meta { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; color: #8c793f; font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.journal-body h3 { font-size: 21px; line-height: 1.25; margin-bottom: 12px; }
.journal-body p { font-size: 12px; color: #7a8076; }
.journal-body .text-link { margin-top: 6px; font-size: 9px; }
.cta-band { display: flex; justify-content: space-between; gap: 30px; align-items: center; padding: 45px 50px; margin-bottom: 70px; border: 1px solid #d9dccf; background: #ebede5; border-radius: var(--radius); }
.cta-band h2 { font-size: 30px; margin-bottom: 10px; }
.cta-band p { margin: 0; color: #777d70; font-size: 12px; }
.cta-band .btn { flex-shrink: 0; }
footer { color: #afb6ac; background: #101413; border-top: 1px solid #ffffff0d; font-size: 11px; }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 55px; padding-block: 65px 55px; }
.footer-brand .logo { width: 210px; margin-bottom: 24px; }
.footer-brand p { max-width: 265px; line-height: 1.9; font-size: 11px; }
.footer-brand > span { display: block; margin-top: 26px; color: #7a8578; font-size: 9px; text-transform: uppercase; letter-spacing: .14em; }
.footer-column h3, .footer-column h4 { margin: 0 0 20px; color: #e0e6dc; font-size: 10px; letter-spacing: .11em; text-transform: uppercase; }
.footer-column a { display: block; padding: 5px 0; line-height: 1.5; }
.footer-column a:hover { color: var(--gold-light); }
.footer-column p { line-height: 1.9; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 25px; min-height: 68px; padding-block: 20px; border-top: 1px solid #ffffff12; color: #74806f; font-size: 9px; }
.footer-bottom > div { display: flex; gap: 22px; flex-wrap: wrap; }
.footer-bottom a:hover { color: #c0c9b8; }
.page-hero { position: relative; padding: 53px 0 47px; color: #fff; background: radial-gradient(ellipse at 90% 0, #28302b, #111715 65%); overflow: hidden; }
.page-hero::after { content: ""; pointer-events: none; position: absolute; right: 8%; top: -90px; width: 280px; height: 400px; border-inline: 1px solid #ffffff08; transform: skewX(-25deg); }
.page-hero h1 { margin-bottom: 15px; font-size: clamp(42px,5vw,72px); text-transform: uppercase; }
.page-hero p:not(.eyebrow):not(.section-kicker) { color: #9fa99f; max-width: 620px; font-size: 13px; }
.breadcrumb { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 30px; color: #8f998d; font-size: 10px; }
.breadcrumb a:hover { color: var(--gold); }
.breadcrumb svg { width: 10px; height: 10px; }
.shop-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 0 0 28px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.shop-toolbar label { color: #757d70; font-size: 11px; }
.shop-toolbar select { margin-left: 8px; padding: 11px 30px 11px 10px; background: transparent; border: 1px solid #d2d8cc; border-radius: 3px; font-size: 11px; color: #303b2b; }
.search-field { position: relative; width: min(100%,440px); }
.search-field input { display: block; width: 100%; min-height: 45px; padding: 12px 40px 12px 15px; color: var(--ink); border: 1px solid #cfd5c8; background: #fff; border-radius: 3px; font-size: 12px; }
.search-field svg, .search-field button { position: absolute; right: 13px; top: 13px; width: 19px; height: 19px; color: #7c8675; background: transparent; padding: 0; }
.filter-toggle { display: none; }
.shop-layout { display: grid; grid-template-columns: 205px minmax(0,1fr); gap: 40px; }
.filters { align-self: start; }
.filter-group { padding: 22px 0; border-bottom: 1px solid #d9ded2; }
.filter-group:first-child { padding-top: 0; }
.filter-group h3, .filter-group h4, .filter-group summary { margin: 0 0 13px; color: #283221; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; }
.filter-group input[type=range] { width: 100%; accent-color: var(--gold); }
.filter-group input[type=checkbox], .filter-group input[type=radio] { accent-color: #9c8135; }
.filter-group select { width: 100%; min-height: 40px; padding: 8px; background: #fff; border: 1px solid #d0d6c8; font-size: 11px; border-radius: 3px; }
.filter-options { display: flex; flex-direction: column; align-items: stretch; gap: 3px; }
.filter-options label { display: flex; gap: 9px; align-items: center; padding-block: 4px; color: #65705b; font-size: 11px; }
.filter-button { display: flex; align-items: center; justify-content: space-between; gap: 5px; width: 100%; padding: 8px 9px; text-align: left; color: #6b7661; font-size: 11px; line-height: 1.4; border-radius: 3px; background: transparent; }
.filter-button:hover { background: #e9ece3; color: #27331d; }
.filter-button.active { color: #6d571a; background: #e9e4cf; font-weight: 700; }
.filter-button span:last-child { color: #9aab89; font-size: 9px; }
.catalog-content { min-width: 0; }
.catalog-content .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 33px 22px; }
.catalog-status { margin: 0; color: #7e8976; font-size: 11px; }
.active-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.filter-chip { display: inline-flex; align-items: center; gap: 10px; padding: 6px 11px; border: 1px solid #d8dfcf; background: #ecefe6; border-radius: 3px; font-size: 10px; color: #4d5b3f; }
.filter-chip svg { width: 11px; height: 11px; }
.empty-state { padding: 80px 25px; text-align: center; border: 1px solid #d9e1d0; background: #fff9; }
.empty-state h2, .empty-state h3 { margin-bottom: 12px; font-size: 28px; }
.empty-state p { color: #7e8b71; font-size: 13px; }
.empty-state .btn { margin-top: 15px; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 45px; }
.pagination button, .pagination a { min-width: 36px; height: 36px; background: transparent; border: 1px solid #d5ddcb; border-radius: 3px; font-size: 11px; }
.pagination .active { color: #fff; background: #24301b; border-color: #24301b; }
.load-more { display: flex; margin: 42px auto 0; }
.product-detail { padding-block: 35px 75px; }
.product-detail > .breadcrumb { margin-bottom: 24px; }
.product-detail-grid, .product-detail > .container > .detail-grid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: 65px; }
.product-gallery { min-width: 0; }
.main-product-image { width: 100%; aspect-ratio: 1; background: #fff; border: 1px solid #e2e7db; border-radius: 4px; object-fit: contain; padding: 38px; }
.main-product-image img { width: 100%; height: 100%; object-fit: contain; }
.thumbnails { display: flex; gap: 10px; margin-top: 12px; overflow-x: auto; }
.thumbnails button { width: 76px; min-width: 76px; height: 76px; padding: 7px; border: 1px solid #dde4d4; background: #fff; border-radius: 3px; }
.thumbnails button.active { border: 2px solid #b89c51; }
.thumbnails img { width: 100%; height: 100%; object-fit: contain; }
.product-summary { padding-top: 13px; }
.product-summary h1 { font-size: clamp(30px,3vw,44px); line-height: 1.15; margin-bottom: 17px; letter-spacing: -.04em; }
.product-summary .product-brand { margin-bottom: 15px; }
.product-summary .product-price { margin-top: 24px; font-size: 34px; }
.product-summary .product-tax { font-size: 10px; margin-top: 9px; }
.product-summary > p { color: #758268; font-size: 13px; }
.product-summary label { display: block; margin-top: 20px; color: #455535; font-size: 12px; }
.product-summary select { display: block; width: 100%; padding: 12px; margin-top: 7px; background: #fff; border: 1px solid #cfdac2; border-radius: 3px; }
.stock { display: flex; gap: 8px; align-items: center; margin-top: 22px; color: #557844; font-size: 11px; }
.stock::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #6c9855; }
.stock.unavailable { color: #9a704c; }
.stock.unavailable::before { background: #b08a58; }
.detail-actions { display: flex; gap: 11px; align-items: stretch; margin-block: 22px; }
.detail-actions .btn { flex: 1; }
.quantity { display: flex; align-items: center; border: 1px solid #cbd6bd; border-radius: 3px; background: #fff; }
.quantity button { width: 32px; align-self: stretch; background: transparent; font-size: 17px; }
.quantity input { width: 35px; min-height: 43px; text-align: center; border: 0; background: transparent; padding: 0; -moz-appearance: textfield; }
.quantity input::-webkit-inner-spin-button { -webkit-appearance: none; }
.quantity span { min-width: 25px; text-align: center; font-size: 12px; }
.details-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 65px; padding-top: 55px; margin-top: 55px; border-top: 1px solid #d8e1cd; }
.details-grid h2 { margin-bottom: 25px; font-size: 29px; }
.details-grid h3 { font-size: 20px; }
.details-grid p, .details-grid li { color: #657456; font-size: 13px; line-height: 1.8; }
.details-grid table { width: 100%; border-collapse: collapse; font-size: 12px; }
.details-grid td, .details-grid th { padding: 13px 0; text-align: left; border-bottom: 1px solid #dbe4ce; }
.accordion { border-top: 1px solid #d6e0c9; }
.accordion details { border-bottom: 1px solid #d6e0c9; }
.accordion summary { cursor: pointer; padding: 16px 0; font-size: 12px; font-weight: 700; }
.accordion p { font-size: 12px; color: #758865; }
dialog { position: fixed; padding: 0; border: 1px solid #dae0d3; color: var(--ink); background: var(--paper); border-radius: 8px; width: min(620px,calc(100vw - 32px)); max-height: calc(100dvh - 48px); box-shadow: 0 30px 120px #0006; }
dialog::backdrop { background: #070c09aa; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 28px; border-bottom: 1px solid #d9e1ce; }
.dialog-head h2 { font-size: 26px; margin: 0; }
.dialog-head p { margin: 5px 0 0; color: #77866b; font-size: 11px; }
.dialog-close { width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #e7eddf; }
.dialog-close:hover { background: #dbe4ce; }
.dialog-close svg { width: 17px; height: 17px; }
.dialog-body { padding: 25px 28px 30px; }
.dialog-body > .btn { width: 100%; margin-top: 18px; }
.dialog-body .search-field { width: 100%; }
.cart-list { display: flex; flex-direction: column; }
.cart-row { display: flex; gap: 15px; align-items: center; padding: 18px 0; border-bottom: 1px solid #dce5d1; }
.cart-row:first-child { padding-top: 0; }
.cart-item-image { width: 74px; height: 74px; padding: 6px; border: 1px solid #e1e9d7; border-radius: 3px; object-fit: contain; background: #fff; }
.cart-item-info { flex: 1; min-width: 0; }
.cart-item-info h3, .cart-item-info a { display: block; margin: 0 0 7px; font-size: 12px; font-weight: 700; line-height: 1.5; }
.cart-item-info span, .cart-item-info p { color: #778b64; font-size: 11px; margin: 0; }
.cart-row .quantity { margin-top: 10px; width: fit-content; }
.cart-row .quantity button { width: 24px; min-height: 27px; font-size: 14px; }
.cart-row .icon-btn { min-width: 30px; width: 30px; height: 30px; padding: 5px; }
.cart-row .icon-btn:hover { background: #e3ebd8; }
.cart-row > strong { font-size: 13px; white-space: nowrap; }
.cart-total { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-top: 24px; font-size: 13px; }
.cart-total strong { font-size: 24px; letter-spacing: -.04em; }
.cart-note { margin: 12px 0 0; font-size: 10px; line-height: 1.7; color: #7a8d69; }
.toast { position: fixed; left: 50%; bottom: 26px; z-index: 120; display: flex; align-items: center; gap: 12px; max-width: calc(100vw - 40px); padding: 13px 22px; color: #fff; background: #202c1eef; border: 1px solid #ffffff26; border-radius: 6px; box-shadow: 0 10px 40px #0003; transform: translateX(-50%); font-size: 12px; backdrop-filter: blur(12px); }
.toast svg { color: var(--gold); width: 17px; height: 17px; }
.content-page { padding-block: 64px 85px; }
.content-page > p, .content-page .intro { max-width: 850px; color: #77836d; font-size: 17px; line-height: 1.85; }
.content-sections { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 42px 65px; }
.content-section { padding-top: 28px; border-top: 1px solid #d3ddc7; }
.content-section h2 { margin-bottom: 20px; font-size: 30px; }
.content-section p, .content-section li { color: #6e7c63; font-size: 13px; line-height: 1.85; }
.content-section ul { padding-left: 18px; }
.content-section li { padding-block: 4px; }
.contact-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; margin-block: 35px; }
.contact-card { padding: 32px; border: 1px solid #d5e0c9; background: #edf2e7; border-radius: 4px; }
.contact-card h3 { margin-bottom: 20px; }
.contact-card > a { display: block; margin-bottom: 7px; font-size: 15px; }
.contact-card > a:hover { color: #9d8133; }
.contact-card p { margin: 15px 0 0; color: #7c8d6c; font-size: 12px; }
.contact-form { max-width: 850px; margin-top: 45px; }
.contact-form h2 { font-size: 34px; margin-bottom: 26px; }
.contact-form label { display: block; margin-bottom: 18px; color: #596b47; font-size: 11px; }
.contact-form input:not([type=checkbox]), .contact-form select, .contact-form textarea { display: block; width: 100%; min-height: 46px; margin-top: 7px; padding: 12px; color: #25381c; background: #fff; border: 1px solid #ceddc0; border-radius: 3px; }
.contact-form textarea { resize: vertical; min-height: 130px; }
.contact-form input[type=checkbox] { accent-color: #a99048; margin-right: 8px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.journal-page { padding-block: 60px 90px; }
.journal-page .journal-grid { row-gap: 48px; }
.section-dark .product-media { background: #eff1eb; border-color: #ffffff13; }
.section-dark .product-name { color: #e8eee2; }
.section-dark .product-brand { color: var(--gold); }
.section-dark .product-fitment, .section-dark .product-tax { color: #8a9780; }
.section-dark .product-action { color: #bcc7b2; border-color: #ffffff25; }
.section-dark .product-action:hover { background: var(--gold); color: #141d0c; }
@media (min-width: 1600px) {
  .hero-content { padding-top: 120px; }
}
@media (max-width: 1199px) {
  .container { width: calc(100% - 64px); }
  .header-inner { gap: 22px; width: calc(100% - 48px); }
  .logo { width: 190px; }
  .desktop-nav { gap: 20px; }
  .nav-link { font-size: 10px; }
  .hero { height: 670px; min-height: 0; }
  .hero h1 { font-size: clamp(64px,8vw,100px); }
  .hero-content { padding-top: 92px; }
  .vehicle-finder { gap: 20px; padding: 22px; }
  .finder-copy { padding-right: 20px; }
  .finder-copy h3 { font-size: 15px; }
  .finder-controls .btn { padding-inline: 16px; gap: 13px; }
  .category-card { min-height: 320px; }
  .category-content { padding: 24px; }
  .category-content h3 { font-size: 28px; }
  .brand-strip { gap: 24px; }
  .brand-name { font-size: 16px; }
  .workshop-copy { padding: 48px 40px; }
  .shop-layout { grid-template-columns: 180px minmax(0,1fr); gap: 27px; }
  .catalog-content .product-grid { gap: 30px 17px; }
  .product-price { font-size: 17px; }
  .footer-grid { gap: 35px; }
  .product-detail-grid, .product-detail > .container > .detail-grid { gap: 40px; }
}
@media (max-width: 960px) {
  .desktop-nav { gap: 15px; }
  .desktop-nav .nav-link { font-size: 9px; }
  .header-inner { gap: 16px; }
  .header-actions { gap: 0; }
  .logo { width: 165px; }
  .icon-btn { min-width: 37px; width: 37px; height: 37px; }
  .vehicle-finder { align-items: start; gap: 18px; }
  .finder-copy { min-width: 135px; border: 0; padding: 8px 0 0; }
  .finder-controls { flex-wrap: wrap; }
  .finder-controls .btn { flex: 1 0 100%; min-height: 39px; }
  .finder-controls label { min-width: 110px; }
  .benefits { grid-template-columns: repeat(2,1fr); gap: 24px; padding-block: 30px; }
  .benefit { justify-content: start; }
  .category-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
  .category-card { min-height: 290px; }
  .category-content { padding: 20px; }
  .category-content h3 { font-size: 25px; }
  .category-content .text-link { font-size: 8px; gap: 10px; }
  .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 33px 20px; }
  .brand-strip { justify-content: start; overflow-x: auto; scrollbar-width: none; gap: 42px; }
  .brand-strip::-webkit-scrollbar { display: none; }
  .workshop-split { min-height: 0; }
  .workshop-image { min-height: 480px; }
  .workshop-copy { padding: 40px 30px; }
  .workshop-copy h2 { font-size: 37px; }
  .journal-grid { gap: 20px; }
  .journal-body h3 { font-size: 18px; }
  .footer-grid { grid-template-columns: 1.3fr 1fr 1fr; gap: 40px 30px; }
  .footer-brand { grid-row: span 2; }
  .shop-layout { grid-template-columns: 165px minmax(0,1fr); gap: 24px; }
  .catalog-content .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .shop-toolbar { align-items: start; }
  .shop-toolbar select { margin-left: 0; }
  .product-summary h1 { font-size: 29px; }
  .details-grid { gap: 40px; }
}
@media (max-width: 760px) {
  .container { width: calc(100% - 40px); }
  .topbar { font-size: 8px; }
  .topbar .container { min-height: 28px; justify-content: center; }
  .topbar .container > :nth-child(n+2) { display: none; }
  .header-inner { width: calc(100% - 30px); height: 70px; }
  .logo { width: 175px; }
  .desktop-nav { display: none; }
  .header-actions { gap: 1px; }
  .mobile-toggle { display: inline-flex; }
  .mobile-nav:not([hidden]) { display: flex; flex-direction: column; padding: 15px 23px 23px; border-top: 1px solid #ffffff17; background: #151c18; }
  .mobile-nav a { padding: 13px 0; border-bottom: 1px solid #ffffff0f; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
  .hero { min-height: 615px; height: auto; }
  .hero-content { padding-top: 78px; padding-bottom: 150px; }
  .hero h1 { max-width: 650px; font-size: clamp(55px,9.8vw,78px); letter-spacing: -.06em; }
  .hero-copy { max-width: 370px; font-size: 13px; line-height: 1.7; }
  .hero-shade { background: linear-gradient(90deg,#070c0bd9,#070c0b66 70%,#070c0b22),linear-gradient(0deg,#070c0b99,transparent 80%); }
  .hero-media img, .hero-media video, img.hero-media, video.hero-media { object-position: 61% center; }
  .eyebrow { font-size: 8px; margin-bottom: 21px; }
  .hero-actions { gap: 10px; margin-top: 27px; }
  .btn { min-height: 48px; padding: 14px 20px; gap: 18px; font-size: 10px; }
  .hero-bottom { bottom: 80px; }
  .hero-caption { font-size: 8px; }
  .hero-caption strong { font-size: 10px; }
  .hero-index { font-size: 9px; }
  .hero-index::after { width: 37px; }
  .vehicle-finder { display: block; margin-top: -42px; padding: 24px; border-radius: 6px; }
  .finder-copy { padding: 0 0 18px; }
  .finder-copy h2, .finder-copy h3, .finder-copy strong { font-size: 18px; }
  .finder-copy p { font-size: 10px; margin-top: 4px; }
  .finder-controls { gap: 12px; }
  .finder-controls label { min-width: calc(50% - 12px); }
  .finder-controls .btn { margin-top: 3px; min-height: 45px; }
  .benefits { gap: 24px 15px; padding: 30px 0; }
  .benefit { font-size: 10px; gap: 9px; }
  .benefit svg { width: 22px; height: 22px; }
  .benefit strong { font-size: 10px; }
  .section { padding-block: 55px; }
  .section-heading { margin-bottom: 27px; gap: 18px; flex-wrap: wrap; }
  .section-heading h2 { font-size: 35px; }
  .section-heading p:not(.section-kicker) { font-size: 12px; }
  .section-kicker { font-size: 8px; margin-bottom: 12px; }
  .text-link { font-size: 9px; gap: 17px; }
  .category-grid { grid-template-columns: 1fr 1fr; gap: 13px; }
  .category-card { min-height: 260px; }
  .category-card:first-child { grid-column: 1 / -1; min-height: 340px; }
  .category-content { padding: 22px; }
  .category-content h3 { font-size: 27px; }
  .category-card:first-child h3 { font-size: 37px; }
  .category-content > span { font-size: 8px; letter-spacing: .13em; }
  .category-number { left: 22px; top: 20px; font-size: 9px; }
  .brand-strip { padding-block: 26px; gap: 35px; }
  .brand-name { font-size: 18px; }
  .product-grid, .catalog-content .product-grid { gap: 30px 15px; }
  .product-media img { padding: 15px; }
  .product-info { padding-top: 14px; }
  .product-brand { font-size: 7px; letter-spacing: .08em; }
  .product-name { font-size: 12px; line-height: 1.5; }
  .product-fitment { font-size: 9px; }
  .product-bottom { margin-top: 12px; }
  .product-price { font-size: 18px; }
  .product-price small { font-size: 10px; }
  .product-tax { font-size: 7px; }
  .product-action { width: 30px; height: 30px; }
  .product-badge { top: 10px; left: 10px; font-size: 7px; padding: 3px 6px; }
  .favorite-btn { top: 7px; right: 7px; width: 27px; height: 27px; }
  .workshop-split { grid-template-columns: 1fr; }
  .workshop-image { min-height: 340px; height: 340px; }
  .workshop-copy { padding: 45px 30px 55px; }
  .workshop-copy h2 { max-width: 530px; font-size: 42px; }
  .workshop-copy > p:not(.section-kicker) { max-width: 100%; }
  .service-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 25px; }
  .journal-grid { grid-template-columns: 1fr; gap: 33px; }
  .journal-card { display: grid; grid-template-columns: .9fr 1fr; gap: 20px; align-items: start; }
  .journal-card > img, .journal-card > a > img { aspect-ratio: 1.2; }
  .journal-body { padding: 0; }
  .journal-meta { font-size: 7px; margin-bottom: 9px; flex-wrap: wrap; gap: 6px; }
  .journal-body h3 { font-size: 18px; }
  .journal-body p { display: none; }
  .journal-body .text-link { font-size: 8px; }
  .cta-band { display: block; padding: 30px; margin-bottom: 45px; }
  .cta-band h2 { font-size: 28px; }
  .cta-band .btn { margin-top: 22px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 35px 28px; padding-block: 45px 35px; }
  .footer-brand { grid-column: 1 / -1; grid-row: auto; }
  .footer-brand .logo { width: 200px; margin-bottom: 20px; }
  .footer-brand p { max-width: 380px; }
  .footer-brand > span { margin-top: 18px; }
  .footer-bottom { align-items: start; flex-direction: column; gap: 14px; padding-block: 22px; font-size: 8px; }
  .footer-bottom > div { gap: 17px; }
  .page-hero { padding-block: 33px 36px; }
  .page-hero h1 { font-size: 45px; }
  .page-hero p:not(.eyebrow):not(.section-kicker) { font-size: 12px; }
  .breadcrumb { font-size: 9px; margin-bottom: 23px; }
  .shop-toolbar { flex-wrap: wrap; align-items: center; gap: 15px; padding-bottom: 18px; }
  .shop-toolbar .search-field { width: 100%; max-width: none; }
  .shop-toolbar label { font-size: 10px; }
  .shop-toolbar select { padding: 9px 25px 9px 9px; font-size: 10px; }
  .filter-toggle { display: inline-flex; align-items: center; gap: 9px; padding: 10px 14px; min-height: 38px; border: 1px solid #cad8be; border-radius: 3px; background: #fff9; font-size: 10px; }
  .filter-toggle svg { width: 15px; height: 15px; }
  .shop-layout { display: block; }
  .filters { display: none; margin-bottom: 27px; padding: 22px; background: #e9eee2; border: 1px solid #d2dec6; border-radius: 4px; }
  .filters.open, .filters.is-open { display: block; }
  .filter-options { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 12px; }
  .filter-group { padding-block: 18px; }
  .filter-group:last-child { padding-bottom: 0; border-bottom: 0; }
  .filter-group h3, .filter-group h4 { font-size: 11px; }
  .catalog-status { font-size: 10px; }
  .active-filters { gap: 6px; margin-bottom: 18px; }
  .filter-chip { font-size: 9px; padding: 5px 8px; }
  .product-detail { padding-block: 25px 50px; }
  .product-detail-grid, .product-detail > .container > .detail-grid { grid-template-columns: 1fr; gap: 30px; }
  .main-product-image { padding: 32px; }
  .thumbnails button { width: 65px; min-width: 65px; height: 65px; }
  .product-summary { padding-top: 0; }
  .product-summary h1 { font-size: 32px; }
  .product-summary .product-brand { font-size: 9px; }
  .product-summary .product-price { font-size: 31px; margin-top: 22px; }
  .details-grid { grid-template-columns: 1fr; gap: 32px; padding-top: 35px; margin-top: 38px; }
  .details-grid h2 { font-size: 27px; }
  dialog { max-height: calc(100dvh - 24px); width: calc(100vw - 24px); }
  .dialog-head { padding: 20px; }
  .dialog-head h2 { font-size: 24px; }
  .dialog-body { padding: 22px 20px; }
  .cart-row { gap: 11px; }
  .cart-item-image { width: 60px; height: 60px; }
  .cart-item-info h3, .cart-item-info a { font-size: 11px; }
  .cart-row > strong { font-size: 12px; }
  .content-page { padding-block: 40px 55px; }
  .content-page > p, .content-page .intro { font-size: 15px; }
  .content-sections { grid-template-columns: 1fr; gap: 30px; }
  .content-section h2 { font-size: 28px; }
  .contact-grid { grid-template-columns: 1fr; gap: 18px; margin-block: 28px; }
  .contact-card { padding: 26px; }
  .contact-form { margin-top: 35px; }
  .contact-form h2 { font-size: 30px; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .journal-page { padding-block: 40px 60px; }
}
@media (max-width: 420px) {
  .header-inner { width: calc(100% - 22px); }
  .logo { width: 152px; min-width: 140px; }
  .header-actions { gap: 0; }
  .icon-btn { min-width: 34px; width: 34px; height: 36px; padding: 8px; }
  .header-actions .icon-btn svg { width: 19px; height: 19px; }
  .hero-content { padding-top: 66px; }
  .hero h1 { font-size: 57px; }
  .hero { min-height: 595px; }
  .hero-copy { max-width: 305px; }
  .hero-actions .btn { gap: 14px; padding-inline: 17px; font-size: 9px; }
  .hero-index { display: none; }
  .vehicle-finder { padding: 22px 20px; }
  .benefit { gap: 8px; font-size: 8px; }
  .benefit strong { font-size: 9px; }
  .benefit svg { width: 20px; height: 20px; }
  .section-heading h2 { font-size: 32px; }
  .category-card { min-height: 230px; }
  .category-card:first-child { min-height: 300px; }
  .category-content { padding: 18px; }
  .category-content h3 { font-size: 24px; }
  .category-content .text-link { font-size: 7px; gap: 8px; }
  .product-grid, .catalog-content .product-grid { gap: 27px 12px; }
  .product-price { font-size: 16px; }
  .product-price del { font-size: 10px; }
  .product-action { width: 27px; height: 27px; }
  .product-name { font-size: 11px; }
  .product-badge { max-width: calc(100% - 45px); font-size: 6px; }
  .workshop-copy { padding: 40px 24px; }
  .workshop-copy h2 { font-size: 38px; }
  .service-list { grid-template-columns: 1fr; }
  .journal-card { gap: 15px; }
  .journal-body h3 { font-size: 16px; }
  .journal-meta { font-size: 6px; letter-spacing: .08em; }
  .cta-band { padding: 26px; }
  .footer-grid { gap: 32px 20px; }
  .filter-options { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .hero-media video, video.hero-media { display: none; }
}
@media print {
  .site-header, .topbar, footer, .hero, .vehicle-finder, dialog, .toast, .filters { display: none !important; }
  body { background: #fff; }
  .container { width: 100%; }
  .section { padding-block: 25px; }
  a { text-decoration: none; }
  .product-card { break-inside: avoid; }
}

/* Concrete application structure and interactive states. */
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 25px; padding: 7px 32px; min-height: 32px; }
.topbar > a { display: inline-flex; gap: 12px; align-items: center; }
.topbar b { font-weight: 600; }
.logo img { filter: brightness(0) invert(1); }
.gold-line { display: none; }
.loading-screen { display: flex; min-height: 70vh; flex-direction: column; align-items: center; justify-content: center; gap: 13px; background: #111714; color: #d7bc6c; font-size: 18px; font-weight: 700; letter-spacing: .15em; }
.loading-screen span { font-size: 12px; color: #929e8d; font-weight: 400; letter-spacing: 0; }
.muted { color: #7d8578; font-size: 11px; }
.finder-copy { display: flex; align-items: center; gap: 14px; }
.finder-copy > svg { width: 30px; height: 30px; color: var(--gold); }
.finder-copy span { display: block; }
.benefits { grid-template-columns: repeat(3,1fr); }
.category-arrow { position: absolute; right: 23px; bottom: 26px; display: grid !important; place-items: center; margin: 0 !important; width: 34px; height: 34px; border: 1px solid #ffffff55; border-radius: 50%; background: #ffffff0a; backdrop-filter: blur(10px); }
.category-arrow svg { width: 16px; height: 16px; }
.category-content h3 { padding-right: 36px; margin-bottom: 0; }
.category-card:hover .category-arrow { background: var(--gold); border-color: var(--gold); color: #111; }
.brand-strip { padding-block: 35px; border-top: 1px solid #d9dfd3; border-bottom: 1px solid #d9dfd3; background: #ecefe7; }
.brand-strip .section-kicker { margin-bottom: 25px; color: #858c7e; font-size: 8px; justify-content: center; }
.brand-strip .section-kicker::before { display: none; }
.brand-names { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.brand-name { font-size: 26px; color: #69745f; }
.brand-name:hover { color: #9f8130; }
.product-media > a { display: block; width: 100%; height: 100%; }
.favorite-btn.selected { color: #92711d; background: #f4ebd2; }
.favorite-btn.selected svg { fill: #c4a44b4d; }
.product-badge.own { color: #8b7131; background: #f3ead0; border-color: #e4d8ae; }
.workshop-image > span { position: absolute; bottom: 24px; left: 30px; color: #fff9; font-size: 8px; letter-spacing: .15em; }
.journal-photo { position: relative; overflow: hidden; border-radius: var(--radius); }
.journal-photo img { width: 100%; aspect-ratio: 1.62; object-fit: cover; filter: saturate(.8); transition: transform .5s, filter .4s; }
.journal-photo > span { position: absolute; bottom: 15px; right: 17px; color: #fff; font-size: 10px; letter-spacing: .1em; }
.journal-photo::after { content: ""; position: absolute; inset: 65% 0 0; background: linear-gradient(0deg,#0006,transparent); pointer-events: none; }
.journal-card:hover .journal-photo img { transform: scale(1.035); filter: saturate(1); }
.cta-band { display: block; margin-bottom: 0; padding: 49px 0; border-radius: 0; border-inline: 0; background: #d0b569; }
.cta-band > .container { display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.cta-band .section-kicker { color: #5f512d; }
.cta-band h2 { color: #1c2217; font-size: 38px; margin: 0; }
.cta-band .btn { color: #f4f5f0; }
.social-links { display: flex; gap: 20px; margin-top: 22px; color: #c6cdbf; font-size: 10px; }
.social-links a:hover { color: var(--gold); }
.footer-column a { overflow-wrap: anywhere; }
.shop-section { padding-block: 35px 80px; }
.filters-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 25px; }
.filters-title h2 { font-size: 18px; letter-spacing: -.03em; }
.filters-title button { padding: 0; background: transparent; border: 0; text-transform: none; letter-spacing: 0; font-size: 9px; color: #8c956e; }
.filter-group select + select { margin-top: 10px; }
.filter-button svg { width: 13px; height: 13px; }
.check-label { display: flex; align-items: center; gap: 7px; color: #65765a; font-size: 11px; }
.filter-advice { margin-top: 30px; padding: 21px 16px; border: 1px solid #dce4d3; background: #ebf0e5; border-radius: 4px; }
.filter-advice .section-kicker { font-size: 7px; gap: 7px; letter-spacing: .08em; }
.filter-advice .section-kicker::before { width: 14px; }
.filter-advice h3 { font-size: 21px; margin-bottom: 9px; }
.filter-advice p { color: #809272; font-size: 11px; }
.filter-advice .text-link { font-size: 8px; letter-spacing: .02em; }
.catalog-status { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 17px; }
.catalog-status strong { color: #2b3d20; font-weight: 700; }
.active-filters:empty { display: none; }
.pagination { flex-direction: column; gap: 14px; }
.pagination p { color: #819470; font-size: 10px; margin: 0; }
.pagination .btn { width: auto; height: auto; min-height: 48px; margin: 0; padding: 14px 24px; font-size: 10px; background: #181c1a; border-color: #181c1a; color: #fff; }
.detail-section { padding: 36px 0 70px; }
.product-detail { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); align-items: start; gap: 65px; padding: 0; }
.detail-fitment { font-size: 14px !important; line-height: 1.7; }
.sku { padding-top: 6px; color: #9aa18d !important; font-size: 8px !important; letter-spacing: .12em; }
.detail-price { margin: 24px 0 7px; font-size: 35px; font-weight: 750; line-height: 1.1; letter-spacing: -.04em; }
.detail-intro { margin-block: 25px; line-height: 1.8; }
.variant-notice { margin-top: 24px; padding: 18px; border: 1px solid #ddd8bc; background: #eeead8; border-radius: 4px; }
.variant-notice strong { display: block; font-size: 12px; margin-bottom: 6px; }
.variant-notice p { margin: 0; color: #837d61; font-size: 11px; line-height: 1.7; }
.detail-actions { flex-wrap: wrap; }
.detail-actions > .quantity + .btn { flex: 1; }
.detail-actions > .quantity ~ a.btn { flex-basis: 100%; }
.save-product { background: transparent; border: 0; color: #7a856d; font-size: 10px; text-transform: none; letter-spacing: 0; padding-left: 0; }
.save-product.selected { color: #a8882b; }
.save-product.selected svg { fill: #c4a44b33; }
.detail-service { margin-top: 30px; padding-top: 10px; border-top: 1px solid #dae3cf; }
.detail-service > div, .detail-service > a { display: flex; align-items: center; gap: 11px; padding-block: 9px; color: #7b896c; font-size: 10px; }
.detail-service svg { width: 18px; height: 18px; color: #9b843e; }
.detail-service a:hover { color: #9e7e28; }
.stock > i { display: none; }
.details-side .accordion { padding: 0 0 14px; border-bottom: 1px solid #d6e0c9; }
.details-side .accordion + .accordion { border-top: 0; }
.accordion > summary { font-size: 13px; padding: 18px 0; }
.accordion > a { color: #9c7d30; font-size: 11px; }
.compatibility-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.compatibility-tags span { padding: 4px 8px; color: #6c7a5d; background: #e8eddf; border: 1px solid #dbe3d0; border-radius: 2px; font-size: 9px; }
.product-description { overflow-wrap: anywhere; }
.related { border-top: 1px solid #e0e7d7; }
.content-banner { position: relative; height: 390px; overflow: hidden; background: #161d16; }
.content-banner img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; filter: brightness(.8); }
.content-banner > span { position: absolute; bottom: 35px; left: max(30px,calc((100vw - var(--wide)) / 2)); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .16em; }
.content-section { display: grid; grid-template-columns: 37px minmax(0,1fr); gap: 18px; }
.section-number { padding-top: 5px; color: #aa9050; font-size: 12px; letter-spacing: .08em; }
.content-section .service-list { padding-left: 0; }
.content-section .service-list li { color: #738166; font-size: 12px; border-color: #d9e1d0; }
.contact-grid { margin-top: 65px; gap: 55px; align-items: start; }
.contact-card h2 { font-size: 35px; margin-bottom: 35px; }
.contact-card h3 { margin-top: 29px; margin-bottom: 13px; font-size: 17px; }
.contact-card > a { font-size: 13px; overflow-wrap: anywhere; }
.contact-form { margin-top: 0; }
.contact-form > h3 { font-size: 23px; margin-bottom: 27px; }
.contact-form .muted, #contact-status { font-size: 10px; color: #7e8c71; }
#search-dialog { width: min(760px,calc(100vw - 32px)); }
#search-dialog .search-field { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; }
#search-dialog .search-field > span { display: none; }
#search-dialog .search-field input { padding: 13px; min-height: 48px; }
#search-dialog .search-field button { position: static; width: auto; height: auto; padding: 13px 19px; color: #181b16; background: linear-gradient(125deg,#dac074,#c4a44b); }
#search-dialog .muted { margin-top: 15px; }
.quick-result { display: flex; align-items: center; gap: 15px; padding: 15px 0; border-top: 1px solid #dce4d2; }
.quick-result > img { width: 58px; height: 58px; padding: 5px; background: #fff; object-fit: contain; border: 1px solid #e0e7d7; }
.quick-result > span { flex: 1; min-width: 0; font-size: 12px; font-weight: 700; line-height: 1.4; }
.quick-result small { display: block; max-width: 300px; margin-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #8b987d; font-size: 9px; font-weight: 400; }
.quick-result > strong { white-space: nowrap; font-size: 12px; }
.quick-result:hover > span { color: #9a7c2b; }
.cart-quantity { display: flex; align-items: center; gap: 10px; margin: 10px 0; }
.cart-quantity > button:not(.remove-item) { display: grid; place-items: center; width: 25px; height: 25px; background: #e5edda; border: 1px solid #d3dfc5; border-radius: 3px; }
.cart-quantity > span { min-width: 13px; text-align: center; }
.remove-item { margin-left: 6px; background: transparent; color: #899778; font-size: 9px; text-decoration: underline; }
.cart-item-info .text-link { font-size: 8px; text-transform: none; letter-spacing: 0; display: inline-flex; border-bottom: 0; color: #9a7f36; line-height: 1.5; }
.cart-note { padding: 17px; border: 1px solid #dddcc2; background: #eeeddc; border-radius: 4px; }
.cart-note strong { display: block; color: #696442; margin-bottom: 6px; font-size: 11px; }
.cart-note p { margin: 0; color: #888267; font-size: 10px; }
.toast { visibility: hidden; opacity: 0; pointer-events: none; transform: translate(-50%,10px); transition: opacity .2s, transform .2s, visibility .2s; }
.toast.visible { visibility: visible; opacity: 1; transform: translate(-50%,0); }
@media (max-width: 1199px) {
  .topbar { font-size: 8px; padding-inline: 24px; }
  .topbar > a { gap: 9px; }
  .product-detail { gap: 40px; }
}
@media (max-width: 960px) {
  .topbar > span:nth-child(2) { display: none; }
  .brand-names { gap: 25px; }
  .brand-name { font-size: 20px; }
  .benefits { gap: 18px; }
  .benefit { font-size: 9px; }
  .benefit strong { font-size: 10px; }
  .product-detail { gap: 30px; }
  .contact-grid { gap: 30px; }
}
@media (max-width: 760px) {
  .topbar { justify-content: center; min-height: 28px; padding: 5px 15px; font-size: 8px; }
  .topbar > a { display: none; }
  .finder-copy { padding: 0 0 19px; }
  .finder-copy > svg { width: 29px; height: 29px; }
  .benefits { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; padding-block: 27px; }
  .benefit { flex-direction: column; text-align: center; justify-content: start; gap: 9px; font-size: 8px; line-height: 1.45; }
  .benefit strong { font-size: 9px; margin-bottom: 3px; }
  .benefit svg { width: 23px; height: 23px; }
  .category-arrow { bottom: 21px; right: 18px; width: 28px; height: 28px; }
  .category-content h3 { padding-right: 21px; }
  .category-card:not(:first-child) h3 { font-size: 23px; max-width: 125px; }
  .brand-strip { padding-block: 25px; overflow: visible; }
  .brand-strip .section-kicker { font-size: 7px; margin-bottom: 20px; }
  .brand-names { overflow-x: auto; justify-content: start; gap: 32px; padding-bottom: 3px; scrollbar-width: none; }
  .brand-names::-webkit-scrollbar { display: none; }
  .brand-name { font-size: 22px; }
  .journal-photo img { aspect-ratio: 1.2; }
  .journal-photo > span { bottom: 10px; right: 10px; font-size: 8px; }
  .cta-band { padding: 35px 0; margin: 0; }
  .cta-band > .container { flex-direction: column; align-items: start; gap: 23px; }
  .cta-band h2 { font-size: 32px; }
  .cta-band .btn { margin: 0; }
  .shop-section { padding-block: 25px 50px; }
  .filters.filters-open { display: block; }
  .catalog-status { font-size: 10px; }
  .catalog-status > span:last-child { font-size: 8px; }
  .filter-advice { margin-top: 20px; }
  .filter-advice .section-kicker { margin-bottom: 12px; }
  .filters-title { margin-bottom: 18px; }
  .detail-section { padding-block: 25px 50px; }
  .product-detail { grid-template-columns: 1fr; gap: 29px; padding: 0; }
  .detail-price { font-size: 32px; }
  .detail-actions { gap: 10px; }
  .detail-actions .quantity { flex-shrink: 0; }
  .detail-actions > .quantity + .btn { font-size: 9px; padding-inline: 14px; gap: 12px; }
  .content-banner { height: 260px; }
  .content-banner > span { bottom: 23px; left: 22px; font-size: 8px; }
  .content-section { grid-template-columns: 25px minmax(0,1fr); gap: 13px; }
  .section-number { font-size: 10px; }
  .content-section .service-list { display: block; }
  .contact-grid { margin-top: 40px; gap: 35px; }
  .contact-card h2 { font-size: 31px; }
  .contact-form { margin-top: 0; }
  .quick-result { gap: 10px; padding-block: 13px; }
  .quick-result > img { width: 45px; height: 45px; }
  .quick-result > span { font-size: 10px; }
  .quick-result small { max-width: 155px; font-size: 8px; }
  .quick-result > strong { font-size: 10px; }
  #search-dialog .search-field { grid-template-columns: 1fr; }
  #search-dialog .search-field input { font-size: 12px; }
  #search-dialog .search-field button { min-height: 42px; }
  .cart-row { align-items: start; }
  .cart-row > strong { font-size: 11px; padding-top: 3px; }
  .cart-item-info .text-link { font-size: 7px; }
  .cart-note { padding: 14px; }
  .footer-column a { font-size: 10px; }
}
@media (max-width: 420px) {
  .category-card:not(:first-child) h3 { font-size: 21px; }
  .category-arrow { right: 13px; width: 24px; height: 24px; }
  .category-arrow svg { width: 13px; height: 13px; }
  .category-content > span:not(.category-arrow) { font-size: 7px; }
  .cart-item-image { width: 47px; height: 47px; }
  .cart-row { gap: 9px; }
  .cart-item-info a { font-size: 10px; }
}