.damos-vision {
	--damos-vision-bg: #dcf4ec;
	--damos-vision-circle: #ffffff;

	overflow: hidden;
	padding: clamp(72px, 6.8vw, 108px) 0;
	background:
		radial-gradient(circle at 10% 50%, rgba(255, 255, 255, 0.34), transparent 28%),
		var(--damos-vision-bg);
	color: var(--damos-navy);
}

.damos-vision__container {
	display: grid;
	grid-template-columns: minmax(300px, 430px) minmax(0, 1fr);
	align-items: center;
	gap: clamp(58px, 7vw, 118px);
}

.damos-vision__visual {
	display: flex;
	align-items: center;
	justify-content: center;
}

.damos-vision__circle {
	display: grid;
	place-items: center;
	width: min(100%, 420px);
	aspect-ratio: 1;
	padding: clamp(50px, 5vw, 84px);
	border-radius: 50%;
	background: var(--damos-vision-circle);
	box-shadow: 0 20px 45px rgba(21, 27, 75, 0.045);
}

.damos-vision__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.damos-vision__content {
	max-width: 930px;
}

.damos-vision__eyebrow {
	display: flex;
	align-items: center;
	gap: 11px;
	margin: 0 0 clamp(28px, 2.6vw, 40px);
	color: rgba(21, 27, 75, 0.62);
	font-size: clamp(13px, 0.95vw, 16px);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.01em;
	text-transform: uppercase;
}

.damos-vision__eyebrow span {
	display: block;
	flex: 0 0 auto;
	width: clamp(38px, 3.2vw, 56px);
	height: 3px;
	border-radius: 999px;
	background: var(--damos-turquoise);
}

.damos-vision__title {
	margin: 0;
	color: var(--damos-navy);
	font-size: clamp(42px, 4.1vw, 66px);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -0.05em;
	text-wrap: balance;
}

.damos-vision__quote {
	display: inline;
	color: var(--damos-navy);
}

.damos-vision__text {
	max-width: 900px;
	margin: clamp(28px, 2.8vw, 42px) 0 0;
	color: rgba(21, 27, 75, 0.86);
	font-size: clamp(19px, 1.65vw, 27px);
	font-weight: 400;
	line-height: 1.28;
	letter-spacing: -0.025em;
}

/* Apparition au défilement */
.damos-vision__visual,
.damos-vision__content {
	opacity: 0;
	transform: translateY(26px);
	transition:
		opacity 680ms ease,
		transform 680ms cubic-bezier(0.22, 1, 0.36, 1);
}

.damos-vision__content {
	transition-delay: 100ms;
}

.damos-vision.is-visible .damos-vision__visual,
.damos-vision.is-visible .damos-vision__content {
	opacity: 1;
	transform: translateY(0);
}

@media (max-width: 1020px) {
	.damos-vision__container {
		grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
		gap: 54px;
	}

	.damos-vision__title {
		font-size: clamp(40px, 5.7vw, 58px);
	}

	.damos-vision__text {
		font-size: clamp(18px, 2.2vw, 23px);
	}
}

@media (max-width: 780px) {
	.damos-vision {
		padding-block: 72px 82px;
	}

	.damos-vision__container {
		grid-template-columns: 1fr;
		gap: 46px;
	}

	.damos-vision__circle {
		width: min(76vw, 360px);
		padding: 58px;
	}

	.damos-vision__content {
		max-width: none;
	}

	.damos-vision__title {
		font-size: clamp(39px, 10vw, 54px);
	}

	.damos-vision__text {
		font-size: 18px;
		line-height: 1.32;
	}
}

@media (max-width: 520px) {
	.damos-vision__circle {
		width: min(82vw, 320px);
		padding: 48px;
	}

	.damos-vision__title {
		font-size: clamp(36px, 11vw, 48px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.damos-vision__visual,
	.damos-vision__content {
		opacity: 1;
		transform: none;
		transition: none;
	}
}
