/* ==========================================================================
   HugginButt — palette + typography
   Overrides Kadence's --global-palette* custom properties so pages we did
   NOT rebuild (shop archive, single product, cart, checkout) still inherit
   on-brand colors from Kadence's own block styling.
   ========================================================================== */

:root {
	--global-palette1: #a2582c;  /* Accent (rust/copper) */
	--global-palette2: #c9a227;  /* Accent - alt (gold) */
	--global-palette3: #2a2318;  /* Strongest text */
	--global-palette4: #3a3226;  /* Strong text */
	--global-palette5: #5c5240;  /* Medium text */
	--global-palette6: #8a7f68;  /* Subtle text */
	--global-palette7: #ece0c8;  /* Subtle background (parchment) */
	--global-palette8: #f5ecd9;  /* Lighter background */
	--global-palette9: #faf5e8;  /* White/offwhite */
	--global-palette10: #33402f; /* Accent complement (forest green) */
	--global-palette11: #4a7c3f; /* Success */
	--global-palette12: #3d6b8a; /* Info */
	--global-palette13: #b3392c; /* Alert */
	--global-palette14: #c98a1f; /* Warning */
	--global-palette15: #c9a227; /* Rating */

	/* HugginButt-specific tokens */
	--hb-green: #33402f;
	--hb-green-dark: #262f21;
	--hb-cream: #ece0c8;
	--hb-cream-light: #f5ecd9;
	--hb-cream-lighter: #faf5e8;
	--hb-text: #2a2318;
	--hb-text-on-green: #f1e8d0;
	--hb-rust: #a2582c;
	--hb-rust-dark: #8a4623;
	--hb-gold: #c9a227;

	--hb-font-display: 'Cinzel', Georgia, serif;
	--hb-font-body: 'Cormorant Garamond', Georgia, serif;

	--hb-container: 1280px;
	--hb-radius: 6px;
}

/* ==========================================================================
   Base
   ========================================================================== */

/*
 * Deliberately targets only .hb-body (not "p, li" too): color/font-size are
 * inheritable, so descendants pick them up automatically. Adding "p"/"li" to
 * this selector would raise its specificity to (class+type), which then
 * beats single-class overrides like .hb-hero__subheading or
 * .hb-footer__blurb further down this file — exactly the bug that made
 * body copy in the dark-green sections unreadable.
 */
.hb-body {
	font-family: var(--hb-font-body);
	color: var(--hb-text);
	font-size: 1.15rem;
	line-height: 1.6;
}

.hb-body h1,
.hb-body h2,
.hb-body h3,
.hb-body .hb-header__wordmark,
.hb-body .hb-footer__wordmark {
	font-family: var(--hb-font-display);
	letter-spacing: 0.02em;
}

.hb-site {
	overflow-x: hidden;
}

.hb-icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.hb-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 10000;
	background: var(--hb-cream);
	color: var(--hb-text);
	padding: 0.75em 1.25em;
}
.hb-skip-link:focus {
	left: 1em;
	top: 1em;
}

img {
	max-width: 100%;
	height: auto;
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.hb-button {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-family: var(--hb-font-display);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0.9em 1.8em;
	border-radius: var(--hb-radius);
	border: 1px solid transparent;
	transition: transform 0.15s ease, background-color 0.15s ease;
	cursor: pointer;
}
.hb-button:hover {
	transform: translateY(-1px);
}

.hb-button--primary,
.hb-body a.button,
.hb-body button.button,
.hb-body input[type="submit"] {
	background: var(--hb-rust);
	color: var(--hb-cream-lighter) !important;
	border-color: var(--hb-rust);
}
.hb-button--primary:hover,
.hb-body a.button:hover,
.hb-body button.button:hover {
	background: var(--hb-rust-dark);
	border-color: var(--hb-rust-dark);
}

.hb-button--outline {
	background: transparent;
	color: var(--hb-text);
	border-color: var(--hb-text);
}
.hb-button--outline:hover {
	background: var(--hb-text);
	color: var(--hb-cream) !important;
}

.hb-button--small {
	font-size: 0.72rem;
	padding: 0.6em 1.2em;
}

.hb-button__arrow {
	width: 1.1em;
	height: 1.1em;
}

/* ==========================================================================
   Section heading
   ========================================================================== */

.hb-section-heading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.25rem;
	margin: 0 0 2.5rem;
	text-align: center;
}
.hb-section-heading__text {
	font-size: clamp(1.6rem, 2.5vw, 2.2rem);
	margin: 0;
	color: inherit;
}
.hb-section-heading__ornament {
	width: 5.25rem;
	height: 2rem;
	color: var(--hb-gold);
	flex-shrink: 0;
	opacity: .88;
	background: url("../images/generated/ornament-leaf-sprig-v2.png") center / contain no-repeat;
}
.hb-section-heading__ornament svg { display: none; }
.hb-categories .hb-section-heading__ornament,
.hb-about .hb-section-heading__ornament,
.hb-events .hb-section-heading__ornament,
.hb-newsletter .hb-section-heading__ornament {
	background-image: url("../images/generated/ornament-leaf-sprig-green-v2.png");
	opacity: .96;
}
.hb-categories .hb-section-heading__text,
.hb-about .hb-section-heading__text,
.hb-events__heading,
.hb-newsletter__heading {
	color: var(--hb-green-dark);
}
.hb-hero__heading,
.hb-products .hb-section-heading__text,
.hb-testimonials__heading {
	color: var(--hb-gold);
}
.hb-section-heading__ornament:first-child { transform: scaleX(-1); }
.hb-section-heading__ornament:last-child { transform: none; }

/* ==========================================================================
   Announcement bar
   ========================================================================== */

.hb-announcement {
	background: var(--hb-green-dark);
	color: var(--hb-text-on-green);
	padding: 0.5em 1em;
}
.hb-announcement__inner {
	max-width: var(--hb-container);
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	font-family: var(--hb-font-display);
	font-size: 0.72rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
}
.hb-announcement__inner p {
	margin: 0;
	font-size: inherit;
	color: inherit;
}
.hb-announcement__ornament {
	color: var(--hb-gold);
}

/* ==========================================================================
   Header
   ========================================================================== */

.hb-header {
	background: var(--hb-cream);
	border-bottom: 1px solid rgba(42, 35, 24, 0.12);
}
.hb-header__inner {
	max-width: var(--hb-container);
	margin: 0 auto;
	padding: 1rem 1.5rem;
	display: flex;
	align-items: center;
	gap: 1.5rem;
}

.hb-header__brand {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	text-decoration: none;
	color: var(--hb-text);
	margin-right: auto;
}
.hb-header__logo,
.hb-header__logo img {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}
.hb-header__wordmark-group {
	display: flex;
	flex-direction: column;
	line-height: 1.1;
}
.hb-header__wordmark {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--hb-text);
}
.hb-header__tagline {
	font-size: 0.62rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--hb-green);
}

/* Primary nav */
.hb-header__nav {
	flex: 1 1 auto;
}
.hb-nav-menu {
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	margin: 0;
	padding: 0;
}
.hb-nav-menu li {
	position: relative;
}
.hb-nav-menu > li > a {
	display: inline-block;
	padding: 0.5em 0;
	font-family: var(--hb-font-display);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--hb-text);
}
.hb-nav-menu > li > a:hover {
	color: var(--hb-rust);
}
.hb-nav-menu .sub-menu {
	list-style: none;
	margin: 0;
	padding: 0.5rem 0;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 200px;
	background: var(--hb-cream-lighter);
	border: 1px solid rgba(42, 35, 24, 0.12);
	border-radius: var(--hb-radius);
	box-shadow: 0 8px 24px rgba(42, 35, 24, 0.15);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.15s ease, transform 0.15s ease;
	z-index: 100;
}
.hb-nav-menu li:hover > .sub-menu,
.hb-nav-menu li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.hb-nav-menu .sub-menu a {
	display: block;
	padding: 0.5em 1.25em;
	font-family: var(--hb-font-body);
	font-size: 1rem;
	text-transform: none;
	letter-spacing: normal;
	color: var(--hb-text);
	text-decoration: none;
}
.hb-nav-menu .sub-menu a:hover {
	background: var(--hb-cream);
	color: var(--hb-rust);
}
.hb-nav-menu .menu-item-has-children > a::after {
	content: '';
	display: inline-block;
	margin-left: 0.35em;
	width: 0.4em;
	height: 0.4em;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
}

/* Icon cluster */
.hb-header__icons {
	display: flex;
	align-items: center;
	gap: 1.25rem;
}
.hb-header__icon-link {
	position: relative;
	display: inline-flex;
	color: var(--hb-text);
}
.hb-header__icon-link .hb-icon {
	width: 22px;
	height: 22px;
}
.hb-header__icon-link:hover {
	color: var(--hb-rust);
}
.hb-header__cart {
	position: relative;
}
.hugginbutt-cart-count {
	position: absolute;
	top: -8px;
	right: -10px;
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	border-radius: 50%;
	background: var(--hb-rust);
	color: var(--hb-cream-lighter);
	font-family: var(--hb-font-body);
	font-size: 0.65rem;
	line-height: 18px;
	text-align: center;
}

/* Mobile menu toggle (hidden on desktop) */
.hb-header__menu-toggle {
	display: none;
	background: none;
	border: none;
	padding: 0.25rem;
	color: var(--hb-text);
	cursor: pointer;
}
.hb-header__menu-toggle .hb-icon {
	width: 26px;
	height: 26px;
}
.hb-header__menu-icon-close {
	display: none;
}
.hb-header__menu-toggle[aria-expanded="true"] .hb-header__menu-icon-open {
	display: none;
}
.hb-header__menu-toggle[aria-expanded="true"] .hb-header__menu-icon-close {
	display: block;
}

/* ==========================================================================
   Parchment texture + torn edges (tan/cream sections)
   Mottled aged-paper look via layered gradients + a fine noise SVG, with a
   ragged, hand-torn silhouette (an SVG mask, tiled) breaking up the top and
   bottom seams instead of a clean straight line.
   ========================================================================== */

.hb-categories,
.hb-about,
.hb-events,
.hb-newsletter {
	position: relative;
	background-blend-mode: multiply, multiply, multiply, multiply;
	background-repeat: no-repeat, no-repeat, no-repeat, repeat;
	background-image:
		radial-gradient(ellipse 480px 300px at 10% 15%, rgba(120, 92, 48, 0.12), transparent 60%),
		radial-gradient(ellipse 420px 260px at 88% 85%, rgba(120, 92, 48, 0.10), transparent 55%),
		radial-gradient(ellipse 360px 240px at 70% 10%, rgba(120, 92, 48, 0.08), transparent 60%),
		url("../images/decor/parchment-noise.svg");
}
.hb-categories::before,
.hb-categories::after,
.hb-about::before,
.hb-about::after,
.hb-events::before,
.hb-events::after,
.hb-newsletter::before,
.hb-newsletter::after {
	content: '';
	position: absolute;
	left: 0;
	width: 100%;
	height: 26px;
	background-color: inherit;
	-webkit-mask-image: url("../images/decor/torn-edge.svg");
	mask-image: url("../images/decor/torn-edge.svg");
	-webkit-mask-repeat: repeat-x;
	mask-repeat: repeat-x;
	-webkit-mask-size: 60px 26px;
	mask-size: 60px 26px;
	pointer-events: none;
}
.hb-categories::before,
.hb-about::before,
.hb-events::before,
.hb-newsletter::before {
	top: 0;
	transform: translateY(-99%);
}
.hb-categories::after,
.hb-about::after,
.hb-events::after,
.hb-newsletter::after {
	bottom: 0;
	transform: translateY(99%) scaleY(-1);
}

/* ==========================================================================
   Hero
   ========================================================================== */

.hb-hero {
	background: var(--hb-green);
	color: var(--hb-text-on-green);
}
.hb-hero__inner {
	max-width: var(--hb-container);
	margin: 0 auto;
	padding: 4rem 1.5rem;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: center;
}
.hb-hero__ornament {
	position: absolute;
	display: block;
	width: 6.5rem;
	height: 4.75rem;
	right: 2.2rem;
	top: 44%;
	color: var(--hb-gold);
	opacity: .86;
	pointer-events: none;
	background: url("../images/generated/ornament-leaf-branch-v2.png") center / contain no-repeat;
}
.hb-hero__ornament svg { display: none; }
.hb-hero__content { position: relative; }
.hb-about .hb-section-heading__ornament:first-child { display: none; }
.hb-about .hb-section-heading__ornament:last-child { transform: none; }
@media (max-width: 782px) {
	.hb-section-heading__ornament { width: 3.25rem; height: 1.2rem; }
	.hb-hero__ornament { width: 5rem; height: 3.75rem; right: 1.2rem; top: 38%; }
}
.hb-hero__heading {
	font-size: clamp(2.2rem, 4vw, 3.2rem);
	line-height: 1.15;
	margin: 0 0 1rem;
	color: var(--hb-cream-lighter);
}
.hb-hero__subheading {
	max-width: 34em;
	font-size: 1.15rem;
	color: var(--hb-text-on-green);
	opacity: 0.9;
	margin: 0 0 2rem;
}
.hb-hero__media img {
	width: 100%;
	border-radius: var(--hb-radius);
	aspect-ratio: 9 / 7;
	object-fit: cover;
}

/* ==========================================================================
   Shop by category
   ========================================================================== */

.hb-categories {
	background: var(--hb-cream);
}
.hb-categories__inner {
	max-width: var(--hb-container);
	margin: 0 auto;
	padding: 3.5rem 1.5rem 4.5rem;
}
.hb-categories__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 190px)) !important;
	justify-content: center;
	gap: 2rem;
}
.hb-category {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-decoration: none;
	color: var(--hb-text);
}
.hb-category__image {
	display: block;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	overflow: hidden;
	margin-bottom: 1rem;
	background: var(--hb-cream-light);
	border: 1px solid rgba(42, 35, 24, 0.1);
}
.hb-category__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.hb-category__name {
	font-family: var(--hb-font-display);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-size: 0.9rem;
}
.hb-category__cta {
	font-size: 0.8rem;
	color: var(--hb-rust);
}

/* ==========================================================================
   Featured products
   ========================================================================== */

.hb-products {
	background: var(--hb-green);
	color: var(--hb-text-on-green);
}
.hb-products .hb-section-heading__text {
	color: var(--hb-cream-lighter);
}
.hb-products__inner {
	max-width: var(--hb-container);
	margin: 0 auto;
	padding: 4rem 1.5rem;
}
.hb-products__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
}
.hb-product-card {
	background: var(--hb-cream-lighter);
	border-radius: var(--hb-radius);
	overflow: hidden;
	color: var(--hb-text);
	padding-bottom: 1.25rem;
	text-align: center;
}
.hb-product-card__media {
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}
.hb-product-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.hb-product-card__name {
	font-size: 1.05rem;
	margin: 1rem 1rem 0.4rem;
}
.hb-product-card__name a {
	color: var(--hb-text);
	text-decoration: none;
}
.hb-product-card__price {
	font-family: var(--hb-font-display);
	color: var(--hb-rust);
	margin-bottom: 0.9rem;
}
.hb-product-card__cta,
.hb-product-card .hb-button {
	margin: 0 1rem;
}
.hb-product-card .add_to_cart_button,
.hb-product-card .ajax_add_to_cart {
	display: inline-flex;
	align-items: center;
	font-family: var(--hb-font-display);
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0.7em 1.4em;
	border-radius: var(--hb-radius);
	background: var(--hb-rust);
	color: var(--hb-cream-lighter) !important;
}
.hb-product-card .add_to_cart_button:hover {
	background: var(--hb-rust-dark);
}
.hb-product-card--placeholder {
	opacity: 0.9;
}

/* ==========================================================================
   About us
   ========================================================================== */

.hb-about {
	background: var(--hb-cream);
}
.hb-about__inner {
	max-width: var(--hb-container);
	margin: 0 auto;
	padding: 4.5rem 1.5rem;
	display: grid;
	grid-template-columns: 0.85fr 1fr;
	gap: 3rem;
	align-items: center;
}
.hb-about__media img {
	width: 100%;
	border-radius: var(--hb-radius);
	aspect-ratio: 0.88;
	object-fit: cover;
}
.hb-about .hb-section-heading {
	justify-content: flex-start;
	text-align: left;
	margin-bottom: 1.5rem;
}
.hb-about__content p {
	margin: 0 0 1.25rem;
}
.hb-about__features {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	margin-top: 2rem;
}
.hb-about-feature {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.4rem;
}
.hb-about-feature__icon {
	width: 34px;
	height: 34px;
	color: var(--hb-rust);
}
.hb-about-feature__label {
	font-family: var(--hb-font-display);
	font-size: 0.82rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}
.hb-about-feature__sub {
	font-size: 0.8rem;
	color: var(--hb-green);
}

/* ==========================================================================
   Events
   ========================================================================== */

.hb-events {
	background: var(--hb-cream-light);
}
.hb-events__inner {
	max-width: var(--hb-container);
	margin: 0 auto;
	padding: 4.5rem 1.5rem;
	display: grid;
	grid-template-columns: 0.7fr 1.6fr;
	gap: 3rem;
	align-items: center;
}
.hb-events__heading {
	font-size: clamp(1.6rem, 2.5vw, 2rem);
	margin: 0 0 1rem;
}
.hb-events__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}
.hb-event-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: var(--hb-radius);
	overflow: hidden;
	margin-bottom: 0.75rem;
}
.hb-event-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.hb-event-card__date {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	background: var(--hb-green-dark);
	color: var(--hb-cream-lighter);
	font-family: var(--hb-font-display);
	font-size: 0.6rem;
	letter-spacing: 0.06em;
	padding: 0.3em 0.6em;
	border-radius: 3px;
}
.hb-event-card__name {
	font-size: 0.95rem;
	margin: 0 0 0.2rem;
}
.hb-event-card__location {
	font-size: 0.85rem;
	color: var(--hb-green);
	margin: 0;
}

/* ==========================================================================
   Split band: testimonials / mascot / newsletter
   ========================================================================== */

.hb-split-band {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: stretch;
}
.hb-testimonials {
	background: var(--hb-green);
	color: var(--hb-text-on-green);
	padding: 3.5rem 2.5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.hb-testimonials__heading {
	font-size: 1.4rem;
	margin: 0 0 1.5rem;
	color: var(--hb-cream-lighter);
}
.hb-testimonial-slide {
	display: none;
	margin: 0;
}
.hb-testimonial-slide.is-active {
	display: block;
}
.hb-testimonial-slide__quote {
	font-size: 1.2rem;
	font-style: italic;
	margin: 0 0 1rem;
}
.hb-testimonial-slide__author {
	display: block;
	font-style: normal;
	font-weight: 600;
	margin-bottom: 0.5rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	font-size: 0.85rem;
}
.hb-stars {
	display: inline-flex;
	gap: 0.15em;
	color: var(--hb-gold);
}
.hb-stars__star {
	width: 16px;
	height: 16px;
}
.hb-testimonial-carousel__dots {
	display: flex;
	gap: 0.5rem;
	margin-top: 1.5rem;
}
.hb-testimonial-carousel__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	border: none;
	background: rgba(241, 232, 208, 0.35);
	padding: 0;
	cursor: pointer;
}
.hb-testimonial-carousel__dot.is-active {
	background: var(--hb-cream-lighter);
}

.hb-split-band__mascot {
	background: var(--hb-cream);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem;
}
.hb-split-band__mascot img {
	width: 180px;
	height: 180px;
	object-fit: contain;
}

.hb-newsletter {
	background: var(--hb-cream);
	padding: 3.5rem 2.5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.hb-newsletter__heading {
	font-size: 1.4rem;
	margin: 0 0 1rem;
}
.hb-newsletter__form {
	display: flex;
	gap: 0.75rem;
	margin-top: 1rem;
	flex-wrap: wrap;
}
.hb-newsletter__form input[type="email"] {
	flex: 1 1 200px;
	padding: 0.8em 1em;
	border: 1px solid rgba(42, 35, 24, 0.25);
	border-radius: var(--hb-radius);
	font-family: var(--hb-font-body);
	font-size: 1rem;
	background: var(--hb-cream-lighter);
	color: var(--hb-text);
}

/* ==========================================================================
   Footer
   ========================================================================== */

.hb-footer {
	background: var(--hb-green-dark);
	color: var(--hb-text-on-green);
}
.hb-footer__inner {
	max-width: var(--hb-container);
	margin: 0 auto;
	padding: 4rem 1.5rem 2.5rem;
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr 1.2fr;
	gap: 2rem;
}
.hb-footer__logo {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-bottom: 1rem;
}
.hb-footer__logo img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
}
.hb-footer__wordmark {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--hb-cream-lighter);
}
.hb-footer__blurb {
	font-size: 0.95rem;
	opacity: 0.85;
	margin: 0 0 1.25rem;
}
.hb-footer__social {
	display: flex;
	gap: 0.75rem;
}
.hb-footer__social-link {
	display: inline-flex;
	width: 30px;
	height: 30px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	border: 1px solid rgba(241, 232, 208, 0.35);
	color: var(--hb-text-on-green);
}
.hb-footer__social-link .hb-icon {
	width: 15px;
	height: 15px;
}
.hb-footer__heading {
	font-size: 0.85rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--hb-gold);
	margin: 0 0 1rem;
}
.hb-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
}
.hb-footer__menu li {
	margin-bottom: 0.6rem;
}
.hb-footer__menu a {
	color: var(--hb-text-on-green);
	text-decoration: none;
	font-size: 0.92rem;
	opacity: 0.85;
}
.hb-footer__menu a:hover {
	opacity: 1;
	color: var(--hb-gold);
}
.hb-footer__col p {
	font-size: 0.92rem;
	margin: 0 0 0.6rem;
	opacity: 0.85;
}
.hb-footer__col a {
	color: var(--hb-cream-lighter);
}
.hb-footer__bottom {
	border-top: 1px solid rgba(241, 232, 208, 0.15);
	max-width: var(--hb-container);
	margin: 0 auto;
	padding: 1.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
	font-size: 0.82rem;
	opacity: 0.8;
}
.hb-footer__bottom p {
	margin: 0;
}
.hb-footer__legal {
	display: flex;
	gap: 1.5rem;
}
.hb-footer__legal a {
	color: var(--hb-text-on-green);
	text-decoration: none;
}
.hb-footer__legal a:hover {
	color: var(--hb-gold);
}

/* ==========================================================================
   Shop filter sidebar (shop / product category pages)
   Rides on Kadence's existing #primary/.primary-sidebar left-sidebar grid
   (triggered via the kadence_post_layout filter) — only the widget
   appearance itself needs brand styling here.
   ========================================================================== */

.primary-sidebar .hb-shop-filter-widget {
	background: var(--hb-cream);
	border: 1px solid rgba(42, 35, 24, 0.12);
	border-radius: var(--hb-radius);
	padding: 1.5rem;
	margin-bottom: 1.5rem;
}
.primary-sidebar .hb-shop-filter-widget__title {
	font-family: var(--hb-font-display);
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--hb-green);
	margin: 0 0 1rem;
	padding-bottom: 0.6rem;
	border-bottom: 1px solid rgba(42, 35, 24, 0.15);
}

.primary-sidebar .product-categories {
	list-style: none;
	margin: 0;
	padding: 0;
}
.primary-sidebar .product-categories li {
	margin-bottom: 0.5rem;
}
.primary-sidebar .product-categories a {
	color: var(--hb-text);
	text-decoration: none;
	font-size: 0.98rem;
}
.primary-sidebar .product-categories a:hover {
	color: var(--hb-rust);
}
.primary-sidebar .product-categories .count {
	color: var(--hb-green);
	font-size: 0.85rem;
}
.primary-sidebar .product-categories .current-cat > a {
	color: var(--hb-rust);
	font-weight: 600;
}

.primary-sidebar .price_slider {
	margin-bottom: 1rem;
}
.primary-sidebar .price_slider_amount {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 0.85rem;
}
.primary-sidebar .price_slider_amount .button {
	font-family: var(--hb-font-display);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 0.5em 1em;
	border-radius: var(--hb-radius);
	background: var(--hb-rust);
	color: var(--hb-cream-lighter) !important;
	border: none;
}
.primary-sidebar .price_slider_amount .button:hover {
	background: var(--hb-rust-dark);
}
.primary-sidebar .ui-slider {
	position: relative;
	height: 4px;
	background: rgba(42, 35, 24, 0.15);
	border-radius: 3px;
	margin: 1rem 0.5rem 1.5rem;
}
.primary-sidebar .ui-slider-range {
	position: absolute;
	top: 0;
	height: 100%;
	background: var(--hb-rust);
	border-radius: 3px;
}
.primary-sidebar .ui-slider-handle {
	position: absolute;
	top: 50%;
	width: 16px;
	height: 16px;
	margin-left: -8px;
	transform: translateY(-50%);
	background: var(--hb-gold);
	border: 2px solid var(--hb-cream-lighter);
	border-radius: 50%;
	cursor: pointer;
	outline: none;
}

/* ==========================================================================
   Celtic vine flourish (dark green sections)
   A hand-drawn corner vine sits in the bottom-left/bottom-right of each
   green section for a little extra flare; content is pulled onto its own
   stacking layer so the vine (low opacity, behind) never fights the text.
   ========================================================================== */

.hb-hero,
.hb-products,
.hb-testimonials,
.hb-footer {
	position: relative;
	overflow: hidden;
}
.hb-hero::before,
.hb-hero::after,
.hb-products::before,
.hb-products::after,
.hb-testimonials::before,
.hb-testimonials::after,
.hb-footer::before,
.hb-footer::after {
	content: '';
	position: absolute;
	bottom: 0;
	width: 160px;
	height: 160px;
	background-image: url("../images/decor/celtic-vine.svg");
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: contain;
	opacity: 0.35;
	pointer-events: none;
	z-index: 0;
}
.hb-hero::before,
.hb-products::before,
.hb-testimonials::before,
.hb-footer::before {
	left: 0;
}
.hb-hero::after,
.hb-products::after,
.hb-testimonials::after,
.hb-footer::after {
	right: 0;
	transform: scaleX(-1);
}

.hb-hero__inner,
.hb-products__inner,
.hb-testimonials__heading,
.hb-testimonial-carousel,
.hb-footer__inner,
.hb-footer__bottom {
	position: relative;
	z-index: 1;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1024px) {
	.hb-categories__grid {
		grid-template-columns: repeat(3, 1fr);
	}
	.hb-products__grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.hb-events__grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.hb-footer__inner {
		grid-template-columns: repeat(2, 1fr);
	}
	.hb-split-band {
		grid-template-columns: 1fr;
	}
	.hb-split-band__mascot {
		order: -1;
		padding: 1.5rem;
	}
	.hb-split-band__mascot img {
		width: 110px;
		height: 110px;
	}
}

@media (max-width: 782px) {
	.hb-hero::before,
	.hb-hero::after,
	.hb-products::before,
	.hb-products::after,
	.hb-testimonials::before,
	.hb-testimonials::after,
	.hb-footer::before,
	.hb-footer::after {
		width: 90px;
		height: 90px;
		opacity: 0.25;
	}

	.hb-header__menu-toggle {
		display: inline-flex;
	}
	.hb-header__nav {
		flex-basis: 100%;
		order: 3;
		display: none;
	}
	.hb-header__inner {
		flex-wrap: wrap;
	}
	.hb-header__nav.is-open {
		display: block;
	}
	.hb-nav-menu {
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		padding: 1rem 0;
	}
	.hb-nav-menu > li {
		width: 100%;
	}
	.hb-nav-menu .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: none;
		display: none;
		padding-left: 1rem;
	}
	.hb-nav-menu li.is-open > .sub-menu {
		display: block;
	}

	.hb-hero__inner,
	.hb-about__inner,
	.hb-events__inner {
		grid-template-columns: 1fr;
	}
	.hb-hero__content {
		order: 1;
	}
	.hb-hero__media {
		order: 0;
	}
	.hb-categories__grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.hb-products__grid {
		grid-template-columns: 1fr 1fr;
	}
	.hb-events__grid {
		grid-template-columns: 1fr;
	}
	.hb-about__features {
		grid-template-columns: repeat(2, 1fr);
	}
	.hb-footer__inner {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {
	.hb-categories__grid,
	.hb-products__grid {
		grid-template-columns: 1fr;
	}
}

/* 2026 visual refinement — closer to the supplied storybook storefront */
:root {
	--hb-green: #303722; --hb-green-dark: #202619;
	--hb-cream: #e8d4ac; --hb-cream-light: #f0dfba; --hb-cream-lighter: #f4e8cd;
	--hb-text: #251f16; --hb-text-on-green: #e8d8b4;
	--hb-rust: #71401f; --hb-rust-dark: #553018; --hb-gold: #9b7729;
	--hb-container: 1440px; --hb-radius: 2px;
}
.hb-body { background: #1f2518; font-size: 1.05rem; }
.hb-announcement { padding-block: .35em; background-image: linear-gradient(90deg, rgba(155,119,41,.08), transparent 35%, transparent 65%, rgba(155,119,41,.08)); }
.hb-announcement__inner { font-size: .8rem; letter-spacing: .035em; text-transform: none; }
.hb-header { box-shadow: 0 2px 10px rgba(25,20,12,.22); }
.hb-header__inner { padding-block: .65rem; }
.hb-header__logo, .hb-header__logo img { width: 72px; height: 72px; border-radius: 0; }
.hb-header__wordmark { font-size: 2rem; letter-spacing: -.035em; }
.hb-header__tagline { font-size: .58rem; }
.hb-nav-menu { gap: 2.4rem; }
.hb-nav-menu > li > a { font-size: .75rem; }
.hb-hero__inner { padding: 0; grid-template-columns: 40% 60%; gap: 0; }
.hb-hero__content { padding: 3.2rem 4rem; }
.hb-hero__heading { max-width: 9ch; font-size: clamp(2.8rem, 5vw, 4.6rem); line-height: 1.02; text-transform: uppercase; }
.hb-hero__media, .hb-hero__media img { height: 100%; }
.hb-hero__media img { min-height: 440px; border-radius: 0; aspect-ratio: 1.65 / 1; }
.hb-categories__inner { padding-block: 2.4rem 3rem; }
.hb-section-heading { margin-bottom: 1.6rem; }
.hb-categories__grid { gap: 1.4rem; }
.hb-category__image { width: min(170px, 100%); height: auto; aspect-ratio: 1; margin-bottom: .6rem; border: 2px solid rgba(65,48,25,.25); box-shadow: inset 0 0 0 3px rgba(240,223,186,.18); }
.hb-category__name { font-size: .95rem; }
.hb-products__inner { padding-block: 2.4rem 3rem; }
.hb-products__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .85rem; }
.hb-product-card { padding-bottom: .75rem; background: rgba(232,212,172,.08); color: var(--hb-text-on-green); border: 1px solid rgba(201,162,39,.58); }
.hb-product-card__name { font-size: .85rem; line-height: 1.2; margin: .7rem .45rem .2rem; }
.hb-product-card__name a, .hb-product-card__price { color: var(--hb-text-on-green); }
.hb-product-card__price { font-size: .85rem; margin-bottom: .45rem; }
.hb-product-card .add_to_cart_button, .hb-product-card .ajax_add_to_cart, .hb-product-card .hb-button { font-size: .62rem; padding: .55em .8em; }
.hb-about__inner { padding-block: 3rem; grid-template-columns: 46% 54%; gap: 2.5rem; }
.hb-about__media img { aspect-ratio: 1.35 / 1; border-radius: 0; object-fit: contain; }
.hb-events__inner { padding-block: 3rem; grid-template-columns: .75fr 2fr; gap: 2rem; }
.hb-events__grid { gap: 1rem; }
.hb-event-card__media { border: 2px solid rgba(63,49,28,.25); }
.hb-split-band { grid-template-columns: 1fr 260px 1fr; }
.hb-testimonials, .hb-newsletter { padding-block: 2.5rem; }
.hb-footer__inner { padding-block: 2.5rem 1.5rem; }
.hb-split-band__mascot { padding: 0; overflow: hidden; }
.hb-split-band__mascot img { width: 260px; height: 100%; min-height: 260px; object-fit: cover; object-position: center; border-radius: 0; }
@media (max-width: 1180px) {
	.hb-products__grid { grid-template-columns: repeat(3, 1fr); }
	.hb-hero__content { padding: 2.75rem; }
	.hb-header__wordmark { font-size: 1.65rem; }
	.hb-nav-menu { gap: 1.2rem; }
}
@media (max-width: 782px) {
	.hb-header__logo, .hb-header__logo img { width: 54px; height: 54px; }
	.hb-header__wordmark { font-size: 1.4rem; }
	.hb-hero__inner { grid-template-columns: 1fr; }
	.hb-hero__content { padding: 2.5rem 1.5rem 3rem; }
	.hb-hero__heading { font-size: clamp(2.5rem, 12vw, 4rem); }
	.hb-hero__media img { min-height: 280px; }
	.hb-products__grid { grid-template-columns: repeat(2, 1fr); }
	.hb-about__inner, .hb-events__inner { grid-template-columns: 1fr; }
	.hb-split-band { grid-template-columns: 1fr; }
	.hb-split-band__mascot img { width: 100%; height: 240px; min-height: 0; }
}
@media (max-width: 480px) {
	.hb-products__grid { grid-template-columns: 1fr 1fr; }
	.hb-category__image { width: 130px; }
}

/* =======================================================================
   Material pass: aged papyrus and woven forest-green surfaces
   ======================================================================= */

.hb-header,
.hb-categories,
.hb-about,
.hb-events,
.hb-newsletter {
	background-color: var(--hb-cream);
	background-image:
		linear-gradient(90deg, rgba(82, 55, 24, .12), transparent 4%, transparent 96%, rgba(82, 55, 24, .13)),
		radial-gradient(ellipse 520px 320px at 8% 18%, rgba(105, 72, 33, .16), transparent 64%),
		radial-gradient(ellipse 460px 290px at 92% 82%, rgba(112, 77, 35, .14), transparent 62%),
		radial-gradient(ellipse 300px 180px at 68% 9%, rgba(118, 83, 42, .09), transparent 65%),
		url("../images/decor/parchment-noise.svg");
	background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat;
	background-size: auto, auto, auto, auto, 320px 320px;
	background-blend-mode: multiply, multiply, multiply, multiply, multiply;
	box-shadow: inset 0 1px rgba(255, 247, 221, .35), inset 0 -1px rgba(76, 49, 20, .16);
}

.hb-events { background-color: var(--hb-cream-light); }

.hb-hero,
.hb-products,
.hb-testimonials,
.hb-footer,
.hb-announcement {
	background-image:
		radial-gradient(ellipse 720px 420px at 15% 30%, rgba(141, 129, 75, .11), transparent 67%),
		radial-gradient(ellipse 620px 380px at 88% 78%, rgba(7, 12, 5, .30), transparent 70%),
		linear-gradient(112deg, rgba(255,255,255,.025), transparent 38%, rgba(0,0,0,.09)),
		url("../images/decor/green-cloth.svg");
	background-repeat: no-repeat, no-repeat, no-repeat, repeat;
	background-size: auto, auto, auto, 360px 360px;
	background-blend-mode: soft-light, multiply, overlay, soft-light;
}

.hb-hero { background-color: var(--hb-green); }
.hb-products,
.hb-testimonials { background-color: var(--hb-green); }
.hb-announcement,
.hb-footer { background-color: var(--hb-green-dark); }

.hb-categories,
.hb-about,
.hb-events {
	isolation: isolate;
	z-index: 2;
}

.hb-categories::before,
.hb-categories::after,
.hb-about::before,
.hb-about::after,
.hb-events::before,
.hb-events::after {
	height: 34px;
	background-color: inherit;
	background-image: url("../images/decor/parchment-noise.svg");
	background-repeat: repeat;
	background-size: 320px 320px;
	-webkit-mask-size: 240px 34px;
	mask-size: 240px 34px;
	opacity: .99;
	z-index: 2;
}

.hb-categories::before,
.hb-about::before,
.hb-events::before {
	filter: drop-shadow(0 -2px 1px rgba(27, 24, 15, .34));
}

.hb-categories::after,
.hb-about::after,
.hb-events::after {
	filter: drop-shadow(0 3px 2px rgba(22, 19, 12, .38));
}

.hb-categories__inner,
.hb-about__inner,
.hb-events__inner {
	position: relative;
	z-index: 3;
}

.hb-newsletter::before,
.hb-newsletter::after { display: none; }

@media (max-width: 782px) {
	.hb-categories::before,
	.hb-categories::after,
	.hb-about::before,
	.hb-about::after,
	.hb-events::before,
	.hb-events::after {
		height: 24px;
		-webkit-mask-size: 170px 24px;
		mask-size: 170px 24px;
	}
}

/* Final material layer: placed last so older transition rules cannot win. */
:root {
	--hb-cream: #dcc18c;
	--hb-cream-light: #e5cd9d;
	--hb-cream-lighter: #f0dfbb;
}

.hb-header,
.hb-categories,
.hb-about,
.hb-newsletter {
	background-color: #dcc18c;
	background-image:
		linear-gradient(90deg, rgba(75,45,18,.18), transparent 5%, transparent 94%, rgba(75,45,18,.16)),
		radial-gradient(ellipse 560px 350px at 7% 12%, rgba(105,65,24,.22), transparent 64%),
		radial-gradient(ellipse 500px 330px at 91% 87%, rgba(112,69,27,.19), transparent 64%),
		radial-gradient(ellipse 340px 210px at 66% 7%, rgba(128,83,37,.13), transparent 62%),
		url("../images/decor/parchment-noise.svg");
	background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat;
	background-size: auto, auto, auto, auto, 320px 320px;
	background-blend-mode: multiply, multiply, multiply, multiply, multiply;
}

.hb-events {
	background-color: #e5cd9d;
	background-image:
		linear-gradient(90deg, rgba(75,45,18,.15), transparent 5%, transparent 94%, rgba(75,45,18,.14)),
		radial-gradient(ellipse 600px 360px at 10% 18%, rgba(105,65,24,.18), transparent 66%),
		radial-gradient(ellipse 520px 300px at 88% 82%, rgba(112,69,27,.16), transparent 64%),
		url("../images/decor/parchment-noise.svg");
	background-repeat: no-repeat, no-repeat, no-repeat, repeat;
	background-size: auto, auto, auto, 320px 320px;
	background-blend-mode: multiply, multiply, multiply, multiply;
}

.hb-categories::before,
.hb-categories::after,
.hb-about::before,
.hb-about::after,
.hb-events::before,
.hb-events::after {
	height: 24px;
	background-color: inherit;
	background-image: url("../images/decor/parchment-noise.svg");
	background-repeat: repeat;
	background-size: 320px 320px;
	-webkit-mask-image: url("../images/decor/torn-paper-mask-v2.png");
	mask-image: url("../images/decor/torn-paper-mask-v2.png");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}

.hb-categories::before,
.hb-about::before {
	transform: translateY(-100%);
	filter: drop-shadow(0 -1px 1px rgba(35,25,13,.22));
}

.hb-categories::after,
.hb-events::after {
	transform: translateY(100%) scaleY(-1);
	filter: drop-shadow(0 1px 1px rgba(35,25,13,.24));
}

.hb-about::after,
.hb-events::before { display: none; }

@media (max-width: 782px) {
	.hb-categories::before,
	.hb-categories::after,
	.hb-about::before,
	.hb-events::after {
		height: 16px;
		-webkit-mask-size: 100% 100%;
		mask-size: 100% 100%;
	}
}

/* Cohesive announcement and parchment masthead. */
.hb-announcement {
	min-height: 32px;
	padding: .28rem 1rem;
	border-bottom: 1px solid rgba(167,133,61,.34);
	box-shadow: inset 0 -1px rgba(0,0,0,.24);
}
.hb-announcement__inner {
	gap: .85rem;
	font-family: var(--hb-font-body);
	font-size: .88rem;
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: .045em;
	text-transform: none !important;
}
.hb-announcement__inner p { text-transform: none !important; }
.hb-announcement__ornament { font-size: 0; color: var(--hb-gold); }
.hb-announcement__ornament::before { content: '\2726'; font-size: .7rem; }
.hb-header {
	background-color: #cfad73 !important;
	background-image:
		linear-gradient(90deg, rgba(74,43,16,.20), transparent 7%, transparent 92%, rgba(74,43,16,.18)),
		url("../images/decor/parchment-noise.svg") !important;
	background-repeat: no-repeat, repeat !important;
	background-size: 100% 100%, 320px 320px !important;
	background-position: 0 0, 0 0 !important;
	background-blend-mode: multiply, multiply !important;
	border: 0;
	border-bottom: 1px solid rgba(79,48,19,.30);
	box-shadow: 0 5px 14px rgba(24,20,12,.22);
}
.hb-header__inner { background: transparent !important; }
.hb-header__inner { min-height: 98px; padding-block: .7rem; }
.hb-header__logo,
.hb-header__logo .custom-logo-link,
.hb-header__logo img {
	display: block;
	width: 76px;
	height: 76px;
	border-radius: 50%;
}
.hb-header__logo {
	flex: 0 0 76px;
	overflow: hidden;
	border: 2px solid #9b7729;
	box-shadow: 0 2px 8px rgba(40,27,13,.30), inset 0 0 0 2px rgba(245,224,177,.22);
}
.hb-header__logo img { object-fit: cover; }
.hb-header__wordmark { color: #281e12; text-shadow: 0 1px rgba(255,244,210,.48); }
.hb-header__tagline { color: #5a4827; }
.hb-header__icon-link,
.hb-nav-menu > li > a { color: #281e12; }
@media (max-width: 782px) {
	.hb-announcement__inner { font-size: .76rem; }
	.hb-header__inner { min-height: 78px; }
	.hb-header__logo,
	.hb-header__logo .custom-logo-link,
	.hb-header__logo img { width: 58px; height: 58px; }
	.hb-header__logo { flex-basis: 58px; }
}

/* Generated photographic alpha mask: one non-repeating torn edge per seam. */
.hb-categories::before,
.hb-categories::after,
.hb-about::before,
.hb-about::after,
.hb-events::before,
.hb-events::after {
	height: 24px;
	-webkit-mask-image: url("../images/decor/torn-paper-mask-v2.png");
	mask-image: url("../images/decor/torn-paper-mask-v2.png");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}

.hb-categories::before,
.hb-about::before {
	transform: translateY(-100%);
	filter: drop-shadow(0 -1px 1px rgba(38, 29, 17, .22));
}

.hb-categories::after,
.hb-events::after {
	transform: translateY(100%) scaleY(-1);
	filter: drop-shadow(0 1px 1px rgba(38, 29, 17, .24));
}

@media (max-width: 782px) {
	.hb-categories::before,
	.hb-categories::after,
	.hb-about::before,
	.hb-events::after {
		height: 16px;
		-webkit-mask-size: 100% 100%;
		mask-size: 100% 100%;
	}
}

/* Cleaner transitions: restrained paper tears only at paper/green seams. */
.hb-hero::before,
.hb-hero::after,
.hb-products::before,
.hb-products::after,
.hb-testimonials::before,
.hb-testimonials::after,
.hb-footer::before,
.hb-footer::after {
	display: none;
}

.hb-categories::before,
.hb-categories::after,
.hb-about::before,
.hb-about::after,
.hb-events::before,
.hb-events::after {
	height: 14px;
	-webkit-mask-size: 240px 14px;
	mask-size: 240px 14px;
	filter: none;
}

.hb-categories::before,
.hb-about::before {
	transform: translateY(-92%);
	filter: drop-shadow(0 -1px 0 rgba(34, 27, 16, .26));
}

.hb-categories::after,
.hb-events::after {
	transform: translateY(92%) scaleY(-1);
	filter: drop-shadow(0 1px 0 rgba(34, 27, 16, .28));
}

/* These sections meet paper-to-paper, so a second ripped edge looks messy. */
.hb-about::after,
.hb-events::before {
	display: none;
}

@media (max-width: 782px) {
	.hb-categories::before,
	.hb-categories::after,
	.hb-about::before,
	.hb-events::after {
		height: 10px;
		-webkit-mask-size: 180px 10px;
		mask-size: 180px 10px;
	}
}

/* One continuous paper surface: body and torn extension share one recipe. */
.hb-header,
.hb-categories,
.hb-about,
.hb-newsletter { --hb-paper-surface: #dcc18c; }

.hb-events { --hb-paper-surface: #e5cd9d; }

.hb-header,
.hb-categories,
.hb-about,
.hb-events,
.hb-newsletter {
	background-color: var(--hb-paper-surface);
	background-image:
		linear-gradient(90deg, rgba(79,48,19,.14), transparent 5%, transparent 94%, rgba(79,48,19,.13)),
		url("../images/decor/parchment-noise.svg");
	background-repeat: no-repeat, repeat;
	background-size: 100% 100%, 320px 320px;
	background-position: 0 0, 0 0;
	background-blend-mode: multiply, multiply;
	box-shadow: none;
}

.hb-header {
	border: 0;
	border-bottom: 1px solid rgba(79,48,19,.30);
	box-shadow: 0 5px 14px rgba(24,20,12,.22);
}

/* Authoritative seam rules — intentionally last in the stylesheet. */
.hb-categories::before,
.hb-categories::after,
.hb-about::before,
.hb-about::after,
.hb-events::before,
.hb-events::after {
	height: 24px;
	background-color: var(--hb-paper-surface);
	background-image:
		linear-gradient(90deg, rgba(79,48,19,.14), transparent 5%, transparent 94%, rgba(79,48,19,.13)),
		url("../images/decor/parchment-noise.svg");
	background-repeat: no-repeat, repeat;
	background-size: 100% 100%, 320px 320px;
	background-position: 0 0, 0 0;
	background-blend-mode: multiply, multiply;
	-webkit-mask-image: url("../images/decor/torn-paper-mask-v2.png");
	mask-image: url("../images/decor/torn-paper-mask-v2.png");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	filter: none;
}

.hb-categories::before,
.hb-about::before {
	transform: translateY(-100%);
	filter: drop-shadow(0 -1px 1px rgba(35,25,13,.22));
}

.hb-categories::after,
.hb-events::after {
	transform: translateY(100%) scaleY(-1);
	filter: drop-shadow(0 1px 1px rgba(35,25,13,.24));
}

.hb-about::after,
.hb-events::before { display: none; }

@media (max-width: 782px) {
	.hb-categories::before,
	.hb-categories::after,
	.hb-about::before,
	.hb-events::after {
		height: 16px;
		-webkit-mask-size: 100% 100%;
		mask-size: 100% 100%;
	}
}

/* Single-row category carousel. Kept last so older responsive grid rules
   cannot reintroduce wrapping. */
.hb-categories__carousel { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) 52px; align-items: center; gap: 1rem; }
.hb-categories__viewport { min-width: 0; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-inline: contain; }
.hb-categories__viewport::-webkit-scrollbar { display: none; }
.hb-categories__viewport:focus-visible { outline: 2px dashed var(--hb-rust); outline-offset: 6px; }
.hb-categories__grid { display: flex !important; flex-wrap: nowrap !important; justify-content: flex-start; gap: clamp(1.25rem, 2vw, 2rem); width: max-content; }
.hb-categories__grid .hb-category { flex: 0 0 clamp(140px, 12vw, 190px); scroll-snap-align: start; }
.hb-categories__arrow { position: relative; z-index: 2; display: grid; place-items: center; width: 48px; height: 48px; padding: 0 0 4px; border: 2px solid #76511f; border-radius: 50%; background: radial-gradient(circle at 35% 28%, #f4d17e 0 8%, transparent 9%), linear-gradient(145deg, #c99339, #80551e 72%); box-shadow: inset 0 0 0 3px rgba(255,224,144,.32), 0 4px 0 #4f3215, 0 7px 14px rgba(42,27,11,.28); color: #23170c; cursor: pointer; transition: transform .18s ease, filter .18s ease, opacity .18s ease; }
.hb-categories__arrow::after { content: '\2726'; position: absolute; bottom: 2px; font-size: .5rem; color: #3f2912; }
.hb-categories__arrow span { font-family: Georgia, serif; font-size: 2.45rem; font-weight: 700; line-height: .8; }
.hb-categories__arrow:hover:not(:disabled) { transform: translateY(-2px) rotate(-3deg); filter: brightness(1.08); }
.hb-categories__arrow--next:hover:not(:disabled) { transform: translateY(-2px) rotate(3deg); }
.hb-categories__arrow:focus-visible { outline: 3px solid var(--hb-rust); outline-offset: 4px; }
.hb-categories__arrow:disabled { opacity: .28; cursor: default; box-shadow: inset 0 0 0 3px rgba(255,224,144,.2), 0 2px 0 #4f3215; }
.hb-categories__carousel:not(.has-overflow) .hb-categories__arrow { visibility: hidden; }
@media (max-width: 782px) {
	.hb-categories__carousel { grid-template-columns: 40px minmax(0, 1fr) 40px; gap: .55rem; }
	.hb-categories__arrow { width: 38px; height: 38px; }
	.hb-categories__arrow span { font-size: 2rem; }
	.hb-categories__grid .hb-category { flex-basis: min(68vw, 190px); }
}
@media (prefers-reduced-motion: reduce) {
	.hb-categories__viewport { scroll-behavior: auto; }
	.hb-categories__arrow { transition: none; }
}
