/**
 * Softly Elementor Widgets — front-end styles.
 *
 * Defaults mirror the Softly Written theme (Playfair Display headings,
 * espresso/terracotta palette). Every value here is overridable from the
 * Elementor Style tab, so keep this file to sensible defaults only.
 */

.sw-elw-head {
	margin: 0 0 2rem;
}

.sw-elw-head__title {
	font-family: "Playfair Display", Georgia, serif;
	font-weight: 500;
	letter-spacing: 0.01em;
	margin: 0;
}

.sw-elw-head__title a {
	color: inherit;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.sw-elw-head__title a:hover,
.sw-elw-head__title a:focus-visible {
	opacity: 0.7;
}

.sw-elw-head__rule {
	display: block;
	width: 72px;
	height: 1px;
	margin: 0.9rem auto 0;
	background-color: currentColor;
	opacity: 0.45;
}

/* Follow the heading's alignment rather than always centring. */
.sw-elw-head[style*="text-align: left"] .sw-elw-head__rule,
.sw-elw-head[style*="text-align:left"] .sw-elw-head__rule {
	margin-left: 0;
	margin-right: auto;
}

.sw-elw-head[style*="text-align: right"] .sw-elw-head__rule,
.sw-elw-head[style*="text-align:right"] .sw-elw-head__rule {
	margin-left: auto;
	margin-right: 0;
}


/* ==========================================================================
   Post Slider
   Values mirror the theme's original .sw-hero. Theme custom properties are
   used where they exist, with the literal theme value as the fallback so the
   widget still looks right under another theme.
   ========================================================================== */

.sw-elw-slider {
	position: relative;
}

.sw-elw-slider__stage {
	position: relative;
	height: clamp(380px, 60vw, 600px);
	width: 100%;
	overflow: hidden;
	background: var(--bg-light, #EAE2D5);
}

/* Slides move horizontally like the design mock-up: the incoming slide travels
   in from the side the user is heading towards and the outgoing one leaves the
   opposite way. `--sw-elw-from` is set per slide by widgets.js. */
.sw-elw-slider__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transform: translateX(var(--sw-elw-from, 100%));
	transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1),
		opacity 0.35s ease,
		visibility 0s linear 0.6s;
	will-change: transform;
}

.sw-elw-slider__slide.is-active {
	opacity: 1;
	visibility: visible;
	transform: translateX(0);
	z-index: 2;
	transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1),
		opacity 0.35s ease,
		visibility 0s linear 0s;
}

.sw-elw-slider__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.sw-elw-slider__img--placeholder {
	background: linear-gradient( 135deg, var(--bg-light, #EAE2D5), var(--badge, #F2EDE4) );
}

.sw-elw-slider__scrim {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.1);
	pointer-events: none;
}

.sw-elw-slider__card {
	position: absolute;
	inset: 0;
	margin: auto;
	height: max-content;
	width: max-content;
	max-width: min(90%, 720px);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	text-align: center;
	background: var(--white, #fff);
	padding: clamp(1.5rem, 4vw, 3rem) clamp(1.5rem, 5vw, 3.5rem);
	border: 1px solid rgba(0, 0, 0, 0.05);
	text-decoration: none;
	transition: transform 0.3s ease;
}

.sw-elw-slider__card:hover {
	transform: scale(1.006);
}

.sw-elw-slider__eyebrow {
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--accent, #AA5B3C);
	text-transform: uppercase;
	letter-spacing: 0.25em;
	line-height: 1;
}

.sw-elw-slider__title {
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: clamp(1.35rem, 3.4vw, 2.15rem);
	/* Design mock-up uses `font-normal` here — 500 read as too heavy. */
	font-weight: 400;
	color: var(--ink, #2E2724);
	line-height: 1.18;
	max-width: 36ch;
	margin: 0;
}

.sw-elw-slider__excerpt {
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--muted, #7C706A);
	margin: 0;
	max-width: 46ch;
}

.sw-elw-slider__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	line-height: 1;
	padding: 0.85rem 1.6rem;
	color: var(--white, #fff);
	background: var(--button, #453C38);
	border: 1px solid transparent;
	transition: background 0.3s ease;
}

.sw-elw-slider__card:hover .sw-elw-slider__btn {
	background: var(--accent, #AA5B3C);
}

/* ---------- Arrows ---------- */

.sw-elw-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.18);
	border: 1px solid rgba(255, 255, 255, 0.25);
	color: #fff;
	cursor: pointer;
	padding: 0;
	transition: background 0.2s;
	z-index: 5;
}

.sw-elw-slider__arrow:hover {
	background: rgba(0, 0, 0, 0.38);
}

.sw-elw-slider__arrow:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.sw-elw-slider__arrow--prev {
	left: 0;
}

.sw-elw-slider__arrow--next {
	right: 0;
}

/* ---------- Dots ---------- */

.sw-elw-slider__dots {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.6rem;
	margin-top: 1.25rem;
}

.sw-elw-slider__dot {
	width: 8px;
	height: 6px;
	background: #cfc6bb;
	border: none;
	cursor: pointer;
	padding: 0;
	transition: all 0.3s;
}

.sw-elw-slider__dot:hover,
.sw-elw-slider__dot.is-active {
	background: var(--divider, #8A7A6B);
}

.sw-elw-slider__dot.is-active {
	width: 32px;
}

.sw-elw-slider__dot:focus-visible {
	outline: 2px solid var(--ink, #2E2724);
	outline-offset: 2px;
}

/* ---------- Editor notice ---------- */

.sw-elw-notice {
	padding: 1.25rem 1.5rem;
	background: #FAF7F2;
	border: 1px dashed #C5A880;
	color: #7C706A;
	font-size: 0.875rem;
	line-height: 1.6;
	text-align: center;
}

/* ---------- No JS / reduced motion ---------- */

.no-js .sw-elw-slider__slide {
	position: relative;
	opacity: 1;
	visibility: visible;
	/* Without JS nothing ever sets the slide offset, so undo it here or every
	   slide would sit one stage-width off to the right. */
	transform: none;
}

.no-js .sw-elw-slider__stage {
	height: auto;
}

.no-js .sw-elw-slider__arrow,
.no-js .sw-elw-slider__dots {
	display: none;
}

@media ( prefers-reduced-motion: reduce ) {
	.sw-elw-slider__slide,
	.sw-elw-slider__slide.is-active,
	.sw-elw-slider__card {
		transition: none;
	}
}


/* ==========================================================================
   Post Grid
   Ports the theme's .sw-section__head + .sw-grid--3 + .sw-card pattern.
   ========================================================================== */

/* ---------- Section heading ---------- */

.sw-elw-grid-head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	text-align: center;
	margin-bottom: 2.5rem;
}

.sw-elw-grid-head__title {
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: clamp(1.7rem, 3.4vw, 2.25rem);
	font-weight: 600;
	line-height: 1.2;
	color: var(--ink, #2E2724);
	margin: 0;
}

.sw-elw-grid-head__title a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s;
}

.sw-elw-grid-head__title a:hover {
	color: var(--accent, #AA5B3C);
}

.sw-elw-grid-head__rule {
	display: block;
	width: 48px;
	height: 2px;
	background: var(--divider, #8A7A6B);
	opacity: 0.4;
	margin: 0 auto;
}

/* ---------- Grid ---------- */

.sw-elw-grid {
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Fallbacks for when the Columns control is left empty. Elementor's own
   breakpoints win whenever the control has a value, which it does by default. */
@media ( max-width: 900px ) {
	.sw-elw-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media ( max-width: 640px ) {
	.sw-elw-grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- Card ---------- */

.sw-elw-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	margin: 0;
}

.sw-elw-card__media {
	display: block;
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border: 1px solid var(--border, #EBDCCD);
	background: var(--bg-light, #EAE2D5);
	box-shadow: var(--shadow-soft, 0 1px 2px rgba(46, 39, 36, 0.05));
}

.sw-elw-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.sw-elw-card__img--placeholder {
	background: linear-gradient( 135deg, var(--bg-light, #EAE2D5), var(--badge, #F2EDE4) );
}

.sw-elw-card--zoom:hover .sw-elw-card__img {
	transform: scale(1.05);
}

.sw-elw-card__body {
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
	flex: 1;
	width: 100%;
	padding-top: 1.1rem;
}

.sw-elw-card__eyebrow {
	display: block;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.68rem;
	font-weight: 700;
	color: var(--accent, #AA5B3C);
	text-transform: uppercase;
	letter-spacing: 0.2em;
	line-height: 1.2;
}

.sw-elw-card__title {
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.3;
	margin: 0;
}

.sw-elw-card__title a {
	color: var(--ink, #2E2724);
	text-decoration: none;
	transition: color 0.2s;
}

.sw-elw-card__title a:hover {
	color: var(--accent, #AA5B3C);
}

.sw-elw-card__rule {
	display: block;
	width: 48px;
	height: 1.5px;
	background: var(--divider, #8A7A6B);
	opacity: 0.4;
	margin: 0 auto;
}

.sw-elw-card__excerpt {
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--muted, #7C706A);
	margin: 0;
}

.sw-elw-card__foot {
	margin-top: auto;
	padding-top: 1rem;
}

.sw-elw-card__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	line-height: 1;
	cursor: pointer;
	text-decoration: none;
	padding: 0.62rem 1.5rem;
	border: 1px solid var(--accent, #AA5B3C);
	border-radius: 0;
	color: var(--accent, #AA5B3C);
	background: transparent;
	transition: all 0.3s ease;
}

.sw-elw-card__btn:hover {
	background: var(--accent, #AA5B3C);
	color: #fff;
}

/* ---------- Alignment ---------- */

.sw-elw-postgrid--center .sw-elw-card {
	text-align: center;
	align-items: center;
}

.sw-elw-postgrid--center .sw-elw-card__body {
	align-items: center;
}

.sw-elw-postgrid--left .sw-elw-grid-head {
	align-items: flex-start;
	text-align: left;
}

.sw-elw-postgrid--left .sw-elw-grid-head__rule,
.sw-elw-postgrid--left .sw-elw-card__rule {
	margin: 0;
}

.sw-elw-postgrid--left .sw-elw-card,
.sw-elw-postgrid--left .sw-elw-card__body {
	text-align: left;
	align-items: flex-start;
}

/* Screen-reader-only text, in case the active theme does not define it. */
.sw-elw-card__btn .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media ( prefers-reduced-motion: reduce ) {
	.sw-elw-card__img,
	.sw-elw-card__btn {
		transition: none;
	}
}


/* ==========================================================================
   Post Splits
   Ports the theme's .sw-section__title--dual + .sw-splits + .sw-split pattern.
   ========================================================================== */

/* ---------- Dual heading ---------- */

.sw-elw-splits-head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	text-align: center;
	margin-bottom: 2.5rem;
}

.sw-elw-splits-head__title {
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: clamp(1.7rem, 3.4vw, 2.25rem);
	font-weight: 600;
	line-height: 1.2;
	color: var(--ink, #2E2724);
	margin: 0;
}

.sw-elw-splits-head__title a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s;
}

.sw-elw-splits-head__title a:hover {
	color: var(--accent, #AA5B3C);
}

.sw-elw-splits-head__amp {
	color: var(--divider, #8A7A6B);
	opacity: 0.6;
	font-weight: 400;
	margin-inline: 0.5rem;
}

.sw-elw-splits-head__rule {
	display: block;
	width: 48px;
	height: 2px;
	background: var(--divider, #8A7A6B);
	opacity: 0.4;
	margin: 0 auto;
}

/* ---------- Rows ---------- */

.sw-elw-splits {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}

.sw-elw-split {
	display: grid;
	/* Width comes in as a custom property so the stacking breakpoint below
	   still wins — Elementor's generated CSS loads after this file, and an
	   unscoped grid-template-columns there would override the media query. */
	grid-template-columns: var(--sw-elw-split-media, 41.6%) minmax(0, 1fr);
	gap: 2rem;
	align-items: center;
	padding: 1.75rem;
	background: rgba(250, 247, 242, 0.5);
	border: 1px solid rgba(235, 220, 205, 0.5);
	text-decoration: none;
	transition: background 0.3s, border-color 0.3s;
}

.sw-elw-split:hover {
	background: rgba(250, 247, 242, 0.9);
	border-color: rgba(197, 168, 128, 0.4);
}

/* Flip: reorder the two children AND swap the column widths to match, so the
   image keeps the same width on every row.
   The theme reordered without swapping the widths, which left the image in the
   wider column on reversed rows and made alternate images visibly larger.
   Note this must stay on `order` and not `grid-column`: explicitly placing the
   body in column 1 after the image has taken column 2 makes auto-placement
   wrap it onto a second row, turning the card into a 2x2 grid. */
.sw-elw-split--reverse {
	grid-template-columns: minmax(0, 1fr) var(--sw-elw-split-media, 41.6%);
}

.sw-elw-split--reverse .sw-elw-split__media {
	order: 2;
}

.sw-elw-split__media {
	position: relative;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	border: 1px solid var(--border, #EBDCCD);
	background: var(--bg-light, #EAE2D5);
}

.sw-elw-split__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.7s ease;
}

.sw-elw-split__img--placeholder {
	background: linear-gradient( 135deg, var(--bg-light, #EAE2D5), var(--badge, #F2EDE4) );
}

.sw-elw-split--zoom:hover .sw-elw-split__img {
	transform: scale(1.03);
}

.sw-elw-split__body {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding-inline: 0.5rem;
	align-items: flex-start;
	text-align: left;
}

.sw-elw-split__eyebrow {
	display: block;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.68rem;
	font-weight: 700;
	color: var(--gold, #C5A880);
	text-transform: uppercase;
	letter-spacing: 0.2em;
	line-height: 1.2;
}

.sw-elw-split__title {
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: clamp(1.25rem, 2.4vw, 1.6rem);
	font-weight: 600;
	line-height: 1.25;
	color: var(--ink, #2E2724);
	margin: 0;
	transition: color 0.2s;
}

.sw-elw-split:hover .sw-elw-split__title {
	color: var(--accent, #AA5B3C);
}

.sw-elw-split__rule {
	display: block;
	width: 48px;
	height: 1.5px;
	background: var(--divider, #8A7A6B);
	opacity: 0.4;
	margin: 0;
}

.sw-elw-split__excerpt {
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.92rem;
	line-height: 1.6;
	color: var(--muted, #7C706A);
	margin: 0;
}

/* Keep the CTA compact rather than stretched by the flex column. */
.sw-elw-split__btn {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	line-height: 1;
	padding: 0.62rem 1.5rem;
	border: 1px solid var(--accent, #AA5B3C);
	border-radius: 0;
	color: var(--accent, #AA5B3C);
	background: transparent;
	transition: all 0.3s ease;
}

.sw-elw-split:hover .sw-elw-split__btn {
	background: var(--accent, #AA5B3C);
	color: #fff;
}

/* Stack on narrow screens, image always first. */
@media ( max-width: 900px ) {
	.sw-elw-split,
	.sw-elw-split--reverse {
		grid-template-columns: 1fr;
	}

	.sw-elw-split--reverse .sw-elw-split__media {
		order: 0;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.sw-elw-split,
	.sw-elw-split__img,
	.sw-elw-split__title,
	.sw-elw-split__btn {
		transition: none;
	}
}


/* ==========================================================================
   Logo Carousel
   Ports the theme's .sw-marquee pattern. The track holds the list twice, and
   the keyframe stops at -50% so the seam lands exactly on the repeat.
   ========================================================================== */

.sw-elw-marquee-section {
	padding-block: 2rem;
}

.sw-elw-marquee__title {
	text-align: center;
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: 1.3rem;
	font-weight: 500;
	color: var(--ink, #2E2724);
	margin: 0 0 1.5rem;
}

.sw-elw-marquee {
	position: relative;
	overflow: hidden;
	width: 100%;
	-webkit-mask-image: linear-gradient(
		90deg,
		transparent,
		#000 var(--sw-elw-fade, 8%),
		#000 calc(100% - var(--sw-elw-fade, 8%)),
		transparent
	);
	mask-image: linear-gradient(
		90deg,
		transparent,
		#000 var(--sw-elw-fade, 8%),
		#000 calc(100% - var(--sw-elw-fade, 8%)),
		transparent
	);
}

.sw-elw-marquee--nofade {
	-webkit-mask-image: none;
	mask-image: none;
}

.sw-elw-marquee__track {
	display: flex;
	align-items: center;
	gap: 3rem;
	width: max-content;
	animation: sw-elw-marquee 28s linear infinite;
}

/* A flex `gap` only sits *between* children, so the track measured half a gap
   short of two whole copies and the -50% keyframe snapped back by that much on
   every lap. An empty trailing flex item contributes exactly one more gap,
   which puts 50% precisely on the repeat — and because it is a real gap it
   tracks whatever the Item Gap control is set to. */
.sw-elw-marquee__track::after {
	content: "";
	flex: 0 0 0;
}

.sw-elw-marquee--pausable:hover .sw-elw-marquee__track {
	animation-play-state: paused;
}

.sw-elw-marquee__item {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	flex: 0 0 auto;
}

.sw-elw-marquee__text {
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: 1.05rem;
	font-weight: 600;
	color: rgba(85, 101, 125, 0.45);
	text-transform: uppercase;
	letter-spacing: 0.14em;
	white-space: nowrap;
	transition: color 0.3s;
}

.sw-elw-marquee__item:hover .sw-elw-marquee__text {
	color: var(--ink, #2E2724);
}

.sw-elw-marquee__img {
	display: block;
	width: auto;
	height: 40px;
	max-width: none;
	object-fit: contain;
	transition: filter 0.3s, opacity 0.3s;
}

/* ---------- Static mode ---------- */

.sw-elw-marquee--static .sw-elw-marquee__track {
	animation: none;
	width: 100%;
	flex-wrap: wrap;
	justify-content: center;
	row-gap: 1.5rem;
}

/* The seam spacer only means anything while the strip is scrolling. */
.sw-elw-marquee--static .sw-elw-marquee__track::after {
	display: none;
}

@keyframes sw-elw-marquee {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

/* Motion off: fall back to a centred wrapped row rather than a frozen strip
   that would cut the duplicate list off mid-way. */
@media ( prefers-reduced-motion: reduce ) {
	.sw-elw-marquee__track {
		animation: none;
		width: 100%;
		flex-wrap: wrap;
		justify-content: center;
		row-gap: 1.5rem;
	}

	/* The duplicate pass exists only to make the scroll seamless. */
	.sw-elw-marquee__item[aria-hidden="true"],
	.sw-elw-marquee__track::after {
		display: none;
	}

	.sw-elw-marquee__text,
	.sw-elw-marquee__img {
		transition: none;
	}
}


/* ==========================================================================
   Newsletter Band
   Ports the theme's .sw-newsletter pattern, including the Fluent Forms
   harmonisation that flattens the form into a single inline row.
   ========================================================================== */

.sw-elw-newsletter {
	position: relative;
	background: var(--bg-section, #FAF7F2);
	border-top: 1px solid rgba(235, 220, 205, 0.6);
	border-bottom: 1px solid rgba(235, 220, 205, 0.6);
	padding-block: clamp(3rem, 7vw, 6rem);
	overflow: hidden;
}

.sw-elw-newsletter__quote {
	position: absolute;
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: 12rem;
	line-height: 1;
	color: rgba(138, 122, 107, 0.14);
	user-select: none;
	pointer-events: none;
}

/* The mock-up anchors both quote marks to the 896px (max-w-4xl) content box,
   not to the full-bleed band — pinning them to the band's edges left them
   stranded hundreds of pixels away from the form on wide screens.
   27rem = half of 896px minus the container's own 1rem inset. */
.sw-elw-newsletter__quote--open {
	top: 0;
	left: max(1.5rem, calc(50% - 27rem));
}

.sw-elw-newsletter__quote--close {
	bottom: -3rem;
	right: max(1.5rem, calc(50% - 27rem));
}

.sw-elw-newsletter__inner {
	position: relative;
	z-index: 2;
	max-width: 640px;
	margin-inline: auto;
	padding-inline: var(--pad, 1.5rem);
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.4rem;
}

.sw-elw-newsletter__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.64rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--accent, #AA5B3C);
	background: rgba(170, 91, 60, 0.06);
	border: 1px solid rgba(170, 91, 60, 0.16);
	padding: 0.35rem 0.85rem;
	border-radius: 9999px;
}

.sw-elw-newsletter__title {
	font-family: var(--font-serif, "Playfair Display", Georgia, serif);
	font-size: clamp(1.8rem, 4vw, 2.4rem);
	font-weight: 300;
	line-height: 1.2;
	color: var(--ink, #2E2724);
	margin: 0;
}

.sw-elw-newsletter__title em {
	color: var(--accent, #AA5B3C);
	font-style: italic;
	font-weight: 500;
}

.sw-elw-newsletter__text {
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	color: var(--muted, #7C706A);
	font-size: 0.98rem;
	line-height: 1.6;
	max-width: 34rem;
	margin: 0;
}

.sw-elw-newsletter__formwrap {
	width: 100%;
	max-width: 30rem;
}

.sw-elw-newsletter__fineprint {
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.72rem;
	color: var(--muted, #7C706A);
	margin: 0.35rem 0 0;
	text-align: center;
	line-height: 1.5;
}

.sw-elw-newsletter__fineprint a {
	color: var(--ink, #2E2724);
	text-decoration: underline;
	text-underline-offset: 2px;
	font-weight: 500;
}

.sw-elw-newsletter__fineprint a:hover {
	color: var(--accent, #AA5B3C);
}

/* ---------- Static preview form ---------- */

.sw-elw-newsletter__form {
	display: flex;
	gap: 0.75rem;
	width: 100%;
}

.sw-elw-newsletter__form input[type="email"] {
	flex: 1;
	min-width: 0;
	padding: 0.85rem 1.15rem;
	background: #fff;
	border: 1px solid var(--border, #EBDCCD);
	color: var(--ink, #2E2724);
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-size: 0.9rem;
	border-radius: 12px;
	transition: border-color 0.2s;
}

.sw-elw-newsletter__form input[type="email"]:focus {
	outline: none;
	border-color: var(--accent, #AA5B3C);
}

.sw-elw-newsletter__form button {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: var(--button, #453C38);
	color: #fff;
	border: none;
	padding: 0.85rem 1.6rem;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
	font-weight: 700;
	font-size: 0.72rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border-radius: 12px;
	cursor: pointer;
	transition: background 0.2s;
}

.sw-elw-newsletter__form button:hover {
	background: var(--ink, #2E2724);
}

/* ---------- Fluent Forms harmonisation: flatten to one inline row ----------
   !important throughout because Fluent Forms ships its own specific rules. */

.sw-elw-newsletter__formwrap .fluentform {
	margin: 0;
}

.sw-elw-newsletter__formwrap form fieldset {
	display: flex;
	align-items: flex-end;
	gap: 0.75rem;
	flex-wrap: nowrap;
	border: none;
	margin: 0;
	padding: 0;
	min-inline-size: 0;
}

.sw-elw-newsletter__formwrap .ff-el-group {
	margin: 0 !important;
}

.sw-elw-newsletter__formwrap .ff-el-group:not(.ff_submit_btn_wrapper) {
	flex: 1 1 auto;
	min-width: 0;
}

.sw-elw-newsletter__formwrap .ff_submit_btn_wrapper {
	flex: 0 0 auto;
	width: auto;
}

.sw-elw-newsletter__formwrap .ff-el-input--label {
	display: none !important;
}

.sw-elw-newsletter__formwrap .ff-el-input--content {
	margin: 0;
}

.sw-elw-newsletter__formwrap .ff-el-input--content input,
.sw-elw-newsletter__formwrap input[type="email"],
.sw-elw-newsletter__formwrap input[type="text"] {
	width: 100%;
	margin: 0;
	border-radius: 12px !important;
	border: 1px solid var(--border, #EBDCCD) !important;
	background: #fff !important;
	padding: 0.9rem 1.15rem !important;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif) !important;
	font-size: 0.9rem !important;
	color: var(--ink, #2E2724) !important;
	box-shadow: none !important;
}

.sw-elw-newsletter__formwrap .ff-el-input--content input:focus {
	border-color: var(--accent, #AA5B3C) !important;
	outline: none !important;
}

.sw-elw-newsletter__formwrap .ff-btn-submit,
.sw-elw-newsletter__formwrap button[type="submit"] {
	background: var(--button, #453C38) !important;
	border: none !important;
	border-radius: 12px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.1em !important;
	font-weight: 700 !important;
	font-size: 0.72rem !important;
	padding: 0.95rem 1.7rem !important;
	color: #fff !important;
	white-space: nowrap;
	cursor: pointer;
}

.sw-elw-newsletter__formwrap .ff-btn-submit:hover {
	background: var(--ink, #2E2724) !important;
}

.sw-elw-newsletter__formwrap .ff-message-success,
.sw-elw-newsletter__formwrap .ff_submit_success {
	margin-top: 0.9rem;
	display: inline-block;
	background: rgba(170, 91, 60, 0.06);
	border: 1px solid rgba(170, 91, 60, 0.16);
	color: var(--accent, #AA5B3C);
	font-size: 0.78rem;
	padding: 0.6rem 1.1rem;
	border-radius: 12px;
	font-family: var(--font-sans, "Inter", ui-sans-serif, system-ui, sans-serif);
}

.sw-elw-newsletter__formwrap .ff-message-success p {
	margin: 0;
}

/* ---------- Narrow screens ---------- */

@media ( max-width: 640px ) {
	.sw-elw-newsletter__form {
		flex-direction: column;
	}

	.sw-elw-newsletter__formwrap form fieldset {
		flex-direction: column;
		align-items: stretch;
	}

	.sw-elw-newsletter__formwrap .ff_submit_btn_wrapper,
	.sw-elw-newsletter__formwrap .ff-btn-submit {
		width: 100%;
	}

	.sw-elw-newsletter__quote {
		font-size: 7rem;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.sw-elw-newsletter__form input[type="email"],
	.sw-elw-newsletter__form button {
		transition: none;
	}
}

/* ==========================================================================
   Elementor override guard
   Elementor's frontend.min.css ships `.elementor img { height: auto }`, which
   out-specifies our single-class image rules. The images then rendered at their
   natural ratio and burst out of the 4:3 / 16:10 media boxes — portrait photos
   showed only their top slice. Re-declare the same rules one class deeper so
   they win, without resorting to !important.
   ========================================================================== */

.elementor .sw-elw-card__img,
.elementor .sw-elw-split__img,
.elementor .sw-elw-slider__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Two headings that overshot the mock-up's text-4xl / text-2xl ceilings. */
.sw-elw-newsletter__title {
	font-size: clamp(1.8rem, 4vw, 2.25rem);
}

.sw-elw-marquee__title {
	font-size: 1.5rem;
}