/* Closing CTA: a curved horizon of light, like the edge of the globe. */
.cta {
	position: relative; overflow: hidden; isolation: isolate;
	padding: calc(var(--section-pad) * 1.3) 0 var(--section-pad); /* a little extra on top for the horizon */
	background: var(--ink); text-align: center;
}
/* Colombo at night behind everything; darkened at the top for the headline. */
.cta__media { position: absolute; inset: 0; z-index: -3; overflow: hidden; }
.cta__media img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 70%; }
.cta__media::after {
	content: ""; position: absolute; inset: 0;
	background:
		linear-gradient(180deg, var(--ink) 0%, rgba(5, 7, 14, .78) 30%, rgba(5, 7, 14, .45) 65%, rgba(5, 7, 14, .7) 100%),
		radial-gradient(70% 60% at 50% 40%, rgba(5, 7, 14, .55), transparent 70%);
}
/* Horizon: a thin glowing arc (edge of the globe) — the city shows through beneath it. */
.cta__horizon {
	position: absolute; z-index: -1; left: 50%; top: 62%;
	width: max(1400px, 140vw); aspect-ratio: 1; border-radius: 50%;
	transform: translateX(-50%);
	background: radial-gradient(closest-side, rgba(5, 7, 14, .35) 96%, transparent 100%);
	box-shadow: 0 -1px 0 rgba(141, 176, 255, .45), 0 -30px 80px -10px rgba(59, 123, 255, .3), 0 -120px 160px -40px rgba(59, 123, 255, .14);
}
.cta__horizon::after { /* dotted surface hint */
	content: ""; position: absolute; inset: 0; border-radius: 50%;
	background-image: radial-gradient(rgba(141, 176, 255, .22) 1px, transparent 1.4px);
	background-size: 16px 16px;
	-webkit-mask-image: linear-gradient(180deg, #000, transparent 18%); mask-image: linear-gradient(180deg, #000, transparent 18%);
}
.cta__title { display: grid; font-size: clamp(2.3rem, 1.2rem + 3.6vw, 4.4rem); font-weight: 600; line-height: 1.02; letter-spacing: -.045em; }
.cta__soft { color: var(--paper-faint); font-weight: 400; }
.cta__actions { margin-top: 36px; display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
.cta__actions .icon { width: 18px; height: 18px; color: var(--cyan); }
@media (max-width: 479px) {
	.cta__actions .btn { flex: 1 1 100%; }
}
