/*
 * Hevea Core: product category landing. Loaded only on product_cat archives.
 * Archive template 154099 (v3 containers: .hc-hero, .hc-products, .hc-reviews) and the
 * per-category blocks built with Elementor v4 atomic elements (.hc-section and children).
 * Selectors start with "body" (and block ones with .hc-section) to outrank Elementor's
 * ".elementor .e-*-base" atomic base styles, which load after this file.
 */
.hc {
	--hc-green: #95C11F;
	--hc-green-dark: #3E8202;
	--hc-ink: #232323;
	--hc-text: #404040;
	--hc-muted: #595959;
	--hc-soft: #F6F8F5;
	--hc-line: #e3e7e0;
	--hc-radius: 14px;
	--hc-max: 1240px;
	--hc-gap: clamp(48px, 6vw, 80px);
	/* One type scale for categories and product pages (Willy's mockups, 28-10). */
	--hc-fs-h1: clamp(28px, 3vw, 34px);
	--hc-fs-h2: clamp(24px, 2.4vw, 28px);
	--hc-fs-h3: 18px;
	--hc-fs-body: 15px;
	--hc-fs-small: 13px;
	--hc-fs-xs: 12px;
	font-family: Montserrat, sans-serif;
	color: var(--hc-text);
}
body .hc h1,
body .hc h2,
body .hc h3,
body .hc .elementor-heading-title {
	font-family: Montserrat, sans-serif;
	color: var(--hc-ink);
	letter-spacing: -0.01em;
	margin: 0;
}
body .hc h2,
body .hc h2.elementor-heading-title {
	font-size: var(--hc-fs-h2);
	font-weight: 700;
	line-height: 1.2;
}
body .hc h3 {
	font-size: var(--hc-fs-h3);
	font-weight: 600;
	line-height: 1.3;
}
body .hc p,
body .hc .elementor-widget-text-editor,
body .hc .elementor-widget-text-editor p {
	font-size: var(--hc-fs-body);
	line-height: 1.6;
	color: var(--hc-text);
	text-align: left;
	margin: 0;
}
body .hc p a,
body .hc .elementor-widget-text-editor a {
	color: var(--hc-green-dark);
	text-decoration: underline;
	text-underline-offset: 2px;
}
body .hc .hc-list ul,
body .hc .hc-list ol {
	margin: 0;
	padding-left: 1.2em;
	line-height: 1.6;
}
body .hc .hc-list li,
body .hc .elementor-widget-text-editor li {
	font-size: var(--hc-fs-body);
	line-height: 1.6;
}
body .hc .hc-list li + li {
	margin-top: 4px;
}

/* Buttons: v4 (.hc-btn) and v3 (.elementor-button) share one look */
body .hc .hc-btn,
body .hc .elementor-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: flex-start;
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	padding: 14px 26px;
	border-radius: 999px;
	background: var(--hc-green);
	color: #fff;
	border: 2px solid var(--hc-green);
	text-decoration: none;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
body .hc .hc-btn:hover,
body .hc .hc-btn:focus-visible,
body .hc .elementor-button:hover,
body .hc .elementor-button:focus-visible {
	/* Hevea brand: corporate green at rest, black on hover. */
	background: #000;
	border-color: #000;
	color: #fff;
}
body .hc .hc-btn-secondary .elementor-button {
	background: transparent;
	color: var(--hc-ink);
	border-color: var(--hc-ink);
}
body .hc .hc-btn-secondary .elementor-button:hover {
	background: var(--hc-ink);
	border-color: var(--hc-ink);
	color: #fff;
}

/* Hero (v3) */
body .hc-hero {
	background: var(--hc-soft);
	padding-top: 28px !important;
	padding-bottom: clamp(32px, 4vw, 48px) !important;
}
body .hc-hero > .e-con-inner {
	gap: 16px !important;
}
body .hc-hero .woocommerce-breadcrumb {
	font-size: var(--hc-fs-xs) !important;
	color: var(--hc-muted) !important;
	margin: 0 !important;
}
body .hc-hero .woocommerce-breadcrumb a {
	color: var(--hc-muted) !important;
}
body .hc-hero h1.elementor-heading-title {
	font-size: var(--hc-fs-h1);
	font-weight: 700;
	line-height: 1.15;
	max-width: 900px;
}
body .hc-hero .hc-intro {
	max-width: 820px !important;
}
body .hc-hero .hc-intro,
body .hc-hero .hc-intro p {
	font-size: var(--hc-fs-body);
	line-height: 1.6;
}
body .hc-hero .hc-actions {
	gap: 12px !important;
	margin-top: 6px;
}
body .hc-hero .hc-actions > .elementor-widget {
	width: auto !important;
}
body .hc-chips .elementor-icon-list-items {
	display: flex !important;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin: 0 !important;
	padding: 0 !important;
}
body .hc-chips .elementor-icon-list-item {
	margin: 0 !important;
	padding: 0 !important;
	font-size: var(--hc-fs-small);
	font-weight: 500;
	color: var(--hc-ink);
}
body .hc-chips .elementor-icon-list-item::after {
	display: none !important;
}
body .hc-chips .elementor-icon-list-icon i {
	color: var(--hc-green-dark);
	font-size: 15px;
}
body .hc-chips .elementor-icon-list-icon svg {
	fill: var(--hc-green-dark);
	width: 15px;
}

/* Full-bleed backgrounds without changing the layout width (the theme wrapper is boxed). */
body .hc-hero,
body .hevea-quote-section {
	box-shadow: 0 0 0 100vmax var(--hc-soft, #F6F8F5);
	clip-path: inset(0 -100vmax);
}

/* Products (v3, from template 35083) */
body .hc-products {
	scroll-margin-top: 110px;
}

/* Category without products (body class from category-template.php) */
body.hc-no-products .hc-products {
	display: none;
}

/* Per-category block (v4 atomic) */
body .hc .e-div-block-base {
	padding: 0;
	min-width: 0;
}
body .hc-section {
	padding: 0 1.5rem;
}
body .hc-section .hc-inner {
	max-width: var(--hc-max);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: var(--hc-gap);
	padding-top: var(--hc-gap);
}
body .hc-section .hc-row {
	display: flex;
	align-items: center;
	gap: clamp(32px, 5vw, 80px);
}
body .hc-section .hc-row--reverse {
	flex-direction: row-reverse;
}
body .hc-section .hc-text {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
body .hc-section .hc-text h3 {
	margin-top: 8px;
}
body .hc-section .hc-text .hc-btn {
	margin-top: 8px;
}
/* Consecutive text-only rows read as one article: tighter rhythm. */
body .hc-section .hc-row--text-only + .hc-row--text-only {
	margin-top: calc(40px - var(--hc-gap));
}
body .hc-section .hc-row--text-only .hc-text {
	max-width: 820px;
}
body .hc-section .hc-media {
	flex: 1 1 0;
}
body .hc-section .hc-media img,
body .hc-section .hc-media .elementor-widget-video {
	width: 100% !important;
	border-radius: var(--hc-radius);
	overflow: hidden;
	display: block;
}
body .hc-section .hc-media img {
	aspect-ratio: 4 / 3;
	height: auto;
	object-fit: cover;
}

/* Feature cards */
body .hc-section .hc-features {
	display: flex;
	flex-direction: column;
	gap: 28px;
}
body .hc-section .hc-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 20px;
}
body .hc-section .hc-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: var(--hc-soft);
	border-radius: var(--hc-radius);
	padding: 28px 24px !important;
}
body .hc-section .hc-card .hc-card-icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: #fff;
	color: var(--hc-green-dark);
	display: grid;
	place-items: center;
	font-size: 20px;
	margin-bottom: 6px;
}
body .hc-section .hc-card .hc-card-icon svg {
	width: 22px !important;
	height: 22px !important;
	fill: currentColor;
}
body .hc-section .hc-card .hc-card-img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 10px;
}
body .hc-section .hc-card h3 {
	font-size: 17px;
}
body .hc-section .hc-card p {
	font-size: 15px;
	line-height: 1.6;
}

/* Extra images of a row */
body .hc-section .hc-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
}
body .hc-section .hc-gallery img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--hc-radius);
	display: block;
}

/* Kept v3 widgets (galleries, related products) */
body .hc-section .hc-related,
body .hc-section .hc-raw {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* FAQ */
body .hc-section .hc-faq {
	display: flex;
	align-items: flex-start;
	gap: clamp(32px, 5vw, 80px);
	padding-top: var(--hc-gap);
	border-top: 1px solid var(--hc-line);
}
body .hc-section .hc-faq-intro {
	flex: 0 0 34%;
	display: flex;
	flex-direction: column;
	gap: 14px;
	position: sticky;
	top: 120px;
}
body .hc-section .hc-faq-list {
	flex: 1 1 0;
}
body .hc-section .hc-accordion .e-accordion-item-base {
	border-bottom: 1px solid var(--hc-line);
}
body .hc-section .hc-accordion .e-accordion-item-base:first-child {
	border-top: 1px solid var(--hc-line);
}
body .hc-section .hc-accordion .e-accordion-item-header-base {
	padding: 22px 4px;
	gap: 16px;
	list-style: none;
}
body .hc-section .hc-accordion .e-accordion-item-header-base::-webkit-details-marker {
	display: none;
}
body .hc-section .hc-accordion .e-accordion-item-title-base,
body .hc-section .hc-accordion .e-accordion-item-title-base span {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--hc-ink);
}
body .hc-section .hc-accordion .e-accordion-item-icon-base {
	flex: 0 0 32px !important;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--hc-soft);
	color: var(--hc-green-dark);
	box-sizing: border-box;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	transition: background-color .2s ease, color .2s ease;
}
/* The e-svg wrapper fills the circle by default, so the chevron overflowed and rotated off-centre. */
body .hc-section .hc-accordion .e-accordion-item-icon-base .e-svg-base {
	flex: 0 0 18px;
	width: 18px !important;
	height: 18px !important;
	margin: 0;
	line-height: 0;
}
body .hc-section .hc-accordion .e-accordion-item-icon-base svg {
	display: block;
	width: 18px !important;
	height: 18px !important;
}
/* No rotation here: Elementor already rotates the svg of an open item (both added up to 360deg). */
body .hc-section .hc-accordion details[open] .e-accordion-item-icon-base {
	background: var(--hc-green);
	color: #fff;
}
body .hc-section .hc-accordion .e-accordion-item-header-base:hover .e-accordion-item-title-base span {
	color: var(--hc-green-dark);
}
body .hc-section .hc-accordion .e-accordion-item-content-base {
	padding: 0 4px 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

/* Reviews (v3) */
body .hc-reviews {
	padding-top: var(--hc-gap) !important;
	padding-bottom: var(--hc-gap) !important;
	gap: 24px !important;
}

/* Responsive */
@media (max-width: 1024px) {
body .hc-section .hc-faq-intro {
		position: static;
	}
}
@media (max-width: 767px) {
	/* Two-column product grid: the shared loop item (22599) keeps 20px + 10px side padding meant for desktop. */
body .hc-products .e-loop-item {
		padding-inline: 0 !important;
	}
body .hc-products .e-loop-item .elementor-widget-wrap {
		padding-inline: 0 !important;
	}
body .hc-products .e-loop-item .elementor-heading-title {
		font-size: 14px !important;
		line-height: 1.3 !important;
	}
body .hc-section {
		padding: 0 1rem;
	}
body .hc-section .hc-row,
body .hc-section .hc-row--reverse,
body .hc-section .hc-faq {
		flex-direction: column;
		align-items: stretch;
	}
body .hc-section .hc-media {
		order: -1;
	}
body .hc-section .hc-faq-intro {
		flex-basis: auto;
	}
body .hc-hero .hc-actions {
		flex-direction: column !important;
	}
body .hc-hero .hc-actions > .elementor-widget,
body .hc-hero .hc-actions .elementor-button {
		width: 100% !important;
	}
}

/* Hotspot images (migrated category blocks): as wide as the text column at most. */
body .hc-section .elementor-widget-hotspot {
	width: 100%;
	max-width: 700px !important;
}
body .hc-section .elementor-widget-hotspot {
	justify-content: flex-start !important;
}
body .hc-section .elementor-widget-hotspot .elementor-widget-container {
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	margin: 0 !important;
}
body .hc-section .elementor-widget-hotspot img {
	display: block;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0;
	height: auto;
	border-radius: var(--hc-radius);
}
