/* Products page styles (scoped additions; base styles live in base.css) */
.hero { padding: var(--space-14) 0; }
.hero__inner { align-items: center; }
.hero__content .kicker { color: var(--color-primary); font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: var(--space-3); font-size: var(--fs-sm); }
.hero__media { overflow: hidden; }

/* Filter bar */
.filter-bar { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); flex-wrap: wrap; }
.filter-bar__actions { display: flex; gap: var(--space-3); flex-wrap: wrap; }
.filter-bar .btn.is-active { --btn-bg: var(--color-primary-700); background-color: var(--color-primary-700); color: #fff; }
.section--paper {
    background-color: var(--gray-100);
    margin-bottom: 32px;
}
/* Product cards */
.product-card img { border-radius: calc(var(--radius-lg) - 2px); margin-bottom: var(--space-5); }
.product-card h3 { margin-top: 0; }
.specs-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3) var(--space-6); margin: var(--space-5) 0; }
@media (max-width: 700px) { .specs-list { grid-template-columns: 1fr; } }

/* Specs detail grid */
.specs-grid { display: grid; grid-template-columns: 12rem 1fr; gap: var(--space-3) var(--space-8); }
.specs-grid dt { font-weight: 700; }
.specs-grid dd { margin: 0; }
@media (max-width: 700px) { .specs-grid { grid-template-columns: 1fr; } }

/* Deals */
.deal { border-left: 4px solid var(--color-primary); }
.badge { display: inline-block; padding: 0.25rem 0.5rem; border-radius: var(--radius-round); font-weight: 700; font-size: var(--fs-xs); }
.badge--deal { background: rgba(63,125,78,0.1); color: var(--color-primary); }

/* Simple chat widget styles (to ensure usability on this page) */
.chat-toggle { position: fixed; right: 16px; bottom: 16px; z-index: 70; background: var(--color-primary); color: #fff; padding: 0.75rem 1rem; border-radius: var(--radius-round); box-shadow: var(--shadow-md); }
.chat-toggle:hover { background: var(--color-primary-600); }
.chat-panel { position: fixed; right: 16px; bottom: 80px; width: min(100%, 360px); max-height: 70vh; background: var(--color-surface); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); overflow: hidden; transform: translateY(16px); opacity: 0; pointer-events: none; transition: transform var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out); z-index: 70; }
.chat-panel[aria-hidden="false"] { transform: translateY(0); opacity: 1; pointer-events: auto; }
.chat-panel__header { display: flex; align-items: center; justify-content: space-between; padding: var(--space-5) var(--space-6); border-bottom: 1px solid var(--gray-200); }
.chat-panel__body { padding: var(--space-6); }
.chat-close { font-size: 1.25rem; line-height: 1; border-radius: var(--radius-md); padding: 0 8px; }
.chat-close:focus-visible { box-shadow: var(--focus-ring); }