/* Home page specific styles (extend base.css, avoid duplicates) */

.hero {
  position: relative;
  min-height: 72vh;
  display: flex;
  align-items: center;
  background: #0d0a08 url('/assets/images/hero-banner.webp') center/cover no-repeat fixed;
}
.hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(13,10,8,.65) 0%, rgba(13,10,8,.75) 60%, rgba(13,10,8,.9) 100%);
}
.hero__inner {
  position: relative;
  z-index: 1;
  padding-top: var(--space-16);
  padding-bottom: var(--space-16);
}
.hero__actions { display: flex; gap: var(--space-4); flex-wrap: wrap; margin-top: var(--space-6); }
.hero__trust { display: flex; gap: var(--space-6); margin-top: var(--space-6); flex-wrap: wrap; color: var(--color-text-secondary); font-family: var(--font-ui); }
.hero__trust i { color: var(--color-primary); margin-right: .5rem; }

.world-figure, .feature-figure { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); border: 1px solid var(--color-neutral-800); }
.world-figure img, .feature-figure img { display: block; }
.world-figure figcaption, .feature-figure figcaption { padding: .5rem .75rem; background: var(--color-background-elevated); border-top: 1px solid var(--color-neutral-800); }

/* Catalog controls */
.catalog-controls { min-width: 260px; }
.filter-group { margin-top: var(--space-4); }
.filters { display: flex; gap: var(--space-3); flex-wrap: wrap; }
.filter-item { display: inline-flex; align-items: center; gap: .5rem; padding: .35rem .75rem; border-radius: var(--radius-full); border: 1px solid var(--color-neutral-700); background: var(--color-background-elevated); font-family: var(--font-ui); font-size: var(--font-size-sm); }
.filter-item input { accent-color: var(--color-primary); }

/* Product card tweaks */
.product-card .price { font-family: var(--font-ui); margin-top: .5rem; }

/* Feature product */
.feature-product { position: relative; }
.feature-product::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 20% 20%, rgba(201,169,97,.08), transparent 40%); pointer-events: none; }

/* Responsive */
@media (max-width: 768px) {
  .hero { min-height: 64vh; background-attachment: scroll; }
  .hero__actions { flex-direction: column; align-items: stretch; }
}
