/*
 * Inner pages in the new design: the rental category pages
 * (template-rental.php), the photo gallery, the 404, generic pages and the
 * fallback loop. Loaded after wix-tokens.css and wix-global.css; style.css is
 * not loaded on these pages.
 *
 * Same palette, tokens, buttons and section headings as the home, rentals,
 * about and contact pages. Two families only: Montserrat (display) and
 * Poppins (text). Every class starts with wxi-.
 *
 * Breakpoints: 560 / 640 / 768 / 1024.
 */

/* ---------------------------------------------------------------- base */

body.wx-page {
	color: var(--wx-ink);
	font-family: var(--wx-font-body);
}

.wxi,
.wxi-hero,
.wxi-band {
	font-family: var(--wx-font-body);
	font-size: var(--wx-fs-body);
	line-height: var(--wx-lh-body);
	color: var(--wx-ink);
	-webkit-font-smoothing: antialiased;
}

.wxi *,
.wxi *::before,
.wxi *::after,
.wxi-hero *,
.wxi-hero *::before,
.wxi-hero *::after,
.wxi-band *,
.wxi-band *::before,
.wxi-band *::after,
.wxi-lb,
.wxi-lb * {
	box-sizing: border-box;
}

.wxi {
	overflow-x: clip;
}

.wxi :where(h1, h2, h3, h4, p, ul, ol, figure, blockquote),
.wxi-hero :where(h1, h2, h3, p, ul, ol),
.wxi-band :where(h2, p) {
	margin: 0;
}

.wxi :where(img),
.wxi-hero :where(img) {
	max-width: 100%;
	height: auto;
}

.wxi-sec {
	padding-block: var(--wx-section);
}

.wxi-sec--ice {
	background: var(--wx-ice);
}

.wxi-container--wide {
	max-width: 1440px;
}

.wxi .wx-title,
.wxi-band .wx-title {
	font-weight: 800;
	color: var(--wx-blue);
}

.wxi-h1 {
	font-size: var(--wx-fs-h1);
	line-height: 1.08;
}

.wxi-center {
	margin-top: clamp(1.5rem, 3vw, 2.25rem) !important;
	text-align: center;
}

.wxi-ic {
	flex: none;
	width: 1.15em;
	height: 1.15em;
	fill: currentColor;
}

.wxi-img {
	display: block;
	width: 100%;
	height: 100% !important;
	max-width: none;
	object-fit: cover;
}

.wxi .wx-btn,
.wxi-hero .wx-btn,
.wxi-band .wx-btn {
	text-decoration: none;
}

.wxi .wx-btn--magenta:hover,
.wxi-hero .wx-btn--magenta:hover,
.wxi-band .wx-btn--magenta:hover {
	background: #e600a8;
	color: var(--wx-white);
}

.wxi .wx-btn--blue:hover { color: var(--wx-white); }
.wxi .wx-btn--yellow:hover,
.wxi-hero .wx-btn--yellow:hover,
.wxi-band .wx-btn--yellow:hover { color: var(--wx-ink); }

/* Glass outline for dark photo / blue grounds. */
.wx-btn.wxi-btn--glass {
	border-color: rgba(255, 255, 255, 0.75);
	background: rgba(47, 46, 46, 0.28);
	color: var(--wx-white);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.wx-btn.wxi-btn--glass:hover {
	border-color: var(--wx-white);
	background: rgba(255, 255, 255, 0.16);
	color: var(--wx-white);
}

.wx-btn.wxi-btn--blue-outline {
	border-color: var(--wx-blue);
	color: var(--wx-blue);
}

.wx-btn.wxi-btn--blue-outline:hover {
	background: var(--wx-blue);
	color: var(--wx-white);
}

.wxi-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.75rem;
}

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

.wxi-hero {
	--wxi-shade: 47, 46, 46;
	position: relative;
	isolation: isolate;
	display: flex;
	min-height: clamp(380px, 56vh, 560px);
	overflow: hidden;
	background: var(--wx-ink);
	color: var(--wx-white);
}

.wxi-hero--plain {
	min-height: 0;
	background:
		radial-gradient(120% 140% at 100% 0%, rgba(23, 198, 255, 0.45), rgba(23, 198, 255, 0) 55%),
		var(--wx-blue);
}

.wxi-hero .wxi-hero__bg {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100% !important;
	max-width: none;
	object-fit: cover;
	object-position: 50% 45%;
	animation: wxi-zoom 18s var(--wx-ease) both;
}

@keyframes wxi-zoom {
	from { transform: scale(1.08); }
	to { transform: scale(1); }
}

.wxi-hero:not(.wxi-hero--plain)::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(to top, rgba(var(--wxi-shade), 0.65), rgba(var(--wxi-shade), 0) 40%),
		linear-gradient(to right, rgba(var(--wxi-shade), 0.86) 0%, rgba(var(--wxi-shade), 0.6) 38%, rgba(var(--wxi-shade), 0.08) 72%);
	pointer-events: none;
}

.wxi-hero__in {
	display: flex;
	align-items: center;
	padding-block: clamp(2.25rem, 6vw, 4.5rem);
}

.wxi-hero__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.9rem;
	width: min(100%, 40rem);
}

.wxi-hero__content > * {
	max-width: 100%;
	animation: wxi-rise 0.7s var(--wx-ease) both;
}

.wxi-hero__content > :nth-child(2) { animation-delay: 0.06s; }
.wxi-hero__content > :nth-child(3) { animation-delay: 0.12s; }
.wxi-hero__content > :nth-child(4) { animation-delay: 0.18s; }
.wxi-hero__content > :nth-child(5) { animation-delay: 0.24s; }

@keyframes wxi-rise {
	from { opacity: 0; transform: translateY(14px); }
	to { opacity: 1; transform: none; }
}

.wxi-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem 0.6rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font: 800 0.8rem/1.2 var(--wx-font-display);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wx-yellow);
}

.wxi-crumbs li {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
}

.wxi-crumbs li + li::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--wx-magenta);
}

.wxi-crumbs a {
	display: inline-flex;
	align-items: center;
	min-height: var(--wx-tap);
	color: var(--wx-white);
	text-decoration: none;
}

.wxi-crumbs a:hover {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.wxi-hero__eyebrow {
	color: var(--wx-yellow);
}

.wxi-hero__title {
	font-family: var(--wx-font-display);
	font-size: var(--wx-fs-h1);
	font-weight: 800;
	line-height: 1.06;
	letter-spacing: -0.015em;
	color: var(--wx-white);
	text-wrap: balance;
	text-shadow: 0 2px 18px rgba(0, 0, 0, 0.25);
	overflow-wrap: break-word;
}

.wxi-hero__lead {
	max-width: 36rem;
	font-size: var(--wx-fs-lead);
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.94);
	text-wrap: pretty;
}

.wxi-hero__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin: 0.2rem 0 0.1rem;
	padding: 0;
	list-style: none;
}

.wxi-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	min-height: var(--wx-tap);
	padding: 0.35rem 1.1rem 0.35rem 0.35rem;
	border: 1px solid rgba(255, 255, 255, 0.28);
	border-radius: var(--wx-radius-pill);
	background: rgba(47, 46, 46, 0.4);
	color: var(--wx-white);
	font-size: var(--wx-fs-sm);
	line-height: 1.25;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

.wxi-badge--price {
	padding-left: 1.1rem;
}

.wxi-badge__ic {
	flex: none;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0.5rem;
	border-radius: 50%;
	background: var(--wx-yellow);
	fill: var(--wx-blue);
}

.wxi-badge b {
	font-family: var(--wx-font-display);
	font-weight: 900;
	letter-spacing: 0.06em;
	color: var(--wx-yellow);
}

.wxi-hero__ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	margin-top: 0.35rem;
}

@media (max-width: 559px) {
	.wxi-hero {
		min-height: 0;
	}

	.wxi-hero:not(.wxi-hero--plain)::after {
		background: linear-gradient(to top, rgba(var(--wxi-shade), 0.9) 0%, rgba(var(--wxi-shade), 0.7) 55%, rgba(var(--wxi-shade), 0.35) 100%);
	}

	.wxi-hero__ctas {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
		width: 100%;
	}

	.wxi-hero__ctas .wx-btn {
		width: 100%;
		padding-inline: 0.75em;
	}

	.wxi-hero__ctas .wxi-btn--glass {
		grid-column: 1 / -1;
	}
}

/* ---------------------------------------------------------------- what you get */

.wxi-get {
	padding-bottom: 0;
}

.wxi-get__card {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wx-gap);
	align-items: center;
	padding: clamp(1.5rem, 4vw, 3rem);
	border-radius: var(--wx-radius-lg);
	background:
		radial-gradient(90% 120% at 100% 100%, rgba(23, 198, 255, 0.4), rgba(23, 198, 255, 0) 60%),
		var(--wx-blue);
	box-shadow: var(--wx-shadow-lg);
	color: var(--wx-white);
}

.wxi-get .wx-head {
	margin-bottom: 1rem;
}

.wxi-get .wx-eyebrow {
	color: var(--wx-yellow);
}

.wxi-get .wx-title {
	font-size: var(--wx-fs-h3);
	line-height: 1.2;
	color: var(--wx-white);
}

.wxi-get__art {
	display: flex;
	justify-content: center;
	min-width: 0;
}

.wxi-get__cutout {
	display: block;
	width: min(100%, 420px);
	height: auto;
	filter: drop-shadow(0 24px 30px rgba(0, 0, 0, 0.35));
}

@media (min-width: 768px) {
	.wxi-get--cutout .wxi-get__card {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	}

	.wxi-get--cutout .wxi-get__art {
		margin-block: clamp(-5rem, -6vw, -2rem);
	}
}

@media (max-width: 767px) {
	.wxi-get__art {
		order: -1;
		margin-top: -1rem;
	}

	.wxi-get__cutout {
		width: min(78%, 320px);
	}
}

/* ---------------------------------------------------------------- prose */

.wxi-prose {
	font-size: var(--wx-fs-body);
	line-height: var(--wx-lh-body);
	overflow-wrap: break-word;
}

.wxi-prose > * + * {
	margin-top: 1em;
}

.wxi-prose :where(h2, h3, h4) {
	margin-top: 1.6em;
	font-family: var(--wx-font-display);
	font-weight: 800;
	line-height: 1.2;
	color: var(--wx-blue);
}

.wxi-prose :where(h2) { font-size: var(--wx-fs-h2); }
.wxi-prose :where(h3) { font-size: var(--wx-fs-h3); }
.wxi-prose :where(h4) { font-size: 1.1rem; }
.wxi-prose > :first-child { margin-top: 0; }

.wxi-prose :where(ul, ol) {
	padding-left: 1.3em;
}

.wxi-prose li + li {
	margin-top: 0.35em;
}

.wxi-prose li::marker {
	color: var(--wx-magenta);
}

.wxi-prose a {
	color: var(--wx-blue);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: var(--wx-magenta);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.wxi-prose a:hover {
	color: var(--wx-magenta);
}

.wxi-prose blockquote {
	padding: 0.25rem 0 0.25rem 1.1rem;
	border-left: 4px solid var(--wx-magenta);
	font-style: italic;
}

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

.wxi-prose table {
	display: block;
	width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
}

.wxi-prose :where(th, td) {
	padding: 0.5rem 0.75rem;
	border-bottom: 1px solid rgba(0, 47, 166, 0.15);
	text-align: left;
}

.wxi-prose--on-dark,
.wxi-prose--on-dark a {
	color: var(--wx-white);
}

.wxi-prose--on-dark a {
	text-decoration-color: var(--wx-yellow);
}

.wxi-prose--center {
	max-width: 48rem;
	margin: 0 auto clamp(1.5rem, 3vw, 2.25rem);
	text-align: center;
}

/* ---------------------------------------------------------------- pricing */

.wxi-pricing__terms {
	font-size: var(--wx-fs-body);
}

.wxi-updated {
	display: inline-flex;
	align-items: center;
	min-height: 2rem;
	padding: 0.2rem 0.9rem;
	border-radius: var(--wx-radius-pill);
	background: var(--wx-ice);
	color: var(--wx-blue);
	font-size: var(--wx-fs-sm);
	font-weight: 600;
}

.wxi-products {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wx-gap);
	align-items: stretch;
}

@media (min-width: 640px) {
	.wxi-products:not(.wxi-products--1) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wxi-products--1 {
		max-width: 720px;
		margin-inline: auto;
	}
}

@media (min-width: 1024px) {
	.wxi-products.wxi-products--3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.wxi-products--2 {
		max-width: 960px;
		margin-inline: auto;
	}
}

.wxi-product {
	display: flex;
	flex-direction: column;
	min-width: 0;
	height: 100%;
	overflow: hidden;
	border: 1px solid rgba(0, 47, 166, 0.1);
	border-radius: var(--wx-radius);
	background: var(--wx-white);
	box-shadow: var(--wx-shadow);
	transition: transform var(--wx-dur) var(--wx-ease), box-shadow var(--wx-dur) var(--wx-ease);
}

.wxi-product:hover {
	transform: translateY(-3px);
	box-shadow: var(--wx-shadow-lg);
}

.wxi-product__media {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--wx-ice);
}

.wxi-product__media .wxi-img {
	transition: transform 0.6s var(--wx-ease);
}

.wxi-product:hover .wxi-product__media .wxi-img {
	transform: scale(1.04);
}

.wxi-product__body {
	container-type: inline-size;
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: stretch;
	gap: 0.75rem;
	padding: clamp(1rem, 2.2vw, 1.4rem);
}

.wxi-product__name {
	font-family: var(--wx-font-display);
	font-size: clamp(1.15rem, 1rem + 0.5vw, 1.35rem);
	font-weight: 800;
	line-height: 1.2;
	color: var(--wx-magenta);
}

.wxi-product__note {
	font-size: var(--wx-fs-sm);
	line-height: 1.5;
	color: var(--wx-ink);
}

.wxi-product__btn {
	align-self: flex-start;
	margin-top: auto;
	min-width: 10.5rem;
	letter-spacing: 0.03em;
}

/* The royal-blue price box with the magenta border, as on /rentals/. */
.wxi-box {
	margin: 0.25rem 0 0.5rem;
	padding: 0.4rem 1.1rem;
	list-style: none;
	border: 3px solid var(--wx-magenta);
	border-radius: var(--wx-radius);
	background: var(--wx-blue);
	box-shadow: var(--wx-shadow);
	color: var(--wx-white);
	font-size: 1rem;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	line-height: 1.35;
}

.wxi-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.45rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.16);
	break-inside: avoid;
}

.wxi-row:last-child {
	border-bottom: 0;
}

.wxi-row__k {
	min-width: 0;
}

.wxi-row__n {
	font-size: 0.8em;
	color: var(--wx-yellow);
}

.wxi-row__v {
	flex: none;
	text-align: right;
	white-space: nowrap;
}

.wxi-row--best .wxi-row__v {
	color: var(--wx-yellow);
}

@container (min-width: 34rem) {
	.wxi-box--long {
		column-count: 2;
		column-gap: 2rem;
		column-rule: 1px solid rgba(255, 255, 255, 0.16);
	}
}

.wxi-pricing__ctas {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.75rem;
	margin-top: clamp(1.5rem, 3vw, 2.25rem);
}

/* ---------------------------------------------------------------- delivery */

.wxi-delivery {
	padding-top: 0;
}

.wxi-delivery__card {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	overflow: hidden;
	border-radius: var(--wx-radius-lg);
	background: var(--wx-magenta);
	box-shadow: var(--wx-shadow-lg);
	color: var(--wx-white);
}

.wxi-delivery__media {
	aspect-ratio: 16 / 10;
}

.wxi-delivery__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 0.85rem;
	padding: clamp(1.5rem, 4vw, 3rem);
}

.wxi-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.35rem 0.9rem;
	border-radius: var(--wx-radius-pill);
	background: var(--wx-yellow);
	color: var(--wx-blue);
	font: 900 0.85rem/1.2 var(--wx-font-display);
	letter-spacing: 0.12em;
}

.wxi-delivery__title {
	font-family: var(--wx-font-display);
	font-size: var(--wx-fs-h3);
	font-weight: 800;
	line-height: 1.2;
	color: var(--wx-white);
	text-wrap: balance;
}

.wxi-delivery__text {
	max-width: 36rem;
	color: rgba(255, 255, 255, 0.95);
}

@media (min-width: 768px) {
	.wxi-delivery__card:not(.wxi-delivery__card--text) {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}

	.wxi-delivery__media {
		aspect-ratio: auto;
		height: 100%;
		min-height: 260px;
	}
}

/* ---------------------------------------------------------------- FAQ */

.wxi-faq__in {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wx-gap);
}

.wxi-faq__head {
	margin-bottom: 0;
}

.wxi-faq__head .wx-btn {
	margin-top: 0.5rem;
}

@media (min-width: 1024px) {
	.wxi-faq__in {
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		align-items: start;
		gap: clamp(2rem, 4vw, 3.5rem);
	}

	.wxi-faq__head {
		position: sticky;
		top: calc(var(--wxh-h) + var(--wxh-admin, 0px) + 24px);
	}
}

.wxi-acc {
	display: grid;
	gap: 0.65rem;
}

.wxi-acc__item {
	border: 1px solid rgba(0, 47, 166, 0.1);
	border-radius: var(--wx-radius);
	background: var(--wx-white);
	box-shadow: var(--wx-shadow-sm);
	transition: box-shadow var(--wx-dur) var(--wx-ease);
}

.wxi-acc__item[open] {
	box-shadow: var(--wx-shadow);
}

.wxi-acc__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 3.5rem;
	padding: 0.85rem 1rem 0.85rem 1.25rem;
	border-radius: var(--wx-radius);
	font-weight: 600;
	line-height: 1.4;
	color: var(--wx-blue);
	cursor: pointer;
	list-style: none;
}

.wxi-acc__q::-webkit-details-marker {
	display: none;
}

.wxi-acc__q:hover {
	color: var(--wx-magenta);
}

.wxi-acc__q:focus-visible {
	outline-offset: -3px;
}

.wxi-acc__ic {
	flex: none;
	width: 2rem;
	height: 2rem;
	padding: 0.4rem;
	border-radius: 50%;
	background: var(--wx-ice);
	fill: var(--wx-blue);
	transition: transform var(--wx-dur) var(--wx-ease), background-color var(--wx-dur) var(--wx-ease), fill var(--wx-dur) var(--wx-ease);
}

.wxi-acc__item[open] .wxi-acc__ic {
	transform: rotate(45deg);
	background: var(--wx-magenta);
	fill: var(--wx-white);
}

.wxi-acc__a {
	padding: 0 1.25rem 1.15rem;
	line-height: 1.65;
}

.wxi-acc__item[open] .wxi-acc__a {
	animation: wxi-rise 0.35s var(--wx-ease) both;
}

/* ---------------------------------------------------------------- pairs with */

.wxi-pairs {
	padding-bottom: 0;
}

.wxi-pairs__card {
	padding: clamp(1.25rem, 3vw, 2rem) clamp(1.25rem, 4vw, 2.5rem);
	border-left: 6px solid var(--wx-magenta);
	border-radius: var(--wx-radius);
	background: var(--wx-white);
	box-shadow: var(--wx-shadow);
	font-size: var(--wx-fs-lead);
}

.wxi-pairs .wx-head {
	margin-bottom: 0.6rem;
}

.wxi-pairs .pairs {
	margin: 0;
	line-height: 1.6;
}

/* ---------------------------------------------------------------- category cards */

.wxi-cards__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wx-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 560px) {
	.wxi-cards__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.wxi-cards__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.wxi-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border: 1px solid rgba(0, 47, 166, 0.1);
	border-radius: var(--wx-radius);
	background: var(--wx-white);
	box-shadow: var(--wx-shadow);
	color: var(--wx-ink);
	text-decoration: none;
	transition: transform var(--wx-dur) var(--wx-ease), box-shadow var(--wx-dur) var(--wx-ease);
}

.wxi-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--wx-shadow-lg);
}

.wxi-card__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 11;
	overflow: hidden;
	background: var(--wx-ice);
}

.wxi-card__media .wxi-img {
	transition: transform 0.6s var(--wx-ease);
}

.wxi-card:hover .wxi-card__media .wxi-img {
	transform: scale(1.04);
}

.wxi-card__price {
	position: absolute;
	left: 0.75rem;
	bottom: 0.75rem;
	padding: 0.3rem 0.85rem;
	border-radius: var(--wx-radius-pill);
	background: var(--wx-yellow);
	box-shadow: var(--wx-shadow-sm);
	color: var(--wx-blue);
	font: 800 0.9rem/1.2 var(--wx-font-display);
	letter-spacing: 0.02em;
}

.wxi-card__body {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	padding: 1rem 1.2rem 1.2rem;
}

.wxi-card__name {
	font: 800 1.2rem/1.2 var(--wx-font-display);
	color: var(--wx-blue);
}

.wxi-card:hover .wxi-card__name {
	color: var(--wx-magenta);
}

.wxi-card__meta {
	font-size: var(--wx-fs-sm);
	line-height: 1.45;
	color: #555;
}

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

.wxi-photos {
	background: linear-gradient(var(--wx-white), var(--wx-ice));
}

.wxi-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(0.5rem, 1.2vw, 0.9rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 768px) {
	.wxi-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.wxi-grid--full {
	grid-auto-flow: dense;
}

@media (min-width: 560px) {
	.wxi-grid--full {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.wxi-grid--full {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (min-width: 1300px) {
	.wxi-grid--full {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}

.wxi-grid__cell {
	min-width: 0;
	aspect-ratio: 1;
}

@media (min-width: 560px) {
	.wxi-grid__cell--big {
		grid-column: span 2;
		grid-row: span 2;
	}

	.wxi-grid__cell--wide {
		grid-column: span 2;
		aspect-ratio: auto;
	}
}

.wxi-grid__open {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: var(--wx-radius-sm);
	background: var(--wx-ice);
	box-shadow: var(--wx-shadow-sm);
	cursor: zoom-in;
}

.wxi-grid__open .wxi-img {
	transition: transform 0.6s var(--wx-ease), filter var(--wx-dur) var(--wx-ease);
}

.wxi-grid__open:hover .wxi-img {
	transform: scale(1.05);
	filter: saturate(1.1);
}

.wxi-grid__open:focus-visible {
	outline-offset: 2px;
}

/* ---------------------------------------------------------------- lightbox */

.wxi-lb-open,
.wxi-lb-open body {
	overflow: hidden;
}

.wxi-lb {
	position: fixed;
	inset: 0;
	z-index: 100001;
	display: grid;
	place-items: center;
	padding: clamp(3.5rem, 6vw, 4.5rem) clamp(0.5rem, 5vw, 5rem);
	background: rgba(20, 20, 20, 0.92);
	animation: wxi-fade 0.25s ease both;
}

@keyframes wxi-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

.wxi-lb__fig {
	display: grid;
	justify-items: center;
	gap: 0.6rem;
	width: 100%;
	height: 100%;
	margin: 0;
	place-content: center;
}

.wxi-lb__img {
	display: block;
	max-width: 100%;
	max-height: calc(100vh - 9rem);
	max-height: calc(100dvh - 9rem);
	border-radius: var(--wx-radius-sm);
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
	object-fit: contain;
}

.wxi-lb__count {
	color: rgba(255, 255, 255, 0.85);
	font: 600 0.9rem/1 var(--wx-font-body);
}

.wxi-lb__btn {
	position: absolute;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--wx-yellow);
	color: var(--wx-blue);
	cursor: pointer;
	box-shadow: var(--wx-shadow);
	transition: transform var(--wx-dur) var(--wx-ease);
}

.wxi-lb__btn:hover {
	transform: scale(1.08);
}

.wxi-lb__btn:focus-visible {
	outline: 3px solid var(--wx-magenta);
	outline-offset: 3px;
}

.wxi-lb__btn svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.wxi-lb__close { top: 0.75rem; right: 0.75rem; }
.wxi-lb__prev { top: 50%; left: 0.75rem; transform: translateY(-50%); }
.wxi-lb__next { top: 50%; right: 0.75rem; transform: translateY(-50%); }
.wxi-lb__prev:hover { transform: translateY(-50%) scale(1.08); }
.wxi-lb__next:hover { transform: translateY(-50%) scale(1.08); }

@media (max-width: 559px) {
	.wxi-lb__prev,
	.wxi-lb__next {
		top: auto;
		bottom: 0.75rem;
		transform: none;
	}

	.wxi-lb__prev:hover,
	.wxi-lb__next:hover {
		transform: none;
	}
}

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

.wxi-band {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding-block: var(--wx-section);
	background:
		radial-gradient(70% 120% at 0% 100%, rgba(23, 198, 255, 0.45), rgba(23, 198, 255, 0) 60%),
		radial-gradient(60% 90% at 100% 0%, rgba(255, 0, 187, 0.35), rgba(255, 0, 187, 0) 60%),
		var(--wx-blue);
	color: var(--wx-white);
}

.wxi-band__in {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wx-gap);
	align-items: center;
}

.wxi-band__head {
	margin-bottom: 0;
}

.wxi-band .wx-title {
	color: var(--wx-white);
}

.wxi-band__accent {
	display: block;
	color: var(--wx-yellow);
}

.wxi-band__ctas {
	display: grid;
	gap: 0.65rem;
}

.wxi-band__ctas .wx-btn {
	width: 100%;
}

@media (min-width: 560px) and (max-width: 1023px) {
	.wxi-band__ctas {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wxi-band__ctas .wx-btn:first-child {
		grid-column: 1 / -1;
	}
}

@media (min-width: 1024px) {
	.wxi-band__in {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		gap: clamp(2rem, 5vw, 4rem);
	}
}

/* ---------------------------------------------------------------- gallery page */

.wxi-page-head .wx-lead {
	color: var(--wx-ink);
}

.wxi-empty {
	max-width: 42rem;
	margin: 0 auto !important;
	padding: 1.25rem 1.5rem;
	border-radius: var(--wx-radius);
	background: var(--wx-ice);
	color: var(--wx-blue);
	font-size: var(--wx-fs-lead);
	text-align: center;
}

.wxi-gallery + .wxi-cards {
	padding-top: 0;
}

/* ---------------------------------------------------------------- 404 */

.wxi-404 {
	background:
		radial-gradient(80% 100% at 50% 0%, var(--wx-ice), rgba(204, 243, 255, 0) 70%);
}

.wxi-404__card {
	position: relative;
	display: grid;
	justify-items: center;
	gap: 0.5rem;
	padding: clamp(1.5rem, 5vw, 3rem) clamp(1rem, 4vw, 3rem);
	border-radius: var(--wx-radius-lg);
	background: var(--wx-white);
	box-shadow: var(--wx-shadow-lg);
	text-align: center;
}

.wxi-404__code {
	font: 900 clamp(4.5rem, 3rem + 8vw, 9rem)/0.9 var(--wx-font-display);
	letter-spacing: -0.04em;
	color: var(--wx-magenta);
	text-shadow: 6px 6px 0 var(--wx-yellow);
}

.wxi-404 .wx-head {
	margin-bottom: 1rem;
}

.wxi-404 + .wxi-cards {
	padding-top: 0;
}

/* ---------------------------------------------------------------- generic page */

.wxi-content__grid--art {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wx-gap);
	align-items: center;
}

.wxi-content__art {
	display: flex;
	justify-content: center;
}

@media (min-width: 768px) {
	.wxi-content__grid--art {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	}
}

.wxi-content + .wxi-faq {
	margin-top: 0;
}

/* ---------------------------------------------------------------- index */

.wxi-posts {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
	gap: var(--wx-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.wxi-post {
	height: 100%;
	padding: 1.25rem 1.4rem;
	border: 1px solid rgba(0, 47, 166, 0.1);
	border-radius: var(--wx-radius);
	background: var(--wx-white);
	box-shadow: var(--wx-shadow);
}

.wxi-post__title {
	margin-bottom: 0.5rem !important;
	font: 800 var(--wx-fs-h3)/1.2 var(--wx-font-display);
}

.wxi-post__title a {
	color: var(--wx-blue);
	text-decoration: none;
}

.wxi-post__title a:hover {
	color: var(--wx-magenta);
}

.wxi-post__excerpt {
	font-size: var(--wx-fs-sm);
}

.wxi-pagination {
	margin-top: var(--wx-gap);
	text-align: center;
}

.wxi-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem;
}

.wxi-pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: var(--wx-tap);
	min-height: var(--wx-tap);
	padding: 0 0.8rem;
	border-radius: var(--wx-radius-pill);
	background: var(--wx-ice);
	color: var(--wx-blue);
	font-weight: 600;
	text-decoration: none;
}

.wxi-pagination .page-numbers.current {
	background: var(--wx-blue);
	color: var(--wx-white);
}

.wxi-pagination .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---------------------------------------------------------------- reveal */

.wxi-motion :is(.wxi-product, .wxi-card, .wxi-acc__item, .wxi-grid__cell, .wxi-get__card, .wxi-delivery__card):not(.is-in) {
	opacity: 0;
	transform: translateY(18px);
}

.wxi-motion :is(.wxi-product, .wxi-card, .wxi-acc__item, .wxi-grid__cell, .wxi-get__card, .wxi-delivery__card).is-in {
	transition: opacity 0.6s var(--wx-ease), transform 0.6s var(--wx-ease), box-shadow var(--wx-dur) var(--wx-ease);
}

@media (prefers-reduced-motion: reduce) {
	.wxi-hero .wxi-hero__bg,
	.wxi-hero__content > * {
		animation: none;
	}
}