/* =========================================================================
   ALCT — custom layer on top of theme.json
   Matches the proposal concept: warm paper, petrol-teal, bronze + burnt amber,
   Oswald / Barlow / IBM Plex Mono. Precision crosshair motifs, mono spec chips.
   ========================================================================= */

:root {
	--alct-ink: var(--wp--preset--color--ink, #17191D);
	--alct-petrol: var(--wp--preset--color--petrol, #164A73);
	--alct-petrol-deep: var(--wp--preset--color--petrol-deep, #0E2B45);
	--alct-muted: var(--wp--preset--color--steel-400, #5F646C);
	--alct-ink-muted: var(--wp--preset--color--steel-600, #41474D);
	--alct-line: var(--wp--preset--color--steel-200, #DBDBD3);
	--alct-paper: var(--wp--preset--color--paper, #F4F4F1);
	--alct-amber: var(--wp--preset--color--amber, #B45309);
	--alct-amber-600: var(--wp--preset--color--amber-600, #8A3F08);
	--alct-daintree: var(--wp--preset--color--daintree, #2C5D4E);
	--alct-piper: var(--wp--preset--color--piper, #9A5B2B);
	--alct-mono: var(--wp--preset--font-family--mono, "IBM Plex Mono", monospace);
	--alct-display: var(--wp--preset--font-family--display, "Oswald", sans-serif);
}

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

h1, h2, h3, h4, h5, h6 { text-wrap: balance; }

/* ---- Eyebrow / kicker: mono label with a leading amber tick ------------- */
.alct-eyebrow {
	font-family: var(--alct-mono);
	font-size: 0.76rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	color: var(--alct-muted);
	margin: 0 0 0.3rem;
}
.alct-eyebrow::before { content: ""; width: 1.6rem; height: 2px; background: var(--alct-amber); display: inline-block; }
.alct-eyebrow.is-center { justify-content: center; }
.alct-on-dark .alct-eyebrow { color: #B7C6C9; }

/* ---- Spec chips (mono technical data) ---------------------------------- */
.alct-spec-strip { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0.75rem 0; }
.alct-spec-chip {
	font-family: var(--alct-mono); font-size: 0.74rem; font-weight: 500; letter-spacing: 0.03em;
	color: var(--alct-ink-muted); background: #fff; border: 1px solid var(--alct-line);
	padding: 0.32em 0.6em; border-radius: 2px; white-space: nowrap;
}
.alct-on-dark .alct-spec-chip {
	color: #D6E0E1; background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.16);
}

/* ---- Hairline rule ----------------------------------------------------- */
.alct-rule { height: 1px; background: var(--alct-line); border: 0; margin: 0; }
.alct-on-dark .alct-rule { background: rgba(255,255,255,0.14); }

/* ---- Australian-made badge -------------------------------------------- */
.alct-badge-aus {
	display: inline-flex; align-items: center; gap: 0.55em;
	font-family: var(--alct-mono); font-size: 0.72rem; font-weight: 600;
	letter-spacing: 0.12em; text-transform: uppercase;
	color: #fff; background: var(--alct-amber); padding: 0.4em 0.75em; border-radius: 2px;
}
.alct-badge-aus svg { width: 1.05em; height: 1.05em; }

/* =========================================================================
   HERO — petrol gradient + blueprint grid + concentric motif + amber glow
   ========================================================================= */
.alct-hero {
	position: relative; overflow: clip; isolation: isolate;
	background: linear-gradient(135deg, #164A73 0%, #0E2B45 58%, #17191D 100%);
}
.alct-hero::before { /* blueprint grid */
	content: ""; position: absolute; inset: 0; z-index: -2;
	background-image:
		linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
	background-size: 46px 46px;
	mask-image: radial-gradient(120% 90% at 28% 8%, #000 30%, transparent 85%);
}
.alct-hero::after { /* amber glow top-right */
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: radial-gradient(55% 70% at 86% 14%, rgba(180,83,9,0.30) 0%, rgba(14,43,69,0) 66%);
}

/* Concentric crosshair graphic */
.alct-concentric {
	position: relative; aspect-ratio: 1 / 1; width: 100%; max-width: 440px; margin-inline: auto;
	border-radius: 50%;
	background:
		radial-gradient(circle, transparent 0 4px, var(--alct-amber) 4px 7px, transparent 7px),
		repeating-radial-gradient(circle, transparent 0 28px, rgba(255,255,255,0.12) 28px 29px);
}
.alct-concentric::before, .alct-concentric::after { content: ""; position: absolute; background: rgba(255,255,255,0.16); }
.alct-concentric::before { left: 50%; top: 6%; bottom: 6%; width: 1px; transform: translateX(-50%); }
.alct-concentric::after  { top: 50%; left: 6%; right: 6%; height: 1px; transform: translateY(-50%); }

/* =========================================================================
   CARDS — categories, products, guides
   ========================================================================= */
.alct-card {
	position: relative; background: #fff; border: 1px solid var(--alct-line); border-radius: 3px;
	transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; height: 100%;
}
.alct-card:hover {
	transform: translateY(-4px); border-color: var(--alct-amber);
	box-shadow: 0 18px 40px -26px rgba(23,25,29,0.55);
}
.alct-cat-card { overflow: hidden; }
.alct-cat-card .alct-cat-index { font-family: var(--alct-mono); font-size: 0.75rem; color: var(--alct-muted); letter-spacing: 0.08em; }
.alct-cat-card .alct-cat-arrow {
	display: inline-flex; width: 2.2rem; height: 2.2rem; align-items: center; justify-content: center;
	border: 1px solid var(--alct-line); border-radius: 50%;
	transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.alct-cat-card:hover .alct-cat-arrow { background: var(--alct-amber); border-color: var(--alct-amber); color: #fff; }
.alct-on-dark.alct-cat-card .alct-cat-arrow { border-color: rgba(255,255,255,0.25); }

/* ---- Stats row --------------------------------------------------------- */
.alct-stat .alct-stat-num {
	font-family: var(--alct-display); font-weight: 600; line-height: 1;
	font-size: clamp(2.4rem, 4vw, 3.4rem); color: var(--alct-ink);
}
.alct-on-dark .alct-stat .alct-stat-num { color: #fff; }
.alct-stat .alct-stat-num .u { color: var(--alct-amber); }
.alct-stat .alct-stat-label {
	font-family: var(--alct-mono); font-size: 0.72rem; letter-spacing: 0.12em;
	text-transform: uppercase; color: var(--alct-muted); margin-top: 0.4rem;
}
.alct-on-dark .alct-stat .alct-stat-label { color: #9DB0B2; }

/* =========================================================================
   TRUST STRIP
   ========================================================================= */
.alct-trust { border-block: 1px solid rgba(255,255,255,0.12); }
.alct-trust .alct-trust-item {
	font-family: var(--alct-mono); font-size: 0.8rem; letter-spacing: 0.08em;
	text-transform: uppercase; color: #CBD6D7; display: inline-flex; align-items: center; gap: 0.6em;
}
.alct-trust .alct-trust-item::before { content: "◦"; color: var(--alct-amber); }

/* =========================================================================
   INDUSTRIES & APPLICATIONS
   ========================================================================= */
.alct-industry {
	border: 1px solid var(--alct-line); border-radius: 3px; background: #fff; padding: 1.4rem 1.5rem;
	display: flex; align-items: center; gap: 0.9rem; transition: border-color .25s ease, transform .25s ease;
}
.alct-industry:hover { border-color: var(--alct-amber); transform: translateY(-3px); }
.alct-industry .alct-industry-dot { width: 9px; height: 9px; background: var(--alct-amber); flex: none; border-radius: 1px; }
.alct-industry span { font-family: var(--alct-display); font-weight: 500; letter-spacing: 0.01em; font-size: 1.15rem; }

/* =========================================================================
   BRAND BANDS (Daintree / Piper)
   ========================================================================= */
.alct-brand-daintree { background: var(--alct-daintree); color: #EAF1EE; }
.alct-brand-piper { background: var(--alct-piper); color: #F6EEE4; }
.alct-brand-daintree h2, .alct-brand-daintree h3, .alct-brand-piper h2, .alct-brand-piper h3 { color: #fff; }
.alct-brand-daintree a, .alct-brand-piper a { color: #fff; border-bottom: 1px solid rgba(255,255,255,0.4); }
.alct-brand-daintree a:hover, .alct-brand-piper a:hover { color: #fff; border-color: #fff; }
.alct-brand-wordmark {
	font-family: var(--alct-display); font-weight: 700; letter-spacing: 0.04em;
	font-size: clamp(2rem, 4vw, 3rem); line-height: 1; text-transform: uppercase; color: #fff;
}

/* =========================================================================
   BUTTONS — trailing arrow helper
   ========================================================================= */
.wp-element-button, .wp-block-button__link { position: relative; }
.alct-btn-arrow .wp-block-button__link::after { content: " →"; white-space: pre; }

/* =========================================================================
   HEADER / FOOTER
   ========================================================================= */
.alct-header {
	position: sticky; top: 0; z-index: 100;
	background: rgba(23,25,29,0.94); backdrop-filter: saturate(140%) blur(8px);
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
.alct-header .wp-block-navigation a {
	font-family: var(--alct-display); font-weight: 500; font-size: 1rem; letter-spacing: 0.01em; color: #EAEDED;
	text-transform: none;
}
.alct-header .wp-block-navigation a:hover { color: var(--alct-amber); }
.alct-logo {
	display: inline-flex; align-items: center; gap: 0.6rem;
	font-family: var(--alct-display); font-weight: 700; letter-spacing: 0.08em;
	font-size: 1.5rem; color: #fff; text-decoration: none; line-height: 1;
}
.alct-logo:hover { color: #fff; }
.alct-logo .alct-logo-mark { width: 30px; height: 30px; flex: none; }
.alct-logo small {
	display: block; font-family: var(--alct-mono); font-weight: 500; font-size: 0.54rem;
	letter-spacing: 0.26em; color: #8CA0A3; text-transform: uppercase; margin-top: 3px;
}

.alct-footer { background: var(--alct-ink); color: #AFB8BA; }
.alct-footer a { color: #AFB8BA; }
.alct-footer a:hover { color: var(--alct-amber); }
.alct-footer h2, .alct-footer h3, .alct-footer h4 { color: #fff; }
.alct-footer .alct-foot-head {
	font-family: var(--alct-mono); font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: #7E8A8C;
}

/* =========================================================================
   WOOCOMMERCE — bend defaults to the brand
   ========================================================================= */
.woocommerce ul.products li.product, ul.products li.product {
	border: 1px solid var(--alct-line); border-radius: 3px; padding: 1rem; background: #fff;
	transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.woocommerce ul.products li.product:hover {
	border-color: var(--alct-amber); transform: translateY(-4px); box-shadow: 0 18px 40px -26px rgba(23,25,29,0.55);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--alct-display); font-weight: 500; font-size: 1.15rem; padding-top: .6rem; line-height: 1.2;
}
.woocommerce ul.products li.product .price { font-family: var(--alct-mono); color: var(--alct-ink); font-weight: 600; }
.woocommerce span.onsale, .woocommerce ul.products li.product .onsale {
	background: var(--alct-amber); color: #fff; border-radius: 2px; font-family: var(--alct-mono);
	font-weight: 600; letter-spacing: .05em; min-height: auto; min-width: auto; padding: .25em .55em; line-height: 1;
}
.woocommerce div.product p.price, .woocommerce div.product span.price { font-family: var(--alct-mono); color: var(--alct-ink); }
.woocommerce .woocommerce-breadcrumb { font-family: var(--alct-mono); font-size: 0.78rem; letter-spacing: .04em; color: var(--alct-muted); }
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce button.button.alt {
	background: var(--alct-amber); color: #fff; border-radius: 2px; font-family: var(--alct-display);
	font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
}
.woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover {
	background: var(--alct-amber-600); color: #fff;
}
.woocommerce .woocommerce-result-count, .woocommerce .woocommerce-ordering { font-family: var(--alct-mono); font-size: 0.82rem; }
.alct-enquire, a.alct-enquire { background: var(--alct-amber) !important; color: #fff !important; border-radius: 2px;
	font-family: var(--alct-display); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.alct-enquire:hover { background: var(--alct-amber-600) !important; }
.alct-enquire-single { display: inline-block; margin-top: 0.75rem; }

/* ---- Block-based product archive (Shop + category pages) ---------------- */
.wc-block-product-template.columns-3 {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem;
	padding: 0; margin: 0; list-style: none;
}
.wc-block-product-template li.product {
	list-style: none; margin: 0; padding: 1rem; background: #fff; text-align: left;
	border: 1px solid var(--alct-line); border-radius: 3px;
	transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.wc-block-product-template li.product:hover {
	border-color: var(--alct-amber); transform: translateY(-4px); box-shadow: 0 18px 40px -26px rgba(23,25,29,.55);
}
.wc-block-components-product-image img, .wc-block-grid__product-image img {
	aspect-ratio: 1 / 1; width: 100%; height: auto; object-fit: contain; background: #fff; display: block;
}
.wc-block-product-template .wp-block-woocommerce-product-image { margin-bottom: .85rem; }
.wc-block-product-template .wc-block-components-product-title,
.wc-block-product-template .wp-block-post-title,
.wc-block-product-template h3 {
	font-family: var(--alct-display); font-weight: 500; font-size: 1.1rem; line-height: 1.2; margin: .3rem 0; text-align: left;
}
.wc-block-product-template .wc-block-components-product-title a,
.wc-block-product-template .wp-block-post-title a { color: var(--alct-ink); }
.wc-block-product-template .wc-block-grid__product-price,
.wc-block-product-template .wc-block-components-product-price,
.wc-block-product-template .price { font-family: var(--alct-mono); color: var(--alct-ink); text-align: left !important; }
.wc-block-product-template .wp-block-woocommerce-product-button,
.wc-block-product-template .wc-block-grid__product-add-to-cart { text-align: left; margin-top: .6rem; }
@media (max-width: 900px) { .wc-block-product-template.columns-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .wc-block-product-template.columns-3 { grid-template-columns: 1fr; } }

/* =========================================================================
   GRAVITY FORMS — brand the enquiry form
   ========================================================================= */
.gform_wrapper .gform_footer input[type=submit],
.gform_wrapper .gform_footer button,
.gform_wrapper button.gform_button {
	background: var(--alct-amber); color: #fff; border: 0; border-radius: 2px; cursor: pointer;
	font-family: var(--alct-display); font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
	padding: .9rem 1.8rem; transition: background .2s ease;
}
.gform_wrapper .gform_footer input[type=submit]:hover,
.gform_wrapper button.gform_button:hover { background: var(--alct-amber-600); }
.gform_wrapper .gfield_label { font-family: var(--alct-display); font-weight: 500; letter-spacing: .01em; }
.gform_wrapper .gfield_required { color: var(--alct-amber); }
.gform_wrapper input[type=text], .gform_wrapper input[type=email], .gform_wrapper input[type=tel],
.gform_wrapper textarea { border: 1px solid var(--alct-line); border-radius: 2px; }
.gform_wrapper input:focus, .gform_wrapper textarea:focus { border-color: var(--alct-amber); outline: none; }

/* =========================================================================
   SCROLL REVEAL (progressive — no-JS safe)
   ========================================================================= */
.alct-reveal { opacity: 1; }
.js .alct-reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.js .alct-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js .alct-reveal { opacity: 1 !important; transform: none !important; transition: none; } }

/* =========================================================================
   SMALL SCREENS
   ========================================================================= */
@media (max-width: 781px) {
	.alct-logo { font-size: 1.25rem; }
	.alct-concentric { max-width: 300px; }
}