/**
 * Section: solutions (Figma "solutions" 10513:23971): one tab per audience
 * (the tab bar component, components/tabs.css), each panel a picture beside
 * its pitch.
 */

.hb-section.hb-section--solutions {
	position: relative;
	margin-top: 0;
	padding-top: 5rem;
	padding-bottom: 0;
	background-color: var(--wp--preset--color--base);
}

.hb-section.hb-section--solutions > * {
	margin-block: 0;
}

.hb-solutions__title.hb-solutions__title {
	margin-bottom: 2.5rem;
	letter-spacing: -0.0625em;
	line-height: 0.875;
}

/* Tab bar: the shared component (components/tabs.css), 40px above the
 * panels. */
.hb-solutions__tabs .hb-tablist {
	margin-bottom: 2.5rem;
}

.hb-solution.hb-solution {
	display: grid;
	grid-template-columns: minmax(0, 603fr) minmax(0, 439fr);
	align-items: center;
	gap: 0 var(--wp--preset--spacing--70);
}

.hb-solution > .hb-tab-label {
	grid-column: 1 / -1;
	margin-bottom: var(--wp--preset--spacing--40);
}

.hb-solution.hb-solution > * {
	margin-block: 0;
}

.hb-solution__media.hb-solution__media {
	aspect-ratio: 603 / 473;
	overflow: hidden;
	border-radius: var(--wp--custom--radius--md);
}

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

.hb-solution__body.hb-solution__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--70);
}

.hb-solution__body.hb-solution__body > * {
	margin-block: 0;
}

.hb-solution__body > .hb-solution__title + .hb-solution__text {
	margin-top: calc(var(--wp--preset--spacing--20) - var(--wp--preset--spacing--70));
}

.hb-solution__title.hb-solution__title {
	font-weight: 600;
	letter-spacing: -0.033em;
	line-height: 1;
}

.hb-solution__text {
	letter-spacing: -0.04em;
	line-height: 1.3;
}

/* Icon list: one Remix icon per point, in order. */
.hb-iconlist.hb-iconlist {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.25;
}

.hb-iconlist li {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
	min-height: 2rem;
}

.hb-iconlist li::before {
	content: "";
	flex: none;
	width: 1.5rem;
	height: 1.5rem;
	background-color: currentColor;
	-webkit-mask: var(--hb-icon, url("../../icons/check-line.svg")) center / contain no-repeat;
	mask: var(--hb-icon, url("../../icons/check-line.svg")) center / contain no-repeat;
}

.hb-solution--conferences li:nth-child(1) { --hb-icon: url("../../icons/dashboard-line.svg"); }
.hb-solution--conferences li:nth-child(2) { --hb-icon: url("../../icons/speak-line.svg"); }
.hb-solution--conferences li:nth-child(3) { --hb-icon: url("../../icons/ticket-line.svg"); }
.hb-solution--clubs li:nth-child(1) { --hb-icon: url("../../icons/repeat-line.svg"); }
.hb-solution--clubs li:nth-child(2) { --hb-icon: url("../../icons/user-add-line.svg"); }
.hb-solution--clubs li:nth-child(3) { --hb-icon: url("../../icons/mail-line.svg"); }
.hb-solution--tourism li:nth-child(1) { --hb-icon: url("../../icons/map-pin-line.svg"); }
.hb-solution--tourism li:nth-child(2) { --hb-icon: url("../../icons/download-2-line.svg"); }
.hb-solution--tourism li:nth-child(3) { --hb-icon: url("../../icons/search-line.svg"); }
.hb-solution--theatres li:nth-child(1) { --hb-icon: url("../../icons/calendar-line.svg"); }
.hb-solution--theatres li:nth-child(2) { --hb-icon: url("../../icons/repeat-line.svg"); }
.hb-solution--theatres li:nth-child(3) { --hb-icon: url("../../icons/group-line.svg"); }
.hb-solution--coaches li:nth-child(1) { --hb-icon: url("../../icons/time-line.svg"); }
.hb-solution--coaches li:nth-child(2) { --hb-icon: url("../../icons/calendar-check-line.svg"); }
.hb-solution--coaches li:nth-child(3) { --hb-icon: url("../../icons/bank-card-line.svg"); }

@media (max-width: 1199.98px) {
	.hb-solutions__tabs.hb-tabs--enhanced {
		display: block;
	}

	/* The white bar becomes a horizontal scroller (Figma mobile 10553:90646). */
	.hb-solutions__tabs .hb-tablist {
		flex-wrap: nowrap;
		margin-bottom: var(--wp--preset--spacing--60);
		overflow-x: auto;
		scrollbar-width: none;
	}

	.hb-solutions__tabs .hb-tablist::-webkit-scrollbar {
		display: none;
	}

	.hb-solutions__tabs .hb-tab {
		flex: none;
	}
}

@media (max-width: 1023.98px) {
	.hb-solution.hb-solution {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wp--preset--spacing--60);
	}

	.hb-solution__media.hb-solution__media {
		max-width: 37.6875rem;
	}
}

@media (max-width: 781.98px) {
	.hb-section.hb-section--solutions {
		padding-top: var(--wp--preset--spacing--80);
	}

	/* Figma 10553:90646: title 48/48, solution title 24/24. */
	.hb-solutions__title.hb-solutions__title {
		line-height: 1;
	}

	.hb-solution__title.hb-solution__title {
		font-size: var(--wp--preset--font-size--x-large) !important;
	}

	.hb-solution__body.hb-solution__body {
		gap: var(--wp--preset--spacing--60);
	}

	.hb-solution__text.hb-solution__text {
		font-size: var(--wp--preset--font-size--medium);
		line-height: 1.25;
	}

	.hb-solutions__tabs .hb-tab {
		height: 2rem;
		padding: 0.25rem 0.5rem;
		font-size: var(--wp--preset--font-size--small);
		line-height: 1.7143;
	}

	.hb-solution__body .wp-block-buttons,
	.hb-solution__body .wp-block-button,
	.hb-solution__body .wp-block-button__link {
		width: 100%;
	}
}
