/*
 * About — page-specific override layer over the inline desktop spec (desktop
 * ≥1280 is the binding inline design, untouched). Ported verbatim from
 * About.dc.html: the .ab-link inline-arrow links + style-hover classes + the
 * .rsp-* responsive layer (1279/1023/767). Globals come from tokens.css/site.css.
 */

.ab-link {
	color: #6D5DF3;
	font-weight: 700;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	transition: gap .2s ease, color .2s ease;
}
.ab-link:hover { gap: 11px; color: #5547d6; }
.ab-link-light { color: #9385FF; }
.ab-link-light:hover { color: #fff; }

.ab-ghost:hover { border-color: #9385FF; color: #9385FF; }
.ab-summit:hover { color: #fff; }

@media (max-width: 1279px) {
	.rsp-hero { padding-left: 32px !important; padding-right: 32px !important; }
	.rsp-sec { padding-left: 32px !important; padding-right: 32px !important; }
}
@media (max-width: 1023px) {
	.rsp-hero { padding-left: 24px !important; padding-right: 24px !important; }
	.rsp-sec { padding-left: 24px !important; padding-right: 24px !important; }
	.rsp-split { grid-template-columns: 1fr !important; }
	.rsp-visual { order: 2; }
	.rsp-tiles4 { grid-template-columns: repeat(2, 1fr) !important; }
	.rsp-tiles3 { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 767px) {
	[data-mascot][style*="absolute"] { display: none !important; }
	.rsp-hero { padding-left: 16px !important; padding-right: 16px !important; padding-top: 124px !important; padding-bottom: 52px !important; }
	.rsp-sec { padding-left: 16px !important; padding-right: 16px !important; padding-top: 56px !important; padding-bottom: 56px !important; }
	.rsp-tiles4 { grid-template-columns: 1fr !important; }
	.rsp-tiles3 { grid-template-columns: repeat(2, 1fr) !important; }
	.ab-q { font-size: 27px !important; }
}