@media (max-width: 799px) {
	.single-ingrediente .site-header {
		display: none;
	}
}

.ingredient-page {
	padding-bottom: calc(var(--mobile-nav-height) + 48px);
	max-width: 100%;
	overflow-x: clip;
}

.ingredient-mobile-bar {
	position: sticky;
	z-index: 30;
	top: 0;
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr) 44px;
	align-items: center;
	min-height: 72px;
	background: rgb(255 255 255 / 96%);
	backdrop-filter: blur(12px);
}

.ingredient-mobile-bar .site-brand {
	justify-self: center;
}

.ingredient-page__inner {
	display: grid;
	gap: 0;
	min-width: 0;
	max-width: 100%;
}

.ingredient-page__inner > * {
	width: 100%;
	min-width: 0;
	max-width: 100%;
}

.ingredient-header {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	align-items: center;
	gap: 22px;
	min-width: 0;
	max-width: 100%;
	padding-block: 20px 44px;
}

.ingredient-header__image {
	display: grid;
	width: 112px;
	aspect-ratio: 1;
	place-items: center;
	padding: 12px;
	border-radius: 50%;
	background: var(--color-surface-soft);
	max-width: 100%;
}

.ingredient-header__identity,
.ingredient-header dl,
.ingredient-header dl div,
.ingredient-header__facts,
.concern-card {
	min-width: 0;
	max-width: 100%;
}

.ingredient-header__image img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: contain;
}

.ingredient-header__image > span {
	display: grid;
	width: 68px;
	height: 68px;
	place-items: center;
	border-radius: 50%;
	background: #e9f7ee;
	color: var(--color-action);
}

.ingredient-header__image .icon {
	width: 34px;
	height: 34px;
}

.ingredient-header__identity h1 {
	margin: 0 0 10px;
	font-size: 2.25rem;
	line-height: 1.05;
	letter-spacing: 0;
	overflow-wrap: anywhere;
}

.ingredient-header__badge {
	display: inline-flex;
	padding: 5px 10px;
	border-radius: 999px;
	background: #e9f8ef;
	color: #087f3d;
	font-size: 0.6875rem;
	font-weight: 750;
}

.ingredient-header dl {
	display: grid;
	gap: 7px;
	margin: 18px 0 0;
}

.ingredient-header dl div {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	font-size: 0.8125rem;
}

.ingredient-header dt {
	font-weight: 400;
}

.ingredient-header dd {
	margin: 0;
	font-weight: 750;
}

.ingredient-header__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 18px;
}

.ingredient-header__facts span {
	display: grid;
	gap: 3px;
	min-width: 94px;
	padding: 10px 12px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	background: #fff;
}

.ingredient-header__facts small {
	color: var(--color-muted);
	font-size: 0.6875rem;
}

.ingredient-header__facts strong {
	font-size: 0.8125rem;
	overflow-wrap: anywhere;
}

.concern-card {
	grid-column: 1 / -1;
	display: grid;
	gap: 5px;
	padding: 18px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	background: var(--color-surface);
	overflow-wrap: anywhere;
}

@media (max-width: 599px) {
	.ingredient-header {
		grid-template-columns: minmax(82px, 112px) minmax(0, 1fr);
		gap: 14px;
	}

	.ingredient-header__image {
		width: 100%;
	}

	.ingredient-header__identity h1 {
		font-size: clamp(1.75rem, 9vw, 2.25rem);
	}

	.ingredient-header__facts {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ingredient-header__facts span {
		min-width: 0;
	}

	.ingredient-block,
	.ingredient-decision,
	.ingredient-presence,
	.ingredient-methodology {
		overflow-wrap: anywhere;
	}
}

.concern-card > span,
.concern-card > small {
	color: var(--color-muted);
	font-size: 0.75rem;
}

.concern-card > strong {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 1.5rem;
}

.concern-card > strong i {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-muted);
}

.concern-card--low > strong,
.concern-card--low > b {
	color: var(--color-action);
}

.concern-card--low > strong i {
	background: var(--color-action);
}

.concern-card--medium > strong,
.concern-card--medium > b {
	color: var(--color-warning);
}

.concern-card--medium > strong i {
	background: var(--color-warning);
}

.concern-card--high > strong,
.concern-card--high > b {
	color: var(--color-danger);
}

.concern-card--high > strong i {
	background: var(--color-danger);
}

.concern-card--very-high > strong,
.concern-card--very-high > b {
	color: #9f1239;
}

.concern-card--very-high > strong i {
	background: #9f1239;
}

.concern-card--unknown > strong,
.concern-card--unknown > b {
	color: var(--color-muted);
}

.concern-card__evidence {
	display: inline-flex;
	width: fit-content;
	padding: 4px 8px;
	border-radius: 999px;
	background: var(--color-surface-soft);
	color: var(--color-muted);
	font-size: 0.75rem;
	font-style: normal;
	font-weight: 750;
}

.concern-card hr {
	width: 100%;
	margin: 10px 0;
	border: 0;
	border-top: 1px solid var(--color-border);
}

.concern-card b {
	font-size: 1rem;
}

.ingredient-block,
.ingredient-decision,
.ingredient-presence {
	min-width: 0;
	max-width: 100%;
	margin-top: 14px;
	padding: 20px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	background: var(--color-surface);
}

.ingredient-decision {
	background: #f8fbff;
}

.ingredient-summary {
	background: #f2faf5;
}

.ingredient-concern {
	background: #fffaf0;
}

.ingredient-block > header,
.ingredient-decision > header,
.ingredient-presence > header {
	display: flex;
	align-items: center;
	gap: 9px;
	margin-bottom: 12px;
}

.ingredient-block > header .icon,
.ingredient-decision > header .icon,
.ingredient-presence > header .icon {
	width: 21px;
	height: 21px;
	color: var(--color-action);
}

.ingredient-concern > header .icon {
	color: var(--color-warning);
}

.ingredient-decision > header .icon {
	color: #2563eb;
}

.ingredient-block h2,
.ingredient-decision h2,
.ingredient-presence h2,
.ingredient-avoid h2,
.ingredient-section h2 {
	margin: 0;
	font-size: 1rem;
}

.ingredient-block p,
.ingredient-decision p {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.65;
}

.ingredient-block__empty {
	color: var(--color-muted);
}

.ingredient-avoid,
.ingredient-section {
	margin-top: 48px;
}

.ingredient-avoid p {
	margin: 8px 0 0;
	color: var(--color-muted);
	font-size: 0.875rem;
	line-height: 1.55;
}

.avoid-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin-top: 16px;
}

.avoid-card {
	display: grid;
	min-height: 100px;
	align-content: center;
	justify-items: center;
	gap: 9px;
	padding: 12px;
	border: 1px solid #f2d6d6;
	border-radius: var(--radius-md);
	background: #fff5f5;
	color: var(--color-danger);
	font-size: 0.75rem;
	text-align: center;
}

.avoid-card .icon {
	width: 26px;
	height: 26px;
}

.ingredient-evidence__intro {
	color: var(--color-muted);
}

.ingredient-sources {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 10px;
	padding: 0;
	margin: 16px 0 0;
	list-style: none;
}

.ingredient-sources a,
.ingredient-sources > li > span {
	display: grid;
	grid-template-columns: minmax(72px, 0.35fr) minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	min-height: 76px;
	padding: 14px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	background: #fff;
}

.ingredient-sources strong,
.ingredient-sources span span,
.ingredient-sources span em {
	min-width: 0;
}

.ingredient-sources strong {
	display: block;
	color: var(--color-ink);
	font-size: 0.875rem;
	overflow-wrap: normal;
	word-break: normal;
}

.ingredient-sources a > span,
.ingredient-sources em {
	overflow: hidden;
	color: var(--color-muted);
	font-size: 0.75rem;
	font-style: normal;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ingredient-sources .icon {
	width: 17px;
	height: 17px;
	color: var(--color-action);
}

.ingredient-description {
	margin-top: 14px;
}

.ingredient-technical {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	background: var(--color-surface);
}

.ingredient-technical > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 20px;
	cursor: pointer;
	font-weight: 800;
	list-style: none;
}

.ingredient-technical > summary::-webkit-details-marker {
	display: none;
}

.ingredient-technical > summary span {
	display: inline-flex;
	align-items: center;
	gap: 9px;
}

.ingredient-technical > summary .icon {
	width: 20px;
	height: 20px;
	color: var(--color-action);
}

.ingredient-technical > summary > .icon {
	color: var(--color-muted);
	transition: transform 160ms ease;
}

.ingredient-technical[open] > summary > .icon {
	transform: rotate(180deg);
}

.ingredient-description__text {
	padding: 0 20px 20px;
	font-size: 0.875rem;
	line-height: 1.7;
}

.ingredient-description__text.is-collapsible:not(.is-expanded) {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
}

.ingredient-technical > button {
	margin: -8px 20px 20px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #087f3d;
	font-weight: 700;
}

.ingredient-presence {
	margin-top: 48px;
	overflow: hidden;
}

.ingredient-presence__grid {
	display: grid;
	gap: 28px;
	min-width: 0;
}

.ingredient-presence h3 {
	margin: 0 0 14px;
	font-size: 0.8125rem;
}

.ingredient-presence__products {
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
}

.ingredient-presence__categories {
	display: grid;
	gap: 12px;
	min-width: 0;
}

.presence-category {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 7px;
	width: 100%;
	max-width: 100%;
	font-size: 0.75rem;
}

.presence-category span {
	min-width: 0;
	max-width: 100%;
	overflow-wrap: anywhere;
}

.presence-category i {
	height: 7px;
	width: 100%;
	min-width: 0;
	overflow: hidden;
	border-radius: 999px;
	background: #e8ece9;
}

.presence-category b {
	display: block;
	max-width: 100%;
	height: 100%;
	border-radius: inherit;
	background: var(--color-action);
}

.presence-category strong {
	justify-self: start;
	font-size: 0.8125rem;
}

.presence-products {
	display: flex;
	gap: 12px;
	width: 100%;
	max-width: 100%;
	padding-bottom: 6px;
	overflow-x: auto;
	overflow-y: hidden;
	overscroll-behavior-inline: contain;
	scroll-padding-inline: 1px;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
}

.ingredient-product-grid {
	display: flex;
	gap: 12px;
	width: 100%;
	max-width: 100%;
	padding-bottom: 4px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
}

.presence-products::-webkit-scrollbar,
.ingredient-product-grid::-webkit-scrollbar,
.ingredient-related__track::-webkit-scrollbar {
	display: none;
}

.presence-products .product-card,
.ingredient-product-grid .product-card {
	flex: 0 0 clamp(168px, 58vw, 210px);
	min-width: 0;
	max-width: 210px;
	scroll-snap-align: start;
}

.presence-products .product-card__media,
.ingredient-product-grid .product-card__media {
	aspect-ratio: 1 / 1;
	width: 100%;
	height: auto;
	min-height: 0;
	padding: 14px;
}

.presence-products .product-card__media img,
.ingredient-product-grid .product-card__media img {
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.presence-products .product-card__body {
	padding: 13px;
}

.presence-products .product-card__meta,
.presence-products .product-card__footer span:last-child {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.presence-products .product-card__title {
	font-size: 0.875rem;
}

.ingredient-related__track {
	display: flex;
	gap: 10px;
	max-width: 100%;
	padding-bottom: 4px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
}

.ingredient-section__intro {
	margin: 8px 0 18px;
	color: var(--color-muted);
	font-size: 0.9375rem;
	line-height: 1.5;
}

.ingredient-related .ingredient-card {
	flex: 0 0 min(210px, calc(100% - 42px));
	min-width: 0;
	scroll-snap-align: start;
}

.ingredient-related .ingredient-card__link {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	min-height: 78px;
}

.ingredient-related .ingredient-card__icon {
	display: grid;
	width: 42px;
	height: 42px;
	margin-left: 14px;
	place-items: center;
	border-radius: 50%;
	background: #ecf8f0;
	color: var(--color-action);
}

.ingredient-related .ingredient-card__body {
	min-width: 0;
	padding: 14px 12px;
}

.ingredient-related .ingredient-card__title {
	margin-bottom: 4px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ingredient-related .ingredient-card__concern {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	text-transform: capitalize;
}

.ingredient-related .ingredient-card__concern i {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--color-muted);
}

.ingredient-related .ingredient-card__concern--bajo i,
.ingredient-related .ingredient-card__concern--low i {
	background: var(--color-action);
}

.ingredient-related .ingredient-card__concern--medio i,
.ingredient-related .ingredient-card__concern--medium i {
	background: var(--color-warning);
}

.ingredient-related .ingredient-card__concern--alto i,
.ingredient-related .ingredient-card__concern--high i {
	background: var(--color-danger);
}

.ingredient-related .ingredient-card__concern--muy-alto i,
.ingredient-related .ingredient-card__concern--muy_alto i,
.ingredient-related .ingredient-card__concern--very-high i {
	background: #9f1239;
}

.ingredient-methodology {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: 14px;
	margin-top: 52px;
	padding: 20px;
	border-radius: var(--radius-md);
	background: #edf8f1;
}

.ingredient-methodology > span {
	display: grid;
	width: 44px;
	height: 44px;
	place-items: center;
	border-radius: 50%;
	background: #fff;
	color: var(--color-action);
}

.ingredient-methodology h2 {
	margin: 0 0 5px;
	font-size: 0.9375rem;
}

.ingredient-methodology p {
	margin: 0;
	color: var(--color-muted);
	font-size: 0.75rem;
}

.ingredient-methodology a {
	grid-column: 1 / -1;
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	color: #087f3d;
	font-size: 0.8125rem;
	font-weight: 750;
}

.ingredient-methodology a .icon {
	width: 17px;
	height: 17px;
}

@media (min-width: 600px) {
	.avoid-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (min-width: 800px) {
	.ingredient-mobile-bar {
		display: none;
	}

	.ingredient-page {
		padding-block: 48px 80px;
	}

	.ingredient-page__inner {
		max-width: 1120px;
	}

	.ingredient-header {
		grid-template-columns: 210px minmax(0, 1fr) 280px;
		gap: 34px;
	}

	.ingredient-header__image {
		width: 210px;
	}

	.ingredient-header__identity h1 {
		font-size: 3.3rem;
	}

	.concern-card {
		grid-column: auto;
	}

	.ingredient-block {
		padding: 24px;
	}

	.ingredient-presence__grid {
		grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
		gap: 40px;
	}

	.presence-category {
		grid-template-columns: minmax(90px, auto) minmax(70px, 1fr) auto;
		align-items: center;
		gap: 10px;
	}

	.presence-category i {
		grid-column: auto;
	}

	.presence-products {
		display: flex;
		overflow-x: auto;
	}

	.presence-products .product-card {
		flex-basis: 190px;
	}

	.ingredient-product-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		overflow: visible;
	}

	.ingredient-product-grid .product-card {
		min-width: 0;
	}

	.ingredient-methodology {
		grid-template-columns: auto minmax(0, 1fr) auto;
	}

	.ingredient-methodology a {
		grid-column: auto;
	}
}
