/* Daft Goods: nav, footer and base tokens. */

:root {
	--daft-ink: #2b1d16;
	--daft-paper: #f4ecdf;
	--daft-sage: #8fa58a;
	--daft-sage-deep: #4d5e4a;
	--daft-pink: #f2c3b8;
	--daft-copper: #b4602e;
	--daft-card: #fbf6ec;
	--daft-yellow: #e0a374;
	--daft-red: #b4602e;
	--daft-muted: #7a6656;
	--daft-line: rgba(43, 29, 22, 0.12);
	--daft-radius: 14px;
	--daft-nav-h: 72px;
	--daft-nav-top: var(--wp-admin--admin-bar--height, 0px);
	/* Fonts (Bunny Fonts). Default pairing: Young Serif for display, Instrument Sans for text. */
	--daft-font: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--daft-font-display: "Young Serif", Georgia, "Times New Roman", serif;
	--daft-display-weight: 400;
	--daft-display-tracking: -0.01em;
}

/* Alternative pairings for the font picker preview. */
html[data-font="editorial"] {
	--daft-font: "Hanken Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--daft-font-display: "Gloock", Georgia, serif;
	--daft-display-weight: 400;
	--daft-display-tracking: -0.01em;
}
html[data-font="playful"] {
	--daft-font: "Bricolage Grotesque", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--daft-font-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
	--daft-display-weight: 800;
	--daft-display-tracking: -0.03em;
}

h1, h2, h3, .entry-title, .page-title, .woocommerce-products-header__title {
	font-family: var(--daft-font-display);
	font-weight: var(--daft-display-weight);
	letter-spacing: var(--daft-display-tracking);
}

@media (max-width: 899px) {
	:root { --daft-nav-h: 60px; }
}

body {
	background: var(--daft-paper);
	color: var(--daft-ink);
	font-family: var(--daft-font);
	padding-top: var(--daft-nav-h);
}

/* Pages that run the scroll hero sit under the nav. */
body.daft-hero { padding-top: 0; }

.daft-skip {
	position: absolute;
	left: -9999px;
	z-index: 1001;
}
.daft-skip:focus {
	left: 16px;
	top: calc(var(--daft-nav-top) + 8px);
	background: var(--daft-ink);
	color: var(--daft-paper);
	padding: 8px 14px;
	border-radius: 8px;
}

/* ---------- Nav ---------- */

.daft-nav {
	--daft-nav-reveal: 1;
	position: fixed;
	top: var(--daft-nav-top);
	left: 0;
	right: 0;
	z-index: 1000;
	height: var(--daft-nav-h);
	color: var(--daft-ink);
}

/* The bar behind the nav. The hero scrubs --daft-nav-reveal from 0 to 1. */
.daft-nav__bar {
	position: absolute;
	inset: 0;
	background: rgba(244, 236, 223, 0.9);
	backdrop-filter: saturate(1.4) blur(10px);
	-webkit-backdrop-filter: saturate(1.4) blur(10px);
	border-bottom: 1px solid var(--daft-line);
	opacity: var(--daft-nav-reveal);
}

.daft-nav__inner {
	position: relative;
	height: 100%;
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
}

.daft-nav__left,
.daft-nav__right {
	display: flex;
	align-items: center;
	gap: 6px;
	opacity: var(--daft-nav-reveal);
}
.daft-nav__right { justify-content: flex-end; }

.daft-nav__logo {
	display: block;
	line-height: 0;
	justify-self: center;
}
.daft-nav__logo img {
	height: calc(var(--daft-nav-h) - 18px);
	width: auto;
	display: block;
}

/* Placeholder until the real sign lands in assets/img/. */
.daft-sign-placeholder {
	display: inline-block;
	font-family: var(--daft-font-display);
	font-weight: 900;
	font-size: clamp(16px, 2.2vw, 24px);
	letter-spacing: 0.08em;
	line-height: 1;
	text-transform: uppercase;
	padding: 10px 16px;
	background: var(--daft-yellow);
	color: var(--daft-ink);
	border: 3px solid var(--daft-ink);
	border-radius: 6px;
	box-shadow: 3px 3px 0 var(--daft-ink);
}

/* Hero takeover: before docking, the logo is hidden (the hero's own sign
   overlay stands in for it) and the bar is transparent. */
body.daft-hero .daft-nav:not(.is-docked) { --daft-nav-reveal: 0; }
body.daft-hero .daft-nav:not(.is-docked) .daft-nav__logo { visibility: hidden; }
body.daft-hero .daft-nav:not(.is-docked) .daft-nav__left,
body.daft-hero .daft-nav:not(.is-docked) .daft-nav__right { pointer-events: none; }
body.daft-hero .daft-nav.is-revealing .daft-nav__left,
body.daft-hero .daft-nav.is-revealing .daft-nav__right { pointer-events: auto; }

@media (prefers-reduced-motion: reduce) {
	body.daft-hero .daft-nav { --daft-nav-reveal: 1; }
	body.daft-hero .daft-nav .daft-nav__logo { visibility: visible; }
	body.daft-hero .daft-nav .daft-nav__left,
	body.daft-hero .daft-nav .daft-nav__right { pointer-events: auto; }
}

/* Menu */
.daft-menu {
	display: flex;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.daft-menu > li { position: relative; }
.daft-menu a {
	display: block;
	padding: 8px 12px;
	border-radius: 999px;
	color: inherit;
	text-decoration: none;
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
}
.daft-menu a:hover,
.daft-menu a:focus-visible,
.daft-menu .current-menu-item > a,
.daft-menu .current-menu-ancestor > a { background: rgba(43, 29, 22, 0.07); }

.daft-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 210px;
	margin: 6px 0 0;
	padding: 8px;
	list-style: none;
	background: var(--daft-card);
	border: 1px solid var(--daft-line);
	border-radius: var(--daft-radius);
	box-shadow: 0 12px 30px rgba(22, 20, 18, 0.12);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity 0.15s, transform 0.15s, visibility 0.15s;
}
.daft-menu li:hover > .sub-menu,
.daft-menu li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
}
.daft-menu .sub-menu a { font-weight: 600; border-radius: 8px; }

/* Icons */
.daft-nav__icon,
.daft-nav__toggle {
	position: relative;
	display: inline-grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 999px;
	color: inherit;
	background: transparent;
	border: 0;
	padding: 0;
	cursor: pointer;
}
.daft-nav__icon:hover,
.daft-nav__toggle:hover,
.daft-nav__icon:focus-visible,
.daft-nav__toggle:focus-visible { background: rgba(43, 29, 22, 0.07); color: inherit; }

.daft-nav__count {
	position: absolute;
	top: 3px;
	right: 1px;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--daft-red);
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	line-height: 18px;
	text-align: center;
}
.daft-nav__count[data-count="0"] { display: none; }

.daft-nav__toggle { display: none; }

.daft-nav__currency { margin-right: 4px; font-size: 14px; }
.daft-nav__currency select {
	border: 1px solid var(--daft-line);
	border-radius: 999px;
	padding: 4px 10px;
	background: transparent;
}

.daft-nav__searchform {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	padding: 12px 24px;
	background: var(--daft-card);
	border-bottom: 1px solid var(--daft-line);
}
.daft-nav__searchform input[type="search"] {
	width: 100%;
	max-width: 640px;
	display: block;
	margin: 0 auto;
	padding: 12px 16px;
	border-radius: 999px;
	border: 1px solid var(--daft-line);
	font-size: 16px;
}

@media (max-width: 899px) {
	.daft-nav__inner { padding: 0 12px; gap: 8px; }
	.daft-nav__menu,
	.daft-nav__currency,
	.daft-nav__icon--account { display: none; }
	.daft-nav__toggle { display: inline-grid; }
}

/* Drawer (mobile menu) */
.daft-drawer {
	position: fixed;
	inset: 0;
	z-index: 1002;
	background: rgba(22, 20, 18, 0.4);
}
.daft-drawer[hidden] { display: none; }
.daft-drawer__panel {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: min(86vw, 360px);
	padding: calc(var(--daft-nav-top) + 64px) 24px 24px;
	background: var(--daft-paper);
	overflow-y: auto;
}
.daft-drawer__close {
	position: absolute;
	top: calc(var(--daft-nav-top) + 10px);
	left: 12px;
	width: 42px;
	height: 42px;
	border: 0;
	background: transparent;
	color: var(--daft-ink);
	cursor: pointer;
}
.daft-drawer__menu,
.daft-drawer__menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.daft-drawer__menu > li > a {
	display: block;
	padding: 12px 0;
	font-family: var(--daft-font-display);
	font-size: 22px;
	color: var(--daft-ink);
	text-decoration: none;
}
.daft-drawer__menu .sub-menu { padding: 0 0 10px 12px; }
.daft-drawer__menu .sub-menu a {
	display: block;
	padding: 6px 0;
	color: var(--daft-muted);
	text-decoration: none;
}
.daft-drawer__shop {
	display: inline-block;
	margin-top: 20px;
	padding: 12px 20px;
	border-radius: 999px;
	background: var(--daft-ink);
	color: var(--daft-paper);
	font-weight: 800;
	text-decoration: none;
}

/* ---------- Footer ---------- */

.daft-footer {
	margin-top: 80px;
	background: var(--daft-sage-deep);
	color: var(--daft-paper);
}
.daft-footer__inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 48px 24px 32px;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 32px;
}
.daft-footer__title {
	margin: 0 0 12px;
	font-size: 13px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--daft-yellow);
}
.daft-footer ul { list-style: none; margin: 0; padding: 0; }
.daft-footer li { margin: 0 0 8px; }
.daft-footer a { color: var(--daft-paper); text-decoration: none; }
.daft-footer a:hover,
.daft-footer a:focus-visible { text-decoration: underline; }
.daft-footer__line {
	grid-column: 1 / -1;
	margin: 16px 0 0;
	padding-top: 24px;
	border-top: 1px solid rgba(246, 241, 231, 0.15);
	color: rgba(246, 241, 231, 0.7);
	font-size: 14px;
}

/* ---------- Homepage placeholder hero (replaced by the scroll hero) ---------- */

.daft-hero-placeholder {
	margin: 0 auto 48px;
	padding: clamp(48px, 10vw, 120px) 24px;
	text-align: center;
	background: var(--daft-ink);
	color: var(--daft-paper);
	border-radius: var(--daft-radius);
}
.daft-hero-placeholder__kicker {
	margin: 0 0 12px;
	color: var(--daft-yellow);
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-size: 14px;
}
.daft-hero-placeholder__title {
	margin: 0;
	font-family: var(--daft-font-display);
	font-size: clamp(44px, 9vw, 112px);
	line-height: 0.95;
	text-transform: uppercase;
	color: var(--daft-paper);
}
.daft-hero-placeholder__sub {
	max-width: 560px;
	margin: 20px auto 0;
	font-size: 18px;
	color: rgba(246, 241, 231, 0.8);
}

/* ---------- Kadence overrides: keep pages on the Daft palette ---------- */

.entry-hero .entry-hero-container-inner,
.page-hero-section .entry-hero-container-inner { background: transparent; }
.content-bg,
body.content-style-unboxed .site,
.entry.content-bg { background: var(--daft-card); }
.entry-title,
.archive-title { font-family: var(--daft-font-display); letter-spacing: 0.01em; }
.entry-content a { color: var(--daft-ink); text-decoration-color: var(--daft-red); text-underline-offset: 3px; }