.page-template-page-about .sflow-about-page {
	background: var(--sflow-white);
}

.sflow-about-story__grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(24rem, 1.1fr);
	gap: clamp(3rem, 8vw, 8rem);
	align-items: center;
}

.sflow-about-story__grid--single {
	grid-template-columns: minmax(0, 52rem);
	justify-content: center;
	text-align: center;
}

.sflow-about-story__grid--single .sflow-prose {
	margin-inline: auto;
}

.sflow-about-story__content h2 {
	max-width: 90%;
}

.sflow-about-story__grid--single h2 {
	margin-inline: auto;
}

.sflow-about-story__content .sflow-button {
	margin-top: var(--sflow-space-4);
}

.sflow-about-story__media {
	position: relative;
	margin: 0;
	padding: 0 0 var(--sflow-space-4) var(--sflow-space-4);
}

.sflow-about-story__media::before {
	position: absolute;
	inset: var(--sflow-space-4) var(--sflow-space-4) 0 0;
	z-index: -1;
	border: 1px solid var(--sflow-accent);
	border-radius: var(--sflow-radius-card);
	content: "";
}

.sflow-about-story__media img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: var(--sflow-radius-card);
}

.sflow-about-values {
	position: relative;
	background: var(--sflow-dark);
	overflow: hidden;
}

.sflow-about-values::before {
	position: absolute;
	top: -12rem;
	right: -10rem;
	width: 32rem;
	height: 32rem;
	border: 1px solid rgb(var(--sflow-accent-rgb) / 0.3);
	border-radius: 50%;
	box-shadow: 0 0 0 5rem rgb(var(--sflow-primary-rgb) / 0.035), 0 0 0 10rem rgb(var(--sflow-primary-rgb) / 0.025);
	content: "";
}

.sflow-about-values .sflow-section-heading {
	position: relative;
}

.sflow-about-values h2,
.sflow-about-values h3 {
	color: var(--sflow-white);
}

.sflow-about-values .sflow-section-heading p,
.sflow-about-value p {
	color: rgba(255, 255, 255, 0.68);
}

.sflow-about-values__grid {
	position: relative;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 1px;
	border-top: 1px solid rgb(var(--sflow-accent-rgb) / 0.58);
	background: var(--sflow-border-dark);
}

.sflow-about-value {
	min-height: 18rem;
	padding: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 2.5rem);
	background: var(--sflow-dark);
}

.sflow-about-value__number {
	display: block;
	margin-bottom: clamp(3rem, 6vw, 5rem);
	color: var(--sflow-accent);
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.14em;
}

.sflow-about-value h3 {
	font-size: clamp(1.75rem, 2.5vw, 2.35rem);
}

@media (max-width: 64rem) {
	.sflow-about-values__grid { grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
}

@media (max-width: 48rem) {
	.sflow-about-story__grid { grid-template-columns: 1fr; }
	.sflow-about-story__media { order: -1; padding: 0 0 var(--sflow-space-3) var(--sflow-space-3); }
	.sflow-about-story__media::before { inset: var(--sflow-space-3) var(--sflow-space-3) 0 0; }
	.sflow-about-story__media img { aspect-ratio: 4 / 3; }
	.sflow-about-values__grid { grid-template-columns: 1fr; }
	.sflow-about-value { min-height: 0; }
	.sflow-about-value__number { margin-bottom: var(--sflow-space-6); }
}

/* Section 3: Infinite Marquee Image Gallery (Copied layout settings from home.css) */
.sflow-facilities-section {
	overflow: hidden;
	border-top: 1px solid rgb(var(--sflow-accent-rgb) / 0.62);
}

.sflow-facilities-copy {
	margin-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.sflow-facilities-copy h2 {
	max-width: 54rem;
	line-height: 1.5;
}

.sflow-facilities-copy p {
	max-width: 62rem;
	color: var(--sflow-body);
}

.sflow-facilities-swiper {
	overflow: visible;
}

.sflow-facilities-swiper.swiper-initialized .swiper-wrapper {
	transition-timing-function: linear !important;
}

.sflow-facilities-swiper:not(.swiper-initialized) .swiper-wrapper {
	display: flex;
	gap: 1rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
}

.sflow-facilities-swiper:not(.swiper-initialized) .swiper-slide {
	flex: 0 0 min(38rem, 84vw);
	scroll-snap-align: start;
}

.sflow-facility-card {
	width: min(38rem, 78vw);
	margin: 0;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border: 1px solid var(--sflow-accent);
	border-radius: 1rem;
}

.sflow-facility-card img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
