/**
 * Homepage desktop layout (min-width: 1280px) matching the original Figma Sites page.
 */

.sip-homepage-main,
.sip-homepage-main section,
.sip-homepage-main article {
	display: block;
	margin: 0;
	padding: 0;
	max-width: none;
}

.sip-homepage-main h2,
.sip-homepage-main h3,
.sip-homepage-main p {
	margin: 0;
}

.sip-hero {
	position: relative;
	width: 100%;
	height: 327px;
	overflow: hidden;
	background: #000;
}

.sip-hero img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.sip-story {
	position: relative;
	width: 100%;
}

.sip-split__row {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 32px;
	padding-top: 80px;
	padding-bottom: 32px;
}

.sip-split--pivo .sip-split__row {
	padding-top: 32px;
	padding-bottom: 80px;
}

.sip-split--about .sip-split__media {
	order: -1;
}

.sip-split__copy {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 40px;
}

.sip-split__copy h2 {
	font-family: "Inter:Bold", sans-serif;
	font-weight: 700;
	font-size: 24px;
	letter-spacing: -0.48px;
	line-height: 1.2;
	color: #000;
}

.sip-split__text {
	display: flex;
	flex-direction: column;
	gap: 1em;
	font-family: "Inter:Medium", sans-serif;
	font-weight: 500;
	font-size: 18px;
	letter-spacing: -0.09px;
	line-height: 1.3;
	color: #000;
}

.sip-split__media {
	position: relative;
	width: 100%;
	height: 243px;
	overflow: hidden;
	flex-shrink: 0;
}

.sip-split__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sip-hrana {
	position: relative;
	width: 100%;
	background-color: #000 !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff;
	overflow: visible;
}

.sip-hrana p,
.sip-hrana h1,
.sip-hrana h2,
.sip-hrana h3,
.sip-hrana h4,
.sip-hrana h5,
.sip-hrana h6,
.sip-hrana .elementor-heading-title,
.sip-hrana .elementor-text-editor p {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.sip-hrana__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 24px;
	padding-top: 80px;
	padding-bottom: 80px;
	text-align: center;
}

.sip-hrana__media {
	width: 100%;
	max-width: 327px;
	height: 208px;
	overflow: hidden;
}

.sip-hrana__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sip-hrana__copy h2 {
	font-family: "Inter:Bold", sans-serif;
	font-weight: 700;
	font-size: 32px;
	letter-spacing: -0.64px;
	line-height: 1.2;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.sip-hrana__copy p {
	font-family: "Inter:Medium", sans-serif;
	font-weight: 500;
	font-size: 18px;
	letter-spacing: -0.09px;
	line-height: 1.3;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.sip-cards {
	width: 100%;
	background: #fff;
}

.sip-cards__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 48px;
	padding-top: 80px;
	padding-bottom: 80px;
}

.sip-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	text-decoration: none;
	color: inherit;
	border-radius: 8px;
	overflow: hidden;
}

.sip-card--lime {
	background-color: #b3be34;
}

.sip-card--pink {
	background-color: #ff5f98;
}

.sip-card__media {
	position: relative;
	width: 100%;
	aspect-ratio: 327 / 436;
	overflow: hidden;
	background-color: inherit;
}

.sip-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	mix-blend-mode: multiply;
}

.sip-card__media--logo {
	aspect-ratio: 327 / 436;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #b3be34;
}

.sip-card__media--logo img {
	width: 70%;
	height: auto;
	object-fit: contain;
	mix-blend-mode: normal;
}

.sip-card__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 0 0 8px;
}

.sip-card__body h3 {
	font-family: "Inter:Semi Bold", sans-serif;
	font-weight: 600;
	font-size: 20px;
	letter-spacing: -0.3px;
	line-height: 1.2;
	color: #000;
}

.sip-card__body p {
	font-family: "Inter:Medium", sans-serif;
	font-weight: 500;
	font-size: 18px;
	letter-spacing: -0.09px;
	line-height: 1.45;
	color: #000;
}

.sip-sticker {
	display: none;
	pointer-events: none;
	z-index: 3;
}

.sip-sticker img {
	display: block;
	width: 100%;
	height: auto;
}

@media (min-width: 1280px) {
	.sip-hero {
		height: 800px;
	}

	.sip-split__row {
		display: flex !important;
		flex-direction: row !important;
		align-items: center;
		justify-content: center;
		gap: 64px;
		padding-top: 120px;
		padding-bottom: 40px;
	}

	.sip-split--pivo .sip-split__row,
	.sip-split__row--reverse {
		flex-direction: row !important;
		padding-top: 40px;
		padding-bottom: 120px;
	}

	.sip-split--about .sip-split__media {
		order: 0;
	}

	.sip-split__copy {
		flex: 1 1 0;
		min-width: 0;
		gap: 48px;
	}

	.sip-split--pivo .sip-split__copy {
		max-width: 376px;
		flex: 1 1 376px;
	}

	.sip-split__copy h2 {
		font-size: 36px;
		letter-spacing: -0.72px;
	}

	.sip-split__text {
		max-width: 446px;
	}

	.sip-split--pivo .sip-split__text {
		font-size: 18px;
		letter-spacing: -0.54px;
		line-height: 1.3;
	}

	.sip-split__media {
		flex: 1 1 0;
		min-width: 1px;
		height: 567px;
	}

	.sip-split--pivo .sip-split__media {
		height: 432px;
	}

	.sip-sticker {
		display: block;
		position: absolute;
	}

	.sip-sticker--hand {
		width: 341px;
		left: calc(50% - 640px + 459px);
		top: 178px;
		transform: rotate(11.27deg);
	}

	.sip-hrana__inner {
		max-width: 1280px;
		gap: 48px 32px;
		padding-top: 120px;
		padding-bottom: 120px;
	}

	.sip-hrana__media {
		max-width: 1152px;
		width: 100%;
		height: 427px;
	}

	.sip-hrana__copy {
		width: 100%;
		max-width: 832px;
	}

	.sip-sticker--pig {
		width: 341px;
		left: calc(50% - 640px + 815px);
		top: -200px;
		transform: rotate(11.27deg);
	}

	.sip-cards__grid {
		display: grid !important;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 32px;
		padding-top: 120px;
		padding-bottom: 120px;
		align-items: start;
	}

	.sip-card {
		min-width: 336px;
		max-width: 388px;
		gap: 32px;
		overflow: visible;
	}

	.sip-card__media {
		width: 100%;
		height: 483px;
		aspect-ratio: auto;
		border-radius: 0;
	}

	.sip-card--zmajska {
		position: relative;
		align-items: center;
	}

	.sip-card--zmajska .sip-card__media--logo {
		position: relative;
	}

	.sip-card--zmajska .sip-card__media--logo img {
		position: absolute;
		width: 271px;
		left: 50%;
		top: 90px;
		transform: translateX(-50%);
	}

	.sip-card__body h3 {
		font-size: 24px;
		letter-spacing: -0.48px;
	}
}