.paslauga-hero-section {
	--mobile-gap-size: 32px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	color: white;
	padding-bottom: max(40px, 2.8vw);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: var(--mobile-gap-size);
	.paslauga-page-title-wrapper {
		display: flex;
		flex-direction: row;
		align-self: center;
		gap: max(4px, 0.3vw);
		.paslauga-page-title {
			font-size: max(32px, 5.5vw);
			font-weight: 300;
		}
		.paslauga-page-index {
			font-size: max(16px, 1.6vw);
			font-family: Schnyder-L;
			font-style: italic;
		}
	}
}

.paslaugos-buttons-wrapper {
	align-self: end;
	width: 55.5vw;
	display: grid;
	align-items: center;
	grid-template-columns: 1fr 1fr;
	grid-column-gap: max(15px, 3vw);
	grid-row-gap: max(15px, 1.25vw);
	.underlined-button {
		&.left {
			grid-column: 1;
		}
		&.right {
			grid-column: 2;
		}
		&.is-active {
			font-style: italic;
		}
		&:hover,
		&:active,
		&:focus {
			svg {
				transform: rotate(-90deg);
			}
		}
		svg {
			width: max(16px, 1.1vw);
			height: max(23px, 1.6vw);
			min-width: max(16px, 1.1vw);
			height: max(23px, 1.6vw);
			transition: transform 0.3s ease;
			path {
				stroke: #ffffff;
			}
		}
	}
}

.paslauga-register-wrapper {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: baseline;
	gap: max(20px, 1.2vw);
	.paslauga-register-text {
		max-width: 45%;
		margin: 0;
	}
}

.paslauga-register-button,
.paslauga-social-button {
	svg {
		width: max(13px, 0.9vw);
		height: max(9px, 0.6vw);
	}
}

.paslauga-social-buttons-wrapper {
	display: flex;
	flex-direction: row;
	align-items: start;
	justify-content: start;
	flex-wrap: wrap;
	gap: max(14px, 1.9vw);
}

.paslauga-main-content-container {
	--mobile-gap-size: 32px;
	background-color: #e3e3e3;
	color: black;
	display: flex;
	flex-direction: column;
	gap: max(var(--mobile-gap-size), 8.3vw);
	padding-top: max(80px, 5vw);
	padding-bottom: 5vw;
}

.paslauga-main-content-wrapper {
	display: flex;
	flex-direction: row;
	gap: max(var(--mobile-gap-size), 2.8vw);
}

.paslauga-main-content {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: max(var(--mobile-gap-size), 5vw);
	.paslauga-title-wrapper {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: baseline;
		gap: 1.2vw;
		.paslauga-index {
			font-size: max(16px, 1.4vw);
			font-family: Sometype Mono;
		}
	}
	.paslauga-title {
		font-size: max(28px, 5.5vw);
		font-family: Schnyder-L;
		font-weight: 300;
		line-height: 0.75;
	}
}

.paslauga-main-media {
	width: 36.8vw;
	height: auto;
	display: flex;
	flex-direction: column;
	gap: max(12px, 0.8vw);
	img {
		width: 100% !important;
		height: auto !important;
	}
	.video-play-wrapper {
	    width: 100%;
	}
}

.paslauga-main-media-container {
	display: flex;
	flex-direction: column;
	gap: max(12px, 2.2vw);
}

.paslauga-questions-accordion {
	display: flex;
	flex-direction: column;
	gap: max(20px, 1.5vw);
	.content-wrapper {
		font-size: max(14px, 1vw);
	}
	ul {
		margin: max(12px, 0.8vw) 0;
	}
}

.paslauga-pictures-container {
	display: flex;
	flex-direction: row;
	gap: max(10px, 0.7vw);
	max-width: 100%;
	padding-top: max(20px, 2vw);
	border-top: 1px solid black;
	.paslauga-image {
		flex: 1;
		&.square {
			flex: 3;
			img {
				aspect-ratio: 1;
			}
		}
		&.normal {
			flex: 2;
		}
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			object-position: center center;
		}
	}
}

.paslauga-additional-section {
	display: flex;
	justify-content: center;
	&.mobile {
		display: none;
	}
}

.paslauga-additional-section-media-wrapper {
	height: 35vw;
	width: fit-content;
	overflow: hidden;

	video {
		height: 100%;
		width: 100%;
		object-fit: cover;
		display: block;
	}
}

@media screen and (max-width: 767px) {
	.paslauga-hero-section {
		min-height: 50vh;
		.paslaugos-buttons-wrapper {
			width: 100%;
		}
	}

	.paslauga-main-content-wrapper {
		flex-direction: column-reverse;
	}

	.paslauga-main-media {
		width: 100%;
	}
	.paslauga-pictures-container {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
	.paslauga-register-wrapper {
		flex-direction: column;
		.paslauga-register-text {
			max-width: 100%;
		}
	}
	.paslauga-additional-section-media-wrapper {
		height: auto;
	}
	.paslauga-additional-section {
		&.mobile {
			display: flex;
		}
		&:not(.mobile) {
			display: none;
		}
	}
}

@media screen and (max-width: 550px) {
	.paslauga-hero-section .paslaugos-buttons-wrapper {
		grid-template-columns: 1fr;
		.underlined-button.left,
		.underlined-button.right {
			grid-column: unset;
		}
	}
}