/* ─── Timeline Header ─────────────────────────────────────────── */

.bsw-timeline-header.wp-block-group {
	background: #fff;
	padding-block: 60px 48px !important;
	padding-inline: 20px !important;
	text-align: center;
	display:flex;
	flex-direction: column;
	align-items: center;
}

.bsw-timeline-header__supertitle {
	font-family: var(--wp--preset--font-family--cormorant, 'Cormorant', serif) !important;
	font-size: 60px !important;
	font-weight: 400 !important;
	font-style: normal !important;
	text-transform: uppercase !important;
	letter-spacing: 0.2em !important;
	color: #8c857b !important;
	line-height: normal !important;
	margin: 0 0 0 !important;
	text-align: center !important;
	max-width:unset !important;
}

.bsw-timeline-header__script {
	font-family: 'Brittany Signature', cursive !important;
	font-size: 60px !important;
	font-weight: 400 !important;
	font-style: normal !important;
	color: #ba878f !important;
	line-height: 1 !important;
	margin: 0 0 8rem !important;
	text-align: center !important;
}

.bsw-timeline-header__intro {
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	font-style: normal !important;
	color: #373737 !important;
	line-height: 28px !important;
	margin: 0 !important;
	text-align: center !important;
}

/* ─── Timeline Entry — shared ─────────────────────────────────── */

.bsw-timeline-entry.wp-block-group {
	background: #fff;
	position: relative;
	display: flex !important;
	align-items: flex-start;
	padding: 0 !important;
	margin: 0 !important;
}

/* Vertical centre line */
.bsw-timeline-entry::before {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	width: 1px;
	background: #baaa7c;
	transform: translateX(-50%);
	pointer-events: none;
}

/* First entry: line begins at the dot — no stub above the timeline start */
.bsw-timeline-header + .bsw-timeline-entry::before {
	top: 40px;
}

/* Dot on the centre line, aligned with the top of the content padding */
.bsw-timeline-entry::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 40px;
	width: 9px;
	height: 9px;
	background: #baaa7c;
	border-radius: 50%;
	transform: translateX(-50%);
	z-index: 1;
}

/* Photo side */
.bsw-timeline-entry__photo-side.wp-block-group {
	width: 50%;
	flex-shrink: 0;
	padding: 0 !important;
	margin: 0 !important;
}

/* Cream box that wraps the image */
.bsw-timeline-entry__photo-wrap.wp-block-group {
	background: #f8f7f4;
	padding: 18px !important;
	margin: 0 !important;
}

.bsw-timeline-entry__photo.wp-block-image {
	margin: 0 !important;
	line-height: 0;
}

.bsw-timeline-entry__photo img {
	width: 100%;
	aspect-ratio: 1.75; /* 565 × 323 display box — same crop ratio at every viewport width */
	height: auto;
	object-fit: cover;
	display: block;
}

.bsw-timeline-entry__photo.position-bottom img {
	object-position: center bottom;
}

/* Photo credit — small italic caption under the photo, aligned to its outer edge */
.bsw-timeline-entry__photo-credit {
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif) !important;
	font-style: italic !important;
	font-size: 14px !important;
	color: #baaa7c !important;
	line-height: normal !important;
	margin: 6px 0 0 !important;
}

.bsw-timeline-entry__photo-credit:empty {
	display: none;
}

.bsw-timeline-entry--left .bsw-timeline-entry__photo-credit {
	text-align: left !important;
}

.bsw-timeline-entry--right .bsw-timeline-entry__photo-credit {
	text-align: right !important;
}

/* Text side */
.bsw-timeline-entry__text-side.wp-block-group {
	width: 50%;
	padding: 0 !important;
	margin: 0 !important;
}

/* Label — e.g. "the day before" */
.bsw-timeline-entry__label {
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif) !important;
	font-size: 22px !important;
	font-weight: 400 !important;
	font-style: normal !important;
	color: #867b70 !important;
	line-height: normal !important;
	margin: 0 0 0.35rem !important;
}

/* Title — e.g. "Wedding Guest Activities" */
.bsw-timeline-entry__title {
	font-family: var(--wp--preset--font-family--cormorant, 'Cormorant', serif) !important;
	font-size: 36px !important;
	font-weight: 400 !important;
	font-style: italic !important;
	color: #aa747c !important;
	line-height: normal !important;
	margin: 0 0 1.5rem !important;
}

/* Body copy */
.bsw-timeline-entry__body {
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	font-style: normal !important;
	color: #373737 !important;
	line-height: 28px !important;
	margin: 0 0 1.25rem !important;
}

.bsw-timeline-entry__body strong {
	color: #aa747c;
}

/* Link */
.bsw-timeline-entry__link {
	margin: 0 !important;
}

.bsw-timeline-entry__link a,
.bsw-timeline-entry__link {
	text-transform: capitalize !important;
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif) !important;
	font-size: 18px !important;
	font-weight: 400 !important;
	font-style: italic !important;
	color: #8e4e58 !important;
	text-decoration: underline !important;
	text-decoration-color: transparent !important;
	text-decoration-thickness: 1px !important;
	text-underline-offset: 3px !important;
	transition: text-decoration-color 0.2s ease;
	line-height: 28px !important;
}

.bsw-timeline-entry__link a:hover {
	text-decoration-color: currentColor !important;
}

/* Optional venue logos row under the link — delete or swap per entry */
.bsw-timeline-entry__logos.wp-block-group {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 28px !important;
	margin-block-start: 30px !important;
}

.bsw-timeline-entry__logos .wp-block-image {
	margin: 0 !important;
}

.bsw-timeline-entry__logos img {
	display: block;
	/* Cap the height so logos can't balloon if the editor strips the img
	   width/height attrs (e.g. "Attempt block recovery"). These SVGs are
	   width="100%" with no intrinsic size, so width follows the viewBox ratio. */
	width: auto !important;
	height: auto !important;
	max-height: 54px !important;
	max-width: 100% !important;
}

.bsw-timeline-entry__logos.mobile-show img {
	display:none;
}

.bsw-timeline-entry--right .bsw-timeline-entry__logos {
	justify-content: flex-end;
}

/* ─── Left entry (photo left, text right) ─────────────────────── */

.bsw-timeline-entry--left .bsw-timeline-entry__photo-side {
	padding: 40px 77px 40px 10.76% !important;
}

.bsw-timeline-entry--left .bsw-timeline-entry__text-side {
	padding: 40px 18.29% 40px 76px !important;
}

/* ─── Right entry (photo right, text left) ────────────────────── */

.bsw-timeline-entry--right {
	flex-direction: row-reverse !important;
}

/* Photo is first in DOM; row-reverse puts it on the right */
.bsw-timeline-entry--right .bsw-timeline-entry__photo-side {
	padding: 40px 10.76% 40px 77px !important;
}

/* Text side ends up on the left; right-align content toward the centre line */
.bsw-timeline-entry--right .bsw-timeline-entry__text-side {
	padding: 40px 77px 40px 18.75% !important;
	text-align: right !important;
}

.bsw-timeline-entry--right .bsw-timeline-entry__label,
.bsw-timeline-entry--right .bsw-timeline-entry__title,
.bsw-timeline-entry--right .bsw-timeline-entry__body,
.bsw-timeline-entry--right .bsw-timeline-entry__link {
	text-align: right !important;
}

/* ─── Timeline Testimonial ────────────────────────────────────── */

.bsw-timeline-testimonial.wp-block-group {
	background: #fff;
	padding-block: 48px !important;
	padding-inline: 20px !important;
	position: relative;
}

/* Short vertical connectors above and below */
.bsw-timeline-testimonial::before,
.bsw-timeline-testimonial::after {
	content: '';
	position: absolute;
	left: 50%;
	width: 1px;
	height: 48px;
	background: #baaa7c;
	transform: translateX(-50%);
}

.bsw-timeline-testimonial::before {
	top: 0;
}

.bsw-timeline-testimonial::after {
	bottom: 0;
}

.bsw-timeline-testimonial__inner.wp-block-group {
	background: #f8f7f4;
	padding: 3rem 3.5rem !important;
	margin-inline: auto !important;
	text-align: center;
}

.bsw-timeline-testimonial__quote {
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif) !important;
	font-size: 20px !important;
	font-weight: 400 !important;
	font-style: normal !important;
	color: #373737 !important;
	line-height: 36px !important;
	margin: 0 auto 1rem !important;
	max-width:756px !important;
}

.bsw-timeline-testimonial__author {
	font-family: var(--wp--preset--font-family--cardo, 'Cardo', serif) !important;
	font-size: 18px !important;
	font-weight: 400 !important;
	font-style: italic !important;
	color: #373737 !important;
	line-height: 28px !important;
	margin: 0 !important;
}

/* ─── Mobile ──────────────────────────────────────────────────── */

@media (max-width: 767px) {
	.bsw-timeline-header__supertitle {
		font-size: 46px !important;
		letter-spacing: 0.2em !important;
	}

	.bsw-timeline-header__script {
		font-size: 52px !important;
		margin: 0 0 5rem !important;
	}

	/* Stack as one column: text → photo → logos. text-side is flattened
	   (display:contents) so its children — including the logos — become
	   orderable siblings of the photo, letting the logos drop below it. */
	.bsw-timeline-entry.wp-block-group,
	.bsw-timeline-entry--right {
		flex-direction: column !important;
		align-items: stretch !important;
		padding: 28px 20px 24px 40px !important; /* 40px left clears the timeline line */
	}

	.bsw-timeline-entry__text-side.wp-block-group {
		display: contents !important;
	}

	.bsw-timeline-entry__photo-side.wp-block-group {
		width: 100% !important;
		order: 1; /* after the text, before the logos */
	}

	.bsw-timeline-entry__logos.wp-block-group {
		order: 2; /* below the photo */
		margin-block-start: 20px !important;
	}

	/* Line moves to left side */
	.bsw-timeline-entry::before {
		display: block;
		left: 20px;
		transform: none;
	}

	/* Dot moves to left side, aligned with top of text content */
	.bsw-timeline-entry::after {
		left: 16px;
		top: 28px;
		transform: none;
	}

	/* Text: extra left padding to clear the line */
	.bsw-timeline-entry--left .bsw-timeline-entry__text-side,
	.bsw-timeline-entry--right .bsw-timeline-entry__text-side {
		padding: 28px 20px 16px 40px !important;
		text-align: left !important;
	}

	/* Photo: indent comes from the entry padding now; just add a gap above */
	.bsw-timeline-entry--left .bsw-timeline-entry__photo-side,
	.bsw-timeline-entry--right .bsw-timeline-entry__photo-side {
		padding: 0 !important;
		margin-block-start: 16px !important;
	}

	.bsw-timeline-entry--right .bsw-timeline-entry__label,
	.bsw-timeline-entry--right .bsw-timeline-entry__title,
	.bsw-timeline-entry--right .bsw-timeline-entry__body,
	.bsw-timeline-entry--right .bsw-timeline-entry__link {
		text-align: left !important;
	}

	.bsw-timeline-entry--right .bsw-timeline-entry__logos {
		justify-content: flex-start;
	}

	/* Credit sits bottom-right under the photo on every entry */
	.bsw-timeline-entry--left .bsw-timeline-entry__photo-credit,
	.bsw-timeline-entry--right .bsw-timeline-entry__photo-credit {
		text-align: right !important;
	}

	/* Testimonial: hide vertical connectors on mobile */
	.bsw-timeline-testimonial::before,
	.bsw-timeline-testimonial::after {
		display: none;
	}

	.bsw-timeline-testimonial__inner.wp-block-group {
		padding: 2rem 1.5rem !important;
	}

	.bsw-timeline-testimonial__quote {
		font-size: 18px !important;
		line-height: 34px !important;
	}

	.bsw-timeline-testimonial.wp-block-group {
		padding-block: 0 !important;
		padding-inline: 10px !important;
	}

	.bsw-timeline-entry__logos .mobile-show img {
		display:block;
	}

	.bsw-timeline-entry__logos .mobile-hide img {
		display:none;
	}

}

/* ─── Small phones (iPhone SE etc.) ───────────────────────────── */
/* "CELEBRATION" overflows at 46px below ~390px wide — shrink just the supertitle */
@media (max-width: 389px) {
	.bsw-timeline-header__supertitle {
		font-size: 38px !important;
	}
}
