/**
 * TheWebCart — frontend styles.
 *
 * All brand colors, fonts, spacing and radii come from theme.json presets
 * (var(--wp--preset--*)). A few dark-surface tints and translucent overlays
 * that have no palette equivalent are centralized here as local custom props.
 */

:root {
	--twc-radius: 8px;
	--twc-shell: 1280px;
	--twc-on-dark: #cfd4d9;          /* body text on charcoal */
	--twc-on-dark-dim: #9aa1a8;      /* muted text on charcoal */
	--twc-on-dark-soft: #aeb4ba;     /* utility-bar text */
	--twc-overlay-08: rgba(255, 255, 255, 0.08);
	--twc-overlay-06: rgba(255, 255, 255, 0.06);
}

/* ---------- Accessibility ---------- */
.skip-link.screen-reader-text {
	position: absolute;
	inset-inline-start: -9999px;
	z-index: 100000;
	padding: 0.75rem 1.25rem;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	border-radius: var(--twc-radius);
	text-decoration: none;
}
.skip-link.screen-reader-text:focus {
	inset-inline-start: 1rem;
	top: 1rem;
}
:where(a, button, input, select, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

/* ---------- Shared shell ---------- */
/* Keep the storefront on the light surface even if the assigned front page was
   built with another page builder that forced a dark page background. */
body.home {
	background-color: var(--wp--preset--color--surface) !important;
}
.twc-main {
	padding-block: var(--wp--preset--spacing--60);
}
.twc-page-head,
.twc-post-head {
	margin-block-end: var(--wp--preset--spacing--50);
}
.twc-post-meta {
	gap: var(--wp--preset--spacing--40);
	color: var(--wp--preset--color--muted);
}

/* ========================================================================
   HEADER
   ===================================================================== */
.twc-utilitybar {
	background: var(--wp--preset--color--header-deep);
	color: var(--twc-on-dark-soft);
	font-size: var(--wp--preset--font-size--x-small);
}
.twc-utilitybar__inner,
.twc-mainbar__inner,
.twc-navbar__inner {
	max-width: var(--twc-shell);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--40);
}
.twc-utilitybar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	flex-wrap: wrap;
	padding-block: 0.5rem;
}
.twc-util-left,
.twc-util-right {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
}
.twc-util-meta {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	color: inherit;
}
.twc-util-link {
	color: var(--twc-on-dark-soft);
	text-decoration: none;
}
.twc-util-link:hover {
	color: var(--wp--preset--color--accent);
}
.twc-util-signin {
	color: var(--wp--preset--color--accent);
	font-weight: 600;
}

.twc-mainbar {
	background: var(--wp--preset--color--header);
}
.twc-mainbar__inner {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--50);
	flex-wrap: wrap;
	padding-block: 1.1rem;
}
.twc-logo {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: none;
	text-decoration: none;
}
.twc-logo__mark {
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: var(--wp--preset--gradient--brand);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--wp--preset--shadow--brand);
}
.twc-logo__text {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--background);
}
.twc-logo__accent {
	color: var(--wp--preset--color--accent);
}
/* Image logo on a light chip so the dark-text brand logo reads on the charcoal header/footer. */
.twc-logo--img {
	background: var(--wp--preset--color--background);
	padding: 5px 9px;
	border-radius: 10px;
	box-shadow: 0 2px 8px rgba(20, 23, 28, 0.18);
	line-height: 0;
}
.twc-logo--img img {
	display: block;
	height: 52px;
	width: auto;
}
.twc-footer__logo.twc-logo--img {
	margin-block-end: 16px;
}
.twc-footer__logo.twc-logo--img img {
	height: 58px;
}

.twc-search {
	flex: 1;
	min-width: 240px;
	display: flex;
	align-items: center;
	background: var(--wp--preset--color--background);
	border-radius: var(--twc-radius);
	overflow: hidden;
	height: 48px;
	box-shadow: 0 2px 10px rgba(20, 23, 28, 0.18);
}
.twc-search__cat {
	display: flex;
	align-items: center;
	gap: 8px;
	padding-inline: 16px;
	height: 100%;
	background: var(--wp--preset--color--surface);
	border: 0;
	border-inline-end: 1px solid var(--wp--preset--color--border);
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink);
	font-weight: 500;
	cursor: pointer;
	white-space: nowrap;
	text-decoration: none;
}
.twc-search__input {
	flex: 1;
	border: 0;
	outline: 0;
	padding-inline: 16px;
	font: inherit;
	min-width: 60px;
}
.twc-search__input:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: -2px;
}
.twc-search__btn {
	background: var(--wp--preset--color--primary);
	border: 0;
	height: 100%;
	width: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}
.twc-search__btn:hover {
	background: var(--wp--preset--color--primary-dark);
}

.twc-header-actions {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--50);
	flex: none;
}
.twc-phone {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--wp--preset--color--background);
}
.twc-phone__icon {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1.5px solid rgba(122, 193, 67, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
}
.twc-phone__meta {
	line-height: 1.25;
	display: flex;
	flex-direction: column;
}
.twc-phone__label {
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--twc-on-dark-dim);
}
.twc-phone__num {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}
.twc-iconbtn {
	position: relative;
	width: 44px;
	height: 44px;
	border-radius: var(--twc-radius);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--twc-on-dark);
	text-decoration: none;
}
.twc-iconbtn:hover {
	background: var(--twc-overlay-08);
}
.twc-iconbtn__badge {
	position: absolute;
	top: 4px;
	inset-inline-end: 4px;
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--header);
	font-size: 10px;
	font-weight: 700;
	min-width: 16px;
	height: 16px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-inline: 3px;
}
.twc-cartbtn {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 14px 0 10px;
	height: 44px;
	border-radius: var(--twc-radius);
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	text-decoration: none;
}
.twc-cartbtn:hover {
	background: var(--wp--preset--color--primary-dark);
}
.twc-cartbtn__icon {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}
.twc-cartbtn__badge {
	position: absolute;
	top: -8px;
	inset-inline-end: -9px;
	background: var(--wp--preset--color--cta);
	color: var(--wp--preset--color--background);
	font-size: 10px;
	font-weight: 700;
	min-width: 17px;
	height: 17px;
	border-radius: 9px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-inline: 3px;
	border: 2px solid var(--wp--preset--color--primary);
}
.twc-cartbtn__total {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.twc-navbar {
	background: var(--wp--preset--color--background);
	border-block-end: 1px solid var(--wp--preset--color--border);
}
.twc-navbar__inner {
	display: flex;
	align-items: stretch;
	gap: var(--wp--preset--spacing--20);
	flex-wrap: wrap;
}
.twc-departments {
	display: flex;
	align-items: center;
	gap: 10px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	border: 0;
	padding: 14px 20px;
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	cursor: pointer;
	border-radius: var(--twc-radius) var(--twc-radius) 0 0;
	align-self: flex-end;
}
.twc-departments:hover {
	background: var(--wp--preset--color--primary-dark);
}
.twc-navbar .twc-nav {
	flex: 1;
}
.twc-navbar .twc-nav .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--20);
}
.twc-navbar .twc-nav .wp-block-navigation-item__content {
	padding: 14px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	color: var(--wp--preset--color--ink);
}
.twc-navbar .twc-nav .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--primary);
}
.twc-navbar .twc-nav .current-menu-item .wp-block-navigation-item__content,
.twc-navbar .twc-nav .wp-block-navigation-item:first-child .wp-block-navigation-item__content {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
}
.twc-navbar__right {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
	margin-inline-start: auto;
}
.twc-flash {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: #B5560A;
	text-decoration: none;
}
.twc-recent {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	color: var(--wp--preset--color--muted);
	text-decoration: none;
}
.twc-recent:hover {
	color: var(--wp--preset--color--primary);
}

/* Minimal header (cart / checkout) */
.twc-mainbar__inner--minimal {
	justify-content: space-between;
}
.twc-mainbar__secure {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--twc-on-dark);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

/* ========================================================================
   FOOTER
   ===================================================================== */
.twc-footer {
	background: var(--wp--preset--color--header);
	color: var(--twc-on-dark);
	margin-block-start: var(--wp--preset--spacing--50);
}
.twc-footer__newsletter {
	border-block-end: 1px solid var(--twc-overlay-08);
}
.twc-footer__newsletter-inner,
.twc-footer__cols,
.twc-footer__bottom-inner {
	max-width: var(--twc-shell);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--40);
}
.twc-footer__newsletter-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--50);
	flex-wrap: wrap;
	padding-block: var(--wp--preset--spacing--60);
}
.twc-footer__newsletter-copy h3 {
	margin: 0 0 6px;
	color: var(--wp--preset--color--background);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
}
.twc-footer__newsletter-copy p {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
}
.twc-footer__newsletter-form {
	display: flex;
	gap: 10px;
	flex: 1;
	min-width: 280px;
	max-width: 480px;
}
.twc-footer__newsletter-form input {
	flex: 1;
	height: 50px;
	border: 0;
	border-radius: var(--twc-radius);
	padding-inline: 16px;
	font: inherit;
}
.twc-footer__newsletter-form button {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	border: 0;
	border-radius: var(--twc-radius);
	padding-inline: 26px;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
}
.twc-footer__newsletter-form button:hover {
	background: var(--wp--preset--color--primary-dark);
}
.twc-footer__cols {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: var(--wp--preset--spacing--50);
	padding-block: var(--wp--preset--spacing--60);
}
.twc-footer__logo {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-block-end: 16px;
	text-decoration: none;
}
.twc-footer__logo-mark {
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: var(--wp--preset--gradient--brand);
	display: flex;
	align-items: center;
	justify-content: center;
}
.twc-footer__logo-text {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 800;
	color: var(--wp--preset--color--background);
}
.twc-footer__about {
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.7;
	max-width: 300px;
	margin: 0 0 16px;
}
.twc-footer__contact {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--wp--preset--color--background);
	font-weight: 600;
}
.twc-footer__col h4 {
	color: var(--wp--preset--color--background);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	margin: 0 0 16px;
}
.twc-footer__col a {
	display: block;
	color: var(--twc-on-dark);
	text-decoration: none;
	font-size: var(--wp--preset--font-size--small);
	margin-block-end: 11px;
}
.twc-footer__col a:hover {
	color: var(--wp--preset--color--accent);
}
.twc-footer__bottom {
	border-block-start: 1px solid var(--twc-overlay-08);
}
.twc-footer__bottom-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	flex-wrap: wrap;
	padding-block: var(--wp--preset--spacing--40);
}
.twc-footer__copy {
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--twc-on-dark-dim);
}
.twc-footer__badges {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.twc-footer__badge {
	display: flex;
	align-items: center;
	gap: 7px;
	background: var(--twc-overlay-06);
	padding: 7px 12px;
	border-radius: 7px;
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--twc-on-dark);
}
.twc-footer__badge--cod {
	font-weight: 600;
}

/* ========================================================================
   404
   ===================================================================== */
.twc-404 {
	padding-block: var(--wp--preset--spacing--80);
}
.twc-404__code {
	color: var(--wp--preset--color--primary);
	margin-block-end: 0;
}

/* ========================================================================
   WooCommerce layout helpers
   ===================================================================== */
.twc-product__layout {
	gap: var(--wp--preset--spacing--60);
}

/* Shop archive — comp-matching 268px carded sidebar + toolbar + product grid. */
.twc-shop__grid {
	display: grid;
	grid-template-columns: 268px minmax(0, 1fr);
	gap: var(--wp--preset--spacing--50);
	align-items: start;
	margin-block-start: var(--wp--preset--spacing--40);
}
.twc-shop__side {
	display: flex;
	flex-direction: column;
	gap: 16px;
	position: sticky;
	top: 18px;
}
.twc-shop__card {
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: 20px;
}
.twc-shop__card-title {
	margin: 0 0 14px;
	font-weight: 700;
}
.twc-shop__toolbar {
	align-items: center;
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: 12px 18px;
	margin-block-end: var(--wp--preset--spacing--40);
}
.twc-shop__title {
	margin: 0;
}
/* Product grid: cards fill rows (overrides WooCommerce flex wrap). */
.twc-shop .wc-block-product-template.is-flex-container {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: var(--wp--preset--spacing--40);
}
.twc-shop .wc-block-product-template.is-flex-container > .wc-block-product {
	flex: initial;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0;
	margin: 0;
	justify-self: stretch;
	list-style: none;
}
/* Category list styled like the comp. */
.twc-shop__card .wp-block-woocommerce-product-categories ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.twc-shop__card .wp-block-woocommerce-product-categories li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 10px;
	border-radius: 7px;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.twc-shop__card .wp-block-woocommerce-product-categories li a:hover {
	background: #f3fbf5;
	color: var(--wp--preset--color--primary-dark);
}
.twc-shop__card .wp-block-woocommerce-product-categories .count {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--x-small);
}
@media (max-width: 880px) {
	.twc-shop__grid {
		grid-template-columns: 1fr;
	}
	.twc-shop__side {
		position: static;
		flex-direction: row;
		flex-wrap: wrap;
	}
	.twc-shop__card {
		flex: 1 1 240px;
	}
}

/* ========================================================================
   Responsive
   ===================================================================== */
@media (max-width: 980px) {
	.twc-footer__cols {
		grid-template-columns: 1fr 1fr;
	}
	.twc-phone {
		display: none;
	}
}
@media (max-width: 680px) {
	.twc-footer__cols {
		grid-template-columns: 1fr;
	}
	.twc-mainbar__inner {
		gap: var(--wp--preset--spacing--30);
		row-gap: var(--wp--preset--spacing--40);
	}
	.twc-header-actions {
		gap: var(--wp--preset--spacing--30);
		margin-inline-start: auto;
	}
	/* Search drops to its own full-width row under the logo + actions. */
	.twc-search {
		order: 3;
		flex-basis: 100%;
		min-width: 100%;
	}
	/* Utility bar: center its two groups when they wrap. */
	.twc-utilitybar__inner {
		justify-content: center;
		row-gap: 4px;
	}
	.twc-navbar__right {
		display: none;
	}
}
@media (max-width: 480px) {
	/* Hide the secondary utility links on very small screens to avoid overflow. */
	.twc-util-link:not(.twc-util-signin) {
		display: none;
	}
	.twc-cartbtn__total {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	* {
		animation-duration: 0.001ms !important;
		transition-duration: 0.001ms !important;
	}
}

/* ========================================================================
   TURN 2 — Patterns & block styles
   ===================================================================== */

/* ---- Block styles ---- */
.is-style-twc-eyebrow {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--primary-dark);
	margin-block-end: 0;
}
.wp-block-group.is-style-twc-card,
.wp-block-column.is-style-twc-card,
.is-style-twc-card {
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: var(--wp--preset--spacing--50);
	box-shadow: var(--wp--preset--shadow--card);
}
.wp-block-button.is-style-twc-cta .wp-block-button__link {
	background: var(--wp--preset--color--primary-dark);
	color: var(--wp--preset--color--background);
}
.wp-block-button.is-style-twc-cta .wp-block-button__link:hover,
.wp-block-button.is-style-twc-cta .wp-block-button__link:focus,
.wp-block-button.is-style-twc-cta .wp-block-button__link:active {
	background: #006130;
	color: var(--wp--preset--color--background);
}
.wp-block-group.is-style-twc-section-dark {
	background: var(--wp--preset--color--header);
	color: var(--twc-on-dark);
	border-radius: 16px;
	padding: var(--wp--preset--spacing--70);
}
.wp-block-group.is-style-twc-section-dark :where(h1,h2,h3,h4) {
	color: var(--wp--preset--color--background);
}

/* ---- Section scaffolding ---- */
.twc-sec {
	margin-block: var(--wp--preset--spacing--70);
}
.twc-sec__head {
	margin-block-end: var(--wp--preset--spacing--50);
}
.twc-sec__head--center {
	text-align: center;
}
.twc-sec__head--row {
	align-items: flex-end;
}
.twc-sec__title {
	margin-block-end: var(--wp--preset--spacing--50);
}
.twc-sec__more a {
	font-weight: 600;
	color: var(--wp--preset--color--primary-dark);
}

/* ---- Hero ---- */
.twc-hero {
	margin-block: var(--wp--preset--spacing--50);
}
.twc-hero__banner {
	position: relative;
	border-radius: 14px;
	overflow: hidden;
	min-height: 380px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: var(--wp--preset--spacing--70);
	color: var(--wp--preset--color--background);
	background:
		radial-gradient(circle at 100% 0%, rgba(122, 193, 67, 0.35), transparent 45%),
		linear-gradient(115deg, #1c2024 0%, var(--wp--preset--color--header) 45%, #11331d 100%);
}
.twc-hero__eyebrow {
	display: inline-block;
	align-self: flex-start;
	background: rgba(122, 193, 67, 0.18);
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: 0.04em;
	padding: 7px 14px;
	border-radius: 30px;
	margin-block-end: 1rem;
}
.twc-hero__title {
	color: var(--wp--preset--color--background);
	max-width: 14ch;
}
.twc-hero__lede {
	color: #c4cad0;
	max-width: 44ch;
	margin-block-end: var(--wp--preset--spacing--50);
}
.twc-hero__ghost .wp-block-button__link,
.twc-brand__ghost .wp-block-button__link {
	border-color: rgba(255, 255, 255, 0.25);
	color: var(--wp--preset--color--background);
	background: transparent;
}
.twc-hero__ghost .wp-block-button__link:hover,
.twc-brand__ghost .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--accent);
}
.twc-hero__promos {
	margin-block-start: var(--wp--preset--spacing--40);
	/* auto-fit (not the block's default auto-fill) so the 3 cards stretch to
	   fill the row instead of leaving empty columns on the right. */
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.twc-promo-card {
	border-radius: 12px;
	padding: var(--wp--preset--spacing--50);
	min-height: 120px;
	justify-content: center;
}
.twc-promo-card--amber { background: linear-gradient(120deg, #fff7e9, #fdeccd); }
.twc-promo-card--green { background: linear-gradient(120deg, #eef9f0, #dff3e3); }
.twc-promo-card--slate { background: linear-gradient(120deg, #eef2f7, #e1e8f0); }
.twc-promo-card__tag {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.04em;
	margin: 0;
	color: #5a3a12;
}
.twc-promo-card--green .twc-promo-card__tag { color: var(--wp--preset--color--primary-dark); }
.twc-promo-card--slate .twc-promo-card__tag { color: var(--wp--preset--color--ink); }
.twc-promo-card__title { font-size: var(--wp--preset--font-size--large); font-weight: 700; margin: 4px 0 2px; }
.twc-promo-card__link a { font-size: var(--wp--preset--font-size--small); font-weight: 600; color: var(--wp--preset--color--primary-dark); }

/* ---- Trust strip ---- */
.twc-trust {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: var(--wp--preset--spacing--40);
	margin-block-start: var(--wp--preset--spacing--40);
	/* auto-fit (not the block's auto-fill) so the 3 items spread to fill the row. */
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.twc-trust__item { gap: 13px; }
.twc-trust__icon {
	width: 42px;
	height: 42px;
	border-radius: 10px;
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--border);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--wp--preset--color--primary);
	flex: none;
}
.twc-trust__title { font-weight: 600; font-size: var(--wp--preset--font-size--small); margin: 0; }
.twc-trust__sub { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); margin: 0; }

/* ---- Promo banners ---- */
.twc-banners { margin-block: var(--wp--preset--spacing--50); }
.twc-banner {
	position: relative;
	border-radius: 14px;
	overflow: hidden;
	min-height: 220px;
	justify-content: center;
	padding: var(--wp--preset--spacing--60);
	color: var(--wp--preset--color--background);
}
.twc-banner--green {
	background:
		radial-gradient(circle at 100% 100%, rgba(122, 193, 67, 0.4), transparent 45%),
		linear-gradient(110deg, #11331d, #1d5132);
}
.twc-banner--amber {
	background: linear-gradient(150deg, #fff3df, #fbdfb4);
	color: #5a3a12;
}
.twc-banner--full { min-height: 180px; text-align: center; align-items: center; }
.twc-banner__tag { font-size: var(--wp--preset--font-size--x-small); font-weight: 700; letter-spacing: 0.06em; margin: 0; }
.twc-banner--green .twc-banner__tag { color: var(--wp--preset--color--accent); }
.twc-banner--amber .twc-banner__tag { color: var(--wp--preset--color--cta-dark); }
.twc-banner__title { color: inherit; margin: 8px 0 12px; }
.twc-banner--green .twc-banner__title { color: var(--wp--preset--color--background); }
.twc-banner__btn .wp-block-button__link { background: var(--wp--preset--color--background); color: var(--wp--preset--color--primary-dark); }
.twc-banner__btn .wp-block-button__link:hover { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--background); }

/* ---- Featured vendor band ---- */
.twc-brand { margin-block: var(--wp--preset--spacing--70); }
.twc-brand__inner {
	position: relative;
	border-radius: 18px;
	overflow: hidden;
	min-height: 300px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: var(--wp--preset--spacing--70);
	color: var(--wp--preset--color--background);
	background:
		repeating-linear-gradient(135deg, rgba(255,255,255,0.02) 0 2px, transparent 2px 26px),
		linear-gradient(120deg, #14361f 0%, #0e2a18 55%, #3a2a08 100%);
}
.twc-brand--about .twc-brand__inner { background: linear-gradient(120deg, #14361f 0%, var(--wp--preset--color--primary-dark) 100%); }
.twc-brand--sell .twc-brand__inner { background: linear-gradient(120deg, var(--wp--preset--color--header) 0%, #11331d 100%); }
.twc-brand__eyebrow { font-size: var(--wp--preset--font-size--x-small); font-weight: 700; letter-spacing: 0.1em; color: var(--wp--preset--color--accent); margin: 0 0 14px; }
.twc-brand__title { color: var(--wp--preset--color--background); }
.twc-brand__lede { color: #cdd4ce; max-width: 46ch; margin-block-end: var(--wp--preset--spacing--50); }
.twc-brand__btn .wp-block-button__link { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--primary-dark); font-weight: 700; }
.twc-brand__btn .wp-block-button__link:hover { background: var(--wp--preset--color--background); }

/* ---- Vendor cards ---- */
.twc-vendor-card { border: 1px solid var(--wp--preset--color--border); border-radius: 12px; overflow: hidden; padding: 0 !important; background: var(--wp--preset--color--background); }
.twc-vendor-card__banner { height: 110px; background: var(--wp--preset--gradient--brand); }
.twc-vendor-card--honey .twc-vendor-card__banner { background: linear-gradient(120deg, #3a2a08, var(--wp--preset--color--primary-dark)); }
.twc-vendor-card--tech .twc-vendor-card__banner { background: linear-gradient(120deg, #3a4a5e, var(--wp--preset--color--header)); }
.twc-vendor-card__body { padding: 0 22px 22px; margin-block-start: -38px; position: relative; text-align: center; }
.twc-vendor-card__avatar {
	width: 74px; height: 74px; border-radius: 18px;
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--border);
	box-shadow: var(--wp--preset--shadow--card);
	display: flex; align-items: center; justify-content: center;
	font-weight: 800; font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--primary-dark);
}
.twc-vendor-card__avatar { margin-inline: auto; }
.twc-vendor-card__name { display: flex; align-items: center; justify-content: center; gap: 8px; margin-block-start: 14px; }
.twc-vendor-card__name h3 { margin: 0; font-size: var(--wp--preset--font-size--large); }
.twc-vendor-card__verified { background: #eaf7ee; color: var(--wp--preset--color--primary-dark); font-size: var(--wp--preset--font-size--x-small); font-weight: 700; padding: 3px 8px; border-radius: 5px; }
.twc-vendor-card__desc { margin: 6px 0 14px; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); line-height: 1.5; min-height: 42px; }
.twc-vendor-card__stats { display: flex; justify-content: center; gap: 32px; padding-block: 13px; border-block: 1px solid var(--wp--preset--color--border); margin-block-end: 16px; }
.twc-vendor-card__stats strong { display: block; font-size: var(--wp--preset--font-size--large); font-weight: 700; white-space: nowrap; }
.twc-vendor-card__stats span { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); }
.twc-vendor-card__btn,
.twc-empty__btn,
.twc-form__submit {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	background: var(--wp--preset--color--primary); color: var(--wp--preset--color--background);
	font-weight: 600; font-size: var(--wp--preset--font-size--small);
	padding: 13px 20px; border-radius: var(--twc-radius); border: 0; cursor: pointer; text-decoration: none;
}
.twc-vendor-card__btn { width: 100%; padding: 13px; }
.twc-vendor-card__btn:hover,
.twc-empty__btn:hover,
.twc-form__submit:hover { background: var(--wp--preset--color--primary-dark); }

/* ---- Category tiles ---- */
.twc-cat-tile {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: 22px 16px;
	text-align: center;
	background: var(--wp--preset--color--background);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	transition: border-color 0.2s, box-shadow 0.2s;
}
.twc-cat-tile:hover { border-color: var(--wp--preset--color--primary); box-shadow: 0 10px 24px rgba(0, 166, 81, 0.1); }
.twc-cat-tile__icon { width: 64px; height: 64px; border-radius: 16px; background: #eaf7ee; display: flex; align-items: center; justify-content: center; font-size: 26px; margin-block-end: 8px; }
.twc-cat-tile__name { font-size: var(--wp--preset--font-size--small); font-weight: 600; }
.twc-cat-tile__count { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); }

/* ---- News grid ---- */
.twc-news .wp-block-post { border: 1px solid var(--wp--preset--color--border); border-radius: 12px; overflow: hidden; background: var(--wp--preset--color--background); }
.twc-news .wp-block-post > * { padding-inline: var(--wp--preset--spacing--40); }
.twc-news .wp-block-post-featured-image { padding: 0; }

/* ---- Prose / page content ---- */
.twc-prose > * { margin-block: var(--wp--preset--spacing--50); }
.twc-values, .twc-steps { gap: var(--wp--preset--spacing--40); }
.twc-step__num { color: var(--wp--preset--color--primary); margin: 0; }
.twc-contact__list { list-style: none; padding: 0; }
.twc-contact__list li { margin-block-end: 8px; }

/* ---- Forms ---- */
.twc-form { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--30); }
.twc-form__field { display: flex; flex-direction: column; gap: 6px; font-size: var(--wp--preset--font-size--small); font-weight: 500; }
.twc-form__field input,
.twc-form__field textarea {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--twc-radius);
	padding: 12px 14px;
	font: inherit;
	background: var(--wp--preset--color--background);
}
.twc-form__field input:focus-visible,
.twc-form__field textarea:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 1px; border-color: var(--wp--preset--color--primary); }
.twc-form__submit { align-self: flex-start; }

/* ---- Vendor dashboard / empty / compare ---- */
.twc-dash__stats { margin-block: var(--wp--preset--spacing--40); }
.twc-stat { display: flex; flex-direction: column; gap: 4px; }
.twc-stat__label { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); text-transform: uppercase; letter-spacing: 0.04em; }
.twc-stat__value { font-size: var(--wp--preset--font-size--x-large); font-weight: 700; color: var(--wp--preset--color--ink); }
.twc-empty { text-align: center; }
.twc-empty__title { margin: 0 0 8px; }
.twc-empty__text { color: var(--wp--preset--color--muted); margin: 0 0 16px; }
.twc-compare__table { width: 100%; border-collapse: collapse; margin-block-end: 16px; }
.twc-compare__table th,
.twc-compare__table td { border: 1px solid var(--wp--preset--color--border); padding: 12px 14px; text-align: start; }
.twc-compare__table thead th { background: var(--wp--preset--color--surface); font-weight: 600; }

@media (max-width: 782px) {
	.twc-vendor-card__stats { gap: 12px; }
}

/* ---- Header: All Departments dropdown (Interactivity API) ---- */
.twc-departments-wrap {
	position: relative;
	align-self: flex-end;
}
.twc-departments__panel {
	position: absolute;
	inset-inline-start: 0;
	top: 100%;
	z-index: 60;
	min-width: 240px;
	margin: 0;
	padding: var(--wp--preset--spacing--20);
	list-style: none;
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0 var(--twc-radius) var(--twc-radius) var(--twc-radius);
	box-shadow: var(--wp--preset--shadow--raised);
}
.twc-departments__panel[hidden] {
	display: none;
}
.twc-departments__panel a {
	display: block;
	padding: 10px 14px;
	border-radius: 6px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.twc-departments__panel a:hover,
.twc-departments__panel a:focus-visible {
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--primary);
}

/* ========================================================================
   Vendor profile / storefront (matches comp Vendor page)
   ===================================================================== */
.twc-store {
	background: var(--wp--preset--color--surface);
}
.twc-store__banner {
	position: relative;
	height: 240px;
	overflow: hidden;
	background:
		radial-gradient(circle at 100% 0%, rgba(122, 193, 67, 0.3), transparent 55%),
		linear-gradient(120deg, var(--wp--preset--color--header) 0%, #1d5132 100%);
}
.twc-store__banner-inner {
	position: relative;
	max-width: var(--twc-shell, 1280px);
	margin-inline: auto;
	padding: 20px var(--wp--preset--spacing--40);
}
.twc-store__crumb {
	font-size: var(--wp--preset--font-size--small);
	color: var(--twc-on-dark-dim);
}
.twc-store__crumb a { color: var(--twc-on-dark-dim); text-decoration: none; }
.twc-store__crumb a:hover { color: var(--wp--preset--color--accent); }
.twc-store__crumb span { margin-inline: 7px; opacity: 0.6; }
.twc-store__crumb .is-current { color: var(--wp--preset--color--background); opacity: 1; margin-inline: 0; }

.twc-store__wrap {
	max-width: var(--twc-shell, 1280px);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--40);
}
.twc-store__card {
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	padding: var(--wp--preset--spacing--50);
	margin-top: -70px;
	position: relative;
	display: flex;
	gap: var(--wp--preset--spacing--50);
	align-items: flex-start;
	flex-wrap: wrap;
	box-shadow: var(--wp--preset--shadow--card);
}
.twc-store__avatar {
	width: 96px;
	height: 96px;
	border-radius: 22px;
	background: linear-gradient(135deg, var(--wp--preset--color--header), #1d5132);
	color: var(--wp--preset--color--background);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 38px;
	font-weight: 800;
	flex: none;
	box-shadow: var(--wp--preset--shadow--raised);
}
.twc-store__meta { flex: 1; min-width: 240px; }
.twc-store__title-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.twc-store__name { margin: 0; font-size: var(--wp--preset--font-size--x-large); font-weight: 800; letter-spacing: -0.02em; }
.twc-store__verified { background: #eaf7ee; color: var(--wp--preset--color--primary-dark); font-size: var(--wp--preset--font-size--x-small); font-weight: 700; padding: 4px 10px; border-radius: 6px; }
.twc-store__desc { margin: 8px 0 12px; color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--small); line-height: 1.6; max-width: 560px; }
.twc-store__stats { display: flex; gap: 26px; flex-wrap: wrap; }
.twc-store__stats strong { display: block; font-size: var(--wp--preset--font-size--large); font-weight: 700; }
.twc-store__stats span { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); }
.twc-store__actions { display: flex; flex-direction: column; gap: 10px; min-width: 180px; }
.twc-store__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 46px;
	border-radius: var(--twc-radius, 8px);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
}
.twc-store__btn--primary { background: var(--wp--preset--color--primary); color: var(--wp--preset--color--background); }
.twc-store__btn--primary:hover { background: var(--wp--preset--color--primary-dark); }
.twc-store__btn--ghost { background: var(--wp--preset--color--background); color: var(--wp--preset--color--primary-dark); border: 1.5px solid var(--wp--preset--color--primary); }
.twc-store__btn--ghost:hover { background: var(--wp--preset--color--primary); color: var(--wp--preset--color--background); }

.twc-store__body {
	display: grid;
	grid-template-columns: 268px minmax(0, 1fr);
	gap: var(--wp--preset--spacing--50);
	align-items: start;
	margin-block: var(--wp--preset--spacing--50);
}
.twc-store__side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 18px; }
.twc-store__panel { background: var(--wp--preset--color--background); border: 1px solid var(--wp--preset--color--border); border-radius: 12px; padding: 20px; }
.twc-store__panel h3 { margin: 0 0 12px; font-size: var(--wp--preset--font-size--small); font-weight: 700; }
.twc-store__panel a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 10px;
	border-radius: 7px;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}
.twc-store__panel a:hover { background: #f3fbf5; }
.twc-store__panel a.is-active { background: #eaf7ee; color: var(--wp--preset--color--primary-dark); font-weight: 600; }
.twc-store__count { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--muted); }
.twc-store__info { display: flex; flex-direction: column; gap: 12px; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink); }
.twc-store__info > div { display: flex; gap: 10px; align-items: center; }
.twc-store__products-title { margin: 0 0 var(--wp--preset--spacing--40); }

@media (max-width: 880px) {
	.twc-store__body { grid-template-columns: 1fr; }
	.twc-store__side { position: static; }
	.twc-store__card { margin-top: -50px; }
}