/* WCWP Survey Promo 2026 */
.wcwp-sp, .wcwp-sp * { box-sizing: border-box; }
.wcwp-sp {
	--sp-navy: #1b2340; --sp-teal: #6aadb2; --sp-sage: #a4cfa7; --sp-cream: #f2f3d3;
	--sp-lime: #a9c84b; --sp-coral: #d86868;
	font-family: Montserrat, system-ui, sans-serif;
}

/* Hide the spooky ribbon while the survey runs (bar replaces it) */
html.wcwp-survey-on .wcwp-spooky-ribbon { display: none !important; }

/* ---------- A / J: top bar ---------- */
.wcwp-sp-bar {
	position: relative; z-index: 50;
	background: var(--sp-lime); color: var(--sp-navy);
	display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
	gap: 6px 14px; padding: 9px 44px; text-align: center;
	font-size: 14px; font-weight: 700; line-height: 1.3;
}
.wcwp-sp-bar a.wcwp-sp-bar__cta {
	background: var(--sp-navy); color: #fff !important; text-decoration: none !important;
	padding: 6px 14px; border-radius: 999px; font-weight: 800; font-size: 13px; white-space: nowrap;
}
.wcwp-sp-bar a.wcwp-sp-bar__cta:hover { background: #2a3560; }
.wcwp-sp-bar__fine { font-size: 11px; font-weight: 500; opacity: .8; }
.wcwp-sp-bar__fine a { color: inherit !important; text-decoration: underline; }
.wcwp-sp-bar__x {
	position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
	width: 28px; height: 28px; border: 0; border-radius: 50%; cursor: pointer;
	background: transparent; color: inherit; font-size: 18px; line-height: 28px; padding: 0;
}
.wcwp-sp-bar__x:hover { background: rgba(27,35,64,.12); }
.wcwp-sp-bar--final { background: var(--sp-coral); color: #fff; }
.wcwp-sp-bar--final .wcwp-sp-bar__x:hover { background: rgba(255,255,255,.18); }
.wcwp-sp-count { display: inline-flex; gap: 4px; }
.wcwp-sp-count span {
	background: var(--sp-navy); color: #fff; border-radius: 5px; padding: 2px 6px;
	font-weight: 800; font-variant-numeric: tabular-nums; min-width: 34px;
}
@media (max-width: 640px) {
	.wcwp-sp-bar { font-size: 13px; padding: 8px 40px 8px 14px; }
	.wcwp-sp-bar__long { display: none; }
}

/* ---------- C: hero sticker ---------- */
.wcwp-sp-host { position: relative; }
a.wcwp-sp-sticker {
	position: absolute; right: 28px; bottom: 28px; z-index: 5;
	width: 112px; height: 112px; border-radius: 50%;
	background: var(--sp-lime); color: var(--sp-navy) !important; text-decoration: none !important;
	display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
	font-weight: 800; font-size: 12px; line-height: 1.15; letter-spacing: .02em;
	transform: rotate(-8deg); box-shadow: 0 6px 18px rgba(0,0,0,.25);
	border: 3px solid #fff; transition: transform .2s ease;
}
a.wcwp-sp-sticker strong { font-size: 17px; display: block; }
a.wcwp-sp-sticker:hover { transform: rotate(-2deg) scale(1.06); }
@media (max-width: 767px) {
	a.wcwp-sp-sticker { width: 84px; height: 84px; right: 14px; bottom: 14px; font-size: 10px; }
	a.wcwp-sp-sticker strong { font-size: 13px; }
}

/* ---------- D: inline card ---------- */
.wcwp-sp-cardwrap { padding: 28px 16px; background: var(--sp-cream); max-width: none !important; width: 100%; margin-left: 0; margin-right: 0; }
.wcwp-sp-card {
	width: 100%; max-width: 1100px; margin: 0 auto; background: var(--sp-navy); color: var(--sp-cream);
	border-radius: 20px; padding: 26px 30px; display: flex; align-items: center; gap: 24px;
	position: relative; overflow: hidden;
}
.wcwp-sp-card:after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 8px;
	background: linear-gradient(90deg, var(--sp-sage) 0 33%, var(--sp-cream) 33% 66%, var(--sp-teal) 66%);
}
.wcwp-sp-card__body { flex: 1; }
.wcwp-sp-card h3 { color: #fff !important; font-family: inherit; font-weight: 800; font-size: 24px; line-height: 1.2; margin: 0 0 8px; }
.wcwp-sp-card p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--sp-cream); }
.wcwp-sp-card__fine { font-size: 12px !important; opacity: .75; margin-top: 8px !important; }
.wcwp-sp-card__fine a { color: inherit !important; text-decoration: underline; }
a.wcwp-sp-btn {
	display: inline-block; background: var(--sp-lime); color: var(--sp-navy) !important; text-decoration: none !important;
	font-weight: 800; font-size: 16px; padding: 14px 26px; border-radius: 999px; white-space: nowrap;
	transition: transform .15s ease;
}
a.wcwp-sp-btn:hover { transform: translateY(-2px); }
@media (max-width: 767px) {
	.wcwp-sp-card { flex-direction: column; align-items: flex-start; padding: 22px 20px 26px; gap: 16px; }
	.wcwp-sp-card h3 { font-size: 20px; }
}

/* ---------- H: popup ---------- */
.wcwp-sp-pop {
	position: fixed; inset: 0; z-index: 999999; display: flex; align-items: center; justify-content: center;
	padding: 16px; background: rgba(27,35,64,.6); opacity: 0; transition: opacity .25s ease;
}
.wcwp-sp-pop.is-open { opacity: 1; }
.wcwp-sp-pop__box {
	background: #fff; color: var(--sp-navy); border-radius: 22px; width: 100%; max-width: 640px;
	display: flex; overflow: hidden; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,.35);
	transform: translateY(12px); transition: transform .25s ease;
}
.wcwp-sp-pop.is-open .wcwp-sp-pop__box { transform: none; }
.wcwp-sp-pop__art {
	flex: 0 0 38%; background: var(--sp-cream); display: flex; align-items: center; justify-content: center;
	padding: 26px 18px 40px; position: relative;
}
.wcwp-sp-pop__art:after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 22px; background: var(--sp-teal);
	box-shadow: 0 -8px 0 var(--sp-sage);
}
.wcwp-sp-pop__art img { width: 100%; max-width: 180px; height: auto; position: relative; z-index: 1; }
.wcwp-sp-pop__main { flex: 1; padding: 30px 28px 22px; }
.wcwp-sp-pop__eyebrow { display: inline-block; background: var(--sp-lime); color: var(--sp-navy); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; }
.wcwp-sp-pop h2 { font-family: inherit; color: var(--sp-navy) !important; font-weight: 800; font-size: 26px; line-height: 1.15; margin: 12px 0 10px; }
.wcwp-sp-pop p { font-size: 15px; line-height: 1.5; margin: 0 0 18px; color: #3b4466; }
.wcwp-sp-pop__not {
	display: block; margin: 12px 0 0; padding: 0; border: 0; background: none; cursor: pointer;
	font: inherit; font-size: 13px; color: #6b7290; text-decoration: underline;
}
.wcwp-sp-pop__fine { font-size: 11px !important; color: #6b7290 !important; margin: 14px 0 0 !important; }
.wcwp-sp-pop__fine a { color: inherit !important; }
.wcwp-sp-pop__x {
	position: absolute; right: 10px; top: 10px; z-index: 2; width: 34px; height: 34px; border-radius: 50%;
	border: 0; background: rgba(27,35,64,.08); color: var(--sp-navy); font-size: 20px; line-height: 34px; cursor: pointer; padding: 0;
}
@media (max-width: 600px) {
	.wcwp-sp-pop__box { flex-direction: column; max-width: 420px; }
	.wcwp-sp-pop__art { flex-basis: auto; padding: 18px 18px 30px; }
	.wcwp-sp-pop__art img { max-width: 110px; }
	.wcwp-sp-pop__main { padding: 20px 22px 18px; }
	.wcwp-sp-pop h2 { font-size: 22px; }
}
@media (prefers-reduced-motion: reduce) {
	.wcwp-sp-pop, .wcwp-sp-pop__box, a.wcwp-sp-sticker, a.wcwp-sp-btn { transition: none; }
}
