/*
 * Company hub presentation.
 */

.gwo-company-hub-hero .gwo-solutions-hero__intro {
	max-inline-size: 60rem;
}

.gwo-company-hub-hero .gwo-solutions-hero__heading {
	max-inline-size: 23ch;
	margin-inline: auto;
}

.gwo-company-hub__directory {
	scroll-margin-block-start: calc(var(--gwo-solutions-header-offset) + var(--gwo-space-4));
}

.gwo-company-hub__grid {
	margin-inline: auto;
	max-inline-size: 72rem;
}

.gwo-company-hub-card {
	text-align: start;
}

.gwo-company-hub-card__icon {
	align-items: center;
	background-color: var(--gwo-black);
	block-size: var(--gwo-space-8);
	border-radius: 50%;
	color: var(--gwo-white);
	display: inline-flex;
	grid-column: 1;
	grid-row: 1;
	inline-size: var(--gwo-space-8);
	justify-content: center;
}

.gwo-company-hub-card__icon svg {
	block-size: var(--gwo-space-4);
	fill: none;
	inline-size: var(--gwo-space-4);
	stroke: currentcolor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
}

.gwo-company-hub-section__visual {
	align-items: end;
	display: flex;
	justify-content: center;
	min-block-size: clamp(24rem, 44vw, 34rem);
	overflow: hidden;
	padding: var(--gwo-space-8) var(--gwo-space-6) 0;
	position: relative;
}

.gwo-company-hub-section__visual::before {
	border: 1px solid rgb(68 158 55 / 22%);
	border-radius: 50%;
	content: "";
	inset: 12% 8%;
	position: absolute;
}

.gwo-company-hub-section__visual::after {
	background: color-mix(in srgb, var(--gwo-yellow) 28%, transparent);
	block-size: clamp(8rem, 20vw, 14rem);
	border-radius: 50%;
	content: "";
	filter: blur(2rem);
	inline-size: clamp(8rem, 20vw, 14rem);
	inset-block-end: 3%;
	inset-inline-end: 8%;
	position: absolute;
}

.gwo-company-hub-section__visual-inner {
	align-items: flex-end;
	display: flex;
	block-size: 100%;
	inline-size: 100%;
	justify-content: center;
	min-block-size: inherit;
	position: relative;
	z-index: 2;
}

.gwo-company-hub-section__image {
	block-size: auto;
	display: block;
	filter: drop-shadow(0 1.5rem 2rem rgb(35 31 32 / 16%));
	inline-size: min(96%, 36rem);
	margin-block-end: -1px;
	max-block-size: clamp(22rem, 42vw, 33rem);
	object-fit: contain;
	object-position: center bottom;
}

.gwo-company-hub-section .gwo-company-hub-section__detail {
	background: transparent;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	border-block-start: 0;
	border-inline-start: var(--gwo-space-1) solid var(--gwo-yellow);
	border-radius: 0;
	box-shadow: none;
	display: grid;
	gap: var(--gwo-space-1);
	grid-template-columns: minmax(0, 1fr);
	inline-size: 100%;
	margin-block-start: var(--gwo-space-2);
	max-inline-size: 58ch;
	overflow: visible;
	padding: var(--gwo-space-1) 0 var(--gwo-space-1) var(--gwo-space-4);
	text-align: start;
	text-wrap: pretty;
}

.gwo-company-hub-section .gwo-company-hub-section__detail span {
	color: var(--gwo-green);
	display: block;
	font-weight: var(--font-weight-semibold);
	margin: 0;
}

.gwo-company-hub-section .gwo-solution-section__action {
	gap: var(--gwo-space-2);
}

.gwo-company-hub-hero + .gwo-company-hub-section .gwo-solution-section__inner {
	padding-block: var(--gwo-space-20);
}

.gwo-company-hub-section:last-child .gwo-solution-section__inner {
	padding-block: var(--gwo-space-20);
}

.gwo-company-hub-main + .wp-block-template-part {
	margin-block-start: 0;
}

@media (max-width: 599px) {
	.gwo-company-hub-page .gwo-solutions-hero__action--explore {
		display: inline-flex;
		inline-size: 100%;
	}

	.gwo-company-hub-section__visual {
		min-block-size: 24rem;
		padding-inline: var(--gwo-space-3);
	}

	.gwo-company-hub-section__image {
		max-block-size: 23rem;
	}
}

@media (min-width: 600px) and (max-width: 1199px) {
	.gwo-company-hub__grid > :last-child:nth-child(odd) {
		grid-column: 1 / -1;
		inline-size: calc(50% - (var(--gwo-space-4) / 2));
		justify-self: center;
	}
}

@media (min-width: 900px) {
	.gwo-company-hub-section__visual {
		min-block-size: 0;
	}
}

@media (min-width: 1200px) {
	.gwo-company-hub__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
