/* Showroom band (2026-11-07): the "try it in the 3D showroom" strip on the homepage and every product page.
   Self-contained on purpose: foam.html does not load ca-system.css, so nothing here depends on it.
   The showroom needs a mouse and keyboard, so touch-only devices never see the band. */
.ca-showroom-band { --sb-c: #fe865c; padding: clamp(28px, 5vw, 56px) 16px; }
.ca-showroom-band a.ca-sb-card { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: clamp(18px, 3vw, 40px);
  max-width: 1120px; margin: 0 auto; padding: clamp(14px, 2vw, 22px); border-radius: 22px; text-decoration: none; color: #f3eef4;
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)), #0f0c15; border: 1px solid rgba(255,255,255,.1);
  transition: border-color .2s, transform .2s; }
.ca-showroom-band a.ca-sb-card:hover { border-color: var(--sb-c); transform: translateY(-2px); }
.ca-showroom-band a.ca-sb-card:focus-visible { outline: 2px solid var(--sb-c); outline-offset: 4px; }
.ca-showroom-band .ca-sb-shot { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 14px; background: #0b0910; }
.ca-showroom-band .ca-sb-copy { display: flex; flex-direction: column; gap: 10px; padding: 6px 8px 6px 0; }
.ca-showroom-band .ca-sb-kicker { font: 500 12px/1 "JetBrains Mono", ui-monospace, Menlo, monospace; letter-spacing: .14em; text-transform: uppercase; color: var(--sb-c); }
.ca-showroom-band .ca-sb-title { font: 300 clamp(26px, 3.2vw, 40px)/1.08 Jost, Inter, -apple-system, sans-serif; color: #f3eef4; }
.ca-showroom-band .ca-sb-sub { font: 400 15px/1.55 Inter, -apple-system, sans-serif; color: #c2b9c7; max-width: 46ch; }
.ca-showroom-band .ca-sb-cta { align-self: flex-start; margin-top: 6px; border-radius: 999px; padding: 13px 22px; background: var(--sb-c); color: #120a07;
  font: 600 15px/1 Inter, -apple-system, sans-serif; }
@media (max-width: 760px) { .ca-showroom-band a.ca-sb-card { grid-template-columns: 1fr; } .ca-showroom-band .ca-sb-copy { padding: 0 4px 6px; } }
@media (hover: none) and (pointer: coarse) { .ca-showroom-band { display: none; } }
@media (prefers-reduced-motion: reduce) { .ca-showroom-band a.ca-sb-card, .ca-showroom-band a.ca-sb-card:hover { transition: none; transform: none; } }