/* ================================================
Component: Image content Hero
Path: components/flexible/cafeteria_hero/style.css
================================================ */
:is(body, .is-preview) {
	.image_content-hero {
		padding-top: var(--gap-2xl);
		padding-bottom: var(--gap-2xl);
	}
	.image_content-hero__inner {
		display: flex;
		flex-direction: column-reverse;
		gap: var(--gap-2xl);
		align-items: stretch;
		padding-bottom:var(--gap-2xl);
	}
	.image_content-hero__content {
		display: flex;
		flex-direction: column;
		padding: 0 var(--container-padding);
	}
	.image_content-hero-about .image_content-hero__content{
		padding: 0;
	}
	.inner-image_content-hero__content {
		display: flex;
		flex-direction: column;
		gap: var(--gap-lg);
	}
	.image_content-hero__title {
		font-family: var(--font-primary);
		font-weight: 900;
		font-size: 40px;
		line-height: 1;
		letter-spacing: var(--letter-spacing-hero);
		text-transform: uppercase;
		color: var(--color-white);
		margin: 0;
	}
	.image_content-hero__intro,
	.image_content-hero__intro p {
		font-family: var(--font-display);
		font-weight: var(--font-weight-extrabold);
		font-size: var(--font-size-lg);
		line-height: var(--line-height-normal);
		letter-spacing: 0.01em;
		color: var(--color-denim);
	}
	.image_content-hero__intro a {
		color: var(--color-grass);
		text-decoration-line: underline;
		text-decoration-style: solid;
		text-decoration-skip-ink: auto;
		text-decoration-thickness: 0.1em;
		text-underline-offset: 0.18em;
		text-underline-position: from-font;
		text-decoration-color: var(--color-grass);
		transition: color var(--transition-fast), text-decoration-color var(--transition-fast);
	}
	.image_content-hero__intro a:hover,
		.image_content-hero__intro a:focus-visible {
			color: var(--color-kale);
			text-decoration-color: var(--color-kale);
	}
	.image_content-hero__description {
		font-family: var(--font-secondary);
		font-size: var(--font-size-sm);
		font-weight: var(--font-weight-normal);
		line-height: var(--line-height-normal);
		letter-spacing: 0.01em;
		color: var(--color-denim);
	}
	.image_content-hero__description,
	.image_content-hero__description p {
		font-weight: 390;
		line-height: normal;
		letter-spacing: 0.135px;
	}
	.image_content-hero__description strong,
	.image_content-hero__description b {
		font-weight: var(--font-weight-extrabold);
	}
	.image_content-hero__description p {
		margin: 0 0 var(--gap-md);
	}
	.image_content-hero__description p:last-child {
		margin-bottom: 0;
	}
	.image_content-hero__image {
		width: 100%;
		overflow: hidden;
	}
	.image_content-hero__img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: 25% 0%;
	}
	@media (min-width: 641px) {
		.image_content-hero__title {font-size: 56px;}
		.image_content-hero__intro {font-size: 20px;line-height: 1.5;}
		.image_content-hero__description {font-size: var(--font-size-md);}
	}
	@media (min-width: 1025px) {
		.image_content-hero {padding-top: 0;padding-bottom: 0;}
		.image_content-hero__inner {flex-direction: row;align-items: stretch;padding-bottom:83px;}
		.image_content-hero__content {padding: 50px 0 0 14px;gap: var(--gap-lg);justify-content: flex-start;width: 50%;}
		.image_content-hero-about .image_content-hero__content {padding: 50px 0 50px 14px;justify-content: center;}
		.inner-image_content-hero__content {max-width: 636px;}
		.image_content-hero__image {flex: 1 1 auto;align-self: stretch;max-width: 736px;width: 50%;}
		.image_content-hero__title {color: var(--color-denim);}
		.image_content-hero__title span {color: var(--color-grass);}
		.image_content-hero-wrap .button-group {display:none;}
	}
	@media (min-width: 1350px) {
		.image_content-hero__content {padding: 112px 0 0 100px;}
		.image_content-hero-about .image_content-hero__content {padding: 50px 0 50px 100px;}
		.image_content-hero__content,
		.image_content-hero-about .image_content-hero__content {padding-left: calc((100vw - 1340px) / 2 + 14px);}
		.image_content-hero__title {font-size: var(--font-size-hero);line-height: 1;}
		.image_content-hero__description {font-size: var(--font-size-md);}
		.image_content-hero__content,
		.image_content-hero__image {width: auto;}
		.image_content-hero__intro,
		.image_content-hero__intro p {font-size: var(--font-size-xl);line-height: 1.5;}
	}
	@media(min-width:1550px) {
		.image_content-hero__content {width: 60%;}
		.image_content-hero__image {max-width: 100%;width: 50%;}
		.inner-image_content-hero__content {max-width: 800px;}
	}
	@media(max-width:1024px) {
		.image_content-hero__image,
		.image_content-hero__inner {position:relative;}
		.image_content-hero__image {max-height:324px;}
		.image_content-hero__image:before {content:'';opacity: 0.5;background: #584446;mix-blend-mode: multiply;position:absolute;height:100%;width:100%;top:0;left:0;}
		.image_content-hero-wrap {position: absolute;top: 60px;z-index: 1;display: flex;flex-direction: column;align-items: center;gap: var(--gap-md);width: 100%;left: 0;padding: 0 14px;}
		.image_content-hero__title {text-align:center;}
		.image_content-hero-about .image_content-hero__image {display:none;}
		.image_content-hero-about .image_content-hero-wrap {position: relative;top: 0;padding: 0;}
		.image_content-hero-about .image_content-hero__title {color: var(--color-denim);}
		.image_content-hero-about .image_content-hero__title span {color: var(--color-grass);}
		.image_content-hero-about .image_content-hero__inner {padding: var(--gap-3xl) 36px var(--gap-2xl);text-align: center;}
		.image_content-hero-about .inner-image_content-hero__content {gap: var(--gap-md);}
	}
	@media(max-width:640px) {
		.image_content-hero-about .image_content-hero__title {font-size: var(--font-size-3xl);line-height: 52px;letter-spacing: 0.36px;}
		.image_content-hero-about .image_content-hero__intro, .image_content-hero-about .image_content-hero__intro p {font-size: var(--font-size-lg);line-height: 26px;}
	}
}
