/* Warburton Life — Business detail story (article + sidebar). */

.wl-bstory {
	max-width: 1376px;
	margin: 0 auto;
	padding: 2.5rem 2rem 5rem;
	color: var(--wp--preset--color--ink, #241823);
	font-family: var(--wp--preset--font-family--sans, "Public Sans", system-ui, sans-serif);
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 4rem;
	align-items: start;
}

.wl-bstory .mono   { font-family: var(--wp--preset--font-family--mono, "JetBrains Mono", monospace); }
.wl-bstory .hand   { font-family: var(--wp--preset--font-family--hand, "Caveat", cursive); }
.wl-bstory .serif  { font-family: var(--wp--preset--font-family--serif, "Fraunces", Georgia, serif); }

/* Article */
.wl-bstory__kicker {
	font-size: 0.6875rem;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--wp--preset--color--rose-dark, #a84e63);
	margin-bottom: 1.125rem;
}
.wl-bstory__h2 {
	font-size: clamp(2.75rem, 5.5vw, 4.5rem);
	font-weight: 700;
	margin: 0;
	line-height: 0.95;
	letter-spacing: -0.005em;
	max-width: 600px;
	color: var(--wp--preset--color--ink, #241823);
}
.wl-bstory__h2-accent {
	color: var(--wp--preset--color--mauve-dark, #5e4770);
	font-style: italic;
}
.wl-bstory__prose {
	margin-top: 2.25rem;
	font-size: 1.0625rem;
	line-height: 1.7;
	opacity: 0.92;
}
.wl-bstory__prose > p:first-child::first-letter {
	font-family: var(--wp--preset--font-family--hand, "Caveat", cursive);
	font-size: 5rem;
	float: left;
	line-height: 0.78;
	margin-right: 0.875rem;
	color: var(--wp--preset--color--rose-dark, #a84e63);
	margin-top: 0.375rem;
}
.wl-bstory__prose p { margin: 0 0 1.25rem; }
.wl-bstory__prose a { border-bottom: 1px solid currentColor; }

/* Hours strip — 7-day grid */
.wl-bstory__hours {
	margin-top: 3rem;
	border-top: 1.5px solid var(--wp--preset--color--ink, #241823);
	border-bottom: 1.5px solid var(--wp--preset--color--ink, #241823);
	padding: 1.25rem 0;
	display: grid;
	grid-template-columns: repeat(7, 1fr);
}
.wl-bstory__hours-day {
	text-align: center;
	border-right: 1px solid rgba(36, 24, 35, 0.15);
	padding: 0.375rem 0.25rem;
}
.wl-bstory__hours-day.is-last { border-right: none; }
.wl-bstory__hours-d {
	font-size: 0.625rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	opacity: 0.55;
}
.wl-bstory__hours-h {
	font-size: 1.75rem;
	color: var(--wp--preset--color--ink, #241823);
	line-height: 1.1;
	margin-top: 0.25rem;
}
.wl-bstory__hours-h.is-late { color: var(--wp--preset--color--rose-dark, #a84e63); }
.wl-bstory__hours-late {
	font-size: 0.5625rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--rose-dark, #a84e63);
	margin-top: 0.125rem;
}

/* Tag pills */
.wl-bstory__tags {
	margin-top: 2rem;
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}
.wl-bstory__tag {
	padding: 0.4375rem 0.875rem;
	border-radius: 100px;
	border: 1.5px solid rgba(36, 24, 35, 0.25);
	font-size: 0.8125rem;
}

/* Sidebar */
.wl-bstory__sidebar {
	display: flex;
	flex-direction: column;
	gap: 1.4rem;
}

/* Pull quote card */
.wl-bstory__quote {
	background: var(--wp--preset--color--violet, #3a2446);
	color: var(--wp--preset--color--paper, #f2e6d8);
	padding: 2rem;
	border-radius: 16px;
}
.wl-bstory__quote-kicker {
	font-size: 0.6875rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	opacity: 0.7;
	margin-bottom: 0.875rem;
}
.wl-bstory__quote-text {
	font-size: 2.125rem;
	line-height: 1.15;
	color: var(--wp--preset--color--gold, #d9a64a);
	font-style: italic;
}
.wl-bstory__quote-by {
	font-size: 0.6875rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	opacity: 0.7;
	margin-top: 1.125rem;
}

/* Stats card — mauve solid panel, paper-coloured text. Applies to:
   - business-story / event-story right-sidebar stats panels
   - the standalone .wl-bstats variant in the attraction layout (which
     overrides padding/margin further down). */
.wl-bstory__stats {
	background: var(--wp--preset--color--mauve-dark, #5e4770);
	border: 0;
	border-radius: 16px;
	padding: 1.75rem;
	color: var(--wp--preset--color--paper, #f2e6d8);
}
.wl-bstory__stats-kicker {
	font-size: 0.6875rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wp--preset--color--paper, #f2e6d8);
	opacity: 0.75;
	font-weight: 600;
	margin-bottom: 1.125rem;
}
/* Override the inline `has-{colour}-color` classes on stat values so they
   read clearly on the mauve background. Without this, `has-rose-dark-color`
   etc. win on specificity and turn the value into a low-contrast hue. */
.wl-bstory__stats .wl-bstory__stat-v { color: var(--wp--preset--color--paper, #f2e6d8) !important; }
.wl-bstory__stat-l { color: var(--wp--preset--color--paper, #f2e6d8); opacity: 0.7; }
.wl-bstory__stats-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
}
.wl-bstory__stat-v {
	font-size: 3.5rem;
	line-height: 0.9;
	font-weight: 700;
}
.wl-bstory__stat-l {
	font-size: 0.75rem;
	opacity: 0.65;
	margin-top: 0.375rem;
}

/* Contact card */
.wl-bstory__contact {
	background: var(--wp--preset--color--paper-dark, #e5d4bf);
	border-radius: 16px;
	padding: 1.625rem;
}
.wl-bstory__contact-kicker {
	font-size: 0.6875rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	opacity: 0.6;
	margin-bottom: 0.875rem;
}
.wl-bstory__contact-rows {
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
	font-size: 0.875rem;
}
.wl-bstory__contact-row {
	display: flex;
	justify-content: space-between;
	border-bottom: 1px dashed rgba(36, 24, 35, 0.25);
	padding-bottom: 0.625rem;
	color: var(--wp--preset--color--ink, #241823);
	text-decoration: none;
}
.wl-bstory__contact-row:last-child { border-bottom: none; padding-bottom: 0; }
.wl-bstory__contact-k { opacity: 0.65; }
.wl-bstory__contact-cta {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-top: 1.4rem;
	background: var(--wp--preset--color--ink, #241823);
	color: var(--wp--preset--color--paper, #f2e6d8);
	padding: 0.875rem 1rem;
	border-radius: 100px;
	font-size: 0.875rem;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
}

@media (max-width: 960px) {
	.wl-bstory {
		grid-template-columns: 1fr;
		gap: 2.5rem;
		padding: 2rem 1rem 3rem;
	}
}

/* ─── Single-CPT prose row: post-content + standalone stats card ───────── */
.wl-prose-row {
	max-width: 1376px;
	margin: 0 auto !important;
	padding: 1.5rem 2rem 5rem;
	box-sizing: border-box;
}
/* Tighten hero bottom on attraction pages so the prose row sits closer.
   Other CPTs keep the original 3.5rem breathing room. */
body.single-attraction .wl-bhero { padding-bottom: 1.5rem; }
.wl-prose-row .wp-block-columns {
	align-items: flex-start;
	gap: 4rem;
}

/* Body prose register on single-{cpt} pages. Scoped by body class so this
   does not bleed into archives, the home page, or unrelated post types. */
body.single-attraction .wp-block-post-content,
body.single-business  .wp-block-post-content,
body.single-event     .wp-block-post-content {
	font-family: var(--wp--preset--font-family--serif, "Fraunces", Georgia, serif);
	font-size: 1.0625rem;
	line-height: 1.7;
	color: var(--wp--preset--color--ink, #241823);
}
body.single-attraction .wp-block-post-content p,
body.single-business  .wp-block-post-content p,
body.single-event     .wp-block-post-content p {
	margin: 0 0 1.25rem;
}
body.single-attraction .wp-block-post-content > p:first-of-type::first-letter,
body.single-business  .wp-block-post-content > p:first-of-type::first-letter,
body.single-event     .wp-block-post-content > p:first-of-type::first-letter {
	font-family: var(--wp--preset--font-family--hand, "Caveat", cursive);
	font-size: 5rem;
	float: left;
	line-height: 0.78;
	margin: 0.375rem 0.875rem 0 0;
	color: var(--wp--preset--color--rose-dark, #a84e63);
}

/* Standalone stats card variant of .wl-bstory.
   .wl-bstory normally is a 1.4fr/1fr grid; .wl-bstats overrides to a single block.
   Pinned-clipping treatment: tinted mauve wash, chunky left edge, soft offset shadow. */
.wl-bstats {
	display: block;
	max-width: none;
	margin: 0;
	padding: 0;
	background: transparent;
}
/* In the narrow standalone .wl-bstats variant, dial down the stat-v size
   and grid gap so values fit the 30%-wide column. */
.wl-bstats .wl-bstory__stat-v { font-size: 2.5rem; }
.wl-bstats .wl-bstory__stats-grid { gap: 1rem; }

@media (max-width: 781px) {
	.wl-prose-row {
		padding: 0 1rem 3rem;
	}
	.wl-prose-row .wp-block-columns.is-stacked-on-mobile {
		gap: 2rem;
	}
}

/* Contact card variant — sits under .wl-bstats in the right column. Inherits
   the mauve panel from .wl-bstats; just rewires the row colours so links
   are readable on dark and the CTA inverts to paper-on-mauve. */
.wl-bcontact { margin-top: 1.25rem; }
.wl-bcontact .wl-bstory__contact {
	background: var(--wp--preset--color--mauve-dark, #5e4770);
	border-radius: 16px;
	padding: 1.75rem;
	color: var(--wp--preset--color--paper, #f2e6d8);
}
.wl-bcontact .wl-bstory__contact-kicker {
	color: var(--wp--preset--color--paper, #f2e6d8);
	opacity: 0.75;
	font-weight: 600;
}
.wl-bcontact .wl-bstory__contact-row {
	flex-direction: column;
	align-items: flex-start;
	gap: 0.25rem;
	color: var(--wp--preset--color--paper, #f2e6d8);
	border-bottom-color: rgba(255, 255, 255, 0.18);
	word-break: break-word;
}
.wl-bcontact .wl-bstory__contact-v { word-break: break-word; overflow-wrap: anywhere; }
.wl-bcontact .wl-bstory__contact-row:hover { color: var(--wp--preset--color--paper, #f2e6d8); }
.wl-bcontact .wl-bstory__contact-k { opacity: 0.65; }
.wl-bcontact .wl-bstory__contact-cta {
	background: var(--wp--preset--color--paper, #f2e6d8);
	color: var(--wp--preset--color--mauve-dark, #5e4770);
}

/* Right-column thumbnail gallery (under stats + contact). */
.wl-thumbs { margin-top: 1.25rem; }
.wl-thumbs .wp-block-gallery { gap: 0.5rem; margin: 0; }
.wl-thumbs .wp-block-image img {
	border-radius: 6px;
	transition: transform 200ms ease;
}
.wl-thumbs .wp-block-image:hover img { transform: scale(1.03); }
