/*
Theme Name: Blocksy Child
Theme URI: https://creativethemes.com/blocksy/
Description: Custom child theme for arbū MEN.
Author: arbū
Template: blocksy
Version: 1.1.3
Text Domain: blocksy-child
*/

/* ==========================================================================
   arbū MEN — Fonts
   ========================================================================== */

@font-face {
	font-family: "NeutrafaceText";
	src: url("assets/fonts/NeutrafaceText-Light.woff2") format("woff2");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "NeutrafaceText";
	src: url("assets/fonts/NeutrafaceText-Book.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "NeutrafaceText";
	src: url("assets/fonts/NeutrafaceText-Bold.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* ==========================================================================
   arbū MEN — Design tokens
   ========================================================================== */

:root {
	/* Typography */
	--arbu-font-primary:
		"NeutrafaceText",
		sans-serif;

	/* Core brand colours */
	--arbu-color-black: #06070f;
	--arbu-color-white: #FAFBFC;
	--arbu-men-accent: #adfa53;

	/* Supporting neutrals */
	--arbu-color-surface: #f4f4f2;
	--arbu-color-border: #D9D9D9;
	--arbu-color-muted: #676b70;
	--arbu-men-accent-dark: #252c61;

	/* Layout */
	--arbu-container-width: 1680px;
	--arbu-page-edge: clamp(1rem, 3vw, 3.125rem);
	--arbu-grid-gap: 1rem;

	/* Motion */
	--arbu-transition-fast: 180ms ease;
	--arbu-transition-base: 280ms ease;
}

@media (max-width: 1024px) {
	:root {
		--arbu-page-edge: 1.5rem;
	}
}

@media (max-width: 767px) {
	:root {
		--arbu-page-edge: 1rem;
	}
}

/*
 * Horizontal safety spacing for top-level Elementor containers only.
 * Nested containers and intentionally full-bleed containers are unaffected.
 */
body.elementor-page .elementor > .e-con:not(.arbu-full-bleed) {
	padding-inline: var(--arbu-page-edge);
}
.green-accent {
	color: #adfa53;
}

/* ==========================================================================
   arbū MEN — Global typography
   ========================================================================== */

html {
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
}

body,
button,
input,
select,
textarea {
	font-family: var(--arbu-font-primary);
}

body {
	font-size: clamp(1rem, 0.962rem + 0.16vw, 1.0625rem);
	font-weight: 400;
	line-height: 1.5;
	color: var(--arbu-color-black);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--arbu-font-primary);
	font-weight: 700;
	color: var(--arbu-color-black);
	text-wrap: balance;
}

h1 {
	font-size: clamp(2.375rem, 1.95rem + 1.8vw, 3.5rem);
	line-height: 1.02;
}

h2 {
	font-size: clamp(2rem, 1.7rem + 1.25vw, 2.625rem);
	line-height: 1.08;
}
h2.woocommerce-loop-product__title{
	font-size: clamp(1.2rem, 0.4rem + 0.55vw, 2rem);
	line-height: 1.08;
}

h3 {
	font-size: clamp(1.5625rem, 1.35rem + 0.9vw, 1.875rem);
	line-height: 1.12;
}

h4 {
	font-size: clamp(1.3125rem, 1.2rem + 0.45vw, 1.4375rem);
	line-height: 1.2;
}

p {
	margin-top: 0;
	margin-bottom: 1em;
}

strong,
b {
	font-weight: 700;
}

::selection {
	color: var(--arbu-color-black);
	background: var(--arbu-men-accent);
}

/* ==========================================================================
   arbū MEN — Layout helpers
   ========================================================================== */

.arbu-shell {
	box-sizing: border-box;
	width: 100%;
	max-width: calc(var(--arbu-container-width) + (2 * var(--arbu-page-edge)));
	margin-inline: auto;
	padding-inline: var(--arbu-page-edge);
}

.arbu-copy {
	max-width: 720px;
}

.arbu-copy--wide {
	max-width: 900px;
}

.arbu-copy--narrow {
	max-width: 620px;
}

.arbu-product-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--arbu-grid-gap);
}

@media (max-width: 1024px) {
	.arbu-product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.arbu-product-grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   arbū MEN — Product visual-size system

   The polished 1200×1800 main images are normalized for single-product pages.
   Product visual size is therefore used only in multi-product contexts to
   restore the real-world packaging hierarchy.

   This is the single source of truth for both Shop/Related and Routine scales.
   ========================================================================== */

.arbu-visual-size-xs {
	--arbu-packshot-grid-scale: 0.64;
	--arbu-packshot-routine-scale: 0.70;
}

.arbu-visual-size-small {
	--arbu-packshot-grid-scale: 0.68;
	--arbu-packshot-routine-scale: 0.74;
}

.arbu-visual-size-medium {
	--arbu-packshot-grid-scale: 0.76;
	--arbu-packshot-routine-scale: 0.82;
}

.arbu-visual-size-large {
	--arbu-packshot-grid-scale: 0.88;
	--arbu-packshot-routine-scale: 0.91;
}

.arbu-visual-size-tall {
	--arbu-packshot-grid-scale: 1;
	--arbu-packshot-routine-scale: 1;
}

/* Shop, category and related-product cards. */
.woocommerce ul.products li.product[class*="arbu-visual-size-"] .ct-media-container,
.woocommerce-page ul.products li.product[class*="arbu-visual-size-"] .ct-media-container,
.woocommerce ul.products li.product[class*="arbu-visual-size-"] .ct-image-container,
.woocommerce-page ul.products li.product[class*="arbu-visual-size-"] .ct-image-container {
	overflow: hidden;
	background: #D9D9D9;
}

/*
 * Blocksy renders the hover image first (.ct-swap) and the actual featured
 * packshot second (.wp-post-image). Scale the packshot explicitly rather than
 * relying on DOM position.
 */
.woocommerce ul.products li.product[class*="arbu-visual-size-"] .ct-media-container > img.wp-post-image,
.woocommerce-page ul.products li.product[class*="arbu-visual-size-"] .ct-media-container > img.wp-post-image,
.woocommerce ul.products li.product[class*="arbu-visual-size-"] .ct-image-container img.wp-post-image,
.woocommerce-page ul.products li.product[class*="arbu-visual-size-"] .ct-image-container img.wp-post-image,
.woocommerce ul.products li.product[class*="arbu-visual-size-"] .woocommerce-loop-product__link > img.wp-post-image,
.woocommerce-page ul.products li.product[class*="arbu-visual-size-"] .woocommerce-loop-product__link > img.wp-post-image {
	transform: scale(var(--arbu-packshot-grid-scale, 1)) !important;
	transform-origin: 50% 100% !important;
	transition: transform var(--arbu-transition-base);
}

/*
 * Transparent main PNG + Blocksy "Swap":
 * data-hover="swap" belongs to the product-list UL, not to a descendant inside
 * each product card. Keep the swap image hidden until the card is hovered.
 */
.woocommerce ul.products[data-hover="swap"] li.product .ct-swap,
.woocommerce-page ul.products[data-hover="swap"] li.product .ct-swap {
	opacity: 0;
}

.woocommerce ul.products[data-hover="swap"] li.product:hover .ct-swap,
.woocommerce-page ul.products[data-hover="swap"] li.product:hover .ct-swap {
	opacity: 1;
}

[data-products="type-2"] .ct-woo-card-actions .button, [data-products="type-2"] .ct-woo-card-actions .added_to_cart {
	background: var(--arbu-men-accent-dark);
	border-radius: 0;
}
[data-products="type-2"] .ct-woo-card-actions .button:hover, [data-products="type-2"] .ct-woo-card-actions .added_to_cart:hover {
	background: var(--arbu-men-accent);
}
[data-products="type-2"] .ct-woo-card-actions > * {
	min-height: 44px;
}
[data-products] .product > * {
	margin-bottom: var(--product-element-spacing, 1.1rem);
}
:is(.star-rating, .wc-block-components-product-rating-stars__stars, .wp-block-woocommerce-product-filter-rating .wc-block-components-product-rating__stars, .wc-block-grid__product-rating .wc-block-grid__product-rating__stars, .has-rating .wc-block-components-review-list-item__rating > .wc-block-components-review-list-item__rating__stars) {
	font-size: .7em;
	letter-spacing: .3em;
}
.balance-text {
	text-wrap: balance;
}

.blog .entry-card .entry-title {
	font-size: 22px;
	color: var(--arbu-men-accent-dark);
}
/* ==========================================================================
   Product cards — clean image swap
   Prevent main + hover image ghosting during mouseleave
   ========================================================================== */

.products[data-hover="swap"] .ct-media-container .ct-swap,
.products[data-hover="swap"] .ct-media-container img.wp-post-image {
	transition-property: none !important;
	transition-duration: 0s !important;
	transition-delay: 0s !important;
}