/* ==========================================================================
   Celia Noire — About the Studio
   Portrait bleeds to the section edge beside a short manifesto — asymmetric,
   not centred, not boxed.
   ========================================================================== */

.cn-about {
	--cn-focal-d: center center;

	padding-block: 0;
}

.cn-about__grid {
	display: grid;
	grid-template-columns: minmax(280px, 46%) 1fr;
	align-items: center;
	min-height: clamp(28rem, 60vw, 40rem);
}

.cn-about__media {
	position: relative;
	align-self: stretch;
	overflow: hidden;
}

.cn-about__image,
.cn-about__video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: var(--cn-focal-d);
}

.cn-about__copy {
	padding-block: clamp(3rem, 8vw, var(--cn-section-y));
	padding-inline: clamp(2rem, 6vw, 5rem) var(--cn-gutter);
}

.cn-about__copy-inner {
	max-width: 34rem;
}

.cn-about__copy-inner .cn-section-head {
	margin-bottom: 0;
	max-width: none;
}

.cn-about__copy-inner--solo {
	max-width: 40rem;
	padding-block: var(--cn-section-y);
	margin-inline: auto;
}

@media (max-width: 899px) {
	.cn-about__grid {
		grid-template-columns: 1fr;
		min-height: 0;
	}

	.cn-about__media {
		aspect-ratio: 4 / 3;
	}

	.cn-about__copy {
		padding-inline: var(--cn-gutter);
	}
}