/* ===== cta-section ===== */
.cta-section { padding: 80px 0; background: linear-gradient(87deg, rgba(66, 107, 213, 0.20) 0.8%, rgba(102, 102, 102, 0.00) 52.49%, rgba(66, 107, 213, 0.20) 98.94%), #0F172B; }
.cta-section .cta-inner { display: flex; flex-direction: column; align-items: center; text-align: center; }

/* text */
.cta-section .cta-inner .cta-title { font-size: 4rem; font-weight: 700; color: #fff; margin-bottom: 20px; word-break: keep-all; }
.cta-section .cta-inner .cta-title strong { color: #5b9fff; font-weight: 700; }
.cta-section .cta-inner .cta-desc { font-size: 2rem; color: rgba(255, 255, 255, 0.6); line-height: 1.7; word-break: keep-all; margin-bottom: 48px; }

/* buttons */
.cta-section .cta-inner .cta-btns { display: flex; align-items: center; gap: 16px; }
.cta-section .cta-inner .cta-btns .btn-cta { display: inline-flex; align-items: center; gap: 10px; padding: 16px 32px; border-radius: 50px; font-size: 1.7rem; font-weight: 600; transition: opacity 0.2s; }
.cta-section .cta-inner .cta-btns .btn-cta:hover { opacity: 0.85; }
.cta-section .cta-inner .cta-btns .btn-cta img { width: 20px; height: 20px; flex-shrink: 0; }
.cta-section .cta-inner .cta-btns .btn-cta svg { flex-shrink: 0; }
.cta-section .cta-inner .cta-btns .btn-cta-primary { background: var(--theme); color: #fff; }
.cta-section .cta-inner .cta-btns .btn-cta-secondary { background: rgba(255, 255, 255, 0.12); color: #fff; border: 1px solid rgba(255, 255, 255, 0.3); }

/* ===== responsive ===== */
@media (max-width: 1280px) {
	.cta-section { padding: 80px 0; }
	.cta-section .cta-inner .cta-title { font-size: 3.4rem; }
	.cta-section .cta-inner .cta-desc { font-size: 1.6rem; margin-bottom: 40px; }
}

@media (max-width: 768px) {
	.cta-section { padding: 60px 0; }
	.cta-section .cta-inner .cta-title { font-size: 2.8rem; margin-bottom: 16px; }
	.cta-section .cta-inner .cta-desc { font-size: 1.5rem; margin-bottom: 32px; }
	.cta-section .cta-inner .cta-btns { flex-direction: column; width: 100%; max-width: 320px; }
	.cta-section .cta-inner .cta-btns .btn-cta { width: 100%; justify-content: center; }
}

@media (max-width: 480px) {
	.cta-section { padding: 48px 0; }
	.cta-section .cta-inner .cta-title { font-size: 2rem; }
	.cta-section .cta-inner .cta-desc { font-size: 1.4rem; }
	.cta-section .cta-inner .cta-btns .btn-cta { font-size: 1.4rem; padding: 14px 24px; }
}
