/* Homepage 2026 marketplace styles, including responsive variants. */

.ol-home-2026__intro:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	gap: 40px;
	align-items: center;
	padding: 96px 0 0;
	overflow: hidden;
	background: var(--openlane-onward-blue);
	color: var(--openlane-core-white);
}

.ol-home-2026__intro-heading:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	width: min(780px, calc(100% - 8px));
	text-align: center;
}

.ol-home-2026__intro h2:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	margin: 0;
	color: var(--openlane-core-white);
	font:
		600 56px/1.1 Poppins,
		sans-serif;
	letter-spacing: -0.56px;
}

.ol-home-2026__intro h2 span:where(.homepage-2026-marketplace, .homepage-2026-marketplace *),
.ol-home-2026__intro-bottom-inner > p span:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	display: block;
}

.ol-home-2026__intro-heading p:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	margin: 20px 0 0;
	color: var(--openlane-core-white);
	font:
		500 24px/1.5 Poppins,
		sans-serif;
}

.ol-home-2026__marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	position: relative;
	z-index: 0;
	flex: none;
	width: min(1320px, calc(100% - 8px));
	aspect-ratio: 2560 / 868;
	pointer-events: none;
}

.ol-home-2026__marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *)::before {
	content: "";
	position: absolute;
	z-index: -1;
	left: 50%;
	top: 50%;
	width: min(1037px, 90%);
	height: 629px;
	transform: translateX(-50%);
	border-radius: 50%;
	background: var(--openlane-blue);
	filter: blur(100px);
	opacity: 0;
	transition: opacity 5s;
}

.ol-home-2026__marketplace.is-in-view:where(.homepage-2026-marketplace, .homepage-2026-marketplace *)::before {
	opacity: 1;
}

.ol-home-2026__marketplace img:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	position: absolute;
	display: block;
	inset: 0 auto auto 0;
	width: 100%;
	height: auto;
	max-width: none;
}

.ol-home-2026-motion-ready .ol-home-2026__marketplace-foreground:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	opacity: 0;
	transform: translate3d(0, 100px, 0);
	transition:
		opacity 0.4s ease 0.2s,
		transform 0.4s ease 0.2s;
}

.ol-home-2026-motion-ready
.ol-home-2026__marketplace.is-revealed
.ol-home-2026__marketplace-foreground:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.ol-home-2026__intro-bottom:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	position: relative;
	z-index: 2;
	margin-top: -80px;
	background: var(--openlane-onward-blue);
	width: 100%;
	padding: 40px 0 96px;
}

.ol-home-2026__intro-bottom-inner:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	box-sizing: border-box;
	display: grid;
	align-items: center;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 40px;
	width: min(1320px, 100%);
	margin: 0 auto;
	padding: 0 20px;
}

.ol-home-2026__intro-bottom-inner > p:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	max-width: 620px;
	margin: 0;
	color: var(--openlane-core-white);
	font:
		400 20px/1.75 Poppins,
		sans-serif;
}

.ol-home-2026__intro-links:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	display: grid;
	gap: 20px;
}

.ol-home-2026__intro-links a:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	min-height: 4.6875rem;
	gap: 1rem;
	letter-spacing: -0.2px;
	padding: 8px 8px 8px 32px;
	border-radius: 8px;
	background: var(--openlane-core-white);
	color: var(--openlane-onward-blue);
	font:
		600 20px/1.5 Poppins,
		sans-serif;
	text-decoration: none;
}

.ol-home-2026__intro-links a:hover:where(.homepage-2026-marketplace, .homepage-2026-marketplace *),
.ol-home-2026__intro-links a:focus-visible:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	background: var(--openlane-blue-50);
	text-decoration: none;
}

.ol-home-2026__intro-links a > span:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
	display: grid;
	place-items: center;
	flex: 0 0 59px;
	height: 59px;
	border-radius: 8px;
	background: var(--openlane-blue);
}

@media (max-width: 800px) {
.ol-home-2026__intro:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		padding: 64px 0 0;
		gap: 32px;
	}

.ol-home-2026__intro h2:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		font-size: 36px;
	}

.ol-home-2026__intro-heading p:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		font-size: 18px;
	}

.ol-home-2026__marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		width: 100%;
		aspect-ratio: 2560 / 1085;
	}

.ol-home-2026__marketplace img:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		width: 125%;
		left: -12.5%;
	}

.ol-home-2026__marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *)::before {
		width: 518px;
		height: 615px;
		top: 75%;
	}

.ol-home-2026__intro-bottom:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		margin-top: -32px;
		padding: 16px 0 64px;
	}

.ol-home-2026__intro-bottom-inner:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 40px;
		padding: 0 16px;
	}

.ol-home-2026__intro-bottom-inner > p:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		font-size: 18px;
		line-height: 1.75;
	}

.ol-home-2026__intro-links:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		gap: 16px;
	}

.ol-home-2026__intro-links a:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		font-size: 18px;
		padding-left: 24px;
	}
}

@media (prefers-reduced-motion: reduce) {
.ol-home-2026-motion-ready .ol-home-2026__marketplace-foreground:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		opacity: 1;
		transform: none;
		transition: none;
	}

.ol-home-2026__marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *)::before {
		opacity: 1;
		transition: none;
	}
}

@media (max-width: 1100px) {
.ol-home-2026
	> .ol-home-2026__intro:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		padding-inline: var(--page-gutter);
		box-sizing: border-box;
	}

.ol-home-2026 .ol-home-2026__intro-heading:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		width: min(780px, 100%);
	}

.ol-home-2026 .ol-home-2026__intro-bottom-inner:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		padding-inline: 0;
	}
}

@media (max-width: 800px) {
.ol-home-2026 .ol-home-2026__marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		width: 100%;
	}
}

@media (min-width: 601px) and (max-width: 800px) {
.ol-home-2026__intro-links:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
	}

.ol-home-2026__intro-links a:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		min-width: 0;
		gap: 4px;
		padding: 6px 6px 6px 20px;
		white-space: normal;
	}

.ol-home-2026__intro-links a > span:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		flex-basis: 63px;
		height: 63px;
	}
}

@media (min-width: 601px) and (max-width: 700px) {
.ol-home-2026__intro-links a:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		padding-left: 16px;
		font-size: var(--Font-Label);
	}

.ol-home-2026__intro-links a > span:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		flex-basis: 48px;
		height: 48px;
	}
}

@media (max-width: 1100px) {
.ol-home-2026 > .ol-home-2026__intro:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		padding-inline: 0;
	}

.ol-home-2026 .ol-home-2026__intro-heading:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		width: min(780px, calc(100% - 2 * var(--page-gutter) + 1.5rem));
	}

.ol-home-2026 .ol-home-2026__intro-bottom:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		box-sizing: border-box;
		padding-inline: var(--page-gutter);
	}
}

@media (max-width: 800px) {
.ol-home-2026 .ol-home-2026__marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		width: calc(100% - 2 * var(--page-gutter) + 1.5rem);
	}
}

@media (max-width: 600px) {
.ol-home-2026 .ol-home-2026__marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
		width: calc(100% - 8px);
	}
}

/* Homepage presentation, scoped to this block. */

#main.ol-home-2026 h2:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  font: var(--openlane-web-h2);
  letter-spacing: var(--openlane-web-h2-letter-spacing);
}

#main.ol-home-2026 :is(.ol-home-2026__intro-heading > p, .ol-services__heading > p,
  .ol-home-2026__information-intro, .ol-services__feature > p):where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  font: var(--openlane-web-body-xl);
  letter-spacing: var(--openlane-web-body-xl-letter-spacing);
}

#main.ol-home-2026 .ol-home-2026__intro-bottom-inner > p:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  font: var(--openlane-web-body-lg);
  letter-spacing: var(--openlane-web-body-lg-letter-spacing);
}

#main.ol-home-2026 > .ol-home-2026__intro:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  padding-top: var(--margin-xl);
  gap: var(--gaps-xl);
}

#main.ol-home-2026 .ol-home-2026__intro-bottom:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  padding-bottom: var(--margin-xl);
  padding-inline: var(--page-gutter);
}

#main.ol-home-2026 :is(.ol-wholesale__inner, .ol-services__inner,
  .ol-comparison__inner, .ol2026-testimonials__inner, .ol2026-faq__inner,
  .ol-home-2026__intro-bottom-inner, .ol-home-2026-signup__inner,
  .ol-home-2026__information .desktop-content-wrapper > .wrapper):where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--layout-container);
  margin-inline: auto;
  padding-inline: 0;
}

#main.ol-home-2026 :is(.ol-home-2026__intro-heading, .ol-services__heading,
  .ol-comparison__heading):where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  width: 100%;
  max-width: var(--layout-section-header);
  margin-inline: auto;
}

#main.ol-home-2026 .ol-home-2026__intro-heading:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  width: calc(100% - 2 * var(--page-gutter) + 1.5rem);
}

#main.ol-home-2026 :is(.ol-home-2026__intro-heading > p, .ol-services__heading > p):where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  margin-top: var(--gaps-md);
}

#main.ol-home-2026 :is(.ol-wholesale__row, .ol-home-2026__intro-bottom-inner,
  .ol-home-2026__information .desktop-content-wrapper > .wrapper):where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  gap: var(--gaps-xl);
}

.homepage-2026-marketplace:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) { --Font-H2: var(--typography-h2); }

.homepage-2026-marketplace > .container:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: inherit;
  width: 100%;
  max-width: none;
}

.homepage-2026-marketplace .ol-home-2026__intro-bottom:where(.homepage-2026-marketplace, .homepage-2026-marketplace *) {
  width: calc(100% + 1.5rem);
}