/* The store and utility pages (Rest round 3, builder D): cart, checkout, order
   received, every My Account screen, the plain text pages, Contact, Track order and
   Testimonials. Loaded only on those pages (inc/assets.php); WooCommerce's own front
   end CSS is off there, so this file carries WooCommerce's markup in the brand look.
   Forms read like the header's panels: labels over square white inputs with an ink
   border, square checks, the kit buttons. Square corners, no pills, no side stripes,
   no hairline dividers: space and white panels on cream separate things. */

/* ------------------------------------------------------------- Store hero */
/* As on the Shop (shop.css): the store hero's type, for these pages too. */
.mm-wc-page .mm-hero--store .mm-hero__title { font-size: clamp(48px, 5.6vw, 92px); }
.mm-wc-page .mm-hero--store .mm-hero__lead { margin-top: 20px; }
.mm-wc-page .mm-hero--store .mm-hero__cta { margin-top: 30px; }
@media (max-width: 760px) {
	.mm-wc-page .mm-hero--store { padding-block: 40px 28px; }
	.mm-wc-page .mm-hero--store .mm-hero__title { font-size: 44px; }
	.mm-wc-page .mm-hero--store .mm-hero__lead { margin-top: 16px; font-size: 16px; line-height: 1.6; }
	.mm-wc-page .mm-hero--store .mm-hero__cta { gap: 10px; margin-top: 22px; }
	.mm-wc-page .mm-hero--store .mm-hero__cta .mm-btn { flex: 1 1 auto; white-space: nowrap; }
}

/* ------------------------------------------------------------- Shared: the form look */
.mm-wc-page { --mm-panel-pad: clamp(22px, 3vw, 40px); }
.mm-wc .woocommerce > :last-child { margin-bottom: 0; }
.mm-wc .form-row, .mm-formrow { margin: 0 0 16px; padding: 0; }
.mm-wc .form-row label, .mm-formrow label, .mm-wc .woocommerce-form-row label {
	display: block; margin: 0 0 6px; font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--mm-ink);
}
.mm-wc .form-row label.checkbox, .mm-wc .form-row label.woocommerce-form__label-for-checkbox { display: flex; align-items: center; gap: 10px; font-weight: 500; cursor: pointer; }
.mm-wc .required { color: var(--mm-highlight-text); font-weight: 700; text-decoration: none; border: 0; cursor: default; }
.mm-wc abbr.required[title] { text-decoration: none; }
.mm-wc .optional, .mm-formrow__opt { font-weight: 400; color: var(--mm-mute); }
.mm-wc .woocommerce-input-wrapper { display: block; }
.mm-wc :is(input.input-text, input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="search"], input[type="url"], select, textarea):not(.mm-email__input):not(.mm-ship__input):not(.mm-stepper__input),
.mm-input {
	display: block; width: 100%; height: 48px; margin: 0; padding: 0 14px;
	font: 400 16px/1.2 var(--mm-body); color: var(--mm-ink);
	background: var(--mm-white); border: 2px solid var(--mm-ink); border-radius: 0; box-shadow: none;
	-webkit-appearance: none; appearance: none;
}
.mm-wc textarea:not(.mm-email__input), textarea.mm-input, .mm-input--area { height: auto; min-height: 132px; padding: 12px 14px; line-height: 1.55; resize: vertical; }
.mm-wc select:not(.select2-hidden-accessible) {
	padding-right: 44px; cursor: pointer;
	background: var(--mm-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E") right 12px center / 20px no-repeat;
}
.mm-wc :is(input, select, textarea):focus-visible, .mm-input:focus-visible { outline: 2px solid var(--mm-accent); outline-offset: 2px; }
.mm-wc ::placeholder, .mm-input::placeholder { color: #8a8a84; }
.mm-wc .woocommerce-invalid :is(input.input-text, select), .mm-wc .woocommerce-invalid .select2-selection { border-color: var(--mm-highlight-text); }
.mm-wc .woocommerce-invalid label { color: var(--mm-highlight-text); }
.mm-wc .checkout-inline-error-message, .mm-wc .woocommerce-error-message { margin: 6px 0 0; font-size: 14px; font-weight: 600; color: var(--mm-highlight-text); }
.mm-wc .description, .mm-wc em, .mm-wc .woocommerce-form-row em { display: block; margin-top: 6px; font-size: 14px; font-style: normal; line-height: 1.5; color: var(--mm-mute); }
.mm-wc fieldset { margin: 28px 0 0; padding: 0; border: 0; min-width: 0; }
.mm-wc legend { padding: 0; margin: 0 0 14px; font: 400 30px/1 var(--mm-display); letter-spacing: .01em; text-transform: uppercase; }

/* Checks and radios: square, never round (Ben: no circles). */
.mm-wc input[type="checkbox"], .mm-wc input[type="radio"] {
	flex: none; display: inline-grid; place-items: center; width: 22px; height: 22px; margin: 0; cursor: pointer;
	background: var(--mm-white); border: 2px solid var(--mm-ink); border-radius: 0;
	-webkit-appearance: none; appearance: none; vertical-align: middle;
}
.mm-wc input[type="checkbox"]:checked {
	background: var(--mm-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0d' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center / 16px no-repeat;
}
.mm-wc input[type="radio"]:checked { background: var(--mm-white); box-shadow: inset 0 0 0 4px var(--mm-white), inset 0 0 0 12px var(--mm-accent); }
.mm-wc input[type="checkbox"]:focus-visible, .mm-wc input[type="radio"]:focus-visible { outline: 2px solid var(--mm-accent); outline-offset: 2px; }
/* The header's check tile (remember me) keeps its own box. */
.mm-wc .mm-check input { position: absolute; width: 1px; height: 1px; opacity: 0; }

/* The password eye WooCommerce adds. */
.mm-wc .password-input { position: relative; display: block; }
.mm-wc .password-input input { padding-right: 52px; }
.mm-wc .show-password-input {
	position: absolute; top: 2px; right: 2px; bottom: 2px; width: 44px; padding: 0; cursor: pointer; border: 0; background: var(--mm-ink);
	-webkit-mask: url("../icons/eye.svg") center / 24px no-repeat; mask: url("../icons/eye.svg") center / 24px no-repeat;
}
.mm-wc .show-password-input.display-password { -webkit-mask-image: url("../icons/eye-closed.svg"); mask-image: url("../icons/eye-closed.svg"); }
.mm-wc .show-password-input:hover { background: var(--mm-accent); }
.mm-wc .show-password-input:focus-visible { outline: 2px solid var(--mm-accent); outline-offset: 2px; }
.mm-wc .woocommerce-password-strength { margin-top: 8px; padding: 8px 12px; font-size: 14px; font-weight: 700; background: var(--mm-paper); }
.mm-wc .woocommerce-password-strength.strong { background: var(--mm-green); }
.mm-wc .woocommerce-password-strength.short, .mm-wc .woocommerce-password-strength.bad { background: #f6c7d7; }
.mm-wc .woocommerce-password-hint { display: block; margin-top: 6px; font-size: 14px; color: var(--mm-mute); }

/* The province list (select2, kept from WooCommerce), square and in the field look. */
.mm-wc .select2-container { width: 100% !important; }
.mm-wc .select2-container .select2-selection--single { height: 48px; border: 2px solid var(--mm-ink); border-radius: 0; background: var(--mm-white); }
.mm-wc .select2-container .select2-selection--single .select2-selection__rendered { padding: 0 44px 0 14px; line-height: 44px; font-size: 16px; color: var(--mm-ink); }
.mm-wc .select2-container .select2-selection--single .select2-selection__arrow { top: 0; right: 10px; height: 44px; }
.mm-wc .select2-container--focus .select2-selection--single, .mm-wc .select2-container--open .select2-selection--single { outline: 2px solid var(--mm-accent); outline-offset: 2px; }
.mm-wc-page .select2-dropdown { border: 2px solid var(--mm-ink); border-radius: 0; background: var(--mm-white); color: var(--mm-ink); font-family: var(--mm-body); }
.mm-wc-page .select2-search--dropdown .select2-search__field { height: 40px; padding: 0 10px; border: 2px solid var(--mm-ink); border-radius: 0; font-size: 16px; }
.mm-wc-page .select2-results__option { padding: 8px 14px; font-size: 15px; }
.mm-wc-page .select2-container--default .select2-results__option--highlighted[aria-selected], .mm-wc-page .select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--mm-accent); color: var(--mm-ink); }
.mm-wc-page .select2-container--default .select2-results__option[aria-selected="true"], .mm-wc-page .select2-container--default .select2-results__option[data-selected="true"] { background: var(--mm-paper); }

/* WooCommerce's own buttons in the kit look: primary by default, ghost for the small table actions. */
/* Same look as .mm-btn (components.css): green, the label in DM Sans, the icon cell. */
.mm-wc .button:not(.mm-btn), .mm-wc button[type="submit"]:not(.mm-btn):not(.show-password-input), .mm-wc #place_order {
	--mm-btn-h: 54px; position: relative; display: inline-flex; align-items: center; justify-content: flex-start;
	min-height: var(--mm-btn-h); padding: 12px calc(var(--mm-btn-h) + 22px) 12px 24px;
	font: 600 16px/1.2 var(--mm-body); letter-spacing: 0; text-transform: none; text-decoration: none; white-space: nowrap;
	color: var(--mm-ink); background: var(--mm-green); border: 0; border-radius: var(--mm-radius);
	box-shadow: none; cursor: pointer; transition: background-color .2s, color .2s;
}
.mm-wc .button:not(.mm-btn)::before, .mm-wc button[type="submit"]:not(.mm-btn):not(.show-password-input)::before, .mm-wc #place_order::before {
	content: ''; position: absolute; top: 0; bottom: 0; right: var(--mm-btn-h); width: 1.5px; background: currentColor; opacity: .85;
}
.mm-wc .button:not(.mm-btn)::after, .mm-wc button[type="submit"]:not(.mm-btn):not(.show-password-input)::after, .mm-wc #place_order::after {
	content: ''; position: absolute; top: 0; right: 0; width: var(--mm-btn-h); height: 100%; background: currentColor;
	-webkit-mask: var(--mm-icon-arrow) 50% 50% / 20px no-repeat, var(--mm-icon-arrow) -100% 200% / 20px no-repeat;
	mask: var(--mm-icon-arrow) 50% 50% / 20px no-repeat, var(--mm-icon-arrow) -100% 200% / 20px no-repeat;
	transition: -webkit-mask-position .42s var(--mm-ease-out), mask-position .42s var(--mm-ease-out);
}
.mm-wc .button:not(.mm-btn):hover::after, .mm-wc button[type="submit"]:not(.mm-btn):not(.show-password-input):hover::after, .mm-wc #place_order:hover::after {
	-webkit-mask-position: 200% -100%, 50% 50%; mask-position: 200% -100%, 50% 50%;
}
.mm-wc .button:not(.mm-btn):hover, .mm-wc button[type="submit"]:not(.mm-btn):not(.show-password-input):hover, .mm-wc #place_order:hover { color: var(--mm-ink); background: #d6f06a; }
.mm-wc .button:not(.mm-btn):disabled, .mm-wc .button.disabled { opacity: .45; cursor: default; }
.mm-wc .button:focus-visible { outline: 2px solid var(--mm-accent); outline-offset: 3px; }

/* ------------------------------------------------------------- Notices */
/* Square, a small mark beside the words (never over them), on white. */
.mm-wc .woocommerce-notices-wrapper:empty, .mm-wc .woocommerce-NoticeGroup:empty { display: none; }
.mm-wc .woocommerce-notices-wrapper, .mm-wc .woocommerce-NoticeGroup { margin: 0 0 20px; }
.mm-wc :is(.woocommerce-error, .woocommerce-message, .woocommerce-info, .woocommerce-notice) {
	position: relative; display: block; margin: 0 0 12px; padding: 16px 20px 16px 50px; list-style: none;
	font-size: 15px; line-height: 1.55; color: var(--mm-ink); background: var(--mm-white); border: 2px solid var(--mm-ink);
}
.mm-wc :is(.woocommerce-error, .woocommerce-message, .woocommerce-info, .woocommerce-notice)::before {
	content: ''; position: absolute; left: 18px; top: 20px; width: 16px; height: 16px; background: var(--mm-ink);
}
.mm-wc .woocommerce-error { border-color: var(--mm-highlight-text); }
.mm-wc .woocommerce-error::before { background: var(--mm-highlight); box-shadow: 0 0 0 2px var(--mm-ink); }
.mm-wc .woocommerce-message::before { background: var(--mm-green); box-shadow: 0 0 0 2px var(--mm-ink); }
.mm-wc .woocommerce-error li { margin: 0; padding: 0; }
.mm-wc .woocommerce-error li + li { margin-top: 6px; }
.mm-wc :is(.woocommerce-error, .woocommerce-message, .woocommerce-info, .woocommerce-notice) a:not(.button) { font-weight: 700; color: inherit; text-decoration: underline; text-decoration-color: var(--mm-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.mm-wc :is(.woocommerce-message, .woocommerce-info):has(> .button) { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 18px; }
.mm-wc :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) .button { --mm-btn-h: 40px; order: 2; flex: none; min-height: 40px; margin: -4px 0; padding: 10px calc(var(--mm-btn-h) + 16px) 8px 16px; font-size: 18px; background: transparent; box-shadow: none; }
.mm-wc :is(.woocommerce-error, .woocommerce-message, .woocommerce-info, .woocommerce-notice):focus { outline: none; }
.mm-wc :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) .button:hover { background: var(--mm-ink); color: var(--mm-paper); box-shadow: none; transform: none; }
.mm-wc .coupon-error-notice { margin: 8px 0 0; font-size: 14px; font-weight: 600; color: var(--mm-highlight-text); }

/* ------------------------------------------------------------- The cart */
.mm-bag { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--mm-grid-gap); align-items: stretch; }
.mm-bag__main { display: flex; flex-direction: column; min-width: 0; margin: 0; color: var(--mm-ink); background: var(--mm-white); }
.mm-bag__ship { padding: 18px var(--mm-panel-pad) 20px; }
.mm-bag__lines { flex: 1; list-style: none; margin: 0; padding: 8px var(--mm-panel-pad); }
.mm-bag .mm-cart__line { grid-template-columns: 120px minmax(0, 1fr) auto; gap: 22px; padding-block: 22px; }
.mm-bag .mm-cart__pic { width: 120px; }
.mm-bag .mm-cart__name { font-size: 28px; }
.mm-bag .mm-cart__option { font-size: 15px; }
.mm-bag .mm-cart__controls { margin-top: 14px; }
.mm-bag .mm-cart__price { font-size: 19px; }
.mm-bag .mm-cart__remove { width: 40px; height: 40px; }
.mm-bag__stepper { height: 40px; }
.mm-bag__stepper .mm-stepper__btn { width: 38px; }
.mm-bag__stepper .quantity { display: flex; }
.mm-bag__stepper .mm-stepper__input {
	width: 46px; height: 100%; padding: 0; text-align: center; border: 0; border-radius: 0; background: var(--mm-white);
	font: 700 16px/1 var(--mm-body); color: var(--mm-ink); -moz-appearance: textfield; appearance: textfield;
}
.mm-bag__stepper .mm-stepper__input::-webkit-inner-spin-button, .mm-bag__stepper .mm-stepper__input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.mm-bag__stepper .mm-stepper__input:focus-visible { outline: 2px solid var(--mm-accent); outline-offset: -2px; }
.mm-bag .quantity.hidden { display: none; }
.mm-bag__actions { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px; padding: 20px var(--mm-panel-pad) var(--mm-panel-pad); background: var(--mm-white); }
.mm-bag__coupon { flex: 1 1 320px; max-width: 460px; }
.mm-bag__coupon label { display: block; margin: 0 0 6px; font-size: 14px; font-weight: 700; }
.mm-bag__coupon-row { display: flex; gap: 10px; }
.mm-bag__coupon-row .mm-input { flex: 1 1 auto; min-width: 0; text-transform: uppercase; letter-spacing: .04em; }
.mm-bag__coupon-row .mm-btn { flex: none; height: 48px; padding-block: 0; }
.mm-js .mm-bag__update { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; box-shadow: none; }
.mm-bag__side { display: flex; flex-direction: column; min-width: 0; }
.mm-bag__totals { flex: 1; display: flex; flex-direction: column; padding: var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white); }
.mm-bag__title, .mm-wc #order_review_heading { margin: 0 0 18px; font: 400 clamp(34px, 3vw, 44px)/.95 var(--mm-display); letter-spacing: .01em; text-transform: uppercase; color: var(--mm-ink); }
.mm-bag__go { margin-top: auto; padding-top: 24px; }
.mm-bag__go .checkout-button { width: 100%; min-height: 60px; font-size: 25px; }
.mm-bag__note { margin: 14px 0 0; font-size: 14px; line-height: 1.5; color: #4d4d4a; }

/* The summary table (cart totals, checkout review, order details): rows by space, no rules. */
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) { display: block; width: 100%; margin: 0; border: 0; font-size: 16px; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) :is(thead, tbody, tfoot) { display: block; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) tr { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) :is(th, td) { display: block; padding: 10px 0; text-align: left; border: 0; background: none; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) :is(th, td):first-child { flex: 1 1 auto; min-width: 0; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) :is(th, td):last-child:not(:first-child) { flex: none; max-width: 60%; text-align: right; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) th { font-weight: 600; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) td { font-weight: 700; }
.mm-wc :is(.woocommerce-checkout-review-order-table, .woocommerce-table--order-details) thead th { padding-top: 0; font: 400 14px/1.4 var(--mm-body); color: var(--mm-mute); }
.mm-wc :is(.woocommerce-checkout-review-order-table, .woocommerce-table--order-details) tbody td { font-weight: 500; }
.mm-wc :is(.woocommerce-checkout-review-order-table, .woocommerce-table--order-details) tbody td:last-child { font-weight: 700; }
.mm-wc .product-quantity { font-weight: 700; color: var(--mm-accent-text); }
.mm-wc .wc-item-meta { margin: 4px 0 0; padding: 0; list-style: none; font-size: 14px; color: var(--mm-mute); }
.mm-wc .wc-item-meta p { display: inline; margin: 0; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table, .woocommerce-table--order-details) :is(.order-total, tr:last-child) :is(th, td) { padding-top: 18px; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table) .order-total th { font: 400 30px/1 var(--mm-display); letter-spacing: .03em; text-transform: uppercase; }
.mm-wc :is(.mm-sum, .woocommerce-checkout-review-order-table) .order-total td { font-size: 22px; }
.mm-wc .order-total small, .mm-wc .includes_tax { display: block; font-size: 14px; font-weight: 400; color: var(--mm-mute); }
.mm-wc .cart-discount td { color: #2d7a2d; }
.mm-wc .woocommerce-remove-coupon { margin-left: 8px; font-size: 14px; font-weight: 700; color: var(--mm-ink); }
/* Shipping: the row opens up under its label, the methods as square tiles. */
.mm-wc tr.woocommerce-shipping-totals { display: block !important; }
.mm-wc tr.woocommerce-shipping-totals > :is(th, td) { display: block; width: 100%; max-width: none !important; text-align: left !important; }
.mm-wc tr.woocommerce-shipping-totals > td { padding-top: 0; font-weight: 500; }
.mm-wc #shipping_method { display: grid; gap: 8px; margin: 4px 0 0; padding: 0; list-style: none; }
.mm-wc #shipping_method li { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0; padding: 12px 14px; background: var(--mm-paper); border: 2px solid transparent; }
.mm-wc #shipping_method li:has(input:checked), .mm-wc #shipping_method li:only-child { border-color: var(--mm-ink); background: var(--mm-white); }
.mm-wc #shipping_method label { flex: 1; display: flex; justify-content: space-between; gap: 12px; margin: 0; font-size: 15px; font-weight: 600; cursor: pointer; }
.mm-wc #shipping_method label .amount { font-weight: 700; white-space: nowrap; }
/* A rate's own line (Flexible Shipping's Method Description) sits under its label. */
.mm-wc #shipping_method .shipping-method-description { flex-basis: 100%; margin: -6px 0 0 34px; font-size: 14px; line-height: 1.4; color: #4d4d4a; }
.mm-wc .woocommerce-shipping-destination, .mm-wc .woocommerce-shipping-contents { margin: 10px 0 0; font-size: 14px; font-weight: 400; line-height: 1.5; color: #4d4d4a; }
.mm-wc .woocommerce-shipping-calculator { margin: 6px 0 0; }
.mm-wc .shipping-calculator-button { font-size: 14px; font-weight: 700; color: var(--mm-ink); text-decoration: underline; text-decoration-color: var(--mm-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.mm-wc .shipping-calculator-form { margin-top: 14px; padding: 16px; background: var(--mm-paper); }
.mm-wc .shipping-calculator-form .form-row { margin-bottom: 12px; }
.mm-wc .shipping-calculator-form .button { width: 100%; }

@media (max-width: 1000px) {
	.mm-bag { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
	.mm-bag .mm-cart__line { grid-template-columns: 84px minmax(0, 1fr) auto; gap: 14px; padding-block: 18px; }
	.mm-bag .mm-cart__pic { width: 84px; }
	.mm-bag .mm-cart__name { font-size: 22px; }
	.mm-bag .mm-cart__price { font-size: 16px; }
	.mm-bag__coupon { flex-basis: 100%; max-width: none; }
}

/* ------------------------------------------------------------- Checkout */
.mm-wc--checkout .woocommerce-form-login-toggle, .mm-wc--checkout .woocommerce-form-coupon-toggle { margin: 0; }
/* The two toggles (kit buttons, see woocommerce/checkout/): words over the button on a phone,
   side by side from 480 px, so both rows always match. */
.mm-wc--checkout :is(.woocommerce-form-login-toggle, .woocommerce-form-coupon-toggle) .woocommerce-info { flex-direction: column; align-items: flex-start; }
@media (min-width: 480px) {
	.mm-wc--checkout :is(.woocommerce-form-login-toggle, .woocommerce-form-coupon-toggle) .woocommerce-info { flex-direction: row; align-items: center; }
}
.mm-wc--checkout :is(.checkout_coupon, .woocommerce-form-login) { margin: 0 0 20px; padding: var(--mm-panel-pad); background: var(--mm-white); }
.mm-wc--checkout .checkout_coupon { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.mm-wc--checkout .checkout_coupon p:not(.form-row) { flex-basis: 100%; margin: 0 0 4px; }
.mm-wc--checkout .checkout_coupon .form-row { margin: 0; }
.mm-wc--checkout .checkout_coupon .form-row-first { flex: 1 1 260px; }
.mm-wc--checkout .clear { display: none; }
.mm-wc form.checkout {
	display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--mm-grid-gap);
	grid-template-areas: "notices notices" "details head" "details review"; grid-template-rows: auto auto 1fr; align-items: stretch;
}
.mm-wc form.checkout > .woocommerce-NoticeGroup { grid-area: notices; }
.mm-wc #customer_details { grid-area: details; min-width: 0; padding: var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white); }
.mm-wc #customer_details :is(h3, .woocommerce-billing-fields h3) { margin: 0 0 18px; font: 400 clamp(32px, 2.8vw, 40px)/.95 var(--mm-display); letter-spacing: .01em; text-transform: uppercase; color: var(--mm-ink); }
.mm-wc #customer_details .col-2 { margin-top: 18px; }
.mm-wc #customer_details #ship-to-different-address { font-size: 30px; }
.mm-wc #ship-to-different-address label { display: flex; align-items: center; gap: 12px; margin: 0; font: inherit; cursor: pointer; }
.mm-wc #customer_details .shipping_address { margin-top: 6px; }
.mm-wc .woocommerce-additional-fields { margin-top: 18px; }
.mm-wc #billing_country_field strong, .mm-wc #shipping_country_field strong { display: block; font-size: 16px; font-weight: 700; }
.mm-wc #order_review_heading { grid-area: head; margin: 0; padding: var(--mm-panel-pad) var(--mm-panel-pad) 12px; background: var(--mm-white); }
.mm-wc #order_review { grid-area: review; min-width: 0; padding: 0 var(--mm-panel-pad) var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white); }
/* Payment: the methods as square tiles, the gateway's own words under the picked one. */
.mm-wc #payment { margin-top: 20px; }
.mm-wc .wc_payment_methods { display: grid; gap: 8px; margin: 0 0 18px; padding: 0; list-style: none; }
.mm-wc .wc_payment_method { margin: 0; padding: 14px 16px; background: var(--mm-paper); border: 2px solid transparent; }
.mm-wc .wc_payment_method:has(> input:checked), .mm-wc .wc_payment_method:only-child { background: var(--mm-white); border-color: var(--mm-ink); }
.mm-wc .wc_payment_method > input { margin-right: 10px; }
.mm-wc .wc_payment_method > label { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; font: 400 24px/1 var(--mm-display); letter-spacing: .03em; text-transform: uppercase; cursor: pointer; vertical-align: middle; }
.mm-wc .wc_payment_method > label img { display: inline-block; max-height: 26px; width: auto; }
.mm-wc .payment_box { margin: 12px 0 0; padding: 0; font-size: 15px; line-height: 1.6; color: #3d3d3a; }
.mm-wc .payment_box p { margin: 0; }
.mm-wc .woocommerce-notice--info.woocommerce-info { margin: 0; }
.mm-wc .place-order { margin: 0; padding: 0; }
.mm-wc .woocommerce-privacy-policy-text p, .mm-wc .woocommerce-terms-and-conditions-checkbox-text { margin: 0 0 16px; font-size: 14px; line-height: 1.55; color: #4d4d4a; }
.mm-wc .woocommerce-privacy-policy-text a, .mm-wc .woocommerce-terms-and-conditions-link { font-weight: 700; color: var(--mm-ink); text-decoration: underline; text-decoration-color: var(--mm-accent); text-decoration-thickness: 2px; }
.mm-wc #place_order { width: 100%; min-height: 60px; font-size: 25px; }
@media (max-width: 1000px) {
	.mm-wc form.checkout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "notices" "details" "head" "review"; grid-template-rows: none; }
	.mm-wc #order_review_heading { margin-top: var(--mm-grid-gap); }
}

/* ------------------------------------------------------------- Order received */
.mm-wc--received .woocommerce-order { display: grid; gap: var(--mm-grid-gap); }
.mm-wc--received .woocommerce-order > * { margin: 0; }
.mm-wc--received .woocommerce-thankyou-order-received {
	padding: 0; border: 0; background: none; text-align: center; max-width: 22ch; margin: 0 auto 8px !important;
	font: 400 clamp(40px, 4.6vw, 68px)/.92 var(--mm-display); letter-spacing: .005em; text-transform: uppercase; text-wrap: balance;
}
.mm-wc--received .woocommerce-thankyou-order-received::before { content: none; }
.mm-wc .woocommerce-order-overview { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; padding: 0; list-style: none; }
.mm-wc .woocommerce-order-overview li { margin: 0; padding: 20px 22px; font: 400 14px/1.4 var(--mm-body); color: var(--mm-mute); background: var(--mm-white); }
.mm-wc .woocommerce-order-overview strong { display: block; margin-top: 8px; font: 400 clamp(26px, 2.2vw, 32px)/1 var(--mm-display); letter-spacing: .02em; text-transform: none; color: var(--mm-ink); overflow-wrap: anywhere; }
.mm-wc .woocommerce-order-overview__email strong { margin-top: 10px; font: 700 16px/1.35 var(--mm-body); letter-spacing: 0; }
.mm-paysteps { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: clamp(18px, 2.4vw, 32px); padding: var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white); }
.mm-paysteps__glyph { width: 112px; padding: 24px; background: var(--mm-paper); color: var(--mm-ink); --mm-glyph: 112px; --mm-glyph-tone: var(--mm-accent); }
.mm-paysteps__icon { --mm-line-icon: 56px; color: var(--mm-ink); } /* rollout S9 (KS-09): the line set, no tile */
.mm-paysteps__title { margin: 0 0 12px; font: 400 clamp(32px, 2.8vw, 40px)/.95 var(--mm-display); text-transform: uppercase; }
.mm-paysteps__text p { margin: 0 0 12px; font-size: 17px; line-height: 1.65; }
.mm-paysteps__text > :last-child { margin-bottom: 0; }
.mm-paysteps .wc-bacs-bank-details-heading { margin: 18px 0 8px; font: 400 26px/1 var(--mm-display); text-transform: uppercase; }
.mm-paysteps .wc-bacs-bank-details { margin: 0; padding: 0; list-style: none; }
.mm-wc :is(.woocommerce-order-details, .woocommerce-customer-details, .woocommerce-order-downloads) { padding: var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white); }
.mm-wc :is(.woocommerce-order-details__title, .woocommerce-column__title, .woocommerce-order-downloads__title) { margin: 0 0 16px; font: 400 clamp(30px, 2.6vw, 38px)/.95 var(--mm-display); text-transform: uppercase; }
.mm-wc .woocommerce-columns--addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--mm-grid-gap); }
.mm-wc address { margin: 0; padding: 18px 20px; font-style: normal; font-size: 16px; line-height: 1.7; background: var(--mm-paper); }
.mm-wc address p { margin: 6px 0 0; }
.mm-wc .woocommerce-customer-details--phone, .mm-wc .woocommerce-customer-details--email { margin: 6px 0 0; }
.mm-wc mark { padding: 0 4px; font-weight: 700; color: var(--mm-ink); background: var(--mm-green); }
.mm-wc .order-again .button { margin-top: 8px; }
@media (max-width: 600px) {
	.mm-wc .woocommerce-order-overview { grid-template-columns: 1fr 1fr; }
	.mm-paysteps { grid-template-columns: 1fr; }
	.mm-paysteps__glyph { width: 88px; padding: 18px; --mm-glyph: 88px; }
	.mm-paysteps__icon { --mm-line-icon: 44px; }
}

/* ------------------------------------------------------------- Account: signed out */
.mm-acc-in { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mm-grid-gap); align-items: stretch; }
.mm-acc-in--one { grid-template-columns: minmax(0, 640px); justify-content: center; }
.mm-acc-in__panel { display: flex; flex-direction: column; min-width: 0; padding: var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white); }
.mm-acc-in__panel form { flex: 1; display: flex; flex-direction: column; }
.mm-acc-in__title { margin: 0 0 22px; font: 400 clamp(38px, 3.4vw, 52px)/.92 var(--mm-display); letter-spacing: .01em; text-transform: uppercase; }
.mm-acc-in__line { margin: 2px 0 22px; font-size: 15px; }
.mm-acc-in__note, .mm-acc-in__panel .woocommerce-privacy-policy-text p { margin: 0 0 14px; font-size: 15px; line-height: 1.6; color: #4d4d4a; }
.mm-acc-in__panel .woocommerce-privacy-policy-text a { font-weight: 700; color: var(--mm-ink); text-decoration: underline; text-decoration-color: var(--mm-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.mm-wc .mm-acc-in__go { margin: auto 0 0; padding-top: 10px; }
.mm-acc-in__go .mm-btn { width: 100%; min-height: 56px; }
@media (max-width: 860px) { .mm-acc-in { grid-template-columns: minmax(0, 1fr); } }

/* Lost and reset password: one panel, a glyph cell beside the form. */
.mm-wc .lost_reset_password {
	display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); column-gap: var(--mm-panel-pad); align-content: start;
	max-width: 900px; margin: 0 auto; padding: var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white);
}
.mm-wc .lost_reset_password::before, .mm-wc .lost_reset_password::after { content: ''; grid-column: 1; grid-row: 1 / span 20; align-self: stretch; min-height: 200px; }
.mm-wc .lost_reset_password::before { background: var(--mm-paper); }
.mm-wc .lost_reset_password::after { background: var(--mm-ink); -webkit-mask: url("../icons/lock.svg") center / 40% no-repeat; mask: url("../icons/lock.svg") center / 40% no-repeat; }
.mm-wc .lost_reset_password > * { grid-column: 2; }
.mm-wc .lost_reset_password > p:first-of-type:not(.form-row) { margin: 0 0 18px; font-size: 16px; line-height: 1.6; }
.mm-wc .lost_reset_password .form-row-first, .mm-wc .lost_reset_password .form-row-last { width: 100%; }
.mm-wc .lost_reset_password .clear { display: none; }
.mm-wc .lost_reset_password .button { margin-top: 6px; }
.mm-wc .lost_reset_password .woocommerce-form-row--first { margin-top: 0; }
.mm-wc--account .woocommerce-message:only-child, .mm-wc .woocommerce > p:only-child { max-width: 900px; margin-inline: auto; }
@media (max-width: 700px) {
	.mm-wc .lost_reset_password { grid-template-columns: minmax(0, 1fr); }
	.mm-wc .lost_reset_password::before, .mm-wc .lost_reset_password::after { grid-row: 1; min-height: 120px; margin-bottom: 20px; }
	.mm-wc .lost_reset_password::after { -webkit-mask-size: 72px; mask-size: 72px; }
	.mm-wc .lost_reset_password > * { grid-column: 1; }
}

/* ------------------------------------------------------------- Account: signed in */
.mm-wc--account.is-in .woocommerce { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--mm-grid-gap); align-items: stretch; }
.mm-acc__nav { min-width: 0; padding: var(--mm-panel-pad) calc(var(--mm-panel-pad) - 12px) var(--mm-panel-pad) var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white); }
.mm-acc__hello { display: flex; align-items: center; gap: 16px; margin: 0 0 18px; }
.mm-acc__tile { display: grid; place-items: center; flex: none; width: 64px; height: 64px; padding-top: 3px; font: 400 40px/1 var(--mm-display); color: var(--mm-ink); background: var(--mm-accent); box-shadow: none; }
.mm-acc__who { min-width: 0; }
.mm-acc__name { margin: 0; font: 400 34px/.95 var(--mm-display); letter-spacing: .02em; text-transform: uppercase; overflow-wrap: anywhere; }
.mm-acc__email { margin: 4px 0 0; font-size: 14px; line-height: 1.35; color: #4d4d4a; overflow-wrap: anywhere; }
.mm-acc__rows { display: grid; gap: 4px; list-style: none; margin: 0 0 0 -12px; padding: 0; }
.mm-acc__rows > li { margin: 0; }
.mm-acc__rows > .mm-acc__out { margin-top: 14px; }
.mm-acc__row {
	display: flex; align-items: center; gap: 14px; min-height: 54px; padding: 6px 12px;
	font: 400 24px/1 var(--mm-display); letter-spacing: .04em; text-transform: uppercase; color: var(--mm-ink); text-decoration: none;
	border: 2px solid transparent; transition: background .15s, color .15s, border-color .15s;
}
.mm-acc__row span { padding-top: 2px; }
.mm-acc__glyph { --mm-glyph: 30px; --mm-line-icon: 28px; color: var(--mm-ink); transition: color .15s; } /* rollout S9: a line icon (KS-09) */
.mm-acc__row:hover, .mm-acc__row:focus-visible { color: var(--mm-ink); background: var(--mm-paper); }
.mm-acc__row:hover .mm-acc__glyph { color: var(--mm-accent-text); }
.mm-acc__row:focus-visible { outline: 2px solid var(--mm-accent); outline-offset: 2px; }
.mm-acc__row[aria-current="page"] { background: var(--mm-paper); border-color: var(--mm-ink); }
.mm-acc__row[aria-current="page"] .mm-acc__glyph { color: var(--mm-accent-text); }
.mm-wc .woocommerce-MyAccount-content { min-width: 0; padding: var(--mm-panel-pad); color: var(--mm-ink); background: var(--mm-white); }
.mm-wc .woocommerce-MyAccount-content > p { max-width: 64ch; font-size: 17px; line-height: 1.7; }
.mm-wc .woocommerce-MyAccount-content > p:first-of-type { font-size: 19px; }
.mm-wc .woocommerce-MyAccount-content p a:not(.button), .mm-wc .woocommerce-MyAccount-content td a:not(.button) { font-weight: 700; color: var(--mm-ink); text-decoration: underline; text-decoration-color: var(--mm-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.mm-wc .woocommerce-MyAccount-content > h2, .mm-wc .woocommerce-MyAccount-content form > h2, .mm-wc .woocommerce-MyAccount-content > h3 { margin: 0 0 18px; font: 400 clamp(32px, 2.8vw, 40px)/.95 var(--mm-display); text-transform: uppercase; }
.mm-wc .woocommerce-MyAccount-content .woocommerce-order-details, .mm-wc .woocommerce-MyAccount-content .woocommerce-customer-details { padding: 0; margin-top: 28px; }
.mm-wc .woocommerce-MyAccount-content .woocommerce-address-fields .button, .mm-wc .woocommerce-EditAccountForm .button { margin-top: 10px; }
.mm-wc .woocommerce-EditAccountForm .clear { display: none; }
/* The dashboard's latest order (inc/page-store.php). */
.mm-acc-last { margin-top: 32px; }
.mm-acc-last__title { margin: 0 0 14px; font: 400 clamp(30px, 2.6vw, 36px)/.95 var(--mm-display); text-transform: uppercase; }
.mm-acc-last__row { display: grid; grid-template-columns: auto repeat(3, minmax(0, 1fr)) auto; align-items: center; gap: 14px 22px; padding: 16px 18px; background: var(--mm-paper); }
.mm-acc-last__row p { margin: 0; font-size: 15px; font-weight: 500; }
.mm-acc-last__label { display: block; margin-bottom: 4px; font: 400 14px/1.3 var(--mm-body); color: var(--mm-mute); }
.mm-acc-last__row .mm-acc-last__num { font: 400 26px/1 var(--mm-display); letter-spacing: .02em; }
.mm-acc-last__line { margin: 0; font-size: 16px; color: #4d4d4a; }
.mm-acc-last__go { margin: 24px 0 0; }
@media (max-width: 600px) {
	.mm-acc-last__row { grid-template-columns: 1fr 1fr; }
	.mm-acc-last__row .mm-acc-last__num { grid-column: 1 / -1; }
	.mm-acc-last__row .mm-btn { justify-self: start; }
}

/* Orders: each order a cream row, the actions as small buttons. */
.mm-wc .woocommerce-orders-table { width: 100%; border-collapse: separate; border-spacing: 0 8px; margin: -8px 0 0; font-size: 15px; }
.mm-wc .woocommerce-orders-table th { padding: 0 14px 4px; text-align: left; font: 400 14px/1.4 var(--mm-body); color: var(--mm-mute); border: 0; }
.mm-wc .woocommerce-orders-table tbody :is(th, td) { padding: 16px 14px; text-align: left; vertical-align: middle; font: 500 15px/1.4 var(--mm-body); color: var(--mm-ink); background: var(--mm-paper); border: 0; }
.mm-wc .woocommerce-orders-table tbody th a { font: 400 24px/1 var(--mm-display); letter-spacing: .02em; color: var(--mm-ink); text-decoration: none; }
.mm-wc .woocommerce-orders-table tbody th a:hover { color: var(--mm-accent-text); }
.mm-wc .woocommerce-orders-table__cell-order-actions { text-align: right !important; white-space: nowrap; }
.mm-wc .woocommerce-orders-table .button, .mm-wc .woocommerce-MyAccount-content .order-actions-button { --mm-btn-h: 40px; min-height: 40px; padding: 10px calc(var(--mm-btn-h) + 16px) 8px 16px; margin: 2px 0 2px 6px; font-size: 18px; }
.mm-wc .woocommerce-orders-table .button.view { background: var(--mm-accent); }
.mm-wc .woocommerce-orders-table .button.cancel { background: transparent; box-shadow: none; }
.mm-wc .woocommerce-pagination { display: flex; gap: 10px; margin-top: 18px; }
/* Addresses: two cream cells side by side, sharing edges. */
.mm-wc .woocommerce-Addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mm-grid-gap); margin-top: 18px; align-items: stretch; }
.mm-wc .woocommerce-Address { display: flex; flex-direction: column; padding: 22px; background: var(--mm-paper); }
.mm-wc .woocommerce-Address-title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.mm-wc .woocommerce-Address-title h2 { margin: 0; font: 400 30px/1 var(--mm-display); text-transform: uppercase; }
.mm-wc .woocommerce-Address-title .edit {
	display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 10px 14px 8px;
	font: 400 18px/1 var(--mm-display); letter-spacing: .05em; text-transform: uppercase; color: var(--mm-ink); text-decoration: none;
	border: 2px solid var(--mm-ink); transition: background .15s, color .15s;
}
.mm-wc .woocommerce-Address-title .edit:hover { color: var(--mm-paper); background: var(--mm-ink); }
.mm-wc .woocommerce-Address address { padding: 0; background: none; }
@media (max-width: 1000px) {
	.mm-wc--account.is-in .woocommerce { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
	/* Phones: the account rows become one row of square tiles that scrolls sideways. */
	.mm-acc__nav { padding: 20px 0 20px 20px; }
	.mm-acc__hello { margin: 0 20px 16px 0; }
	.mm-acc__tile { width: 52px; height: 52px; font-size: 32px; }
	.mm-acc__name { font-size: 30px; }
	.mm-acc__rows { display: flex; gap: 8px; margin: 0; padding: 2px 20px 6px 2px; overflow-x: auto; scrollbar-width: none; }
	.mm-acc__rows::-webkit-scrollbar { display: none; }
	.mm-acc__rows > li { flex: none; }
	.mm-acc__rows > .mm-acc__out { margin-top: 0; }
	.mm-acc__row { flex-direction: column; justify-content: center; gap: 8px; min-width: 104px; min-height: 92px; padding: 10px 14px; text-align: center; font-size: 19px; white-space: nowrap; border-color: var(--mm-ink); }
	.mm-acc__row span { padding-top: 0; }
	.mm-acc__row[aria-current="page"] { background: var(--mm-accent); box-shadow: none; }
	.mm-acc__row[aria-current="page"] .mm-acc__glyph { color: var(--mm-ink); }
	.mm-wc .woocommerce-Addresses { grid-template-columns: minmax(0, 1fr); }
	/* Orders as stacked rows, each cell with its own label. */
	.mm-wc .woocommerce-orders-table thead { display: none; }
	.mm-wc .woocommerce-orders-table, .mm-wc .woocommerce-orders-table tbody { display: block; }
	.mm-wc .woocommerce-orders-table tr { display: grid; grid-template-columns: 1fr 1fr; margin: 0 0 8px; background: var(--mm-paper); }
	.mm-wc .woocommerce-orders-table tbody :is(th, td) { display: block; padding: 12px 14px; }
	.mm-wc .woocommerce-orders-table tbody :is(th, td)[data-title]::before { content: attr(data-title); display: block; margin-bottom: 4px; font: 400 14px/1.3 var(--mm-body); color: var(--mm-mute); }
	.mm-wc .woocommerce-orders-table__cell-order-actions { grid-column: 1 / -1; text-align: left !important; }
	.mm-wc .woocommerce-orders-table__cell-order-actions::before { display: none !important; }
	.mm-wc .woocommerce-orders-table .button { margin: 0 6px 0 0; }
}

/* ------------------------------------------------------------- Text pages */
.mm-text .mm-prose h2 { margin: 40px 0 12px; font: 400 clamp(30px, 2.6vw, 36px)/.95 var(--mm-display); letter-spacing: .01em; text-transform: uppercase; color: var(--mm-ink); }
.mm-text .mm-prose h3 { margin: 30px 0 10px; font: 400 26px/1 var(--mm-display); text-transform: uppercase; }
.mm-text .mm-prose h4 { margin: 24px 0 8px; font: 400 22px/1 var(--mm-display); text-transform: uppercase; }
.mm-text .mm-prose > :first-child { margin-top: 0; }
.mm-text .mm-prose img { height: auto; }
.mm-text .mm-prose-photo { align-items: stretch; }
.mm-text .mm-prose-photo > .mm-prose { align-self: center; } /* a short text sits level with its picture */
/* A form or a plugin's slot under the text fills the column, so it shares the picture's bottom edge. */
.mm-text .mm-prose-col { display: flex; flex-direction: column; }
.mm-text .mm-prose-col > :last-child:not(.mm-prose) { flex: 1 1 auto; }
.mm-text .mm-prose-col > .woocommerce { display: flex; flex-direction: column; }
.mm-text .mm-prose-col > .woocommerce > .lost_reset_password { flex: 1 1 auto; max-width: none; margin: 0; grid-template-columns: minmax(0, 1fr); }
.mm-text .mm-prose-col > .woocommerce > .lost_reset_password::before, .mm-text .mm-prose-col > .woocommerce > .lost_reset_password::after { display: none; }
.mm-text .mm-prose-col > .woocommerce > .lost_reset_password > * { grid-column: 1; }

/* ------------------------------------------------------------- Contact */
/* Round 4 (rollout S5, task 09). Before you write is the kit's questions block on ink
   (kit.css). Send us a message: the form on the light cell (the store form rows and
   inputs above, the kit button) beside the ways to reach us, which sit on the liquid
   light field and on ink; the two halves share their top and bottom edges, as on
   Track order. No icons, no pictures; pink only for the field errors (KIT.md pink
   uses 4). */
.mm-contact { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: stretch; }

/* ---------- The form ---------- */
.mm-contact__panel {
	container-type: inline-size; min-width: 0;
	padding: var(--mm-panel-pad, clamp(22px, 3vw, 40px)); color: var(--mm-ink); background: var(--mm-cell);
	scroll-margin-top: calc(var(--mm-header-h) + 16px);
}
.mm-contact__form { margin: 0; }
.mm-contact__form[hidden], .mm-contact__done[hidden] { display: none; }
.mm-contact__row { margin: 0 0 22px; }
.mm-contact__row label { font-size: 15px; }
.mm-contact .mm-input { height: 56px; font-size: 17px; }
.mm-contact .mm-input--area { height: auto; min-height: 168px; padding-top: 14px; }
.mm-contact__row.is-bad .mm-input { border-color: var(--mm-highlight-text); }
.mm-contact__hint { margin: 8px 0 0; font-size: 14px; line-height: 1.5; color: var(--mm-mute); }
.mm-contact__err { margin: 8px 0 0; font-size: 14px; font-weight: 700; line-height: 1.45; color: var(--mm-highlight-text); }
.mm-contact__err[hidden] { display: none; }
.mm-contact__send { display: grid; gap: 14px; margin-top: 30px; }
.mm-contact__submit { width: 100%; justify-content: center; min-height: 56px; }
.mm-contact.is-busy .mm-contact__submit { pointer-events: none; opacity: .75; }
.mm-contact__status { margin: 0; font-size: 15px; font-weight: 700; line-height: 1.5; color: var(--mm-ink); }
.mm-contact__status:empty { display: none; }
.mm-contact__status.is-error { color: var(--mm-highlight-text); }
.mm-contact__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Sent: the confirmation takes the form's place. */
.mm-contact__done { display: flex; flex-direction: column; justify-content: center; min-height: 100%; }
.mm-contact__done-title {
	margin: 0; font: 400 clamp(44px, 5vw, 72px)/.92 var(--mm-display); letter-spacing: .01em; text-transform: uppercase; color: var(--mm-ink);
}
.mm-contact__done-title:focus { outline: none; }
.mm-contact__done-text { max-width: 46ch; margin: 22px 0 0; font-size: 18px; line-height: 1.6; color: var(--mm-ink); }
.mm-contact__done-cta { margin: 32px 0 0; }

/* ---------- The ways to reach us ---------- */
.mm-contact__ways { container-type: inline-size; display: flex; flex-direction: column; min-width: 0; color: var(--mm-paper); background: var(--mm-ink); }
.mm-contact__banner {
	position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-end; flex: 1 1 auto;
	min-height: clamp(220px, 24vw, 300px); padding: var(--mm-panel-pad, clamp(22px, 3vw, 40px));
}
.mm-contact__field { z-index: -2; }
.mm-contact__banner::after {
	content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: linear-gradient(180deg, rgba(13, 13, 13, 0) 20%, rgba(13, 13, 13, .5) 62%, rgba(13, 13, 13, .86) 100%);
}
.mm-contact__words { min-width: 0; }
.mm-contact__big {
	margin: 0; font: 400 clamp(40px, 11cqi, 64px)/.92 var(--mm-display); letter-spacing: .01em; text-transform: uppercase; color: var(--mm-paper); text-wrap: balance;
}
.mm-contact__mail { margin: 16px 0 0; font: 700 clamp(18px, 5.4cqi, 24px)/1.3 var(--mm-body); overflow-wrap: anywhere; }
/* Email, phone and Track order are kit buttons (finish list item 6); a link inside running text stays a link. */
.mm-contact__act { margin: 18px 0 0; }
.mm-questions__a .mm-contact__act { margin: 4px 0 16px; }
.mm-contact__ways a:not(.mm-btn) {
	color: var(--mm-paper); text-decoration: underline; text-decoration-color: var(--mm-green);
	text-decoration-thickness: 2px; text-underline-offset: 5px; transition: color .2s;
}
.mm-contact__ways a:not(.mm-btn):hover { color: var(--mm-green); }
.mm-contact__facts { display: grid; gap: 28px; padding: var(--mm-panel-pad, clamp(22px, 3vw, 40px)); }
.mm-contact__label { margin: 0; font: 400 var(--mm-h3)/1 var(--mm-display); letter-spacing: .01em; text-transform: uppercase; color: var(--mm-paper); }
.mm-contact__value { margin: 10px 0 0; font: 600 19px/1.4 var(--mm-body); }

@media (max-width: 900px) {
	.mm-contact { grid-template-columns: minmax(0, 1fr); }
	.mm-contact__banner { min-height: 200px; }
}

/* ------------------------------------------------------------- Track order */
/* Round 4 (rollout S4): the page has its own file, assets/css/track.css. */

/* ------------------------------------------------------------- Testimonials */
.mm-strip-band { padding-bottom: calc(var(--mm-band-y) - 10px); }