/*
 * Components.
 *
 * One block per widget the Elementor stack used to render.
 */

/* ================================================================== *
 * Buttons
 * ================================================================== */

.jbw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 0.7em 1.6em;
	border: var(--jbw-border) solid var(--jbw-gold);
	border-radius: var(--jbw-radius);
	background: var(--jbw-gold);
	color: var(--jbw-ink);
	font-family: var(--jbw-font-body);
	font-size: var(--jbw-text-button);
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition:
		background-color var(--jbw-dur-fast) var(--jbw-ease),
		color var(--jbw-dur-fast) var(--jbw-ease),
		border-color var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-btn:hover,
.jbw-btn:focus-visible {
	background: var(--jbw-paper);
	border-color: var(--jbw-gold);
	color: var(--jbw-ink);
}

/* #3b5e163: transparent fill, pure white text, gold on hover. */
.jbw-btn--ghost {
	background: var(--jbw-transparent);
	color: var(--jbw-white);
	border-color: var(--jbw-gold);
}

.jbw-btn--ghost:hover,
.jbw-btn--ghost:focus-visible {
	background: var(--jbw-gold);
	color: var(--jbw-ink);
}

.jbw-btn--ghost:hover svg,
.jbw-btn--ghost:focus-visible svg {
	fill: var(--jbw-ink);
}

/* Text-and-arrow link, used by the story panels. */
.jbw-btn--link {
	padding: 0;
	border: 0;
	background: var(--jbw-transparent);
	color: var(--jbw-gold);
	font-size: var(--jbw-text-lg);
	font-weight: 400;
	text-transform: none;
}

.jbw-btn--link:hover,
.jbw-btn--link:focus-visible {
	background: none;
	color: var(--jbw-paper);
}

.jbw-btn__icon {
	flex: none;
}

/* ================================================================== *
 * Header
 *
 * Ported from post-52.css (element 10faa06). The header is absolutely
 * positioned over the hero and has no background of its own — not even
 * when stuck. Elementor switched it to fixed on scroll; same here.
 * ================================================================== */

.jbw-header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	padding: 2.5%;
	z-index: 199;
	transition: background 500ms;
}

/*
 * Sticky state (.elementor-sticky--effects): a dark-to-transparent
 * gradient, tighter padding and a smaller logo, all over 500ms.
 */
.jbw-header.is-stuck {
	position: fixed;
	background: linear-gradient(180deg, rgba(18, 18, 18, 1) 10%, rgba(18, 18, 18, 0) 100%);
	transition-duration: 500ms;
}

.jbw-header.is-stuck .jbw-header__inner {
	padding-block: 0.75rem;
	transition-duration: 500ms;
}

/* Sticky: the logo eases down to 5rem over 500ms, and back up again. */
.jbw-header.is-stuck .jbw-header__logo-img {
	height: 5rem;
}

.jbw-header__inner {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	width: 100%;
	max-width: var(--jbw-container);
	margin-inline: auto;
}

.jbw-header__logo {
	display: block;
	flex: none;
	line-height: 0;
	text-align: start;
}

/*
 * #ada1f7f img — a circle, not a square. The .1rem border follows the
 * 100px radius; without the radius it reads as a black box.
 */
.jbw-header__logo-img {
	width: auto;
	height: 8rem;
	transition: height 500ms var(--jbw-ease);
	border: 0.1rem solid var(--jbw-ink);
	border-radius: 100px;
	background: rgba(18, 18, 18, 0.05);
	backdrop-filter: blur(6px);
	filter: drop-shadow(5px 5px 5px var(--jbw-ink));
}

.jbw-header__actions {
	display: flex;
	align-items: center;
	gap: 1.5rem;
}

/* #be86874 — gold, right aligned. */
.jbw-nav-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	max-height: 48px;
	padding: 0.5rem 1rem 0 1rem;
	border: 0;
	background: none;
	color: var(--jbw-gold);
}

.jbw-nav-toggle:hover {
	color: var(--jbw-paper);
}

@media (max-width: 1024px) {
	.jbw-header__cta {
		max-width: 240px;
	}
}

@media (max-width: 767px) {
	.jbw-header__inner {
		flex-wrap: nowrap;
	}

	/* #ada1f7f img { width: 5rem } */
	.jbw-header__logo-img,
	.jbw-header.is-stuck .jbw-header__logo-img {
		height: 5rem;
	}

	/* #be86874 { padding: .25rem 0 0 0 } */
	.jbw-nav-toggle {
		padding: 0.25rem 0 0 0;
	}

	.jbw-header__cta {
		max-width: 300px;
		padding: 0.5em;
	}

	.jbw-header__actions {
		gap: 0.75rem;
	}
}

/* ================================================================== *
 * Navigation card
 *
 * A tooltip-style white card beside the hamburger, per post-52.css:
 * background #FFFFFF, 6px radius, shadow 0 0 5px 5px rgba(18,18,18,.25),
 * .5em padding, 350ms fade, offset 5px. Pins right below the header
 * under 600px.
 * ================================================================== */

.jbw-nav-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
}

.jbw-nav {
	position: absolute;
	/*
	 * Anchored to the toggle's top edge and growing downward. Centring it
	 * pushed the card above the viewport on short headers (680-767px).
	 */
	top: 0;
	/* tooltip distance: 6 */
	right: calc(100% + 6px);
	z-index: 200;
	/* minWidth: 0 — the card is only as wide as its items. */
	padding: 0.5em;
	border-radius: 6px;
	background: var(--jbw-white);
	box-shadow: 0 0 5px 5px rgba(18, 18, 18, 0.25);
	opacity: 0;
	visibility: hidden;
	transition:
		opacity 350ms var(--jbw-ease),
		visibility 0s linear 350ms;
}

.jbw-nav.is-open {
	opacity: 1;
	visibility: visible;
	transition-delay: 0s;
}

.jbw-nav__list {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	list-style: none;
}

/*
 * The menu template loads over AJAX, so it is not in the saved page and
 * has no computed CSS here. This is Elementor's icon-list default — the
 * kit's "Menu" typography token (acier-bat-solid) at the inherited body
 * size, since that token sets no size of its own.
 */
.jbw-nav__list a {
	display: block;
	padding: 0.35em 0.6em;
	color: var(--jbw-ink);
	font-family: var(--jbw-font-display);
	font-size: 1rem;
	line-height: 1.4;
	text-transform: uppercase;
	white-space: nowrap;
}

.jbw-nav__list a:hover,
.jbw-nav__list a:focus-visible {
	color: var(--jbw-gold);
}

/*
 * Narrow screens: drop the card below the header row, right aligned, so
 * it clears the logo and the Get a Quote button instead of landing on
 * top of them.
 */
@media (max-width: 767px) {
	.jbw-nav {
		top: calc(100% + 10px);
		right: 0;
		left: auto;
	}
}

/* ================================================================== *
 * Footer
 * ================================================================== */

.jbw-footer {
	position: sticky;
	bottom: 0;
	z-index: 0;
	background: linear-gradient(180deg, var(--jbw-ink) 0%, var(--jbw-black) 100%);
}

.jbw-footer__inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 1.5rem;
	max-width: calc(var(--jbw-container) + 2 * var(--jbw-gutter-x));
	margin-inline: auto;
	padding: 1.5rem var(--jbw-gutter-x);
}

.jbw-footer__col--social {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	justify-self: end;
	grid-column: 3;
	grid-row: 1;
}

.jbw-footer__col--copy {
	grid-column: 1;
	grid-row: 2;
}

.jbw-footer__col--legal {
	grid-column: 3;
	grid-row: 2;
	justify-self: end;
}

.jbw-footer__heading {
	margin: 0;
	font-family: var(--jbw-font-body);
	font-size: var(--jbw-text-sm);
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0.02em;
}

.jbw-footer__arrow {
	display: inline-flex;
	color: var(--jbw-paper);
}

.jbw-footer__social {
	display: inline-flex;
	color: var(--jbw-paper);
	transition: color var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-footer__social:hover {
	color: var(--jbw-gold);
}

.jbw-footer__copyright,
.jbw-footer__legal-link {
	margin: 0;
	font-size: var(--jbw-text-sm);
	line-height: 1.4;
}

.jbw-footer__copyright {
	color: var(--jbw-paper);
}

.jbw-footer__legal-link {
	color: var(--jbw-paper);
}

.jbw-footer__legal-link:hover {
	color: var(--jbw-gold);
}

@media (max-width: 767px) {
	.jbw-footer__inner {
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
	}

	.jbw-footer__col--social,
	.jbw-footer__col--copy,
	.jbw-footer__col--legal {
		grid-column: 1;
		grid-row: auto;
		justify-self: center;
	}
}

/*
 * The footer is sticky and sits behind the page, so main needs an opaque
 * background to slide over it.
 */
.jbw-main {
	position: relative;
	z-index: 1;
	background: var(--jbw-bg);
}

/* ================================================================== *
 * Hero banner
 *
 * Ported from Elementor's computed CSS (post-8.css, element 07f0ef4 and
 * children). The container sets its own padding to zero, overriding
 * .e-con's 10% default.
 * ================================================================== */

.jbw-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-height: 100vmin;
	/*
	 * The header overlays this section, so pad past it. The variable is
	 * published by app.js from the header's measured height; the
	 * fallback covers the no-JS case.
	 */
	padding: var(--jbw-header-height, 12.5rem) 0 0;
	overflow: hidden;
	isolation: isolate;
	text-align: center;
	z-index: 100;
}

.jbw-hero--compact {
	min-height: min(62vmin, 34rem);
}

/* #07f0ef4::before */
.jbw-hero__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	background-image: linear-gradient(180deg, #00000080 0%, var(--jbw-ink) 100%);
	opacity: 1;
	pointer-events: none;
}

.jbw-hero__inner {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	/* the kit's --widgets-spacing between stacked widgets */
	gap: var(--jbw-gap);
	width: 100%;
	max-width: calc(var(--jbw-container) + 2 * var(--jbw-gutter-x));
	margin-inline: auto;
	padding-inline: var(--jbw-gutter-x);
}

/* #4ebb400 — pure white, not the off-white body colour. */
.jbw-hero__eyebrow {
	align-self: center;
	margin: 0;
	color: var(--jbw-white);
	font-family: var(--jbw-font-display);
	font-size: var(--jbw-h6);
	font-weight: 400;
	text-transform: uppercase;
	text-align: center;
}

/*
 * #0acaf48 — gold fill with a 3px gold text stroke at weight 800, which
 * is what gives the headline its weight. Easy to miss; without it the
 * hero reads as a thin imitation.
 */
.jbw-hero__title {
	margin: 0;
	color: var(--jbw-gold);
	font-weight: 800;
	text-align: center;
	-webkit-text-stroke-width: 3px;
	-webkit-text-stroke-color: var(--jbw-gold);
	paint-order: stroke fill;
}

/* #cb17741 — a hard 475px measure at the kit's "Large Body" size. */
.jbw-hero__lede {
	align-self: center;
	width: 475px;
	max-width: 475px;
	margin: 0;
	color: var(--jbw-paper);
	font-family: var(--jbw-font-body);
	font-size: var(--jbw-text-lg);
	line-height: var(--jbw-leading-tight);
	text-align: center;
}

/* #5eba578 */
.jbw-hero__actions {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	padding-top: 5%;
	width: 100%;
}

/*
 * Kept as an <h1> for document structure, but styled as the h2 the
 * original used: acier-bat-solid at the h2 step, not the body face.
 */
.jbw-page-title {
	margin: 0;
	color: var(--jbw-gold);
	font-family: var(--jbw-font-display);
	font-size: var(--jbw-h2);
	font-weight: 400;
	text-transform: uppercase;
	text-align: center;
}

@media (max-width: 767px) {
	.jbw-hero {
		padding-top: var(--jbw-header-height, 7rem);
	}

	.jbw-hero__title {
		font-size: 2rem;
		line-height: 1.4em;
		-webkit-text-stroke-width: 2px;
	}

	.jbw-hero__lede {
		width: 100%;
	}
}

/* ================================================================== *
 * Story carousel — three cross-fading panels, external nav only
 * ================================================================== */

.jbw-story {
	position: relative;
}

.jbw-story__track {
	display: grid;
}

.jbw-story__panel {
	grid-area: 1 / 1;
	opacity: 0;
	visibility: hidden;
	transform: scale(1.04);
	transition:
		opacity var(--jbw-story-speed) var(--jbw-ease),
		transform var(--jbw-story-speed) var(--jbw-ease),
		visibility 0s linear var(--jbw-story-speed);
	pointer-events: none;
}

.jbw-story__panel.is-active {
	opacity: 1;
	visibility: visible;
	transform: scale(1);
	transition-delay: 0s;
	pointer-events: auto;
}

.jbw-story__body {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	align-items: flex-start;
}

.jbw-story__title {
	margin: 0;
	color: var(--jbw-gold);
}

.jbw-story__title em,
.jbw-story__title span,
.jbw-story__title .jbw-accent {
	color: var(--jbw-paper);
	font-style: normal;
}

.jbw-story__text {
	color: var(--jbw-paper);
	font-size: 1rem;
	line-height: var(--jbw-leading-tight);
}

.jbw-story__media {
	position: relative;
}

@media (max-width: 767px) {
	.jbw-story__panel {
		transform: none;
	}
}

/* ================================================================== *
 * Image hotspot
 * ================================================================== */

.jbw-hotspot-image {
	position: relative;
	border-radius: var(--jbw-radius-lg);
	overflow: visible;
}

.jbw-hotspot-image__img {
	width: 100%;
	border: var(--jbw-border) solid var(--jbw-gold);
	border-radius: var(--jbw-radius-lg);
}

.jbw-hotspot {
	position: absolute;
	transform: translate(-50%, -50%);
	z-index: 2;
}

.jbw-hotspot__dot {
	display: grid;
	place-items: center;
	width: 1.5rem;
	height: 1.5rem;
	padding: 0;
	border: 0;
	border-radius: 30px;
	background: var(--jbw-gold);
	color: var(--jbw-paper);
	box-shadow: var(--jbw-shadow-dot);
}

/* far fa-dot-circle: a white ring with a filled centre. */
.jbw-hotspot__dot::before {
	content: "";
	width: 0.75rem;
	height: 0.75rem;
	border: 2px solid currentColor;
	border-radius: 50%;
	box-shadow: inset 0 0 0 2px currentColor;
}

.jbw-hotspot__tooltip {
	position: absolute;
	bottom: calc(100% + 0.9rem);
	left: 50%;
	min-width: 300px;
	width: 300px;
	max-width: 300px;
	padding: 0 1rem 1rem;
	border-radius: var(--jbw-radius-lg);
	background: var(--jbw-paper);
	color: var(--jbw-ink);
	box-shadow: var(--jbw-shadow-tooltip);
	font-size: 1rem;
	font-weight: 400;
	line-height: var(--jbw-leading-tight);
	text-align: center;
	text-wrap: wrap;

	/* Elementor's e-hotspot--fade-grow */
	opacity: 0;
	transform: translateX(-50%) scale(0.85);
	transform-origin: bottom center;
	transition:
		opacity var(--jbw-dur-fast) var(--jbw-ease),
		transform var(--jbw-dur-fast) var(--jbw-ease),
		visibility 0s linear var(--jbw-dur-fast);
	visibility: hidden;
	pointer-events: none;
}

.jbw-hotspot:hover .jbw-hotspot__tooltip,
.jbw-hotspot:focus-within .jbw-hotspot__tooltip {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) scale(1);
	transition-delay: 0s;
}

@media (max-width: 767px) {
	.jbw-hotspot__tooltip {
		width: 280px;
		max-width: 280px;
	}
}

/* ================================================================== *
 * Service cards
 * ================================================================== */

.jbw-service {
	position: relative;
	text-align: left;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 16rem;
	padding: 2.5rem;
	border-radius: 12px;
	background-color: var(--jbw-ink);
	background-position: center;
	background-size: cover;
	overflow: hidden;
	isolation: isolate;
	transition: transform var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-service--feature {
	grid-row: span 2;
	min-height: 22rem;
}

.jbw-service::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, var(--jbw-transparent) 0%, var(--jbw-ink-90) 100%);
	transition: background var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-service:hover {
	transform: scale(1.02);
}

.jbw-service:hover::after {
	background: linear-gradient(180deg, var(--jbw-ink-43) 0%, var(--jbw-ink-90) 100%);
}

.jbw-service__title {
	margin: 0;
	/* Source markup used an h6: display face, uppercase, white. */
	font-family: var(--jbw-font-display);
	font-size: var(--jbw-h6);
	font-weight: 400;
	text-transform: uppercase;
	color: var(--jbw-paper);
}

.jbw-service__text {
	width: 475px;
	max-width: 100%;
	margin: 0.75rem 0 0;
	color: var(--jbw-paper);
	font-size: 1rem;
	font-weight: 400;
	line-height: var(--jbw-leading-tight);
	text-align: start;
}

@media (max-width: 767px) {
	.jbw-service {
		min-height: 11rem;
		padding: 1rem;
	}

	.jbw-service--feature {
		grid-row: auto;
		min-height: 16rem;
	}
}

/* ================================================================== *
 * Tabs — carousel of labels on desktop/tablet, accordion on mobile
 * ================================================================== */

.jbw-tabs__list {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 0 0 2rem;
	padding: 0;
	list-style: none;
}

.jbw-tabs__scroller {
	display: flex;
	flex: 1;
	gap: 2rem;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;
}

.jbw-tabs__scroller::-webkit-scrollbar {
	display: none;
}

.jbw-tabs__item {
	flex: 0 0 calc((100% - 4rem) / 3);
	scroll-snap-align: center;
}

.jbw-tabs__tab {
	display: block;
	width: 100%;
	padding: 0.5rem 0;
	border: 0;
	background: none;
	color: var(--jbw-paper);
	font-family: var(--jbw-font-body);
	font-size: var(--jbw-text-sm);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-align: center;
	text-transform: uppercase;
	transition: color var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-tabs__tab[aria-selected="true"] {
	color: var(--jbw-gold);
}

.jbw-tabs__arrow {
	flex: none;
	display: grid;
	place-items: center;
	width: 1.5em;
	height: 1.5em;
	padding: 0;
	border: 0;
	background: none;
	color: var(--jbw-paper);
	font-size: 1.5em;
	transition: color var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-tabs__arrow:hover {
	color: var(--jbw-gold);
}

.jbw-tabs__panel[hidden] {
	display: none;
}

@media (max-width: 1024px) {
	.jbw-tabs__item {
		flex-basis: 100%;
	}
}

/* Accordion form, under 768px. */
@media (max-width: 767px) {
	.jbw-tabs__list {
		display: none;
	}

	.jbw-tabs__panel[hidden] {
		display: block;
	}

	.jbw-tabs__panel {
		border-bottom: 1px solid var(--jbw-white-25);
	}

	.jbw-tabs__summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
		width: 100%;
		padding: 1rem 0;
		border: 0;
		background: none;
		color: var(--jbw-paper);
		font-family: var(--jbw-font-body);
		font-size: var(--jbw-text-sm);
		font-weight: 700;
		letter-spacing: 0.06em;
		text-align: left;
		text-transform: uppercase;
	}

	.jbw-tabs__summary[aria-expanded="true"] {
		color: var(--jbw-gold);
	}

	.jbw-tabs__summary-icon {
		transition: transform var(--jbw-dur-fast) var(--jbw-ease);
	}

	.jbw-tabs__summary[aria-expanded="true"] .jbw-tabs__summary-icon {
		transform: rotate(90deg);
	}

	.jbw-tabs__content {
		padding-bottom: 1.5rem;
	}

	.jbw-tabs__content[hidden] {
		display: none;
	}
}

@media (min-width: 768px) {
	.jbw-tabs__summary {
		display: none;
	}
}

/* ================================================================== *
 * Carousel — media galleries and reviews
 * ================================================================== */

.jbw-carousel {
	position: relative;
	display: flex;
	flex-direction: column;
	/*
	 * Slides per view comes from --jbw-per-d/t/m, set inline per carousel.
	 * --jbw-carousel-per itself is only ever assigned here, so the media
	 * queries below still win over the inline values.
	 */
	--jbw-carousel-per: var(--jbw-per-d, 3);
}

/*
 * The widget carried padding: 0 2rem 1rem. The arrows sit inside that
 * gutter rather than taking space in the row, so the slides keep the
 * full measure.
 */
.jbw-carousel__row {
	position: relative;
	width: 100%;
	padding-inline: 2rem;
	padding-bottom: 1rem;
}

.jbw-carousel__viewport {
	flex: 1;
	min-width: 0;
	display: flex;
	gap: var(--jbw-carousel-gap, 28px);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.jbw-carousel__viewport::-webkit-scrollbar {
	display: none;
}

.jbw-carousel__slide {
	flex: 0 0 calc((100% - var(--jbw-carousel-gap, 28px) * (var(--jbw-carousel-per, 3) - 1)) / var(--jbw-carousel-per, 3));
	scroll-snap-align: start;
	min-width: 0;
}

.jbw-carousel__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: grid;
	place-items: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: none;
	color: var(--jbw-paper);
	font-size: 2rem;
	transition: color var(--jbw-dur-fast) var(--jbw-ease), opacity var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-carousel__arrow--prev { left: -0.25rem; }
.jbw-carousel__arrow--next { right: -0.25rem; }

.jbw-carousel__arrow:hover {
	color: var(--jbw-gold);
}

.jbw-carousel__arrow[disabled] {
	opacity: 0.25;
	cursor: default;
}

.jbw-carousel__dots {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin: 1.25rem 0 0;
	padding: 0;
	list-style: none;
}

.jbw-carousel__dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--jbw-white-25);
	transition: background var(--jbw-dur-fast) var(--jbw-ease), transform var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-carousel__dot[aria-current="true"] {
	background: var(--jbw-gold);
	transform: scale(1.3);
}

/* Media slide */
.jbw-slide-media {
	/*
	 * Positioned so the .screen-reader-text inside it resolves against
	 * this button. Without it the span escapes the carousel's scroll
	 * container and pushes the document sideways on phones.
	 */
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	border-radius: 20px;
	background: none;
	overflow: hidden;
	cursor: zoom-in;
}

/* Slide heights measured off the original: 240 / 170 / 145. */
.jbw-slide-media img {
	width: 100%;
	height: 240px;
	object-fit: cover;
	transition: transform var(--jbw-dur) var(--jbw-ease);
}

@media (max-width: 1024px) {
	.jbw-slide-media img { height: 170px; }
}

@media (max-width: 767px) {
	.jbw-slide-media img { height: 145px; }
}

.jbw-slide-media:hover img {
	transform: scale(1.05);
}

/* Reviews use a wider gap and auto height. */
/* #c44409a */
.jbw-reviews {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-image: linear-gradient(180deg, var(--jbw-ink) 76%, var(--jbw-transparent) 100%);
}

.jbw-carousel--reviews {
	--jbw-carousel-gap: 32px;
}

.jbw-carousel--reviews .jbw-carousel__viewport {
	align-items: stretch;
}

.jbw-review {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	height: 100%;
	text-align: center;
}

.jbw-review__quote {
	margin: 0;
	color: var(--jbw-paper);
	font-size: 1rem;
	font-weight: 400;
	line-height: var(--jbw-leading-tight);
}

.jbw-review__divider {
	width: 80px;
	height: 0;
	border: 0;
	border-top: 2px solid var(--jbw-gold);
	margin: 0 auto;
}

.jbw-review__author {
	margin: 0;
	color: var(--jbw-paper);
	font-family: var(--jbw-font-body);
	font-size: var(--jbw-text-sm);
	font-weight: 600;
	line-height: 1.2em;
	text-transform: uppercase;
}

@media (max-width: 1024px) {
	.jbw-carousel {
		--jbw-carousel-per: var(--jbw-per-t, 2);
		--jbw-carousel-gap: 18px;
	}

	.jbw-carousel--reviews {
		--jbw-carousel-gap: 10px;
	}
}

@media (max-width: 767px) {
	.jbw-carousel {
		--jbw-carousel-per: var(--jbw-per-m, 1);
		--jbw-carousel-gap: 10px;
	}

	.jbw-carousel--reviews {
		--jbw-carousel-gap: 5px;
	}

	.jbw-carousel__arrow {
		width: 2rem;
		height: 2rem;
	}
}

/* ================================================================== *
 * Animal card
 * ================================================================== */

.jbw-animals {
	min-height: 100vmin;
	display: flex;
	align-items: center;
	overflow: hidden;
	isolation: isolate;
	background: var(--jbw-ink);
}

.jbw-animal {
	position: relative;
	text-align: left;
	display: flex;
	flex-direction: column;
	min-height: 18rem;
	padding: 2rem;
	border-radius: 20px;
	background-color: var(--jbw-ink);
	background-position: center;
	background-size: cover;
	overflow: hidden;
	isolation: isolate;
	transition: transform var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-animal::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(180deg, var(--jbw-transparent) 0%, var(--jbw-ink-90) 100%);
	transition: background var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-animal:hover {
	transform: scale(1.02);
}

.jbw-animal:hover::after {
	background: linear-gradient(180deg, var(--jbw-ink-43) 0%, var(--jbw-ink-90) 100%);
}

.jbw-animal__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
}

.jbw-animal__title {
	margin: 0;
	/* Source markup used an h4: body face, bold, sentence case, gold. */
	font-family: var(--jbw-font-body);
	font-size: var(--jbw-h4);
	font-weight: 700;
	text-transform: none;
	line-height: 1.15;
	color: var(--jbw-gold);
}

.jbw-animal__status {
	flex: none;
	max-width: 5em;
	margin: 0;
	color: var(--jbw-paper);
	font-family: var(--jbw-font-display);
	font-size: var(--jbw-h6);
	line-height: 1.1;
	text-align: right;
	text-transform: uppercase;
}

.jbw-animal__count {
	flex: none;
	text-align: center;
	color: var(--jbw-paper);
}

.jbw-animal__count-value {
	display: block;
	font-family: var(--jbw-font-body);
	font-size: var(--jbw-h4);
	font-weight: 700;
	line-height: 1;
}

.jbw-animal__count-label {
	display: block;
	font-size: 0.7rem;
	letter-spacing: 0.06em;
}

.jbw-animal__foot {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
	margin-top: auto;
	padding-top: 2.5rem;
}

.jbw-animal__excerpt {
	margin: 0;
	color: var(--jbw-paper);
	font-size: var(--jbw-text-lg);
	line-height: 1.6;
}

.jbw-animal__cta {
	flex: none;
}

@media (max-width: 767px) {
	.jbw-animal {
		min-height: 15rem;
	}

	.jbw-animal__foot {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* Single animal ---------------------------------------------------- */

.jbw-animal-single__layout {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: calc(var(--jbw-gap) * 2);
	align-items: start;
}

.jbw-animal-single__media img {
	width: 100%;
	border: var(--jbw-border) solid var(--jbw-gold);
	border-radius: var(--jbw-radius-lg);
}

.jbw-animal-single__body {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.jbw-animal-single__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	align-self: flex-start;
	padding: 0.35em 0.9em;
	border: 1px solid var(--jbw-gold);
	border-radius: var(--jbw-radius);
	color: var(--jbw-gold);
	font-size: var(--jbw-text-sm);
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.jbw-animal-single__badge--out {
	border-color: var(--jbw-white-25);
	color: var(--jbw-paper);
	opacity: 0.8;
}

.jbw-animal-single__description {
	color: var(--jbw-paper);
	line-height: 1.8;
}

@media (max-width: 767px) {
	.jbw-animal-single__layout {
		grid-template-columns: 1fr;
		gap: var(--jbw-gap);
	}
}

/* ================================================================== *
 * Modal and lightbox
 * ================================================================== */

.jbw-modal,
.jbw-lightbox {
	width: 100%;
	max-width: 100%;
	max-height: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	overflow: hidden;
}

.jbw-modal::backdrop,
.jbw-lightbox::backdrop {
	background: color-mix(in srgb, var(--jbw-black) 82%, transparent);
	backdrop-filter: blur(4px);
}

.jbw-modal[open],
.jbw-lightbox[open] {
	display: flex;
	align-items: center;
	justify-content: center;
}

.jbw-modal__inner {
	position: relative;
	width: min(44rem, 100%);
	max-height: 90vh;
	padding: 2.5rem;
	border: 1px solid var(--jbw-white-25);
	border-radius: var(--jbw-radius-lg);
	background: var(--jbw-ink);
	overflow-y: auto;
}

.jbw-modal__close,
.jbw-lightbox__close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: none;
	color: var(--jbw-paper);
	z-index: 2;
}

.jbw-modal__close:hover,
.jbw-lightbox__close:hover {
	color: var(--jbw-gold);
}

.jbw-modal__title {
	margin: 0 0 1.5rem;
	color: var(--jbw-gold);
	text-align: center;
}

.jbw-lightbox__close {
	position: fixed;
	top: 1.5rem;
	right: 1.5rem;
}

.jbw-lightbox__figure {
	margin: 0;
	max-width: min(90vw, 1400px);
	max-height: 86vh;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	align-items: center;
}

.jbw-lightbox__img {
	max-width: 100%;
	max-height: 80vh;
	width: auto;
	border-radius: var(--jbw-radius);
	object-fit: contain;
}

.jbw-lightbox__caption {
	color: var(--jbw-paper);
	font-size: var(--jbw-text-sm);
	text-align: center;
}

.jbw-lightbox__caption:empty {
	display: none;
}

.jbw-lightbox__nav {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: none;
	color: var(--jbw-paper);
	z-index: 2;
}

.jbw-lightbox__nav:hover {
	color: var(--jbw-gold);
}

.jbw-lightbox__nav--prev { left: 1rem; }
.jbw-lightbox__nav--next { right: 1rem; }

body.jbw-scroll-locked {
	overflow: hidden;
}

@media (max-width: 767px) {
	.jbw-modal__inner {
		padding: 3rem 1.25rem 1.5rem;
		max-height: 100vh;
		border-radius: 0;
		height: 100%;
	}
}

/* ================================================================== *
 * Gravity Forms
 *
 * Replaces the styling layer The Plus Addons used to apply. Gravity
 * Forms' own markup and scripts are untouched.
 * ================================================================== */

.jbw-form .gform_wrapper {
	margin: 0;
}

.jbw-form .gform_fields {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.jbw-form .gfield {
	min-width: 0;
	margin: 0;
}

.jbw-form .gfield--width-full,
.jbw-form .gfield[class*="textarea"],
.jbw-form .gfield--type-textarea {
	grid-column: 1 / -1;
}

.jbw-form .gfield_label,
.jbw-form .gform_fields legend {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.jbw-form input[type="text"],
.jbw-form input[type="email"],
.jbw-form input[type="tel"],
.jbw-form input[type="number"],
.jbw-form input[type="url"],
.jbw-form input[type="date"],
.jbw-form select,
.jbw-form textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid transparent;
	border-radius: 2px;
	background: var(--jbw-white);
	color: var(--jbw-ink);
	font-family: var(--jbw-font-body);
	font-size: 0.9rem;
	line-height: 1.4;
	transition: border-color var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-form textarea {
	min-height: 7rem;
	resize: vertical;
}

.jbw-form select {
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--jbw-ink) 50%),
		linear-gradient(135deg, var(--jbw-ink) 50%, transparent 50%);
	background-position: calc(100% - 20px) calc(50% + 2px), calc(100% - 15px) calc(50% + 2px);
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	padding-right: 2.5rem;
}

.jbw-form input:focus-visible,
.jbw-form select:focus-visible,
.jbw-form textarea:focus-visible {
	border-color: var(--jbw-gold);
	outline: 2px solid var(--jbw-gold);
	outline-offset: 2px;
}

.jbw-form ::placeholder {
	color: color-mix(in srgb, var(--jbw-ink) 55%, transparent);
	text-transform: uppercase;
}

.jbw-form .gform_footer {
	grid-column: 1 / -1;
	margin: 1.5rem 0 0;
	padding: 0;
}

.jbw-form .gform_button,
.jbw-form input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.7em 2em;
	border: var(--jbw-border) solid var(--jbw-gold);
	border-radius: var(--jbw-radius);
	background: var(--jbw-gold);
	color: var(--jbw-ink);
	font-family: var(--jbw-font-body);
	font-size: var(--jbw-text-button);
	font-weight: 700;
	cursor: pointer;
	transition: background-color var(--jbw-dur-fast) var(--jbw-ease);
}

.jbw-form .gform_button:hover,
.jbw-form input[type="submit"]:hover {
	background: var(--jbw-paper);
}

/*
 * Validation. The kit hid the phone field's inline message and stripped
 * the error container's border; both are reproduced here.
 */
.jbw-form .gform_validation_errors {
	border: none !important;
	box-shadow: none !important;
	background: color-mix(in srgb, var(--jbw-gold) 15%, transparent);
	border-radius: var(--jbw-radius);
	padding: 1rem;
	margin-bottom: 1rem;
}

.jbw-form .gform_validation_errors h2,
.jbw-form .gform_validation_errors .gform_submission_error {
	color: var(--jbw-gold);
	font-size: 1rem;
	margin: 0;
}

.jbw-form .ginput_container_phone .validation_message {
	display: none;
}

.jbw-form .validation_message {
	margin-top: 0.35rem;
	color: var(--jbw-gold);
	font-size: 0.75rem;
	background: none;
	border: 0;
	padding: 0;
}

.jbw-form .gfield_required {
	color: var(--jbw-gold);
}

.jbw-form .gform_confirmation_message {
	padding: 1.5rem;
	border: 1px solid var(--jbw-gold);
	border-radius: var(--jbw-radius);
	color: var(--jbw-paper);
	text-align: center;
}

@media (max-width: 767px) {
	.jbw-form .gform_fields {
		grid-template-columns: 1fr;
	}
}

/* ================================================================== *
 * Prose — WYSIWYG content (Privacy Policy, rich text sections)
 * ================================================================== */

.jbw-prose {
	color: var(--jbw-paper);
	/* The kit's "Body" typography token: nimbus-sans 400 / 1.25em. */
	line-height: var(--jbw-leading-tight);
}

.jbw-prose > * + * {
	margin-top: 1.5em;
}

/* p already carries a bottom margin; without this the gap doubles. */
.jbw-prose p {
	margin-bottom: 0;
}

.jbw-prose h2,
.jbw-prose h3,
.jbw-prose h4 {
	margin-top: 1.8em;
	color: var(--jbw-gold);
}

.jbw-prose h2:first-child,
.jbw-prose h3:first-child {
	margin-top: 0;
}

.jbw-prose a {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.jbw-prose ul,
.jbw-prose ol {
	padding-left: 1.5em;
}

.jbw-prose li + li {
	margin-top: 0.4em;
}

.jbw-prose img {
	border-radius: var(--jbw-radius);
}

.jbw-prose table {
	width: 100%;
	border-collapse: collapse;
}

.jbw-prose th,
.jbw-prose td {
	padding: 0.6rem;
	border: 1px solid var(--jbw-white-25);
	text-align: left;
}

/* ================================================================== *
 * Section headings with a gold lead-in, e.g. "EXPLORE Our Services"
 * ================================================================== */

.jbw-heading {
	margin: 0;
	color: var(--jbw-gold);
}

.jbw-heading .jbw-accent,
.jbw-heading span,
.jbw-heading em {
	color: var(--jbw-paper);
	font-style: normal;
}

.jbw-lede {
	width: 675px;
	max-width: 100%;
	margin: 0;
	color: var(--jbw-paper);
	font-size: var(--jbw-text-lg);
	line-height: var(--jbw-leading-tight);
}

.jbw-center .jbw-lede {
	margin-inline: auto;
	text-align: center;
}

@media (min-width: 768px) {
	.jbw-tabs__content[hidden] {
		display: block;
	}
}

.jbw-container--wide {
	max-width: none;
	padding-inline: 5%;
}

.jbw-gallery-block + .jbw-gallery-block {
	margin-top: 0;
}

.jbw-container--wide .jbw-section__inner,
.jbw-section__inner:has(> .jbw-gallery-block) {
	gap: 0;
}

/* ================================================================== *
 * Inner-page band
 *
 * One 100vmin container holding the heading and the page content on a
 * flat dark background with a gradient overlay, as the Elementor inner
 * pages were built.
 * ================================================================== */

.jbw-page-band {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 100vmin;
	padding-block: calc(var(--jbw-header-height, 11rem) + var(--jbw-gutter-y)) var(--jbw-gutter-y);
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, var(--jbw-black) 100%), var(--jbw-ink);
}

.jbw-page-band > .jbw-container {
	width: 100%;
}