/*
 * KHOR ONE Core — House layer styles.
 *
 * Same tokens as the theme, restated locally so the plugin renders correctly even
 * if it is ever activated under a different theme. Gold is a seasoning: on cream
 * and white it is only ever the deepened antique gold (#925E24), which passes AA;
 * the bright gold (#E2A15A) is reserved for navy grounds.
 */

.kh-house,
.kh-houses,
.kh-provenance {
	--kh-navy: #1a2638;
	--kh-gold: #e2a15a;
	--kh-gold-dark: #925e24;
	--kh-cream: #f3eee4;
	--kh-sand: #ded6c7;
	--kh-muted: #5a616d;
}

/* ---------- Provenance on a product ---------- */

.kh-provenance {
	margin: 24px 0;
	padding-top: 20px;
	border-top: 1px solid var(--kh-sand);
}

.kh-provenance__list {
	display: grid;
	grid-template-columns: minmax(0, 9rem) minmax(0, 1fr);
	gap: 6px 18px;
	margin: 0;
}

.kh-provenance__list dt {
	margin: 0;
	font-family: Jost, system-ui, sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--kh-gold-dark);
}

.kh-provenance__list dd {
	margin: 0;
	font-family: Jost, system-ui, sans-serif;
	font-size: 15px;
	line-height: 1.6;
	color: var(--kh-navy);
}

.kh-provenance__house {
	margin: 16px 0 0;
	font-family: Jost, system-ui, sans-serif;
	font-size: 15px;
	color: var(--kh-navy);
}

.kh-provenance__house a {
	color: var(--kh-navy);
	text-decoration: underline;
	text-decoration-color: var(--kh-gold);
	text-underline-offset: 3px;
}

.kh-provenance__seal {
	color: var(--kh-gold-dark);
	font-size: 13px;
	letter-spacing: 0.04em;
}

/* ---------- House page ---------- */

.kh-house {
	margin: 48px 0 0;
}

.kh-house__head {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	align-items: flex-start;
	justify-content: space-between;
	padding: 32px 0;
	border-top: 1px solid var(--kh-sand);
	border-bottom: 1px solid var(--kh-sand);
}

.kh-house__tagline {
	display: block;
	margin-bottom: 14px;
	font-family: Jost, system-ui, sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--kh-gold-dark);
}

.kh-house__facts {
	display: grid;
	grid-template-columns: minmax(0, 8rem) minmax(0, 1fr);
	gap: 6px 18px;
	margin: 0;
}

.kh-house__facts dt {
	margin: 0;
	font-family: Jost, system-ui, sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--kh-muted);
}

.kh-house__facts dd {
	margin: 0;
	font-family: Jost, system-ui, sans-serif;
	font-size: 16px;
	color: var(--kh-navy);
}

.kh-seal {
	margin: 0;
	text-align: center;
	flex: 0 0 auto;
}

.kh-seal__mark {
	display: block;
	width: 132px;
	height: 132px;
}

.kh-seal__caption {
	margin-top: 10px;
	font-family: Jost, system-ui, sans-serif;
	font-size: 12px;
	line-height: 1.6;
	letter-spacing: 0.06em;
	color: var(--kh-muted);
}

.kh-seal__caption span {
	color: var(--kh-gold-dark);
}

.kh-house__section {
	padding: 44px 0;
	border-bottom: 1px solid var(--kh-sand);
}

.kh-house__section--provenance {
	border-bottom: 0;
}

.kh-house__h {
	margin: 0 0 24px;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-weight: 400;
	font-size: clamp(26px, 3vw, 36px);
	line-height: 1.2;
	color: var(--kh-navy);
}

.kh-house__sub {
	margin: 28px 0 12px;
	font-family: Jost, system-ui, sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--kh-gold-dark);
}

.kh-house__prose p {
	max-width: 68ch;
	font-family: Jost, system-ui, sans-serif;
	font-weight: 300;
	font-size: 17px;
	line-height: 1.7;
	color: var(--kh-navy);
}

.kh-house__lines {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-width: 60ch;
}

.kh-house__lines li {
	font-family: Jost, system-ui, sans-serif;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--kh-navy);
	padding-left: 18px;
	position: relative;
}

.kh-house__lines li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.7em;
	width: 8px;
	height: 1px;
	background: var(--kh-gold);
}

.kh-house__lines a {
	color: var(--kh-navy);
	text-decoration: underline;
	text-decoration-color: var(--kh-gold);
	text-underline-offset: 3px;
}

.kh-house__empty {
	font-family: Jost, system-ui, sans-serif;
	font-size: 16px;
	color: var(--kh-muted);
}

/* The collection grid borrows the shop's card, so it needs no design of its own. */
.kh-house__grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 32px;
}

.kh-house__grid li.product a {
	text-decoration: none;
	display: block;
}

.kh-house__grid img {
	display: block;
	width: 100%;
	height: auto;
}

.kh-house__grid .woocommerce-loop-product__title {
	margin: 14px 0 4px;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-weight: 400;
	font-size: 21px;
	color: var(--kh-navy);
}

.kh-house__grid .price {
	font-family: Jost, system-ui, sans-serif;
	font-size: 16px;
	color: var(--kh-gold-dark);
}

/* ---------- House cards (marketplace homepage) ---------- */

.kh-houses {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 14px;
	margin: 32px 0;
}

.kh-houses__card {
	display: flex;
	gap: 14px;
	align-items: center;
	padding: 22px;
	background: #fff;
	border: 1px solid var(--kh-sand);
	text-decoration: none;
	transition: border-color 0.2s ease;
}

.kh-houses__card:hover {
	border-color: var(--kh-gold);
}

.kh-houses__tile {
	width: 50px;
	height: 50px;
	flex: 0 0 auto;
	background: var(--kh-navy);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.kh-houses__tile img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.kh-houses__body {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.kh-houses__name {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 21px;
	color: var(--kh-navy);
}

.kh-houses__line {
	font-family: Jost, system-ui, sans-serif;
	font-size: 10.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--kh-gold-dark);
}

@media (max-width: 640px) {
	.kh-house__head {
		flex-direction: column;
	}

	.kh-seal {
		align-self: flex-start;
	}

	.kh-provenance__list,
	.kh-house__facts {
		grid-template-columns: 1fr;
		gap: 2px 0;
	}

	.kh-provenance__list dd,
	.kh-house__facts dd {
		margin-bottom: 10px;
	}
}
