/* ==========================================================================
   GreenPath Core — design layer for the Elementor build.
   Layout, type and colour live in Elementor settings; this file only covers
   what Elementor Free cannot express (keyframes, pseudo elements, blur,
   hover reveals) plus the markup of the GreenPath custom widgets.
   Breakpoints mirror the Elementor kit: tablet ≤800px, mobile ≤550px.
   ========================================================================== */

/* Brand tokens (I AM A HOUSEHEAD) for the older GreenPath components. */
:root {
	--gp-ink: #0a0a0a;
	--gp-cream: #f4f4f4;
	--gp-paper: #e9e3d8;
	--gp-copper: #de9364;
	--gp-copper-light: #de9364;
	--gp-muted: #9a9a9a;
	--gp-line: #2e2e2e;
	--gp-mono: "Space Mono", ui-monospace, monospace;
	--gp-display: "Space Grotesk", system-ui, sans-serif;
	--gp-ease: cubic-bezier(0.23, 1, 0.32, 1);
}

/* ---------- Base / theme reset ------------------------------------------ */
html { scroll-behavior: smooth; }
body.gp-site {
	background: var(--gp-ink);
	color: var(--gp-cream);
	font-family: var(--gp-display);
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}
.gp-site #page, .gp-site .site-content, .gp-site #content > .ast-container {
	max-width: none;
	padding: 0;
	margin: 0;
	display: block;
	background: transparent;
}
.gp-site .site-content { overflow: visible; }
.gp-site a { text-decoration: none; }
.gp-site .elementor a { box-shadow: none; }
.gp-site button:focus-visible, .gp-site a:focus-visible { outline: 2px solid var(--gp-copper-light); outline-offset: 4px; }
.gp-site .bhf-hidden { display: none; }
[id] { scroll-margin-top: 95px; }

/* Constrained 1320px box used by most sections (percent padding is set in
   Elementor so it resolves against the viewport like the reference). */
.e-con.gp-box { max-width: 1320px; margin-left: auto; margin-right: auto; }

.e-con.gp-box-1200 { max-width: 1200px; margin-left: auto; margin-right: auto; }
.e-con.gp-box-1240 { max-width: 1240px; margin-left: auto; margin-right: auto; }

/* Copper accent words inside headings. */
.gp-accent { color: var(--gp-copper); font-style: normal; }
/* Text editor: no trailing paragraph gap (spacing comes from Elementor margins). */
.gp-site .elementor-widget-text-editor p { margin: 0; }
.gp-site .elementor-widget-heading .elementor-heading-title { margin: 0; }
.gp-site .elementor-widget-heading span.elementor-heading-title { display: block; }
.gp-btn .elementor-button-icon { display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; }
.gp-btn .elementor-button-icon svg { width: 9px; height: 9px; }
.gp-text-link .elementor-button-icon { width: 16px; height: 16px; }
.gp-no-rotate .elementor-button-icon svg { transform: none !important; }
/* ---------- Header ------------------------------------------------------ */
.gp-site #masthead { position: sticky; top: var(--gp-sticky-offset, -32px); z-index: 50; }
.gp-icon-button, .gp-menu-button {
	display: grid;
	place-items: center;
	padding: 7px;
	color: var(--gp-cream);
	background: none;
	border: 0;
	cursor: pointer;
	line-height: 0;
}
.gp-icon-button:hover, .gp-menu-button:hover, .gp-icon-button:focus, .gp-menu-button:focus { background: none; color: var(--gp-copper-light); }
.gp-bag-button { position: relative; }
.gp-cart-count {
	position: absolute;
	top: -1px;
	right: -3px;
	display: grid;
	place-items: center;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: var(--gp-copper);
	color: var(--gp-ink);
	font: 400 9px/1 var(--gp-mono);
}
.gp-cart-count.is-bumped { animation: gp-bump 0.35s var(--gp-ease); }

/* ---------- Buttons ----------------------------------------------------- */
.gp-primary-button,
.gp-btn .elementor-button {
	transition: background 0.18s, transform 0.18s, color 0.18s;
}
.gp-btn .elementor-button:hover { transform: translateY(-2px); }
.gp-btn .elementor-button:active, .gp-primary-button:active, .gp-quick-add:active { transform: scale(0.97); }
.gp-btn .elementor-button-content-wrapper { align-items: center; }
.gp-btn .elementor-button-icon svg, .gp-arrow-icon .elementor-button-icon svg { transform: rotate(-45deg); }
.gp-text-link .elementor-button:hover { transform: none; opacity: 0.8; }

.gp-primary-button {
	display: inline-flex;
	align-items: center;
	gap: 23px;
	padding: 14px 18px;
	border: 0;
	border-radius: 0;
	background: var(--gp-copper);
	color: var(--gp-ink);
	font: 500 11px/normal var(--gp-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
}
.gp-primary-button:hover, .gp-primary-button:focus { background: var(--gp-copper-light); color: var(--gp-ink); transform: translateY(-2px); }
.gp-primary-button[disabled] { opacity: 0.5; cursor: not-allowed; transform: none; }
.gp-primary-button.gp-full { width: 100%; justify-content: space-between; }
.gp-eyebrow {
	margin: 0 0 21px;
	color: var(--gp-copper-light);
	font: 400 10px/normal var(--gp-mono);
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.gp-product-image {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 0.68;
	overflow: hidden;
	isolation: isolate;
	background: #c8bcad;
	border: 1px solid rgba(244, 240, 232, 0.14);
	box-shadow: 0 15px 32px rgba(0, 0, 0, 0.12);
}
.gp-product-image::before {
	content: "";
	position: absolute;
	inset: -24px;
	z-index: -1;
	background: var(--gp-photo) center / cover;
	filter: blur(24px) brightness(0.78);
	opacity: 0.6;
}
.gp-product-image::after {
	content: "";
	position: absolute;
	inset: 12px;
	z-index: 2;
	border: 1px solid rgba(244, 240, 232, 0.24);
	pointer-events: none;
}
.gp-product-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	color: #8b857b;
	font: 400 9px/normal var(--gp-mono);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.gp-swatch { display: inline-block; flex: none; width: 12px; height: 12px; border: 1px solid rgba(244, 240, 232, 0.5); border-radius: 50%; }
@media (max-width: 550px) {.gp-product-image { aspect-ratio: 0.72; }
}
/* Size chips on the size guide */
.gp-size-chip .elementor-heading-title { display: grid; place-items: center; }

/* ---------- Signup form ------------------------------------------------- */
.gp-signup-form { display: flex; flex-direction: column; }
.gp-signup-form > label:not(.gp-consent-label) {
	margin: 15px 0 9px;
	color: var(--gp-ink);
	font: 400 10px/normal var(--gp-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.gp-signup-form > label span { color: #6b6259; text-transform: none; }
.gp-signup-form > input {
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid #a9a096;
	border-radius: 0;
	background: #fffdfa;
	color: var(--gp-ink);
	font: 400 13px/normal var(--gp-mono);
	box-shadow: none;
}
.gp-signup-form > input:focus { outline: 2px solid var(--gp-copper); outline-offset: 1px; border-color: #a9a096; }
.gp-signup-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.gp-consent-label { display: flex; align-items: flex-start; gap: 10px; margin: 22px 0; color: var(--gp-ink); font: 400 11px/1.5 var(--gp-mono); cursor: pointer; }
.gp-consent-label input { flex: none; width: 16px; height: 16px; margin: 1px 0 0; accent-color: var(--gp-copper); }
.gp-signup-form .gp-primary-button { justify-content: space-between; }
.gp-signup-fineprint { margin: 22px 0 0; color: #61594f; font: 400 10px/1.5 var(--gp-mono); }
.gp-signup-error { margin: 0 0 16px; color: #a23c28; font: 400 11px/1.5 var(--gp-mono); }
.gp-signup-success { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-height: 300px; color: var(--gp-ink); }
.gp-signup-success[hidden], .gp-signup-form[hidden] { display: none; }
.gp-signup-success > svg { margin-bottom: 23px; color: #8e512e; }
.gp-signup-success .gp-eyebrow { color: #90532f; }
.gp-signup-success h2 { margin: 0 0 18px; color: var(--gp-ink); font: 700 clamp(34px, 3.6vw, 48px)/1 var(--gp-display); letter-spacing: -0.07em; }
.gp-signup-success > p:not(.gp-eyebrow) { max-width: 385px; color: #5d564f; font-size: 14px; line-height: 1.6; }
.gp-signup-success .gp-primary-button { margin-top: 20px; }

/* ---------- Single product --------------------------------------------- */
.gp-product-breadcrumb {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	color: var(--gp-muted);
	font: 400 10px/normal var(--gp-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.gp-product-breadcrumb a { display: flex; align-items: center; gap: 8px; color: var(--gp-cream); transition: color 0.2s; }
.gp-product-breadcrumb a:hover { color: var(--gp-copper-light); }
@media (max-width: 550px) { .gp-product-breadcrumb > span { display: none; } }

.gp-detail-image { position: relative; display: grid; place-items: center; aspect-ratio: 0.75; overflow: hidden; background: #bdb3a5; }
.gp-detail-image img { width: 100% !important; height: 100% !important; object-fit: contain; }
.gp-detail-image > span {
	position: absolute;
	top: 19px;
	left: 19px;
	padding: 8px 10px;
	background: rgba(17, 16, 14, 0.78);
	color: var(--gp-cream);
	font: 400 9px/normal var(--gp-mono);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
@media (max-width: 800px) { .gp-detail-image { max-height: 750px; } }

.gp-detail-content { padding-top: 20px; }
.gp-detail-content h1 {
	margin: 0 0 25px;
	color: var(--gp-cream);
	font: 800 clamp(42px, 4.3vw, 62px)/1.02 var(--gp-display);
	letter-spacing: -0.072em;
}
.gp-detail-price { margin: 0 0 37px; color: var(--gp-copper-light); font: 500 21px/normal var(--gp-mono); }
.gp-detail-description { max-width: 470px; margin-bottom: 36px; color: #c3bbb0; font-size: 17px; line-height: 1.55; letter-spacing: -0.015em; }
.gp-detail-description p { margin: 0 0 0.8em; }
.gp-detail-row {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 18px 0;
	border-top: 1px solid var(--gp-line);
	font: 400 10px/normal var(--gp-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.gp-detail-row span { margin-right: auto; color: var(--gp-muted); }
.gp-detail-row strong { font-weight: 500; }
.gp-size-fieldset { margin: 0; padding: 20px 0 0; border: 0; border-top: 1px solid var(--gp-line); }
.gp-size-fieldset legend { float: left; width: 100%; margin-bottom: 17px; padding: 0; font: 400 10px/normal var(--gp-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.gp-size-options { clear: both; display: flex; flex-wrap: wrap; gap: 8px; }
.gp-size-choice {
	min-width: 48px;
	min-height: 47px;
	padding: 8px 12px;
	border: 1px solid rgba(244, 240, 232, 0.32);
	border-radius: 0;
	background: none;
	color: var(--gp-cream);
	font: 400 12px/normal var(--gp-mono);
	cursor: pointer;
	transition: background 0.18s, color 0.18s, border-color 0.18s;
}
.gp-size-choice:hover, .gp-size-choice:focus { background: none; color: var(--gp-cream); border-color: var(--gp-copper-light); }
.gp-size-choice.is-active, .gp-size-choice.is-active:hover { background: var(--gp-cream); color: var(--gp-ink); border-color: var(--gp-cream); }
.gp-size-fieldset.is-invalid .gp-size-choice { border-color: var(--gp-copper); }
.gp-fit-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 18px 0 29px;
	padding-bottom: 5px;
	border-bottom: 1px solid var(--gp-muted);
	color: #b5aaa0;
	font: 400 10px/normal var(--gp-mono);
	text-transform: uppercase;
}
.gp-fit-link:hover { color: var(--gp-copper-light); }
.gp-detail-spacer { height: 1px; margin-bottom: 29px; border-top: 1px solid var(--gp-line); }
.gp-detail-add { width: 100%; justify-content: space-between; }
.gp-detail-feedback { display: flex; align-items: center; gap: 7px; min-height: 20px; margin: 13px 0; color: var(--gp-copper-light); font: 400 11px/normal var(--gp-mono); }
.gp-detail-service { margin-top: 37px; border-top: 1px solid var(--gp-line); }
.gp-detail-service > div { padding: 19px 0; border-bottom: 1px solid var(--gp-line); }
.gp-detail-service span { color: var(--gp-copper-light); font: 400 9px/normal var(--gp-mono); letter-spacing: 0.08em; text-transform: uppercase; }
.gp-detail-note, .gp-detail-note p { margin: 11px 0 0; color: #aaa299; font: 400 11px/1.6 var(--gp-mono); }
.gp-detail-note a { color: var(--gp-cream); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 800px) { .gp-detail-content { padding-top: 0; } }
@media (max-width: 550px) { .gp-detail-content h1 { font-size: 39px; } }
@media (max-width: 360px) { .gp-detail-content h1 { font-size: 34px; } }

.gp-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; }
.gp-related-grid a { color: var(--gp-cream); }
.gp-related-grid a > div { aspect-ratio: 0.83; margin-bottom: 15px; overflow: hidden; background: #bdb3a5; }
.gp-related-grid img { width: 100% !important; height: 100% !important; object-fit: cover; transition: transform 0.25s; }
.gp-related-grid a:hover img { transform: scale(1.03); }
.gp-related-grid strong { display: block; font: 700 14px/1.3 var(--gp-display); letter-spacing: -0.02em; }
.gp-related-grid a > span { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; color: var(--gp-copper-light); font: 400 11px/normal var(--gp-mono); }
@media (max-width: 550px) {
	.gp-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.gp-related-grid a:last-child { display: none; }
	.gp-related-grid strong { font-size: 12px; }
}

/* ---------- Cart drawer ------------------------------------------------- */
.gp-cart-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; justify-content: flex-end; background: rgba(0, 0, 0, 0.55); }
.gp-cart-overlay[hidden] { display: none; }
.gp-cart-drawer {
	display: flex;
	flex-direction: column;
	width: min(420px, 100%);
	height: 100%;
	padding: 29px;
	background: var(--gp-cream);
	color: var(--gp-ink);
	animation: gp-slide-in 0.28s var(--gp-ease);
}
.gp-cart-head { display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 20px; border-bottom: 1px solid rgba(17, 16, 14, 0.15); }
.gp-cart-head .gp-eyebrow { margin-bottom: 10px; color: var(--gp-copper); }
.gp-cart-head h2 { margin: 0; color: var(--gp-ink); font: 700 35px/0.95 var(--gp-display); letter-spacing: -0.07em; }
.gp-cart-drawer .gp-icon-button { color: var(--gp-ink); }
.gp-drawer-body { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.gp-empty-cart { display: grid; flex: 1; place-items: center; align-content: center; gap: 19px; color: #766e64; font: 400 12px/normal var(--gp-mono); text-align: center; }
.gp-empty-cart p { margin: 0 0 9px; }
.gp-cart-items { flex: 1; padding-top: 22px; overflow: auto; }
.gp-cart-item { display: flex; gap: 15px; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid rgba(17, 16, 14, 0.12); }
.gp-cart-item > a { flex: none; }
.gp-cart-item img { width: 80px !important; height: 95px !important; object-fit: cover; background: #d2ccc2; }
.gp-cart-item-copy { flex: 1; min-width: 0; }
.gp-cart-item-copy a { color: var(--gp-ink); }
.gp-cart-item-copy h3 { margin: 3px 0 7px; color: var(--gp-ink); font: 600 14px/1.3 var(--gp-display); }
.gp-cart-item-copy a:hover h3 { color: #8e512e; }
.gp-cart-item-copy p { margin: 0; color: #766e64; font: 400 11px/normal var(--gp-mono); }
.gp-quantity { display: flex; align-items: center; gap: 14px; margin-top: 17px; font: 400 11px/normal var(--gp-mono); }
.gp-quantity button { display: grid; place-items: center; width: 23px; height: 23px; padding: 0; border: 1px solid rgba(17, 16, 14, 0.25); border-radius: 0; background: none; color: var(--gp-ink); cursor: pointer; }
.gp-quantity button:hover { background: var(--gp-ink); color: var(--gp-cream); }
.gp-remove-line { display: inline-block; margin-top: 13px; padding: 0 0 2px; border: 0; border-bottom: 1px solid #8b857b; border-radius: 0; background: none; color: #655e56; font: 400 10px/normal var(--gp-mono); letter-spacing: 0.04em; text-transform: uppercase; cursor: pointer; }
.gp-remove-line:hover { background: none; color: var(--gp-ink); }
.gp-cart-line-price { padding-top: 4px; font: 500 11px/normal var(--gp-mono); white-space: nowrap; }
.gp-cart-foot { padding-top: 20px; border-top: 1px solid rgba(17, 16, 14, 0.15); }
.gp-cart-foot > div { display: flex; justify-content: space-between; margin-bottom: 11px; font: 400 11px/normal var(--gp-mono); }
.gp-cart-foot > .gp-cart-estimate { margin: 14px 0; padding-top: 12px; border-top: 1px solid rgba(17, 16, 14, 0.18); font-weight: 700; }
.gp-cart-foot > .gp-cart-estimate strong { font-size: 15px; }
.gp-cart-notice { margin: 0 0 15px; color: #766e64; font: 400 10px/1.5 var(--gp-mono); }
.gp-cart-continue { display: block; margin: 13px auto 0; padding: 0 0 4px; border: 0; border-bottom: 1px solid #91877f; border-radius: 0; background: none; color: #685e55; font: 400 10px/normal var(--gp-mono); letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer; }
.gp-cart-continue:hover, .gp-cart-continue:focus { background: none; color: var(--gp-ink); }
.gp-drawer-body.is-loading { opacity: 0.55; pointer-events: none; transition: opacity 0.2s; }
body.gp-cart-open { overflow: hidden; }
@media (max-width: 550px) {
	.gp-cart-drawer { padding: 20px; }
	.gp-cart-item { gap: 10px; }
	.gp-cart-item img { width: 65px !important; height: 80px !important; }
}
/* ---------- WooCommerce pages (cart / checkout / account) -------------- */
.gp-site .woocommerce, .gp-site .wc-block-components-main, .gp-site .wp-block-woocommerce-checkout, .gp-site .wp-block-woocommerce-cart { color: var(--gp-cream); font-family: var(--gp-mono); }
.gp-site .woocommerce a, .gp-site .wp-block-woocommerce-checkout a, .gp-site .wp-block-woocommerce-cart a { color: var(--gp-copper-light); }
.gp-site .wc-block-components-text-input input, .gp-site .wc-block-components-combobox input, .gp-site .wc-blocks-components-select select, .gp-site .wc-block-components-textarea, .gp-site .woocommerce input.input-text, .gp-site .woocommerce select, .gp-site .woocommerce textarea {
	background: rgba(244, 240, 232, 0.06) !important;
	border: 1px solid rgba(244, 240, 232, 0.22) !important;
	border-radius: 0 !important;
	color: var(--gp-cream) !important;
}
.gp-site .wc-block-components-text-input label, .gp-site .wc-block-components-combobox label, .gp-site .wc-blocks-components-select label { color: var(--gp-muted) !important; }
.gp-site .wc-block-components-button:not(.is-link), .gp-site .woocommerce button.button, .gp-site .woocommerce a.button, .gp-site .woocommerce #place_order {
	background: var(--gp-copper) !important;
	color: var(--gp-ink) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font: 500 11px/normal var(--gp-mono) !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	min-height: 48px;
}
.gp-site .wc-block-components-button:not(.is-link):hover, .gp-site .woocommerce button.button:hover { background: var(--gp-copper-light) !important; }
.gp-site .wc-block-components-sidebar-layout .wc-block-components-sidebar, .gp-site .wp-block-woocommerce-checkout-order-summary-block {
	border: 1px solid var(--gp-line) !important;
	background: rgba(244, 240, 232, 0.035);
}
.gp-site .wc-block-components-panel, .gp-site .wc-block-components-totals-wrapper, .gp-site .wc-block-components-order-summary-item { border-color: var(--gp-line) !important; }
.gp-site .wc-block-components-radio-control__option, .gp-site .wc-block-checkout__shipping-method-option { border-color: var(--gp-line) !important; }
.gp-site .wc-block-components-checkout-step__title, .gp-site .wc-block-components-title { color: var(--gp-cream); font-family: var(--gp-display) !important; letter-spacing: -0.04em; }

/* ---------- Keyframes --------------------------------------------------- */
@keyframes gp-slide-in { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes gp-bump { 50% { transform: scale(1.35); } }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Text links: wrapper hugs the link (no body line-height strut). */
.gp-text-link .elementor-button-wrapper, .elementor-widget-button.gp-text-link { line-height: 0; }
.gp-text-link .elementor-button { display: inline-flex; }

/* ---------- Link colour guard --------------------------------------------
   The Elementor kit styles every link (.elementor-kit-N a / a:hover), which
   outranks single-class component rules. Re-assert component colours here. */
.gp-site a.gp-quick-add,
.gp-site a.gp-quick-add:hover,
.gp-site a.gp-quick-add:focus,
.gp-site a.gp-primary-button,
.gp-site a.gp-primary-button:hover,
.gp-site a.gp-primary-button:focus { color: var(--gp-ink); }
.gp-site .gp-product-breadcrumb a,
.gp-site .gp-related-grid a,
.gp-site .gp-detail-note a { color: var(--gp-cream); }
.gp-site .gp-product-breadcrumb a:hover { color: var(--gp-copper-light); }
.gp-site .gp-related-grid a:hover { color: var(--gp-cream); }
.gp-site a.gp-fit-link { color: #b5aaa0; }
.gp-site a.gp-fit-link:hover { color: var(--gp-copper-light); }
.gp-site .gp-cart-item a,
.gp-site .gp-cart-item a:hover { color: var(--gp-ink); }
.gp-site .gp-cart-item-copy a:hover h3 { color: #8e512e; }