/**
 * /tour — the tour video watch page (template-mlsgenie-tour.php).
 * The player itself is styled in assets/css/mlsgenie-video.css.
 *
 * @package MLS_Genie
 * @since   2.0.591
 */

/* ── Video hero ───────────────────────────────────────────────────────────── */
.mlsg-tour__hero-inner {
	position: relative;
	z-index: 1;
	max-width: 1120px;
	display: flex;
	flex-direction: column;
	gap: 20px
}

.mlsg-tour__hero h1,
.mlsg-tour__hero .hero-sub {
	margin-bottom: 0
}

.mlsg-tour__crumbs {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: .875rem;
	color: var(--site-text-on-dark)
}

.mlsg-tour__meta {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
	font-size: .9375rem;
	color: var(--site-text-on-dark)
}

/* ── Transcript + chapters ────────────────────────────────────────────────── */
.mlsg-tour__body {
	max-width: 1120px;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 48px
}

.mlsg-tour__transcript {
	flex: 999 1 560px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 16px
}

.mlsg-tour__transcript .eyebrow,
.mlsg-tour__transcript .sec-title {
	margin-bottom: 0
}

.mlsg-tour__para {
	margin: 0;
	font-size: 1.125rem;
	line-height: 1.75;
	color: var(--site-text-sec)
}

/* The shorter column stays in place while the transcript scrolls. */
.mlsg-tour__aside {
	flex: 1 1 320px;
	min-width: 0;
	position: sticky;
	top: 96px;
	display: flex;
	flex-direction: column;
	gap: 20px
}

.mlsg-tour__card {
	background: var(--site-white);
	border: 1px solid var(--site-border);
	border-radius: 16px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 12px
}

.mlsg-tour__card--dark {
	background: var(--site-navy-deep);
	border-color: var(--site-navy-deep);
	color: var(--site-white)
}

.mlsg-tour__card-title {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--site-navy)
}

.mlsg-tour__card--dark .mlsg-tour__card-title {
	color: var(--site-white)
}

.mlsg-tour__card-text {
	margin: 0;
	font-size: 1rem;
	line-height: 1.55;
	color: var(--site-slate-65)
}

.mlsg-tour__card-btn {
	width: 100%
}

.mlsg-tour__card-link {
	align-self: center;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	font-size: 1rem;
	font-weight: 600
}

.mlsg-tour__chapters {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column
}

.mlsg-tour__chapter + .mlsg-tour__chapter {
	border-top: 1px solid var(--site-border-light)
}

.mlsg-tour__chapter-link {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 44px;
	padding: 6px 0;
	text-decoration: none;
	color: var(--site-text);
	font-size: 1rem
}

.mlsg-tour__chapter-time {
	flex: 0 0 44px;
	font-weight: 700;
	color: var(--site-teal-dark)
}

.mlsg-tour__chapter-link:hover .mlsg-tour__chapter-name {
	text-decoration: underline
}

.mlsg-tour__chapter-link:focus-visible {
	outline: 3px solid var(--site-teal);
	outline-offset: 2px;
	border-radius: 6px
}

@media (max-width: 768px) {
	.mlsg-tour__body {
		gap: 32px
	}
	.mlsg-tour__aside {
		position: static
	}
	.mlsg-tour__para {
		font-size: 1.0625rem
	}
}