/* =============================================================
   product.css — gear cards, comparison tables, product boxes
   ============================================================= */

.sbt-product{
  background:#fff; border-radius:var(--sbt-radius-md); padding:var(--sbt-space-5);
  box-shadow:var(--sbt-shadow-2); display:grid; grid-template-columns:200px 1fr; gap:var(--sbt-space-5);
  border-left:4px solid var(--sbt-spice);
}
@media (max-width: 600px){ .sbt-product{ grid-template-columns:1fr } }
.sbt-product--hero{ border-left-width:6px; padding:var(--sbt-space-6) }
.sbt-product__media{ aspect-ratio:1; background:var(--sbt-mist); border-radius:var(--sbt-radius-sm); overflow:hidden }
.sbt-product__media img{ width:100%; height:100%; object-fit:cover }
.sbt-product__body{ display:flex; flex-direction:column; gap:var(--sbt-space-2) }
.sbt-product__kicker{ font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--sbt-rustic); font-weight:600 }
.sbt-product__title{ font-family:var(--sbt-font-display); font-size:1.35rem; font-weight:700; color:var(--sbt-basil); margin:0 }
.sbt-product__bestfor{ font-size:.9rem; color:var(--sbt-rustic); font-style:italic }
.sbt-product__pros, .sbt-product__cons{ display:flex; flex-direction:column; gap:.25em; font-size:.88rem; margin:0; padding-left:1.25em }
.sbt-product__pros li::marker{ content:"✓ "; color:var(--sbt-herb); font-weight:700 }
.sbt-product__cons li::marker{ content:"– "; color:var(--sbt-rustic); font-weight:700 }
.sbt-product__cta{ margin-top:auto; display:flex; gap:var(--sbt-space-2); flex-wrap:wrap }

/* Compare table */
.sbt-compare-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:var(--sbt-radius-md); box-shadow:var(--sbt-shadow-2); background:#fff }
.sbt-compare{ width:100%; border-collapse:collapse; min-width:760px }
.sbt-compare th, .sbt-compare td{ padding:var(--sbt-space-3) var(--sbt-space-4); border-bottom:1px solid color-mix(in srgb, var(--sbt-rustic) 10%, transparent); vertical-align:top }
.sbt-compare thead th{ background:var(--sbt-basil); color:var(--sbt-cream); font-family:var(--sbt-font-display); font-weight:600; text-align:left }
.sbt-compare tbody tr:hover{ background:color-mix(in srgb, var(--sbt-sage) 12%, transparent) }
.sbt-compare tbody th{ position:sticky; left:0; background:var(--sbt-mist); z-index:1; font-weight:600; color:var(--sbt-basil) }
.sbt-compare .is-best{ background:color-mix(in srgb, var(--sbt-spice) 18%, transparent) }
.sbt-compare .is-best td:first-child::before{ content:"★ "; color:var(--sbt-spice) }

/* Mobile-sticky product */
.sbt-product--mobile-sticky{
  position:fixed; bottom:0; left:0; right:0; z-index:35;
  background:#fff; padding:var(--sbt-space-3) var(--sbt-space-4);
  display:flex; align-items:center; gap:var(--sbt-space-3); box-shadow:0 -10px 30px -12px rgba(20,36,28,.18);
  border-top:1px solid color-mix(in srgb, var(--sbt-rustic) 15%, transparent);
}
@media (min-width: 800px){ .sbt-product--mobile-sticky{ display:none } }

/* Gear archive listing */
.sbt-gear-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:var(--sbt-space-5) }