/* Success story single template — Figma 1009:9105 (desktop) / 1104:568 (mobile).
   Container max-width 870px centered. All sections gated server-side and skipped if empty. */

/* Video modal dialog — reuses products-list dialog visuals so the same styles work
   on both success_story and event singles (CSS loaded for both via enqueue-global-assets). */
.rw-products-list-dialog {
	position: fixed; inset: 0; margin: auto; border: 0; padding: 0;
	width: min(90vw, 64rem); max-height: 90vh; background: transparent; color: inherit;
}
.rw-products-list-dialog::backdrop { background: rgba(0, 5, 12, 0.85); }
.rw-products-list-dialog video { width: 100%; height: auto; display: block; border-radius: var(--rw-radius-md); }
.rw-products-list-dialog .dialog-close {
	position: absolute; top: -2.5rem; right: 0; width: 2.25rem; height: 2.25rem;
	background: transparent; border: 0; color: var(--rw-color-white);
	font-size: 1.75rem; line-height: 1; cursor: pointer;
}
.rw-products-list-dialog .dialog-close:focus-visible { outline: none; box-shadow: var(--rw-state-focus-ring); }

.rw-success-single__article {
	background: var(--rw-color-bg-gray);
	padding-bottom: 0;
}

.rw-success-single__inner {
	max-width: 54.375rem; /* 870px */
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

/* ===== Header (eyebrow + logo + title) ===== */
.rw-success-single__header {
	display: flex;
	flex-direction: column;
}

.rw-success-single__eyebrow {
	align-self: flex-start;
	text-transform: uppercase;
}

/* Event single: no logo between eyebrow and title, so eyebrow needs explicit spacing. */
.rw-event-single .rw-success-single__eyebrow {
	margin-bottom: 32px;
}

.rw-success-single__logo {
	display: block;
	height: 32px;
	width: fit-content;
	margin: 48px 0 32px;
}

.rw-success-single__title {
	font-family: var(--rw-font-text);
	font-weight: 700;
	font-size: var(--rw-h3-size);
	line-height: var(--rw-h3-line);
	letter-spacing: var(--rw-h3-tracking);
	color: var(--rw-color-primary-green);
	margin: 0;
}

/* Lede: short description directly under the title on single event pages. */
.rw-success-single__lede {
	margin: 1rem 0 0;
	font-family: var(--rw-font-text);
	font-size: 1.125rem;
	line-height: 1.6;
	color: rgba(9, 59, 77, 0.78);
	max-width: 56rem;
}

/* ===== Summary cards (3 cols desktop / 1 col mobile) ===== */
.rw-success-single__cards {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--rw-space-md);
}

.rw-success-single__card {
	background: var(--rw-color-white);
	border-radius: var(--rw-radius-lg);
	padding: 1rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: var(--rw-space-sm);
}

.rw-success-single__card-label {
	font-family: var(--rw-font-mono);
	font-weight: 500;
	font-size: 0.875rem;
	line-height: 0.875rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--rw-color-grey-02);
	margin: 0;
}

.rw-success-single__card-value {
	font-family: var(--rw-font-text);
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.75rem;
	letter-spacing: -0.012em;
	color: var(--rw-color-primary-green);
	margin: 0;
}

/* ===== Featured video ===== */
.rw-success-single__video {
	margin: 0;
	border-radius: var(--rw-radius-lg);
	overflow: hidden;
	aspect-ratio: 872 / 544;
	position: relative;
	background: var(--rw-color-bg-mist);
}

.rw-success-single__video-link {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	font: inherit;
	color: inherit;
}

.rw-success-single__video-link::before {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: 1;
}

.rw-success-single__video-poster,
.rw-success-single__video > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.rw-success-single__video-play {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 80px;
	height: 80px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	background: rgba(255, 255, 255, 0.20);
	backdrop-filter: blur(71.42857360839844px);
	-webkit-backdrop-filter: blur(71.42857360839844px);
	z-index: 2;
}
.rw-success-single__video-play svg { width: 11px; height: 11px; }

/* ===== Gutenberg body — reuses .post-content from single-post.css (enqueued on this template too) ===== */

/* ===== Testimonial ===== */
.rw-success-single__testimonial {
	position: relative;
	overflow: hidden;
	background: var(--rw-color-primary-blue);
	border-radius: var(--rw-radius-lg);
	padding: 4.375rem 3rem; /* 70px / 48px */
	color: var(--rw-color-white);
	display: flex;
	flex-direction: column;
	gap: var(--rw-space-xl);
}

.rw-success-single__testimonial::before {
	/* Soft yellow glow on right edge — Figma ellipse */
	content: '';
	position: absolute;
	right: -25%;
	top: 50%;
	transform: translateY(-50%);
	width: 70%;
	height: 200%;
	background: radial-gradient(ellipse at center, rgba(255, 206, 3, 0.18) 0%, rgba(255, 206, 3, 0) 60%);
	pointer-events: none;
	z-index: 0;
}

.rw-success-single__quote {
	position: relative;
	z-index: 1;
	margin: 0;
	font-family: var(--rw-font-text);
	font-weight: 700;
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.012em;
	color: var(--rw-color-white);
}

.rw-success-single__testimonial-author {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0.375rem 0;
	font-family: var(--rw-font-text);
	font-size: 1rem;
	line-height: 1.75rem;
	letter-spacing: -0.012em;
	color: var(--rw-color-white);
}

.rw-success-single__testimonial-author .eyebrow-mark {
	width: 11px;
	height: 11px;
	background: var(--rw-color-primary-yellow);
	border-radius: 1px;
	flex-shrink: 0;
}

.rw-success-single__testimonial-author strong {
	font-weight: 700;
}

/* ===== Bottom CTA ===== */
.rw-success-single__cta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--rw-space-lg);
	text-align: center;
}

.rw-success-single__cta-text {
	margin: 0;
	font-family: var(--rw-font-text);
	font-weight: 700;
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.012em;
	color: var(--rw-color-primary-green);
}

.rw-success-single__cta-link {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.rw-success-single__cta-link:hover {
	color: var(--rw-color-primary-blue);
}

.rw-success-single__cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 50px;
	padding: 0 1.5rem;
	background: var(--rw-color-primary-yellow);
	color: var(--rw-color-primary-blue);
	border-radius: var(--rw-radius-sm);
	font-family: var(--rw-font-text);
	font-weight: 600;
	font-size: 1rem;
	line-height: 1;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.rw-success-single__cta-btn:hover {
	background: var(--rw-color-primary-yellow-hover);
}

/* ===== Mobile (≤768px) — Figma 1104:568 ===== */
@media (max-width: 767px) {
	.rw-success-single__inner {
		gap: var(--rw-space-xl);
	}

	.rw-success-single__title {
		font-size: 1.625rem; /* 26px */
		line-height: 1.75rem; /* 28px */
	}

	.rw-success-single__cards {
		grid-template-columns: 1fr;
		gap: var(--rw-space-sm);
	}

	.rw-success-single__card-label,
	.rw-success-single__card-value {
		font-size: 0.75rem; /* 12px label */
	}
	.rw-success-single__card-value {
		font-size: 1rem;
		line-height: 1.5rem;
	}

	.rw-success-single__video {
		aspect-ratio: 350 / 218;
	}

	.rw-success-single__video-play {
		width: 44px;
		height: 44px;
	}

	.rw-success-single__testimonial {
		padding: 3rem 1.5rem;
		gap: var(--rw-space-md);
	}

	.rw-success-single__quote {
		font-size: 1rem;
		line-height: 1.5rem;
	}

	.rw-success-single__cta-text {
		font-size: 1rem;
		line-height: 1.5rem;
	}

	.rw-success-single__cta-btn {
		height: 44px;
		padding: 0 1.5rem;
		font-size: 0.875rem;
	}
}

/* ===== Contact form override — neutral grey bg on success_story singles ===== */
body.single-success_story .rw-block-contact-form {
	background: #E8E8E9;
}
