/*
 * WAIKI Core — the components the shop keeps when the theme changes.
 *
 * Deliberately small: it gives the wishlist hearts, product cards, filters,
 * checkout steps and drawers a correct, on-brand starting look under any theme.
 * Page layout and the finer styling come from the page builder on top of this.
 * Only loaded when the custom WAIKI theme is NOT active.
 */

:root {
	--waiki-ink: #2E2924;
	--waiki-text: #4B433C;
	--waiki-champagne: #C8AD7D;
	--waiki-taupe: #A89B8B;
	--waiki-sand: #DCC9B2;
	--waiki-ivory: #F6F2EA;
	--waiki-hairline: rgba(200, 173, 125, 0.82);
	--waiki-cols: 4;
}

/* ------------------------------------------------- brand fonts (self-hosted)

   The two brand faces, served from this plugin so no request leaves for
   Google and the typography survives any theme change. Both are variable
   fonts: one file covers every weight the design uses.
   ------------------------------------------------------------------------ */

@font-face {
	font-family: "Cinzel";
	src: url("../fonts/cinzel-variable.woff2") format("woff2-variations"),
		url("../fonts/cinzel-variable.woff2") format("woff2");
	font-weight: 400 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Montserrat";
	src: url("../fonts/montserrat-variable.woff2") format("woff2-variations"),
		url("../fonts/montserrat-variable.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

/*
 * Divi's own base type is Open Sans at #666 with blue links. Replace it with
 * the brand faces so anything the client adds later starts on-brand, while
 * each module's own Divi settings still win over these.
 */
body {
	font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	background-color: var(--waiki-ivory);
	color: var(--waiki-text);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "Cinzel", "Times New Roman", serif;
	color: var(--waiki-ink);
}

/* The hidden attribute must beat any component display rule. */
[hidden] {
	display: none !important;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

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

.waiki-btn {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 16px 32px;
	border: 1px solid transparent;
	border-radius: 0;
	font-size: 12px;
	font-weight: 600;
	line-height: 20.4px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.waiki-btn--primary {
	border-color: var(--waiki-text);
	background: var(--waiki-text);
	color: var(--waiki-ivory);
}

.waiki-btn--primary:hover {
	border-color: var(--waiki-champagne);
	background: var(--waiki-champagne);
	color: var(--waiki-text);
}

.waiki-btn--ghost {
	border-color: var(--waiki-champagne);
	background: transparent;
	color: var(--waiki-text);
}

.waiki-btn--ghost:hover {
	background: var(--waiki-champagne);
}

.waiki-btn--block {
	width: 100%;
}

/* -------------------------------------------------------- product cards */

.waiki-pgrid,
.waiki-listing__grid {
	display: grid;
	grid-template-columns: repeat(var(--waiki-cols), minmax(0, 1fr));
	gap: 28px 36px;
}

.waiki-pcard {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	padding: 11px;
	border: 1px solid var(--waiki-hairline);
	background: transparent;
}

.waiki-pcard__media {
	position: relative;
}

.waiki-pcard__media img,
.waiki-pcard__media .waiki-ph {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 268 / 320;
	object-fit: cover;
}

.waiki-badge {
	position: absolute;
	top: 14px;
	left: 12px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 90px;
	height: 24px;
	border: 1px solid var(--waiki-champagne);
	border-radius: 999px;
	background: var(--waiki-ivory);
	font-size: 8px;
	font-weight: 600;
	letter-spacing: 0.125em;
	text-transform: uppercase;
	color: var(--waiki-text);
}

.waiki-wish {
	position: absolute;
	top: 14px;
	right: 16px;
	width: 15px;
	height: 15px;
	padding: 0;
	border: 0;
	background: none;
	line-height: 0;
	color: var(--waiki-text);
	cursor: pointer;
	transition: color 0.2s ease, transform 0.15s ease;
}

.waiki-wish svg {
	display: block;
	width: 15px;
	height: 15px;
	stroke-width: 2.3;
}

.waiki-wish:hover {
	color: var(--waiki-champagne);
}

.waiki-wish.is-saved,
.waiki-wish.is-saved svg {
	color: var(--waiki-champagne);
	fill: currentColor;
}

.waiki-wish:active {
	transform: scale(0.9);
}

.waiki-btn.waiki-wishtoggle.is-saved {
	border-color: var(--waiki-champagne);
	background: var(--waiki-champagne);
	color: var(--waiki-text);
}

.waiki-pcard__title {
	margin: 20px 0 0;
	font-size: 16px;
	font-weight: 400;
	line-height: 22px;
	color: var(--waiki-ink);
}

.waiki-pcard__title a {
	color: inherit;
	text-decoration: none;
}

.waiki-pcard__cat {
	margin: 4px 0 0;
	font-size: 10px;
	font-weight: 600;
	line-height: 14px;
	letter-spacing: 0.11em;
	color: var(--waiki-taupe);
}

.waiki-pcard__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 11px 0 16px;
}

.waiki-pcard__price {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.028em;
	color: var(--waiki-text);
}

.waiki-pcard .waiki-btn--block {
	height: 24px;
	margin-top: auto;
	padding: 0;
	font-size: 8px;
	font-weight: 500;
	line-height: 24px;
	letter-spacing: 0.16em;
}

.waiki-swatches {
	display: flex;
	gap: 8px;
}

.waiki-swatches i {
	box-sizing: border-box;
	width: 12px;
	height: 12px;
	border: 0.5px solid var(--waiki-champagne);
	border-radius: 50%;
}

.waiki-ph {
	display: grid;
	place-items: center;
	width: 100%;
	background: repeating-linear-gradient(135deg, #e9e0d2, #e9e0d2 12px, #e4d9c8 12px, #e4d9c8 24px);
	border: 1px solid rgba(200, 173, 125, 0.45);
}

.waiki-ph span {
	padding: 0 12px;
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-align: center;
	color: rgba(75, 67, 60, 0.55);
}

@media (max-width: 1100px) {
	.waiki-pgrid,
	.waiki-listing__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/*
 * Two products across stays comfortable down to a small phone, and matches
 * the wishlist. One per screen only on the narrowest handsets.
 */
@media (max-width: 600px) {
	.waiki-pgrid,
	.waiki-listing__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px 14px;
	}
}

@media (max-width: 379px) {
	.waiki-pgrid,
	.waiki-listing__grid,
	.waiki-wishgrid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ------------------------------------------------------------- filters */

.waiki-filters {
	display: block;
	box-sizing: border-box;
	padding: 24px;
	border: 1px solid var(--waiki-hairline);
}

.waiki-filters__title {
	margin: 0 0 20px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--waiki-text);
}

.waiki-filters__head {
	display: none;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 24px;
}

.waiki-filter {
	margin: 0 0 20px;
	padding: 0 0 18px;
	border: 0;
	border-bottom: 1px solid rgba(200, 173, 125, 0.4);
}

.waiki-filter legend {
	margin-bottom: 10px;
	padding: 0;
	font-size: 13px;
	font-weight: 600;
	color: var(--waiki-ink);
}

.waiki-filter label {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 8px;
	font-size: 13px;
	color: var(--waiki-text);
	cursor: pointer;
}

.waiki-filters__clear {
	margin: 16px 0 0;
	text-align: center;
	font-size: 13px;
}

.waiki-filters__clear a {
	color: var(--waiki-taupe);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* --------------------------------------------------- checkout progress */

.waiki-steps {
	display: flex;
	flex-wrap: wrap;
	gap: 28px;
	margin: 0 0 32px;
	padding: 0;
	list-style: none;
}

.waiki-step {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--waiki-taupe);
}

.waiki-step__dot {
	width: 8px;
	height: 8px;
	border: 1px solid currentColor;
	border-radius: 50%;
}

.waiki-step.is-done {
	color: var(--waiki-champagne);
}

.waiki-step.is-done .waiki-step__dot,
.waiki-step.is-current .waiki-step__dot {
	background: currentColor;
}

.waiki-step.is-current {
	color: var(--waiki-ink);
}

/* ------------------------------------------------------------- drawers */

html.waiki-locked,
html.waiki-locked body {
	overflow: hidden;
}

.waiki-scrim {
	position: fixed;
	inset: 0;
	z-index: 90;
	background: rgba(75, 67, 60, 0.45);
}

.waiki-drawer {
	position: fixed;
	z-index: 100;
	overflow-y: auto;
	opacity: 0;
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.waiki-drawer.is-open {
	opacity: 1;
}

/* ------------------------------------------------------------- notices */

.waiki-notice {
	margin: 0 0 24px;
	padding: 14px 18px;
	border-left: 2px solid var(--waiki-champagne);
	background: rgba(200, 173, 125, 0.12);
	font-size: 14px;
	color: var(--waiki-text);
}

.waiki-notice--error {
	border-left-color: #9A3B32;
	background: rgba(154, 59, 50, 0.08);
}

/* The honeypot field is for robots only. */
.waiki-hp {
	position: absolute !important;
	left: -9999px;
}

/* ------------------------------------------------- header and footer bits */

/* These sit inside Divi sections, so only the inner pieces are styled here:
   the surrounding colours, spacing and logo are Divi's to control. */

.waiki-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 50px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.waiki-nav li {
	position: relative;
}

.waiki-nav a {
	display: block;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: 0.05em;
	text-decoration: none;
	white-space: nowrap;
	color: var(--waiki-text);
	transition: color 0.2s ease;
}

.waiki-nav a:hover {
	color: var(--waiki-champagne);
}

/* The page being viewed: heavier, darker, underlined, with a diamond. */
.waiki-nav a[aria-current="page"] {
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--waiki-ink);
}

.waiki-nav a[aria-current="page"]::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 23.9px;
	height: 1px;
	background: #CCB487;
}

.waiki-nav .is-current::after {
	content: "";
	position: absolute;
	left: calc(100% + 11.75px);
	top: 15.4px;
	box-sizing: border-box;
	width: 8.5px;
	height: 8.5px;
	border: 1px solid var(--waiki-champagne);
	transform: rotate(45deg);
}

.waiki-utils {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 27px;
	height: 24px;
}

.waiki-utils a,
.waiki-utils button {
	display: inline-flex;
	align-items: center;
	padding: 0;
	border: 0;
	background: none;
	color: var(--waiki-text);
	cursor: pointer;
	transition: color 0.2s ease;
}

.waiki-utils a:hover,
.waiki-utils button:hover {
	color: var(--waiki-champagne);
}

.waiki-utils svg {
	display: block;
}

.waiki-utils__heart svg {
	width: 20px;
	height: 20px;
	stroke-width: 2.04;
}

.waiki-bag {
	position: relative;
}

.waiki-bag__count {
	position: absolute;
	top: 1.6px;
	left: calc(100% + 6.5px);
	font-size: 9px;
	font-weight: 600;
	line-height: 9px;
	color: var(--waiki-champagne);
}

/* footer link columns */

.waiki-footer__list {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.waiki-footer__list a {
	font-size: 14px;
	text-decoration: none;
	color: rgba(246, 242, 234, 0.88);
	transition: color 0.2s ease;
}

.waiki-footer__list a:hover {
	color: var(--waiki-champagne);
}

/* newsletter */

.waiki-newsletter {
	display: grid;
	gap: 16px;
}

.waiki-newsletter input {
	box-sizing: border-box;
	width: 100%;
	padding: 14px 16px;
	border: 1px solid rgba(246, 242, 234, 0.35);
	border-radius: 0;
	background: transparent;
	font-size: 14px;
	color: var(--waiki-ivory);
}

.waiki-newsletter input::placeholder {
	color: rgba(246, 242, 234, 0.55);
}

.waiki-newsletter button {
	justify-self: start;
	padding: 14px 28px;
	border: 0;
	background: var(--waiki-champagne);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--waiki-text);
	cursor: pointer;
	transition: background 0.2s ease;
}

.waiki-newsletter button:hover {
	background: var(--waiki-sand);
}

/* ------------------------------------------------- living inside Divi */

/*
 * Divi styles lists and links inside its layout wrappers with selectors like
 * ".et-l--header ul", which outrank a plain class. These repeat our own rules
 * at the same weight so our components keep their own look inside Divi.
 */
.et-l .waiki-nav ul,
.et-l .waiki-footer__list,
.et-l .waiki-steps,
.et-l .waiki-search__pills {
	list-style: none;
	padding: 0;
	margin: 0;
	line-height: normal;
}

.et-l .waiki-nav li,
.et-l .waiki-footer__list li,
.et-l .waiki-steps li {
	margin: 0;
	list-style: none;
}

.et-l .waiki-nav a {
	color: var(--waiki-text);
}

.et-l .waiki-nav a[aria-current="page"] {
	color: var(--waiki-ink);
}

.et-l .waiki-footer__list a {
	color: rgba(246, 242, 234, 0.88);
}

.et-l .waiki-nav a:hover,
.et-l .waiki-footer__list a:hover {
	color: var(--waiki-champagne);
}

.et-l .waiki-utils a,
.et-l .waiki-utils button {
	color: var(--waiki-text);
}

.et-l .waiki-utils a:hover,
.et-l .waiki-utils button:hover {
	color: var(--waiki-champagne);
}

.et-l .waiki-pcard__title a {
	color: var(--waiki-ink);
}

.et-l .waiki-pcard__price,
.et-l .waiki-notes p {
	color: var(--waiki-text);
}

/* Divi's code module wraps our markup; it must not add spacing of its own. */
.et-l .et_pb_code_inner > .waiki-nav,
.et-l .et_pb_code_inner > .waiki-utils {
	line-height: normal;
}

/* Header row: logo left, menu centred, icons right, all on one line. */
.et-l--header .et_pb_row {
	display: flex;
	align-items: center;
}

.et-l--header .et_pb_column {
	display: flex;
	align-items: center;
	margin-bottom: 0;
}

.et-l--header .et_pb_column:first-child {
	justify-content: flex-start;
}

.et-l--header .et_pb_column:nth-child(2) {
	justify-content: center;
}

.et-l--header .et_pb_column:last-child {
	justify-content: flex-end;
}

.et-l--header .et_pb_module {
	margin-bottom: 0;
}

.et-l .waiki-nav ul {
	flex-wrap: nowrap;
	gap: 40px;
}

@media (max-width: 1240px) {
	.et-l .waiki-nav ul {
		gap: 26px;
	}
}

/* ------------------------------------------- homepage pieces under Divi

   Two small components the page builder has no module for: the hero's
   three feature marks, and the champagne "Explore" link with its rule.
   Everything else on the homepage is a real, editable Divi module.
   ------------------------------------------------------------------- */

.waiki-hero-features {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 16px 36px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.et-l .waiki-hero-features,
.et-l .waiki-hero-features li {
	list-style: none;
	padding: 0;
	line-height: inherit;
}

.waiki-hero-features li {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 17px;
	font-family: "Montserrat", sans-serif;
	font-size: 11px;
	font-weight: 600;
	line-height: 14.5px;
	letter-spacing: 0.025em;
	color: var(--waiki-text);
}

.waiki-hero-features span {
	max-width: 110px;
}

.waiki-hero-features svg {
	flex: none;
	color: var(--waiki-champagne);
}

/* The underlined-by-a-rule link used on the world and kids cards. */
.waiki-link,
.et-l .waiki-link {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	font-family: "Montserrat", sans-serif;
	font-size: 10px;
	font-weight: 600;
	line-height: 14px;
	letter-spacing: 0.13em;
	text-decoration: none;
	color: var(--waiki-champagne);
}

.waiki-link::after {
	content: "";
	width: 44px;
	height: 1px;
	background: rgba(200, 173, 125, 0.6);
	transform: translateY(1.1px);
}

.et-l .waiki-link:hover {
	color: var(--waiki-text);
}

/* Card headings on the homepage link to their category. */
.et-l .et_pb_heading a {
	color: inherit;
	text-decoration: none;
}

/* The product grid shortcode supplies its own card styling; keep Divi's
   paragraph padding from pushing the rows apart. */
.et-l .waiki-pgrid p {
	padding-bottom: 0;
}

/* Divi pads the bottom of every heading by 10px; our modules carry their
   own measured spacing, so take that away inside the builder's layouts. */
.et-l .et_pb_module_header,
.et-l .et_pb_heading h1,
.et-l .et_pb_heading h2,
.et-l .et_pb_heading h3 {
	padding-bottom: 0;
}

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

   Divi forces `padding: .3em 1em !important` on any button without an icon,
   and grows the padding on hover to make room for one. Both override the
   padding set in the module, so the brand's button size is pinned here.
   Every Divi button on the site uses this one size by design.
   ------------------------------------------------------------------- */

body #page-container .et-l .et_pb_button,
body #page-container .et-l .et_pb_button:hover {
	padding: 16px 32px !important;
	border-width: 1px !important;
	border-radius: 0 !important;
	line-height: 20.4px !important;
	transition: background-color 0.18s ease, color 0.18s ease,
		border-color 0.18s ease;
}

body #page-container .et-l .et_pb_button::after,
body #page-container .et-l .et_pb_button::before {
	display: none !important;
}


/* Divi paints the page and the content area white; the brand's page colour
   is warm ivory. */
html body {
	background-color: var(--waiki-ivory);
}

body #main-content,
body .et-l--post,
body .et_builder_inner_content {
	background-color: transparent;
}

/* A button is a flex child of its column, so it stretches to the full width
   unless told to hug its own text. */
.et-l .et_pb_button_module_wrapper {
	align-self: flex-start;
}

/* Divi 5 sizes nested columns from their content. Share the row equally,
   which is what every nested row on these pages wants. */
.et-l .et_pb_row_inner > .et_pb_column_inner {
	flex: 1 1 0;
	min-width: 0;
}

/* Images are flex children of their column. Without this they shrink to fit
   the text beside them, so a card's picture would change size with its copy. */
.et-l .et_pb_image {
	flex: 0 0 auto;
}

/* ----------------------------------------- header and footer, small screens

   The layouts carry their own tablet and phone sizes; these two rules only
   do what a Divi setting cannot: move the menu below the logo and icons.
   ------------------------------------------------------------------- */

@media (max-width: 980px) {
	.et-l--header .et_pb_row > [class*="et_flex_column"]:nth-child(1) {
		order: 1;
	}

	.et-l--header .et_pb_row > [class*="et_flex_column"]:nth-child(3) {
		order: 2;
	}

	.et-l--header .et_pb_row > [class*="et_flex_column"]:nth-child(2) {
		order: 3;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.et-l--header .et_pb_row > [class*="et_flex_column"]:nth-child(2)::-webkit-scrollbar {
		display: none;
	}

	.et-l .waiki-nav ul {
		gap: 22px;
		justify-content: center;
		white-space: nowrap;
	}

	.et-l--header .waiki-utils {
		gap: 18px;
	}
}

@media (max-width: 420px) {
	.et-l .waiki-nav ul {
		gap: 15px;
	}

	.et-l .waiki-nav a {
		font-size: 10px;
		letter-spacing: 0.08em;
	}
}

/* Divi and WooCommerce both paint form fields white. The footer sign-up is
   an outlined field on the dark footer, so it has to say so louder. */
.et-l .waiki-newsletter input[type="email"],
.et-l .waiki-newsletter input[type="email"]:focus {
	box-sizing: border-box;
	width: 100%;
	padding: 14px 16px;
	border: 1px solid rgba(246, 242, 234, 0.35);
	border-radius: 0;
	background-color: transparent;
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	color: var(--waiki-ivory);
}

.et-l .waiki-newsletter input[type="email"]:focus {
	border-color: var(--waiki-champagne);
	outline: none;
}

.et-l .waiki-newsletter input[type="email"]::placeholder {
	color: rgba(246, 242, 234, 0.55);
}

/* =============================================== product listing page

   Measured from the Figma frame "03_Product_Listing_Desktop": a 240px
   filter panel, a 40px gutter and a three-across grid, under a breadcrumb,
   a 42px Cinzel heading and the piece count.
   ==================================================================== */

.waiki-listing {
	box-sizing: border-box;
}

.waiki-crumbs {
	margin: 0;
	font-size: 11px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: 0.02em;
	color: var(--waiki-taupe);
}

.et-l .waiki-crumbs a {
	color: var(--waiki-taupe);
	text-decoration: none;
}

.et-l .waiki-crumbs a:hover {
	color: var(--waiki-champagne);
}

.waiki-crumbs span {
	margin: 0 6px;
}

.waiki-listing__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 24px;
	flex-wrap: wrap;
}

.et-l .waiki-listing__title {
	margin: 20.5px 0 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 50px;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

.waiki-listing__count {
	margin: 11.35px 0 0;
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: 0.02em;
	color: var(--waiki-taupe);
}

.waiki-listing__controls {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 28px;
}

.waiki-sort {
	display: block;
}

.et-l .waiki-sort select {
	box-sizing: border-box;
	min-width: 177px;
	padding: 12px 18px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background: transparent;
	font-family: "Montserrat", sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.06em;
	color: var(--waiki-text);
	cursor: pointer;
}

.waiki-listing__body {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 40px;
	align-items: start;
	margin-top: 58.15px;
}

.waiki-listing__grid {
	display: grid;
	grid-template-columns: repeat(var(--waiki-cols, 3), minmax(0, 1fr));
	gap: 34px 38px;
}

/* The design draws listing cards straight on the page, with no card border. */
.waiki-pgrid--plain .waiki-pcard,
.waiki-listing__grid .waiki-pcard {
	padding: 0;
	border: 0;
	background: none;
}

.waiki-listing__grid .waiki-badge {
	top: 14px;
	left: 12px;
}

.waiki-listing__empty {
	padding: 64px 0;
	text-align: center;
}

.et-l .waiki-listing__empty h2 {
	margin: 0 0 12px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 28px;
	font-weight: 700;
	color: var(--waiki-ink);
}

.waiki-listing__empty p {
	margin: 0 0 24px;
	font-size: 14px;
	color: var(--waiki-text);
}

.et-l .navigation.pagination {
	display: flex;
	justify-content: center;
	gap: 16px;
	margin-top: 64px;
	font-size: 13px;
}

.et-l .navigation.pagination a,
.et-l .navigation.pagination .current {
	padding: 8px 14px;
	border: 1px solid var(--waiki-hairline);
	text-decoration: none;
	color: var(--waiki-text);
}

.et-l .navigation.pagination .current {
	border-color: var(--waiki-text);
	background: var(--waiki-text);
	color: var(--waiki-ivory);
}

.navigation.pagination .screen-reader-text {
	display: none;
}

/* The filter panel keeps the width the design gives it. */
.waiki-listing__body > .waiki-filters {
	width: 100%;
}

.waiki-filters__trigger,
.waiki-filters__apply {
	display: none;
}

.et-l .waiki-filter input[type="checkbox"] {
	width: 14px;
	height: 14px;
	accent-color: var(--waiki-champagne);
}

/* ------------------------------------------ category landing: subcategories */

.waiki-subcats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 39px;
}

.et-l .waiki-subcat {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	box-sizing: border-box;
	min-height: 229px;
	padding: 22px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 2px;
	background: linear-gradient(90deg, #F0E7DA 0%, #E0CFBB 100%);
	text-decoration: none;
	overflow: hidden;
	position: relative;
}

/*
 * A wash over the foot of the picture, so the category name reads as clearly
 * as it does on the design's flat gradient.
 */
.waiki-subcat::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(246, 242, 234, 0) 30%,
		rgba(246, 242, 234, 0.55) 58%, rgba(246, 242, 234, 0.94) 86%);
	pointer-events: none;
}

.waiki-subcat__media {
	position: absolute;
	inset: 0;
	display: block;
}

.waiki-subcat__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.92;
	transition: transform 0.4s ease, opacity 0.3s ease;
}

.et-l .waiki-subcat:hover .waiki-subcat__media img {
	transform: scale(1.04);
}

.waiki-subcat__body {
	position: relative;
	z-index: 1;
	display: block;
}

.waiki-subcat__name {
	display: block;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: 0.01em;
	color: var(--waiki-ink);
}

.waiki-subcat__count {
	display: block;
	margin-top: 6px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.08em;
	color: var(--waiki-text);
}

/* ------------------------------------------- listing, narrower screens */

@media (max-width: 1100px) {
	.waiki-listing__body {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.waiki-listing__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.waiki-subcats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/*
	 * There is no room for a column of filters beside the products, and a
	 * tall panel above them would push the products off the screen. Below
	 * this width the panel becomes a drawer behind a Filters button.
	 */
	.waiki-filters__trigger,
	.waiki-filters__apply {
		display: inline-flex;
	}

	.waiki-filters__head {
		display: flex;
	}

	.waiki-filters__title--desktop {
		display: none;
	}

	.waiki-listing__body > .waiki-filters {
		display: none;
		position: fixed;
		z-index: 100;
		top: 0;
		right: 0;
		bottom: 0;
		width: min(360px, 88vw);
		overflow-y: auto;
		padding: 24px;
		border: 0;
		border-left: 1px solid var(--waiki-hairline);
		background: var(--waiki-ivory);
		box-shadow: -12px 0 32px rgba(46, 41, 36, 0.12);
	}

	.waiki-listing__body > .waiki-filters.is-open {
		display: block;
	}

	.et-l .waiki-filters__close {
		padding: 0;
		border: 0;
		background: none;
		font-family: "Montserrat", sans-serif;
		font-size: 11px;
		font-weight: 600;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		color: var(--waiki-taupe);
		cursor: pointer;
	}

	.waiki-filters__apply {
		display: flex;
		margin-top: 24px;
	}
}

@media (max-width: 600px) {
	/* The product grid stays two across; see the rule near the card styles. */
	.waiki-subcats {
		grid-template-columns: minmax(0, 1fr);
	}

	.et-l .waiki-listing__title {
		font-size: 32px;
		line-height: 40px;
	}

	.waiki-listing__controls {
		margin-top: 24px;
	}
}

/* ================================================== product page

   Measured from the Figma frames "04_Fashion_Product_Detail" and
   "05_Fragrance_Product_Detail". The two share one layout: the blocks that
   do not belong to the product being shown render nothing, and the sections
   they would have filled are hidden here.
   ================================================================= */

/* A section marked for one kind of product only. */
body:not(.waiki-pdp-scent) .waiki-only-scent,
body:not(.waiki-pdp-fashion) .waiki-only-fashion {
	display: none !important;
}

/* And a section whose block had nothing to show for this product. */
.waiki-pdp-optional:not(:has(.waiki-notespanel)):not(:has(.waiki-ritual)):not(:has(.waiki-pgrid)) {
	display: none !important;
}

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

.waiki-pdp__frame {
	display: block;
}

.et-l .waiki-pdp__image,
.waiki-pdp__frame .waiki-ph {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 638 / 839;
	object-fit: cover;
	border-radius: 2px;
}

body.waiki-pdp-scent .waiki-pdp__image,
body.waiki-pdp-scent .waiki-pdp__frame .waiki-ph {
	aspect-ratio: 4 / 5;
}

.waiki-pdp__thumbs {
	display: flex;
	gap: 16px;
	margin: 32px 0 0;
	padding: 0;
	list-style: none;
}

.et-l .waiki-pdp__thumbs {
	padding: 0;
	line-height: inherit;
}

.waiki-pdp__thumbs li {
	flex: 0 0 120px;
	list-style: none;
}

.waiki-pdp__thumbs img {
	display: block;
	width: 120px;
	height: 160px;
	object-fit: cover;
	border-radius: 2px;
}

/* ------------------------------------------------------- buying column */

.et-l .waiki-pdp__title {
	margin: 31.5px 0 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 38px;
	font-weight: 700;
	line-height: 46px;
	letter-spacing: 0.004em;
	color: var(--waiki-ink);
}

.waiki-pdp__accents {
	margin: 24px 0 0;
	font-size: 11px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--waiki-champagne);
}

.waiki-pdp__price {
	margin: 22.5px 0 0;
	font-family: "Montserrat", sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 28px;
	letter-spacing: 0.01em;
	color: var(--waiki-ink);
}

.waiki-pdp__price del {
	margin-right: 10px;
	opacity: 0.5;
	font-weight: 400;
}

.waiki-pdp__price ins {
	text-decoration: none;
}

.waiki-pdp__lead {
	margin: 27px 0 0;
	max-width: 480px;
}

.et-l .waiki-pdp__lead p {
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height: 24px;
	letter-spacing: 0.0075em;
	color: var(--waiki-text);
}

/* ---------------------------------------------------------- add to bag */

.waiki-pdp__cart {
	margin-top: 66.5px;
}

.et-l .waiki-pdp__cart .variations {
	width: 100%;
	margin: 0 0 15px;
	border: 0;
	border-collapse: collapse;
}

.et-l .waiki-pdp__cart .variations tr,
.et-l .waiki-pdp__cart .variations th,
.et-l .waiki-pdp__cart .variations td {
	display: block;
	padding: 0;
	border: 0;
	text-align: left;
}

.et-l .waiki-pdp__cart .variations .label label {
	display: block;
	margin: 0 0 15px;
	font-family: "Montserrat", sans-serif;
	font-size: 11px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--waiki-text);
}

/* The select stays in the page for WooCommerce, hidden once the buttons
   have been built from it. */
.waiki-swatchset + select {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
}

.waiki-swatchset {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	margin: 0 0 24px;
}

.et-l .waiki-swatch {
	min-width: 43px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid var(--waiki-champagne);
	border-radius: 0;
	background: transparent;
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.04em;
	color: var(--waiki-text);
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.et-l .waiki-swatch:hover {
	background: rgba(200, 173, 125, 0.25);
}

.et-l .waiki-swatch[aria-pressed="true"] {
	border-color: var(--waiki-text);
	background: var(--waiki-text);
	color: var(--waiki-ivory);
}

.et-l .waiki-swatch.is-unavailable {
	opacity: 0.35;
	cursor: not-allowed;
	text-decoration: line-through;
}

.et-l .waiki-pdp__cart .reset_variations {
	display: inline-block;
	margin-bottom: 16px;
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--waiki-taupe);
}

.et-l .waiki-pdp__cart form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	margin: 0;
}

.et-l .waiki-pdp__cart .quantity {
	display: inline-flex;
	margin: 0;
}

.et-l .waiki-pdp__cart .quantity input {
	box-sizing: border-box;
	width: 72px;
	height: 52px;
	padding: 0 10px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background: transparent;
	font-family: "Montserrat", sans-serif;
	text-align: center;
	color: var(--waiki-text);
}

.et-l .waiki-pdp__cart button.single_add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-width: 250px;
	height: 52px;
	padding: 0 32px;
	border: 1px solid var(--waiki-text);
	border-radius: 0;
	background: var(--waiki-text);
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--waiki-ivory);
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.et-l .waiki-pdp__cart button.single_add_to_cart_button:hover {
	border-color: var(--waiki-champagne);
	background: var(--waiki-champagne);
	color: var(--waiki-text);
}

/*
 * Before a size is chosen WooCommerce marks the button unavailable. Dim it
 * enough to read as "not yet", without washing the brand colour out to grey.
 */
.et-l .waiki-pdp__cart button.single_add_to_cart_button.disabled {
	opacity: 0.75;
	cursor: not-allowed;
}

/* The Wishlist / Find Your Scent button beside Add To Bag. */
.et-l .waiki-pdp__cart .waiki-pdp__secondary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-width: 164px;
	height: 52px;
	padding: 0 24px;
	border: 1px solid var(--waiki-champagne);
	border-radius: 0;
	background: transparent;
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--waiki-text);
	cursor: pointer;
}

.et-l .waiki-pdp__cart .waiki-pdp__secondary:hover {
	background: rgba(200, 173, 125, 0.22);
}

.waiki-pdp__cart .woocommerce-variation-price {
	flex: 0 0 100%;
	margin: 0 0 8px;
	font-size: 16px;
	font-weight: 600;
	color: var(--waiki-ink);
}

.waiki-pdp__cart .stock {
	flex: 0 0 100%;
	margin: 0;
	font-size: 12px;
	color: var(--waiki-taupe);
}

/* -------------------------------------------------------- accordions */

.waiki-accordions {
	margin-top: 29px;
	border-top: 1px solid var(--waiki-hairline);
}

.waiki-accordions details {
	border-bottom: 1px solid var(--waiki-hairline);
}

.et-l .waiki-accordions summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20px 0;
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: var(--waiki-text);
	cursor: pointer;
	list-style: none;
}

.waiki-accordions summary::-webkit-details-marker {
	display: none;
}

.waiki-accordions summary::after {
	content: "+";
	font-size: 18px;
	font-weight: 400;
	color: var(--waiki-taupe);
}

.waiki-accordions details[open] summary::after {
	content: "\2212";
}

.et-l .waiki-accordions details > div {
	padding-bottom: 22px;
}

.et-l .waiki-accordions details > div p {
	margin: 0;
	padding: 0;
	font-size: 13px;
	line-height: 21px;
	color: rgba(75, 67, 60, 0.85);
}

/* ------------------------------------------------ fragrance notes */

.waiki-notespanel {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 32px;
	box-sizing: border-box;
	min-height: 259px;
	padding: 56px 40px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 2px;
	text-align: center;
}

.et-l .waiki-notespanel h2 {
	margin: 0 0 14px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 23px;
	font-weight: 700;
	line-height: 30px;
	color: var(--waiki-ink);
}

.et-l .waiki-notespanel p {
	margin: 0;
	padding: 0;
	font-size: 13px;
	line-height: 20px;
	color: rgba(75, 67, 60, 0.82);
}

.et-l .waiki-ritual__title {
	margin: 12px 0 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 40px;
	letter-spacing: 0.005em;
	color: var(--waiki-ink);
}

.et-l .waiki-ritual__lead {
	margin: 56px 0 0;
	max-width: 560px;
	font-size: 14px;
	line-height: 22px;
	color: var(--waiki-text);
}

/* ------------------------------------------- product page, narrower */

@media (max-width: 980px) {
	.waiki-pdp__cart {
		margin-top: 40px;
	}

	.et-l .waiki-pdp__title {
		font-size: 30px;
		line-height: 38px;
		margin-top: 20px;
	}

	.waiki-notespanel {
		gap: 24px;
		min-height: 0;
		padding: 36px 24px;
	}
}

@media (max-width: 600px) {
	.waiki-notespanel {
		grid-template-columns: minmax(0, 1fr);
	}

	.et-l .waiki-pdp__cart form.cart {
		gap: 10px;
	}

	.et-l .waiki-pdp__cart button.single_add_to_cart_button {
		min-width: 0;
		flex: 1 1 100%;
	}

	.et-l .waiki-pdp__cart .waiki-pdp__secondary {
		flex: 1 1 100%;
	}
}

/* ------------------------------------- product page, beating the defaults

   Divi ships its own WooCommerce stylesheet, whose `.woocommerce
   button.button.alt` carries the same weight as ours and loads after it.
   These repeat the brand's buying controls with one more class so they win.
   ------------------------------------------------------------------- */

body.woocommerce .et-l .waiki-pdp__cart button.single_add_to_cart_button,
body.woocommerce-page .et-l .waiki-pdp__cart button.single_add_to_cart_button {
	box-sizing: border-box;
	min-width: 250px;
	height: 52px;
	padding: 0 32px;
	border: 1px solid var(--waiki-text);
	border-radius: 0;
	background-color: var(--waiki-text);
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--waiki-ivory);
}

body.woocommerce .et-l .waiki-pdp__cart button.single_add_to_cart_button:hover,
body.woocommerce-page .et-l .waiki-pdp__cart button.single_add_to_cart_button:hover {
	border-color: var(--waiki-champagne);
	background-color: var(--waiki-champagne);
	color: var(--waiki-text);
}

body .et-l .waiki-pdp__cart .quantity input.qty {
	box-sizing: border-box;
	width: 72px;
	height: 52px;
	padding: 0 10px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background-color: transparent;
	font-family: "Montserrat", sans-serif;
	font-size: 13px;
	text-align: center;
	color: var(--waiki-text);
}

/* Divi paints every link its own blue; brand copy keeps the brand colour. */
.et-l .waiki-pdp__lead a,
.et-l .waiki-accordions a,
.et-l .waiki-ritual a {
	color: var(--waiki-champagne);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* The small champagne label above a heading, wherever a block writes one. */
.et-l .waiki-eyebrow {
	margin: 0;
	padding: 0;
	font-family: "Montserrat", sans-serif;
	font-size: 11px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.21em;
	text-transform: uppercase;
	color: var(--waiki-champagne);
}

/* The notes sit in the middle of their panel, as the design draws them. */
.waiki-notespanel {
	align-content: center;
}

/*
 * A fragrance is shown on a wash of colour the width of the window, which
 * is what separates it from the plain ivory of a clothing page.
 */
body.waiki-pdp-scent .waiki-pdp-section {
	background: linear-gradient(90deg, #B8B7A6 0%, #D6D2C4 14%, #F3EDE4 35%,
		#F6F1E9 55%, #E9DECF 76%, #DCC9B3 100%);
}

@media (min-width: 981px) {
	body.waiki-pdp-scent .waiki-pdp-section {
		min-height: 911px;
	}
}

/* The bottle sits on a wash of colour, so it needs a little lift. */
body.waiki-pdp-scent .waiki-pdp__image {
	box-shadow: 0 18px 46px rgba(46, 41, 36, 0.14);
}

/* --------------------------------- add to bag, trimming Woo's own spacing */

/* Our own champagne label carries the spacing; the eyebrow rule above must
   not flatten the gap the design puts above it. */
.et-l .waiki-pdp__accents {
	margin: 24px 0 0;
}

/* Divi's table styles pad every cell. */
body .et-l .waiki-pdp__cart table.variations td,
body .et-l .waiki-pdp__cart table.variations th {
	padding: 0;
}

body .et-l .waiki-pdp__cart form.variations_form {
	margin-bottom: 0;
}

/*
 * WooCommerce keeps its "Clear" link in the layout and only makes it
 * invisible, which leaves a gap the design does not have. The swatches make
 * it unnecessary: choosing another size replaces the first.
 */
body .et-l .waiki-pdp__cart .reset_variations {
	display: none;
}

/* ------------------------------- add to bag: the last of Woo's own spacing

   Divi's WooCommerce rules reach these through #content, and an id outranks
   any number of classes, so these repeat with one of Divi's own ids.
   ------------------------------------------------------------------- */

body #page-container .et-l .waiki-pdp__cart form.cart,
body #page-container .et-l .waiki-pdp__cart form.variations_form {
	margin-bottom: 0;
}

body #page-container .et-l .waiki-pdp__cart .variations td,
body #page-container .et-l .waiki-pdp__cart .variations th {
	padding: 0;
}

/*
 * Only the row holding quantity and the buttons is a flex row. Making the
 * whole form one would put the same gap under the size picker.
 */
body #page-container .et-l .waiki-pdp__cart form.variations_form {
	display: block;
}

body #page-container .et-l .waiki-pdp__cart .woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
}

body #page-container .et-l .waiki-pdp__cart table.variations {
	margin-bottom: 0;
}

/* ============================================ bag, checkout, confirmation

   Measured from the Figma frames "06_Shopping_Bag", "07_Checkout_Delivery",
   "08_Checkout_Payment" and "09_Order_Confirmation". WooCommerce draws these
   pages; these rules give its markup the brand's shape.
   ===================================================================== */

/* ------------------------------------------------------------------ bag */

.et-l .waiki-bag__heading,
.et-l .waiki-checkout__heading {
	margin: 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 50px;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

.waiki-bagpage {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 420px;
	gap: 81px;
	align-items: start;
	margin-top: 41.5px;
}

.waiki-bag__items {
	box-sizing: border-box;
	padding: 32px 40px;
	border-radius: 2px;
	background: #FFFFFF;
	box-shadow: 0 10px 30px rgba(46, 41, 36, 0.05);
}

.waiki-bagitem {
	display: grid;
	grid-template-columns: 135px minmax(0, 1fr) auto;
	column-gap: 32px;
	align-items: start;
	padding: 20px 0 24px;
	border-bottom: 1px solid var(--waiki-hairline);
}

.waiki-bagitem:last-of-type {
	border-bottom: 0;
}

.waiki-bagitem__media img,
.waiki-bagitem__media .waiki-ph {
	display: block;
	width: 135px;
	height: 180px;
	object-fit: cover;
	border-radius: 2px;
}

.et-l .waiki-bagitem__title {
	margin: 4px 0 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 18px;
	font-weight: 500;
	line-height: 24px;
	color: var(--waiki-ink);
}

.et-l .waiki-bagitem__title a {
	color: inherit;
	text-decoration: none;
}

.waiki-bagitem__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
	margin: 10px 0 0;
	font-size: 12px;
	letter-spacing: 0.04em;
	color: var(--waiki-taupe);
}

.waiki-bagitem__qty {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.et-l .waiki-bagitem__qty input {
	box-sizing: border-box;
	width: 56px;
	height: 34px;
	padding: 0 6px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background: transparent;
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	text-align: center;
	color: var(--waiki-text);
}

.et-l .waiki-bagitem__remove {
	display: inline-block;
	margin-top: 26px;
	font-size: 12px;
	letter-spacing: 0.04em;
	text-decoration: none;
	color: var(--waiki-taupe);
	border-bottom: 1px solid rgba(168, 155, 139, 0.5);
}

.et-l .waiki-bagitem__remove:hover {
	color: var(--waiki-text);
	border-bottom-color: var(--waiki-text);
}

.waiki-bagitem__price {
	margin-top: 6px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.02em;
	white-space: nowrap;
	color: var(--waiki-ink);
}

.waiki-bag__actions {
	margin-top: 24px;
	text-align: right;
}

.et-l .waiki-bag__actions .waiki-btn {
	height: 42px;
	padding: 0 24px;
	font-size: 11px;
}

/* ------------------------------------------------------- order summary */

.waiki-bag__summary {
	box-sizing: border-box;
	padding: 32px;
	border: 1px solid var(--waiki-champagne);
	border-radius: 2px;
	background: var(--waiki-ivory);
}

.et-l .waiki-summary__heading {
	margin: 0 0 28px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 28px;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

.waiki-summary__row,
.waiki-summary__total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-bottom: 14px;
	font-size: 13px;
	color: var(--waiki-text);
}

.waiki-summary__row > span:first-child {
	color: var(--waiki-taupe);
}

.waiki-summary__total {
	margin: 22px 0 0;
	padding-top: 20px;
	border-top: 1px solid var(--waiki-hairline);
	font-size: 16px;
	font-weight: 600;
	color: var(--waiki-ink);
}

.waiki-summary__action {
	margin-top: 26px;
}

.et-l .waiki-summary__action .checkout-button,
.et-l .waiki-summary__action a.button {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	height: 52px;
	padding: 0 24px;
	border: 1px solid var(--waiki-text);
	border-radius: 0;
	background-color: var(--waiki-text);
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--waiki-ivory);
}

.et-l .waiki-summary__action .checkout-button:hover,
.et-l .waiki-summary__action a.button:hover {
	border-color: var(--waiki-champagne);
	background-color: var(--waiki-champagne);
	color: var(--waiki-text);
}

.waiki-summary__note {
	margin: 18px 0 0;
	font-size: 11px;
	line-height: 17px;
	color: var(--waiki-taupe);
}

/* -------------------------------------------------------------- checkout */

.waiki-checkout__heading {
	margin-bottom: 22px;
}

.woocommerce-checkout .woocommerce {
	display: block;
}

.woocommerce-checkout form.checkout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 434px;
	column-gap: 86px;
	row-gap: 0;
	align-items: start;
	margin-top: 36px;
}

.woocommerce-checkout #customer_details {
	box-sizing: border-box;
	padding: 36px 40px 40px;
	border-radius: 2px;
	background: #FFFFFF;
	box-shadow: 0 10px 30px rgba(46, 41, 36, 0.05);
}

.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
	grid-column: 2;
}

.et-l .woocommerce-checkout #order_review_heading {
	margin: 0 0 20px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 28px;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

.woocommerce-checkout #order_review {
	box-sizing: border-box;
	padding: 28px 32px;
	border: 1px solid var(--waiki-champagne);
	border-radius: 2px;
	background: var(--waiki-ivory);
}

.et-l .woocommerce-checkout #customer_details h3,
.et-l .woocommerce-checkout .woocommerce-billing-fields h3,
.et-l .woocommerce-checkout .woocommerce-shipping-fields h3 {
	margin: 0 0 24px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 24px;
	font-weight: 700;
	line-height: 30px;
	color: var(--waiki-ink);
}

/* Form fields: the design's filled, borderless boxes. */
.et-l .woocommerce-checkout .form-row {
	margin: 0 0 16px;
	padding: 0;
}

.et-l .woocommerce-checkout .form-row label {
	display: block;
	margin-bottom: 8px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--waiki-taupe);
}

.et-l .woocommerce-checkout .form-row label.checkbox {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: var(--waiki-text);
}

body #page-container .et-l .woocommerce-checkout .input-text,
body #page-container .et-l .woocommerce-checkout select,
body #page-container .et-l .woocommerce-checkout .select2-container .select2-selection {
	box-sizing: border-box;
	width: 100%;
	height: 48px;
	padding: 0 16px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background-color: var(--waiki-ivory);
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	color: var(--waiki-text);
}

body #page-container .et-l .woocommerce-checkout textarea.input-text {
	height: auto;
	min-height: 96px;
	padding: 14px 16px;
	line-height: 22px;
}

body #page-container .et-l .woocommerce-checkout .input-text:focus,
body #page-container .et-l .woocommerce-checkout select:focus {
	border-color: var(--waiki-champagne);
	outline: none;
}

.et-l .woocommerce-checkout .input-text::placeholder {
	color: var(--waiki-taupe);
}

/* Delivery method and payment lists. */
.et-l .woocommerce-checkout #shipping_method,
.et-l .woocommerce-checkout .wc_payment_methods {
	margin: 0;
	padding: 0;
	list-style: none;
}

.et-l .woocommerce-checkout #shipping_method li,
.et-l .woocommerce-checkout .wc_payment_methods li {
	margin: 0 0 12px;
	padding: 16px 20px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 2px;
	list-style: none;
	font-size: 14px;
	color: var(--waiki-text);
}

.et-l .woocommerce-checkout .wc_payment_methods li label {
	display: inline;
	margin: 0;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	color: var(--waiki-text);
}

.et-l .woocommerce-checkout .payment_box {
	margin: 12px 0 0;
	padding: 0;
	background: none;
	font-size: 13px;
	color: var(--waiki-taupe);
}

.et-l .woocommerce-checkout .payment_box::before {
	display: none;
}

/* Order review table. */
.et-l .woocommerce-checkout-review-order-table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
}

.et-l .woocommerce-checkout-review-order-table thead {
	display: none;
}

.et-l .woocommerce-checkout-review-order-table td,
.et-l .woocommerce-checkout-review-order-table th {
	padding: 10px 0;
	border: 0;
	border-top: 0;
	font-size: 13px;
	color: var(--waiki-text);
}

.et-l .woocommerce-checkout-review-order-table .cart_item td {
	border-bottom: 1px solid var(--waiki-hairline);
}

.et-l .woocommerce-checkout-review-order-table .product-name {
	font-size: 13px;
	color: var(--waiki-ink);
}

.et-l .woocommerce-checkout-review-order-table .product-total {
	text-align: right;
	white-space: nowrap;
}

.et-l .woocommerce-checkout-review-order-table tfoot th {
	font-weight: 500;
	text-align: left;
	color: var(--waiki-taupe);
}

.et-l .woocommerce-checkout-review-order-table tfoot td {
	text-align: right;
}

.et-l .woocommerce-checkout-review-order-table tfoot .order-total th,
.et-l .woocommerce-checkout-review-order-table tfoot .order-total td {
	padding-top: 18px;
	border-top: 1px solid var(--waiki-hairline);
	font-size: 16px;
	font-weight: 600;
	color: var(--waiki-ink);
}

body #page-container .et-l .woocommerce-checkout #place_order,
body #page-container .et-l .woocommerce-checkout .waiki-checkout__nav button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-width: 250px;
	height: 52px;
	padding: 0 32px;
	border: 1px solid var(--waiki-text);
	border-radius: 0;
	background-color: var(--waiki-text);
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--waiki-ivory);
	cursor: pointer;
}

body #page-container .et-l .woocommerce-checkout #place_order:hover {
	border-color: var(--waiki-champagne);
	background-color: var(--waiki-champagne);
	color: var(--waiki-text);
}

.waiki-checkout__nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	margin-top: 32px;
}

.et-l .waiki-checkout__back {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--waiki-taupe);
	cursor: pointer;
}

.et-l .waiki-checkout__back:hover {
	color: var(--waiki-text);
}

/* ---------------------------------------------------------- confirmation */

.waiki-confirm {
	max-width: 760px;
	margin-inline: auto;
	text-align: center;
}

.waiki-confirm__mark {
	display: block;
	width: 230px;
	height: auto;
	margin: 0 auto 10px;
}

.et-l .waiki-confirm__title {
	margin: 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 50px;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

.et-l .waiki-confirm__lead {
	max-width: 600px;
	margin: 20px auto 0;
	font-size: 14px;
	line-height: 24px;
	color: var(--waiki-text);
}

.waiki-confirm__lead strong {
	font-weight: 600;
	color: var(--waiki-ink);
}

.waiki-confirm__actions {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
	margin: 32px 0 0;
}

.waiki-confirm__panel {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px 48px;
	box-sizing: border-box;
	margin-top: 56px;
	padding: 40px 48px;
	border-radius: 2px;
	background: #FFFFFF;
	box-shadow: 0 10px 30px rgba(46, 41, 36, 0.05);
	text-align: left;
}

.et-l .waiki-confirm__panel p {
	margin: 8px 0 0;
	padding: 0;
	font-size: 14px;
	line-height: 22px;
	color: var(--waiki-ink);
}

.waiki-recommend {
	margin-top: 96px;
}

.et-l .waiki-recommend .waiki-section__title {
	margin: 12px 0 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 40px;
	letter-spacing: 0.005em;
	color: var(--waiki-ink);
}

.et-l .waiki-recommend .waiki-section__lead {
	margin: 20px 0 40px;
	max-width: 560px;
	font-size: 14px;
	line-height: 22px;
	color: var(--waiki-text);
}

/* ------------------------------------------ buying flow, smaller screens */

@media (max-width: 1100px) {
	.waiki-bagpage,
	.woocommerce-checkout form.checkout {
		grid-template-columns: minmax(0, 1fr);
		gap: 40px;
	}

	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout #order_review {
		grid-column: 1;
	}
}

@media (max-width: 680px) {
	.et-l .waiki-bag__heading,
	.et-l .waiki-checkout__heading,
	.et-l .waiki-confirm__title {
		font-size: 30px;
		line-height: 38px;
	}

	.waiki-bag__items {
		padding: 20px;
	}

	.waiki-bagitem {
		grid-template-columns: 96px minmax(0, 1fr);
		column-gap: 16px;
	}

	.waiki-bagitem__media img,
	.waiki-bagitem__media .waiki-ph {
		width: 96px;
		height: 128px;
	}

	.waiki-bagitem__price {
		grid-column: 2;
		margin-top: 12px;
	}

	.woocommerce-checkout #customer_details {
		padding: 24px 20px 28px;
	}

	.waiki-confirm__panel {
		grid-template-columns: minmax(0, 1fr);
		padding: 28px 24px;
	}

	.waiki-confirm__mark {
		width: 160px;
	}
}

/* An empty bag: the same page, with nothing in it yet. */
.waiki-bag__empty {
	margin-top: 48px;
	padding: 72px 40px 80px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 2px;
	background: #FFFFFF;
	text-align: center;
}

.et-l .waiki-bag__empty-lead {
	max-width: 420px;
	margin: 0 auto;
	font-size: 14px;
	line-height: 24px;
	color: var(--waiki-text);
}

.waiki-bag__empty-actions {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
	margin: 32px 0 0;
}

/* ----------------------------------------- WooCommerce notices and buttons

   Divi paints Woo's notices and buttons its own blue. These restate them in
   the brand's colours, with one of Divi's ids so they carry enough weight.
   ------------------------------------------------------------------- */

body #page-container .et-l .woocommerce-message,
body #page-container .et-l .woocommerce-info,
body #page-container .et-l .woocommerce-error,
body #page-container .et-l .woocommerce-noreviews {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	margin: 0 0 24px;
	padding: 16px 20px;
	border: 0;
	border-left: 2px solid var(--waiki-champagne);
	border-radius: 0;
	background-color: rgba(200, 173, 125, 0.12);
	font-family: "Montserrat", sans-serif;
	font-size: 13px;
	line-height: 20px;
	color: var(--waiki-text);
}

body #page-container .et-l .woocommerce-error {
	border-left-color: #9A3B32;
	background-color: rgba(154, 59, 50, 0.08);
}

body #page-container .et-l .woocommerce-message::before,
body #page-container .et-l .woocommerce-info::before,
body #page-container .et-l .woocommerce-error::before {
	display: none;
}

body #page-container .et-l .woocommerce-message .button,
body #page-container .et-l .woocommerce-info .button,
body #page-container .et-l .woocommerce-error .button {
	display: inline-flex;
	align-items: center;
	box-sizing: border-box;
	height: 36px;
	padding: 0 18px;
	border: 1px solid var(--waiki-champagne);
	border-radius: 0;
	background-color: transparent;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--waiki-text);
}

body #page-container .et-l .waiki-summary__action .checkout-button,
body #page-container .et-l .waiki-summary__action a.button {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	height: 52px;
	padding: 0 24px;
	border: 1px solid var(--waiki-text);
	border-radius: 0;
	background-color: var(--waiki-text);
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--waiki-ivory);
}

body #page-container .et-l .waiki-summary__action .checkout-button:hover,
body #page-container .et-l .waiki-summary__action a.button:hover {
	border-color: var(--waiki-champagne);
	background-color: var(--waiki-champagne);
	color: var(--waiki-text);
}

body #page-container .et-l .waiki-bagitem .quantity input.qty {
	box-sizing: border-box;
	width: 56px;
	height: 34px;
	padding: 0 6px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background-color: transparent;
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	text-align: center;
	color: var(--waiki-text);
}

/* The quantity box belongs on the same line as the size. */
.waiki-bagitem .quantity {
	display: inline-flex;
	margin: 0;
}

/*
 * The divider sits between items. :last-of-type cannot be used because the
 * actions row is also a div, so it would claim the exemption instead.
 */
.waiki-bagitem {
	border-bottom: 0;
}

.waiki-bagitem + .waiki-bagitem {
	border-top: 1px solid var(--waiki-hairline);
}

/* ------------------------------------------------- checkout, laid out

   WooCommerce stacks its checkout as: customer details (itself two
   columns), a review heading, the review panel, and payment inside the
   review. checkout.js moves payment out; these rules put what is left
   where the design wants it.
   ------------------------------------------------------------------- */

.woocommerce-checkout form.checkout > #customer_details,
.woocommerce-checkout form.checkout > .waiki-checkout__nav,
.woocommerce-checkout form.checkout > .waiki-payment-slot,
.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup {
	grid-column: 1;
}

.woocommerce-checkout form.checkout > #order_review {
	grid-column: 2;
	grid-row: 1 / -1;
	align-self: start;
}

/* The panel carries its own title, so Woo's heading above it is a double. */
.woocommerce-checkout #order_review_heading {
	display: none;
}

/* One column of fields, not Woo's two halves. */
.woocommerce-checkout #customer_details.col2-set {
	display: block;
}

.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	float: none;
	width: 100%;
	padding: 0;
}

.woocommerce-checkout #customer_details .col-2 {
	margin-top: 36px;
}

/* First and last name share a line, everything else spans it. */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 16px;
}

.woocommerce-checkout .form-row-wide,
.woocommerce-checkout .form-row.notes {
	grid-column: 1 / -1;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle {
	grid-column: 1 / -1;
}

/* The payment step sits under the delivery details, in the same column. */
.waiki-payment-slot {
	margin-top: 8px;
}

.et-l .waiki-payment-slot #payment {
	padding: 0;
	border-radius: 2px;
	background: transparent;
}

.et-l .waiki-payment-slot #payment .form-row.place-order {
	margin: 24px 0 0;
	padding: 0;
}

/* Checkout progress: the four marks above the form. */
.waiki-steps {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.et-l .waiki-steps,
.et-l .waiki-steps li {
	padding: 0;
	list-style: none;
	line-height: inherit;
}

.waiki-step {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--waiki-taupe);
}

.waiki-step__dot {
	flex: none;
	width: 14px;
	height: 14px;
	border: 1px solid var(--waiki-champagne);
	border-radius: 50%;
	background: transparent;
}

/* The line drawn from one mark to the next. */
.waiki-step:not(:last-child)::after {
	content: "";
	flex: none;
	width: 36px;
	height: 1px;
	margin: 0 18px;
	background: rgba(200, 173, 125, 0.55);
}

.waiki-step.is-done .waiki-step__dot,
.waiki-step.is-current .waiki-step__dot {
	background: var(--waiki-champagne);
}

.waiki-step.is-current {
	color: var(--waiki-ink);
}

.waiki-step.is-done {
	color: var(--waiki-text);
}

/* --------------------------------- the delivery card and its buttons

   The form, the payment methods and the buttons read as one white card,
   so each piece carries the same background and side padding.
   ------------------------------------------------------------------- */

.woocommerce-checkout form.checkout > #customer_details {
	padding-bottom: 4px;
	border-radius: 2px 2px 0 0;
	box-shadow: none;
}

.woocommerce-checkout form.checkout > .waiki-payment-slot {
	margin: 0;
	padding: 0 40px;
	background: #FFFFFF;
}

.woocommerce-checkout form.checkout > .waiki-checkout__nav {
	margin: 0;
	padding: 28px 40px 40px;
	border-radius: 0 0 2px 2px;
	background: #FFFFFF;
	box-shadow: 0 10px 30px rgba(46, 41, 36, 0.05);
}

/* Woo's own sub-headings inside the form are smaller than the card title. */
.et-l .woocommerce-checkout #customer_details .col-2 h3,
.et-l .woocommerce-checkout .woocommerce-additional-fields h3 {
	font-size: 18px;
	line-height: 24px;
}

/* Required markers in the palette rather than Woo's red. */
.et-l .woocommerce-checkout .required,
.et-l .woocommerce-checkout abbr.required {
	border: 0;
	text-decoration: none;
	color: var(--waiki-champagne);
}

/* The coupon bar above the form. */
body #page-container .et-l .woocommerce-form-coupon-toggle .woocommerce-info {
	justify-content: flex-start;
	color: var(--waiki-text);
}

body #page-container .et-l .woocommerce-form-coupon-toggle a,
body #page-container .et-l .woocommerce-info a {
	color: var(--waiki-champagne);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Woo's red asterisk, in the palette. */
body #page-container .et-l .woocommerce form .form-row .required,
body #page-container .et-l .woocommerce-checkout abbr.required,
body #page-container .et-l .woocommerce-checkout .required {
	border: 0;
	text-decoration: none;
	color: var(--waiki-champagne);
}

/* Divi prints Woo's notice text in white; on a pale bar that is invisible. */
body #page-container .et-l .woocommerce-message,
body #page-container .et-l .woocommerce-info,
body #page-container .et-l .woocommerce-error,
body #page-container .et-l .woocommerce-message *,
body #page-container .et-l .woocommerce-info *,
body #page-container .et-l .woocommerce-error * {
	color: var(--waiki-text);
}

body #page-container .et-l .woocommerce-info a,
body #page-container .et-l .woocommerce-message a,
body #page-container .et-l .woocommerce-error a {
	color: var(--waiki-champagne);
}

/* ----------------------------------------- buying flow on smaller screens

   These repeat the stacking rules after the desktop placement above, so a
   single column wins at the narrow widths.
   ------------------------------------------------------------------- */

@media (max-width: 1100px) {
	.waiki-bagpage,
	.woocommerce-checkout form.checkout {
		grid-template-columns: minmax(0, 1fr);
		column-gap: 0;
		row-gap: 32px;
	}

	.woocommerce-checkout form.checkout > #order_review {
		grid-column: 1;
		grid-row: auto;
	}

	/* The order panel reads better above the form once they are stacked. */
	.woocommerce-checkout form.checkout > #order_review {
		order: -1;
	}

	.woocommerce-checkout form.checkout > #customer_details {
		border-radius: 2px 2px 0 0;
	}
}

@media (max-width: 680px) {
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
	.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
	.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
		grid-template-columns: minmax(0, 1fr);
	}

	.woocommerce-checkout form.checkout > .waiki-payment-slot,
	.woocommerce-checkout form.checkout > .waiki-checkout__nav {
		padding-left: 20px;
		padding-right: 20px;
	}

	.waiki-steps {
		gap: 10px 0;
	}

	.waiki-step:not(:last-child)::after {
		width: 18px;
		margin: 0 10px;
	}
}

/* =================================================== account and wishlist

   Measured from the Figma frame "10_Account_Dashboard": a 260px dark
   sidebar, a 50px gutter and a white card holding the content.
   ===================================================================== */

.et-l .waiki-account__heading {
	margin: 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 50px;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

.et-l .waiki-account__welcome {
	margin: 14px 0 0;
	padding: 0;
	font-size: 14px;
	line-height: 22px;
	color: var(--waiki-text);
}

.waiki-account__body {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 50px;
	align-items: start;
	margin-top: 61px;
}

/* ----------------------------------------------------------- the sidebar */

.waiki-account__nav {
	box-sizing: border-box;
	padding: 28px 0;
	border-radius: 2px;
	background: var(--waiki-text);
}

.et-l .waiki-account__nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: inherit;
}

.et-l .waiki-account__nav li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.et-l .waiki-account__nav a {
	display: block;
	padding: 13px 28px;
	font-family: "Montserrat", sans-serif;
	font-size: 13px;
	letter-spacing: 0.02em;
	text-decoration: none;
	color: rgba(246, 242, 234, 0.78);
	transition: color 0.18s ease, background 0.18s ease;
}

.et-l .waiki-account__nav a:hover {
	color: var(--waiki-ivory);
	background: rgba(246, 242, 234, 0.06);
}

.et-l .waiki-account__nav .is-active a,
.et-l .waiki-account__nav .woocommerce-MyAccount-navigation-link--dashboard.is-active a {
	color: var(--waiki-champagne);
}

/* WooCommerce marks the open section with this class. */
.et-l .waiki-account__nav li.is-active > a {
	color: var(--waiki-champagne);
}

/* ------------------------------------------------------- the content card */

.waiki-account__content {
	box-sizing: border-box;
	padding: 36px 40px 44px;
	border-radius: 2px;
	background: #FFFFFF;
	box-shadow: 0 10px 30px rgba(46, 41, 36, 0.05);
}

.waiki-account__section + .waiki-account__section {
	margin-top: 48px;
}

.et-l .waiki-account__title {
	margin: 0 0 20px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

.et-l .waiki-account__empty {
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 22px;
	color: var(--waiki-taupe);
}

.waiki-account__more {
	margin: 20px 0 0;
}

/* Recent orders. */
.et-l .waiki-orders {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: inherit;
}

.et-l .waiki-orders li {
	display: grid;
	grid-template-columns: 140px minmax(0, 1fr) auto;
	align-items: center;
	gap: 16px;
	margin: 0;
	padding: 18px 0;
	border-bottom: 1px solid var(--waiki-hairline);
	list-style: none;
}

.et-l .waiki-orders li:last-child {
	border-bottom: 0;
}

.et-l .waiki-orders__id {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-decoration: none;
	color: var(--waiki-ink);
}

.et-l .waiki-orders__id:hover {
	color: var(--waiki-champagne);
}

.waiki-orders__status {
	font-size: 12px;
	letter-spacing: 0.04em;
	color: var(--waiki-taupe);
}

.waiki-orders__total {
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	color: var(--waiki-ink);
}

/* Wishlist preview on the overview. */
.waiki-wishpreview {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 170px));
	gap: 20px;
}

.et-l .waiki-wishpreview__item {
	display: block;
	text-decoration: none;
}

.waiki-wishpreview__item img,
.waiki-wishpreview .waiki-ph {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 2px;
}

.waiki-wishpreview__item span {
	display: block;
	margin-top: 10px;
	font-size: 12px;
	line-height: 18px;
	color: var(--waiki-text);
}

/* ------------------------------------------- WooCommerce's own account bits */

.et-l .woocommerce-MyAccount-content h2,
.et-l .woocommerce-MyAccount-content h3 {
	margin: 0 0 18px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 28px;
	color: var(--waiki-ink);
}

.et-l .woocommerce-MyAccount-content p {
	font-size: 14px;
	line-height: 22px;
	color: var(--waiki-text);
}

.et-l .woocommerce-MyAccount-content table.shop_table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
}

.et-l .woocommerce-MyAccount-content table.shop_table th,
.et-l .woocommerce-MyAccount-content table.shop_table td {
	padding: 14px 12px 14px 0;
	border: 0;
	border-bottom: 1px solid var(--waiki-hairline);
	font-size: 13px;
	text-align: left;
	color: var(--waiki-text);
}

.et-l .woocommerce-MyAccount-content table.shop_table th {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--waiki-taupe);
}

body #page-container .et-l .woocommerce-MyAccount-content .button,
body #page-container .et-l .woocommerce-MyAccount-content button.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 46px;
	padding: 0 26px;
	border: 1px solid var(--waiki-text);
	border-radius: 0;
	background-color: var(--waiki-text);
	font-family: "Montserrat", sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--waiki-ivory);
}

body #page-container .et-l .woocommerce-MyAccount-content .woocommerce-button--view {
	height: 36px;
	padding: 0 18px;
	border-color: var(--waiki-champagne);
	background-color: transparent;
	color: var(--waiki-text);
}

body #page-container .et-l .woocommerce-MyAccount-content .input-text,
body #page-container .et-l .woocommerce-MyAccount-content select {
	box-sizing: border-box;
	width: 100%;
	height: 48px;
	padding: 0 16px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background-color: var(--waiki-ivory);
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	color: var(--waiki-text);
}

.et-l .woocommerce-MyAccount-content .woocommerce-Address {
	margin-bottom: 28px;
}

/* ---------------------------------------------------------------- sign in */

.waiki-login {
	max-width: 460px;
	margin-inline: auto;
	text-align: center;
}

.waiki-login__mark {
	display: block;
	width: 190px;
	height: auto;
	margin: 0 auto 8px;
}

.et-l .waiki-login__title {
	margin: 0;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 40px;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

.et-l .waiki-login__lead {
	margin: 16px 0 32px;
	font-size: 14px;
	line-height: 22px;
	color: var(--waiki-text);
}

.waiki-login__form {
	text-align: left;
}

.et-l .waiki-login__form .form-row {
	margin: 0 0 14px;
	padding: 0;
}

body #page-container .et-l .waiki-login__form .input-text {
	box-sizing: border-box;
	width: 100%;
	height: 50px;
	padding: 0 16px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background-color: var(--waiki-ivory);
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	color: var(--waiki-text);
}

.waiki-login__actions {
	display: grid;
	gap: 12px;
	margin-top: 22px;
}

.waiki-login__remember {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin: 18px 0 0;
	font-size: 12px;
	color: var(--waiki-taupe);
}

.et-l .waiki-login__remember label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
}

.et-l .waiki-login__remember a {
	color: var(--waiki-champagne);
	text-decoration: none;
}

/* --------------------------------------------------------------- wishlist */

.waiki-wishgrid {
	--waiki-cols: 4;
	grid-template-columns: repeat(var(--waiki-cols), minmax(0, 1fr));
	gap: 34px 38px;
}

.waiki-wishgrid .waiki-pcard {
	padding: 0;
	border: 0;
	background: none;
}

.waiki-wishgrid .waiki-pcard__price {
	display: block;
	margin-top: 10px;
	font-size: 13px;
	font-weight: 600;
	color: var(--waiki-ink);
}

/* Inside the account card there is less room, so three across. */
.waiki-account__content .waiki-wishgrid {
	--waiki-cols: 3;
}

/* ------------------------------------------ account and wishlist, narrower */

@media (max-width: 1100px) {
	.waiki-account__body {
		grid-template-columns: minmax(0, 1fr);
		gap: 28px;
	}

	.waiki-wishgrid {
		--waiki-cols: 3;
	}

	.et-l .waiki-account__nav ul {
		display: flex;
		flex-wrap: wrap;
	}

	.et-l .waiki-account__nav a {
		padding: 10px 20px;
	}
}

@media (max-width: 680px) {
	.waiki-wishgrid,
	.waiki-account__content .waiki-wishgrid {
		--waiki-cols: 2;
	}

	.waiki-account__content {
		padding: 24px 20px 28px;
	}

	.et-l .waiki-account__heading {
		font-size: 30px;
		line-height: 38px;
	}

	.et-l .waiki-orders li {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 6px 16px;
	}

	.waiki-orders__status {
		grid-column: 1 / -1;
		order: 3;
	}

	.waiki-wishpreview {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 12px;
	}
}

/* ======================================================= search overlay

   Opened by the magnifier in the header. The markup is printed on every
   page by the plugin; drawers.js shows and hides it.
   ===================================================================== */

.waiki-drawer--search {
	inset: 0 0 auto 0;
	box-sizing: border-box;
	max-height: 86vh;
	padding: 40px 32px 48px;
	border-bottom: 1px solid var(--waiki-champagne);
	background: var(--waiki-ivory);
	transform: translateY(-12px);
}

.waiki-drawer--search.is-open {
	transform: translateY(0);
}

.waiki-search__field {
	display: flex;
	align-items: center;
	gap: 20px;
	max-width: 720px;
	margin: 0 auto;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--waiki-hairline);
}

body #page-container .waiki-search__field input[type="search"],
.waiki-search__field input[type="search"] {
	flex: 1 1 auto;
	box-sizing: border-box;
	min-width: 0;
	padding: 6px 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 26px;
	line-height: 36px;
	color: var(--waiki-ink);
}

.waiki-search__field input[type="search"]:focus {
	outline: none;
}

.waiki-search__field input::placeholder {
	color: var(--waiki-taupe);
}

.waiki-search__cancel {
	flex: none;
	padding: 0;
	border: 0;
	background: none;
	font-family: "Montserrat", sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--waiki-taupe);
	cursor: pointer;
}

.waiki-search__cancel:hover {
	color: var(--waiki-text);
}

.waiki-search__body {
	max-width: 720px;
	margin: 28px auto 0;
}

.waiki-search__body .waiki-eyebrow {
	margin: 0 0 14px;
}

.waiki-search__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
}

.waiki-search__pills li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.waiki-search__pills a {
	display: inline-block;
	padding: 9px 16px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 999px;
	font-size: 12px;
	letter-spacing: 0.02em;
	text-decoration: none;
	color: var(--waiki-text);
}

.waiki-search__pills a:hover {
	border-color: var(--waiki-champagne);
	background: rgba(200, 173, 125, 0.16);
}

.waiki-search__trending {
	margin: 0;
	padding: 0;
	list-style: none;
}

.waiki-search__trending li {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--waiki-hairline);
}

.waiki-search__trending li:last-child {
	border-bottom: 0;
}

.waiki-search__trending a {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	align-items: center;
	gap: 16px;
	padding: 12px 0;
	text-decoration: none;
	color: var(--waiki-text);
}

.waiki-search__thumb img,
.waiki-search__thumb .waiki-ph {
	display: block;
	width: 56px;
	height: 56px;
	object-fit: cover;
	border-radius: 2px;
}

.waiki-search__info strong {
	display: block;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 15px;
	font-weight: 500;
	color: var(--waiki-ink);
}

.waiki-search__info em {
	display: block;
	margin-top: 3px;
	font-style: normal;
	font-size: 11px;
	letter-spacing: 0.1em;
	color: var(--waiki-taupe);
}

.waiki-search__price {
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	color: var(--waiki-ink);
}

@media (max-width: 680px) {
	.waiki-drawer--search {
		padding: 24px 16px 32px;
	}

	body #page-container .waiki-search__field input[type="search"],
	.waiki-search__field input[type="search"] {
		font-size: 20px;
		line-height: 28px;
	}
}

/* ================================================== the contact form

   The panels around it are builder columns; these are for the form the
   plugin prints inside them.
   ================================================================== */

.et-l .waiki-contact__form p {
	margin: 0 0 16px;
	padding: 0;
}

body #page-container .et-l .waiki-contact__form input[type="text"],
body #page-container .et-l .waiki-contact__form input[type="email"],
body #page-container .et-l .waiki-contact__form textarea {
	box-sizing: border-box;
	width: 100%;
	padding: 15px 16px;
	border: 1px solid var(--waiki-hairline);
	border-radius: 0;
	background-color: var(--waiki-ivory);
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	line-height: 22px;
	color: var(--waiki-text);
}

body #page-container .et-l .waiki-contact__form textarea {
	min-height: 150px;
	resize: vertical;
}

body #page-container .et-l .waiki-contact__form input:focus,
body #page-container .et-l .waiki-contact__form textarea:focus {
	border-color: var(--waiki-champagne);
	outline: none;
}

.et-l .waiki-contact__form input::placeholder,
.et-l .waiki-contact__form textarea::placeholder {
	color: var(--waiki-taupe);
}

body #page-container .et-l .waiki-contact__form button[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 52px;
	padding: 0 32px;
	border: 1px solid var(--waiki-text);
	border-radius: 0;
	background-color: var(--waiki-text);
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--waiki-ivory);
	cursor: pointer;
}

body #page-container .et-l .waiki-contact__form button[type="submit"]:hover {
	border-color: var(--waiki-champagne);
	background-color: var(--waiki-champagne);
	color: var(--waiki-text);
}

/* Links inside a builder text module take Divi's blue; brand copy keeps the
   brand colour, and on the dark concierge panel it has to stay legible. */
.et-l .et_pb_text_inner a,
.et-l .et_pb_module .et_pb_text_inner a {
	color: var(--waiki-champagne);
	text-decoration: none;
	border-bottom: 1px solid rgba(200, 173, 125, 0.45);
}

.et-l .et_pb_text_inner a:hover {
	border-bottom-color: var(--waiki-champagne);
}

/* The overlay is printed in the footer, outside the builder's wrappers, so
   its small champagne labels need an unscoped rule of their own. */
.waiki-search__body .waiki-eyebrow,
.waiki-drawer .waiki-eyebrow {
	margin: 0 0 14px;
	font-family: "Montserrat", sans-serif;
	font-size: 11px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.21em;
	text-transform: uppercase;
	color: var(--waiki-champagne);
}

/* --------------------------------------------- readable type on a phone

   The badge and the Quick Add label are drawn at 8px in the design, where a
   product card is 292px wide. On a phone or tablet the card is wider than
   that and the text is held closer to the eye, so these come up to a
   legible size. The desktop keeps the drawn values.
   ------------------------------------------------------------------- */

@media (max-width: 980px) {
	.waiki-badge {
		min-width: 104px;
		height: 28px;
		font-size: 10px;
		letter-spacing: 0.1em;
	}

	.waiki-pcard .waiki-btn--block {
		height: 34px;
		font-size: 11px;
		line-height: 34px;
		letter-spacing: 0.12em;
	}

	.waiki-pcard__cat,
	.waiki-scent__cat {
		font-size: 11px;
	}
}

/* The delivery estimate under a delivery method. */
.waiki-shipping__note {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	letter-spacing: 0.02em;
	color: var(--waiki-taupe);
}

/* In the order summary the delivery method is a line of text, not a choice
   box — the boxed styling belongs to the method list in the form itself. */
.et-l .woocommerce-checkout-review-order-table .woocommerce-shipping-methods li,
.et-l .woocommerce-checkout-review-order-table #shipping_method li {
	margin: 0;
	padding: 0;
	border: 0;
	text-align: right;
}

.et-l .woocommerce-checkout-review-order-table .woocommerce-shipping-totals td {
	text-align: right;
}

.et-l .woocommerce-checkout-review-order-table .waiki-shipping__note {
	text-align: right;
}

/* WooCommerce dims the order summary while it recalculates and drops a dark
   spinner in the middle of it. A quiet wash suits the page better. */
.et-l .blockUI.blockOverlay {
	background: rgba(246, 242, 234, 0.72) !important;
	opacity: 1 !important;
}

.et-l .blockUI.blockOverlay::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 22px;
	height: 22px;
	margin: -11px 0 0 -11px;
	border: 2px solid rgba(200, 173, 125, 0.4);
	border-top-color: var(--waiki-champagne);
	border-radius: 50%;
	background: none;
	animation: waiki-spin 0.7s linear infinite;
}

@keyframes waiki-spin {
	to { transform: rotate(360deg); }
}

/* ------------------------------------- a brand default for every button

   With Divi's Critical CSS on, a button's own colours arrive in a deferred
   stylesheet a moment after the page paints. Until then Divi's base styling
   applies, which is bright blue. This gives every builder button a quiet
   on-brand appearance in the meantime; each button's real colours still
   override this as soon as they load.
   ------------------------------------------------------------------- */

body #page-container .et-l .et_pb_button {
	border-color: var(--waiki-champagne);
	background-color: transparent;
	color: var(--waiki-text);
}

/* ======================================= plain pages, built without Divi

   A page written in the ordinary editor rather than the builder — the
   delivery and returns notes, Our Story, the privacy policy — renders in
   Divi's default column. These rules give it the brand's page shape, so
   the client can write one in the normal editor and have it look right.
   ===================================================================== */

body:not(.et-tb-has-body) #left-area {
	box-sizing: border-box;
	max-width: 760px;
	margin: 0 auto;
	padding: 72px 20px 120px;
}

#left-area .entry-title,
#left-area h1 {
	margin: 0 0 28px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-size: 40px;
	font-weight: 700;
	line-height: 50px;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	color: var(--waiki-ink);
}

#left-area .entry-content h2,
#left-area .entry-content h3 {
	margin: 36px 0 14px;
	padding: 0;
	font-family: "Cinzel", "Times New Roman", serif;
	font-weight: 700;
	color: var(--waiki-ink);
}

#left-area .entry-content h2 { font-size: 26px; line-height: 34px; }
#left-area .entry-content h3 { font-size: 20px; line-height: 28px; }

#left-area .entry-content p,
#left-area .entry-content li {
	font-family: "Montserrat", sans-serif;
	font-size: 15px;
	line-height: 26px;
	color: var(--waiki-text);
}

#left-area .entry-content p {
	margin: 0 0 18px;
	padding: 0;
}

#left-area .entry-content a {
	color: var(--waiki-champagne);
	text-decoration: underline;
	text-underline-offset: 3px;
}

#left-area .entry-content ul,
#left-area .entry-content ol {
	margin: 0 0 18px;
	padding-left: 1.2em;
}

#left-area .entry-content strong {
	color: var(--waiki-ink);
}

@media (max-width: 680px) {
	body:not(.et-tb-has-body) #left-area {
		padding: 40px 16px 72px;
	}

	#left-area .entry-title,
	#left-area h1 {
		font-size: 30px;
		line-height: 38px;
	}
}

/* No sidebar anywhere: the design has none, and Divi's default one lists
   recent posts and comments, which this shop does not use. */
#sidebar,
#main-content .container:before {
	display: none;
}

body:not(.et-tb-has-body) #left-area {
	float: none;
	width: 100% !important;
}
