:root {
  --blue: #2196f3;
  --blue-dark: #0f6fb8;
  --ink: #101214;
  --paper: #f3efe5;
  --paper-2: #e8e2d4;
  --cream: #fbf8ef;
  --red: #a7332c;
  --steel: #81878a;
  --muted: #5f625f;
  --line: #c8c1b2;
  --max: 1180px;
  --shadow: 0 14px 30px rgba(16,18,20,.14);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    linear-gradient(rgba(16,18,20,.025) 1px, transparent 1px),
    var(--paper);
  background-size: 100% 5px;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.5;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
.container { width: min(calc(100% - 40px), var(--max)); margin: 0 auto; }

.topbar {
  background: var(--ink);
  color: #fff;
  font-size: .76rem;
  letter-spacing: .13em;
  text-transform: uppercase;
  font-weight: 800;
  text-align: center;
  padding: 8px 12px;
}

.site-header {
  border-bottom: 1px solid rgba(16,18,20,.2);
  background: rgba(243,239,229,.96);
  position: sticky;
  top: 0;
  z-index: 20;
  backdrop-filter: blur(10px);
}
.nav {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.logo img { width: 174px; height: auto; }
.nav-links { display: flex; align-items: center; gap: 28px; font-size: .82rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.nav-links a:not(.btn):hover { color: var(--blue-dark); }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border: 2px solid var(--ink);
  background: var(--ink);
  color: #fff;
  font-weight: 900;
  font-size: .82rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  transition: .16s ease;
}
.btn:hover { background: var(--blue); border-color: var(--blue); }
.btn.light { background: transparent; color: var(--ink); }
.btn.light:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn.blue { background: var(--blue); border-color: var(--blue); }
.btn.blue:hover { background: var(--blue-dark); border-color: var(--blue-dark); }

.hero {
  border-bottom: 1px solid var(--line);
  overflow: hidden;
}
.hero-grid {
  min-height: 650px;
  display: grid;
  grid-template-columns: .96fr 1.04fr;
  align-items: stretch;
}
.hero-copy {
  padding: 96px 68px 88px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.eyebrow {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 10px;
  font-size: .76rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 900;
  color: var(--muted);
}
.eyebrow::before { content:""; width: 30px; height: 3px; background: var(--blue); }
h1,h2,h3 { margin: 0; }
h1 {
  margin-top: 24px;
  font-family: Georgia, 'Times New Roman', serif;
  font-weight: 900;
  font-size: clamp(4rem, 7vw, 7.2rem);
  line-height: .89;
  letter-spacing: -.055em;
  max-width: 650px;
}
.hero-copy > p {
  margin: 28px 0 0;
  max-width: 590px;
  font-size: 1.1rem;
  color: #4f514f;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.hero-note { margin-top: 24px; font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: #73756f; }

.hero-visual {
  position: relative;
  min-height: 650px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  overflow: hidden;
}
.hero-art-card {
  width: 100%;
  height: 100%;
  align-self: stretch;
}
.hero-art-card img {
  width: 100%;
  height: 100%;
  max-height: none;
  display: block;
  object-fit: cover;
  object-position: center 42%;
}

.section { padding: 92px 0; }
.section.dark { background: var(--ink); color: #fff; }
.section.blue-band { background: var(--blue); color: #fff; }
.section-title { max-width: 780px; }
.kicker { font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .18em; color: var(--blue-dark); margin-bottom: 14px; }
.dark .kicker, .blue-band .kicker { color: #fff; opacity: .76; }
h2 {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(2.6rem, 5vw, 5rem);
  line-height: .95;
  letter-spacing: -.045em;
}
.section-title p { margin: 22px 0 0; color: var(--muted); font-size: 1.06rem; max-width: 680px; }
.dark .section-title p, .blue-band .section-title p { color: rgba(255,255,255,.74); }

.fit-note {
  margin-top: 26px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  background: #efe8d9;
  color: #4f514f;
  font-size: .95rem;
}
.fit-note strong { color: var(--ink); }
.headline-aside { font-size:.64em; white-space:nowrap; }
.section-actions { margin-top:22px; }

.three-up { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:46px; }
.three-up + .fit-note { margin-top:0; border-top:0; }
.feature { display:grid; grid-template-rows:44px 56px 220px auto; background:var(--cream); padding:34px; min-height:260px; }
.feature .num { color:var(--blue); font-family:Georgia,serif; font-size:2.2rem; font-weight:900; line-height:1; }
.feature h3 { margin:0; font-size:1.18rem; text-transform:uppercase; letter-spacing:.06em; }
.feature-visual {
  margin: 0;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.feature-visual img {
  width: 260px;
  max-width: 100%;
  height: 220px;
  object-fit: contain;
  display: block;
}
.feature p { margin:12px 0 0; color:var(--muted); font-size:.95rem; }
.feature-dark { background:#17191a; }
.feature-dark p { color:rgba(255,255,255,.72); }

.split { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:74px; }
.product-block { background:var(--paper-2); border:1px solid var(--line); padding:20px; }
.product-block img { width:100%; filter:saturate(.84) contrast(1.02); }
.product-photo {
  background: #161819;
  padding: 16px;
}
.product-photo img {
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center;
  filter: saturate(.92) contrast(1.04);
}
.copy-block h2 { font-size:clamp(2.7rem,4.8vw,4.8rem); }
.copy-block p { color:var(--muted); font-size:1.05rem; margin:22px 0 0; }
.copy-block .btn { margin-top:28px; }

.wholesale-hero { background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0)); }
.wholesale-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  margin-top: 42px;
  background: var(--line);
  border: 1px solid var(--line);
}
.wholesale-card {
  background: var(--cream);
  padding: 34px;
}
.wholesale-card h3 {
  font-size: 1.12rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.wholesale-card p {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: .98rem;
  max-width: 520px;
}
.wholesale-grid-tight { margin-top: 34px; }

.wholesale-page-hero {
  padding: 72px 0;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255, 255, 255, .25), transparent);
}

.wholesale-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr);
  gap: clamp(38px, 7vw, 92px);
  align-items: center;
}

.wholesale-hero-copy h1 { max-width: 710px; }

.wholesale-hero-copy p {
  max-width: 600px;
  margin: 24px 0 0;
  color: var(--muted);
  font-size: 1.1rem;
}

.wholesale-hero-copy .btn { margin-top: 28px; }

.wholesale-hero-photo {
  position: relative;
  margin: 0;
  border: 1px solid var(--line);
  background: var(--ink);
  box-shadow: 12px 14px 0 rgba(16, 18, 20, .1);
}

.wholesale-hero-photo img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center;
  filter: saturate(.82) contrast(1.03);
}

.wholesale-hero-photo figcaption {
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  background: var(--cream);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.wholesale-section-heading { max-width: 740px; }

.wholesale-section-heading p {
  max-width: 620px;
  margin-top: 18px;
  color: var(--muted);
}

.wholesale-products {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  margin-top: 36px;
  border: 1px solid var(--line);
  background: var(--line);
}

.wholesale-product {
  padding: 34px;
  background: var(--cream);
}

.wholesale-product-label {
  color: var(--blue);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.wholesale-product h3 {
  max-width: 490px;
  margin: 18px 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.75rem, 3vw, 2.55rem);
  line-height: 1.02;
}

.wholesale-product p {
  max-width: 520px;
  color: var(--muted);
}

.wholesale-product-list {
  margin: 28px 0 0;
  padding: 18px 0 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

.wholesale-product-list li {
  position: relative;
  padding: 8px 0 8px 18px;
  font-size: .95rem;
}

.wholesale-product-list li::before {
  position: absolute;
  top: 1.25em;
  left: 0;
  width: 7px;
  height: 2px;
  background: var(--blue);
  content: "";
}

.wholesale-branding-section {
  background: var(--ink);
  color: #fff;
}

.wholesale-branding-section .eyebrow { color: var(--blue); }
.wholesale-branding-section h2 { max-width: 720px; }

.wholesale-brand-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: 40px;
  border: 1px solid rgba(255, 255, 255, .2);
  background: rgba(255, 255, 255, .2);
}

.wholesale-brand-card {
  padding: 28px;
  background: rgba(255, 255, 255, .03);
}

.wholesale-brand-card h3 {
  margin: 0 0 14px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.55rem;
  line-height: 1.04;
}

.wholesale-brand-card p { color: rgba(255, 255, 255, .72); }

.wholesale-program-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-top: 38px;
}

.wholesale-program {
  border-top: 3px solid var(--blue);
  padding-top: 18px;
}

.wholesale-program h3 {
  margin: 0 0 12px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.5rem;
  line-height: 1.05;
}

.wholesale-program p { color: var(--muted); }

.wholesale-contact-section { padding-top: 0; }

.wholesale-contact-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 36px;
  align-items: center;
  padding: 42px;
  border: 1px solid var(--line);
  background: #ece6d8;
}

.wholesale-contact-panel h2 {
  max-width: 650px;
  margin: 0;
}

.wholesale-contact-panel p {
  max-width: 650px;
  margin-top: 16px;
  color: var(--muted);
}

.contact-panel {
  margin-top: 28px;
  padding: 30px 34px;
  background: var(--ink);
  color: #fff;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 30px;
  align-items: end;
}
.contact-panel h3 {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  line-height: .98;
  letter-spacing: -.03em;
}
.contact-panel p {
  margin: 16px 0 0;
  color: rgba(255,255,255,.76);
  max-width: 640px;
}
.contact-actions {
  display: flex;
  justify-content: flex-end;
  align-items: end;
}

.quote-band { padding:44px 0; border-top:1px solid rgba(255,255,255,.18); border-bottom:1px solid rgba(255,255,255,.18); }
.quote-band p { margin:0; font-family:Georgia,serif; font-size:clamp(1.8rem,3vw,3.2rem); font-weight:900; letter-spacing:-.025em; text-align:center; }

.cta-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:50px; align-items:end; }
.cta-grid p { max-width:610px; color:rgba(255,255,255,.83); }
.cta-grid .actions { display:flex; justify-content:flex-end; }
.blue-band .btn { background:#fff; color:var(--ink); border-color:#fff; }
.blue-band .btn:hover { background:var(--ink); color:#fff; border-color:var(--ink); }

.footer { background:#0b0c0d; color:#c7c4bc; padding:44px 0; }
.footer-grid { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; }
.footer img { width:145px; filter:grayscale(1) brightness(3); opacity:.92; }
.footer p { margin:14px 0 0; font-size:.77rem; max-width:460px; color:#888982; }
.footer .footer-patent { margin-top: 6px; color: var(--blue); font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.footer-links { display:flex; gap:22px; text-transform:uppercase; letter-spacing:.1em; font-weight:800; font-size:.72rem; }
.footer-email {
  color: #f3efe5;
  text-decoration: underline;
  text-decoration-color: rgba(243,239,229,.35);
  text-underline-offset: 3px;
}

/* Shop */
.shop-hero { border-bottom:1px solid var(--line); background:linear-gradient(108deg, rgba(33,150,243,.16), transparent 45%), var(--paper-2); }
.shop-hero-grid { min-height:330px; display:grid; grid-template-columns:1fr minmax(240px,.46fr); gap:48px; align-items:end; padding-top:72px; padding-bottom:62px; }
.shop-hero h1 { margin-top:18px; font-size:clamp(3.6rem,6vw,6.7rem); max-width:780px; }
.shop-hero p { max-width:580px; margin:20px 0 0; color:var(--muted); font-size:1.1rem; }
.shop-hero-note { align-self:end; padding:18px 0 0 24px; border-left:3px solid var(--blue); font-size:.88rem !important; font-weight:800; text-transform:uppercase; letter-spacing:.075em; }
.shop-section { min-height:500px; }
.shop-toolbar { display:flex; align-items:end; justify-content:space-between; gap:28px; padding-bottom:30px; border-bottom:1px solid var(--line); }
.shop-toolbar .kicker { margin:0 0 8px; }
.shop-toolbar h2 { font-size:clamp(2.5rem,4vw,4.2rem); }
.cart-trigger { border:2px solid var(--ink); background:var(--ink); color:#fff; min-height:48px; padding:0 20px; font-weight:900; text-transform:uppercase; letter-spacing:.09em; font-size:.8rem; cursor:pointer; }
.cart-trigger span { display:inline-grid; place-items:center; min-width:22px; height:22px; margin-left:7px; border-radius:50%; background:var(--blue); color:#fff; }
.shop-status { margin:34px 0; padding:20px; border:1px solid var(--line); background:var(--cream); color:var(--muted); }
.shop-status a { color:var(--blue-dark); text-decoration:underline; text-underline-offset:3px; }
.product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:34px; }
.product-card { border:1px solid var(--line); background:var(--cream); display:flex; flex-direction:column; }
.product-image { aspect-ratio:1 / 1; background:var(--paper-2); overflow:hidden; }
.product-image img { width:100%; height:100%; object-fit:contain; padding:22px; mix-blend-mode:multiply; }
.product-card-copy { padding:24px; display:grid; gap:22px; flex:1; }
.product-card h3 { font-family:Georgia,serif; font-size:1.8rem; line-height:1; }
.product-card p { margin:10px 0 0; color:var(--muted); font-size:.94rem; }
.product-card-buy { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:auto; }
.product-card-buy strong { font-size:1.1rem; }
.product-card-buy .btn { min-height:42px; padding:0 16px; }
.cart-scrim { position:fixed; inset:0; z-index:29; background:rgba(10,12,13,.58); }
.cart-drawer { position:fixed; z-index:30; top:0; right:0; bottom:0; width:min(460px,100%); display:grid; grid-template-rows:auto 1fr auto; padding:28px; background:var(--cream); box-shadow:-18px 0 40px rgba(0,0,0,.22); transform:translateX(101%); transition:transform .2s ease; }
.cart-drawer[aria-hidden="false"] { transform:translateX(0); }
.cart-heading { display:flex; justify-content:space-between; gap:20px; padding-bottom:20px; border-bottom:1px solid var(--line); }
.cart-heading .kicker { margin:0 0 8px; }.cart-heading h2 { font-size:2.4rem; }
.cart-close { border:0; background:transparent; color:var(--ink); font-size:2.2rem; line-height:1; cursor:pointer; }
.cart-items { overflow:auto; padding:10px 0; }.cart-empty { color:var(--muted); padding:22px 0; }
.cart-item { display:grid; grid-template-columns:90px 1fr; gap:15px; padding:16px 0; border-bottom:1px solid var(--line); }
.cart-item img { width:90px; height:90px; object-fit:contain; background:var(--paper-2); mix-blend-mode:multiply; }.cart-item h3 { font-family:Georgia,serif; font-size:1.3rem; }.cart-item p { margin:4px 0; color:var(--muted); }
.quantity-controls { display:flex; align-items:center; gap:10px; }.quantity-controls button { border:1px solid var(--line); background:var(--paper); width:28px; height:28px; cursor:pointer; }.quantity-controls .remove-item { width:auto; height:auto; margin-left:4px; padding:0; border:0; background:transparent; color:var(--blue-dark); text-decoration:underline; text-underline-offset:3px; }
.cart-footer { padding-top:18px; border-top:1px solid var(--line); }.cart-total { display:flex; justify-content:space-between; align-items:center; font-family:Georgia,serif; font-size:1.55rem; }.cart-footer p { margin:10px 0 16px; color:var(--muted); font-size:.82rem; }.checkout-button { width:100%; cursor:pointer; }.checkout-button:disabled { opacity:.45; cursor:not-allowed; }
.order-confirmed { min-height:100vh; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:22px; width:min(calc(100% - 48px),740px); margin:auto; }.order-confirmed .logo img { width:180px; }.order-confirmed h1 { font-size:clamp(3.5rem,9vw,7rem); }.order-confirmed p { max-width:480px; color:var(--muted); font-size:1.1rem; }

/* How it works */
.page-hero { padding:84px 0 64px; border-bottom:1px solid var(--line); }
.page-hero-grid { display:grid; grid-template-columns:minmax(0, 1.05fr) minmax(300px, .95fr); gap:54px; align-items:center; }
.page-hero-copy h1 { max-width:760px; }
.page-hero-copy p { color:var(--muted); font-size:1.08rem; max-width:560px; margin:24px 0 0; }
.page-hero-visual { display:flex; justify-content:center; }
.page-hero-product {
  position: relative;
  isolation: isolate;
  width: min(370px, 100%);
  padding: 0;
}
.page-hero-product::before,
.page-hero-product::after {
  content: "";
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
}
.page-hero-product::before {
  left: 6%;
  right: 6%;
  bottom: 1.2%;
  height: 30px;
  background: rgba(30, 29, 25, .20);
  filter: blur(15px);
}
.page-hero-product::after {
  left: 18%;
  right: 18%;
  bottom: 2.6%;
  height: 15px;
  background: rgba(20, 20, 18, .28);
  filter: blur(6px);
}
.page-hero-product img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 7px 5px rgba(16,18,20,.13));
}

.instruction-list { margin-top:38px; border-top:1px solid var(--line); }
.instruction-row { display:grid; grid-template-columns:74px minmax(0, 1fr) 240px; gap:24px; padding:18px 0; border-bottom:1px solid var(--line); align-items:center; }
.instruction-number { font-family:Georgia,serif; color:var(--blue); font-size:4.2rem; line-height:1; font-weight:900; }
.instruction-copy h3 { font-family:Georgia,serif; font-size:2rem; letter-spacing:-.03em; }
.instruction-copy p { margin:10px 0 0; color:var(--muted); max-width:620px; }
.instruction-visual {
  justify-self: end;
  width: 220px;
  height: 200px;
  background: transparent;
  padding: 0;
  border: 0;
  box-shadow: none;
}
.instruction-visual img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.hold-strength {
  margin-top: 34px;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(330px, .9fr);
  border: 1px solid var(--line);
  background: var(--ink);
}
.hold-strength-copy {
  padding: 42px 46px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.hold-strength-copy h2 {
  margin-top: 12px;
  max-width: 530px;
  color: #fff;
}
.hold-strength-copy p {
  margin: 18px 0 0;
  max-width: 600px;
  color: rgba(255,255,255,.74);
  font-size: 1.03rem;
}
.hold-strength-panel {
  padding: 30px 34px;
  background:
    linear-gradient(90deg, rgba(16,18,20,.05) 1px, transparent 1px),
    linear-gradient(rgba(16,18,20,.05) 1px, transparent 1px),
    var(--paper-2);
  background-size: 34px 34px;
  color: var(--ink);
}
.hold-strength-panel-head {
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(16,18,20,.24);
  color: var(--blue);
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.force-comparisons { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:22px; padding:22px 0 18px; }
.force-comparisons::after { content:""; position:absolute; top:22px; bottom:18px; left:50%; width:1px; background:rgba(16,18,20,.2); transform:translateX(-.5px); }
.force-comparison { min-width:0; }
.force-comparison + .force-comparison { border-left:0; padding-left:0; }
.force-comparison-head { display:flex; align-items:baseline; gap:10px; }
.force-comparison-number { color:var(--blue); font-size:.72rem; font-weight:900; letter-spacing:.12em; }
.force-comparison h3 { margin:0; color:var(--ink); font-size:.9rem; letter-spacing:.015em; }
.force-illustration { position:relative; width:100%; aspect-ratio:4 / 3; margin:4px 0 8px; }
.force-illustration img, .force-illustration svg { position:absolute; inset:0; width:100%; height:100%; }
.force-illustration img { object-fit:contain; }
.force-illustration svg { overflow:visible; }
.force-comparison p { margin:0; min-height:3.4em; color:#575a56; font-size:.79rem; line-height:1.42; }
.force-legend {
  display:flex;
  align-items:center;
  gap:8px;
  padding-top:13px;
  border-top:1px solid rgba(16,18,20,.2);
  color:#696b65;
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.035em;
  text-transform:uppercase;
}
.force-legend-red, .force-legend-blue { width:16px; height:3px; display:inline-block; }
.force-legend-red { background:#b64a34; }
.force-legend-blue { background:var(--blue); margin-left:8px; }

.can-compatibility {
  margin-top: 52px;
  padding: 34px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.08)), var(--paper-2);
}
.can-compatibility-grid {
  margin-top: 34px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: start;
}
.compatibility-graphic {
  border: 1px solid var(--line);
  background: var(--cream);
  padding: 16px;
  max-width: 760px;
  width: 100%;
  margin: 0 auto;
  box-shadow: 0 14px 26px rgba(16,18,20,.08);
}
.compatibility-graphic img {
  width: 100%;
  height: auto;
}
.compatibility-notes {
  display: grid;
  grid-template-columns: minmax(210px, .78fr) minmax(0, 1.22fr);
  gap: 42px;
  align-items: start;
}
.compatibility-notes-intro {
  padding-top: 14px;
}
.compatibility-notes-label {
  color: var(--blue-dark);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.compatibility-notes-intro p {
  margin: 10px 0 0;
  font-family: Georgia, serif;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.2;
}
.compatibility-points {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 28px;
  border-top: 1px solid var(--line);
}
.compatibility-point {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 10px;
  padding: 17px 0;
  border-bottom: 1px solid var(--line);
  color: #4d514d;
  font-size: .93rem;
  line-height: 1.45;
}
.compatibility-point span {
  color: var(--red);
  font-family: Georgia, serif;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.35;
}
.compatibility-point p {
  margin: 0;
}

.compatibility-wrap { margin-top:72px; border-top:1px solid var(--line); padding-top:40px; }
details.compatibility { border:1px solid #bdb6a9; background:#ebe6db; }
details.compatibility summary { cursor:pointer; padding:20px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; list-style:none; font-weight:900; text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; }
details.compatibility summary::-webkit-details-marker { display:none; }
details.compatibility summary::after { content:"+"; font-size:1.4rem; color:var(--blue-dark); }
details.compatibility[open] summary::after { content:"–"; }
.compatibility-body { padding:0 24px 28px; display:grid; grid-template-columns:1fr 1fr; gap:34px; color:#555852; }
.compatibility-body h3 { color:var(--ink); font-size:1.05rem; text-transform:uppercase; letter-spacing:.06em; }
.compatibility-body p { margin:10px 0 0; }
.rare-note { font-size:.82rem; color:#777970; margin-top:18px; }

.restrictor-card { margin:0 24px 24px; padding:30px; background:var(--ink); color:#fff; display:grid; grid-template-columns:1fr .9fr; gap:38px; align-items:center; }
.restrictor-card h3 { font-family:Georgia,serif; font-size:2.1rem; }
.restrictor-card p { color:rgba(255,255,255,.74); }
.restrictor-facts { display:grid; gap:10px; }
.fact { border-top:1px solid rgba(255,255,255,.19); padding-top:10px; text-transform:uppercase; font-weight:900; letter-spacing:.08em; font-size:.74rem; }

@media (max-width: 900px) {
  .nav-links a:not(.btn) { display:none; }
  .hero-grid, .split, .page-hero-grid, .cta-grid, .wholesale-grid, .contact-panel, .can-compatibility-grid, .hold-strength, .compatibility-notes { grid-template-columns:1fr; }
  .shop-hero-grid { grid-template-columns:1fr; gap:24px; }
  .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero-copy { padding-right:0; }
  .hero-visual { margin-left:-20px; margin-right:-20px; min-height:480px; padding:0; }
  .three-up { grid-template-columns:1fr; }
  .split { gap:38px; }
  .cta-grid .actions { justify-content:flex-start; }
  .contact-actions { justify-content:flex-start; }
  .compatibility-points { grid-template-columns:1fr; }
  .compatibility-notes { gap: 22px; }
  .feature-visual { min-height: 0; }
  .page-hero { padding: 72px 0 56px; }
  .page-hero-visual { justify-content:flex-start; }
  .page-hero-product { width:min(310px, 100%); }
  .hold-strength-copy { padding: 34px; }
  .force-comparisons { max-width:620px; }
  .instruction-row { grid-template-columns:70px 1fr; }
  .instruction-visual { grid-column:2; justify-self:start; width:min(220px, 100%); height:200px; }
  .compatibility-body, .restrictor-card { grid-template-columns:1fr; }
  .wholesale-hero-grid, .wholesale-products, .wholesale-brand-grid, .wholesale-program-grid, .wholesale-contact-panel { grid-template-columns:1fr; }
  .wholesale-page-hero { padding:56px 0; }
  .wholesale-hero-photo { width:100%; max-width:520px; }
  .wholesale-contact-panel { padding:32px; }
}

@media (max-width: 560px) {
  .hold-strength-panel { padding:28px 24px; }
  .force-comparisons { grid-template-columns:1fr; gap:20px; }
  .force-comparisons::after { display:none; }
  .force-comparison + .force-comparison { border-left:0; border-top:1px solid rgba(16,18,20,.2); padding:20px 0 0; }
}

@media (max-width: 560px) {
  .container { width:min(calc(100% - 24px),var(--max)); }
  .nav { min-height:68px; }
  .logo img { width:138px; }
  .nav-links { gap:10px; }
  .nav .btn { min-height:42px; padding:0 14px; font-size:.7rem; }
  .hero-copy { padding:68px 0 56px; }
  .hero-visual { padding:0; min-height:390px; }
  .shop-hero-grid { min-height:auto; padding:58px 0 46px; }.shop-hero-note { padding-left:16px; }
  .shop-toolbar { align-items:flex-start; flex-direction:column; }.product-grid { grid-template-columns:1fr; }.cart-drawer { padding:22px; }
  h1 { font-size:clamp(3.5rem,18vw,5.3rem); }
  .section { padding:68px 0; }
  .feature { min-height:auto; }
  .footer-grid { flex-direction:column; align-items:flex-start; }
  .instruction-row { grid-template-columns:1fr; gap:12px; padding:24px 0; }
  .instruction-number { font-size:3rem; }
  .instruction-visual { grid-column:auto; width:100%; height:220px; }
  .wholesale-product, .wholesale-brand-card, .wholesale-contact-panel { padding:24px; }
}