/* AI Article Forge — call-to-action button
   Colour is carried by a --aiaf-* custom property set on the wrapper, so every
   style variant reads from the same palette. */

.aiaf-cta {
	margin: 34px 0;
	text-align: center;
	clear: both;
}

.aiaf-cta--c1 { --aiaf-a: #1d4ed8; --aiaf-b: #3b82f6; --aiaf-ink: #ffffff; }
.aiaf-cta--c2 { --aiaf-a: #047857; --aiaf-b: #10b981; --aiaf-ink: #ffffff; }
.aiaf-cta--c3 { --aiaf-a: #b45309; --aiaf-b: #f59e0b; --aiaf-ink: #1f1300; }
.aiaf-cta--c4 { --aiaf-a: #9f1239; --aiaf-b: #f43f5e; --aiaf-ink: #ffffff; }
.aiaf-cta--c5 { --aiaf-a: #6d28d9; --aiaf-b: #a855f7; --aiaf-ink: #ffffff; }
.aiaf-cta--c6 { --aiaf-a: #0f766e; --aiaf-b: #14b8a6; --aiaf-ink: #ffffff; }
.aiaf-cta--c7 { --aiaf-a: #0c4a6e; --aiaf-b: #0ea5e9; --aiaf-ink: #ffffff; }
.aiaf-cta--c8 { --aiaf-a: #7c2d12; --aiaf-b: #ea580c; --aiaf-ink: #ffffff; }

/* Shared -------------------------------------------------------------- */

.aiaf-cta-btn {
	display: inline-block;
	box-sizing: border-box;
	max-width: 100%;
	padding: 16px 40px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: .01em;
	text-align: center;
	text-decoration: none !important;
	cursor: pointer;
	transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
}

.aiaf-cta-btn:hover,
.aiaf-cta-btn:focus {
	text-decoration: none !important;
	transform: translateY( -2px );
}

.aiaf-cta-btn:active {
	transform: translateY( 0 );
}

.aiaf-cta-note {
	margin: 10px 0 0;
	font-size: 13px;
	opacity: .7;
}

/* Variants ------------------------------------------------------------ */

.aiaf-cta-btn--solid {
	background: var( --aiaf-a );
	color: var( --aiaf-ink );
	border: 0;
	border-radius: 8px;
	box-shadow: 0 4px 14px rgba( 0, 0, 0, .18 );
}

.aiaf-cta-btn--solid:hover {
	background: var( --aiaf-b );
	color: var( --aiaf-ink );
	box-shadow: 0 8px 22px rgba( 0, 0, 0, .24 );
}

.aiaf-cta-btn--gradient {
	background: linear-gradient( 135deg, var( --aiaf-a ) 0%, var( --aiaf-b ) 100% );
	color: var( --aiaf-ink );
	border: 0;
	border-radius: 10px;
	box-shadow: 0 6px 18px rgba( 0, 0, 0, .22 );
}

.aiaf-cta-btn--gradient:hover {
	background: linear-gradient( 135deg, var( --aiaf-b ) 0%, var( --aiaf-a ) 100% );
	color: var( --aiaf-ink );
}

.aiaf-cta-btn--outline {
	background: transparent;
	color: var( --aiaf-a );
	border: 3px solid var( --aiaf-a );
	border-radius: 8px;
}

.aiaf-cta-btn--outline:hover {
	background: var( --aiaf-a );
	color: #fff;
}

.aiaf-cta-btn--pill {
	background: var( --aiaf-a );
	color: var( --aiaf-ink );
	border: 0;
	border-radius: 999px;
	padding: 17px 48px;
	box-shadow: 0 10px 24px -6px var( --aiaf-b );
}

.aiaf-cta-btn--pill:hover {
	background: var( --aiaf-b );
	color: var( --aiaf-ink );
}

.aiaf-cta-btn--block {
	display: block;
	width: 100%;
	background: linear-gradient( 90deg, var( --aiaf-a ) 0%, var( --aiaf-b ) 100% );
	color: var( --aiaf-ink );
	border: 0;
	border-radius: 6px;
	padding: 20px 28px;
	font-size: 18px;
}

.aiaf-cta-btn--block:hover {
	color: var( --aiaf-ink );
	filter: brightness( 1.08 );
}

.aiaf-cta-btn--raised {
	background: var( --aiaf-b );
	color: var( --aiaf-ink );
	border: 3px solid var( --aiaf-a );
	border-radius: 6px;
	box-shadow: 6px 6px 0 var( --aiaf-a );
}

.aiaf-cta-btn--raised:hover {
	color: var( --aiaf-ink );
	box-shadow: 3px 3px 0 var( --aiaf-a );
	transform: translate( 3px, 3px );
}

/* Small screens ------------------------------------------------------- */

@media screen and ( max-width: 600px ) {
	.aiaf-cta-btn {
		display: block;
		width: 100%;
		padding: 16px 20px;
		font-size: 16px;
	}
}