/* v2.27.18 strategic THE NINE conversion surfaces. */

.ags-nine-contextual-cta {
	position: relative;
	margin: clamp(46px, 7vw, 76px) 0;
	padding: clamp(28px, 5vw, 48px);
	border: 1px solid rgba(201,169,98,.28);
	background:
		radial-gradient(circle at 88% 18%, rgba(237,201,109,.09), transparent 34%),
		linear-gradient(145deg, #101925, #090d14);
	box-shadow: 0 24px 58px rgba(0,0,0,.18);
	color: var(--ags-cream);
}

.ags-nine-contextual-cta::after {
	content: "IX";
	position: absolute;
	right: clamp(22px, 4vw, 44px);
	top: clamp(18px, 3vw, 34px);
	color: rgba(237,201,109,.1);
	font-family: var(--ags-serif);
	font-size: clamp(4rem, 9vw, 7rem);
	line-height: 1;
	pointer-events: none;
}

.ags-nine-contextual-cta__copy { position: relative; z-index: 1; max-width: 790px; }
.ags-nine-contextual-cta .section-kicker { color: var(--ags-gold-strong); }
.ags-nine-contextual-cta h2 {
	max-width: 690px;
	margin: .45rem 0 1rem;
	color: var(--ags-cream);
	font-family: var(--ags-serif);
	font-size: clamp(1.9rem, 4vw, 3rem);
	line-height: 1.08;
}
.ags-nine-contextual-cta__copy > p:not(.section-kicker) {
	max-width: 720px;
	margin: 0;
	color: rgba(242,232,207,.8);
	line-height: 1.75;
}
.ags-nine-contextual-cta__actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 1.65rem; }
.ags-nine-contextual-cta__actions .button { min-width: 190px; }

.ags-v2-nine .ags-v2-actions,
.ags-books-catalog__actions { display:flex; flex-wrap:wrap; gap:.85rem; align-items:center; }
.ags-books-catalog__actions { margin-top:16px; }
.ags-books-catalog__actions .button { margin-top:0; }

@media (max-width: 560px) {
	.ags-nine-contextual-cta { padding: 26px 22px; }
	.ags-nine-contextual-cta::after { font-size: 4.5rem; }
	.ags-nine-contextual-cta__actions,
	.ags-v2-nine .ags-v2-actions,
	.ags-books-catalog__actions { display:grid; grid-template-columns:1fr; width:100%; }
	.ags-nine-contextual-cta__actions .button,
	.ags-v2-nine .ags-v2-actions .button,
	.ags-books-catalog__actions .button { width:100%; }
}

/* v2.27.20: keep the About conversion path directly beneath the YouTube card.
 * v2.27.21: add deliberate rail spacing and stronger YouTube CTA breathing room. */
.about-section__rail {
	display: grid;
	gap: 1.5rem;
	align-content: start;
	min-width: 0;
}
.about-section__rail .youtube-card { position: static; }
.about-section__rail .youtube-card__body { padding-bottom: 1.75rem; }
.about-section__rail .youtube-card__cta { margin-top: .65rem; }
.about-section__nine-cta .ags-nine-contextual-cta {
	margin: 0;
	padding: 1.35rem;
	border-radius: 8px;
}
.about-section__nine-cta .ags-nine-contextual-cta::after {
	right: 1rem;
	top: .9rem;
	font-size: 3.7rem;
}
.about-section__nine-cta .ags-nine-contextual-cta h2 {
	max-width: 15ch;
	margin: .35rem 0 .7rem;
	font-size: clamp(1.35rem, 2vw, 1.7rem);
}
.about-section__nine-cta .ags-nine-contextual-cta__copy > p:not(.section-kicker) {
	font-size: .9rem;
	line-height: 1.6;
}
.about-section__nine-cta .ags-nine-contextual-cta__actions {
	display: grid;
	grid-template-columns: 1fr;
	gap: .65rem;
	margin-top: 1.1rem;
}
.about-section__nine-cta .ags-nine-contextual-cta__actions .button {
	width: 100%;
	min-width: 0;
	min-height: 46px;
	padding: .72rem .85rem;
	font-size: .86rem;
}

@media (max-width: 820px) {
	.about-section__rail {
		width: 100%;
		gap: 1.25rem;
	}
}
