/* Xcen theme – styles that theme.json can't express. Tokens come from theme.json presets. */

/* Header */
.xcen-topbar p { margin: 0; }
.xcen-topbar a { color: inherit; text-decoration: none; }
.xcen-topbar a:hover { color: var(--wp--preset--color--yellow); }

.xcen-header { position: sticky; top: 0; z-index: 50; }
.xcen-header .xcen-logo { margin: 0; flex-shrink: 0; }
.xcen-header .wp-block-navigation a { text-decoration: none; }
.xcen-header .wp-block-navigation a:hover,
.xcen-header .wp-block-navigation .current-menu-item > a { color: var(--wp--preset--color--yellow); }
.xcen-header-tools { color: var(--wp--preset--color--white); }
.xcen-header-tools .wp-block-search__button { background: transparent; color: inherit; padding: 0.4rem; }
.xcen-header-tools .wc-block-mini-cart__button,
.xcen-header-tools .wc-block-customer-account a { color: inherit; }
.xcen-header .wc-block-mini-cart__badge { background: var(--wp--preset--color--yellow); color: var(--wp--preset--color--ink); }

@media (max-width: 781px) {
	.xcen-topbar p:first-child { display: none; }
}

/* Small uppercase label above headings */
.xcen-eyebrow {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 0.85rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--yellow);
	margin: 0;
}
.xcen-eyebrow.is-dark { color: var(--wp--preset--color--muted); }
.xcen-eyebrow.is-dark::before {
	content: "";
	display: inline-block;
	width: 1.5rem;
	height: 3px;
	margin-right: 0.6rem;
	vertical-align: middle;
	background: var(--wp--preset--color--yellow);
}

/* Hero */
.xcen-hero h1 { max-width: 14ch; }

/* Outline button on dark backgrounds, dark button on yellow */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: currentColor;
	border: 2px solid currentColor;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--white);
}
.wp-block-button.is-style-xcen-dark > .wp-block-button__link { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--white); }
.wp-block-button.is-style-xcen-dark > .wp-block-button__link:hover { background: var(--wp--preset--color--white); color: var(--wp--preset--color--ink); }

/* USP bar */
.xcen-usps p { margin: 0; font-size: 0.95rem; }
.xcen-usps strong { font-family: var(--wp--preset--font-family--display); }

/* Category cards */
.xcen-category-card {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	border-radius: 4px;
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.xcen-category-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgb(0 0 0 / 0.08); }
.xcen-category-card__image { margin: 0; mix-blend-mode: multiply; }
.xcen-category-card__image img { aspect-ratio: 5 / 4; object-fit: contain; width: 100%; padding: 0.75rem; }
.xcen-category-card__label {
	margin: 0;
	padding: 0 1rem 1rem;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1.05rem;
}
.xcen-category-card__label::after { content: " →"; color: var(--wp--preset--color--yellow); transition: margin 0.2s ease; }
.xcen-category-card:hover .xcen-category-card__label::after { margin-left: 0.25rem; }

/* Product cards */
.xcen-product-grid .wc-block-product {
	background: var(--wp--preset--color--white);
	border-radius: 4px;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.xcen-product-grid .wp-block-post-title { margin: 0; line-height: 1.3; }
.xcen-product-grid .wp-block-post-title a { text-decoration: none; }
.xcen-product-grid .wp-block-woocommerce-product-button { margin-top: auto; }

/* References */
.xcen-reference-card { display: flex; flex-direction: column; gap: 0.75rem; text-decoration: none; color: inherit; }
.xcen-reference-card figure { margin: 0; overflow: hidden; border-radius: 4px; }
.xcen-reference-card img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; transition: transform 0.4s ease; }
.xcen-reference-card:hover img { transform: scale(1.04); }
.xcen-reference-card h3, .xcen-reference-card p { margin: 0; }

/* Images and lists */
.xcen-rounded img { border-radius: 4px; }
.is-style-xcen-plain { list-style: none; padding: 0; }
.is-style-xcen-plain li { margin: 0.3rem 0; }
.is-style-xcen-plain a { text-decoration: none; }
.is-style-xcen-plain a:hover { color: var(--wp--preset--color--yellow); }
.is-style-xcen-check { list-style: none; padding: 0; }
.is-style-xcen-check li { position: relative; padding-left: 1.75rem; margin: 0.5rem 0; }
.is-style-xcen-check li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.45em;
	width: 0.9rem;
	height: 0.5rem;
	border-left: 3px solid var(--wp--preset--color--yellow);
	border-bottom: 3px solid var(--wp--preset--color--yellow);
	transform: rotate(-45deg);
}

/* Footer */
.xcen-footer a { color: inherit; }

/* Accessibility */
:where(a, button, input, select, textarea):focus-visible {
	outline: 2px solid var(--wp--preset--color--yellow);
	outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; }
}

/* Mobile: two category cards per row */
@media (max-width: 600px) {
	.xcen-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.xcen-category-card__label { font-size: 0.95rem; }
}

/* Mobile: product grids (front page, related products) two per row */
@media (max-width: 600px) {
	.wc-block-product-template.is-flex-container {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.75rem;
	}
	.wc-block-product-template.is-flex-container > li { width: auto !important; margin: 0 !important; }
	.wc-block-product-template .wp-block-post-title { font-size: 0.9rem !important; }
	.wc-block-product-template .wp-block-button__link { padding: 0.6rem 0.5rem; font-size: 0.75rem !important; }
}
