/* Ingredient pages (/ingredient/<slug>/): photo header, then the other ingredients as a scrollable row. */
.bt-ing-hero, .bt-ing-others {
	--bt-forest: #15362D;
	--bt-paper: #FFFDF8;
	--bt-ink: #202622;
	--bt-muted: #59645F;
	--bt-line: #D8D2C4;
	--bt-warm: #FBF3E4;
	font-family: Mulish, system-ui, sans-serif;
}
.bt-ing-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 32px; align-items: center; margin: 0 0 28px; }
.bt-ing-hero-text { padding: 8px 0; }
.bt-ing-kicker { margin: 0 0 6px !important; font-size: 14px; font-weight: 700; color: var(--bt-muted); }
.bt-ing-title { margin: 0 0 12px !important; font: 700 44px/1.1 Lora, Georgia, serif !important; color: var(--bt-forest) !important; letter-spacing: 0 !important; text-transform: none !important; }
.bt-ing-sub { margin: 0 !important; font-size: 16px; line-height: 1.55; color: var(--bt-ink); }
.bt-ing-hero-img { margin: 0; aspect-ratio: 11 / 5; overflow: hidden; border-radius: 8px; background: var(--bt-warm); }
.bt-ing-hero-img img { display: block; width: 100%; height: 100% !important; object-fit: cover; }

.bt-ing-others { margin: 0 0 30px; padding: 18px 0 4px; border-top: 1px solid var(--bt-line); border-bottom: 1px solid var(--bt-line); }
.bt-ing-others-title { margin: 0 0 12px !important; font: 700 15px/1.3 Mulish, sans-serif; color: var(--bt-ink); }
.bt-ing-others ul { list-style: none; margin: 0; padding: 0 0 14px; display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin; }
.bt-ing-others li { flex: none; margin: 0; scroll-snap-align: start; }
.bt-ing-others a { display: flex; align-items: center; gap: 9px; min-height: 44px; padding: 5px 14px 5px 5px; border: 1px solid var(--bt-line); border-radius: 999px; background: var(--bt-paper); color: var(--bt-ink); font-size: 14px; font-weight: 600; white-space: nowrap; text-decoration: none; transition: border-color .2s, background-color .2s; }
.bt-ing-others a:hover { border-color: var(--bt-forest); background: #fff; color: var(--bt-forest); }
.bt-ing-others a:focus-visible { outline: 3px solid #D9A321; outline-offset: 2px; }
.bt-ing-others img { width: 34px; height: 34px !important; border-radius: 50%; object-fit: cover; }
.bt-ing-others small { color: var(--bt-muted); font-size: 12px; font-weight: 600; }

@media (max-width: 767px) {
	.bt-ing-hero { grid-template-columns: 1fr; gap: 16px; margin-bottom: 20px; }
	.bt-ing-hero-img { order: -1; }
	.bt-ing-title { font-size: 34px !important; }
}