/* Tropical cyan-blue — cool practical */
:root {
  /* ── Palette · 5-tone ── */
  --color-accent:       oklch(55% 0.16 235);
  --color-accent-glow:  oklch(60% 0.10 235 / 0.12);
  --color-accent-ink:   oklch(95% 0.01 235);
  --color-paper:        oklch(97% 0.01 240);
  --color-paper-dim:    oklch(94% 0.01 240);
  --color-ink:          oklch(16% 0.01 245);
  --color-ink-soft:     oklch(38% 0.01 245);
  --color-ink-muted:    oklch(55% 0.01 245);
  --color-rule:         oklch(88% 0.01 240);
  --color-shadow:       oklch(16% 0.01 235 / 0.06);

  /* ── Typography · Bitter ── */
  --font-display:       'Bitter', serif;
  --font-body:          'Switzer', sans-serif;
}

/* Image density: rich — aim for 6+ images per page */



/* ── Hero: full-bleed ── */
.hero--full-bleed {
  position: relative; overflow: hidden;
  min-height: clamp(360px, 60vh, 640px);
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  padding: var(--space-3xl) var(--space-xl) var(--space-2xl);
}
.hero--full-bleed .hero-img {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%; object-fit: cover;
}
.hero--full-bleed .hero-overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.50) 100%);
}
.hero--full-bleed .hero-inner {
  position: relative; z-index: 2;
  max-width: var(--content-wide); width: 100%;
}



/* ── Cards: sharp ── */
.card-sharp { border-radius: 0; }
.card-sharp img { border-radius: 0; }
.card-sharp .cta { border-radius: var(--radius-sm); }



/* ── Grid: editorial (1-col) ── */
.grid-editorial { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2xl); }
.grid-editorial .product-card { max-width: var(--measure); margin: 0 auto; }