/* ═══════════════════════════════════════════════════════
   Story Page — editorial magazine layout
   Palette: #F5EBE9 blush · #2A4345 teal · #DCCCA3 gold · #E6D2CC pink · #E6FE6E lime
   ═══════════════════════════════════════════════════════ */

:root {
	--wf-teal:  #2A4345;
	--wf-blush: #F5EBE9;
	--wf-gold:  #DCCCA3;
	--wf-pink:  #E6D2CC;
	--wf-lime:  #E6FE6E;
	--wf-serif: 'Alegreya', Georgia, serif;
	--wf-sans:  'Alegreya Sans', sans-serif;
	--wf-body:  'Lora', Georgia, serif;
}

.wf-story {
	background: var(--wf-blush);
	color: var(--wf-teal);
}

/* ── Shared tokens ── */
.wf-eyebrow {
	display: block;
	font-family: var(--wf-sans);
	font-size: 1.08rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wf-gold);
}

.wf-meta {
	font-family: var(--wf-sans);
	font-size: 1.23rem;
	letter-spacing: 0.06em;
	color: rgba(245,235,233,0.45);
}

/* ── HERO: split column ── */
.wf-story-hero {
	display: grid;
	grid-template-columns: 4fr 6fr;
	min-height: 100vh;
}

.wf-story-hero__text {
	background: var(--wf-teal);
	padding: clamp(3rem, 8vw, 7rem) clamp(2rem, 5vw, 5rem);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 1.5rem;
}

.wf-display {
	font-family: var(--wf-serif);
	font-size: clamp(5.25rem, 10.5vw, 11.25rem);
	font-weight: 900;
	line-height: 0.9;
	letter-spacing: -0.02em;
	color: var(--wf-pink);
	margin: 0;
	animation: wf-reveal-up 1.2s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes wf-reveal-up {
	from { opacity: 0; transform: translateY(40px); }
	to   { opacity: 1; transform: none; }
}

/* Hero CTA button — lime on teal */
.wf-hero-cta {
	display: inline-block;
	margin-top: 0.5rem;
	padding: 0.85rem 2.25rem;
	background: var(--wf-lime);
	color: var(--wf-teal);
	font-family: var(--wf-sans);
	font-size: 1.2rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-decoration: none;
	border-radius: 2px;
	transition: background 180ms ease, transform 180ms ease;
	align-self: flex-start;
}

.wf-hero-cta:hover {
	background: #fff;
	transform: translateY(-2px);
}

.wf-story-hero__image {
	position: relative;
	overflow: hidden;
}

.wf-story-hero__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transform: scale(1.04);
	transition: transform 1.4s ease;
}

@media (hover: hover) and (pointer: fine) {
	.wf-story-hero__image:hover img { transform: scale(1); }
}

.wf-story-hero__placeholder {
	width: 100%;
	height: 100%;
	background: rgba(42,67,69,0.12);
}

/* ── PEEK STRIP ── */
.wf-section {
	padding: clamp(2rem, 4vw, 3.5rem);
	background: var(--wf-blush);
}

.wf-strip-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.25rem;
}

/* "From the shoot" — pink banner + strip */
.wf-peek-section {
	padding: 0;
}

.wf-strip-header {
	background: var(--wf-pink);
	padding: 1.25rem clamp(2rem, 4vw, 3.5rem);
	margin-bottom: 0;
}

/* Label: pink text on teal badge */
.wf-peek-section .wf-eyebrow {
	display: inline-flex;
	align-items: center;
	background: var(--wf-teal);
	color: var(--wf-pink);
	font-size: 1rem;
	letter-spacing: 0.14em;
	padding: 0.45rem 1.1rem;
	border-radius: 3px;
}

/* Arrows: teal circle, pink arrow characters */
.wf-peek-section .wf-peek-btn {
	background: var(--wf-teal);
	color: var(--wf-pink);
	border: none;
}

.wf-peek-section .wf-peek-btn:hover {
	background: rgba(42,67,69,0.78);
	color: var(--wf-pink);
	transform: scale(1.06);
}

.wf-peek-section .wf-peek-btn:active {
	background: var(--wf-teal);
	color: var(--wf-pink);
	transform: scale(0.97);
}

.wf-peek-section .wf-peek-progress {
	background: rgba(42,67,69,0.18);
}

.wf-peek-section .wf-peek-progress__fill {
	background: var(--wf-teal);
}

/* Strip continues the pink background */
.wf-peek-strip {
	background: var(--wf-pink);
	padding: 1.25rem clamp(2rem, 4vw, 3.5rem);
}

.wf-hint {
	font-family: var(--wf-sans);
	font-size: 1.125rem;
	letter-spacing: 0.1em;
	color: rgba(42,67,69,0.35);
}

.wf-peek-strip {
	display: flex;
	gap: 0.85rem;
	overflow-x: scroll;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-right: 25vw;
	cursor: grab;
	user-select: none;
}

.wf-peek-strip::-webkit-scrollbar { display: none; }
.wf-peek-strip.is-dragging { cursor: grabbing; }

.wf-peek-item {
	flex: 0 0 30vw;
	scroll-snap-align: start;
	position: relative;
	overflow: hidden;
	border-radius: 2px;
	cursor: pointer;
}

.wf-peek-item img {
	width: 100%;
	height: auto;
	display: block;
	transition: transform 500ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

@media (hover: hover) and (pointer: fine) {
	.wf-peek-item:hover img {
		transform: scale(1.04);
	}
}

/* ① Delight: caption slides up from below image on hover */
.wf-peek-item figcaption {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(to top, rgba(18,30,30,0.88) 0%, transparent 100%);
	color: var(--wf-blush);
	font-family: var(--wf-body);
	font-style: italic;
	font-size: 1rem;
	padding: 2rem 1rem 0.85rem;
	margin: 0;
	transform: translateY(100%);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.wf-peek-item:focus-visible figcaption {
	transform: translateY(0);
}

@media (hover: hover) and (pointer: fine) {
	.wf-peek-item:hover figcaption {
		transform: translateY(0);
	}
}

/* ── MAGAZINE GRID ── */
.wf-grid-section {
	background: var(--wf-teal);
	max-width: 1500px;
	margin-left: auto;
	margin-right: auto;
}

.wf-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-flow: row dense;
	gap: 1px;
	background: rgba(245,235,233,0.07);
	/* contain expanded images so they don't bleed outside the grid */
	overflow: hidden;
}

/* All panels */
.wf-panel { background: var(--wf-teal); overflow: hidden; position: relative; }

/* Image panels: let the image overflow its cell so zoom crosses into neighbours */
.wf-panel--img { overflow: visible; z-index: 1; }
.wf-panel--img:hover  { z-index: 2; }
.wf-panel--img.is-exp { z-index: 3; }

.wf-panel--img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	aspect-ratio: 3 / 4;
	/* slow, gooey ease-out — organic, no bounce */
	transition: transform 800ms cubic-bezier(0.23, 1, 0.32, 1);
}

.wf-panel--tall img { aspect-ratio: 2 / 3; }

/* Directional zoom: left panel grows rightward, right panel grows leftward */
.wf-panel--left  img { transform-origin: left center; }
.wf-panel--right img { transform-origin: right center; }

/* Hover: image crosses into neighbour space (larger scale since overflow: visible) */
.wf-panel--img.is-exp img { transform: scale(1.28); }

@media (hover: hover) and (pointer: fine) {
	.wf-panel--img:hover img { transform: scale(1.22); }
}

/* Panel overlay hint */
.wf-panel__over {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	padding: 0.9rem;
	opacity: 0;
	transition: opacity 300ms ease;
	pointer-events: none;
}

.wf-panel--img:hover .wf-panel__over { opacity: 1; }

/* ⑤ Delight: expand badge — lime pop + scale on hover */
.wf-exp-btn {
	background: rgba(230,254,110,0.15);
	backdrop-filter: blur(6px);
	border: 1px solid rgba(230,254,110,0.35);
	color: var(--wf-lime);
	font-family: var(--wf-sans);
	font-size: 1.05rem;
	letter-spacing: 0.08em;
	padding: 0.35rem 0.75rem;
	border-radius: 2px;
	transition: background 180ms ease, transform 220ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

.wf-panel--img:hover .wf-exp-btn {
	transform: scale(1.08);
	background: rgba(230,254,110,0.28);
}

/* Text panel */
.wf-panel--text {
	padding: clamp(2rem, 4vw, 3.5rem);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 1.1rem;
}

.wf-panel--text p {
	font-family: var(--wf-body);
	font-size: clamp(1.38rem, 1.73vw, 1.58rem);
	line-height: 1.85;
	color: rgba(245,235,233,0.75);
	margin: 0;
}

/* Pull quote */
.wf-panel--quote {
	grid-column: span 3;
	padding: clamp(4rem, 8vw, 7rem) clamp(2rem, 5vw, 5rem);
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(245,235,233,0.03);
}

.wf-pullquote {
	font-family: var(--wf-serif);
	font-style: italic;
	font-size: clamp(2.25rem, 5.25vw, 4.5rem);
	line-height: 1.3;
	color: var(--wf-pink);
	text-align: center;
	max-width: 22ch;
	margin: 0;
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 1s ease, transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}

.wf-pullquote.revealed {
	opacity: 1;
	transform: none;
}

/* Meta panel — base */
.wf-panel--meta {
	padding: clamp(2rem, 4vw, 3.5rem);
	background: rgba(245,235,233,0.03);
	display: flex;
	align-items: center;
}

/* Meta panel — full-width 50/50 variant (story left, details right) */
.wf-panel--meta-full {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(2.5rem, 5vw, 6rem);
	padding: clamp(2.5rem, 5vw, 4.5rem) clamp(2rem, 5vw, 5rem);
	background: rgba(245,235,233,0.04);
	align-items: start;
}

/* Left column: story snippet */
.wf-meta-story {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.wf-meta-story__label {
	font-family: var(--wf-sans);
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--wf-lime);
}

.wf-meta-story__text {
	font-family: var(--wf-body);
	font-size: clamp(1.35rem, 1.75vw, 1.6rem);
	line-height: 1.85;
	color: rgba(245,235,233,0.72);
	margin: 0;
}

.wf-meta-story__cta {
	display: inline-block;
	margin-top: 0.5rem;
	font-family: var(--wf-sans);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wf-gold);
	text-decoration: none;
	transition: letter-spacing 200ms ease;
}

.wf-meta-story__cta:hover { letter-spacing: 0.12em; }

/* Right column: detail DL */
.wf-panel--meta-full dl {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.75rem 1.5rem;
	align-items: baseline;
	width: 100%;
	margin: 0;
	padding: 0;
}

.wf-panel--meta dl,
.wf-panel--meta-full dl { /* shared dt/dd styles */
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.75rem 1.5rem;
	align-items: baseline;
	width: 100%;
}

.wf-panel--meta dt {
	font-family: var(--wf-sans);
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wf-gold);
}

.wf-panel--meta dd {
	font-family: var(--wf-body);
	font-size: 1.35rem;
	color: rgba(245,235,233,0.65);
	margin: 0;
}

/* ④ Delight: meta "View →" — arrow nudges right on hover */
.wf-panel--meta a,
.wf-panel--meta-full a {
	color: var(--wf-gold);
	display: inline-block;
	transition: letter-spacing 200ms ease;
}

.wf-panel--meta a:hover,
.wf-panel--meta-full a:hover {
	letter-spacing: 0.04em;
}

@media (max-width: 700px) {
	.wf-panel--meta-full {
		grid-template-columns: 1fr;
	}
}

/* ── Panel in-grid nav arrows — hidden (removed from UI) ── */
.wf-panel__nav {
	display: none !important;
	position: absolute;
	bottom: 1.1rem;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 0.65rem;
	z-index: 3;
	opacity: 0;
	transition: opacity 200ms ease;
	pointer-events: none;
}

.wf-panel--img:hover .wf-panel__nav,
.wf-panel--img.is-exp .wf-panel__nav {
	opacity: 1;
	pointer-events: auto;
}

.wf-panel__nav-btn {
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	background: var(--wf-lime);
	color: var(--wf-teal);
	border: none;
	font-size: 1.1rem;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 220ms cubic-bezier(0.34, 1.56, 0.64, 1), background 180ms ease;
	box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

.wf-panel__nav-btn:hover        { transform: scale(1.14); background: #fff; }
.wf-panel__nav-btn:active       { transform: scale(0.94); background: var(--wf-lime); }
.wf-panel__nav-btn:focus        { outline: none; box-shadow: none; }
.wf-panel__nav-btn:focus-visible { outline: 2px solid var(--wf-teal); outline-offset: 3px; box-shadow: none; }
.wf-panel__nav-btn              { -webkit-tap-highlight-color: transparent; }

/* ── Below-fold inner wrapper — aligned with grid gutters ── */
.wf-story-inner {
	max-width: 1500px;
	margin: 0 auto;
	padding: clamp(2.5rem, 6vw, 5rem) clamp(2rem, 5vw, 4.5rem);
	display: flex;
	flex-direction: column;
	gap: clamp(3rem, 6vw, 5rem);
}

/* ── Vendor Credits ── */
.wf-story-vendors h2 {
	font-family: var(--wf-serif);
	font-size: clamp(1.25rem, 2vw, 1.75rem);
	color: var(--wf-teal);
	margin: 0 0 1.25rem;
}

.wf-story-vendors-list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid rgba(42,67,69,0.15);
}

/* ② Delight: vendor rows — lime left bar slides in on hover */
.wf-story-vendors-list li {
	font-family: var(--wf-body);
	font-size: 1.5rem;
	padding: 0.6rem 0 0.6rem 0;
	border-bottom: 1px solid rgba(42,67,69,0.15);
	border-left: 2px solid transparent;
	transition: border-left-color 220ms ease, padding-left 220ms ease;
}

.wf-story-vendors-list li:hover {
	border-left-color: var(--wf-lime);
	padding-left: 0.65rem;
}

.wf-story-vendor-role {
	font-family: var(--wf-sans);
	font-size: 1.125rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(42,67,69,0.45);
	margin-right: 0.4rem;
}

.wf-story-vendors-list a {
	color: var(--wf-teal);
	text-decoration: underline;
	text-decoration-color: rgba(42,67,69,0.3);
}

.wf-story-vendor-social { margin-left: 0.5rem; font-size: 0.88em; }

/* ── FAQ ── */
.wf-story-faq { max-width: 72ch; }

.wf-story-faq h2 {
	font-family: var(--wf-serif);
	font-size: clamp(1.25rem, 2vw, 1.75rem);
	color: var(--wf-teal);
	margin: 0 0 1.5rem;
}

.wf-story-faq-list {
	margin: 0;
	border-top: 1px solid rgba(42,67,69,0.15);
}

/* ③ Delight: FAQ rows — lime tint wash on hover */
.wf-story-faq-item {
	border-bottom: 1px solid rgba(42,67,69,0.15);
	padding: 1.1rem 0.75rem;
	margin: 0 -0.75rem;
	border-radius: 3px;
	transition: background 200ms ease;
}

.wf-story-faq-item:hover {
	background: rgba(230,254,110,0.07);
}

.wf-story-faq-item dt {
	font-family: var(--wf-body);
	font-size: clamp(1.5rem, 2.1vw, 1.65rem);
	font-weight: 600;
	color: var(--wf-teal);
	margin-bottom: 0.5rem;
}

.wf-story-faq-item dd {
	font-family: var(--wf-body);
	font-size: 1.5rem;
	line-height: 1.8;
	color: rgba(42,67,69,0.72);
	margin: 0;
}

/* ── CTA ── */
.wf-story-cta {
	background: var(--wf-teal);
	color: var(--wf-blush);
	border-radius: 4px;
	padding: clamp(2.5rem, 5vw, 4rem);
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}

.wf-story-cta-headline {
	font-family: var(--wf-serif);
	font-size: clamp(2.25rem, 3.75vw, 3.375rem);
	color: var(--wf-gold);
	margin: 0;
}

.wf-story-cta-body {
	font-family: var(--wf-body);
	font-size: 1.575rem;
	line-height: 1.7;
	opacity: 0.85;
	max-width: 55ch;
	margin: 0;
}

.wf-story-cta-button {
	display: inline-block;
	margin-top: 0.5rem;
	padding: 0.85rem 2.25rem;
	background: var(--wf-lime);
	color: var(--wf-teal);
	font-family: var(--wf-sans);
	font-size: 1.425rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-decoration: none;
	border-radius: 2px;
	transition: background 180ms ease, transform 180ms ease;
}

.wf-story-cta-button:hover {
	background: #fff;
	transform: translateY(-2px);
}

/* ── WP editor content ── */
.wf-story-content {
	font-family: var(--wf-body);
	font-size: 1.05rem;
	line-height: 1.8;
	max-width: 72ch;
}

/* ── Lightbox ── */

/* Some themes/plugins reset <dialog> to display:block — force it hidden when closed */
.wf-story-lightbox:not([open]) {
	display: none !important;
	visibility: hidden !important;
}

.wf-story-lightbox {
	border: none;
	background: #111e1f;
	padding: 3.5rem 1.5rem 1.5rem;
	width: min(96vw, 1500px);
	max-height: 96vh;
	box-shadow: 0 32px 100px rgba(0,0,0,0.7);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	/* Explicit fixed centering in case browser/theme overrides showModal() positioning */
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	margin: 0;
	z-index: 99999;
	box-sizing: border-box;
}

.wf-story-lightbox::backdrop {
	background: rgba(8,14,14,0.92);
	backdrop-filter: blur(6px);
}

/* ── Lightbox buttons: kill every browser/theme pink source ── */
.wf-story-lightbox button {
	appearance: none;
	-webkit-appearance: none;
	-webkit-tap-highlight-color: transparent;
	outline: none;
	box-shadow: none;
}

/* Close button — top-right, lime square */
.wf-story-lightbox__close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	background: transparent;
	border: 2px solid var(--wf-lime);
	color: var(--wf-lime) !important;
	font-size: 1.25rem;
	line-height: 1;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 2px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 160ms ease, color 160ms ease;
	z-index: 2;
	padding: 0;
}

.wf-story-lightbox__close:hover,
.wf-story-lightbox__close:focus-visible {
	background: var(--wf-lime);
	color: var(--wf-teal) !important;
	outline: none;
}

.wf-story-lightbox__close:active {
	background: var(--wf-lime);
	color: var(--wf-teal) !important;
	outline: none;
}

/* Inner: prev — image — next */
.wf-story-lightbox__inner {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	width: 100%;
	flex: 1;
	min-height: 0;
}

.wf-story-lightbox__stage {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	min-width: 0;
}

.wf-story-lightbox__img {
	display: block;
	max-width: 100%;
	max-height: calc(96vh - 10rem);
	object-fit: contain;
	border-radius: 2px;
}

.wf-story-lightbox__caption {
	font-family: var(--wf-body);
	font-style: italic;
	font-size: 1.05rem;
	color: rgba(245,235,233,0.5);
	text-align: center;
	margin: 0;
	padding: 0 1rem;
}

/* Lime circle nav buttons with teal arrow — matches peek strip arrows */
.wf-story-lightbox__nav {
	flex-shrink: 0;
	width: 4.5rem;
	height: 4.5rem;
	border-radius: 50%;
	background: var(--wf-lime) !important;
	color: var(--wf-teal) !important;
	border: none;
	font-size: 1.5rem;
	font-weight: 700;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 180ms cubic-bezier(0.34, 1.56, 0.64, 1), background 180ms ease;
	line-height: 1;
	appearance: none;
	-webkit-appearance: none;
	-webkit-tap-highlight-color: transparent;
}

.wf-story-lightbox__nav:hover         { transform: scale(1.1); background: #fff !important; color: var(--wf-teal) !important; }
.wf-story-lightbox__nav:active        { background: var(--wf-lime) !important; color: var(--wf-teal) !important; transform: scale(0.96); outline: none; box-shadow: none; }
.wf-story-lightbox__nav:focus         { outline: none !important; box-shadow: none !important; }
.wf-story-lightbox__nav:focus-visible { outline: 2px solid rgba(230,254,110,0.6) !important; outline-offset: 3px; box-shadow: none; }

.wf-story-lightbox__nav:disabled {
	opacity: 0.2;
	cursor: default;
	transform: none;
}

/* Counter — bottom center */
.wf-story-lightbox__counter {
	font-family: var(--wf-sans);
	font-size: 0.78rem;
	letter-spacing: 0.12em;
	color: rgba(245,235,233,0.35);
	text-align: center;
}

/* Responsive */
@media (max-width: 600px) {
	.wf-story-lightbox__nav {
		width: 3rem;
		height: 3rem;
		font-size: 1.1rem;
	}
	.wf-story-lightbox__inner { gap: 0.5rem; }
}

/* ── Responsive ── */
@media (max-width: 900px) {
	.wf-story-hero {
		grid-template-columns: 1fr;
		min-height: auto;
	}

	/* Photo first on mobile — removes dominant green-wall at top */
	.wf-story-hero__image {
		order: -1;
		height: 64vw;
		min-height: 240px;
	}

	/* Text anchored to top, not bottom, so it reads immediately after the photo */
	.wf-story-hero__text {
		padding: clamp(1.5rem, 5vw, 2.4rem) clamp(1.25rem, 5vw, 2rem);
		justify-content: flex-start;
		gap: 0.75rem;
	}

	.wf-grid { grid-template-columns: 1fr 1fr; }
	.wf-panel--quote {
		grid-column: span 2;
		padding: 2.75rem 1.5rem;
	}
	.wf-peek-item { flex: 0 0 60vw; }
}

@media (max-width: 540px) {
	.wf-grid { grid-template-columns: 1fr; }
	.wf-panel--quote { grid-column: span 1; }
	.wf-peek-item { flex: 0 0 88vw; }

	.wf-display { font-size: clamp(3.5rem, 13vw, 5.5rem); }
}

/* ── Mobile delight: arrow nudge + panel stagger ── */

@keyframes wf-arrow-nudge {
	0%, 65%, 100% { transform: none; }
	72%  { transform: translateX(7px) scale(1.12); }
	82%  { transform: translateX(-2px) scale(1.02); }
	90%  { transform: translateX(5px) scale(1.07); }
	96%  { transform: translateX(0) scale(1.03); }
}

@media (max-width: 900px) {
	/* Next arrow gently nudges right after 2s, hinting it's tappable */
	.wf-peek-btn--next:not(:disabled):not(.no-nudge) {
		animation: wf-arrow-nudge 3.5s ease-in-out 2s infinite;
	}

	/* Grid + masonry panels: staggered fade-lift as they scroll into view */
	.wf-panel,
	.wf-masonry-item {
		opacity: 0;
		transform: translateY(16px);
		transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
		transition-delay: var(--wf-stagger, 0ms);
	}
	.wf-panel.wf-in,
	.wf-masonry-item.wf-in {
		opacity: 1;
		transform: none;
	}
}

/* ── Peek controls ── */
.wf-peek-controls {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.wf-peek-btn {
	flex: 0 0 auto;
	background: var(--wf-teal);
	color: var(--wf-blush);
	border: none;
	width: 9rem;
	height: 9rem;
	border-radius: 50%;
	font-size: 3.3rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 180ms ease, transform 180ms ease;
	user-select: none;
	line-height: 1;
}

.wf-peek-btn:hover         { background: rgba(42,67,69,0.75); transform: scale(1.06); }
.wf-peek-btn:active        { background: rgba(42,67,69,0.9); transform: scale(0.97); }
.wf-peek-btn:focus         { outline: none; box-shadow: none; }
.wf-peek-btn:focus-visible { outline: 2px solid rgba(42,67,69,0.4); outline-offset: 3px; box-shadow: none; }
.wf-peek-btn               { -webkit-tap-highlight-color: transparent; }

.wf-peek-btn:disabled {
	opacity: 0.2;
	cursor: default;
	transform: none;
}

.wf-peek-progress {
	flex: 1;
	height: 2px;
	background: rgba(42,67,69,0.15);
	border-radius: 2px;
	overflow: hidden;
}

.wf-peek-progress__fill {
	height: 100%;
	background: var(--wf-teal);
	border-radius: 2px;
	width: 0%;
	transition: width 120ms ease;
}

/* ── Masonry gallery ── */
.wf-masonry-section {
	background: var(--wf-teal);
}

.wf-masonry {
	columns: 3;
	column-gap: 1px;
	line-height: 0;
}

.wf-masonry-item {
	break-inside: avoid;
	margin-bottom: 1px;
	position: relative;
	overflow: hidden;
	cursor: pointer;
	display: block;
	line-height: 0; /* remove gap under inline images */
	/* restore normal line-height for caption children */
}

.wf-masonry-item figcaption { line-height: 1.5; }

.wf-masonry-item img {
	width: 100%;
	display: block;
	transition: transform 700ms cubic-bezier(0.23, 1, 0.32, 1);
}

/* Caption slides up on hover (matches peek strip behaviour) */
.wf-masonry-item figcaption {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(to top, rgba(18,30,30,0.88) 0%, transparent 100%);
	color: var(--wf-blush);
	font-family: var(--wf-body);
	font-style: italic;
	font-size: 1rem;
	line-height: 1.5;
	padding: 2.5rem 1rem 1rem;
	margin: 0;
	transform: translateY(100%);
	transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.wf-masonry-item:focus-visible figcaption {
	transform: translateY(0);
}

@media (hover: hover) and (pointer: fine) {
	.wf-masonry-item:hover img {
		transform: scale(1.04);
	}

	.wf-masonry-item:hover figcaption {
		transform: translateY(0);
	}
}

.wf-peek-item:focus-visible,
.wf-panel--img:focus-visible,
.wf-masonry-item:focus-visible,
.wf-story-img:focus-visible {
	outline: 2px solid var(--wf-lime);
	outline-offset: 3px;
}

@media (max-width: 900px) { .wf-masonry { columns: 2; } }
@media (max-width: 540px) { .wf-masonry { columns: 1; } }

/* ═══════════════════════════════════════════════════════
   Breadcrumb (single + archive)
   ═══════════════════════════════════════════════════════ */

.wf-breadcrumb {
	font-family: var(--wf-sans);
	font-size: 1rem;
	letter-spacing: 0.06em;
	padding: 1.25rem clamp(1.5rem, 4vw, 3rem);
	color: rgba(42,67,69,0.45);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem 0.5rem;
}

.wf-breadcrumb a {
	color: var(--wf-teal);
	text-decoration: none;
	opacity: 0.65;
	transition: opacity 150ms ease;
}

.wf-breadcrumb a:hover { opacity: 1; }

.wf-breadcrumb [aria-hidden] { opacity: 0.3; }

/* ═══════════════════════════════════════════════════════
   Archive page
   ═══════════════════════════════════════════════════════ */

.wf-archive {
	background: var(--wf-blush);
	color: var(--wf-teal);
	min-height: 60vh;
}

/* Header */
.wf-archive-header {
	padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 5vw, 4rem) clamp(2rem, 4vw, 3rem);
	max-width: 1500px;
	margin: 0 auto;
}

.wf-archive-title {
	font-family: var(--wf-serif);
	font-size: clamp(3rem, 7vw, 7.5rem);
	font-weight: 900;
	line-height: 0.95;
	letter-spacing: -0.02em;
	color: var(--wf-teal);
	margin: 0.4rem 0 0;
}

.wf-archive-desc {
	font-family: var(--wf-body);
	font-size: clamp(1.1rem, 1.6vw, 1.35rem);
	line-height: 1.75;
	color: rgba(42,67,69,0.65);
	max-width: 60ch;
	margin-top: 1.25rem;
}

/* Filter rows */
.wf-archive-filters {
	padding: 0 clamp(1.5rem, 5vw, 4rem) clamp(2rem, 3vw, 2.5rem);
	max-width: 1500px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}

.wf-filter-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.wf-filter-label {
	font-family: var(--wf-sans);
	font-size: 0.9rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(42,67,69,0.4);
	margin-right: 0.25rem;
	min-width: 5.5rem;
}

.wf-filter-tag {
	font-family: var(--wf-sans);
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	padding: 0.35rem 0.9rem;
	border: 1.5px solid rgba(42,67,69,0.25);
	border-radius: 999px;
	color: var(--wf-teal);
	text-decoration: none;
	transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
}

.wf-filter-tag:hover {
	background: rgba(42,67,69,0.08);
	border-color: var(--wf-teal);
}

.wf-filter-tag.is-active {
	background: var(--wf-teal);
	border-color: var(--wf-teal);
	color: var(--wf-blush);
}

/* ── Story card grid ── */
.wf-archive-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(1.5rem, 2.5vw, 2.5rem);
	padding: clamp(1.5rem, 4vw, 3rem) clamp(1.5rem, 5vw, 4rem) clamp(3rem, 6vw, 5rem);
	max-width: 1500px;
	margin: 0 auto;
}

.wf-archive-grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.wf-archive-grid--cols-4 { grid-template-columns: repeat(4, 1fr); }

/* Story card */
.wf-story-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 3px;
	overflow: hidden;
	transition: transform 300ms cubic-bezier(0.34, 1.56, 0.64, 1),
	            box-shadow 300ms ease;
}

.wf-story-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 48px rgba(42,67,69,0.14);
}

.wf-story-card.is-featured {
	grid-column: span 2;
}

.wf-story-card__img-wrap {
	display: block;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--wf-pink);
}

.wf-story-card.is-featured .wf-story-card__img-wrap {
	aspect-ratio: 16 / 9;
}

.wf-story-card__img-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 500ms cubic-bezier(0.34, 1.56, 0.64, 1);
}

.wf-story-card:hover .wf-story-card__img-wrap img {
	transform: scale(1.04);
}

.wf-story-card__img-placeholder {
	width: 100%;
	height: 100%;
	background: var(--wf-pink);
}

.wf-story-card__body {
	padding: 1.5rem 1.75rem 1.75rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	flex: 1;
}

.wf-story-card__terms {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 0.6rem;
	align-items: center;
}

.wf-story-card__type {
	display: inline;
	font-size: 0.82rem;
	color: var(--wf-gold);
	text-decoration: none;
}

.wf-story-card__location-tag {
	font-family: var(--wf-sans);
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	color: rgba(42,67,69,0.45);
	text-decoration: none;
	text-transform: uppercase;
}

.wf-story-card__location-tag::before {
	content: '·';
	margin-right: 0.4rem;
}

.wf-story-card__title {
	font-family: var(--wf-serif);
	font-size: clamp(1.25rem, 1.8vw, 1.6rem);
	font-weight: 700;
	line-height: 1.2;
	color: var(--wf-teal);
	margin: 0.25rem 0 0;
}

.wf-story-card__title a {
	color: inherit;
	text-decoration: none;
}

.wf-story-card__title a:hover {
	text-decoration: underline;
	text-decoration-color: rgba(42,67,69,0.3);
}

.wf-story-card__place {
	font-family: var(--wf-sans);
	font-size: 0.95rem;
	color: rgba(42,67,69,0.5);
	margin: 0;
	letter-spacing: 0.04em;
}

.wf-story-card__excerpt {
	font-family: var(--wf-body);
	font-size: 1.05rem;
	line-height: 1.7;
	color: rgba(42,67,69,0.68);
	margin: 0.25rem 0 0;
}

.wf-story-card__cta {
	display: inline-block;
	margin-top: auto;
	padding-top: 1rem;
	font-family: var(--wf-sans);
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	color: var(--wf-teal);
	text-decoration: none;
	text-transform: uppercase;
	transition: letter-spacing 200ms ease;
}

.wf-story-card__cta:hover { letter-spacing: 0.1em; }

/* Empty state */
.wf-archive-empty {
	padding: clamp(3rem, 8vw, 6rem) clamp(1.5rem, 5vw, 4rem);
	font-family: var(--wf-body);
	font-size: 1.35rem;
	color: rgba(42,67,69,0.45);
	text-align: center;
}

/* Pagination */
.wf-archive .nav-links {
	display: flex;
	justify-content: center;
	gap: 0.75rem;
	padding: 2rem clamp(1.5rem, 5vw, 4rem) clamp(3rem, 6vw, 5rem);
	font-family: var(--wf-sans);
	font-size: 1rem;
}

.wf-archive .nav-links a,
.wf-archive .nav-links span {
	padding: 0.5rem 1.25rem;
	border: 1.5px solid rgba(42,67,69,0.2);
	border-radius: 2px;
	color: var(--wf-teal);
	text-decoration: none;
	transition: background 150ms ease;
}

.wf-archive .nav-links a:hover { background: rgba(42,67,69,0.07); }
.wf-archive .nav-links .current { background: var(--wf-teal); color: var(--wf-blush); border-color: var(--wf-teal); }

/* ── Related stories (bottom of single) ── */
.wf-story-related {
	background: var(--wf-blush);
	padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 5vw, 4rem);
}

.wf-story-related__header {
	max-width: 1500px;
	margin: 0 auto clamp(1.5rem, 3vw, 2.5rem);
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}

.wf-story-related__header h2 {
	font-family: var(--wf-serif);
	font-size: clamp(1.5rem, 2.5vw, 2.25rem);
	color: var(--wf-teal);
	margin: 0;
}

.wf-story-related__all {
	font-family: var(--wf-sans);
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wf-teal);
	text-decoration: none;
	opacity: 0.55;
	transition: opacity 150ms ease;
}

.wf-story-related__all:hover { opacity: 1; }

.wf-story-related__grid {
	max-width: 1500px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(1rem, 2vw, 2rem);
}

/* Responsive */
@media (max-width: 1024px) {
	.wf-archive-grid { grid-template-columns: repeat(2, 1fr); }
	.wf-archive-grid--cols-4 { grid-template-columns: repeat(2, 1fr); }
	.wf-story-card.is-featured { grid-column: span 2; }
}

@media (max-width: 700px) {
	.wf-archive-grid,
	.wf-archive-grid--cols-2,
	.wf-archive-grid--cols-4,
	.wf-story-related__grid { grid-template-columns: 1fr; }
	.wf-story-card.is-featured { grid-column: span 1; }
	.wf-story-card.is-featured .wf-story-card__img-wrap { aspect-ratio: 4 / 3; }
	.wf-filter-label { min-width: auto; }
}

/* ═══════════════════════════════════════════════════════
   Testimonial cards (reviews page, story embed, shortcode)
   ═══════════════════════════════════════════════════════ */

/* ── Reviews page ── */
.wf-reviews-page {
	background: var(--wf-blush);
	color: var(--wf-teal);
	min-height: 60vh;
}

.wf-reviews-header {
	padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 5vw, 4rem) clamp(2rem, 4vw, 3rem);
	max-width: 1500px;
	margin: 0 auto;
}

.wf-reviews-title {
	font-family: var(--wf-serif);
	font-size: clamp(3rem, 7vw, 7.5rem);
	font-weight: 900;
	line-height: 0.95;
	letter-spacing: -0.02em;
	color: var(--wf-teal);
	margin: 0.4rem 0 1.25rem;
}

.wf-reviews-aggregate {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
}

.wf-reviews-aggregate__stars {
	font-size: 1.6rem;
	color: var(--wf-gold);
	letter-spacing: 0.05em;
}

.wf-reviews-aggregate__score {
	font-family: var(--wf-serif);
	font-size: 2rem;
	font-weight: 700;
	color: var(--wf-teal);
}

.wf-reviews-aggregate__count {
	font-family: var(--wf-sans);
	font-size: 1rem;
	color: rgba(42,67,69,0.5);
	letter-spacing: 0.04em;
}

.wf-reviews-platforms {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	margin-top: 1rem;
}

.wf-reviews-platforms__label {
	font-family: var(--wf-sans);
	font-size: 0.9rem;
	color: rgba(42,67,69,0.45);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.wf-reviews-platform-link {
	font-family: var(--wf-sans);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--wf-teal);
	text-decoration: none;
	padding: 0.3rem 0.85rem;
	border: 1.5px solid rgba(42,67,69,0.25);
	border-radius: 999px;
	transition: background 150ms ease, border-color 150ms ease;
}

.wf-reviews-platform-link:hover {
	background: rgba(42,67,69,0.07);
	border-color: var(--wf-teal);
}

/* Reviews grid */
.wf-reviews-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(1.25rem, 2vw, 2rem);
	padding: 0 clamp(1.5rem, 5vw, 4rem) clamp(4rem, 7vw, 6rem);
	max-width: 1500px;
	margin: 0 auto;
}

.wf-reviews-empty {
	padding: clamp(3rem, 8vw, 6rem) clamp(1.5rem, 5vw, 4rem);
	font-family: var(--wf-body);
	font-size: 1.35rem;
	color: rgba(42,67,69,0.45);
	text-align: center;
}

/* ── Testimonial card (shared across all contexts) ── */
.wf-tm-card {
	background: #fff;
	border-radius: 3px;
	padding: clamp(1.5rem, 2.5vw, 2.25rem);
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.wf-tm-card--grid {
	box-shadow: 0 2px 16px rgba(42,67,69,0.07);
	transition: transform 300ms cubic-bezier(0.34, 1.56, 0.64, 1),
	            box-shadow 300ms ease;
}

.wf-tm-card--grid:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 40px rgba(42,67,69,0.13);
}

.wf-tm-card__photo {
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	overflow: hidden;
	flex-shrink: 0;
}

.wf-tm-card__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.wf-tm-card__stars {
	font-size: 1.2rem;
	color: var(--wf-gold);
	letter-spacing: 0.04em;
	line-height: 1;
}

.wf-tm-card__quote {
	font-family: var(--wf-serif);
	font-style: italic;
	font-size: clamp(1.1rem, 1.5vw, 1.3rem);
	line-height: 1.65;
	color: var(--wf-teal);
	margin: 0;
	flex: 1;
}

.wf-tm-card__quote::before { content: '\201C'; }
.wf-tm-card__quote::after  { content: '\201D'; }

.wf-tm-card__reviewer {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	padding-top: 0.5rem;
	border-top: 1px solid rgba(42,67,69,0.1);
}

.wf-tm-card__name {
	font-family: var(--wf-sans);
	font-size: 1rem;
	font-weight: 700;
	color: var(--wf-teal);
}

.wf-tm-card__event {
	display: block;
	font-family: var(--wf-sans);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wf-teal);
	opacity: 0.55;
	margin-top: 0.15em;
	margin-bottom: 0.1em;
}

.wf-tm-card__meta {
	font-family: var(--wf-sans);
	font-size: 0.9rem;
	color: rgba(42,67,69,0.55);
}

.wf-tm-card__meta a {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: rgba(42,67,69,0.25);
}

.wf-tm-card__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
	margin-top: 0.25rem;
}

.wf-tm-card__story-link,
.wf-tm-card__ext-link {
	font-family: var(--wf-sans);
	font-size: 0.88rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-decoration: none;
	transition: opacity 150ms ease;
}

.wf-tm-card__story-link {
	color: var(--wf-teal);
}

.wf-tm-card__ext-link {
	color: rgba(42,67,69,0.5);
}

.wf-tm-card__story-link:hover,
.wf-tm-card__ext-link:hover { opacity: 0.65; }

/* ── Embedded on story page ── */
.wf-story-testimonial {
	background: var(--wf-teal);
	padding: clamp(2.5rem, 5vw, 4rem) clamp(1.5rem, 5vw, 4rem);
}

.wf-story-testimonial .wf-tm-card--story {
	background: rgba(245,235,233,0.07);
	max-width: 800px;
	margin: 0 auto;
	border-left: 3px solid var(--wf-gold);
}

.wf-story-testimonial .wf-tm-card__quote {
	color: var(--wf-blush);
	font-size: clamp(1.25rem, 2vw, 1.6rem);
}

.wf-story-testimonial .wf-tm-card__reviewer {
	border-top-color: rgba(245,235,233,0.15);
}

.wf-story-testimonial .wf-tm-card__name {
	color: var(--wf-gold);
}

.wf-story-testimonial .wf-tm-card__meta {
	color: rgba(245,235,233,0.55);
}

.wf-story-testimonial .wf-tm-card__meta a { color: inherit; }

.wf-story-testimonial .wf-tm-card__story-link,
.wf-story-testimonial .wf-tm-card__ext-link {
	color: var(--wf-blush);
	opacity: 0.65;
}

.wf-story-testimonial .wf-tm-card__story-link:hover,
.wf-story-testimonial .wf-tm-card__ext-link:hover { opacity: 1; }

.wf-story-testimonial .wf-tm-card__stars { color: var(--wf-gold); }

/* ── Shortcode grid ── */
.wf-tm-grid-sc {
	display: grid;
	gap: clamp(1rem, 2vw, 1.75rem);
	margin: 2rem 0;
}

.wf-tm-grid-sc--cols-2 { grid-template-columns: repeat(2, 1fr); }
.wf-tm-grid-sc--cols-3 { grid-template-columns: repeat(3, 1fr); }

/* Responsive */
@media (max-width: 1024px) {
	.wf-reviews-grid { grid-template-columns: repeat(2, 1fr); }
	.wf-tm-grid-sc--cols-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
	.wf-reviews-grid,
	.wf-tm-grid-sc--cols-2,
	.wf-tm-grid-sc--cols-3 { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════
   Vendor & Package shortcode cards (shared)
   ═══════════════════════════════════════════════════════ */

.wf-vendor-grid,
.wf-package-grid {
	display: grid;
	gap: 24px;
	margin: 32px 0;
}

.wf-vendor-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.wf-package-grid--1 { grid-template-columns: 1fr; }
.wf-package-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wf-package-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wf-package-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.wf-vendor-card,
.wf-package-card {
	border: 1px solid rgba(42, 67, 69, 0.18);
	border-radius: 8px;
	background: #fff;
	color: #2a4345;
	overflow: hidden;
}

.wf-vendor-card-image {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #f5ebe9;
}

.wf-vendor-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; }

.wf-vendor-card-body,
.wf-package-card { padding: 24px; }

.wf-vendor-card h3,
.wf-package-card h3 { margin: 0 0 8px; color: #2a4345; font-size: 1.5rem; line-height: 1.15; }

.wf-vendor-card a,
.wf-package-card a { color: inherit; }

.wf-vendor-card-role,
.wf-package-eyebrow {
	margin: 0 0 8px;
	color: #617779;
	font-family: "Merriweather Sans", sans-serif;
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.wf-vendor-card-location,
.wf-package-duration,
.wf-package-best-for { margin: 8px 0; }

.wf-vendor-card-links { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; font-size: 0.95rem; }

.wf-package-card--featured {
	border-color: #2a4345;
	box-shadow: 0 16px 40px rgba(42, 67, 69, 0.14);
}

.wf-package-price { margin: 16px 0 6px; }
.wf-package-price span { display: block; font-family: "Alegreya", serif; font-size: 2rem; line-height: 1; }
.wf-package-price small { display: block; margin-top: 4px; color: #617779; }

.wf-package-list,
.wf-package-addons ul,
.wf-vendor-credit-list { padding-left: 1.2rem; }

.wf-package-list li,
.wf-package-addons li,
.wf-vendor-credit-list li { margin-bottom: 8px; }

.wf-package-addons { margin-top: 16px; }
.wf-package-addons summary { cursor: pointer; font-weight: 700; }

.wf-package-cta {
	display: inline-block;
	margin-top: 20px;
	padding: 12px 18px;
	border: 2px solid #2a4345;
	border-radius: 4px;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.wf-package-cta:hover { background: #2a4345; color: #fff; }

@media (max-width: 900px) {
	.wf-package-grid--2,
	.wf-package-grid--3,
	.wf-package-grid--4 { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════
   Story interweave sections (split · trio · faq+images)
   ═══════════════════════════════════════════════════════ */

/* Shared: any clickable story image */
.wf-story-img {
	cursor: pointer;
}

/* ── SPLIT SECTION: 4:3 image | session details ── */
.wf-story-split-section {
	background: var(--wf-teal);
	padding: clamp(3rem, 6vw, 6rem) clamp(2rem, 5vw, 4.5rem);
	max-width: 1500px;
	margin: 0 auto;
}

.wf-story-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(2.5rem, 5vw, 6rem);
	align-items: center;
}

.wf-story-split__img {
	position: relative;
	overflow: hidden;
	border-radius: 2px;
	aspect-ratio: 4 / 3;
}

.wf-story-split__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 700ms cubic-bezier(0.23, 1, 0.32, 1);
}

@media (hover: hover) and (pointer: fine) {
	.wf-story-split__img:hover img {
		transform: scale(1.04);
	}
}

.wf-story-split__img-placeholder {
	aspect-ratio: 4 / 3;
	background: rgba(42,67,69,0.07);
	border-radius: 2px;
}

.wf-story-split__meta {
	display: flex;
	flex-direction: column;
	gap: 1.75rem;
}

.wf-story-split__dl {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.75rem 1.5rem;
	align-items: baseline;
	margin: 0;
	padding: 0;
}

.wf-story-split__dl dt {
	font-family: var(--wf-sans);
	font-size: 0.92rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(245,235,233,0.5);
}

.wf-story-split__dl dd {
	font-family: var(--wf-body);
	font-size: 1.35rem;
	color: var(--wf-blush);
	margin: 0;
}

.wf-story-split__dl a {
	color: var(--wf-gold);
	text-decoration: underline;
	text-decoration-color: rgba(220,204,163,0.4);
}

@media (max-width: 800px) {
	.wf-story-split { grid-template-columns: 1fr; }
	.wf-story-split__img { aspect-ratio: 3 / 2; }
}

/* ── TRIO SECTION: story text | 1:1 img | 1:1 img ── */
.wf-story-trio-section {
	background: var(--wf-teal);
	max-width: 1500px;
	margin: 0 auto;
}

.wf-story-trio {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

.wf-story-trio__text {
	padding: clamp(3rem, 6vw, 5rem) clamp(2rem, 4vw, 3.5rem);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 1.5rem;
}

.wf-story-trio__text p {
	font-family: var(--wf-body);
	font-size: clamp(1.35rem, 1.75vw, 1.65rem);
	line-height: 1.85;
	color: rgba(245,235,233,0.75);
	margin: 0;
}

/* Dropcap on the opening paragraph of the trio text column */
.wf-story-trio__text p:first-child::first-letter {
	float: left;
	font-family: var(--wf-serif);
	font-size: clamp(4rem, 7vw, 5.5rem);
	font-weight: 900;
	line-height: 0.78;
	padding-right: 0.1em;
	margin-top: 0.06em;
	color: var(--wf-lime);
}

.wf-story-trio__img {
	position: relative;
	overflow: hidden;
	aspect-ratio: 1 / 1;
}

.wf-story-trio__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 700ms cubic-bezier(0.23, 1, 0.32, 1);
}

@media (hover: hover) and (pointer: fine) {
	.wf-story-trio__img:hover img {
		transform: scale(1.04);
	}
}

@media (max-width: 800px) {
	.wf-story-trio { grid-template-columns: 1fr; }
	.wf-story-trio__img { aspect-ratio: 4 / 3; }
}

/* ── FAQ WITH IMAGES ── */
.wf-story-faq-wrap {
	background: var(--wf-blush);
	padding: clamp(3rem, 6vw, 6rem) clamp(2rem, 5vw, 4.5rem);
	max-width: 1500px;
	margin: 0 auto;
}

.wf-story-faq-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(2.5rem, 5vw, 6rem);
	align-items: start;
}

.wf-story-faq__title {
	font-family: var(--wf-serif);
	font-size: clamp(1.5rem, 2.5vw, 2.25rem);
	color: var(--wf-teal);
	margin: 0 0 1.5rem;
}

.wf-story-faq-images {
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	position: sticky;
	top: 2rem;
}

.wf-story-faq-img {
	position: relative;
	overflow: hidden;
	border-radius: 2px;
}

.wf-story-faq-img img {
	width: 100%;
	display: block;
	transition: transform 700ms cubic-bezier(0.23, 1, 0.32, 1);
}

@media (hover: hover) and (pointer: fine) {
	.wf-story-faq-img:hover img {
		transform: scale(1.04);
	}
}

@media (max-width: 800px) {
	.wf-story-faq-grid {
		grid-template-columns: 1fr;
	}
	.wf-story-faq-images {
		position: static;
		flex-direction: row;
		flex-wrap: wrap;
	}
	.wf-story-faq-img {
		flex: 1 1 calc(50% - 0.45rem);
	}
}

/* ═══════════════════════════════════════════════════════
   Mobile & touch polish
   ═══════════════════════════════════════════════════════ */

/* ── Peek strip: right-size arrows on tablet/mobile ── */
@media (max-width: 900px) {
	/* Arrows shrink significantly — base reset */
	.wf-peek-btn {
		width: 2.75rem;
		height: 2.75rem;
		font-size: 1.2rem;
	}

	/* Strip header: tighter padding + closer gap */
	.wf-strip-header {
		padding: 1rem clamp(1.25rem, 4vw, 2rem);
		gap: 0.75rem;
	}

	.wf-peek-section .wf-eyebrow {
		font-size: 0.82rem;
		padding: 0.36rem 0.8rem;
	}

	.wf-peek-controls {
		gap: 0.5rem;
	}

	/* Strip body: match tighter side padding */
	.wf-peek-strip {
		padding: 1rem clamp(1.25rem, 4vw, 2rem);
		padding-right: 14vw;
	}

	/* New interweave sections: tighter padding on mobile */
	.wf-story-split-section,
	.wf-story-faq-wrap {
		padding: clamp(2rem, 5vw, 3rem) clamp(1.25rem, 4vw, 2rem);
	}

	.wf-story-trio__text {
		padding: clamp(2rem, 5vw, 3.5rem) clamp(1.25rem, 4vw, 2.5rem);
		gap: 1.1rem;
	}

	.wf-story-split__meta {
		gap: 1.25rem;
	}

	.wf-story-split__dl {
		gap: 0.55rem 1.1rem;
	}

	/* Story inner: tighter on tablet */
	.wf-story-inner {
		padding: clamp(2rem, 5vw, 3.5rem) clamp(1.25rem, 4vw, 2rem);
		gap: clamp(2rem, 5vw, 3.5rem);
	}
}

@media (max-width: 540px) {
	/* Arrows: compact while preserving a 44px touch target */
	.wf-peek-btn {
		width: 2.75rem;
		height: 2.75rem;
		font-size: 1.05rem;
	}

	.wf-peek-controls {
		flex: 0 0 8rem;
		gap: 0.5rem;
	}

	/* Strip header: minimal padding on small phone */
	.wf-strip-header {
		padding: 0.7rem 1rem;
	}

	.wf-peek-strip {
		padding: 0.7rem 1rem;
		padding-right: 12vw;
	}

	/* Hero display: slightly looser line-height on phone */
	.wf-display {
		line-height: 0.95;
	}

	/* FAQ images: 2-up row on small screens */
	.wf-story-faq-images {
		flex-direction: row;
		flex-wrap: wrap;
	}
	.wf-story-faq-img {
		flex: 1 1 calc(50% - 0.45rem);
	}
}

/* ── Touch delight: replace hover interactions ─────────── */
/* On touch devices (phones/tablets), :hover doesn't fire naturally.
   We provide :active press feedback and always-visible captions instead. */

@media (hover: none) {
	/* Press feedback on tappable images (brief compress on touch) */
	.wf-peek-item:active img {
		transform: scale(0.97);
		transition-duration: 80ms;
	}

	.wf-panel--img:active img,
	.wf-story-split__img:active img,
	.wf-story-trio__img:active img,
	.wf-story-faq-img:active img,
	.wf-masonry-item:active img {
		transform: scale(0.98);
		transition-duration: 100ms;
	}

	/* Peek captions: always visible on touch (no hover to reveal them) */
	.wf-peek-item figcaption {
		transform: translateY(0);
		opacity: 1;
	}

	/* Masonry captions: same */
	.wf-masonry-item figcaption {
		transform: translateY(0);
		opacity: 1;
	}

	/* Hero image: no scale trick on touch */
	.wf-story-hero__image img {
		transform: none;
	}

	/* Vendor rows: tap highlight instead of hover bar */
	.wf-story-vendors-list li:active {
		border-left-color: var(--wf-lime);
		padding-left: 0.65rem;
		background: rgba(230,254,110,0.05);
		transition: none;
	}

	/* FAQ rows: lime wash on tap */
	.wf-story-faq-item:active {
		background: rgba(230,254,110,0.1);
		transition: none;
	}

	/* Story cards: subtle press instead of lift */
	.wf-story-card:active {
		transform: scale(0.99);
		box-shadow: 0 4px 16px rgba(42,67,69,0.09);
		transition-duration: 80ms;
	}

	/* CTA button: press on tap */
	.wf-hero-cta:active,
	.wf-story-cta-button:active {
		transform: scale(0.98);
		transition-duration: 80ms;
	}
}