.product-image { width: 100%; border: 0; padding: 0; margin: 0; cursor: pointer; border-radius: 0; }
.product-image img:not(.product-crest) { transition: transform .25s ease; }
.product-image:hover img:not(.product-crest) { transform: scale(1.03); }
.product-image:focus-visible { outline-offset: -3px; }
.product-body p.card-tag { flex: 0 0 auto; min-height: 0; margin: 0; color: var(--color-gold-dark); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.product-purchase .add-cart-button, .modal-cart-controls .add-cart-button { background: var(--color-accent); color: var(--color-accent-text); border-color: var(--color-accent); }
.search-field[hidden] { display: none; }
.stats-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.stat { padding: var(--space-3) var(--space-4); }
.product-links { display: flex; justify-content: space-between; gap: var(--space-2); flex-wrap: wrap; margin-top: auto; }
.product-links .text-button { font-weight: 650; }
.result-count { margin: 0 0 var(--space-3); font-size: 13px; }
.filter-count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; margin-left: 4px; padding: 0 5px; border-radius: 99px; background: var(--color-error); color: #fff; font-size: 11px; }

.hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.hero .button-ghost { background: transparent; color: #fff; border-color: #ffffff88; }
.how-it-works { list-style: none; margin: var(--space-4) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.how-it-works li { display: flex; gap: var(--space-3); align-items: center; padding: var(--space-3) var(--space-4); background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius-md); font-size: 13px; color: var(--color-muted); }
.how-it-works b { flex: 0 0 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--color-gold-soft); color: var(--color-gold-dark); font-family: var(--font-heading); }
.how-it-works strong { color: var(--color-ink); }

.desktop-nav { gap: var(--space-3); }
.nav-group { display: flex; align-items: center; gap: 2px; }
.nav-group-smith { padding-left: var(--space-3); border-left: 1px solid var(--color-line); }
.nav-group-label { font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--color-gold-dark); margin-right: 4px; }
.cart-count { display: inline-grid; place-items: center; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 99px; background: var(--color-accent); color: #fff; font-size: 11px; }
.cart-count[hidden] { display: none; }
body[data-role="smith"] .site-header { background: #f4ecdc; }

.queue-panel { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--color-accent-soft); border: 1px solid #c9d5e2; }
.queue-panel.is-queued { background: linear-gradient(120deg, #22384f, #304a66); color: #fff; border-color: #22384f; }
.queue-panel.is-delivering, .queue-panel.is-finished { background: #e5f0fb; border-color: #bcd3ea; }
.queue-panel.is-delivered { background: var(--color-success-soft); border-color: #bfd8c6; }
.queue-panel.is-waiting { background: var(--color-gold-soft); border-color: #e2d2ab; }
.queue-number { display: grid; justify-items: center; min-width: 74px; padding-right: var(--space-4); border-right: 1px solid #ffffff40; line-height: 1.1; }
.queue-number strong { font-family: var(--font-heading); font-size: 38px; color: #f1dfb6; }
.queue-number small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
.queue-copy { display: grid; gap: 2px; font-size: 13px; }
.queue-copy strong { font-size: 15px; }
.queue-panel.is-queued .queue-copy span { color: #e3e8ee; }
.order-card.is-new { outline: 3px solid var(--color-gold); outline-offset: 2px; }

.spec-list { list-style: none; padding: 0; margin: 0 0 var(--space-3); display: flex; flex-wrap: wrap; gap: 6px; }
.spec-list li { padding: 4px 10px; border-radius: 99px; background: var(--color-gold-soft); color: var(--color-gold-dark); font-size: 12px; font-weight: 650; }
.forge-note { font-size: 12px; }
.modal-bulk-section p { margin-bottom: var(--space-2); font-size: 13px; }
.form-error { margin: 0; padding: 10px 12px; border-radius: var(--radius-sm); color: var(--color-error); background: var(--color-error-soft); font-size: 13px; font-weight: 650; }
.form-error[hidden] { display: none; }
.discount-line { color: var(--color-success); margin-top: var(--space-2); }
.discount-line[hidden] { display: none; }
.cart-row .quantity { margin-top: var(--space-2); }
.cart-row .quantity button { min-width: 38px; min-height: 38px; }

.admin-badges { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.queue-chip { padding: 5px 10px; border-radius: 99px; background: #22384f; color: #f1dfb6; font-size: var(--font-size-small); font-weight: 800; }
.sample-chip { padding: 2px 7px; border-radius: 99px; background: var(--color-gold-soft); color: var(--color-gold-dark); font-size: 11px; font-weight: 700; }
.quote-form { display: flex; align-items: flex-end; gap: var(--space-2); flex-wrap: wrap; padding: var(--space-3); border: 1px dashed var(--color-gold); border-radius: var(--radius-sm); background: #fffaf0; }
.quote-form label { flex: 1 1 160px; }
.demo-tools { margin-top: var(--space-6); display: grid; gap: var(--space-2); }
.demo-tools h2 { font-size: 18px; margin: 0; }
.demo-tools p { margin: 0; font-size: 13px; }
.demo-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.button-danger { background: var(--color-surface); color: var(--color-error); border-color: var(--color-error); }
.ticket-top { position: relative; }
.ticket-queue { margin-left: auto; padding: 3px 8px; border-radius: 4px; background: #22384f; color: #f1dfb6; font-family: var(--font-heading); font-size: 16px; font-weight: 800; }
.status[data-status="placed"] { color: #5a4a2c; background: #efe6d2; }
.status[data-status="assessing"], .status[data-status="awaiting-drop-off"] { color: var(--color-gold-dark); background: var(--color-gold-soft); }
.storage-banner { margin: 0 0 var(--space-4); padding: 10px 14px; border-radius: var(--radius-sm); background: var(--color-warning-soft); color: var(--color-warning); font-weight: 650; font-size: 13px; }
.repair-steps { margin: 0; padding-left: 20px; display: grid; gap: 4px; font-size: 13px; color: var(--color-muted); }
.footer-inner .demo-note { margin-top: var(--space-3); }

@media (max-width: 1010px) {
  .nav-group-label { display: none; }
  .nav-group-smith { padding-left: var(--space-2); }
}
@media (max-width: 760px) {
  .how-it-works { grid-template-columns: 1fr; gap: var(--space-2); }
  .how-it-works li { padding: var(--space-2) var(--space-3); }
  .mobile-nav { display: block; }
  .mobile-nav-group { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: stretch; }
  .mobile-nav-group[data-nav-role="smith"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mobile-nav-group[hidden] { display: none; }
  .mobile-nav button { font-size: 11px; padding: 10px 1px; }
  .mobile-nav .role-switch { color: var(--color-gold-dark); font-weight: 800; }
  .queue-number strong { font-size: 32px; }
  .stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
  .stat { padding: var(--space-2) var(--space-3); gap: 0; }
  .stat span { font-size: 11px; line-height: 1.3; }
}
@media (max-width: 430px) {
  .product-links { flex-direction: column; align-items: flex-start; gap: 0; }
  .queue-panel { gap: var(--space-3); padding: var(--space-3); }
  .queue-number { min-width: 58px; padding-right: var(--space-3); }
  .hero-actions .button { flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .product-image img:not(.product-crest) { transition: none; }
}

.admin-product { margin-top: var(--space-5); }
.admin-product summary { cursor: pointer; font-family: var(--font-heading); font-size: 18px; font-weight: 700; }
.admin-product[open] summary { margin-bottom: var(--space-4); }
.admin-product form { max-width: 680px; }
