/**
 * Block: Footer — five designs (columns, split, centered, minimal, widget
 * areas) in a light or dark tone. Mobile-first; nothing may overflow 320px.
 *
 * Colour/size variables come from the block root (--ft-*, set by the spec's
 * css-flagged attributes) or from an inline style on .espt-ft (the site
 * footer colours). They are never re-declared here — every use carries its
 * own fallback through the per-tone --ftc-* aliases below.
 */

/* Theme tokens: eSP Theme → Footer colours and sizes, the brand colours
   and the fonts. Every design reads these as its fallback, so a footer
   follows the theme's settings until the block sets its own. */
.espt-block-footer {
	--fk-bg: var(--espt-footer-bg, #0f172a);
	--fk-heading: var(--espt-footer-heading, #fff);
	--fk-text: var(--espt-footer-text, #cbd5e1);
	--fk-link: var(--espt-footer-link, #e2e8f0);
	--fk-link-h: var(--espt-footer-link-h, var(--espt-primary, #16a34a));
	--fk-accent: var(--espt-footer-accent, var(--espt-primary, #16a34a));
	--fk-line: var(--espt-footer-border, rgba(255, 255, 255, 0.12));
	--fk-bottom-bg: var(--espt-footer-bottom-bg, rgba(0, 0, 0, 0.22));
	--fk-brand: var(--espt-primary, #16a34a);
	--fk-brand-dark: var(--espt-primary-dark, #15803d);
	--fk-accent2: var(--espt-accent, #f59e0b);
	--fk-ink: var(--espt-heading, #0f172a);
	--fk-body-text: var(--espt-text, #475569);
	--fk-body-line: var(--espt-border, #e2e8f0);
	--fk-font: var(--espt-body-font, inherit);
	--fk-display: var(--espt-heading-font, var(--espt-body-font, inherit));
	--fk-title-size: var(--espt-ft-title-size, 16px);
	--fk-title-tt: var(--espt-ft-title-tt, none);
	--fk-link-size: var(--espt-ft-link-size, 14px);
	--fk-link-gap: var(--espt-ft-link-gap, 10px);
	--fk-col-gap: var(--espt-ft-col-gap, 28px);
	--fk-radius: var(--espt-ft-radius, 10px);
	--fk-pay-h: var(--espt-ft-pay-h, 26px);
	--fk-pad: var(--espt-footer-pad, 56px);
	--fk-pad-r: calc(var(--fk-pad) * 0.6);
	--fk-max: var(--espt-container, 1200px);
	margin-bottom: 0;
}

@media (min-width: 768px) {
	.espt-block-footer { --fk-pad-r: calc(var(--fk-pad) * 0.8); }
}

@media (min-width: 1024px) {
	.espt-block-footer { --fk-pad-r: var(--fk-pad); }
}

/* ------------------------------------------------------------ width */

/*
 * "Footer width". The designs are full-width blocks, and a full-width block
 * breaks out to the whole window (_shared.css) — on a boxed site (eSP Theme
 * → Layout → Content layout: Boxed) that pushed the footer outside the box.
 *   site  (default) — boxed site: fill the box, never wider; full-width
 *                     site: as aligned (full width).
 *   full  — the whole window, whatever the site layout.
 *   boxed — the content width, centred, whatever the site layout.
 */
body.espt-layout-boxed .espt-block.espt-block-footer.is-footer-width-site,
.espt-block.espt-block-footer.is-footer-width-boxed {
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
	width: 100%;
}

.espt-block.espt-block-footer.is-footer-width-boxed { max-width: var(--espt-container, 1200px); }

/* A footer template sits in <footer class="site-footer">, which paints the
   eSP Theme footer colour edge to edge. A boxed footer is the footer, so
   that wrapper steps aside — otherwise the colour shows at its sides. */
.site-footer:has(> .espt-block-footer.is-footer-width-boxed) { background: transparent; }

/* 100vw counts a desktop scrollbar, so a plain calc(50% - 50vw) breakout sat
   half a bar too far left (its left 7–8px cut off) and ran under the bar.
   theme.js writes the bar's width to --espt-sbw on <html>. */
.espt-block.espt-block-footer.is-footer-width-full {
	--ftw-vw: calc(100vw - var(--espt-sbw, 0px));
	margin-left: calc(50% - var(--ftw-vw) / 2);
	margin-right: calc(50% - var(--ftw-vw) / 2);
	max-width: var(--ftw-vw);
	width: var(--ftw-vw);
}

/* On a full-width site a footer template's wrapper already spans the page,
   so the footer just fills it — exact, with or without the script. */
body:not(.espt-layout-boxed) .site-footer > .espt-block.espt-block-footer.is-footer-width-site,
body:not(.espt-layout-boxed) .site-footer > .espt-block.espt-block-footer.is-footer-width-full {
	margin-left: 0;
	margin-right: 0;
	max-width: 100%;
	width: 100%;
}

/* ------------------------------------------------------------- palette */

.espt-block-footer .espt-ft-light {
	--ftc-bg: var(--ft-bg, #f7f8f5);
	--ftc-text: var(--ft-text, #4b5563);
	--ftc-heading: var(--ft-heading, #111827);
	--ftc-link: var(--ft-link, #4b5563);
	--ftc-link-h: var(--ft-link-h, var(--fk-brand));
	--ftc-accent: var(--ft-accent, var(--fk-brand));
	--ftc-border: var(--ft-border, rgba(17, 24, 39, 0.1));
	--ftc-bottom-bg: var(--ft-bottom-bg, transparent);
	--ftc-bottom-text: var(--ft-bottom-text, var(--ftc-text));
	--ftc-soft: rgba(17, 24, 39, 0.06);
}

.espt-block-footer .espt-ft-dark {
	--ftc-bg: var(--ft-bg, #0f172a);
	--ftc-text: var(--ft-text, #94a3b8);
	--ftc-heading: var(--ft-heading, #ffffff);
	--ftc-link: var(--ft-link, #cbd5e1);
	--ftc-link-h: var(--ft-link-h, color-mix(in srgb, var(--fk-brand) 60%, #fff));
	--ftc-accent: var(--ft-accent, color-mix(in srgb, var(--fk-brand) 60%, #fff));
	--ftc-border: var(--ft-border, rgba(255, 255, 255, 0.12));
	--ftc-bottom-bg: var(--ft-bottom-bg, rgba(0, 0, 0, 0.22));
	--ftc-bottom-text: var(--ft-bottom-text, var(--ftc-text));
	--ftc-soft: rgba(255, 255, 255, 0.08);
}

/* The soft tint (icon chips, social badges) has to follow the *actual*
   palette: "Start from the site footer colours" can drop a dark heading
   colour into the light tone and vice versa, and a fixed rgba tint would
   then disappear into the background. Derived from the heading colour so
   it always contrasts; the rgba values above stay as the fallback. */
@supports (color: color-mix(in srgb, red 50%, transparent)) {
	.espt-block-footer .espt-ft-light,
	.espt-block-footer .espt-ft-dark {
		--ftc-soft: color-mix(in srgb, var(--ftc-heading) 9%, transparent);
	}
}

/* ---------------------------------------------------------------- band */

.espt-block-footer .espt-ft {
	background: var(--ftc-bg);
	color: var(--ftc-text);
	font-size: var(--ft-link-size, var(--fk-link-size, 14px));
	line-height: 1.7;
	overflow-wrap: anywhere;
	width: 100%;
}

.espt-block-footer .espt-ft a {
	color: var(--ftc-link);
	text-decoration: none;
	transition: color 0.15s ease, transform 0.15s ease, background 0.2s ease, border-color 0.2s ease;
}

.espt-block-footer .espt-ft a:hover,
.espt-block-footer .espt-ft a:focus-visible {
	color: var(--ftc-link-h);
}

.espt-block-footer .espt-container {
	margin: 0 auto;
	max-width: var(--ft-max, var(--fk-max, 1200px));
	padding-left: 16px;
	padding-right: 16px;
	width: 100%;
}

.espt-block-footer .espt-ft-body {
	padding-bottom: var(--ft-pad, var(--fk-pad-r, 32px));
	padding-top: var(--ft-pad, var(--fk-pad-r, 32px));
}

.espt-block-footer .espt-block-note {
	color: var(--ftc-text);
	font-size: 13px;
	margin: 0;
	opacity: 0.8;
}

/* ---------------------------------------------------------------- grid */

.espt-block-footer .espt-ft-main {
	display: grid;
	gap: var(--ft-col-gap, var(--fk-col-gap, 26px));
	grid-template-columns: minmax(0, 1fr);
}

.espt-block-footer .espt-ft-col,
.espt-block-footer .espt-ft-brand {
	min-width: 0;
}

.espt-block-footer .espt-ft-title {
	color: var(--ftc-heading);
	font-family: var(--fk-display);
	font-size: var(--ft-title-size, var(--fk-title-size, 15px));
	font-weight: 700;
	letter-spacing: 0.02em;
	margin: 0 0 14px;
	text-transform: var(--fk-title-tt, none);
}

.espt-block-footer .espt-ft-links {
	display: flex;
	flex-direction: column;
	gap: var(--ft-link-gap, var(--fk-link-gap, 10px));
	list-style: none;
	margin: 0;
	padding: 0;
}

.espt-block-footer .espt-ft-links li {
	margin: 0;
	min-width: 0;
}

.espt-block-footer .espt-ft-links a {
	display: inline-block;
}

/* --------------------------------------------------------------- brand */

.espt-block-footer .espt-ft-logo {
	display: block;
	margin: 0 0 4px;
}

.espt-block-footer .espt-ft-logo a {
	display: inline-flex;
}

.espt-block-footer .espt-ft-logo img {
	border-radius: calc(var(--ft-radius, var(--fk-radius, 10px)) * 0.5);
	display: block;
	height: auto;
	/* A tall/square logo must not tower over the column — cap it and letterbox
	   (the plugin capped at 56px for a 140px wide logo). */
	max-height: calc(var(--ft-logo-w, 130px) * 0.55);
	max-width: 100%;
	object-fit: contain;
	object-position: left center;
	width: var(--ft-logo-w, 130px);
}

.espt-block-footer .espt-ft-centered .espt-ft-logo img,
.espt-block-footer .espt-ft-minimal .espt-ft-logo img {
	object-position: center;
}

.espt-block-footer .espt-ft-logo-text {
	color: var(--ftc-heading);
	font-size: 1.3rem;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.espt-block-footer .espt-ft-about {
	margin: 14px 0 0;
	max-width: 46ch;
}

/* ------------------------------------------------------- contact rows */

.espt-block-footer .espt-ft-contact-rows {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 4px;
}

.espt-block-footer .espt-ft-contact-row {
	align-items: flex-start;
	color: var(--ftc-text);
	display: flex;
	gap: 10px;
	margin: 0;
	min-width: 0;
}

.espt-block-footer .espt-ft-contact-row span {
	min-width: 0;
}

.espt-block-footer .espt-ft-contact-row svg {
	background: var(--ftc-soft);
	border-radius: var(--ft-radius, var(--fk-radius, 10px));
	box-sizing: content-box;
	color: var(--ftc-accent);
	flex: none;
	padding: 8px;
}

.espt-block-footer .espt-ft-contact-row:hover,
.espt-block-footer .espt-ft-contact-row:focus-visible {
	color: var(--ftc-link-h);
}

/* -------------------------------------------------------- social icons */

.espt-block-footer .espt-ft-social-label {
	color: var(--ftc-heading);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	margin: 18px 0 10px;
	opacity: 0.85;
	text-transform: uppercase;
}

.espt-block-footer .espt-ft-social {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 14px;
}

.espt-block-footer .espt-ft-social-label + .espt-ft-social {
	margin-top: 0;
}

.espt-block-footer .espt-ft-social a {
	align-items: center;
	background: var(--ftc-soft);
	border: 1.5px solid var(--ftc-border);
	border-radius: 50%;
	color: var(--ftc-accent);
	display: inline-flex;
	flex: none;
	height: var(--ft-soc-size, 38px);
	justify-content: center;
	width: var(--ft-soc-size, 38px);
}

.espt-block-footer .espt-ft-social a svg {
	height: 45%;
	width: 45%;
}

.espt-block-footer .espt-ft-social a:hover,
.espt-block-footer .espt-ft-social a:focus-visible {
	background: var(--ftc-accent);
	border-color: var(--ftc-accent);
	color: var(--ftc-bg);
	transform: translateY(-2px);
}

/* Shapes. */
.espt-block-footer.is-social-shape-rounded .espt-ft-social a {
	border-radius: var(--ft-radius, var(--fk-radius, 10px));
}

.espt-block-footer.is-social-shape-square .espt-ft-social a {
	border-radius: 3px;
}

/* Styles. */
.espt-block-footer.is-social-style-outline .espt-ft-social a {
	background: transparent;
	border-color: var(--ftc-accent);
}

.espt-block-footer.is-social-style-solid .espt-ft-social a {
	background: var(--ftc-accent);
	border-color: var(--ftc-accent);
	color: var(--ftc-bg);
}

.espt-block-footer.is-social-style-solid .espt-ft-social a:hover,
.espt-block-footer.is-social-style-solid .espt-ft-social a:focus-visible {
	filter: brightness(1.12);
}

.espt-block-footer.is-social-style-plain .espt-ft-social a {
	background: transparent;
	border-color: transparent;
	border-radius: 0;
	height: auto;
	width: auto;
}

.espt-block-footer.is-social-style-plain .espt-ft-social a svg {
	height: calc(var(--ft-soc-size, 38px) * 0.6);
	width: calc(var(--ft-soc-size, 38px) * 0.6);
}

.espt-block-footer.is-social-style-plain .espt-ft-social a:hover,
.espt-block-footer.is-social-style-plain .espt-ft-social a:focus-visible {
	background: transparent;
	color: var(--ftc-link-h);
}

/* --------------------------------------------------- inline link rows */

.espt-block-footer .espt-ft-links-inline {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ft-link-gap, var(--fk-link-gap, 10px)) calc(var(--ft-link-gap, var(--fk-link-gap, 10px)) + 12px);
	justify-content: center;
	list-style: none;
	margin: 0;
	max-width: 100%;
	min-width: 0;
	padding: 0;
}

.espt-block-footer .espt-ft-links-inline li {
	margin: 0;
	min-width: 0;
}

/* ---------------------------------------------------------- policy row */

.espt-block-footer .espt-ft-policy-wrap {
	padding-top: 26px;
}

.espt-block-footer .espt-ft-policy {
	display: flex;
	flex-wrap: wrap;
	font-size: 13px;
	gap: var(--ft-link-gap, var(--fk-link-gap, 10px)) 0;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.espt-block-footer .espt-ft-policy li {
	align-items: center;
	display: flex;
	min-width: 0;
}

.espt-block-footer .espt-ft-policy li:not(:last-child)::after {
	content: "|";
	margin: 0 12px;
	opacity: 0.35;
}

/* ---------------------------------------------------------- bottom bar */

.espt-block-footer .espt-ft-bottom {
	background: var(--ftc-bottom-bg);
	color: var(--ftc-bottom-text);
	font-size: 13px;
}

.espt-block-footer .espt-ft-bottom.has-border {
	border-top: 1px solid var(--ftc-border);
}

.espt-block-footer .espt-ft-bottom-inner {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 10px 20px;
	justify-content: space-between;
	padding-bottom: 16px;
	padding-top: 16px;
	text-align: center;
}

.espt-block-footer .espt-ft-copy {
	min-width: 0;
}

.espt-block-footer .espt-ft-copy p {
	margin: 0;
}

.espt-block-footer .espt-ft-bottom-right {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	justify-content: center;
	min-width: 0;
}

.espt-block-footer .espt-ft-payments {
	max-width: 100%;
	min-width: 0;
}

.espt-block-footer .espt-ft-payments img {
	border-radius: calc(var(--ft-radius, var(--fk-radius, 10px)) * 0.5);
	display: block;
	height: auto;
	max-height: var(--ft-pay-h, var(--fk-pay-h, 26px));
	/* A wide strip at 26px tall is still ~500px wide — never let it push the
	   bottom bar past a 320px viewport. */
	max-width: 100%;
	object-fit: contain;
	width: auto;
}

.espt-block-footer .espt-ft-credit a {
	color: var(--ftc-accent);
	font-weight: 700;
}

.espt-block-footer .espt-ft-credit a:hover,
.espt-block-footer .espt-ft-credit a:focus-visible {
	color: var(--ftc-link-h);
}

/* ---------------------------------------------------- link hover effects */

.espt-block-footer .espt-ftfx-arrow .espt-ft-col .espt-ft-links a {
	align-items: center;
	display: inline-flex;
	gap: 7px;
}

.espt-block-footer .espt-ftfx-arrow .espt-ft-col .espt-ft-links a::before {
	background: var(--ftc-accent);
	content: "";
	flex: none;
	height: 11px;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 0.15s ease;
	width: 11px;
}

.espt-block-footer .espt-ftfx-arrow .espt-ft-col .espt-ft-links a:hover::before {
	transform: translateX(3px);
}

.espt-block-footer .espt-ftfx-underline .espt-ft-links a,
.espt-block-footer .espt-ftfx-underline .espt-ft-links-inline a,
.espt-block-footer .espt-ftfx-underline .espt-ft-policy a {
	background-image: linear-gradient(currentColor, currentColor);
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 0 1px;
	transition: background-size 0.2s ease, color 0.15s ease;
}

.espt-block-footer .espt-ftfx-underline .espt-ft-links a:hover,
.espt-block-footer .espt-ftfx-underline .espt-ft-links-inline a:hover,
.espt-block-footer .espt-ftfx-underline .espt-ft-policy a:hover {
	background-size: 100% 1px;
}

.espt-block-footer .espt-ftfx-shift .espt-ft-links a:hover,
.espt-block-footer .espt-ftfx-shift .espt-ft-links-inline a:hover {
	transform: translateX(4px);
}

/* ------------------------------------------------- design: split (dark) */

.espt-block-footer .espt-ft-split .espt-ft-contact-row svg {
	background: transparent;
	border: 1.5px solid var(--ftc-border);
	padding: 10px;
}

.espt-block-footer .espt-ft-split .espt-ft-social a {
	background: transparent;
	border-color: var(--ftc-border);
	border-radius: var(--ft-radius, var(--fk-radius, 10px));
}

.espt-block-footer .espt-ft-split .espt-ft-social a:hover,
.espt-block-footer .espt-ft-split .espt-ft-social a:focus-visible {
	background: var(--ftc-accent);
	border-color: var(--ftc-accent);
	color: var(--ftc-bg);
}

/* --------------------------------------------------- design: centered */

.espt-block-footer .espt-ft-centered .espt-ft-main {
	gap: calc(var(--ft-col-gap, var(--fk-col-gap, 26px)) * 0.5);
	justify-items: center;
	text-align: center;
}

.espt-block-footer .espt-ft-centered .espt-ft-brand {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.espt-block-footer .espt-ft-centered .espt-ft-about {
	margin-left: auto;
	margin-right: auto;
}

.espt-block-footer .espt-ft-centered .espt-ft-social {
	justify-content: center;
}

/* The centered design still renders the contact card, so its title must stay
   visible — the "Contact title" control would otherwise do nothing. */
.espt-block-footer .espt-ft-centered .espt-ft-title {
	margin-bottom: 10px;
	text-align: center;
}

.espt-block-footer .espt-ft-centered .espt-ft-contact-rows {
	align-items: center;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 10px 22px;
	justify-content: center;
}

.espt-block-footer .espt-ft-centered .espt-ft-contact-row {
	align-items: center;
}

/* ---------------------------------------------------- design: minimal */

.espt-block-footer .espt-ft-minimal .espt-ft-bar {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: calc(var(--ft-col-gap, var(--fk-col-gap, 26px)) * 0.6);
	text-align: center;
}

.espt-block-footer .espt-ft-minimal .espt-ft-brand {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 12px 18px;
	justify-content: center;
}

.espt-block-footer .espt-ft-minimal .espt-ft-about,
.espt-block-footer .espt-ft-minimal .espt-ft-title,
.espt-block-footer .espt-ft-minimal .espt-ft-social-label {
	display: none;
}

.espt-block-footer .espt-ft-minimal .espt-ft-social {
	margin-top: 0;
}

.espt-block-footer .espt-ft-minimal .espt-ft-contact-rows {
	align-items: center;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px 18px;
	justify-content: center;
	margin-top: 0;
}

.espt-block-footer .espt-ft-minimal .espt-ft-contact-row svg {
	background: transparent;
	padding: 0;
}

.espt-block-footer .espt-ft-minimal .espt-ft-body {
	padding-bottom: calc(var(--ft-pad, var(--fk-pad-r, 32px)) * 0.6);
	padding-top: calc(var(--ft-pad, var(--fk-pad-r, 32px)) * 0.6);
}

/* ---------------------------------------------------- design: widgets */

.espt-block-footer .espt-footer-grid {
	display: grid;
	gap: var(--ft-col-gap, var(--fk-col-gap, 26px));
	grid-template-columns: minmax(0, 1fr);
}

.espt-block-footer .espt-footer-col {
	min-width: 0;
}

.espt-block-footer .espt-footer-col .widget + .widget {
	margin-top: 20px;
}

.espt-block-footer .espt-footer-col .widget-title,
.espt-block-footer .espt-footer-col h2,
.espt-block-footer .espt-footer-col h3 {
	color: var(--ftc-heading);
	font-size: var(--ft-title-size, var(--fk-title-size, 15px));
	font-weight: 700;
	margin: 0 0 14px;
}

.espt-block-footer .espt-footer-col ul {
	display: flex;
	flex-direction: column;
	gap: var(--ft-link-gap, var(--fk-link-gap, 10px));
	list-style: none;
	margin: 0;
	padding: 0;
}

.espt-block-footer .espt-footer-col img {
	border-radius: calc(var(--ft-radius, var(--fk-radius, 10px)) * 0.5);
	height: auto;
	max-width: 100%;
}

/* Widget markup is arbitrary — search forms, selects and tables must stay
   inside the column on a 320px viewport. */
.espt-block-footer .espt-footer-col input,
.espt-block-footer .espt-footer-col select,
.espt-block-footer .espt-footer-col textarea {
	max-width: 100%;
}

.espt-block-footer .espt-footer-col table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
}

/* --------------------------------------------------------- ≥ 768px */

@media (min-width: 768px) {
	.espt-block-footer .espt-container {
		padding-left: 24px;
		padding-right: 24px;
	}

	.espt-block-footer .espt-ft-columns .espt-ft-main,
	.espt-block-footer .espt-ft-split .espt-ft-main {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.espt-block-footer .espt-ft-columns .espt-ft-main .espt-ft-brand,
	.espt-block-footer .espt-ft-split .espt-ft-main .espt-ft-brand {
		grid-column: 1 / -1;
	}

	.espt-block-footer .espt-ft-columns .espt-ft-cols-2,
	.espt-block-footer .espt-ft-split .espt-ft-cols-2 {
		grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.4fr);
	}

	.espt-block-footer .espt-ft-columns .espt-ft-cols-2 .espt-ft-brand,
	.espt-block-footer .espt-ft-split .espt-ft-cols-2 .espt-ft-brand,
	.espt-block-footer .espt-ft-columns .espt-ft-cols-1 .espt-ft-brand,
	.espt-block-footer .espt-ft-split .espt-ft-cols-1 .espt-ft-brand {
		grid-column: auto;
	}

	.espt-block-footer .espt-ft-columns .espt-ft-cols-1,
	.espt-block-footer .espt-ft-split .espt-ft-cols-1 {
		grid-template-columns: minmax(0, 1fr);
	}

	.espt-block-footer .espt-footer-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.espt-block-footer .espt-ft-bottom-inner {
		flex-direction: row;
		text-align: left;
	}

	/* Centered and minimal keep their bottom bar centered (plugin parity). */
	.espt-block-footer .espt-ft-centered .espt-ft-bottom-inner,
	.espt-block-footer .espt-ft-minimal .espt-ft-bottom-inner {
		justify-content: center;
		text-align: center;
	}
}

/* -------------------------------------------------------- ≥ 1024px */

@media (min-width: 1024px) {
	.espt-block-footer .espt-ft-columns .espt-ft-cols-5,
	.espt-block-footer .espt-ft-split .espt-ft-cols-5 {
		grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr);
	}

	.espt-block-footer .espt-ft-columns .espt-ft-cols-4,
	.espt-block-footer .espt-ft-split .espt-ft-cols-4 {
		grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr);
	}

	.espt-block-footer .espt-ft-columns .espt-ft-cols-3,
	.espt-block-footer .espt-ft-split .espt-ft-cols-3 {
		grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr) minmax(0, 1.4fr);
	}

	.espt-block-footer .espt-ft-columns .espt-ft-main .espt-ft-brand,
	.espt-block-footer .espt-ft-split .espt-ft-main .espt-ft-brand {
		grid-column: auto;
	}

	.espt-block-footer .espt-footer-grid {
		grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	}

	.espt-block-footer .espt-ft-minimal .espt-ft-bar {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		text-align: left;
	}

	.espt-block-footer .espt-ft-minimal .espt-ft-brand {
		flex: none;
		justify-content: flex-start;
	}

	.espt-block-footer .espt-ft-minimal .espt-ft-social {
		flex-wrap: nowrap;
	}
}

/* -------------------------------------------------------- motion */

@media (prefers-reduced-motion: reduce) {
	.espt-block-footer .espt-ft a,
	.espt-block-footer .espt-ft-social a,
	.espt-block-footer .espt-ftfx-underline .espt-ft-links a,
	.espt-block-footer .espt-ftfx-underline .espt-ft-links-inline a,
	.espt-block-footer .espt-ftfx-underline .espt-ft-policy a,
	.espt-block-footer .espt-ftfx-arrow .espt-ft-col .espt-ft-links a::before {
		transition: none;
	}

	.espt-block-footer .espt-ft-social a:hover,
	.espt-block-footer .espt-ftfx-shift .espt-ft-links a:hover,
	.espt-block-footer .espt-ftfx-shift .espt-ft-links-inline a:hover,
	.espt-block-footer .espt-ftfx-arrow .espt-ft-col .espt-ft-links a:hover::before {
		transform: none;
	}
}

/* =========================================================================
   Kit designs (.esptb-ft) — harbor, trustline, midnight, bento, monogram,
   kiosk, hotline, wave, gallery, atlas, aurora, compass.

   The palette (--ftc-*) is built per colour tone from the theme tokens
   (--fk-*) above; the block's own colours (--ft-*) always win. A design's
   own stylesheet (assets/css/blocks/footer/<slug>.css) only arranges and
   restyles these parts.
   ========================================================================= */

/* ---------------------------------------------------------------- tones */

/* "site" — eSP Theme → Footer colours (also the base for the others). */
.espt-block-footer .esptb-ft {
	--ftc-bg: var(--ft-bg, var(--fk-bg));
	--ftc-heading: var(--ft-heading, var(--fk-heading));
	--ftc-text: var(--ft-text, var(--fk-text));
	--ftc-link: var(--ft-link, var(--fk-link));
	--ftc-link-h: var(--ft-link-h, var(--fk-link-h));
	--ftc-accent: var(--ft-accent, var(--fk-accent));
	--ftc-fill: var(--ft-accent, var(--fk-accent));
	--ftc-on-fill: #fff;
	--ftc-line: var(--ft-border, var(--fk-line));
	--ftc-bottom-bg: var(--ft-bottom-bg, var(--fk-bottom-bg));
	--ftc-band-bg: var(--ft-band-bg, var(--fk-brand));
	--ftc-band-text: var(--ft-band-text, #fff);
	/* Derived — they follow whichever tone is active. */
	--ftc-bottom-text: var(--ft-bottom-text, var(--ftc-text));
	--ftc-card: var(--ft-card-bg, color-mix(in srgb, var(--ftc-heading) 6%, var(--ftc-bg)));
	--ftc-soft: color-mix(in srgb, var(--ftc-heading) 9%, transparent);
	--ftc-muted: color-mix(in srgb, var(--ftc-text) 78%, transparent);
	/* The accent as text / icons, pulled toward the heading colour so it
	   reads on the footer background (fills keep the pure --ftc-fill). */
	--ftc-accent-ink: color-mix(in srgb, var(--ftc-accent) 72%, var(--ftc-heading));
	--ftc-accent-soft: color-mix(in srgb, var(--ftc-accent) 16%, transparent);
	--ftc-radius: var(--ft-radius, var(--fk-radius));
	--ftc-gap: var(--ft-col-gap, var(--fk-col-gap));
}

.espt-block-footer .esptb-ft.is-tone-light {
	--ftc-bg: var(--ft-bg, #fff);
	--ftc-heading: var(--ft-heading, var(--fk-ink));
	--ftc-text: var(--ft-text, var(--fk-body-text));
	--ftc-link: var(--ft-link, var(--fk-body-text));
	--ftc-link-h: var(--ft-link-h, var(--fk-brand));
	--ftc-accent: var(--ft-accent, var(--fk-brand));
	--ftc-fill: var(--ft-accent, var(--fk-brand));
	--ftc-line: var(--ft-border, var(--fk-body-line));
	--ftc-bottom-bg: var(--ft-bottom-bg, color-mix(in srgb, var(--fk-ink) 4%, #fff));
}

.espt-block-footer .esptb-ft.is-tone-dark {
	--ftc-bg: var(--ft-bg, color-mix(in srgb, var(--fk-ink) 88%, var(--fk-brand)));
	--ftc-heading: var(--ft-heading, #fff);
	--ftc-text: var(--ft-text, rgba(255, 255, 255, 0.72));
	--ftc-link: var(--ft-link, rgba(255, 255, 255, 0.86));
	--ftc-link-h: var(--ft-link-h, color-mix(in srgb, var(--fk-brand) 55%, #fff));
	--ftc-accent: var(--ft-accent, color-mix(in srgb, var(--fk-brand) 65%, #fff));
	--ftc-fill: var(--ft-accent, var(--fk-brand));
	--ftc-line: var(--ft-border, rgba(255, 255, 255, 0.12));
	--ftc-bottom-bg: var(--ft-bottom-bg, rgba(0, 0, 0, 0.25));
}

.espt-block-footer .esptb-ft.is-tone-tint {
	--ftc-bg: var(--ft-bg, color-mix(in srgb, var(--fk-brand) 7%, #fff));
	--ftc-heading: var(--ft-heading, var(--fk-ink));
	--ftc-text: var(--ft-text, var(--fk-body-text));
	--ftc-link: var(--ft-link, var(--fk-body-text));
	--ftc-link-h: var(--ft-link-h, var(--fk-brand-dark));
	--ftc-accent: var(--ft-accent, var(--fk-brand));
	--ftc-fill: var(--ft-accent, var(--fk-brand));
	--ftc-line: var(--ft-border, color-mix(in srgb, var(--fk-brand) 18%, #fff));
	--ftc-bottom-bg: var(--ft-bottom-bg, color-mix(in srgb, var(--fk-brand) 12%, #fff));
}

.espt-block-footer .esptb-ft.is-tone-brand {
	--ftc-bg: var(--ft-bg, var(--fk-brand));
	--ftc-heading: var(--ft-heading, #fff);
	--ftc-text: var(--ft-text, rgba(255, 255, 255, 0.84));
	--ftc-link: var(--ft-link, rgba(255, 255, 255, 0.92));
	--ftc-link-h: var(--ft-link-h, #fff);
	--ftc-accent: var(--ft-accent, #fff);
	--ftc-fill: var(--ft-accent, #fff);
	--ftc-on-fill: var(--fk-brand-dark);
	--ftc-line: var(--ft-border, rgba(255, 255, 255, 0.22));
	--ftc-bottom-bg: var(--ft-bottom-bg, rgba(0, 0, 0, 0.16));
	--ftc-band-bg: var(--ft-band-bg, var(--fk-brand-dark));
}

/* ----------------------------------------------------------------- root */

.espt-block-footer .esptb-ft {
	background: var(--ftc-bg);
	color: var(--ftc-text);
	font-family: var(--fk-font);
	font-size: var(--ft-link-size, var(--fk-link-size));
	line-height: 1.7;
	overflow-wrap: anywhere;
	position: relative;
	width: 100%;
}

.espt-block-footer .esptb-ft *,
.espt-block-footer .esptb-ft *::before,
.espt-block-footer .esptb-ft *::after {
	box-sizing: border-box;
}

/* :where() keeps this reset below every part's own margin (about, captions). */
.espt-block-footer .esptb-ft :where(p) { margin: 0; }

.espt-block-footer .esptb-ft a {
	color: var(--ftc-link);
	text-decoration: none;
	transition: color 0.15s ease, background-color 0.2s ease, border-color 0.2s ease, transform 0.15s ease, filter 0.2s ease;
}

.espt-block-footer .esptb-ft a:hover { color: var(--ftc-link-h); }

.espt-block-footer .esptb-ft a:focus-visible,
.espt-block-footer .esptb-ft button:focus-visible {
	outline: 2px solid var(--ftc-accent-ink);
	outline-offset: 2px;
}

.espt-block-footer .esptb-ft-wrap {
	margin: 0 auto;
	max-width: var(--ft-max, var(--fk-max));
	padding-left: 16px;
	padding-right: 16px;
	width: 100%;
}

.espt-block-footer .esptb-ft-body {
	padding-bottom: var(--ft-pad, var(--fk-pad-r));
	padding-top: var(--ft-pad, var(--fk-pad-r));
}

.espt-block-footer .esptb-ft-ic {
	display: inline-flex;
	flex: none;
	line-height: 0;
}

.espt-block-footer .esptb-ft-ic svg {
	display: block;
	height: 18px;
	width: 18px;
}

/* ---------------------------------------------------------------- brand */

.espt-block-footer .esptb-ft-brand { min-width: 0; }

.espt-block-footer .esptb-ft-logo {
	align-items: center;
	display: inline-flex;
	max-width: 100%;
	vertical-align: top;
}

.espt-block-footer .esptb-ft a.esptb-ft-logo,
.espt-block-footer .esptb-ft a.esptb-ft-logo:hover { color: var(--ftc-heading); }

.espt-block-footer .esptb-ft-logo img {
	display: block;
	height: auto;
	max-height: calc(var(--ft-logo-w, 150px) * 0.55);
	max-width: 100%;
	object-fit: contain;
	object-position: left center;
	width: var(--ft-logo-w, 150px);
}

.espt-block-footer .esptb-ft-logo-text {
	font-family: var(--fk-display);
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.2;
}

.espt-block-footer .esptb-ft-about {
	margin-top: 14px;
	max-width: 46ch;
}

.espt-block-footer .esptb-ft-brand > .esptb-ft-social,
.espt-block-footer .esptb-ft-brand > .esptb-ft-social-h { margin-top: 18px; }

.espt-block-footer .esptb-ft-brand > .esptb-ft-social-h + .esptb-ft-social { margin-top: 10px; }

/* ------------------------------------------------------ columns & links */

.espt-block-footer .esptb-ft-col { min-width: 0; }

.espt-block-footer .esptb-ft-title {
	color: var(--ftc-heading);
	font-family: var(--fk-display);
	font-size: var(--ft-title-size, var(--fk-title-size));
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.35;
	margin: 0 0 14px;
	padding: 0;
	text-transform: var(--fk-title-tt);
}

.espt-block-footer .esptb-ft-links {
	display: flex;
	flex-direction: column;
	gap: var(--ft-link-gap, var(--fk-link-gap));
	list-style: none;
	margin: 0;
	padding: 0;
}

.espt-block-footer .esptb-ft-links li,
.espt-block-footer .esptb-ft-inline li {
	margin: 0;
	min-width: 0;
}

.espt-block-footer .esptb-ft-links a {
	display: inline-block;
	padding: 2px 0;
}

/* A row of links (centred designs). */
.espt-block-footer .esptb-ft-inline {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Phones: footer.js wraps a foldable title in this toggle. */
.espt-block-footer .esptb-ft .esptb-ft-toggle {
	align-items: center;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	color: inherit;
	cursor: pointer;
	display: flex;
	font: inherit;
	gap: 12px;
	justify-content: space-between;
	letter-spacing: inherit;
	line-height: inherit;
	margin: 0;
	min-height: 50px;
	padding: 10px 0;
	text-align: left;
	text-transform: inherit;
	transform: none;
	width: 100%;
}

.espt-block-footer .esptb-ft .esptb-ft-toggle:hover {
	background: none;
	color: inherit;
	transform: none;
}

.espt-block-footer .esptb-ft-caret {
	border-bottom: 2px solid currentColor;
	border-right: 2px solid currentColor;
	flex: none;
	height: 9px;
	margin-right: 4px;
	opacity: 0.7;
	transform: translateY(-2px) rotate(45deg);
	transition: transform 0.2s ease;
	width: 9px;
}

.espt-block-footer .esptb-ft-toggle[aria-expanded="true"] .esptb-ft-caret { transform: translateY(2px) rotate(-135deg); }

.espt-block-footer .esptb-ft.is-folded .esptb-ft-col.is-foldable { border-bottom: 1px solid var(--ftc-line); }
.espt-block-footer .esptb-ft.is-folded .esptb-ft-col.is-foldable .esptb-ft-title { margin: 0; }
.espt-block-footer .esptb-ft.is-folded .esptb-ft-col.is-foldable .esptb-ft-panel { padding: 2px 0 18px; }

/* Link effects (block setting "Link marker / hover effect"). */
.espt-block-footer .esptb-ftfx-arrow .esptb-ft-links a {
	align-items: center;
	display: inline-flex;
	gap: 8px;
}

.espt-block-footer .esptb-ftfx-arrow .esptb-ft-links a::before {
	background: var(--ftc-accent-ink);
	content: "";
	flex: none;
	height: 10px;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 0.15s ease;
	width: 10px;
}

.espt-block-footer .esptb-ftfx-arrow .esptb-ft-links a:hover::before { transform: translateX(3px); }

.espt-block-footer .esptb-ftfx-underline .esptb-ft-links a,
.espt-block-footer .esptb-ftfx-underline .esptb-ft-inline a,
.espt-block-footer .esptb-ftfx-underline .esptb-ft-policy a {
	background-image: linear-gradient(currentColor, currentColor);
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 0 1px;
	transition: background-size 0.2s ease, color 0.15s ease;
}

.espt-block-footer .esptb-ftfx-underline .esptb-ft-links a:hover,
.espt-block-footer .esptb-ftfx-underline .esptb-ft-inline a:hover,
.espt-block-footer .esptb-ftfx-underline .esptb-ft-policy a:hover { background-size: 100% 1px; }

.espt-block-footer .esptb-ftfx-shift .esptb-ft-links a:hover { transform: translateX(4px); }

/* -------------------------------------------------------------- contact */

.espt-block-footer .esptb-ft-contact {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.espt-block-footer .esptb-ft-crow {
	align-items: flex-start;
	color: var(--ftc-text);
	display: flex;
	gap: 12px;
	min-width: 0;
}

.espt-block-footer .esptb-ft a.esptb-ft-crow { color: var(--ftc-text); }
.espt-block-footer .esptb-ft a.esptb-ft-crow:hover { color: var(--ftc-link-h); }

.espt-block-footer .esptb-ft-crow .esptb-ft-ic {
	align-items: center;
	background: var(--ftc-soft);
	border-radius: var(--ftc-radius);
	color: var(--ftc-accent-ink);
	height: 36px;
	justify-content: center;
	width: 36px;
}

.espt-block-footer .esptb-ft-crow .esptb-ft-ic svg {
	height: 17px;
	width: 17px;
}

.espt-block-footer .esptb-ft-crow-t {
	display: flex;
	flex-direction: column;
	line-height: 1.45;
	min-width: 0;
	padding-top: 1px;
}

.espt-block-footer .esptb-ft-crow-k {
	color: var(--ftc-muted);
	font-size: 12px;
}

.espt-block-footer .esptb-ft-crow-v {
	color: var(--ftc-heading);
	font-weight: 600;
}

/* rows: the value alone, vertically centred on its icon */
.espt-block-footer .esptb-ft-contact.is-rows .esptb-ft-crow { align-items: center; }
.espt-block-footer .esptb-ft-contact.is-rows .esptb-ft-crow-k { display: none; }
.espt-block-footer .esptb-ft-contact.is-rows.has-captions .esptb-ft-crow-k { display: block; }
.espt-block-footer .esptb-ft-contact.is-rows .esptb-ft-crow-v { color: inherit; font-weight: 500; }
.espt-block-footer .esptb-ft-contact.is-rows .is-address,
.espt-block-footer .esptb-ft-contact.is-rows .is-hours { align-items: flex-start; }
.espt-block-footer .esptb-ft-contact.is-rows .is-address .esptb-ft-crow-t,
.espt-block-footer .esptb-ft-contact.is-rows .is-hours .esptb-ft-crow-t { padding-top: 7px; }

/* chips: pill links in a wrapping row */
.espt-block-footer .esptb-ft-contact.is-chips {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 10px;
}

.espt-block-footer .esptb-ft-contact.is-chips .esptb-ft-crow {
	align-items: center;
	background: var(--ftc-soft);
	border-radius: 999px;
	gap: 10px;
	min-height: 44px;
	padding: 6px 16px 6px 6px;
}

.espt-block-footer .esptb-ft-contact.is-chips .esptb-ft-ic {
	background: var(--ftc-fill);
	border-radius: 50%;
	color: var(--ftc-on-fill);
	height: 32px;
	width: 32px;
}

.espt-block-footer .esptb-ft-contact.is-chips .esptb-ft-crow-k { display: none; }
.espt-block-footer .esptb-ft-contact.is-chips .esptb-ft-crow-t { padding-top: 0; }

/* cards: a small card per detail */
.espt-block-footer .esptb-ft-contact.is-cards {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}

.espt-block-footer .esptb-ft-contact.is-cards .esptb-ft-crow {
	background: var(--ftc-card);
	border: 1px solid var(--ftc-line);
	border-radius: calc(var(--ftc-radius) * 1.2);
	padding: 14px;
}

.espt-block-footer .esptb-ft-contact.is-cards .esptb-ft-ic {
	background: var(--ftc-accent-soft);
	border-radius: 50%;
	height: 40px;
	width: 40px;
}

/* ----------------------------------------------------------------- hours */

.espt-block-footer .esptb-ft-hours {
	display: grid;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.espt-block-footer .esptb-ft-hours li {
	border-bottom: 1px dashed var(--ftc-line);
	display: flex;
	flex-wrap: wrap;
	gap: 2px 14px;
	justify-content: space-between;
	margin: 0;
	padding-bottom: 8px;
}

.espt-block-footer .esptb-ft-hours li:last-child { border-bottom: 0; padding-bottom: 0; }
.espt-block-footer .esptb-ft-hours-d { color: var(--ftc-heading); font-weight: 600; }
.espt-block-footer .esptb-ft-hours-t { text-align: right; }

.espt-block-footer .esptb-ft a.esptb-ft-maplink {
	align-items: center;
	color: var(--ftc-accent-ink);
	display: inline-flex;
	font-weight: 700;
	gap: 6px;
	min-height: 40px;
}

.espt-block-footer .esptb-ft a.esptb-ft-maplink:hover { color: var(--ftc-link-h); }

/* ---------------------------------------------------------------- social */

.espt-block-footer .esptb-ft-social-h {
	color: var(--ftc-heading);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	opacity: 0.85;
	text-transform: uppercase;
}

.espt-block-footer .esptb-ft-social {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.espt-block-footer .esptb-ft a.esptb-ft-soc {
	align-items: center;
	background: var(--ftc-soft);
	border: 1.5px solid transparent;
	border-radius: 50%;
	color: var(--ftc-heading);
	display: inline-flex;
	flex: none;
	height: var(--ft-soc-size, 38px);
	justify-content: center;
	width: var(--ft-soc-size, 38px);
}

.espt-block-footer .esptb-ft a.esptb-ft-soc svg {
	height: 45%;
	width: 45%;
}

.espt-block-footer .esptb-ft a.esptb-ft-soc:hover {
	background: var(--ftc-fill);
	border-color: var(--ftc-fill);
	color: var(--ftc-on-fill);
	transform: translateY(-2px);
}

.espt-block-footer.is-social-shape-rounded .esptb-ft a.esptb-ft-soc { border-radius: var(--ftc-radius); }
.espt-block-footer.is-social-shape-square .esptb-ft a.esptb-ft-soc { border-radius: 3px; }

.espt-block-footer.is-social-style-outline .esptb-ft a.esptb-ft-soc {
	background: transparent;
	border-color: var(--ftc-line);
}

.espt-block-footer.is-social-style-solid .esptb-ft a.esptb-ft-soc {
	background: var(--ftc-fill);
	border-color: var(--ftc-fill);
	color: var(--ftc-on-fill);
}

.espt-block-footer.is-social-style-solid .esptb-ft a.esptb-ft-soc:hover { filter: brightness(1.12); }

.espt-block-footer.is-social-style-plain .esptb-ft a.esptb-ft-soc {
	background: transparent;
	border-color: transparent;
	width: calc(var(--ft-soc-size, 38px) * 0.8);
}

.espt-block-footer.is-social-style-plain .esptb-ft a.esptb-ft-soc svg {
	height: 55%;
	width: 70%;
}

.espt-block-footer.is-social-style-plain .esptb-ft a.esptb-ft-soc:hover {
	background: transparent;
	border-color: transparent;
	color: var(--ftc-link-h);
}

/* ---------------------------------------------------------------- trust */

.espt-block-footer .esptb-ft-trust {
	display: grid;
	gap: 18px 12px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}

.espt-block-footer .esptb-ft-trust-i {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	min-width: 0;
	text-align: center;
}

.espt-block-footer .esptb-ft-trust-ic {
	align-items: center;
	background: var(--ftc-accent-soft);
	border-radius: 50%;
	color: var(--ftc-accent-ink);
	display: inline-flex;
	flex: none;
	height: 46px;
	justify-content: center;
	width: 46px;
}

.espt-block-footer .esptb-ft-trust-ic .esptb-ft-ic svg {
	height: 22px;
	width: 22px;
}

.espt-block-footer .esptb-ft-trust-t {
	display: flex;
	flex-direction: column;
	line-height: 1.4;
	min-width: 0;
}

.espt-block-footer .esptb-ft-trust-t strong {
	color: var(--ftc-heading);
	font-size: 14.5px;
	font-weight: 700;
}

.espt-block-footer .esptb-ft-trust-t span {
	color: var(--ftc-muted);
	font-size: 12.5px;
}

/* -------------------------------------------------------- buttons & band */

.espt-block-footer .esptb-ft-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.espt-block-footer .esptb-ft a.esptb-ft-btn {
	align-items: center;
	background: var(--ftc-fill);
	border: 1.5px solid var(--ftc-fill);
	border-radius: 999px;
	color: var(--ftc-on-fill);
	display: inline-flex;
	flex: 1 1 150px;
	font-weight: 700;
	gap: 8px;
	justify-content: center;
	line-height: 1.2;
	min-height: 46px;
	padding: 10px 20px;
	white-space: nowrap;
}

.espt-block-footer .esptb-ft a.esptb-ft-btn:hover {
	color: var(--ftc-on-fill);
	filter: brightness(1.08);
	transform: translateY(-1px);
}

.espt-block-footer .esptb-ft a.esptb-ft-btn.is-chat {
	background: transparent;
	border-color: var(--ftc-line);
	color: var(--ftc-heading);
}

.espt-block-footer .esptb-ft a.esptb-ft-btn.is-chat:hover {
	border-color: var(--ftc-accent-ink);
	color: var(--ftc-heading);
	filter: none;
}

/* The help band. */
.espt-block-footer .esptb-ft-cta {
	align-items: center;
	background: var(--ftc-band-bg);
	border-radius: calc(var(--ftc-radius) * 1.6);
	color: var(--ftc-band-text);
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 22px 18px;
	text-align: center;
}

.espt-block-footer .esptb-ft-cta-t { min-width: 0; }

.espt-block-footer .esptb-ft-cta-h {
	color: inherit;
	font-family: var(--fk-display);
	font-size: clamp(18px, 2.3vw, 24px);
	font-weight: 800;
	line-height: 1.3;
}

.espt-block-footer .esptb-ft-cta-x {
	margin-top: 4px;
	opacity: 0.88;
}

.espt-block-footer .esptb-ft-cta .esptb-ft-btns { width: 100%; }

/* The call button inverts the band: band text as its fill, band colour as its text. */
.espt-block-footer .esptb-ft-cta a.esptb-ft-btn.is-call {
	background: var(--ftc-band-text);
	border-color: var(--ftc-band-text);
	color: var(--ftc-band-bg);
}

.espt-block-footer .esptb-ft-cta a.esptb-ft-btn.is-call:hover { color: var(--ftc-band-bg); }

.espt-block-footer .esptb-ft-cta a.esptb-ft-btn.is-chat,
.espt-block-footer .esptb-ft-cta a.esptb-ft-btn.is-chat:hover {
	border-color: color-mix(in srgb, var(--ftc-band-text) 55%, transparent);
	color: var(--ftc-band-text);
}

/* --------------------------------------------------------- community card */

.espt-block-footer .esptb-ft-community {
	align-items: center;
	background: var(--ftc-card);
	border: 1px solid var(--ftc-line);
	border-radius: calc(var(--ftc-radius) * 1.4);
	display: grid;
	gap: 12px 14px;
	grid-template-columns: auto minmax(0, 1fr);
	padding: 16px;
}

.espt-block-footer .esptb-ft-community-ic {
	align-items: center;
	background: var(--ftc-fill);
	border-radius: 50%;
	color: var(--ftc-on-fill);
	display: inline-flex;
	height: 46px;
	justify-content: center;
	width: 46px;
}

.espt-block-footer .esptb-ft-community-ic .esptb-ft-ic svg {
	height: 22px;
	width: 22px;
}

.espt-block-footer .esptb-ft-community-h {
	color: var(--ftc-heading);
	font-weight: 700;
	line-height: 1.35;
}

.espt-block-footer .esptb-ft-community-x {
	color: var(--ftc-muted);
	font-size: 13px;
	line-height: 1.5;
	margin-top: 2px;
}

.espt-block-footer .esptb-ft-community a.esptb-ft-btn { grid-column: 1 / -1; }

/* ------------------------------------------------------------ app badges */

.espt-block-footer .esptb-ft-apps-h {
	color: var(--ftc-heading);
	font-weight: 700;
	margin-bottom: 10px;
}

.espt-block-footer .esptb-ft-apps-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.espt-block-footer .esptb-ft a.esptb-ft-app {
	align-items: center;
	background: var(--ftc-heading);
	border-radius: 10px;
	color: var(--ftc-bg);
	display: inline-flex;
	gap: 10px;
	line-height: 1.2;
	min-height: 48px;
	padding: 6px 16px 6px 12px;
}

.espt-block-footer .esptb-ft a.esptb-ft-app:hover {
	color: var(--ftc-bg);
	transform: translateY(-1px);
}

.espt-block-footer .esptb-ft-app .esptb-ft-ic svg {
	height: 22px;
	width: 22px;
}

.espt-block-footer .esptb-ft-app small {
	display: block;
	font-size: 10.5px;
	opacity: 0.8;
}

.espt-block-footer .esptb-ft-app strong {
	display: block;
	font-size: 15px;
	font-weight: 700;
}

/* ----------------------------------------------------------- wordmark */

.espt-block-footer .esptb-ft-wordmark {
	color: var(--ftc-heading);
	font-family: var(--fk-display);
	font-size: clamp(40px, calc(92vw / (var(--wm-len, 8) * 0.62)), 240px);
	font-weight: 800;
	letter-spacing: -0.03em;
	/* Room above and below for Bengali vowel signs; only the sides clip. */
	line-height: 1.2;
	overflow: clip visible;
	padding-bottom: 0.06em;
	padding-top: 0.06em;
	text-align: center;
	user-select: none;
	white-space: nowrap;
}

/* ---------------------------------------------------------- product strip */

.espt-block-footer .esptb-ft-prods-head {
	align-items: baseline;
	display: flex;
	gap: 12px;
	justify-content: space-between;
	margin-bottom: 14px;
}

.espt-block-footer .esptb-ft-prods-h {
	color: var(--ftc-heading);
	font-family: var(--fk-display);
	font-size: var(--ft-title-size, var(--fk-title-size));
	font-weight: 700;
	line-height: 1.35;
	margin: 0;
	text-transform: var(--fk-title-tt);
}

.espt-block-footer .esptb-ft a.esptb-ft-prods-all {
	align-items: center;
	color: var(--ftc-accent-ink);
	display: inline-flex;
	flex: none;
	font-size: 13px;
	font-weight: 700;
	gap: 4px;
	white-space: nowrap;
}

.espt-block-footer .esptb-ft-prods-all .esptb-ft-ic svg {
	height: 15px;
	width: 15px;
}

.espt-block-footer .esptb-ft-prods-list {
	display: grid;
	gap: 12px;
	grid-auto-columns: minmax(132px, 42%);
	grid-auto-flow: column;
	list-style: none;
	margin: 0;
	overflow-x: auto;
	padding: 0 0 8px;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
}

.espt-block-footer .esptb-ft-prods-list li {
	margin: 0;
	min-width: 0;
	scroll-snap-align: start;
}

.espt-block-footer .esptb-ft a.esptb-ft-prod {
	color: var(--ftc-heading);
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.espt-block-footer .esptb-ft-prod-img {
	aspect-ratio: 1;
	background: var(--ftc-card);
	border-radius: var(--ftc-radius);
	display: block;
	overflow: hidden;
}

.espt-block-footer .esptb-ft-prod-img img {
	display: block;
	height: 100%;
	object-fit: cover;
	transition: transform 0.35s ease;
	width: 100%;
}

/* A WebP plugin wraps the thumbnail in <picture>. */
.espt-block-footer .esptb-ft-prod-img picture {
	display: block;
	height: 100%;
}

.espt-block-footer .esptb-ft-prod:hover .esptb-ft-prod-img img { transform: scale(1.05); }

.espt-block-footer .esptb-ft-prod-n {
	-webkit-box-orient: vertical;
	display: -webkit-box;
	font-size: 13px;
	-webkit-line-clamp: 2;
	line-height: 1.35;
	overflow: hidden;
}

.espt-block-footer .esptb-ft-prod-p {
	color: var(--ftc-accent-ink);
	font-size: 13px;
	font-weight: 700;
}

.espt-block-footer .esptb-ft-prod-p del {
	font-weight: 400;
	margin-right: 4px;
	opacity: 0.6;
}

.espt-block-footer .esptb-ft-prod-p ins { text-decoration: none; }

/* ------------------------------------------------------ payments & policy */

.espt-block-footer .esptb-ft-pay {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.espt-block-footer .esptb-ft-pay li {
	align-items: center;
	background: #fff;
	border: 1px solid color-mix(in srgb, var(--fk-ink) 12%, transparent);
	border-radius: 6px;
	color: var(--fk-ink);
	display: inline-flex;
	font-size: 11.5px;
	font-weight: 700;
	line-height: 1;
	margin: 0;
	min-height: var(--ft-pay-h, var(--fk-pay-h));
	padding: 4px 10px;
	white-space: nowrap;
}

.espt-block-footer .esptb-ft-pay.is-img img {
	border-radius: 4px;
	display: block;
	height: auto;
	max-height: var(--ft-pay-h, var(--fk-pay-h));
	max-width: 100%;
	width: auto;
}

.espt-block-footer .esptb-ft-policy {
	display: flex;
	flex-wrap: wrap;
	font-size: 13px;
	gap: 6px 0;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.espt-block-footer .esptb-ft-policy li {
	align-items: center;
	display: flex;
	margin: 0;
	min-width: 0;
}

.espt-block-footer .esptb-ft-policy li:not(:last-child)::after {
	background: currentColor;
	content: "";
	height: 12px;
	margin: 0 12px;
	opacity: 0.3;
	width: 1px;
}

/* ------------------------------------------------------------ bottom bar */

.espt-block-footer .esptb-ft-bottom {
	background: var(--ftc-bottom-bg);
	color: var(--ftc-bottom-text);
	font-size: 13px;
}

.espt-block-footer .esptb-ft-bottom.has-border { border-top: 1px solid var(--ftc-line); }

.espt-block-footer .esptb-ft-bottom-in {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 12px 24px;
	padding-bottom: max(16px, env(safe-area-inset-bottom));
	padding-top: 16px;
	text-align: center;
}

.espt-block-footer .esptb-ft-bottom-l,
.espt-block-footer .esptb-ft-bottom-r {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 8px 18px;
	justify-content: center;
	min-width: 0;
}

.espt-block-footer .esptb-ft-credit a {
	color: var(--ftc-accent-ink);
	display: inline-block;
	font-weight: 700;
	padding: 6px 0;
}

/* Thumb-sized policy links. */
.espt-block-footer .esptb-ft-policy a {
	display: inline-block;
	padding: 6px 0;
}

/* "Light plate behind the logo": a dark image logo stays readable on a dark
   footer (text logos already take the footer's heading colour). */
.espt-block-footer.is-logo-plate .esptb-ft-logo img,
.espt-block-footer.is-logo-plate .espt-ft-logo img {
	background: #fff;
	border-radius: 10px;
	box-sizing: border-box;
	padding: 6px 12px;
}

.espt-block-footer .esptb-ft .esptb-ft-totop {
	align-items: center;
	background: var(--ftc-soft);
	border: 1px solid var(--ftc-line);
	border-radius: 50%;
	box-shadow: none;
	color: var(--ftc-heading);
	cursor: pointer;
	display: inline-flex;
	flex: none;
	height: 42px;
	justify-content: center;
	line-height: 1;
	margin: 0;
	min-height: 0;
	padding: 0;
	transform: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
	width: 42px;
}

.espt-block-footer .esptb-ft .esptb-ft-totop:hover {
	background: var(--ftc-fill);
	border-color: var(--ftc-fill);
	color: var(--ftc-on-fill);
	transform: translateY(-2px);
}

.espt-block-footer .esptb-ft-totop svg { display: block; }

/* --------------------------------------------------------------- < 768px */

@media (max-width: 767px) {
	/* Thumb-sized targets: every link, contact row and icon at least 40px
	   tall (the list gap shrinks so the rhythm stays the same). */
	.espt-block-footer .esptb-ft-links { gap: max(0px, calc(var(--ft-link-gap, var(--fk-link-gap)) - 10px)); }

	.espt-block-footer .esptb-ft-links a {
		align-items: center;
		background-origin: content-box;
		display: inline-flex;
		min-height: 40px;
		padding-bottom: 8px;
		padding-top: 8px;
	}

	.espt-block-footer .esptb-ft-policy a,
	.espt-block-footer .esptb-ft-credit a {
		padding-bottom: 10px;
		padding-top: 10px;
	}

	.espt-block-footer .esptb-ft a.esptb-ft-crow { min-height: 40px; }

	.espt-block-footer .esptb-ft a.esptb-ft-soc {
		min-height: 40px;
		min-width: 40px;
	}

	/* A wrapping policy row: gaps only, no separator left hanging at a line end. */
	.espt-block-footer .esptb-ft-policy { gap: 0 20px; }
	.espt-block-footer .esptb-ft-policy li:not(:last-child)::after { content: none; }
}

/* --------------------------------------------------------------- ≥ 600px */

@media (min-width: 600px) {
	.espt-block-footer .esptb-ft-trust-i {
		flex-direction: row;
		gap: 12px;
		text-align: left;
	}
}

/* --------------------------------------------------------------- ≥ 768px */

@media (min-width: 768px) {
	.espt-block-footer .esptb-ft-wrap {
		padding-left: 24px;
		padding-right: 24px;
	}

	.espt-block-footer .esptb-ft-cta {
		flex-direction: row;
		gap: 24px;
		justify-content: space-between;
		padding: 26px 32px;
		text-align: left;
	}

	.espt-block-footer .esptb-ft-cta .esptb-ft-btns {
		flex: none;
		justify-content: flex-end;
		width: auto;
	}

	.espt-block-footer .esptb-ft-btns a.esptb-ft-btn { flex: 0 0 auto; }

	.espt-block-footer .esptb-ft-community { grid-template-columns: auto minmax(0, 1fr) auto; }
	.espt-block-footer .esptb-ft-community a.esptb-ft-btn { grid-column: auto; }

	.espt-block-footer .esptb-ft-prods-list {
		grid-auto-flow: row;
		grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
		overflow: visible;
		padding-bottom: 0;
	}

	.espt-block-footer .esptb-ft-bottom-in {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-between;
		text-align: left;
	}

	.espt-block-footer .esptb-ft-bottom-l,
	.espt-block-footer .esptb-ft-bottom-r {
		flex-direction: row;
		flex-wrap: wrap;
	}

	.espt-block-footer .esptb-ft-bottom-l { justify-content: flex-start; }
	.espt-block-footer .esptb-ft-bottom-r { justify-content: flex-end; margin-left: auto; }
	.espt-block-footer .esptb-ft-bottom .esptb-ft-policy { justify-content: flex-start; }
}

/* -------------------------------------------------------------- ≥ 1024px */

@media (min-width: 1024px) {
	.espt-block-footer .esptb-ft-trust { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
}

/* ---------------------------------------------------------------- motion */

@media (prefers-reduced-motion: reduce) {
	.espt-block-footer .esptb-ft a,
	.espt-block-footer .esptb-ft .esptb-ft-totop,
	.espt-block-footer .esptb-ft-caret,
	.espt-block-footer .esptb-ft-prod-img img,
	.espt-block-footer .esptb-ftfx-arrow .esptb-ft-links a::before,
	.espt-block-footer .esptb-ftfx-underline .esptb-ft-links a,
	.espt-block-footer .esptb-ftfx-underline .esptb-ft-inline a,
	.espt-block-footer .esptb-ftfx-underline .esptb-ft-policy a {
		transition: none;
	}

	.espt-block-footer .esptb-ft a:hover,
	.espt-block-footer .esptb-ft a.esptb-ft-soc:hover,
	.espt-block-footer .esptb-ft a.esptb-ft-btn:hover,
	.espt-block-footer .esptb-ft a.esptb-ft-app:hover,
	.espt-block-footer .esptb-ft .esptb-ft-totop:hover,
	.espt-block-footer .esptb-ftfx-arrow .esptb-ft-links a:hover::before,
	.espt-block-footer .esptb-ft-prod:hover .esptb-ft-prod-img img {
		transform: none;
	}
}