/*
 * Pond child theme - front end styles.
 * Everything here belongs to a module in inc/. Keep it that way: one block per
 * module, in the same order the modules load.
 */

:root {
	--pond-blue:      #0060AE;  /* approved primary */
	--pond-blue-dark: #004E8C;
	--pond-navy:      #013A6B;
	--pond-rink:      #02121F;  /* hero / board ground */
	--pond-board:     #05101C;
	--pond-mint:      #57E28B;  /* accent */
	--pond-amber:     #FFC23C;  /* board type, stars */
	--pond-ice:       #EAF3FB;  /* light ground */
	--pond-pale:      #DCEBF9;  /* draft cards */
	--pond-line:      #E3ECF5;  /* card borders */
	--pond-slate:     #54708A;  /* body copy */
	--pond-white:     #FFFFFF;
	--pond-promo-h:   0px;
}

/* ---------------------------------------------------------------- promo bar */

.pond-promo-bar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	background: var(--pond-promo-bg, var(--pond-blue));
	color: var(--pond-promo-color, var(--pond-white));
	font-size: 15px;
	line-height: 1.4;
	transform: translateY(0);
	transition: transform .28s ease;
	will-change: transform;
}

.pond-promo-bar__inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 13px 20px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px 14px;
	text-align: center;
}

.pond-promo-bar__text { font-weight: 500; }

.pond-promo-bar__link {
	color: inherit;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
	white-space: nowrap;
}

.pond-promo-bar__link:hover,
.pond-promo-bar__link:focus-visible { color: var(--pond-amber); opacity: 1; }

/* Pushes the whole page down by the measured bar height. */
.has-pond-promo-bar { padding-top: var(--pond-promo-h); }

.pond-promo-bar--hide-on-scroll.is-hidden { transform: translateY(-100%); }

@media (max-width: 640px) {
	.pond-promo-bar { font-size: 13.5px; }
	.pond-promo-bar__inner { padding: 11px 14px; }
}

/* -------------------------------------------------------------- top banner */

/*
 * A picture strip in the normal flow, right under the fixed promotion bar. The
 * two heights come from Pond Settings as custom properties; the image fills
 * the width and is cropped equally from both sides so the centre always shows.
 */
.pond-top-banner {
	position: relative;
	height: var(--pond-banner-h, 175px);
	overflow: hidden;
}

.pond-top-banner__link,
.pond-top-banner__picture {
	display: block;
	height: 100%;
}

/* Inset so the ring is not clipped by the overflow. */
.pond-top-banner__link:focus-visible {
	outline: 3px solid var(--pond-amber);
	outline-offset: -3px;
}

.pond-top-banner__img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center;
}

/* Same breakpoint as the mobile header, where the mobile image takes over. */
@media (max-width: 1024px) {
	.pond-top-banner { height: var(--pond-banner-h-mobile, 165px); }
}

/* -------------------------------------------------------------- login link */

.pond-login {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: inherit;
	font-weight: 600;
	line-height: 1;
}

.pond-login:hover,
.pond-login:focus-visible { opacity: .78; }

.pond-login__icon {
	width: 1em;
	height: 1em;
	flex: 0 0 auto;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") no-repeat center / contain;
	        mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* --------------------------------------------------------- quantity buttons */

.quantity { display: inline-flex; align-items: stretch; }

.pond-qty {
	width: 38px;
	border: 1px solid #d5dde4;
	background: #f4f7fa;
	color: var(--pond-blue-dark);
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	transition: background .18s ease, color .18s ease;
}

.pond-qty:hover { background: var(--pond-blue); color: var(--pond-white); }
.pond-qty:focus-visible { outline: 2px solid var(--pond-blue); outline-offset: 1px; }
.pond-qty--minus { border-radius: 4px 0 0 4px; border-right: 0; }
.pond-qty--plus  { border-radius: 0 4px 4px 0; border-left: 0; }

.quantity input.qty {
	border-radius: 0;
	text-align: center;
	-moz-appearance: textfield;
}

.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

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

@media (prefers-reduced-motion: reduce) {
	.pond-promo-bar { transition: none; }

	/* The header pills still change colour on hover, just without the lift. */
	.elementor-location-header .elementor-element-2962e783 .elementor-button,
	.elementor-location-header .pond-login { transform: none !important; }
}

/* ----------------------------------------------------------- mobile header */

/*
 * Change request #5: menu left, logo centred, net right. space-between alone
 * only centres the logo when the two flanks happen to be the same width, so the
 * flanks are given equal flex and the logo is centred between them.
 */
#pond-mobile-header {
	display: flex;
	align-items: center;
	gap: 10px;
}

#pond-mobile-header > .elementor-widget-icon,
#pond-mobile-header > .elementor-widget-woocommerce-menu-cart {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
}

#pond-mobile-header > .elementor-widget-woocommerce-menu-cart {
	display: flex;
	justify-content: flex-end;
}

#pond-mobile-header > .elementor-widget-image {
	flex: 0 1 auto;
	margin: 0;
}

/* ------------------------------------------------------------ header login */

.pond-header-login { margin: 0; }

.pond-header-login .pond-login {
	font-size: 15px;
	white-space: nowrap;
}

/* The off-canvas login sits under Live Schedule and shares its width. */
.pond-offcanvas-login .elementor-button { width: 100%; }

/* --------------------------------------------------------- form focus ring */

/*
 * Astra hardcodes #046BD2 for form focus borders in class-astra-dynamic-css.php
 * rather than reading the palette, so it has to be overridden here to keep the
 * site on a single blue.
 */
input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="date"]:focus,
select:focus,
textarea:focus,
.wpcf7 input.wpcf7-form-control:not([type="submit"]):focus,
.wpcf7 select.wpcf7-form-control:focus,
.wpcf7 textarea.wpcf7-form-control:focus {
	border-color: var(--pond-blue);
}


/* ==========================================================================
   HOMEPAGE DESIGN SYSTEM
   Styling lives on these classes rather than in per-element Elementor
   settings, so the client edits content in the editor and the look stays
   consistent. One rule here changes every instance.
   ========================================================================== */

/* -------------------------------------------------------------- primitives */

.pond-eyebrow {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--pond-blue);
	line-height: 1;
}

.pond-eyebrow--on-dark { color: var(--pond-mint); }

.pond-lede {
	color: var(--pond-slate);
	font-size: 17px;
	line-height: 1.6;
	max-width: 62ch;
}

.pond-lede p { margin: 0; }

/* The blue band section title. */
.elementor-widget-heading.pond-band { margin: 0; }

.elementor-widget-heading.pond-band .elementor-heading-title {
	display: inline-block;
	background: var(--pond-blue);
	color: var(--pond-white);
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 33px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	line-height: 1.1;
	padding: 15px 60px;
	margin: 0;
}

@media (max-width: 640px) {
	.elementor-widget-heading.pond-band .elementor-heading-title { font-size: 25px; padding: 12px 26px; letter-spacing: .06em; }
}

/* ------------------------------------------------------------------ buttons */

.elementor-widget-button.pond-btn .elementor-button {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
	border-radius: 4px;
	padding: 13px 26px;
	border: 2px solid transparent;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}

.elementor-widget-button.pond-btn--solid .elementor-button {
	background: var(--pond-blue);
	color: var(--pond-white);
	border-color: var(--pond-blue);
}
.elementor-widget-button.pond-btn--solid .elementor-button:hover,
.elementor-widget-button.pond-btn--solid .elementor-button:focus-visible {
	background: var(--pond-blue-dark);
	border-color: var(--pond-blue-dark);
	color: var(--pond-white);
}

.elementor-widget-button.pond-btn--ghost .elementor-button {
	background: transparent;
	color: var(--pond-white);
	border-color: rgba(255, 255, 255, .7);
}
.elementor-widget-button.pond-btn--ghost .elementor-button:hover,
.elementor-widget-button.pond-btn--ghost .elementor-button:focus-visible {
	background: var(--pond-white);
	color: var(--pond-blue);
	border-color: var(--pond-white);
}

.elementor-widget-button.pond-btn--ghost-dark .elementor-button {
	background: transparent;
	color: var(--pond-blue);
	border-color: var(--pond-blue);
}
.elementor-widget-button.pond-btn--ghost-dark .elementor-button:hover,
.elementor-widget-button.pond-btn--ghost-dark .elementor-button:focus-visible {
	background: var(--pond-blue);
	color: var(--pond-white);
}

.elementor-widget-button.pond-btn--link .elementor-button {
	background: none;
	border: 0;
	padding: 0;
	color: var(--pond-blue);
	letter-spacing: .1em;
}
.elementor-widget-button.pond-btn--link .elementor-button::after { content: " \2192"; }
.elementor-widget-button.pond-btn--link .elementor-button:hover { color: var(--pond-blue-dark); }

.pond-actions { padding-left: 0; padding-right: 0; }

/* -------------------------------------------------------------------- grids */

/*
 * Elementor pins `--width: 100%` from `.e-con.e-flex`, two classes of
 * specificity, so a child container's width has to be set at least as
 * specifically and through --width itself.
 */
.e-con.pond-grid { --width: 100%; }
.e-con.pond-grid > .e-con { --container-max-width: none; }

.e-con.pond-grid--3 > .e-con { --width: calc((100% - 44px) / 3); }
.e-con.pond-grid--2 > .e-con { --width: calc((100% - 22px) / 2); }

@media (max-width: 1024px) {
	.e-con.pond-grid--3 > .e-con { --width: calc((100% - 22px) / 2); }
}

@media (max-width: 767px) {
	.e-con.pond-grid--3 > .e-con { --width: 100%; }
	.e-con.pond-grid--2 > .e-con { --width: calc((100% - 10px) / 2); }
	.e-con.pond-grid--2 { --gap: 10px; }
}

/* --------------------------------------------------------------------- hero */

.pond-hero__slide { color: var(--pond-white); }

.elementor-widget-heading.pond-hero__title .elementor-heading-title {
	color: var(--pond-white);
	font-size: 54px;
	line-height: 1.02;
	margin: 0;
	max-width: 16ch;
}

.pond-hero__intro {
	color: rgba(255, 255, 255, .9);
	font-size: 18px;
	line-height: 1.55;
	max-width: 56ch;
}
.pond-hero__intro p { margin: 0; }

.pond-hero .elementor-swiper-button { color: var(--pond-white); }


@media (max-width: 767px) {
	.elementor-widget-heading.pond-hero__title .elementor-heading-title { font-size: 34px; }
	.pond-hero__intro { font-size: 16px; }
	.pond-hero .swiper { overflow: hidden; }
}

/* -------------------------------------------------------------- draft cards */

.pond-draft { overflow: hidden; }

.elementor-widget-heading.pond-draft__title .elementor-heading-title {
	color: var(--pond-navy);
	font-size: 26px;
	line-height: 1.1;
	margin: 0;
	max-width: 14ch;
}

@media (max-width: 767px) {
	.elementor-widget-heading.pond-draft__title .elementor-heading-title { font-size: 17px; }
	.pond-draft .elementor-widget-button.pond-btn .elementor-button { padding: 9px 14px; font-size: 12px; }
	.pond-draft .pond-eyebrow { font-size: 11px; }
}

/* -------------------------------------------------------- programme cards */

.pond-card { transition: box-shadow .25s ease, transform .25s ease; }

.pond-card:hover {
	box-shadow: 0 14px 30px -18px rgba(1, 58, 107, .55);
	transform: translateY(-3px);
}

.elementor-widget-image.pond-card__media { margin: 0; line-height: 0; }

.elementor-widget-image.pond-card__media img {
	display: block;
	width: 100%;
	height: 190px;
	object-fit: cover;
	background: var(--pond-ice);
}

.elementor-widget-heading.pond-card__title .elementor-heading-title {
	color: var(--pond-navy);
	font-size: 22px;
	line-height: 1.1;
	margin: 0;
}

.pond-card__desc {
	color: var(--pond-slate);
	font-size: 15px;
	line-height: 1.5;
}
.pond-card__desc p { margin: 0; }

.pond-card__foot { border-top: 1px solid var(--pond-line); }

.pond-card__meta {
	color: var(--pond-slate);
	font-size: 12px;
	letter-spacing: .1em;
}

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

/* ------------------------------------------ facebook band, matched to comp */

/* The copy column: the comp gives each piece its own top margin rather than
   spacing the column with one gap. */
.e-con.e-con.pond-fb__copy {
	--width: auto;
	flex: 1 1 320px;
	min-width: 0;
}

.elementor-widget-heading.pond-fb__badge .elementor-heading-title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: rgba(255, 255, 255, .14);
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 100px;
	padding: 8px 14px 8px 10px;
	color: var(--pond-white);
	font-family: 'Barlow', sans-serif;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.elementor-widget-heading.pond-fb__badge .elementor-heading-title::before {
	content: "";
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
	background-color: var(--pond-white);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 9h3V6h-3c-2.2 0-4 1.8-4 4v2H8v3h2v7h3v-7h3l1-3h-4v-2c0-.6.4-1 1-1z'/%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'%3E%3Cpath d='M14 9h3V6h-3c-2.2 0-4 1.8-4 4v2H8v3h2v7h3v-7h3l1-3h-4v-2c0-.6.4-1 1-1z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.elementor-widget-heading.pond-fb__badge { line-height: 0; }

.elementor-widget-heading.pond-fb__title { margin-top: 18px; }
.elementor-widget-heading.pond-fb__title .elementor-heading-title {
	margin: 0;
	color: var(--pond-white);
	font-family: 'Barlow Condensed', sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: .98;
	letter-spacing: .02em;
	text-transform: uppercase;
}

.e-con.pond-fb__copy > .elementor-widget.elementor-widget-text-editor.pond-fb__text {
	margin-top: 14px;
	max-width: 420px;
}
.elementor-widget-text-editor.pond-fb__text,
.elementor-widget-text-editor.pond-fb__text p {
	color: #C9E2F7;
	font-family: 'Barlow', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.65;
}
.elementor-widget-text-editor.pond-fb__text p { margin: 0; }

.e-con.pond-fb__actions { margin-top: 24px; }

.elementor-widget-button.pond-btn.pond-fb__follow .elementor-button {
	background: var(--pond-white);
	color: #013A6B;
	border: 0;
	border-radius: 5px;
	padding: 16px 22px;
	font-family: 'Barlow', sans-serif;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .09em;
	text-transform: uppercase;
}
.elementor-widget-button.pond-fb__follow .elementor-button:hover {
	background: var(--pond-amber);
	color: #013A6B;
}
.elementor-widget-button.pond-fb__follow .elementor-button-icon svg,
.elementor-widget-button.pond-fb__follow .elementor-button-icon { fill: #013A6B; color: #013A6B; font-size: 16px; }

.elementor-widget-button.pond-btn.pond-fb__insta .elementor-button {
	background: transparent;
	color: var(--pond-white);
	border: 2px solid rgba(255, 255, 255, .5);
	border-radius: 5px;
	padding: 14px 22px;
	font-family: 'Barlow', sans-serif;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .09em;
	text-transform: uppercase;
}
.elementor-widget-button.pond-fb__insta .elementor-button:hover {
	border-color: var(--pond-white);
	background: rgba(255, 255, 255, .12);
	color: var(--pond-white);
}

/* The photo wall: three square cells a row, hairline framed. */
.e-con-inner > .elementor-widget-gallery.pond-social__grid,
.e-con > .elementor-widget-gallery.pond-social__grid {
	--container-widget-width: auto;
	width: auto;
	max-width: none;
	flex: 1 1 340px;
	min-width: 0;
}

.pond-social__grid .e-gallery-item {
	border-radius: 6px;
	border: 2px solid rgba(255, 255, 255, .22);
	overflow: hidden;
}

.pond-social__grid .e-gallery-image { border-radius: 0; }

/* The caption overlay is not in the comp. */
.pond-social__grid .elementor-gallery-item__overlay,
.pond-social__grid .elementor-gallery-item__content { display: none; }

@media (max-width: 767px) {
	.elementor-widget-heading.pond-fb__title .elementor-heading-title { font-size: 34px; }
	.pond-social__grid .e-gallery-container { --hgap: 6px !important; --vgap: 6px !important; }
}


/* ---------------------------------------------------------------- reviews */


/* -------------------------------------------------------------------- misc */

/* ------------------------------------- programmes carousel, matched to comp */

/* The comp card: a flush 200px photo, a small blue category line, a condensed
   uppercase title, the price pinned to the bottom, then a full-width button. */
.pond-loop .swiper-slide { height: auto; }

.e-con.pond-prod {
	height: 100%;
	overflow: hidden;
}

.elementor-widget-theme-post-featured-image.pond-prod__media { width: 100%; }
.elementor-widget-theme-post-featured-image.pond-prod__media .elementor-widget-container,
.elementor-widget-theme-post-featured-image.pond-prod__media figure,
.elementor-widget-theme-post-featured-image.pond-prod__media a { display: block; }

.elementor-widget-theme-post-featured-image.pond-prod__media img {
	display: block;
	width: 100%;
	height: 200px;
	object-fit: cover;
	background: #F2F7FB;
	border-radius: 0;
}

.e-con.pond-prod__body { flex: 1 1 auto; }

.elementor-widget-heading.pond-prod__cat .elementor-heading-title {
	color: var(--pond-blue);
	font-family: 'Barlow', sans-serif;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.elementor-widget-woocommerce-product-title.pond-prod__title .product_title,
.elementor-widget-woocommerce-product-title.pond-prod__title h3 {
	margin: 0;
	padding: 0;
	color: #0A2A47;
	font-family: 'Barlow Condensed', sans-serif;
	font-size: 19px;
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: .02em;
	text-transform: uppercase;
}

/* Pinned to the bottom so every card's price and button line up. */
.elementor-widget-woocommerce-product-price.pond-prod__price { margin-top: auto; }

.pond-prod .elementor-widget-woocommerce-product-price.pond-prod__price p.price,
.pond-prod .elementor-widget-woocommerce-product-price.pond-prod__price .price .amount,
.pond-prod .elementor-widget-woocommerce-product-price.pond-prod__price .price bdi {
	color: #0A2A47;
	font-family: 'Barlow', sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
}
.pond-prod .elementor-widget-woocommerce-product-price.pond-prod__price p.price { margin: 0; }

.elementor-widget-woocommerce-product-add-to-cart.pond-prod__btn { margin-top: 6px; }

.pond-prod__btn .elementor-add-to-cart,
.pond-prod__btn .e-loop-add-to-cart-form-container,
.pond-prod__btn form.cart {
	display: block;
	width: 100%;
	margin: 0;
}

.pond-prod .elementor-widget-woocommerce-product-add-to-cart.pond-prod__btn form.cart a.button,
.pond-prod .elementor-widget-woocommerce-product-add-to-cart.pond-prod__btn form.cart .button,
.pond-prod .elementor-widget-woocommerce-product-add-to-cart.pond-prod__btn a.button,
.pond-prod .elementor-widget-woocommerce-product-add-to-cart.pond-prod__btn .button {
	display: block;
	width: 100%;
	flex: 1 1 100%;
	box-sizing: border-box;
	margin: 0;
	padding: 13px;
	border: 0;
	border-radius: 5px;
	background: var(--pond-blue);
	color: var(--pond-white);
	font-family: 'Barlow', sans-serif;
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .09em;
	text-transform: uppercase;
	text-align: center;
}

.pond-prod .elementor-widget-woocommerce-product-add-to-cart.pond-prod__btn a.button:hover,
.pond-prod .elementor-widget-woocommerce-product-add-to-cart.pond-prod__btn .button:hover {
	background: var(--pond-navy);
	color: var(--pond-white);
}

/* The comp keeps 260px cards in a 1200px row, so a sliver of the next card
   shows. Swiper sizes slides from the content box, so reserving 106px at the
   end gives (1200 - 106 - 3*18) / 4 = 260 exactly, and the fifth card peeks
   into the space that reserves. */
.pond-loop .swiper,
.pond-loop .swiper-container { padding-inline-end: 106px; }

@media (max-width: 1024px) {
	.pond-loop .swiper,
	.pond-loop .swiper-container { padding-inline-end: 90px; }
}

@media (max-width: 767px) {
	.pond-loop .swiper,
	.pond-loop .swiper-container { padding-inline-end: 113px; }
}

/* WooCommerce's spoken hint for variable products is for readers, not eyes. */
.pond-prod__btn .screen-reader-text,
.pond-prod__btn .e-loop-add-to-cart-form-container > .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* The comp's own measurements for this one action, kept off the shared ghost
   class so the other buttons on the page are left alone. */
.elementor-widget-button.pond-btn.pond-viewall .elementor-button {
	padding: 15px 26px;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .1em;
	text-transform: uppercase;
	border-width: 2px;
	border-radius: 5px;
}

/* The comp has no dots; the arrows are ours, matching the reviews slider. */
.pond-loop .swiper-pagination { display: none; }

/* The gutter goes outside the row, not out of it, so the cards keep the comp's
   260px. The container is 1320: 1200 of row plus a 60px gutter each side. */
.pond-loop .elementor-widget-container { position: relative; }
.pond-loop .swiper,
.pond-loop .swiper-container { margin-inline: 60px; }

.pond-loop .elementor-swiper-button {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	border: 1px solid var(--pond-line);
	border-radius: 50%;
	background: var(--pond-white);
	box-shadow: 0 8px 20px -8px rgba(1, 32, 60, .45);
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	z-index: 3;
	transition: background-color .15s ease, border-color .15s ease, opacity .15s ease;
}

.pond-loop .elementor-swiper-button i,
.pond-loop .elementor-swiper-button svg { display: none; }

.pond-loop .elementor-swiper-button::before {
	content: "";
	width: 10px;
	height: 17px;
	background-color: var(--pond-blue);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 14'%3E%3Cpath d='M1 1l6 6-6 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%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 8 14'%3E%3Cpath d='M1 1l6 6-6 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: background-color .15s ease;
}

.pond-loop .elementor-swiper-button-prev::before { transform: scaleX(-1); }

.pond-loop .elementor-swiper-button:hover {
	background: var(--pond-blue);
	border-color: var(--pond-blue);
}
.pond-loop .elementor-swiper-button:hover::before { background-color: var(--pond-white); }

.pond-loop .elementor-swiper-button.swiper-button-disabled { opacity: .3; pointer-events: none; }

.pond-loop .elementor-swiper-button-prev { left: 0; right: auto; }
.pond-loop .elementor-swiper-button-next { right: 0; left: auto; }

/* The standalone file scrolls by hand, so say so with the cursor. */
.pond-loop .swiper,
.pond-loop .swiper-container { cursor: grab; }
.pond-loop .swiper:active,
.pond-loop .swiper-container:active { cursor: grabbing; }
.pond-loop .pond-prod a { cursor: pointer; }

@media (max-width: 1024px) {
	.pond-loop .swiper,
	.pond-loop .swiper-container { margin-inline: 0; }
	.pond-loop .elementor-swiper-button-prev { left: 2px; }
	.pond-loop .elementor-swiper-button-next { right: 2px; }
}
.pond-map iframe { display: block; width: 100%; }

/* ---------------------------------------------------- programmes scoreboard */

.pond-board {
	display: flex;
	align-items: stretch;
	width: 100%;
	overflow: hidden;
	background: var(--pond-board);
	position: relative;
}

.pond-board__label {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 0 24px;
	background: var(--pond-blue);
	color: var(--pond-white);
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	white-space: nowrap;
	z-index: 1;
}

.pond-board__live {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 12px;
	color: var(--pond-mint);
}

.pond-board__live::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--pond-mint);
	box-shadow: 0 0 8px var(--pond-mint);
}

.pond-board__title { font-size: 15px; }

.pond-board__track {
	flex: 0 0 auto;
	display: flex;
	width: max-content;
	animation: pond-board-scroll var(--pond-board-speed, 60s) linear infinite;
}

.pond-board:hover .pond-board__track { animation-play-state: paused; }

.pond-board__run { display: flex; align-items: center; flex: 0 0 auto; }

.pond-board__item {
	display: flex;
	align-items: center;
	color: var(--pond-amber);
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	white-space: nowrap;
	padding: 20px 0;
}

.pond-board__item::after {
	content: "\25C6";
	color: var(--pond-blue);
	font-size: 9px;
	margin: 0 26px;
}

@keyframes pond-board-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

@media (max-width: 640px) {
	.pond-board__label { padding: 0 14px; gap: 8px; }
	.pond-board__title { font-size: 13px; }
	.pond-board__item { font-size: 13px; padding: 15px 0; }
	.pond-board__item::after { margin: 0 16px; }
}

@media (prefers-reduced-motion: reduce) {
	.pond-board__track { animation: none; overflow-x: auto; }
	.pond-board__run:nth-child(2) { display: none; }
}

/* ============================================ alignment with the design comp */

/* Section bands sit centred in the comp, not ranged left. */
.elementor-widget-heading.pond-band { text-align: center; }
.pond-lede { margin-inline: auto; text-align: center; }

/* ------------------------------------------------------------------- hero */

.pond-hero__slide--center { text-align: center; }

.pond-hero__slide--center .pond-hero__title .elementor-heading-title,
.pond-hero__slide--center .pond-hero__intro { max-width: none; margin-inline: auto; }

.pond-hero__slide--center .pond-actions { justify-content: center; }

/* The eyebrow reads as a small amber pill above the headline. */
.pond-hero__slide--center .pond-eyebrow--on-dark {
	display: inline-block;
	background: var(--pond-amber);
	color: var(--pond-rink);
	padding: 6px 14px;
	border-radius: 3px;
	letter-spacing: .14em;
}

/* Draft promo, floated over the hero on desktop only. */
.pond-hero__promo {
	position: absolute;
	right: 40px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	box-shadow: 0 18px 40px -20px rgba(1, 20, 36, .7);
	text-align: left;
}

.pond-hero__promo .pond-hero__promo-title .elementor-heading-title {
	color: var(--pond-navy);
	font-size: 22px;
	margin: 0;
}

.pond-hero__promo-text {
	color: var(--pond-slate);
	font-size: 13.5px;
	line-height: 1.5;
}
.pond-hero__promo-text p { margin: 0; }

@media (max-width: 1180px) {
	.e-con.pond-hero__promo { display: none; }
}

/* -------------------------------------------------------- programme cards */

.pond-card { position: relative; }

/* The category tag sits on the photograph, as a pill in the top-left. */
.pond-card .pond-eyebrow {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	background: rgba(255, 255, 255, .94);
	color: var(--pond-blue);
	padding: 6px 11px;
	border-radius: 3px;
	font-size: 11px;
	letter-spacing: .13em;
}

.pond-card__foot { border-top: 0; padding-top: 10px; }

.elementor-widget-button.pond-btn--sm .elementor-button {
	padding: 9px 18px;
	font-size: 13px;
}

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

.pond-social {
	background: var(--pond-blue);
	color: var(--pond-white);
}

.e-con.pond-social__copy { --width: calc(50% - 20px); }
.e-con.pond-social__row > .elementor-widget-gallery { width: calc(50% - 20px); }

.pond-social .pond-eyebrow {
	display: inline-block;
	background: rgba(255, 255, 255, .16);
	color: var(--pond-white);
	padding: 6px 13px;
	border-radius: 3px;
}

.pond-social .elementor-widget-heading.pond-band { text-align: left; }

.pond-social .elementor-widget-heading.pond-band .elementor-heading-title {
	background: none;
	padding: 0;
	font-size: 44px;
	line-height: 1.02;
	max-width: 12ch;
}

.pond-social .pond-lede {
	color: rgba(255, 255, 255, .9);
	text-align: left;
	margin-inline: 0;
	max-width: 46ch;
}

.pond-social .elementor-widget-button.pond-btn--solid .elementor-button {
	background: var(--pond-white);
	color: var(--pond-blue);
	border-color: var(--pond-white);
}
.pond-social .elementor-widget-button.pond-btn--solid .elementor-button:hover {
	background: transparent;
	color: var(--pond-white);
}

.pond-social .elementor-widget-button.pond-btn--ghost-dark .elementor-button {
	color: var(--pond-white);
	border-color: rgba(255, 255, 255, .6);
}
.pond-social .elementor-widget-button.pond-btn--ghost-dark .elementor-button:hover {
	background: var(--pond-white);
	color: var(--pond-blue);
}

@media (max-width: 900px) {
	.e-con.pond-social__row { --flex-direction: column; }
	.e-con.pond-social__copy,
	.e-con.pond-social__row > .elementor-widget-gallery { --width: 100%; width: 100%; }
	.pond-social .elementor-widget-heading.pond-band .elementor-heading-title { font-size: 32px; max-width: none; }
}

.pond-board__status {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	padding: 0 20px;
	background: var(--pond-mint);
	color: var(--pond-rink);
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	white-space: nowrap;
	z-index: 1;
}

@media (max-width: 640px) {
	.pond-board__status { padding: 0 12px; font-size: 12px; }
}

/* The hero promo is positioned against the carousel band. */
.e-con.pond-hero { position: relative; }

/* ------------------------------------------------- comp alignment, part two */

/*
 * Elementor containers are position:relative by default, so the card body was
 * acting as the containing block and the tag landed below the photograph
 * instead of on it.
 */
.e-con.pond-card__body { position: static; }

/* The hero promo has to escape the flex flow, and --width is the only lever
   Elementor leaves for a container's width. */
.e-con.pond-hero__promo {
	position: absolute;
	--width: 300px;
}


/* ======================================================= comp: exact values
   Measured off the approved comp at 1440px and matched here rather than
   estimated. Reference figures are noted beside each rule.
   ======================================================================== */

/* Eyebrow: Barlow 11/700, tracking 1.98px, amber on deep navy. */
.pond-eyebrow {
	font-family: Barlow, system-ui, sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.98px;
}

.pond-hero__slide--center .pond-eyebrow--on-dark {
	background: var(--pond-amber);
	color: #0A2A47;
	border-radius: 3px;
	padding: 7px 14px;
	letter-spacing: 1.98px;
}

/* Hero headline: 62/700, tracking 1.24px. */
.elementor-widget-heading.pond-hero__title .elementor-heading-title {
	font-size: 62px;
	letter-spacing: 1.24px;
	line-height: 1.0;
}

/* Buttons: Barlow 13.5/700, 5px radius. */
.elementor-widget-button.pond-btn .elementor-button {
	font-family: Barlow, system-ui, sans-serif;
	font-size: 13.5px;
	font-weight: 700;
	letter-spacing: 1.2px;
	border-radius: 5px;
	padding: 14px 22px;
}

.elementor-widget-button.pond-btn--sm .elementor-button {
	padding: 10px 16px;
	font-size: 12.5px;
}

/* On the hero the primary action is white, not blue. */
.pond-hero__slide .elementor-widget-button.pond-btn--solid .elementor-button {
	background: var(--pond-white);
	color: var(--pond-blue);
	border-color: var(--pond-white);
}
.pond-hero__slide .elementor-widget-button.pond-btn--solid .elementor-button:hover {
	background: transparent;
	color: var(--pond-white);
}

/* ------------------------------------------------------------------ board */

/* 76px tall; label and status blocks share the same deep panel, not the blue. */
.pond-board__label,
.pond-board__status {
	background: #0A1C2E;
	padding: 12px 24px;
	min-height: 76px;
}

.pond-board__label {
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 3px;
}

.pond-board__live {
	font-family: Barlow, system-ui, sans-serif;
	font-size: 10px;
	letter-spacing: 1.5px;
	color: var(--pond-mint);
}

.pond-board__title {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: 3.08px;
	color: var(--pond-amber);
}

.pond-board__item {
	color: var(--pond-mint);
	font-size: 19px;
	font-weight: 600;
	letter-spacing: 3.04px;
	padding: 0;
}

.pond-board__item::after { color: var(--pond-blue); font-size: 11px; margin: 0 22px; }

.pond-board__status {
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	color: var(--pond-white);
	font-size: 20px;
	letter-spacing: 2.6px;
	line-height: 1.05;
}

@media (max-width: 640px) {
	.pond-board__label, .pond-board__status { padding: 10px 14px; min-height: 62px; }
	.pond-board__title { font-size: 16px; letter-spacing: 2px; }
	.pond-board__item { font-size: 14px; letter-spacing: 2px; }
	.pond-board__status { font-size: 14px; }
}

/* The board measures 76px in the comp; let the bar set the height and the
   blocks stretch into it rather than each carrying its own min-height. */
.pond-board { min-height: 76px; }

.pond-board__label,
.pond-board__status {
	min-height: 0;
	align-self: stretch;
	padding-top: 0;
	padding-bottom: 0;
}

/* The comp's card column measures 1199px inside the 1240 shell: 385 x 3 plus
   two 22px gutters. Pin the grids so the arithmetic lands exactly. */
.e-con.pond-grid {
	max-width: 1200px;
	margin-inline: auto;
}

/* ===================================================== header, comp values */

.pond-promo-bar { font-family: Barlow, system-ui, sans-serif; }
.pond-promo-bar__inner { padding: 13px 20px; gap: 6px 12px; }

.pond-promo-bar__badge {
	background: var(--pond-amber);
	color: #0A2A47;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.32px;
	text-transform: uppercase;
	padding: 5px 9px;
	border-radius: 3px;
	flex: 0 0 auto;
}

.pond-promo-bar__text { font-size: 15px; font-weight: 600; }
.pond-promo-bar__link { font-size: 15px; }

/* Contact bar: 42px, Barlow 13.5/600 in Pond Blue. */
.elementor-location-header .elementor-element-124ef594 > .e-con-inner { min-height: 42px; }

.elementor-location-header .elementor-icon-list-text,
.elementor-location-header .pond-login__label {
	font-family: Barlow, system-ui, sans-serif !important;
	font-size: 13.5px;
	font-weight: 600;
}

/* Main nav: Barlow 15px in pale blue, active item as a solid pill. */
.elementor-location-header .e-n-menu-title-text,
.elementor-location-header .elementor-item {
	font-family: Barlow, system-ui, sans-serif !important;
	font-size: 15px;
}

.elementor-location-header .e-n-menu-title:not(.e-current) .e-n-menu-title-text { color: #BFDCF3; }

/* Header buttons match the comp CTA. */
.elementor-location-header .elementor-button {
	font-family: Barlow, system-ui, sans-serif !important;
	font-size: 13.5px;
	font-weight: 700;
	letter-spacing: .945px;
	border-radius: 5px;
	padding: 12px 18px;
}

/* Contact bar sits at 42px in the comp; the template padding pushed it to 48. */
.elementor-location-header .elementor-element-124ef594 > .e-con-inner {
	min-height: 42px;
	padding-top: 0;
	padding-bottom: 0;
}
.elementor-location-header .elementor-element-124ef594 .elementor-icon-list-item { padding-block: 0; }

/*
 * The mega menu colours its titles through a custom property, so setting
 * `color` on the text span has no effect - the variable is the lever.
 */
/* Header nav items are white in the comp; #BFDCF3 belongs to the footer menu. */
.elementor-location-header .e-n-menu { --n-menu-title-color-normal: #FFFFFF; }

/*
 * Elementor scopes button styling per element id, which outranks a rule keyed
 * on the header location, so these two need to be forced.
 */
.elementor-location-header .elementor-widget-button .elementor-button {
	font-size: 13.5px !important;
	border-radius: 5px !important;
	letter-spacing: .945px !important;
}

/* The cart toggle was the tallest thing in the contact bar and set its height. */
/* superseded: the cart moved to the nav bar */
.elementor-location-header .elementor-element-124ef594 .elementor-menu-cart__toggle_wrapper { line-height: 1; }

/* The comp figures above are desktop; these scale them down and must come last
   so they outrank the exact-value rules. */
@media (max-width: 767px) {
	.elementor-widget-heading.pond-hero__title .elementor-heading-title {
		font-size: 34px;
		letter-spacing: .7px;
	}
	.pond-board { min-height: 62px; }
	.pond-hero__slide--center .pond-eyebrow--on-dark { padding: 5px 11px; letter-spacing: 1.4px; }
	.elementor-widget-button.pond-btn .elementor-button { padding: 12px 18px; font-size: 12.5px; }
}

@media (max-width: 1024px) and (min-width: 768px) {
	.elementor-widget-heading.pond-hero__title .elementor-heading-title { font-size: 48px; }
}

/* ================================================ header, measured off comp */

/* Nav links: white Barlow 14.5/600, sentence case, 10px 12px hit area. */
.elementor-location-header .e-n-menu-title,
.elementor-location-header .elementor-item {
	text-transform: none !important;
}

.elementor-location-header .e-n-menu-title-text,
.elementor-location-header .elementor-item {
	font-size: 14.5px !important;
	font-weight: 600 !important;
	letter-spacing: .29px !important;
	text-transform: none !important;
}

.elementor-location-header .e-n-menu-title { border-radius: 5px; }

/* LOGIN reads as an outlined pill in the contact bar. */
.elementor-location-header .pond-login {
	border: 1px solid var(--pond-blue);
	border-radius: 4px;
	padding: 7px 13px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .78px;
	text-transform: uppercase;
	color: var(--pond-blue);
	transition: background .2s ease, color .2s ease;
}

.elementor-location-header .pond-login:hover {
	background: var(--pond-blue);
	color: var(--pond-white);
	opacity: 1;
}

.elementor-location-header .pond-login__label {
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: .78px;
}

/* Cart: a 46px translucent tile on the blue bar, amber count bubble. */
.elementor-location-header .elementor-element-a7095fb .elementor-menu-cart__toggle .elementor-button {
	width: 46px;
	height: 46px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, .14);
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: 6px !important;
}

.elementor-location-header .elementor-menu-cart__toggle .elementor-button-text { display: none; }

.elementor-location-header .elementor-button-icon-qty {
	background: var(--pond-amber) !important;
	color: #0A2A47 !important;
	font-family: Barlow, system-ui, sans-serif;
	font-size: 11px;
	font-weight: 700;
	min-width: 19px;
	height: 19px;
	line-height: 19px;
	border-radius: 10px;
	padding: 0 5px;
}

/* The comp's header CTA is 144x38 with no icon; ours carried an arrow and a
   taller line box. */
.elementor-location-header .elementor-element-2962e783 .elementor-button-icon { display: none; }

.elementor-location-header .elementor-element-2962e783 .elementor-button {
	padding: 12px 18px !important;
	line-height: 1 !important;
}

.elementor-location-header .elementor-button-icon-qty { font-size: 11px !important; }

/* Header CTA: 700 weight and uppercase, which is what makes the comp's 144px. */
.elementor-location-header .elementor-element-2962e783 .elementor-button {
	font-weight: 700 !important;
	text-transform: uppercase !important;
}

/* The longer street address made the contact list wrap and pushed the bar to
   51px; keeping the items on one line holds it at the comp's 42. */
.elementor-location-header .elementor-element-6d080cd4 .elementor-icon-list-items {
	flex-wrap: nowrap;
	gap: 0 26px;
}

.elementor-location-header .elementor-element-6d080cd4 .elementor-icon-list-item {
	white-space: nowrap;
	margin: 0;
}

.elementor-location-header .elementor-element-6d080cd4 .elementor-icon-list-item:not(:last-child)::after {
	display: none;
}

/* The kit puts a 2px border on buttons; the comp's header CTA has none, which
   is the 4px difference in both width and height. */
.elementor-location-header .elementor-element-2962e783 .elementor-button {
	border-width: 0 !important;
}

/* Client request (Sep 2026): the header CTA and the account link are amber
   pills with the promo badge's navy type. The hover is meant to be obvious:
   the pill flips to navy with amber type, lifts 2px and picks up a shadow.
   Both sit late in the file on purpose - they have to outrank the white CTA
   and the outlined LOGIN pill above. */
.elementor-location-header .elementor-element-2962e783 .elementor-button {
	background-color: var(--pond-amber) !important;
	color: #0A2A47 !important;
	box-shadow: 0 0 0 rgba(2, 18, 31, 0);
	transition: background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.elementor-location-header .elementor-element-2962e783 .elementor-button:hover,
.elementor-location-header .elementor-element-2962e783 .elementor-button:focus-visible {
	background-color: #0A2A47 !important;
	color: var(--pond-amber) !important;
	transform: translateY(-2px);
	box-shadow: 0 8px 18px rgba(2, 18, 31, .35);
}

.elementor-location-header .pond-login {
	background: var(--pond-amber);
	border-color: var(--pond-amber);
	color: #0A2A47;
	box-shadow: 0 0 0 rgba(2, 18, 31, 0);
	transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.elementor-location-header .pond-login:hover,
.elementor-location-header .pond-login:focus-visible {
	background: #0A2A47;
	border-color: #0A2A47;
	color: var(--pond-amber);
	transform: translateY(-2px);
	box-shadow: 0 8px 18px rgba(2, 18, 31, .25);
	opacity: 1;
}

/* The contact list was boxed at 570px while its three items need ~615, so the
   address wrapped and took the bar to 51px. Let the left group size to its
   content and keep the items on one line. */
.elementor-location-header .elementor-element-124ef594 .e-con-inner > .e-con:first-child {
	--width: auto;
	flex: 0 1 auto;
}

.elementor-location-header .elementor-element-6d080cd4 .elementor-icon-list-items {
	flex-wrap: nowrap !important;
	gap: 0 22px;
}

@media (max-width: 1100px) {
	.elementor-location-header .elementor-element-6d080cd4 .elementor-icon-list-item:nth-child(2) { display: none; }
}

/* Nav bar: 74px in the comp - 12px padding around a 50px logo. Ours ran to 99
   on a 69px logo and 15px padding. */
.elementor-location-header .elementor-element-73390f28 > .e-con-inner {
	padding-top: 12px;
	padding-bottom: 12px;
}

.elementor-location-header .elementor-element-3de368f9 img {
	max-height: 50px;
	width: auto;
}

/* The cart widget was only 26px wide, clipping its own 46px tile. */
.elementor-location-header .elementor-element-a7095fb {
	width: 46px;
	flex: 0 0 46px;
}

/* ------------------------------------------- contact bar, matched to comp */

/* Social glyphs are 15px on a 12px rhythm in the comp; ours ran at 25px. */
.elementor-location-header .elementor-element-3c0a20f7 .elementor-icon-list-items {
	gap: 0 12px;
}

.elementor-location-header .elementor-element-3c0a20f7 .elementor-icon-list-item { margin: 0; }

.elementor-location-header .elementor-element-3c0a20f7 .elementor-icon-list-icon i,
.elementor-location-header .elementor-element-3c0a20f7 .elementor-icon-list-icon svg {
	font-size: 15px;
	width: 15px;
	height: 15px;
}

/* A hairline rule separates the social links from the login pill. */
.elementor-location-header .elementor-element-3c0a20f7 {
	position: relative;
	padding-right: 17px;
}

.elementor-location-header .elementor-element-3c0a20f7::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 18px;
	background: #CFE0F0;
}

/* The comp has no search in the contact bar. Hidden rather than deleted so it
   can be brought back from the template if the client wants it. */
.elementor-location-header .elementor-element-18bac920 { display: none; }

/* Logo: 85x50 in the comp. Ours was being stretched to 120 wide. */
.elementor-location-header .elementor-element-3de368f9 img {
	height: 50px !important;
	width: auto !important;
	max-width: none;
	object-fit: contain;
}

/* The count bubble sits on the top-right corner of the tile and shows even at
   zero, as it does in the comp. */
.elementor-location-header .elementor-element-a7095fb .elementor-menu-cart__toggle .elementor-button {
	position: relative;
	overflow: visible;
}

.elementor-location-header .elementor-button-icon-qty {
	position: absolute !important;
	top: -5px !important;
	right: -5px !important;
	bottom: auto !important;
	left: auto !important;
	min-width: 19px;
	height: 19px;
	display: flex !important;
	align-items: center;
	justify-content: center;
	opacity: 1 !important;
	visibility: visible !important;
}

/* The badge was anchoring to the 24px icon span rather than the 46px tile, so
   its negative offsets landed inside. Making that span static hands the
   positioning context back to the button. */
.elementor-location-header .elementor-element-a7095fb .elementor-button-icon {
	position: static;
}

/* ==================================================== hero, matched to comp */

/* Centring has to sit on the inner box too, or Elementor's own alignment wins. */
.e-con.pond-hero__slide--center,
.e-con.pond-hero__slide--center > .e-con-inner {
	text-align: center;
	align-items: center;
}

/* Description: 17px in the comp's pale blue, not the slate body colour, and
   held to the comp's 640px measure. */
.elementor-widget-text-editor.pond-hero__intro,
.elementor-widget-text-editor.pond-hero__intro p {
	color: #DCEBF9;
	font-size: 17px;
	line-height: 1.6;
}

.elementor-widget-text-editor.pond-hero__intro {
	max-width: 640px;
	margin-inline: auto;
}

/* Arrows: 46px white discs held 18px off each edge, not bare glyphs on the rim. */
.pond-hero .elementor-swiper-button {
	width: 46px;
	height: 46px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, .9);
	border-radius: 50%;
	color: var(--pond-blue);
	font-size: 26px;
	box-shadow: 0 4px 14px -6px rgba(1, 20, 36, .5);
	transition: background .2s ease;
}

.pond-hero .elementor-swiper-button:hover { background: #FFFFFF; }
.pond-hero .elementor-swiper-button-prev { left: 18px; right: auto; }
.pond-hero .elementor-swiper-button-next { right: 18px; left: auto; }

/*
 * The pagination was taking its own strip under the slide, which read as a band
 * of empty space. Floating it over the slide closes that up, as the comp has
 * it; the height it sits at comes from the widget's own offset variable.
 */
.pond-hero .swiper-pagination {
	position: absolute;
	left: 0;
	right: 0;
	z-index: 2;
}

.pond-hero .swiper { position: relative; }

@media (max-width: 767px) {
	.pond-hero .elementor-swiper-button { width: 36px; height: 36px; font-size: 20px; }
	.pond-hero .elementor-swiper-button-prev { left: 8px; }
	.pond-hero .elementor-swiper-button-next { right: 8px; }
	.elementor-widget-text-editor.pond-hero__intro,
	.elementor-widget-text-editor.pond-hero__intro p { font-size: 15.5px; }
}

/* Elementor reserves a 16px strip under the swiper for outside pagination and
   sets its own arrow offsets and widget max-width, all of which outrank a plain
   class rule. These three need forcing. */
.pond-hero .swiper {
	padding-bottom: 0 !important;
}

.pond-hero .elementor-swiper-button-prev { left: 18px !important; right: auto !important; }
.pond-hero .elementor-swiper-button-next { right: 18px !important; left: auto !important; }

.elementor-widget-text-editor.pond-hero__intro {
	max-width: 640px !important;
}

@media (max-width: 767px) {
	.pond-hero .elementor-swiper-button-prev { left: 8px !important; }
	.pond-hero .elementor-swiper-button-next { right: 8px !important; }
}

/* The chevrons were near-white on a white disc, so the arrows looked empty. */
.pond-hero .elementor-swiper-button i,
.pond-hero .elementor-swiper-button svg {
	color: var(--pond-blue) !important;
	fill: var(--pond-blue) !important;
	font-size: 22px !important;
	width: auto;
	height: auto;
}

/* The hero action row carries the class pond-actions, not pond-hero__actions;
   the earlier rules never matched it. */
.e-con.pond-actions {
	--justify-content: center;
	--align-items: center;
	--width: auto;
	margin-inline: auto;
}

.pond-hero__slide--center .e-con.pond-actions { --justify-content: center; }

/* ------------------------------------------------ draft pair, matched to comp */

.e-con.pond-draft {
	position: relative;
	overflow: hidden;
	justify-content: center;
}

/* The photograph is pinned to the right of the card and faded in from the left,
   exactly as the comp does it, so the copy stays legible over the blue. */
.elementor-widget-image.pond-draft__media {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 44%;
	margin: 0;
	z-index: 0;
	pointer-events: none;
}

.elementor-widget-image.pond-draft__media .elementor-widget-container,
.elementor-widget-image.pond-draft__media figure,
.elementor-widget-image.pond-draft__media a { height: 100%; }

.elementor-widget-image.pond-draft__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	-webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, #000 32%);
	        mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, #000 32%);
}

/* Copy sits above the photograph. */
.pond-draft > .e-con-inner > :not(.pond-draft__media),
.pond-draft > :not(.pond-draft__media) { position: relative; z-index: 1; }

.pond-draft .pond-eyebrow {
	font-size: 10px;
	letter-spacing: 2px;
	color: var(--pond-blue);
}

.elementor-widget-heading.pond-draft__title .elementor-heading-title {
	color: #0A2A47;
	font-size: 28px;
	line-height: 1.05;
	max-width: 12ch;
	margin: 0;
}

.pond-draft .elementor-widget-button.pond-btn .elementor-button {
	padding: 14px 18px;
	font-size: 12.5px;
	border-radius: 5px;
	border-width: 0;
}

@media (max-width: 767px) {
	.elementor-widget-image.pond-draft__media { width: 52%; opacity: .5; }
	.elementor-widget-heading.pond-draft__title .elementor-heading-title { font-size: 17px; }
	.pond-draft .pond-eyebrow { font-size: 9px; letter-spacing: 1.4px; }
	.pond-draft .elementor-widget-button.pond-btn .elementor-button { padding: 9px 13px; font-size: 11px; }
}

/* The boxed container's inner box carries the horizontal padding and is the
   positioning context, so the photo was landing 28px short of the card edge. */
.e-con.pond-draft > .e-con-inner { position: static; }

/* 12ch wrapped the headline onto four lines and pushed the card to 246px; the
   comp holds it to two lines inside 194. */
.elementor-widget-heading.pond-draft__title .elementor-heading-title {
	max-width: 240px;
}

@media (max-width: 767px) {
	.elementor-widget-heading.pond-draft__title .elementor-heading-title { max-width: 150px; }
}

/* Comp button is 41px tall; 13px padding gave 39. */
.pond-draft .elementor-widget-button.pond-btn .elementor-button { padding: 14px 18px; }

/* ============================ featured programs, measured off the comp */

/* The band is a parallelogram, not a rectangle with folded ends. */
.elementor-widget-heading.pond-band .elementor-heading-title {
	clip-path: polygon(22px 0, 100% 0, calc(100% - 22px) 100%, 0 100%);
	padding: 15px 60px;
	font-size: 33px;
	letter-spacing: 2.64px;
}

.elementor-widget-heading.pond-band .elementor-heading-title::before,
.elementor-widget-heading.pond-band .elementor-heading-title::after { content: none; }

/* Intro copy: 16px slate on a 640px measure. */
.pond-lede,
.pond-lede p {
	font-size: 16px;
	line-height: 1.6;
	color: var(--pond-slate);
}
.pond-lede { max-width: 640px; }

/* ------------------------------------------------------------ card innards */

.elementor-widget-image.pond-card__media img { height: 190px; }

/* Category tag: a white pill inset 13px on the photograph. */
.pond-card .pond-eyebrow {
	top: 13px;
	left: 13px;
	background: rgba(255, 255, 255, .94);
	color: var(--pond-blue);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.4px;
	padding: 6px 9px;
	border-radius: 3px;
}

.e-con.pond-card__body { padding: 18px; }

.elementor-widget-heading.pond-card__title .elementor-heading-title {
	font-size: 22px;
	color: #0A2A47;
	letter-spacing: .44px;
	line-height: 1.05;
	text-transform: uppercase;
	margin: 0 0 7px;
}

.pond-card__desc,
.pond-card__desc p {
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--pond-slate);
}

.pond-card .elementor-widget-button .elementor-button {
	padding: 12px 16px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .96px;
	border-radius: 5px;
	border-width: 0;
}

.pond-card__meta {
	font-size: 12px;
	color: #8AA5BD;
	letter-spacing: normal;
	text-transform: none;
}

@media (max-width: 640px) {
	.elementor-widget-heading.pond-band .elementor-heading-title {
		padding: 12px 30px;
		font-size: 24px;
		letter-spacing: 1.6px;
		clip-path: polygon(14px 0, 100% 0, calc(100% - 14px) 100%, 0 100%);
	}
}

/* Final trims against the comp's measurements. */

/* Band: 63px tall, so the line box must not add its own leading. */
.elementor-widget-heading.pond-band .elementor-heading-title { line-height: 1; }

/* Elementor pins widgets to max-width:100%, which was letting the intro run to
   873px instead of the comp's 640. */
.elementor-widget-text-editor.pond-lede { max-width: 640px !important; }

/* Card lands at 352: photo 190 + body 160 + 2px border. */
.e-con.pond-card__body { --gap: 5px; gap: 5px; }

/* The pill is measured from the card's outer edge, which the 1px border shifts. */
.pond-card .pond-eyebrow {
	top: 12px;
	left: 12px;
	padding: 6px 13px;
}

/* ------------------------------------------------------------- pdf viewer */

.pond-pdf__title { font-weight: 600; margin: 0 0 10px; color: var(--pond-navy); }

.pond-pdf__frame {
	width: 100%;
	border: 1px solid var(--pond-line);
	border-radius: 6px;
	display: block;
	background: var(--pond-ice);
}

.pond-pdf__fallback { margin: 10px 0 0; font-size: 14px; }

/* ------------------------------------------------------ linked containers */

.pond-linked { cursor: pointer; }
.pond-linked:focus-visible { outline: 2px solid var(--pond-blue); outline-offset: 2px; }

/* ============================================= reviews, measured off comp */

.pond-reviews__summary { padding: 0; }

.elementor-widget-heading.pond-reviews__score .elementor-heading-title {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 30px;
	font-weight: 700;
	color: #0A2A47;
	line-height: 1;
	margin: 0;
}

.elementor-widget-heading.pond-reviews__stars .elementor-heading-title,
.elementor-widget-heading.pond-review__stars .elementor-heading-title {
	color: #FFB400;
	font-size: 18px;
	letter-spacing: 2.16px;
	line-height: 1;
	margin: 0;
	text-transform: none;
}

.elementor-widget-heading.pond-review__stars .elementor-heading-title { font-size: 14px; letter-spacing: 1.6px; }

.elementor-widget-heading.pond-reviews__count .elementor-heading-title {
	font-family: Barlow, system-ui, sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: var(--pond-slate);
	letter-spacing: normal;
	text-transform: none;
	line-height: 1;
	margin: 0;
}

.elementor-widget-button.pond-reviews__write .elementor-button {
	background: none;
	border: 0;
	border-bottom: 2px solid #CFE0F0;
	border-radius: 0;
	padding: 0 0 3px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .78px;
	color: var(--pond-blue);
}
.elementor-widget-button.pond-reviews__write .elementor-button:hover { border-bottom-color: var(--pond-blue); }

/* --------------------------------------------------------- review cards */

.e-con.pond-grid--reviews > .e-con { --width: calc((100% - 48px) / 4); --container-max-width: none; }

@media (max-width: 1024px) { .e-con.pond-grid--reviews > .e-con { --width: calc((100% - 16px) / 2); } }
@media (max-width: 600px)  { .e-con.pond-grid--reviews > .e-con { --width: 100%; } }

.e-con.pond-review__head { --width: 100%; }

.elementor-widget-heading.pond-review__avatar .elementor-heading-title {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--pond-blue);
	color: var(--pond-white);
	font-family: Barlow, system-ui, sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	margin: 0;
	letter-spacing: normal;
}

.elementor-widget-heading.pond-review__avatar { flex: 0 0 auto; }

.elementor-widget-heading.pond-review__name .elementor-heading-title {
	font-family: Barlow, system-ui, sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #0A2A47;
	letter-spacing: normal;
	text-transform: none;
	line-height: 1.2;
	margin: 0;
}

.elementor-widget-heading.pond-review__date .elementor-heading-title {
	font-family: Barlow, system-ui, sans-serif;
	font-size: 12px;
	font-weight: 400;
	color: #8AA5BD;
	letter-spacing: normal;
	text-transform: none;
	line-height: 1.2;
	margin: 0;
}

.pond-review__body,
.pond-review__body p {
	font-size: 14px;
	line-height: 1.55;
	color: var(--pond-slate);
	margin: 0;
}

/* ------------------------------------------ winning band, matched to comp */

/* Comp: 700 48px/1 Barlow Condensed, uppercase, .03em. */
.elementor-widget-heading.pond-winning__title .elementor-heading-title {
	font-family: 'Barlow Condensed', sans-serif;
	font-size: 48px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: var(--pond-white);
}

/* The slate body colour was winning over the band's own rule. */
.elementor-widget-text-editor.pond-winning__text,
.elementor-widget-text-editor.pond-winning__text p {
	color: #D9EAF8;
	font-size: 16.5px;
	line-height: 1.65;
}
.elementor-widget-text-editor.pond-winning__text p { margin: 0; }

/* On the photograph the action reads white, as it does on the hero. */
.pond-winning .elementor-widget-button.pond-btn--solid .elementor-button {
	background: var(--pond-white);
	color: var(--pond-blue);
	border: 0;
	padding: 17px 30px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .1em;
	text-transform: uppercase;
	border-radius: 5px;
}
.pond-winning .elementor-widget-button.pond-btn--solid .elementor-button:hover {
	background: var(--pond-amber);
	color: #0A2A47;
}

@media (max-width: 767px) {
	.elementor-widget-heading.pond-winning__title .elementor-heading-title { font-size: 32px; }
}

/* -------------------------------------------------- reviews slider */

/* The wrapper is a plain div, so it has to be told to fill the section - left
   to itself it sizes to the track's max-content and overflows the page. */
.pond-reviews__slider {
	position: relative;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	padding-inline: 60px;
}

.pond-reviews__track {
	display: flex;
	min-width: 0;
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	padding-bottom: 2px;
}

.pond-reviews__track::-webkit-scrollbar { display: none; }

.pond-reviews__slider .pond-review {
	flex: 0 0 calc((100% - 48px) / 4);
	scroll-snap-align: start;
	background: var(--pond-white);
	border: 1px solid var(--pond-line);
	border-radius: 10px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.pond-reviews__slider .pond-review__head { display: flex; align-items: center; gap: 10px; }

.pond-review__photo,
.pond-reviews__slider .pond-review__avatar {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	flex: 0 0 auto;
	object-fit: cover;
}

.pond-reviews__slider .pond-review__avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--pond-blue);
	color: var(--pond-white);
	font-size: 14px;
	font-weight: 700;
}

.pond-reviews__slider .pond-review__name { font-size: 14px; font-weight: 600; color: #0A2A47; }
.pond-reviews__slider .pond-review__date { font-size: 12px; color: #8AA5BD; }
.pond-reviews__slider .pond-review__stars { color: #FFB400; font-size: 14px; letter-spacing: 1.6px; }
.pond-reviews__slider .pond-review__body { font-size: 14px; line-height: 1.55; color: var(--pond-slate); margin: 0; }

/* Elementor's kit styles every <button> on the site - square corners, its own
   padding and font size - so these have to out-specify `.elementor-kit-NNN
   button`: hence the tag name alongside two classes. */
.pond-reviews__slider button.pond-reviews__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	border: 1px solid var(--pond-line);
	border-radius: 50%;
	background: var(--pond-white);
	box-shadow: 0 8px 20px -8px rgba(1, 32, 60, .45);
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	z-index: 3;
	transition: background-color .15s ease, border-color .15s ease, opacity .15s ease;
}

/* A drawn chevron rather than a text glyph, which rendered small and off-centre. */
.pond-reviews__slider button.pond-reviews__nav::before {
	content: "";
	width: 10px;
	height: 17px;
	background-color: var(--pond-blue);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 14'%3E%3Cpath d='M1 1l6 6-6 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%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 8 14'%3E%3Cpath d='M1 1l6 6-6 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: background-color .15s ease;
}

.pond-reviews__slider button.pond-reviews__nav--prev::before { transform: scaleX(-1); }

.pond-reviews__slider button.pond-reviews__nav:hover {
	background: var(--pond-blue);
	border-color: var(--pond-blue);
}
.pond-reviews__slider button.pond-reviews__nav:hover::before { background-color: var(--pond-white); }

.pond-reviews__slider button.pond-reviews__nav:disabled { opacity: .3; pointer-events: none; }

.pond-reviews__slider button.pond-reviews__nav--prev { left: 0; }
.pond-reviews__slider button.pond-reviews__nav--next { right: 0; }

/* Until the Google feed is configured the Elementor cards are the track, so
   they scroll and snap the same way the live ones do. */
.e-con.pond-grid--reviews.is-pond-track {
	--flex-wrap: nowrap;
	min-width: 0;
	flex-wrap: nowrap;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
}
.e-con.pond-grid--reviews.is-pond-track::-webkit-scrollbar { display: none; }
.e-con.pond-grid--reviews.is-pond-track > .e-con {
	flex-shrink: 0;
	scroll-snap-align: start;
}

/* A slider needs more cards than slots. Four-up left nothing to scroll, so the
   track shows 3.4 across and the part-visible card advertises the scroll. */
.e-con.pond-grid--reviews.is-pond-track > .e-con,
.pond-reviews__slider .pond-review {
	--width: calc((100% - 38.4px) / 3.4);
	flex-basis: calc((100% - 38.4px) / 3.4);
}

@media (max-width: 1024px) {
	.e-con.pond-grid--reviews.is-pond-track > .e-con,
	.pond-reviews__slider .pond-review {
		--width: calc((100% - 19.2px) / 2.2);
		flex-basis: calc((100% - 19.2px) / 2.2);
	}
}

@media (max-width: 600px) {
	.e-con.pond-grid--reviews.is-pond-track > .e-con,
	.pond-reviews__slider .pond-review {
		--width: calc((100% - 2.4px) / 1.15);
		flex-basis: calc((100% - 2.4px) / 1.15);
	}
}

/* The dynamic block prints its own summary markup. */
.pond-reviews__summary .pond-reviews__score {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 30px; font-weight: 700; color: #0A2A47; line-height: 1;
}
.pond-reviews__summary .pond-reviews__stars { color: #FFB400; font-size: 18px; letter-spacing: 2.16px; }
.pond-reviews__summary .pond-reviews__count { font-size: 14px; font-weight: 500; color: var(--pond-slate); }

.pond-reviews__write-link {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .78px;
	color: var(--pond-blue);
	border-bottom: 2px solid #CFE0F0;
	padding-bottom: 3px;
	text-decoration: none;
}
.pond-reviews__write-link:hover { border-bottom-color: var(--pond-blue); }

@media (max-width: 1024px) {
	.pond-reviews__slider { padding-inline: 0; }
	.pond-reviews__slider button.pond-reviews__nav--prev { left: 2px; }
	.pond-reviews__slider button.pond-reviews__nav--next { right: 2px; }
}

/* When the live Google block renders, the hand-laid summary and cards step
   aside so the two never show at once. */
.pond-reviews:has(.pond-reviews__live .pond-reviews__slider) > .e-con-inner > .elementor-element:not(.pond-reviews__live),
.pond-reviews.pond-reviews--live > .e-con-inner > .elementor-element:not(.pond-reviews__live) {
	display: none;
}

.elementor-widget-shortcode.pond-reviews__live { width: 100%; }

/* ---------------------------------------------- footer, matched to comp */

.e-con.e-con.pond-footer__brand { --width: auto; flex: 1 1 280px; min-width: 0; }
.e-con.e-con.pond-footer__col   { --width: auto; flex: 0 1 190px; min-width: 0; }

.elementor-widget-image.pond-footer__logo img {
	display: block;
	height: 62px;
	width: auto;
	max-width: none;
}

.e-con.pond-footer__brand > .elementor-widget.elementor-widget-text-editor.pond-footer__about {
	margin-top: 18px;
	max-width: 330px;
}
.elementor-widget-text-editor.pond-footer__about,
.elementor-widget-text-editor.pond-footer__about p {
	color: #BFDCF3;
	font-family: 'Barlow', sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.6;
}
.elementor-widget-text-editor.pond-footer__about p { margin: 0; }

.elementor-widget-text-editor.pond-footer__contact { margin-top: 14px; }
.elementor-widget-text-editor.pond-footer__contact p { margin: 0; }
.elementor-widget-text-editor.pond-footer__contact a {
	display: inline-block;
	color: #8EC6FF;
	font-family: 'Barlow', sans-serif;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.5;
	text-decoration: none;
}
.elementor-widget-text-editor.pond-footer__contact a:hover { color: var(--pond-white); }
.elementor-widget-text-editor.pond-footer__contact br + a { margin-top: 4px; }

.elementor-widget-heading.pond-footer__head .elementor-heading-title {
	margin: 0 0 16px;
	color: var(--pond-white);
	font-family: 'Barlow', sans-serif;
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .14em;
	text-transform: uppercase;
}

/* Elementor's menu widget sizes and colours its own links, so these have to
   out-specify `.elementor-nav-menu .elementor-item`. */
.pond-footer__menu .elementor-nav-menu .elementor-item,
.pond-footer__menu .elementor-nav-menu a.elementor-item {
	display: block;
	padding: 7px 0;
	color: #BFDCF3;
	font-family: 'Barlow', sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.4;
	fill: #BFDCF3;
}
.pond-footer__menu .elementor-nav-menu a.elementor-item:hover,
.pond-footer__menu .elementor-nav-menu a.elementor-item:focus,
.pond-footer__menu .elementor-nav-menu a.elementor-item.elementor-item-active {
	color: var(--pond-white);
	background: none;
}

/* Client request (Sep 2026): a hovered footer link slides a touch to the right
   and nothing else. Elementor's menu stylesheet swaps the padding to 13px 20px
   on hover, which made the link jump right and grow taller; hold it steady. */
.pond-footer__menu .elementor-nav-menu a.elementor-item { transition: color .2s ease, transform .2s ease; }
.pond-footer__menu .elementor-nav-menu a.elementor-item:hover,
.pond-footer__menu .elementor-nav-menu a.elementor-item:focus,
.pond-footer__menu .elementor-nav-menu a.elementor-item:focus-visible {
	padding: 7px 0;
	line-height: 1.4;
	transform: translateX(5px);
}

.e-con.pond-footer__barwrap { border-top: 1px solid rgba(255, 255, 255, .16); }

.elementor-widget-text-editor.pond-footer__copy,
.elementor-widget-text-editor.pond-footer__copy p {
	color: #8FB5D8;
	font-family: 'Barlow', sans-serif;
	font-size: 13.5px;
	font-weight: 400;
	line-height: 1;
	margin: 0;
}

.pond-footer__social .elementor-social-icons-wrapper {
	--grid-column-gap: 14px;
	--grid-row-gap: 0px;
}
.pond-footer__social .elementor-social-icon {
	background: none;
	padding: 0;
	width: auto;
	height: auto;
	border-radius: 0;
}
.pond-footer__social .elementor-social-icon i,
.pond-footer__social .elementor-social-icon svg {
	color: #8FB5D8;
	fill: #8FB5D8;
	font-size: 16px;
	width: 16px;
	height: 16px;
}
.pond-footer__social .elementor-social-icon:hover i,
.pond-footer__social .elementor-social-icon:hover svg { color: var(--pond-white); fill: var(--pond-white); }

@media (max-width: 767px) {
	.e-con.e-con.pond-footer__col { flex: 1 1 140px; }
}

/* ------------------------------------------------- side cart, on the site's terms */

/*
 * Elementor Pro swaps WooCommerce's mini-cart for its own template, so the
 * markup here is .elementor-menu-cart__product / __subtotal / __footer-buttons,
 * not the .woocommerce-mini-cart-* elements. It drives nearly all of it from
 * custom properties, which is the clean way in - no specificity fight.
 */
.elementor-widget-woocommerce-menu-cart {
	--cart-padding: 24px 22px;
	--divider-color: var(--pond-line);
	--divider-width: 1px;
	--product-divider-gap: 18px;
	--product-price-color: var(--pond-slate);
	--remove-item-button-size: 24px;
	--remove-item-button-color: #D8E4EF;
	--remove-item-button-hover-color: #C0392B;
	--cart-footer-layout: 1fr 1fr;
	--empty-message-color: var(--pond-slate);
	--empty-message-alignment: center;
}

/* The panel is fixed but lives inside the header's stacking context, so its own
   z-index counted for nothing against the promo bar. The header now sits above
   the bar; this keeps the panel top of its own pile. */
.elementor-menu-cart__container { z-index: 9999; }

.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__main {
	width: 380px;
	max-width: 100vw;
	height: 100%;
	display: flex;
	flex-direction: column;
	background: var(--pond-white);
	color: #0A2A47;
	font-family: 'Barlow', sans-serif;
	box-shadow: -18px 0 44px -24px rgba(1, 32, 60, .5);
}

/* A titled panel reads as designed rather than as content floating at the top.
   It sits in ::before so an ajax refresh of the cart contents cannot wipe it. */
.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__main::before {
	content: "Your Cart";
	flex: 0 0 auto;
	display: block;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--pond-line);
	color: #0A2A47;
	font-family: 'Barlow Condensed', sans-serif;
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .04em;
	text-transform: uppercase;
}

/* Items take the slack and scroll; the total and the actions stay on the floor
   of the panel instead of trailing off under a tall empty space. */
.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__main .widget_shopping_cart_content {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

.elementor-menu-cart__main .elementor-menu-cart__products {
	flex: 1 1 auto;
	padding-top: 18px;
	max-height: none;
	min-height: 0;
	overflow-y: auto;
	scrollbar-width: thin;
}

.elementor-menu-cart__main .elementor-menu-cart__subtotal,
.elementor-menu-cart__main .elementor-menu-cart__footer-buttons { flex: 0 0 auto; }

/* Logged-in staff see the admin bar; the panel should start under it. */
.admin-bar .elementor-menu-cart__container { top: 32px; height: calc(100% - 32px); }

.elementor-menu-cart__main .elementor-menu-cart__close-button {
	position: absolute;
	top: 26px;
	inset-inline-end: 22px;
	margin: 0;
	color: #0A2A47;
	opacity: .5;
	transition: opacity .15s ease;
}
.elementor-menu-cart__main .elementor-menu-cart__close-button:hover { opacity: 1; }

/* Items ------------------------------------------------------------------ */

.elementor-menu-cart__main .elementor-menu-cart__product {
	grid-template-columns: 64px auto;
	align-items: start;
	border-bottom: 1px solid var(--pond-line);
}

.elementor-menu-cart__main .elementor-menu-cart__product:last-of-type { border-bottom: 0; }

.elementor-menu-cart__main .elementor-menu-cart__product-image img {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 6px;
}

.elementor-menu-cart__main .elementor-menu-cart__product-name,
.elementor-menu-cart__main .elementor-menu-cart__product-price { padding-inline-start: 14px; }

.elementor-menu-cart__main .elementor-menu-cart__product-name,
.elementor-menu-cart__main .elementor-menu-cart__product-name a {
	color: #0A2A47;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
}
.elementor-menu-cart__main .elementor-menu-cart__product-name a:hover { color: var(--pond-blue); }

.elementor-menu-cart__main .elementor-menu-cart__product-price {
	color: var(--pond-slate);
	font-size: 13.5px;
	font-weight: 500;
}
.elementor-menu-cart__main .elementor-menu-cart__product-price .amount { color: #0A2A47; font-weight: 600; }
.elementor-menu-cart__main .elementor-menu-cart__product-price .product-quantity { color: var(--pond-slate); }

.elementor-menu-cart__main .elementor-menu-cart__product-remove { color: #8FB0CC; }
.elementor-menu-cart__main .elementor-menu-cart__product-remove:hover { color: #C0392B; }

/* Subtotal and actions --------------------------------------------------- */

.elementor-menu-cart__main .elementor-menu-cart__subtotal {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	color: #0A2A47;
	font-size: 15px;
	font-weight: 600;
	text-align: start;
	border-top: 1px solid var(--pond-line);
}
.elementor-menu-cart__main .elementor-menu-cart__subtotal .amount,
.elementor-menu-cart__main .elementor-menu-cart__subtotal strong {
	font-family: 'Barlow Condensed', sans-serif;
	font-size: 26px;
	font-weight: 700;
	color: var(--pond-blue);
}

.elementor-menu-cart__main .elementor-menu-cart__footer-buttons { gap: 10px; }

.elementor-menu-cart__main .elementor-menu-cart__footer-buttons .elementor-button {
	display: block;
	width: 100%;
	padding: 14px 10px;
	border-radius: 5px;
	font-family: 'Barlow', sans-serif;
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .09em;
	text-transform: uppercase;
	text-align: center;
}

/* View cart is the quiet one, checkout is the action - the same pair the rest
   of the site uses. */
.elementor-menu-cart__main .elementor-menu-cart__footer-buttons .elementor-button--view-cart {
	background: transparent;
	color: var(--pond-blue);
	border: 2px solid var(--pond-blue);
}
.elementor-menu-cart__main .elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover {
	background: var(--pond-blue);
	color: var(--pond-white);
}

.elementor-menu-cart__main .elementor-menu-cart__footer-buttons .elementor-button--checkout {
	background: var(--pond-blue);
	color: var(--pond-white);
	border: 2px solid var(--pond-blue);
}
.elementor-menu-cart__main .elementor-menu-cart__footer-buttons .elementor-button--checkout:hover {
	background: var(--pond-navy);
	border-color: var(--pond-navy);
}

.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__main .woocommerce-mini-cart__empty-message {
	padding: 30px 0;
	font-size: 15px;
}

@media (max-width: 480px) {
	.elementor-widget-woocommerce-menu-cart { --cart-padding: 20px 16px; }
	.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__main { width: 100vw; }
}

/* --------------------------------------------- hero and ticker, comp values */

/* The standalone file runs the hero at 560; this sits a little taller, as asked. */
.pond-hero__slide { --min-height: 640px; min-height: 640px; }

@media (max-width: 1024px) { .pond-hero__slide { --min-height: 540px; min-height: 540px; } }
@media (max-width: 767px)  { .pond-hero__slide { --min-height: 500px; min-height: 500px; } }

/* Swiper reads its dots from these, so setting them beats fighting Elementor's
   generated rules. The comp: 9px dots at half opacity, the active one a 26px
   white pill. */
.elementor-widget-n-carousel.pond-hero {
	--e-n-carousel-swiper-pagination-size: 9px;
	--e-n-carousel-swiper-pagination-spacing: 9px;
	--e-n-carousel-dots-normal-color: rgba(255, 255, 255, .5);
	--e-n-carousel-dots-hover-color: #FFFFFF;
	--e-n-carousel-dots-vertical-offset: -26px;
	--swiper-pagination-bullet-width: 9px;
	--swiper-pagination-bullet-height: 9px;
	--swiper-pagination-bullet-inactive-color: #FFFFFF;
	--swiper-pagination-bullet-inactive-opacity: .5;
	--swiper-pagination-color: #FFFFFF;
	--swiper-pagination-bullet-horizontal-gap: 4.5px;
}

.pond-hero .swiper-pagination { height: auto; }

.elementor-widget-n-carousel.pond-hero .swiper-pagination-bullet {
	margin: 0 4.5px;
	width: 9px;
	height: 9px;
	border-radius: 5px;
	background: #FFFFFF;
	opacity: .5;
	transition: width .25s ease, opacity .25s ease;
}

.elementor-widget-n-carousel.pond-hero .swiper-pagination-bullet-active {
	width: 26px;
	background: #FFFFFF;
	opacity: 1;
}

/* The comp frames the scoreboard top and bottom in pond blue. */
.pond-board {
	border-top: 3px solid var(--pond-blue);
	border-bottom: 3px solid var(--pond-blue);
}

/* The cart tile answers a hover the way the promo link does. */
.elementor-location-header .elementor-menu-cart__toggle .elementor-button:hover,
.elementor-location-header .elementor-menu-cart__toggle .elementor-button:focus-visible,
.elementor-location-header .elementor-menu-cart__toggle .elementor-button:hover .elementor-button-icon,
.elementor-location-header .elementor-menu-cart__toggle .elementor-button:focus-visible .elementor-button-icon,
.elementor-location-header .elementor-menu-cart__toggle .elementor-button:hover .elementor-button-icon i,
.elementor-location-header .elementor-menu-cart__toggle .elementor-button:focus-visible .elementor-button-icon i {
	color: var(--pond-amber);
}

/* ------------------------------------- compact header, matched to the comp */

/*
 * The standalone file drops the white contact strip below 1080 and shows one
 * blue row: MENU on the left, the mark centred, the net on the right.
 */
@media (max-width: 1024px) {
	.elementor-location-header .elementor-element-cf31daa { display: none !important; }

	.elementor-location-header .elementor-element-fab393a {
		--padding-top: 12px;
		--padding-bottom: 12px;
		--padding-left: 16px;
		--padding-right: 16px;
		background: var(--pond-blue);
		min-height: 68px;
		align-items: center;
	}

	.elementor-location-header .elementor-element-fab393a > .e-con-inner {
		align-items: center;
		gap: 10px;
	}

	/* MENU sits beside the burger, as the comp has it. */
	.elementor-location-header .elementor-element-f41d17e {
		flex: 1 1 0;
		display: flex;
		align-items: center;
	}
	.elementor-location-header .elementor-element-f41d17e .elementor-icon {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		color: var(--pond-white);
		fill: var(--pond-white);
	}
	.elementor-location-header .elementor-element-f41d17e .elementor-icon svg,
	.elementor-location-header .elementor-element-f41d17e .elementor-icon i {
		font-size: 22px;
		width: 22px;
		height: 22px;
		color: var(--pond-white);
		fill: var(--pond-white);
	}
	.elementor-location-header .elementor-element-f41d17e .elementor-icon svg path,
	.elementor-location-header .elementor-element-f41d17e .elementor-icon svg * { fill: var(--pond-white); }


	.elementor-location-header .elementor-element-f41d17e .elementor-icon::after {
		content: "MENU";
		color: var(--pond-white);
		font-family: 'Barlow', sans-serif;
		font-size: 13px;
		font-weight: 700;
		line-height: 1;
		letter-spacing: .12em;
	}

	.elementor-location-header .elementor-element-b160f97 { flex: 0 0 auto; }
	.elementor-location-header .elementor-element-fab393a > .e-con-inner { padding: 0; }
	.elementor-location-header .elementor-widget-image.elementor-element-b160f97 { line-height: 0; }
	.elementor-location-header .elementor-widget-image.elementor-element-b160f97 img { display: block; }

	.elementor-location-header .elementor-element-f4b0348 {
		flex: 1 1 0;
		display: flex;
		justify-content: flex-end;
	}
	.elementor-location-header .elementor-element-f4b0348 .elementor-menu-cart__toggle .elementor-button {
		width: 44px;
		height: 44px;
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		background: rgba(255, 255, 255, .14);
		border: 1px solid rgba(255, 255, 255, .35);
		border-radius: 6px;
		color: var(--pond-white);
	}
	.elementor-location-header .elementor-element-f4b0348 .elementor-button-icon i { color: var(--pond-white); }
}

/* ------------------------------------- mobile drawer, matched to the comp */

/* The comp drops the hero arrows on a phone - the dots and a swipe do the work,
   and at 375 wide an arrow sits right on top of the headline. */
@media (max-width: 767px) {
	.elementor-element.pond-hero .swiper ~ .elementor-swiper-button,
	.elementor-element.pond-hero .elementor-swiper-button { display: none; }
}

@media (max-width: 1024px) {
	.e-off-canvas__main { background: linear-gradient(180deg, #0060AE, #013A6B); }
	.e-off-canvas__content { background: transparent !important; }

	.e-off-canvas__content > .e-con {
		position: relative;
		padding: 18px 20px 48px;
		gap: 0;
	}

	/* Logo left, close top-right, with a rule under the pair. */
	.e-off-canvas__content .elementor-element-5fc82f2 {
		padding-bottom: 18px;
		border-bottom: 1px solid rgba(255, 255, 255, .18);
		line-height: 0;
	}
	.e-off-canvas__content .elementor-element-5fc82f2 img {
		height: 42px;
		width: auto;
		max-width: none;
		display: block;
	}

	.e-off-canvas__content .elementor-element-5e69622 {
		position: absolute;
		top: 0;
		inset-inline-end: 20px;
		z-index: 2;
		width: 40px;
		height: 40px;
	}
	.e-off-canvas__content .elementor-element-5e69622 .elementor-icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		background: rgba(255, 255, 255, .14);
		border-radius: 6px;
		color: var(--pond-white);
		fill: var(--pond-white);
	}
	.e-off-canvas__content .elementor-element-5e69622 .elementor-icon svg,
	.e-off-canvas__content .elementor-element-5e69622 .elementor-icon svg * {
		width: 18px;
		height: 18px;
		fill: var(--pond-white);
	}

	/* Menu: condensed caps on hairline rules, as the comp draws it. */
	.e-off-canvas__content .elementor-widget-nav-menu .elementor-nav-menu a.elementor-item {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
		padding: 16px 0 !important;
		border-bottom: 1px solid rgba(255, 255, 255, .14);
		color: #DCEBF9 !important;
		font-family: 'Barlow Condensed', sans-serif !important;
		font-size: 21px !important;
		font-weight: 600 !important;
		line-height: 1 !important;
		letter-spacing: .04em !important;
		text-transform: uppercase !important;
		fill: #DCEBF9;
	}
	.e-off-canvas__content .elementor-widget-nav-menu .elementor-nav-menu a.elementor-item:hover,
	.e-off-canvas__content .elementor-widget-nav-menu .elementor-nav-menu a.elementor-item.elementor-item-active {
		color: var(--pond-white);
		background: none;
	}
	.e-off-canvas__content .elementor-nav-menu .sub-arrow { opacity: .6; font-size: 15px; }

	.e-off-canvas__content .elementor-widget-nav-menu .elementor-nav-menu a.elementor-sub-item {
		padding: 11px 0 11px 16px !important;
		border-bottom: 0;
		color: #BFDCF3 !important;
		font-family: 'Barlow', sans-serif !important;
		font-size: 15.5px !important;
		font-weight: 500 !important;
		line-height: 1.35 !important;
		letter-spacing: 0 !important;
		text-transform: none !important;
	}
	.e-off-canvas__content .elementor-widget-nav-menu .elementor-nav-menu ul.sub-menu {
		padding-bottom: 6px;
		border-bottom: 1px solid rgba(255, 255, 255, .14);
	}
	.e-off-canvas__content .elementor-nav-menu--dropdown { background: none; }

	/* Actions */
	.e-off-canvas__content .elementor-element-c14b452 .elementor-button {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 16px 0 !important;
		border: 0 !important;
		border-bottom: 1px solid rgba(255, 255, 255, .14) !important;
		border-radius: 0 !important;
		background: none !important;
		color: #DCEBF9 !important;
		font-family: 'Barlow Condensed', sans-serif !important;
		font-size: 21px !important;
		font-weight: 600 !important;
		line-height: 1 !important;
		letter-spacing: .04em !important;
		text-transform: uppercase !important;
	}
	.e-off-canvas__content .elementor-element-c14b452 .elementor-button-icon,
	.e-off-canvas__content .elementor-element-c14b452 .elementor-button-icon i {
		color: #DCEBF9 !important;
		fill: #DCEBF9 !important;
		font-size: 15px;
		opacity: .6;
	}

	.e-off-canvas__content .elementor-widget-button .elementor-button {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 9px;
		width: 100%;
		min-height: 56px;
		margin-top: 22px;
		padding: 18px;
		border: 0;
		border-radius: 6px;
		background: var(--pond-white);
		color: var(--pond-blue);
		font-family: 'Barlow', sans-serif;
		font-size: 17px;
		font-weight: 700;
		line-height: 1;
		letter-spacing: .1em;
		text-transform: uppercase;
	}
	.e-off-canvas__content .elementor-widget-button .elementor-button-icon,
	.e-off-canvas__content .elementor-widget-button .elementor-button-icon i,
	.e-off-canvas__content .elementor-widget-button .elementor-button-icon svg {
		color: var(--pond-blue);
		fill: var(--pond-blue);
	}

	/* Phone, email, address */
	.e-off-canvas__content .elementor-icon-list-items { margin-top: 26px; }
	.e-off-canvas__content .elementor-icon-list-item {
		margin-bottom: 14px;
	}
	.e-off-canvas__content .elementor-widget-icon-list .elementor-icon-list-item,
	.e-off-canvas__content .elementor-widget-icon-list .elementor-icon-list-text,
	.e-off-canvas__content .elementor-widget-icon-list .elementor-icon-list-item > a {
		color: var(--pond-white);
		font-family: 'Barlow', sans-serif;
		font-size: 16px;
		font-weight: 500;
		line-height: 1.3;
	}
	.e-off-canvas__content .elementor-widget-icon-list .elementor-icon-list-icon i,
	.e-off-canvas__content .elementor-widget-icon-list .elementor-icon-list-icon svg,
	.e-off-canvas__content .elementor-widget-icon-list .elementor-icon-list-icon svg * {
		color: #8EC6FF !important;
		fill: #8EC6FF !important;
		font-size: 15px;
	}
}

/* The admin bar is fixed over the promo bar, and WordPress pushes the page down
   by its height as well - which left a white strip between the two for logged-in
   staff. Visitors never saw it. */
.admin-bar .pond-promo-bar { top: 32px; }

@media screen and (max-width: 782px) {
	.admin-bar .pond-promo-bar { top: 46px; }
}

/* -------------------------------------------- drawer, second pass */

@media (max-width: 1024px) {
	/* The content layer is sized by the widget's own variable, which left it
	   25px short of the panel - reading as a second box beside the menu. */
	.elementor-widget.elementor-widget-off-canvas { --e-off-canvas-width: 100%; }
	.elementor-widget-off-canvas .e-off-canvas__content { width: 100%; }

	/* Live Schedule is a menu row, so it sits left like the rest of them. */
	.e-off-canvas__content .elementor-element-c14b452 .elementor-button {
		justify-content: space-between !important;
		text-align: start !important;
	}

	/* Air between the login button and the contact details. */
	.e-off-canvas__content .elementor-widget-icon-list .elementor-icon-list-items { margin-top: 26px !important; }
	.e-off-canvas__content .elementor-element-ba5e003 { margin-bottom: 4px; }
}

/* ------------------------------------------------ live schedule page */

/* This section has no hand-laid fallback, so when the Google block renders
   nothing the heading would sit above a strip of empty space. Fold it away. */
/* removed: guard hid the reviews wrapper unless the retired pond slider was inside it */

/* The schedule comes from the provider's own page, so its height is ours to
   choose; a phone gets a shorter frame than a desk. */
.pond-schedule__frame iframe {
	display: block;
	width: 100%;
	border: 0;
}

@media (max-width: 767px) {
	.pond-schedule__frame iframe { height: 700px !important; }
}

/* ================================================ client feedback, Sep 2026 */

/* Section titles read as amber bands with Pond blue type, the same pairing as
   the hero eyebrow pill. The Facebook title has no band behind it and stays
   white on the blue. */
.elementor-widget-heading.pond-band .elementor-heading-title {
	background: var(--pond-amber) !important;
	color: var(--pond-blue) !important;
}

.pond-social .elementor-widget-heading.pond-band .elementor-heading-title { color: var(--pond-white); }

@media (max-width: 767px) {
	/* Draft pair: the two cards share a row, so their eyebrows, titles and
	   buttons should line up. Centring each stack put them 9px out of step when
	   one title wraps to a third line; pin the copy to the top and the button
	   to the bottom instead. The cards stretch to the same height already. */
	.e-con.pond-draft > .e-con-inner { justify-content: flex-start; }
	.pond-draft .elementor-widget-button.pond-btn { margin-top: auto; }

	/* One 40px gap between every section on phones. The template's paddings
	   were sized for desktop and, scaled down, stacked into anything from 44 to
	   100px depending on which two happened to meet. Elementor sets these as
	   custom properties per element, so they are overridden the same way. */
	.e-parent:has(> .e-con-inner > .pond-band) { --padding-top: 40px !important; }
	.e-parent:has(> .e-con-inner > .pond-band) + .e-parent { --padding-top: 16px !important; --padding-bottom: 0px !important; }
	.e-parent:has(> .e-con-inner > .pond-grid--2) { --padding-top: 40px !important; --padding-bottom: 0px !important; }
	/* Full-bleed panels have no padding of their own to give up. */
	.e-parent:has(> .pond-winning),
	.e-con.pond-social { --margin-top: 40px !important; }
}

/* Top banner on WooCommerce pages: Woo's own `img { height: auto }` outranked
   the banner rule and let the picture collapse to its natural height inside
   the strip, leaving white below it. */
.pond-top-banner .pond-top-banner__img { height: 100%; }

/* Product pages: title and breadcrumb centred in the banner, as the category
   banner already is, with a side gutter on phones where the container's own
   padding is zero. */
.elementor-element-6f7408d > .e-con-inner { --align-items: center; align-items: center !important; } /* widgets are content-sized and pinned to the start */
.elementor-element-6f7408d .elementor-widget-heading,
.elementor-element-6f7408d .elementor-widget-woocommerce-breadcrumb,
.elementor-element-6f7408d .woocommerce-breadcrumb { text-align: center !important; }

@media (max-width: 767px) {
	.elementor-element-6f7408d > .e-con-inner { padding-inline: 16px !important; }

	/* Category banner: the template pins this container to 325px on phones,
	   which left a white strip down the right of the photograph. */
	.elementor-element-707695e,
	.elementor-element-707695e > .elementor-widget-theme-page-title {
		--width: 100% !important;
		max-width: 100% !important;
	}

	/* Category pages: the search stays above the grid and the category list
	   moves below it. Flattening the sidebar's wrappers makes its two widgets
	   siblings of the grid, so they can be ordered around it. */
	.elementor-element-1accaab,
	.elementor-element-1accaab > .elementor-widget-sidebar,
	.elementor-element-1accaab > .elementor-widget-sidebar > .elementor-widget-container { display: contents !important; }
	.elementor-element-1accaab .widget { width: calc(100% - 20px); margin-inline: 10px; } /* the flattened container's padding */
	.elementor-element-4a14294 { order: 1; }
	.elementor-element-1accaab .widget_product_categories { order: 2; }
}

/* Product pages: Elementor gives every widget's inner box `height: 100%`,
   and inside this column-wrap container Chrome's first layout pass resolves
   that to the gallery's bottom margin alone (32px), so until WooCommerce's
   gallery script nudges a second pass the description was laid out over the
   photograph - for seconds on a slow phone connection. Let it size to its
   content, and keep the gallery un-floated whatever WooCommerce's sheets do. */
.elementor-widget-woocommerce-product-images > .elementor-widget-container { height: auto !important; }

.elementor-widget-woocommerce-product-images .woocommerce-product-gallery {
	float: none !important;
	width: 100% !important;
}

/* Maps: the Google Business Profile embed replaces the address-lookup maps
   (client request), as an HTML widget. Heights match what the old widgets
   rendered at: 306px on the home page, 460px (300 on phones) on Contact. */
.pond-map iframe {
	height: 306px;
	border: 0;
}

.pond-map--contact iframe { height: 460px; }

@media (max-width: 767px) {
	.pond-map--contact iframe { height: 300px; }
}

/* Footer contact block: now an icon list (phone, email, address) matching the
   mobile menu's - white Barlow with the pale-blue icons - in place of the two
   plain text lines. */
.elementor-widget-icon-list.pond-footer__contact { margin-top: 14px; }

.elementor-widget-icon-list.pond-footer__contact .elementor-icon-list-item,
.elementor-widget-icon-list.pond-footer__contact .elementor-icon-list-text,
.elementor-widget-icon-list.pond-footer__contact .elementor-icon-list-item > a {
	color: var(--pond-white);
	font-family: 'Barlow', sans-serif;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.3;
}

.elementor-widget-icon-list.pond-footer__contact .elementor-icon-list-item > a:hover .elementor-icon-list-text { color: #8EC6FF; }

.elementor-widget-icon-list.pond-footer__contact .elementor-icon-list-icon i,
.elementor-widget-icon-list.pond-footer__contact .elementor-icon-list-icon svg,
.elementor-widget-icon-list.pond-footer__contact .elementor-icon-list-icon svg * {
	color: #8EC6FF !important;
	fill: #8EC6FF !important;
	font-size: 15px;
}

/* ---------------------------------------------------------- newsletter card */

/*
 * A white card that sits over the top edge of the footer: photograph on the
 * left, sign-up on the right. The footer reserves room for the overlap.
 */
.pond-newsletter {
	position: relative;
	z-index: 2;
	padding: 56px 20px 0;
	font-family: Barlow, system-ui, sans-serif;
}

.pond-newsletter__card {
	max-width: 1240px;
	margin: 0 auto -96px;
	display: flex;
	align-items: stretch;
	background: var(--pond-white);
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 24px 60px -28px rgba(1, 20, 36, .55);
}

.pond-newsletter__media {
	flex: 0 0 42%;
	min-height: 260px;
}

.pond-newsletter__photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.pond-newsletter__body {
	flex: 1 1 auto;
	min-width: 0;
	padding: 38px 44px;
}

.pond-newsletter--no-photo .pond-newsletter__body { padding: 34px 40px; }

.pond-newsletter__eyebrow {
	margin: 0 0 10px;
	color: var(--pond-blue);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.8px;
	text-transform: uppercase;
}

.pond-newsletter__title {
	margin: 0;
	color: #0A2A47;
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 34px;
	font-weight: 700;
	letter-spacing: .04em;
	line-height: 1.08;
	text-transform: uppercase;
}

.pond-newsletter__text {
	margin: 10px 0 0;
	color: var(--pond-slate);
	font-size: 16px;
	line-height: 1.6;
	max-width: 52ch;
}

.pond-newsletter__form { margin-top: 20px; }

.pond-newsletter__label {
	display: block;
	margin-bottom: 7px;
	color: #0A2A47;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
}

.pond-newsletter__fields {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

/* Marked important: Astra and WooCommerce both style bare inputs and buttons. */
.pond-newsletter__form .pond-newsletter__input {
	flex: 1 1 240px;
	min-width: 0;
	height: 48px !important;
	padding: 0 16px !important;
	border: 1px solid #D5DDE4 !important;
	border-radius: 5px !important;
	background: var(--pond-white) !important;
	color: #0A2A47 !important;
	font-family: Barlow, system-ui, sans-serif;
	font-size: 15px;
	box-shadow: none !important;
}

.pond-newsletter__form .pond-newsletter__input::placeholder { color: #8AA5BD; }

.pond-newsletter__form .pond-newsletter__input:focus-visible {
	outline: 2px solid var(--pond-blue);
	outline-offset: 1px;
}

.pond-newsletter__form .pond-newsletter__button {
	flex: 0 0 auto;
	height: 48px;
	padding: 0 30px !important;
	border: 0 !important;
	border-radius: 5px !important;
	background: var(--pond-blue) !important;
	color: var(--pond-white) !important;
	font-family: Barlow, system-ui, sans-serif;
	font-size: 13.5px;
	font-weight: 700;
	letter-spacing: .945px;
	line-height: 1;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.pond-newsletter__form .pond-newsletter__button:hover,
.pond-newsletter__form .pond-newsletter__button:focus-visible {
	background: var(--pond-blue-dark) !important;
	transform: translateY(-2px);
	box-shadow: 0 8px 18px rgba(2, 18, 31, .25);
}

.pond-newsletter__form .pond-newsletter__button:disabled {
	opacity: .6;
	cursor: wait;
	transform: none;
	box-shadow: none;
}

.pond-newsletter__note {
	margin: 10px 0 0;
	color: #8AA5BD;
	font-size: 13px;
}

.pond-newsletter__message {
	margin: 10px 0 0;
	font-size: 14px;
	line-height: 1.4;
}

.pond-newsletter__message[data-tone="ok"] { color: var(--pond-blue-dark); font-weight: 600; }
.pond-newsletter__message[data-tone="error"] { color: #B3261E; }

/* Off screen, not display:none, so it is still filled in by naive bots. */
.pond-newsletter__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* The footer opens up to make room for the overlapping card. */
.e-con.pond-footer { padding-top: 130px; }

@media (max-width: 900px) {
	.pond-newsletter__card { display: block; margin-bottom: -70px; }
	.pond-newsletter__media { min-height: 0; }
	.pond-newsletter__photo { height: 190px; }
	.e-con.pond-footer { padding-top: 104px; }
}

@media (max-width: 767px) {
	.pond-newsletter { padding: 40px 16px 0; }
	.pond-newsletter__body { padding: 26px 22px; }
	.pond-newsletter__title { font-size: 27px; }
	.pond-newsletter__text { font-size: 15px; }
	.pond-newsletter__form .pond-newsletter__button { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.pond-newsletter__form .pond-newsletter__button { transition: none; transform: none !important; }
}

/* ----------------------------------------------- contact bar, icon spacing */

/* The icon box was 26px for a 16px glyph plus 10px of padding, which read as
   a gap between each icon and its text; close it to 7px. */
.elementor-location-header .elementor-element-6d080cd4 .elementor-icon-list-icon {
	width: auto !important;
	padding-right: 0 !important;
}

.elementor-location-header .elementor-element-6d080cd4 .elementor-icon-list-text {
	padding-inline-start: 7px !important;
}

/* Client request (Sep 2026): the header CTA and the cart tile share a height.
   The tile is 46px, so the CTA grows from the comp's 38 to match it. */
.elementor-location-header .elementor-element-2962e783 .elementor-button {
	display: inline-flex !important;
	align-items: center;
	height: 46px;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* Client request (Sep 2026): chevrons instead of carets on dropdown parents.
   The chevron glyph is wider than the caret it replaced, so it is sized to sit
   with the 15px menu type. */
.elementor-location-header .e-n-menu-dropdown-icon i { font-size: 12px; }

/* ------------------------------------------ shop buttons, client request Sep 2026 */

/* Pond-blue rounded buttons everywhere, darkening on hover like the other solid
   buttons (the client tried yellow here and went back to blue). This covers the theme/WooCommerce
   buttons - shop search, Select options / Add to cart on cards and products,
   cart, checkout and account actions - which Astra had square. The
   Elementor buttons already carry their own classes. Important because Astra
   and WooCommerce set these per element id/context. */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-js a.button,
.woocommerce-js button.button,
.woocommerce-js input.button,
.woocommerce-js .woocommerce-button,
.woocommerce #payment #place_order,
.woocommerce-product-search button,
form.cart .single_add_to_cart_button {
	background-color: var(--pond-blue) !important;
	color: var(--pond-white) !important;
	border: 0 !important;
	border-radius: 5px !important;
	padding: 12px 18px !important;
	font-family: Barlow, system-ui, sans-serif !important;
	font-size: 13.5px !important;
	font-weight: 700 !important;
	letter-spacing: .945px !important;
	line-height: 1 !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	box-shadow: none;
	transition: background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce-js a.button:hover,
.woocommerce-js button.button:hover,
.woocommerce-js input.button:hover,
.woocommerce-js .woocommerce-button:hover,
.woocommerce #payment #place_order:hover,
.woocommerce-product-search button:hover,
form.cart .single_add_to_cart_button:hover,
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce-js a.button:focus-visible,
.woocommerce-js button.button:focus-visible,
.woocommerce-product-search button:focus-visible,
form.cart .single_add_to_cart_button:focus-visible {
	background-color: var(--pond-blue-dark) !important;
	color: var(--pond-white) !important;
	transform: translateY(-2px);
	box-shadow: 0 8px 18px rgba(2, 18, 31, .25);
}

/* Disabled (e.g. Add to cart before a variation is picked) stays put. */
.woocommerce a.button.disabled,
.woocommerce button.button.disabled,
.woocommerce button.button:disabled,
.woocommerce-js a.button.disabled,
.woocommerce-js button.button:disabled {
	opacity: .55 !important;
	transform: none;
	box-shadow: none;
	cursor: not-allowed;
}

@media (prefers-reduced-motion: reduce) {
	.woocommerce a.button,
	.woocommerce button.button,
	.woocommerce-js a.button,
	.woocommerce-js button.button,
	.woocommerce-product-search button { transition: none; transform: none !important; }
}

/* Shop sidebar: Astra strips the first category's rule (`li:first-child {
   border: none }`), which left "2024 MAC Classes & Camps" and "Gift Cards"
   running together. */
.woocommerce-js ul.product-categories > li:first-child { border-bottom: 1px solid #DCDCDC !important; }

/* Product page: the quantity stepper sits at the button's 38px. Astra's form
   button styles were giving the +/- 2px navy borders, 15px of padding and a
   50px row, and pushing the button down with a 15px top margin. */
.woocommerce-js form.cart .quantity {
	display: inline-flex;
	align-items: stretch;
	height: 38px;
	margin: 0 10px 0 0;
}

.woocommerce-js form.cart .quantity .pond-qty,
.woocommerce-js form.cart .quantity input.qty {
	height: 38px !important;
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1 !important;
	border: 1px solid #d5dde4 !important;
	border-radius: 0 !important;
	font-size: 15px !important;
	box-shadow: none !important;
}

.woocommerce-js form.cart .quantity .pond-qty {
	width: 38px !important;
	background: #f4f7fa !important;
	color: var(--pond-blue-dark) !important;
}

.woocommerce-js form.cart .quantity .pond-qty:hover,
.woocommerce-js form.cart .quantity .pond-qty:focus-visible {
	background: var(--pond-blue) !important;
	color: var(--pond-white) !important;
}

.woocommerce-js form.cart .quantity .pond-qty--minus { border-right: 0 !important; border-radius: 4px 0 0 4px !important; }
.woocommerce-js form.cart .quantity .pond-qty--plus  { border-left: 0 !important;  border-radius: 0 4px 4px 0 !important; }

.woocommerce-js form.cart .quantity input.qty {
	width: 56px !important;
	text-align: center;
}

.woocommerce-js form.cart .single_add_to_cart_button {
	height: 38px;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	vertical-align: top;
}

/* Client request (Sep 2026): the same 26px under every section title. The
   reviews band had 48 because the live-reviews slot, empty without a Google
   key, still took a flex gap; the Welcome to Winning title had 14. */
/* removed: guard hid the reviews wrapper unless the retired pond slider was inside it */
.e-con .pond-winning .elementor-widget.elementor-widget-heading { margin-block-end: 12px; } /* out-specifies Elementor's reset */

/* Mega menu columns (client request, Sep 2026): the lists line up with their
   titles. Astra's default `ul { margin-left: 3em }` was indenting them, and
   the title icons differ in width, so the icon gets a fixed box and the list
   starts exactly where the title text does. */
.elementor-location-header .menu-section h3 {
	display: flex;
	align-items: center;
}

.elementor-location-header .menu-section h3 i {
	flex: 0 0 26px;
	width: 26px;
	margin-right: 10px;
	text-align: center;
}

.elementor-location-header .menu-section ul {
	margin: 0 0 0 36px;
	padding-left: 0;
}

.elementor-location-header .menu-section li i {
	flex: 0 0 22px;
	width: 22px;
	margin-right: 10px;
	text-align: center;
}

/* Product tabs on phones: WooCommerce's small-screen sheet stretches each tab
   into a full-width block; keep the desktop's centred inline tab instead. */
@media (max-width: 767px) {
	.woocommerce-tabs ul.tabs { text-align: center; }
	.woocommerce-tabs ul.tabs li {
		display: inline-block !important;
		width: auto !important;
		margin: 0 4px !important;
	}
}

/* Loop cards: a product without a price gets WooCommerce's "Read more" link,
   so the quantity box beside it has nothing to count. */
.e-loop-add-to-cart-form:has(a.button:not(.add_to_cart_button)) .quantity { display: none; }

/* Product carousel cards (client request, Sep 2026): every card the same
   height with the buttons on one line. The slides already stretch to the
   tallest one; the card inside now fills its slide, the body grows, the
   title reserves two lines so prices line up, and the button sits at the
   bottom. Rounded top corners on the product tabs came with the same note. */
.elementor-widget-loop-carousel .swiper-slide.e-loop-item { display: flex; height: auto; }
.elementor-widget-loop-carousel .swiper-slide.e-loop-item > .e-con.pond-prod { width: 100%; }
.e-con.pond-prod > .e-con.pond-prod__body { flex: 1 1 auto; }
.pond-prod__body > .elementor-widget.pond-prod__btn { margin-top: auto; }
[class*="elementor-widget-loop"] .pond-prod__title .product_title { display: block !important; min-height: 2.3em; } /* two lines at its 1.15 line-height; Elementor's loop CSS forces it inline */

.woocommerce-tabs ul.tabs li,
.woocommerce-tabs ul.tabs li a { border-radius: 8px 8px 0 0 !important; overflow: hidden; }

/* ------------------------------------------------------------- Ecwid store */

/* The Lightspeed eCom storefront renders inside /store, so it arrives with its
   own stylesheet rather than the theme's. These rules pull it back to the
   site's own type, colour and button language. Ecwid's CSS loads after ours and
   is written at high specificity, so most of this has to be forced. */

/* Body copy and controls in Barlow; headings keep Barlow Condensed below. */
.ec-store,
.ec-store input,
.ec-store button,
.ec-store select,
.ec-store textarea {
	font-family: Barlow, system-ui, sans-serif !important;
}

.ec-store {
	color: var(--pond-slate);
}

/* ---- page titles and section headings ---- */

/* The rest of the site sets headings in Barlow Condensed 700, Pond blue - h1 at
   54px, h2 at 33px. The storefront's own titles follow the same scale. */
.ec-store .ec-page-title .page-title__name,
.ec-store .ec-header-h1,
.ec-store .product-details__product-title {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif !important;
	color: var(--pond-blue) !important;
	font-weight: 700 !important;
	line-height: 1.15 !important;
	text-transform: none !important;
}

.ec-store .ec-page-title .page-title__name,
.ec-store .ec-header-h1 {
	font-size: 40px !important;
}

.ec-store .product-details__product-title {
	font-size: 38px !important;
}

.ec-store .ec-header-h3,
.ec-store .ec-header-h4 {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif !important;
	color: var(--pond-blue) !important;
	font-weight: 700 !important;
}

.ec-store .ec-header-h6,
.ec-store .details-product-option__title,
.ec-store .details-product-share__title {
	color: var(--pond-navy) !important;
	font-weight: 700 !important;
	letter-spacing: .04em !important;
}

/* ---- breadcrumbs ---- */

.ec-store .ec-breadcrumbs {
	padding-bottom: 6px !important;
}

.ec-store .breadcrumbs__link {
	color: var(--pond-slate) !important;
	font-weight: 600 !important;
}

.ec-store .breadcrumbs__link:hover {
	color: var(--pond-blue) !important;
}

.ec-store .breadcrumbs__link--last {
	color: var(--pond-navy) !important;
}

.ec-store .breadcrumbs__delimiter {
	color: var(--pond-line) !important;
}

/* ---- category and product cards ---- */

.ec-store .grid-category__card,
.ec-store .grid-product__wrap-inner {
	border-radius: 6px !important;
	overflow: hidden !important;
	background: var(--pond-white) !important;
	transition: transform .2s ease, box-shadow .2s ease !important;
}

.ec-store .grid-category__shadow-inner,
.ec-store .grid-product__shadow-inner {
	border-radius: 6px !important;
	box-shadow: 0 1px 2px rgba(1, 58, 107, .06), 0 6px 18px rgba(1, 58, 107, .07) !important;
}

.ec-store .grid-category__wrap-inner:hover .grid-category__card,
.ec-store .grid-product__wrap:hover .grid-product__wrap-inner {
	transform: translateY(-3px) !important;
	box-shadow: 0 10px 26px rgba(1, 58, 107, .14) !important;
}

/* Ecwid gives a category with no artwork a randomly coloured gradient, which is
   why the store read as a wall of pink and lime. The gradient is a background
   IMAGE, so it has to be cleared, not just painted over. Categories that do have
   a photo are untouched. */
.ec-store .grid-category--no-image .grid-category__bg-color,
.ec-store .grid-category--no-image .grid-category__bg {
	background-image: none !important;
	background-color: var(--pond-ice) !important;
}

.ec-store .grid-category--no-image .grid-category__card {
	border: 1px solid var(--pond-line) !important;
}

/* ---- category grid, matched to the home page's programme cards ---- */

/* The home page lays its cards out in a 1200px three-up grid with a 22px gap
   (.pond-grid / .pond-card). Ecwid floats its tiles instead, so the row is
   rebuilt as a grid here. Its clearfix spacers would each take a cell, so they
   go. */
.ec-store .grid__categories {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 22px !important;
	max-width: 1200px !important;
	margin-inline: auto !important;
}

.ec-store .grid__categories > .grid__clearfix {
	display: none !important;
}

.ec-store .grid__categories > .grid-category {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* The card itself: 10px corners, clipped, lifting on hover - the same values
   the programme cards use. */
.ec-store .grid-category__card {
	border-radius: 10px !important;
	overflow: hidden !important;
	background: var(--pond-white) !important;
	box-shadow: 0 1px 2px rgba(1, 58, 107, .06), 0 6px 18px rgba(1, 58, 107, .07) !important;
	transition: box-shadow .25s ease, transform .25s ease !important;
}

.ec-store .grid-category__wrap-inner:hover .grid-category__card {
	box-shadow: 0 14px 30px -18px rgba(1, 58, 107, .55) !important;
	transform: translateY(-3px) !important;
}

/* The store was set to a 150% portrait tile, so each category came out nearly
   600px tall. This is the home card's 190px photo expressed as a ratio, so it
   holds its shape at every width. */
.ec-store .grid-category__image-spacer-inner,
.ec-store .grid-category__spacer-inner {
	padding-top: 49.5% !important;
}

/* The photo link is laid out with floats, so it collapses to a sliver once the
   portrait ratio is overridden. Giving it the ratio outright is steadier: the
   artwork inside is absolutely positioned and covers whatever box it gets. */
.ec-store .grid-category__image {
	aspect-ratio: 2 / 1 !important;
	height: auto !important;
	display: block !important;
	overflow: hidden !important;
	/* The artwork inside is absolutely placed, so this has to be what it
	   measures itself against - without it the photo sizes off an ancestor and
	   crops from the top. */
	position: relative !important;
}

.ec-store .grid-category__bg,
.ec-store .grid-category__bg-color,
.ec-store .grid-category__bg-image {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	width: auto !important;
	height: auto !important;
}

/* Pinned to the box so the crop is centred rather than running off the bottom. */
.ec-store .grid-category__bg-image .grid-category__picture-img,
.ec-store .grid-category__picture,
.ec-store .grid-category__picture-img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center !important;
}

/* Title under the photo, left aligned in the card's 18px body. */
.ec-store .grid-category__title {
	padding: 18px !important;
	text-align: left !important;
}

.ec-store .grid-category__title-inner {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif !important;
	color: #0A2A47 !important;
	font-size: 22px !important;
	font-weight: 700 !important;
	line-height: 1.05 !important;
	letter-spacing: .44px !important;
	text-transform: uppercase !important;
	text-align: left !important;
}

/* ---- product grid, same cards as the categories ---- */

.ec-store .grid__products {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 22px !important;
	max-width: 1200px !important;
	margin-inline: auto !important;
}

.ec-store .grid__products > .grid__clearfix {
	display: none !important;
}

.ec-store .grid__products > .grid-product {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Cards in a row end up the same height whatever the name length. */
.ec-store .grid__products > .grid-product,
.ec-store .grid-product__wrap,
.ec-store .grid-product__wrap-inner {
	height: 100% !important;
}

/* The wrapper holds 16px of padding that would inset the card inside its own
   cell; the grid gap already does that job. */
.ec-store .grid-product__wrap {
	padding: 0 !important;
}

/* The tile is a flex container, so the card sizes to its contents and sits
   narrower than its cell unless told to fill it. */
.ec-store .grid-product__wrap,
.ec-store .grid-product__wrap-inner {
	width: 100% !important;
	flex: 1 1 100% !important;
	margin: 0 !important;
}

.ec-store .grid-product__wrap-inner {
	border-radius: 10px !important;
	overflow: hidden !important;
	background: var(--pond-white) !important;
	box-shadow: 0 1px 2px rgba(1, 58, 107, .06), 0 6px 18px rgba(1, 58, 107, .07) !important;
	transition: box-shadow .25s ease, transform .25s ease !important;
}

.ec-store .grid-product__wrap:hover .grid-product__wrap-inner {
	box-shadow: 0 14px 30px -18px rgba(1, 58, 107, .55) !important;
	transform: translateY(-3px) !important;
}

/* Products come in at the same portrait ratio the categories did, which made
   each tile over 700px tall. Same 2:1 frame, same cover crop. */
.ec-store .grid-product__image {
	/* 3:2 puts the photo at 190px in a 285px card - the same height the home
	   page cards use. The wider category tiles reach 190px at 2:1. */
	aspect-ratio: 3 / 2 !important;
	height: auto !important;
	width: 100% !important;
	display: block !important;
	position: relative !important;
	overflow: hidden !important;
}

.ec-store .grid-product__bg,
.ec-store .grid-product__bg-color,
.ec-store .grid-product__bg-image {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	width: auto !important;
	height: auto !important;
}

/* Filling the frame: no bars down the sides. Portrait sources lose a little
   top and bottom, which is the trade for an even grid. */
/* Ecwid centres its images with an inline negative margin sized against an
   auto width. Once the width is forced to fill the frame that margin drags the
   picture off to the left, so it has to go with it. */
.ec-store .grid-product__picture-img,
.ec-store .grid-product__picture,
.ec-store .grid-product__image img {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center center !important;
}

.ec-store .grid-product__bg,
.ec-store .grid-product__bg-color {
	background-color: var(--pond-ice) !important;
	background-image: none !important;
}

/* Title and price share the card's 18px body. Product names run much longer
   than a category name, so they sit a little smaller than the home cards. */
.ec-store .grid-product__title {
	display: block !important;
	padding: 18px 18px 0 !important;
	text-align: left !important;
}

.ec-store .grid-product__title-inner {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif !important;
	color: #0A2A47 !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	line-height: 1.1 !important;
	letter-spacing: .44px !important;
	text-transform: uppercase !important;
	text-align: left !important;
}

.ec-store .grid-product__price {
	padding: 6px 18px 18px !important;
	text-align: left !important;
}

.ec-store .grid-product__price-amount,
.ec-store .grid-product__price-value {
	font-size: 17px !important;
}

@media (max-width: 1024px) {

	.ec-store .grid__categories,
	.ec-store .grid__products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 600px) {

	.ec-store .grid__categories,
	.ec-store .grid__products {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

/* Grid titles, for categories and products alike, are styled with the card
   rules further down. */

.ec-store .grid-category__wrap-inner:hover .grid-category__title-inner,
.ec-store .grid-product__wrap:hover .grid-product__title-inner {
	color: var(--pond-blue) !important;
}

.ec-store .grid-product__price-amount,
.ec-store .grid-product__price-value,
.ec-store .ec-price-item {
	color: var(--pond-blue) !important;
	font-weight: 700 !important;
}

/* ---- buttons ---- */

/* Matches the WooCommerce button block above: Pond blue, 5px, Barlow 700. */
.ec-store .form-control--primary .form-control__button,
.ec-store button.form-control__button,
.ec-store .ec-cart__button .form-control__button,
.ec-store .details-product-purchase__add-to-bag .form-control__button {
	background-color: var(--pond-blue) !important;
	border-color: var(--pond-blue) !important;
	color: var(--pond-white) !important;
	border-radius: 5px !important;
	font-family: Barlow, system-ui, sans-serif !important;
	font-size: 13.5px !important;
	font-weight: 700 !important;
	letter-spacing: .945px !important;
	text-transform: uppercase !important;
	transition: background-color .18s ease, box-shadow .18s ease !important;
}

.ec-store .form-control--primary .form-control__button:hover,
.ec-store button.form-control__button:hover,
.ec-store .form-control--primary .form-control__button:focus-visible,
.ec-store button.form-control__button:focus-visible {
	background-color: var(--pond-blue-dark) !important;
	border-color: var(--pond-blue-dark) !important;
	color: var(--pond-white) !important;
	box-shadow: 0 6px 16px rgba(0, 96, 174, .28) !important;
}

/* "Keep shopping" and other secondary actions read as outlines, not fills. */
.ec-store .details-product-purchase__add-more .form-control__button,
.ec-store .ec-cart-step__change .form-control__button {
	background-color: transparent !important;
	color: var(--pond-blue) !important;
	border: 2px solid var(--pond-blue) !important;
	border-radius: 5px !important;
	font-weight: 700 !important;
}

.ec-store .details-product-purchase__add-more .form-control__button:hover,
.ec-store .ec-cart-step__change .form-control__button:hover {
	background-color: var(--pond-blue) !important;
	color: var(--pond-white) !important;
}

/* ---- inputs, selects, the option pickers ---- */

.ec-store .form-control__text,
.ec-store .form-control__select,
.ec-store .form-control__textarea {
	border-radius: 5px !important;
	border-color: var(--pond-line) !important;
	color: var(--pond-navy) !important;
}

.ec-store .form-control__text:focus,
.ec-store .form-control__select:focus {
	border-color: var(--pond-blue) !important;
	box-shadow: 0 0 0 3px rgba(0, 96, 174, .14) !important;
	outline: none !important;
}

.ec-store .form-control__placeholder-inner,
.ec-store .form-control__select-text {
	color: var(--pond-slate) !important;
}

.ec-store .form-control__arrow svg,
.ec-store .form-control__arrow {
	color: var(--pond-blue) !important;
}

/* ---- product page ---- */

.ec-store .details-product-price__value {
	color: var(--pond-blue) !important;
	font-weight: 800 !important;
}

.ec-store .details-gallery__image,
.ec-store .details-gallery__picture,
.ec-store .details-gallery__thumb-img {
	border-radius: 6px !important;
}

.ec-store .details-gallery__thumb--active .details-gallery__thumb-img-wrapper-inner {
	box-shadow: 0 0 0 2px var(--pond-blue) !important;
	border-radius: 6px !important;
}

/* The gallery and the buy panel each take half the row and stop colliding on
   the first layout pass, which is what used to squash the title on mobile. */
.ec-store .details-product-purchase__controls {
	gap: 12px !important;
}

/* ---- links ---- */

.ec-store .ec-link,
.ec-store a {
	color: var(--pond-blue) !important;
}

.ec-store .ec-link--muted {
	color: var(--pond-slate) !important;
}

.ec-store .ec-link:hover,
.ec-store .ec-link--muted:hover {
	color: var(--pond-blue-dark) !important;
}

/* ---- cart, checkout and account ---- */

.ec-store .ec-cart__body-inner,
.ec-store .ec-cart__sidebar-inner,
.ec-store .ec-signin-form__content {
	background: var(--pond-white) !important;
	border: 1px solid var(--pond-line) !important;
	border-radius: 6px !important;
}

.ec-store .ec-cart-step__title {
	color: var(--pond-navy) !important;
	font-weight: 700 !important;
}

.ec-store .ec-cart-step__icon {
	color: var(--pond-blue) !important;
}

.ec-store .ec-signin-form__description,
.ec-store .ec-cart-step__text,
.ec-store .ec-text-muted {
	color: var(--pond-slate) !important;
}

.ec-store .ec-signin-form__feature {
	color: var(--pond-navy) !important;
}

/* ---- Ecwid's own footer row ---- */

.ec-store .ec-footer,
.ec-store .ec-footer__link {
	color: var(--pond-slate) !important;
	font-size: 13px !important;
}

.ec-store .ec-footer__link:hover {
	color: var(--pond-blue) !important;
}

.ec-store .ec-lightspeed-branding-wrapper {
	opacity: .55;
}

/* ---- narrow screens ---- */

@media (max-width: 767px) {

	.ec-store .ec-page-title .page-title__name,
	.ec-store .ec-header-h1,
	.ec-store .product-details__product-title {
		font-size: 28px !important;
		line-height: 1.2 !important;
	}

	.ec-store .grid-category__title-inner,
	.ec-store .grid-product__title-inner {
		font-size: 15px !important;
	}

	/* Buy buttons go full width so they are easy to hit. */
	.ec-store .details-product-purchase__add-to-bag,
	.ec-store .details-product-purchase__add-to-bag .form-control__button,
	.ec-store .ec-cart__button,
	.ec-store .ec-cart__button .form-control__button {
		width: 100% !important;
	}
}

/* ---- the storefront's floating bag ---- */

/* Ecwid pins a small cart bubble to the bottom-right of every storefront page.
   The header already carries a cart button with a live count, so the bubble is
   a second control for the same thing sitting over the content. */
.ec-minicart,
.ec-store .ec-minicart {
	display: none !important;
}

/* ---- the old shop's slide-out cart ---- */

/* WooCommerce is retired, so this panel can only ever say "no products in the
   cart". The cart button goes to the storefront cart instead; this makes sure
   the panel cannot appear even if a click reaches Elementor's own handler. */
.elementor-menu-cart__container {
	display: none !important;
}

/* ---------------------------------------------------------- coach directory */

/* The Private Coaches page. Each coach is a text widget the client can edit in
   the builder; the grid itself is here so adding a coach needs no layout work.
   Elementor lays containers out with flex, so the grid has to be forced. */

/* Elementor drops custom classes on containers, so the grid is hung off the
   container that actually holds the cards. */
.e-con-inner:has(> .pond-coach),
.pond-coaches > .e-con-inner {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 22px !important;
	align-items: stretch !important;
}

.pond-coach {
	width: auto !important;
	max-width: none !important;
	background: var(--pond-white);
	border: 1px solid var(--pond-line);
	border-radius: 6px;
	padding: 22px 22px 24px;
	box-shadow: 0 1px 2px rgba(1, 58, 107, .05), 0 6px 18px rgba(1, 58, 107, .05);
}

.pond-coach .elementor-widget-container {
	height: auto !important;
}

.pond-coach__name {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	color: var(--pond-blue);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.15;
	margin: 0 0 4px;
}

.pond-coach__role {
	display: inline-block;
	background: var(--pond-amber);
	color: var(--pond-navy);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: 3px 8px;
	border-radius: 3px;
	margin: 0 0 8px;
}

.pond-coach__disciplines {
	color: var(--pond-slate);
	font-size: 14px;
	font-weight: 600;
	margin: 0 0 10px;
}

.pond-coach__contact {
	font-size: 15px;
	line-height: 1.6;
	margin: 0 0 12px;
}

.pond-coach__contact a {
	color: var(--pond-blue);
	text-decoration: none;
	word-break: break-word;
}

.pond-coach__contact a:hover {
	color: var(--pond-blue-dark);
	text-decoration: underline;
}

.pond-coach__quote {
	border-left: 3px solid var(--pond-amber);
	padding-left: 12px;
	margin: 0;
	color: var(--pond-slate);
	font-size: 15px;
	font-style: italic;
	line-height: 1.55;
}

/* Group headings sit above each set, a step down from the banded section title. */
.elementor-widget-heading.pond-coaches__group .elementor-heading-title {
	color: var(--pond-navy);
	font-size: 26px;
	border-bottom: 2px solid var(--pond-line);
	padding-bottom: 8px;
}

.pond-coaches__policies {
	margin: 0;
	padding-left: 20px;
}

.pond-coaches__policies li {
	margin-bottom: 10px;
	line-height: 1.6;
}

@media (max-width: 1024px) {

	.e-con-inner:has(> .pond-coach),
	.pond-coaches > .e-con-inner {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 767px) {

	.e-con-inner:has(> .pond-coach),
	.pond-coaches > .e-con-inner {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 16px !important;
	}

	.pond-coach {
		padding: 18px;
	}

	.elementor-widget-heading.pond-coaches__group .elementor-heading-title {
		font-size: 22px;
	}
}

/* ---------------------------------------------------------- inner page banner */

/* Matches the banner the designed pages build in Elementor, so the pages that
   were never rebuilt - the Ecwid store among them - stop dropping back to
   Astra's plain title. The falling snow comes from the site's existing
   .main-section:before rule, which needs a positioned, clipped parent. */

.pond-page-banner {
	position: relative;
	overflow: hidden;
	background-color: var(--pond-blue);
	padding: 54px 20px;
	text-align: center;
}

.pond-page-banner__inner {
	position: relative;
	z-index: 2;
	max-width: 1240px;
	margin: 0 auto;
}

.pond-page-banner__title {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	color: var(--pond-white);
	font-size: 54px !important;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: .06em;
	text-transform: uppercase;
	margin: 0 0 6px;
}

.pond-page-banner__crumbs {
	font-family: Barlow, system-ui, sans-serif;
	color: var(--pond-white);
	font-size: 17px;
	line-height: 1.5;
}

.pond-page-banner__crumbs a {
	color: var(--pond-white);
	text-decoration: none;
}

.pond-page-banner__crumbs a:hover,
.pond-page-banner__crumbs a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.pond-page-banner__sep {
	margin: 0 7px;
	opacity: .7;
}

/* Astra still prints its own title above the content; the banner replaces it. */
.pond-has-banner .ast-single-entry-banner,
.pond-has-banner .entry-header .entry-title,
.pond-has-banner .ast-archive-description .ast-archive-title {
	display: none !important;
}

@media (max-width: 767px) {

	.pond-page-banner {
		padding: 34px 16px;
	}

	.pond-page-banner__title {
		font-size: 30px !important;
	}

	.pond-page-banner__crumbs {
		font-size: 15px;
	}
}

/* The banner now carries the page heading and the trail, so the storefront's
   own title and breadcrumbs would just say it a second time. Hidden rather than
   restyled, on every storefront page. */
/* The storefront's own page heading and breadcrumb row would repeat the
   banner, so they go. The product title stays: it belongs above the price. */
.pond-has-banner .ec-store .ec-page-title,
.pond-has-banner .ec-store .ec-breadcrumbs {
	display: none !important;
}

/* The banner ran straight into the first block of the page, so a heading band
   sat flush against the blue. Contact Us draws its own hero instead of the
   banner and leaves 72px there; this gives every banner page the same room. */
.pond-has-banner .site-content > .ast-container {
	padding-top: 56px;
}

@media (max-width: 767px) {

	.pond-has-banner .site-content > .ast-container {
		padding-top: 32px;
	}
}

/* Astra puts a 60px margin above #primary on its default template; the
   Elementor pages do not have it. Under the same banner that left the store
   and any default-template page sitting far lower than the rest. The banner
   already provides the gap, so this one goes. */
.pond-has-banner .site-content #primary {
	margin-top: 0;
}

/* ------------------------------------------------------- store carousel */

/* The programme carousel on the home page, fed by the storefront instead of
   WooCommerce. Values are taken from the cards it replaces (.pond-prod) so the
   section looks exactly as it did. */

.pond-store-carousel {
	position: relative;
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: 44px;
}

.pond-store-carousel__track {
	display: flex;
	gap: 22px;
	align-items: stretch;
	overflow-x: auto;
	/* Vertical gestures belong to the page, not the track, or a swipe up the
	   screen can get swallowed here on a phone. */
	overflow-y: hidden;
	/* Stops a sideways swipe triggering the browser back gesture. */
	overscroll-behavior-x: contain;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-block: 4px;
}

.pond-store-carousel__track::-webkit-scrollbar { display: none; }

.pond-store-card {
	flex: 0 0 calc((100% - 66px) / 4);
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	background: var(--pond-white);
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(1, 58, 107, .06), 0 6px 18px rgba(1, 58, 107, .07);
	transition: box-shadow .25s ease, transform .25s ease;
}

.pond-store-card:hover {
	box-shadow: 0 14px 30px -18px rgba(1, 58, 107, .55);
	transform: translateY(-3px);
}

.pond-store-card__media {
	display: block;
	line-height: 0;
}

.pond-store-card__media img {
	display: block !important;
	width: 100% !important;
	height: 200px !important;
	object-fit: cover !important;
	background: #F2F7FB;
}

.pond-store-card__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: 8px;
	padding: 18px;
}

.pond-store-card__cat {
	margin: 0;
	color: var(--pond-blue);
	font-family: Barlow, sans-serif;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.pond-store-card .pond-store-card__title {
	margin: 0;
	font-family: "Barlow Condensed", sans-serif;
	font-size: 19px !important;
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: .02em;
	text-transform: uppercase;
}

.pond-store-card__title a {
	color: #0A2A47;
	text-decoration: none;
}

.pond-store-card__title a:hover { color: var(--pond-blue); }

.pond-store-card__price {
	margin: auto 0 0;
	color: #0A2A47;
	font-family: Barlow, sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
}

/* Matches the site's buttons, which is what the old Add to Cart used. */
.pond-store-card__button {
	display: block;
	margin-top: 6px;
	padding: 12px 18px;
	background: var(--pond-blue);
	color: var(--pond-white);
	border-radius: 5px;
	font-family: Barlow, sans-serif;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .945px;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .18s ease;
}

.pond-store-card__button:hover,
.pond-store-card__button:focus-visible {
	background: var(--pond-blue-dark);
	color: var(--pond-white);
}

/* ---- arrows ---- */

.pond-store-carousel__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 38px !important;
	height: 38px !important;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--pond-white);
	color: var(--pond-blue);
	border: 1px solid var(--pond-line) !important;
	border-radius: 50% !important;
	padding: 0 !important;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 2px 10px rgba(1, 58, 107, .14);
	transition: background-color .18s ease, color .18s ease, opacity .18s ease;
}

.pond-store-carousel__arrow:hover:not(:disabled) {
	background: var(--pond-blue);
	color: var(--pond-white);
}

.pond-store-carousel__arrow:disabled {
	opacity: .35;
	cursor: default;
}

.pond-store-carousel__arrow--prev { left: 0; }
.pond-store-carousel__arrow--next { right: 0; }

@media (max-width: 1024px) {

	.pond-store-card { flex-basis: calc((100% - 22px) / 2); }
}

@media (max-width: 767px) {

	.pond-store-carousel { padding-inline: 0; }

	.pond-store-card { flex-basis: 82%; }

	.pond-store-carousel__arrow { display: none; }
}

/* ------------------------------------------------------- cart and checkout */

/* The storefront draws the cart as two bare panels: content runs right up to
   the border and the lines between items are invisible. The layout is left
   exactly as it is - this is breathing room, separators and weight. */

.ec-store .ec-cart__body-inner,
.ec-store .ec-cart__sidebar-inner,
.ec-store .ec-signin-form__content {
	border-radius: 8px !important;
	padding: 26px !important;
}

/* ---- the list of items ---- */

.ec-store .ec-cart-item {
	padding: 18px 0 !important;
	border-bottom: 1px solid var(--pond-line) !important;
}

/* Each item sits in its own wrapper, so no selector can single out the last
   one - :last-of-type and :last-child both match every item. Every item keeps
   its separator instead, and the storefront's own line closing the list is
   dropped, which was drawing a second rule 20px above the total. */
.ec-store .ec-cart__products,
.ec-store .ec-cart__products--few {
	border-bottom: 0 !important;
}

.ec-store .ec-cart-item__title {
	color: var(--pond-navy) !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
}

.ec-store .ec-cart-item__price,
.ec-store .ec-cart-item__sum {
	color: var(--pond-navy) !important;
	font-weight: 600 !important;
}

/* Only the colour: the storefront paints the thumbnail as a background
   image on this element, and the background shorthand would wipe it. */
.ec-store .ec-cart-item__picture-inner {
	border-radius: 6px !important;
	overflow: hidden !important;
	background-color: var(--pond-ice) !important;
}

/* ---- the running total ---- */

.ec-store .ec-cart-summary {
	margin-top: 4px !important;
}

.ec-store .ec-cart-summary__row {
	padding: 7px 0 !important;
}

/* The total is the line people look for, so it is set apart. */
.ec-store .ec-cart-summary__row--total {
	margin-top: 10px !important;
	padding-top: 16px !important;
	border-top: 2px solid var(--pond-line) !important;
}

.ec-store .ec-cart-summary__row--total .ec-cart-summary__cell,
.ec-store .ec-cart-summary__total {
	color: var(--pond-navy) !important;
	font-size: 18px !important;
	font-weight: 700 !important;
}

/* ---- steps down the left ---- */

.ec-store .ec-cart-step {
	padding-bottom: 18px !important;
}

.ec-store .ec-cart-step + .ec-cart-step {
	margin-top: 18px !important;
	padding-top: 22px !important;
	border-top: 1px solid var(--pond-line) !important;
}

.ec-store .ec-cart-step__title {
	margin-bottom: 8px !important;
}

/* ---- the buttons under the total ---- */

.ec-store .ec-cart__buttons {
	margin-top: 18px !important;
}

.ec-store .ec-cart__button + .ec-cart__button {
	margin-top: 10px !important;
}

/* ---- the email row ---- */

.ec-store .ec-cart-email {
	margin-top: 12px !important;
}

.ec-store .ec-cart-email__text {
	margin-bottom: 8px !important;
}

/* ---- the gap between the two columns ---- */

.ec-store .ec-cart__body {
	padding-right: 12px !important;
}

@media (max-width: 1024px) {

	.ec-store .ec-cart__body {
		padding-right: 0 !important;
	}

	.ec-store .ec-cart__sidebar-inner {
		margin-top: 18px !important;
	}
}

@media (max-width: 767px) {

	.ec-store .ec-cart__body-inner,
	.ec-store .ec-cart__sidebar-inner,
	.ec-store .ec-signin-form__content {
		padding: 18px !important;
	}

	.ec-store .ec-cart-item {
		padding: 14px 0 !important;
	}
}

/* ---- the purchase conditions, under the pay button ---- */

/* Added by pond.js as each checkout step draws: the storefront has no slot
   for text in this position. */
.ec-store .pond-checkout-terms {
	margin-top: 18px !important;
	padding: 16px 18px !important;
	border: 1px solid var(--pond-line) !important;
	border-radius: 8px !important;
	background: var(--pond-ice) !important;
}

.ec-store .pond-checkout-terms__intro {
	margin: 0 0 10px !important;
	color: var(--pond-navy) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.45 !important;
}

.ec-store .pond-checkout-terms__list {
	margin: 0 !important;
	padding-left: 20px !important;
	list-style: disc !important;
}

.ec-store .pond-checkout-terms__list li {
	margin: 0 0 5px !important;
	color: var(--pond-slate) !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
}

.ec-store .pond-checkout-terms__list li:last-child {
	margin-bottom: 0 !important;
}

/* ------------------------------------------------- reviews under the cart */

/* Full width, like the home page's reviews band. The cards themselves are
   styled by the existing .pond-reviews rules - this is only the section
   around them. Nothing extra is loaded: the block is built on the server from
   the stored reviews, and this CSS is already on the page. */

.pond-store-reviews {
	/* Astra constrains direct children of the content area, so the break-out
	   has to be forced. */
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	margin-top: 54px;
	padding: 54px 20px;
	background: var(--pond-ice);
}

.pond-store-reviews[hidden] {
	display: none !important;
}

.pond-store-reviews__inner {
	max-width: 1200px;
	margin-inline: auto;
	text-align: center;
}

/* The banded heading used across the site: an amber parallelogram with blue
   type. Written out here because the site rule is scoped to Elementor heading
   widgets and this heading is not one. */
.pond-store-reviews__title {
	display: inline-block;
	background: var(--pond-amber);
	color: var(--pond-blue);
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 33px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: 2.64px;
	text-transform: uppercase;
	padding: 15px 60px;
	margin: 0 0 28px;
	clip-path: polygon(22px 0, 100% 0, calc(100% - 22px) 100%, 0 100%);
}

/* The summary sits above the cards, centred, as it does on the home page. */
.pond-store-reviews .pond-reviews__summary {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-bottom: 22px;
	flex-wrap: wrap;
}

.pond-store-reviews .pond-reviews__score {
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 30px;
	font-weight: 700;
	line-height: 1;
	color: #0A2A47;
}

.pond-store-reviews .pond-reviews__stars {
	color: #FFB400;
	font-size: 18px;
	letter-spacing: 2.16px;
}

.pond-store-reviews .pond-reviews__count {
	font-size: 14px;
	font-weight: 500;
	color: var(--pond-slate);
}

@media (max-width: 767px) {

	.pond-store-reviews {
		margin-top: 36px;
		padding: 36px 16px;
	}

	.pond-store-reviews__title {
		font-size: 25px;
		padding: 12px 26px;
		letter-spacing: .06em;
	}
}

/* The newsletter band sits directly under the reviews, so on store pages it
   takes the same ground - otherwise a white strip divides the two. */
.pond-store-page .pond-newsletter {
	background: var(--pond-ice);
}

/* The content area carries a 60px bottom margin, which left a white band
   between the reviews and the newsletter. On storefront pages the two sit
   together. */
.pond-store-page .content-area {
	margin-bottom: 0 !important;
}

/* Centring the section to place the banded heading also centred the cards.
   Only the heading and the summary line are centred; the cards read left,
   as they do on the home page. */
.pond-store-reviews .pond-review,
.pond-store-reviews .pond-reviews__slider {
	text-align: left;
}

/* The rating summary above the rail was only ever centred inside the store
   block, so on the home page it sat hard left under a centred heading. */
.pond-reviews__summary {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 18px;
}

/* ------------------------------------------- live schedule and more, on a product */

.pond-store-extras[hidden] { display: none !important; }

.pond-store-extras__block {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding: 54px 20px;
}

.pond-store-extras__block--schedule { background: var(--pond-white); }
.pond-store-extras__block--more     { background: var(--pond-ice); }

.pond-store-extras__inner {
	max-width: 1200px;
	margin-inline: auto;
	text-align: center;
}

/* The banded heading the rest of the site uses. */
.pond-store-extras__title {
	display: inline-block;
	background: var(--pond-amber);
	color: var(--pond-blue);
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 33px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: 2.64px;
	text-transform: uppercase;
	padding: 15px 60px;
	margin: 0 0 18px;
	clip-path: polygon(22px 0, 100% 0, calc(100% - 22px) 100%, 0 100%);
}

.pond-store-extras__lede {
	margin: 0 0 26px;
	color: var(--pond-slate);
	font-size: 16px;
	line-height: 1.6;
}

/* The schedule keeps its shape on any width. */
.pond-store-extras__frame {
	position: relative;
	background: var(--pond-white);
	border: 1px solid var(--pond-line);
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(1, 58, 107, .06), 0 6px 18px rgba(1, 58, 107, .07);
}

.pond-store-extras__frame iframe {
	display: block;
	width: 100%;
	height: 620px;
	border: 0;
}

@media (max-width: 767px) {

	.pond-store-extras__block { padding: 36px 16px; }

	.pond-store-extras__title {
		font-size: 25px;
		padding: 12px 26px;
		letter-spacing: .06em;
	}

	.pond-store-extras__frame iframe { height: 460px; }
}

/* ---- corrections ---- */

/* Card links are buttons and headings, not body links; the theme underlines
   every anchor, which made "Select options" look like running text. */
.pond-store-card__button,
.pond-store-card__title a {
	text-decoration: none !important;
}

/* Room between the banded heading and the rail below it. Astra sets this
   through .entry-content h2, which outranks a single class. */
.pond-store-extras__title,
.pond-store-reviews__title {
	margin-bottom: 34px !important;
}

/* The carousel sat hard against the edge of its band on a phone. */
@media (max-width: 767px) {

	.pond-store-extras__block {
		padding: 36px 20px;
	}

	.pond-store-extras__frame iframe {
		height: 420px;
	}
}


/* ---------------------------------------------- the storefront's link row */

/* Ecwid prints a row of links - search, account, orders, favourites, bag - in
   the middle of its storefront, as plain muted text in a wide empty band. The
   header cart and the menu already cover the same ground, so the row is
   dropped rather than restyled.

   inc/store-footer-links.php can print them back as pills at the foot of the
   page; it is on disk but not registered in functions.php. */
.ec-store .ec-footer {
	display: none !important;
}

/* ---------------------------------------------- scroll-to-top, Chaty, wheel */

/* Three things want the bottom corners. Chaty takes the bottom right and opens
   its channels upwards from there, so nothing can sit above it either. The
   Spin-to-Win trigger takes the bottom left, a 120px box. The theme's
   scroll-to-top arrow defaulted to the bottom right, on top of Chaty, so it
   moves to the left and rides above the wheel. */
#ast-scroll-top.ast-scroll-to-top-right,
#ast-scroll-top {
	right: auto !important;
	left: 64px !important;
	bottom: 156px !important;
}

@media (max-width: 767px) {

	#ast-scroll-top.ast-scroll-to-top-right,
	#ast-scroll-top {
		left: 44px !important;
		bottom: 150px !important;
	}
}

/* ---------------------------------------------------- footer credit link */

/* The credit link took the theme's link blue, which disappears against the
   navy footer. White and underlined, so it reads as a link. */
.elementor-36654 .elementor-element-3260152 a,
.elementor-36654 .elementor-element-3260152 a:visited {
	color: #ffffff !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
}

.elementor-36654 .elementor-element-3260152 a:hover,
.elementor-36654 .elementor-element-3260152 a:focus-visible {
	color: var(--pond-amber) !important;
}

/* ------------------------------------------------------------- WPForms */

/* WPForms ships its own grey-on-white styling, which sits oddly beside the
   rest of the site. This brings it onto the same type, colours and controls
   as the storefront and the cart, and gives the form a column of its own
   rather than letting it run the full width of the page. */

.wpforms-container {
	max-width: 760px !important;
	margin-inline: auto !important;
	padding: 34px 36px !important;
	border: 1px solid var(--pond-line) !important;
	border-radius: 12px !important;
	background: var(--pond-white) !important;
	box-shadow: 0 2px 14px rgba(1, 58, 107, .06) !important;
}

.wpforms-container .wpforms-field {
	padding: 0 0 20px !important;
}

/* ---- labels ---- */

.wpforms-container .wpforms-field-label {
	margin-bottom: 7px !important;
	color: var(--pond-navy) !important;
	font-family: Barlow, system-ui, sans-serif !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
}

.wpforms-container .wpforms-field-sublabel {
	color: var(--pond-slate) !important;
	font-size: 12px !important;
}

.wpforms-container .wpforms-field-description {
	margin-top: 6px !important;
	color: var(--pond-slate) !important;
	font-size: 13px !important;
	line-height: 1.45 !important;
}

/* The asterisk carries the meaning, so it is the one red thing here. */
.wpforms-container .wpforms-required-label {
	color: #D63637 !important;
}

/* ---- the controls ---- */

.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="number"],
.wpforms-container input[type="tel"],
.wpforms-container select,
.wpforms-container textarea {
	width: 100% !important;
	padding: 11px 14px !important;
	border: 1px solid var(--pond-line) !important;
	border-radius: 8px !important;
	background: var(--pond-white) !important;
	color: var(--pond-navy) !important;
	font-family: Barlow, system-ui, sans-serif !important;
	font-size: 15px !important;
	line-height: 1.4 !important;
	box-shadow: none !important;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.wpforms-container textarea {
	min-height: 130px !important;
	resize: vertical !important;
}

.wpforms-container input:focus,
.wpforms-container select:focus,
.wpforms-container textarea:focus {
	border-color: var(--pond-blue) !important;
	box-shadow: 0 0 0 3px rgba(0, 96, 174, .14) !important;
	outline: none !important;
}

.wpforms-container ::placeholder {
	color: #9FB3C8 !important;
}

/* ---- the lists of choices ---- */

.wpforms-container ul li {
	margin-bottom: 9px !important;
	list-style: none !important;
}

.wpforms-container .wpforms-field-radio label,
.wpforms-container .wpforms-field-checkbox label {
	color: var(--pond-slate) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	line-height: 1.45 !important;
}

.wpforms-container input[type="radio"],
.wpforms-container input[type="checkbox"] {
	margin-right: 9px !important;
	accent-color: var(--pond-blue) !important;
}

/* ---- the button ---- */

.wpforms-container .wpforms-submit {
	padding: 14px 38px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--pond-blue) !important;
	color: var(--pond-white) !important;
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	letter-spacing: .06em !important;
	text-transform: uppercase !important;
	cursor: pointer !important;
	transition: background-color .18s ease, transform .18s ease;
}

.wpforms-container .wpforms-submit:hover,
.wpforms-container .wpforms-submit:focus-visible {
	background: var(--pond-blue-dark) !important;
	transform: translateY(-1px);
}

.wpforms-container .wpforms-submit-container {
	padding-top: 6px !important;
	text-align: center !important;
}

/* ---- what the form says when it has been sent ---- */

.wpforms-confirmation-container-full {
	max-width: 760px !important;
	margin-inline: auto !important;
	padding: 26px 30px !important;
	border: 1px solid var(--pond-line) !important;
	border-left: 4px solid var(--pond-blue) !important;
	border-radius: 10px !important;
	background: var(--pond-ice) !important;
	color: var(--pond-navy) !important;
}

@media (max-width: 767px) {

	.wpforms-container {
		padding: 22px 18px !important;
		border-radius: 10px !important;
	}

	.wpforms-container .wpforms-submit {
		width: 100% !important;
		padding: 14px 20px !important;
	}
}

/* WPForms caps its "medium" fields at 60% of the form. Inside a 760px card
   that left a wide empty strip down the right; every field takes the full
   width of the card instead. */
.wpforms-container .wpforms-field-medium,
.wpforms-container .wpforms-field-row.wpforms-field-medium,
.wpforms-container .wpforms-field-small,
.wpforms-container .wpforms-field-large {
	max-width: 100% !important;
	width: 100% !important;
}

/* The submit button spans the form like the fields above it. WPForms also
   fixes its height at 41px, which is less than its own padding and text need,
   so the height is left to the content. */
.wpforms-container .wpforms-submit {
	width: 100% !important;
	height: auto !important;
	padding: 15px 24px !important;
	line-height: 1.2 !important;
}

/* ---------------------------------------------------------- launch popup */

/* The announcement on the home page. Drawn to match the newsletter card:
   photo on the left, white panel, the site's own type. */

.pond-popup {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	opacity: 0;
	transition: opacity .2s ease;
}

.pond-popup[hidden] {
	display: none;
}

.pond-popup.is-open {
	opacity: 1;
}

.pond-popup__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(1, 26, 48, .62);
	cursor: pointer;
}

.pond-popup__dialog {
	position: relative;
	display: grid;
	grid-template-columns: 42% 1fr;
	width: 100%;
	max-width: 860px;
	max-height: calc(100vh - 40px);
	overflow: auto;
	border-radius: 14px;
	background: var(--pond-white);
	box-shadow: 0 24px 60px rgba(1, 26, 48, .35);
	transform: translateY(12px) scale(.98);
	transition: transform .2s ease;
}

.pond-popup.is-open .pond-popup__dialog {
	transform: none;
}

.pond-popup__dialog[data-no-photo] {
	grid-template-columns: 1fr;
	max-width: 560px;
}

.pond-popup__media {
	min-height: 100%;
	background: var(--pond-ice);
}

.pond-popup__photo {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pond-popup__body {
	padding: 40px 38px 34px;
}

.pond-popup__eyebrow {
	margin: 0 0 10px;
	color: var(--pond-blue);
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.pond-popup__title {
	margin: 0 0 14px;
	color: var(--pond-navy);
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 38px;
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: .02em;
	text-transform: uppercase;
}

.pond-popup__text {
	margin: 0 0 18px;
	color: var(--pond-slate);
	font-size: 16px;
	line-height: 1.55;
}

.pond-popup__features {
	margin: 0 0 18px !important;
	padding: 0 !important;
	list-style: none !important;
}

.pond-popup__features li {
	position: relative;
	margin: 0 0 10px;
	padding-left: 30px;
	color: var(--pond-navy);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.45;
}

/* A tick in the site's amber, drawn rather than loaded. */
.pond-popup__features li::before {
	content: "";
	position: absolute;
	top: 1px;
	left: 0;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--pond-amber);
}

.pond-popup__features li::after {
	content: "";
	position: absolute;
	top: 5px;
	left: 7px;
	width: 5px;
	height: 9px;
	border: solid var(--pond-navy);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.pond-popup__note {
	margin: 0 0 22px;
	padding: 12px 14px;
	border-left: 3px solid var(--pond-blue);
	border-radius: 6px;
	background: var(--pond-ice);
	color: var(--pond-navy);
	font-size: 14px;
	line-height: 1.5;
}

.pond-popup__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 18px;
}

.pond-popup__button {
	display: inline-block;
	padding: 14px 30px;
	border-radius: 999px;
	background: var(--pond-blue);
	color: var(--pond-white) !important;
	font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: .06em;
	line-height: 1.2;
	text-decoration: none !important;
	text-transform: uppercase;
	transition: background-color .18s ease, transform .18s ease;
}

.pond-popup__button:hover,
.pond-popup__button:focus-visible {
	background: var(--pond-blue-dark);
	transform: translateY(-1px);
}

.pond-popup__later {
	padding: 6px 0;
	border: 0;
	background: none;
	color: var(--pond-slate);
	font-size: 15px;
	text-decoration: underline;
	cursor: pointer;
}

.pond-popup__later:hover {
	color: var(--pond-navy);
}

.pond-popup__close {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 1;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .92);
	color: var(--pond-navy);
	font-size: 26px;
	line-height: 36px;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(1, 26, 48, .15);
}

.pond-popup__close:hover {
	background: var(--pond-white);
}

/* The page behind stays put while the popup is open. */
html.pond-popup-open,
html.pond-popup-open body {
	overflow: hidden;
}

@media (max-width: 767px) {

	.pond-popup {
		align-items: flex-end;
		padding: 0;
	}

	.pond-popup__dialog {
		grid-template-columns: 1fr;
		max-height: 92vh;
		border-radius: 16px 16px 0 0;
	}

	.pond-popup__media {
		height: 160px;
		min-height: 0;
	}

	.pond-popup__body {
		padding: 26px 22px 24px;
	}

	.pond-popup__title {
		font-size: 30px;
	}

	.pond-popup__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.pond-popup__button {
		width: 100%;
		text-align: center;
	}
}

/* The theme styles every <button> with a border and fill; the dismiss link is
   meant to read as plain text beside the main button. */
.pond-popup .pond-popup__later,
.pond-popup .pond-popup__later:hover,
.pond-popup .pond-popup__later:focus {
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	color: var(--pond-slate) !important;
	padding: 8px 0 !important;
	font-family: Barlow, system-ui, sans-serif !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-decoration: underline !important;
}

.pond-popup .pond-popup__later:hover {
	color: var(--pond-navy) !important;
}

/* The close button gets the same treatment, so the theme leaves it round. */
.pond-popup .pond-popup__close {
	border: 0 !important;
	padding: 0 !important;
	background: rgba(255, 255, 255, .92) !important;
	color: var(--pond-navy) !important;
}

@media (max-width: 767px) {

	/* Small viewport units measure the screen with the browser bars showing,
	   so the sheet never runs under them; vh is the fallback. */
	.pond-popup__dialog {
		width: 100% !important;
		max-width: 100% !important;
		max-height: 88vh !important;
		max-height: 88svh !important;
	}

	.pond-popup__media {
		height: 140px !important;
	}

	.pond-popup__body {
		padding: 22px 20px 20px !important;
	}

	.pond-popup__title {
		font-size: 28px !important;
	}
}

/* Chaty and the Spin-to-Win trigger float above everything, including this
   popup, and landed on top of its button. While the announcement is open
   they step aside; they come back the moment it closes. */
html.pond-popup-open .chaty,
html.pond-popup-open .chaty-widget,
html.pond-popup-open #widget_optimizer,
html.pond-popup-open #ast-scroll-top {
	display: none !important;
}

.pond-popup {
	z-index: 2147483000 !important;
}

/* Mobile, second pass: a card inset from the edges rather than a sheet that
   runs edge to edge, and a taller photo. The dialog still scrolls inside
   itself if a small phone cannot fit it all. */
@media (max-width: 767px) {

	.pond-popup {
		align-items: center !important;
		padding: 16px !important;
	}

	.pond-popup__dialog {
		border-radius: 14px !important;
		max-height: calc(100vh - 32px) !important;
		max-height: calc(100svh - 32px) !important;
	}

	.pond-popup__media {
		height: 220px !important;
	}
}

/* The taller photo pushed "Maybe later" below the fold on a standard phone.
   The spacing between blocks tightens instead, so the whole card - dismiss
   link included - fits without scrolling. */
@media (max-width: 767px) {

	.pond-popup__body {
		padding: 20px 20px 16px !important;
	}

	.pond-popup__eyebrow {
		margin-bottom: 6px !important;
	}

	.pond-popup__title {
		margin-bottom: 10px !important;
	}

	.pond-popup__text {
		margin-bottom: 12px !important;
		font-size: 15px !important;
		line-height: 1.5 !important;
	}

	.pond-popup__features {
		margin-bottom: 12px !important;
	}

	.pond-popup__features li {
		margin-bottom: 7px !important;
		font-size: 14px !important;
	}

	.pond-popup__note {
		margin-bottom: 14px !important;
		padding: 10px 12px !important;
		font-size: 13px !important;
	}

	.pond-popup__actions {
		gap: 4px !important;
	}
}