/* HQ CTA Strip — Styles */

.hq-cta-strip {
	width:      100%;
	box-sizing: border-box;
	display:    flex;
	gap:        32px;
	align-items:center;
	flex-wrap:  wrap;
}

/* ── Layout: split (text left, buttons right) */
.hq-cta-layout-split {
	justify-content: space-between;
}
.hq-cta-layout-split .hq-cta-text    { flex: 1 1 auto; min-width: 200px; }
.hq-cta-layout-split .hq-cta-buttons { flex: 0 0 auto; }

/* ── Layout: centered (text + buttons centered) */
.hq-cta-layout-centered {
	flex-direction: column;
	text-align:     center;
}
.hq-cta-layout-centered .hq-cta-buttons {
	justify-content: center;
}

/* ── Text */
.hq-cta-title {
	margin:      0 0 0.3em;
	font-size:   clamp(1.3em, 3vw, 1.75em);
	font-weight: 800;
	line-height: 1.2;
}

.hq-cta-subtitle {
	margin:   0;
	opacity:  0.88;
	font-size: 1em;
	line-height: 1.5;
}

/* ── Buttons */
.hq-cta-buttons {
	display:     flex;
	gap:         14px;
	flex-wrap:   wrap;
	align-items: center;
}

.hq-cta-btn {
	display:         inline-block;
	padding:         13px 28px;
	border-radius:   6px;
	font-weight:     700;
	font-size:       0.95em;
	text-decoration: none;
	white-space:     nowrap;
	transition:      opacity 0.2s ease, transform 0.2s ease;
	line-height:     1;
}

.hq-cta-btn:hover { opacity: 0.88; transform: translateY(-2px); text-decoration: none; }
.hq-cta-btn:focus,
.hq-cta-btn:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }

/* Editor helpers */
.hq-color-row  { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.hq-color-label { flex:1; font-size:12px; font-weight:500; }
.hq-color-row input[type="color"] { width:40px; height:32px; padding:2px; border:1px solid #ccc; border-radius:4px; cursor:pointer; background:none; }

@media (max-width: 640px) {
	.hq-cta-layout-split { flex-direction: column; text-align: center; }
	.hq-cta-layout-split .hq-cta-buttons { justify-content: center; }
	.hq-cta-btn { display: block; text-align: center; }
}