/* Category hero gradients */
.hero-citrus { background: linear-gradient(160deg, #F5A523 0%, #C8700A 100%); }
.hero-floral  { background: linear-gradient(160deg, #C8A8E0 0%, #9B6BAB 60%, #7A4F8B 100%); }
.hero-herbal  { background: linear-gradient(160deg, #A8D8A0 0%, #58BB48 60%, #3A8A2E 100%); }
.hero-earthy  { background: linear-gradient(160deg, #E0C0A0 0%, #C8905A 60%, #A0703A 100%); }
.hero-hoppy   { background: linear-gradient(160deg, #A0D8F0 0%, #45B8E6 60%, #2A8EBA 100%); }
.hero-spicy   { background: linear-gradient(160deg, #F0A0B0 0%, #E04D6B 60%, #B32B4A 100%); }

/* Hero inner: full-width, height 200px, contains flask icon */
.terpene-hero {
  width: 100%; height: 200px;
  display: flex; align-items: center; justify-content: center;
  position: relative;
}

/* Flask icon in hero (white outline) */
.hero-flask { color: rgba(255,255,255,0.6); }

/* Terpene breadcrumb */
.terpene-breadcrumb {
  font-family: 'Outfit', sans-serif;
  font-size: 12px; color: #9CA3AF;
  display: flex; align-items: center; gap: 6px;
  padding: 10px 0 6px;
}
.terpene-breadcrumb a { color: #9CA3AF; text-decoration: none; }
.terpene-breadcrumb a:hover { color: #C8700A; }
.terpene-breadcrumb .current { color: #374151; font-weight: 500; }

/* Heart / favorite button */
.heart-btn {
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  background: none; border: 1px solid #E5E7EB;
  border-radius: 50%; cursor: pointer;
  color: #D1D5DB; transition: all 0.15s;
  flex-shrink: 0;
}
.heart-btn:hover { border-color: #E04D6B; color: #E04D6B; }
.heart-btn.favorited { border-color: #E04D6B; color: #E04D6B; }
.heart-btn.favorited svg { fill: #E04D6B; }

/* Properties section */
.prop-label {
  font-family: 'Outfit', sans-serif;
  font-size: 12px; color: #9CA3AF;
  margin-bottom: 3px;
}
.prop-value {
  font-family: 'Outfit', sans-serif;
  font-size: 14px; font-weight: 500; color: #1C1C1C;
}

/* Related terpene row */
.related-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 13px 16px; border-radius: 8px;
  text-decoration: none; transition: filter 0.15s;
  margin-bottom: 6px;
}
.related-row:last-child { margin-bottom: 0; }
.related-row:hover { filter: brightness(0.92); }
.related-name {
  font-family: 'Big Shoulders Display', sans-serif;
  font-size: 14px; font-weight: 800;
  text-transform: uppercase; color: white;
  letter-spacing: 0.02em;
}
.related-category {
  font-family: 'Outfit', sans-serif;
  font-size: 11px; color: rgba(255,255,255,0.7);
  margin-top: 1px;
}
.related-chevron { color: rgba(255,255,255,0.6); flex-shrink: 0; }

/* Related row background by category */
.related-citrus { background: #C8700A; }
.related-floral  { background: #9B6BAB; }
.related-herbal  { background: #58BB48; }
.related-earthy  { background: #C8905A; }
.related-hoppy   { background: #45B8E6; }
.related-spicy   { background: #E04D6B; }