/**
 * Offer Shortcode — liquid glass panel
 */

.offer-sc {
	--offer-tint: #00a651;
	--offer-tint-rgb: 0, 166, 81;
	--offer-radius: 1.35rem;
	--offer-pad-y: 1.35rem;
	--offer-pad-x: 1.5rem;
	position: relative;
	isolation: isolate;
	margin: 0.35rem 0 2.25rem;
	max-width: 100%;
}

.offer-sc__orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(34px);
	opacity: 0.9;
	pointer-events: none;
	z-index: 0;
	will-change: transform;
}

.offer-sc__orb--a {
	width: min(68%, 340px);
	height: min(68%, 340px);
	top: -28%;
	inset-inline-end: -10%;
	background: radial-gradient(circle at 35% 35%, rgba(var(--offer-tint-rgb), 0.95), rgba(46, 204, 113, 0.45) 52%, transparent 78%);
	animation: offer-sc-drift-a 11s ease-in-out infinite alternate;
}

.offer-sc__orb--b {
	width: min(56%, 260px);
	height: min(56%, 260px);
	bottom: -28%;
	inset-inline-start: -8%;
	background: radial-gradient(circle at 60% 40%, rgba(255, 214, 90, 0.7), rgba(var(--offer-tint-rgb), 0.45) 55%, transparent 75%);
	animation: offer-sc-drift-b 13s ease-in-out infinite alternate;
}

.offer-sc__orb--c {
	width: min(42%, 190px);
	height: min(42%, 190px);
	top: 22%;
	inset-inline-start: 36%;
	background: radial-gradient(circle, rgba(255, 255, 255, 0.85), rgba(160, 240, 200, 0.35) 55%, transparent 75%);
	opacity: 0.65;
	animation: offer-sc-pulse 7.5s ease-in-out infinite;
}

.offer-sc__glass {
	position: relative;
	z-index: 1;
	overflow: hidden;
	border-radius: var(--offer-radius);
	padding: var(--offer-pad-y) var(--offer-pad-x);
	color: #0f2418;
	/* Deeper green glass so editor yellow/white text stays readable */
	background:
		linear-gradient(
			155deg,
			rgba(255, 255, 255, 0.28) 0%,
			rgba(var(--offer-tint-rgb), 0.62) 38%,
			rgba(0, 110, 55, 0.78) 100%
		);
	border: 1px solid rgba(255, 255, 255, 0.62);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.72) inset,
		0 -18px 40px rgba(255, 255, 255, 0.08) inset,
		0 22px 50px rgba(0, 70, 35, 0.22),
		0 6px 18px rgba(0, 0, 0, 0.08);
	-webkit-backdrop-filter: blur(22px) saturate(1.55);
	backdrop-filter: blur(22px) saturate(1.55);
	transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.offer-sc__glass::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;
	background:
		radial-gradient(120% 80% at 12% -10%, rgba(255, 255, 255, 0.55), transparent 55%),
		linear-gradient(
			115deg,
			rgba(255, 255, 255, 0.4) 0%,
			rgba(255, 255, 255, 0.06) 30%,
			transparent 52%,
			rgba(255, 255, 255, 0.1) 78%,
			rgba(255, 255, 255, 0.22) 100%
		);
	opacity: 0.95;
	mix-blend-mode: soft-light;
}

.offer-sc__shine {
	position: absolute;
	top: -40%;
	inset-inline-start: -35%;
	width: 42%;
	height: 180%;
	pointer-events: none;
	z-index: 2;
	background: linear-gradient(
		90deg,
		transparent 0%,
		rgba(255, 255, 255, 0.08) 40%,
		rgba(255, 255, 255, 0.38) 50%,
		rgba(255, 255, 255, 0.08) 60%,
		transparent 100%
	);
	transform: rotate(18deg);
	animation: offer-sc-shine 6.5s ease-in-out infinite;
}

.offer-sc__body {
	position: relative;
	z-index: 3;
}

.offer-sc__body > *:first-child {
	margin-top: 0;
}

.offer-sc__body > *:last-child {
	margin-bottom: 0;
}

.offer-sc__body h1,
.offer-sc__body h2,
.offer-sc__body h3,
.offer-sc__body h4,
.offer-sc__body p {
	margin-top: 0.35em;
	margin-bottom: 0.45em;
	line-height: 1.65;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.18);
}

.offer-sc__body h3 {
	font-size: clamp(0.95rem, 0.85rem + 0.45vw, 1.15rem);
	letter-spacing: -0.01em;
}

.offer-sc__body p {
	font-size: clamp(0.86rem, 0.8rem + 0.25vw, 0.98rem);
}

.offer-sc__body a {
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
	transition: opacity 0.2s ease, border-color 0.2s ease;
}

.offer-sc__body a:hover,
.offer-sc__body a:focus-visible {
	opacity: 0.88;
	border-bottom-color: rgba(255, 255, 255, 0.75);
}

@media (hover: hover) and (pointer: fine) {
	.offer-sc:hover .offer-sc__glass {
		transform: translateY(-2px);
		box-shadow:
			0 1px 0 rgba(255, 255, 255, 0.7) inset,
			0 -1px 0 rgba(0, 60, 30, 0.1) inset,
			0 22px 48px rgba(0, 80, 40, 0.18),
			0 6px 16px rgba(0, 0, 0, 0.07);
	}
}

@keyframes offer-sc-drift-a {
	from { transform: translate3d(0, 0, 0) scale(1); }
	to { transform: translate3d(-12%, 10%, 0) scale(1.08); }
}

@keyframes offer-sc-drift-b {
	from { transform: translate3d(0, 0, 0) scale(1); }
	to { transform: translate3d(14%, -8%, 0) scale(1.1); }
}

@keyframes offer-sc-pulse {
	0%, 100% { opacity: 0.4; transform: scale(0.92); }
	50% { opacity: 0.7; transform: scale(1.05); }
}

@keyframes offer-sc-shine {
	0%, 28% { transform: translateX(0) rotate(18deg); opacity: 0; }
	38% { opacity: 0.85; }
	58% { transform: translateX(280%) rotate(18deg); opacity: 0; }
	100% { transform: translateX(280%) rotate(18deg); opacity: 0; }
}

@media (max-width: 600px) {
	.offer-sc {
		--offer-pad-y: 1.1rem;
		--offer-pad-x: 1rem;
		--offer-radius: 1.1rem;
		margin-bottom: 1.75rem;
	}

	.offer-sc__body h3 {
		font-size: 0.95rem;
	}

	.offer-sc__body p {
		font-size: 0.84rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.offer-sc__orb,
	.offer-sc__shine,
	.offer-sc__glass {
		animation: none !important;
		transition: none !important;
	}

	.offer-sc:hover .offer-sc__glass {
		transform: none;
	}
}
