/*
Theme Name: HWAYNCT Precision
Theme URI: https://hwaynct.com/
Author: HWAYNCT
Author URI: https://hwaynct.com/
Description: A purpose-built block theme for HWAYNCT carbide cutting tools, combining direct ecommerce with volume and custom-tool enquiries.
Version: 0.2.1
Requires at least: 6.6
Requires PHP: 8.0
Text Domain: hwaynct
*/

:root {
--hw-shadow-sm: 0 10px 30px rgba(8, 27, 61, 0.08);
--hw-shadow-lg: 0 28px 80px rgba(3, 18, 43, 0.2);
--hw-border: rgba(24, 54, 93, 0.14);
}

html { scroll-behavior: smooth; }

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

.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block-start: 0; }

a { text-underline-offset: 0.18em; }

.hw-site-header {
position: sticky;
top: 0;
z-index: 30;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(18px);
}

/* One authoritative bilingual header for pages, archives and custom SKU views. */
.hwn-header { position: sticky; top: 0; z-index: 100; border-bottom: 1px solid rgba(255,255,255,.1); background: #061a3a; color: #fff; }
.hwn-header__inner { display: flex; align-items: center; gap: clamp(1rem,2vw,2rem); width: min(100% - 40px,1870px); min-height: 106px; margin: 0 auto; }
.hwn-brand { display: inline-flex; align-items: center; gap: .8rem; flex: 0 0 auto; color: #fff; text-decoration: none; }
.hwn-brand img { display: block; width: 64px; height: 60px; object-fit: contain; border-radius: 50%; }
.hwn-brand span { display: grid; gap: .16rem; }
.hwn-brand strong { font-size: 1.7rem; line-height: 1; letter-spacing: .035em; }
.hwn-brand small { color: #b9d0f1; font-size: .78rem; line-height: 1.2; letter-spacing: .15em; text-transform: uppercase; }
.hwn-nav { display: flex; align-items: center; justify-content: center; gap: clamp(1.05rem,1.8vw,2rem); margin-left: auto; }
.hwn-nav a { color: #fff; font-size: 1rem; font-weight: 750; text-decoration: none; white-space: nowrap; }
.hwn-nav a:hover, .hwn-nav a:focus-visible { color: #9fc5ff; }
.hwn-mega { position: static; }
.hwn-mega summary { display: flex; align-items: center; gap: .4rem; color: #fff; font-size: 1rem; font-weight: 750; cursor: pointer; list-style: none; white-space: nowrap; }
.hwn-mega summary::-webkit-details-marker { display: none; }
.hwn-mega summary::after { content: ""; width: .42rem; height: .42rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; }
.hwn-mega[open] summary, .hwn-mega summary:hover, .hwn-mega summary:focus-visible { color: #9fc5ff; }
.hwn-mega[open] summary::after { transform: rotate(225deg) translate(-1px,-1px); }
.hwn-mega__panel { position: absolute; top: calc(100% - 10px); left: 50%; display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 1rem; width: min(940px,calc(100vw - 48px)); padding: 1.15rem; border: 1px solid #d9e3f0; border-radius: 16px; background: #fff; color: #061a3a; box-shadow: 0 24px 70px rgba(2,16,40,.28); transform: translateX(-50%); }
.hwn-mega__panel::before { content: ""; position: absolute; inset: -14px 0 auto; height: 14px; }
.hwn-mega__intro { padding: 1.2rem; border-radius: 12px; background: linear-gradient(145deg,#071f4d,#123c78); color: #fff; }
.hwn-mega__intro span, .hwn-mega__group > span { display: block; margin-bottom: .65rem; color: #78aefd; font-size: .7rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.hwn-mega__intro strong { display: block; font-size: 1.25rem; line-height: 1.25; }
.hwn-mega__intro p { margin: .7rem 0 1rem; color: #d7e5f8; font-size: .86rem; line-height: 1.55; }
.hwn-mega__intro a { color: #fff; font-size: .88rem; }
.hwn-mega__group { padding: .75rem; }
.hwn-mega__group > span { color: #55708f; }
.hwn-mega__group a { display: grid; gap: .15rem; padding: .65rem .7rem; border-radius: 9px; color: #0a2d5c; }
.hwn-mega__group a:hover, .hwn-mega__group a:focus-visible { background: #edf4fd; color: #0a2d5c; }
.hwn-mega__group a strong { font-size: .9rem; }
.hwn-mega__group a small { color: #687c95; font-size: .75rem; font-weight: 500; white-space: normal; }
.hwn-quote, .hwn-mobile__quote { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .25rem 1.25rem; border-radius: 10px; background: #ef3038; color: #fff; font-weight: 800; text-decoration: none; white-space: nowrap; }
.hwn-mobile { display: none; position: relative; margin-left: auto; }
.hwn-mobile summary { padding: .68rem .85rem; border: 1px solid rgba(255,255,255,.55); border-radius: 8px; color: #fff; font-weight: 800; cursor: pointer; list-style: none; }
.hwn-mobile summary::-webkit-details-marker { display: none; }
.hwn-mobile nav { position: absolute; top: calc(100% + .65rem); right: 0; display: grid; gap: .2rem; width: min(320px,calc(100vw - 32px)); padding: .75rem; border: 1px solid #dbe4f1; border-radius: 12px; background: #fff; box-shadow: 0 18px 48px rgba(2,16,40,.24); }
.hwn-mobile nav a { padding: .75rem .8rem; border-radius: 7px; color: #061a3a; font-weight: 750; text-decoration: none; }
.hwn-mobile nav a:hover, .hwn-mobile nav a:focus-visible { background: #edf4fd; }
.hwn-mobile nav .hwn-mobile__quote { margin-top: .25rem; color: #fff; }
@media (max-width: 1180px) { .hwn-header__inner { min-height: 84px; } .hwn-nav, .hwn-quote { display: none; } .hwn-mobile { display: block; } }
@media (max-width: 520px) { .hwn-header__inner { width: min(100% - 24px,1870px); min-height: 74px; } .hwn-brand img { width: 48px; height: 48px; } .hwn-brand strong { font-size: 1.2rem; } .hwn-brand small { max-width: 175px; font-size: .62rem; letter-spacing: .1em; } }

.hwn-whatsapp { position: fixed; right: 14px; bottom: max(14px,env(safe-area-inset-bottom)); z-index: 90; display: inline-grid; place-items: center; width: 44px; min-height: 44px; padding: 0; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; background: #1fa855; color: #fff!important; box-shadow: 0 8px 22px rgba(4,57,29,.25); line-height: 1; text-decoration: none; cursor: grab; touch-action: none; user-select: none; -webkit-user-select: none; transition: background .18s ease,box-shadow .18s ease; }
.hwn-whatsapp:hover, .hwn-whatsapp:focus-visible { background: #168944; color: #fff; box-shadow: 0 12px 28px rgba(4,57,29,.32); }
.hwn-whatsapp:focus-visible { outline: 3px solid rgba(31,168,85,.28); outline-offset: 3px; }
.hwn-whatsapp.is-dragging { cursor: grabbing; transition: none; }
.hwn-whatsapp__icon { display: grid; place-items: center; width: 100%; height: 100%; border-radius: inherit; }
.hwn-whatsapp__icon svg { width: 23px; height: 23px; display: block; }
.hwn-whatsapp__text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 600px) { .hwn-whatsapp { right: 10px; bottom: max(68px,calc(env(safe-area-inset-bottom) + 10px)); width: 40px; min-height: 40px; } .hwn-whatsapp__icon svg { width: 21px; height: 21px; } }

.hw-brand-mark {
display: inline-flex;
align-items: center;
justify-content: center;
width: 46px;
height: 46px;
border: 2px solid var(--wp--preset--color--signal);
border-radius: 50%;
overflow: hidden;
color: transparent;
font-size: 0;
background: #fff url("./assets/images/hwaynct-logo.jpg") center / 118% auto no-repeat;
box-shadow: inset 0 0 0 2px rgba(7, 27, 59, 0.08);
}

.hw-eyebrow {
letter-spacing: 0.14em;
text-transform: uppercase;
font-size: 0.78rem;
font-weight: 700;
}

.hw-hero {
position: relative;
overflow: hidden;
isolation: isolate;
}

.hw-hero::before,
.hw-hero::after {
content: "";
position: absolute;
border-radius: 999px;
z-index: -1;
}

.hw-hero::before {
width: 560px;
height: 560px;
right: -180px;
top: -260px;
background: radial-gradient(circle, rgba(31, 112, 255, 0.3), transparent 67%);
}

.hw-hero::after {
width: 420px;
height: 420px;
left: 35%;
bottom: -330px;
border: 1px solid rgba(255, 255, 255, 0.18);
}

.hw-tool-visual {
position: relative;
min-height: 430px;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.16);
border-radius: 28px;
background:
linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.02)),
repeating-linear-gradient(105deg, transparent 0 28px, rgba(255,255,255,.04) 29px 30px);
box-shadow: var(--hw-shadow-lg);
}

.hw-tool-visual::before {
content: "";
position: absolute;
width: 94px;
height: 610px;
left: 50%;
top: -80px;
transform: translateX(-50%) rotate(24deg);
border-radius: 48px 48px 18px 18px;
background:
repeating-linear-gradient(130deg, rgba(255,255,255,.08) 0 25px, rgba(5,28,68,.25) 26px 47px),
linear-gradient(90deg, #263b70 0%, #7f91c1 22%, #202f5d 50%, #6c7fae 78%, #17264f 100%);
box-shadow: -18px 28px 48px rgba(0,0,0,.3);
}

.hw-tool-visual::after {
content: "PRECISION / 0.2 MM";
position: absolute;
right: 24px;
bottom: 22px;
color: rgba(255,255,255,.7);
font-size: .72rem;
letter-spacing: .16em;
}

.hw-stat-row {
border-top: 1px solid rgba(255,255,255,.16);
}

.hw-card {
height: 100%;
border: 1px solid var(--hw-border);
border-radius: 20px;
background: #fff;
box-shadow: var(--hw-shadow-sm);
transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.hw-card:hover {
transform: translateY(-5px);
border-color: rgba(31, 112, 255, 0.35);
box-shadow: 0 20px 48px rgba(8, 27, 61, 0.13);
}

.hw-card-index {
display: inline-flex;
align-items: center;
justify-content: center;
width: 42px;
height: 42px;
border-radius: 12px;
background: var(--wp--preset--color--mist);
color: var(--wp--preset--color--primary);
font-weight: 800;
}

.hw-unit-card {
position: relative;
overflow: hidden;
border-radius: 24px;
}

.hw-unit-card::after {
content: "";
position: absolute;
width: 180px;
height: 180px;
right: -70px;
bottom: -90px;
border: 26px solid rgba(255,255,255,.09);
border-radius: 50%;
pointer-events: none;
}

.hw-spec-chip {
display: inline-block;
padding: .38rem .7rem;
border: 1px solid rgba(255,255,255,.18);
border-radius: 999px;
background: rgba(255,255,255,.08);
font-size: .78rem;
}

.hw-process-step {
border-left: 2px solid var(--wp--preset--color--accent);
}

.hw-content-page > h2 { margin-top: 2.5rem; }
.hw-content-page .hw-card { padding: clamp(1.2rem, 3vw, 2rem); }
.hw-process-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1rem;
margin: 2rem 0;
}

/* Phase 3 Applications page: content-first, image-free until approved case
 * photography is available. The cards intentionally reuse the core surface
 * language so the page feels native to the existing B2B template. */
.hw-applications-page { display: grid; gap: clamp(2.5rem, 5vw, 4.5rem); }
.hw-applications-page h2 { margin-top: 0; }
.hw-applications-hero, .hw-applications-cta { padding: clamp(1.5rem, 5vw, 4rem); border-radius: 24px; background: var(--wp--preset--color--navy); color: #fff; }
.hw-applications-hero p:not(.hw-eyebrow), .hw-applications-cta p { max-width: 780px; color: #d8e4f4; font-size: 1.08rem; line-height: 1.7; }
.hw-applications-hero h2, .hw-applications-cta h2 { color: #fff; max-width: 900px; font-size: clamp(2rem, 4vw, 3.4rem); }
.hw-applications-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.5rem; }
.hw-applications-actions .wp-element-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .75rem 1.1rem; border-radius: 8px; background: var(--wp--preset--color--signal); color: #fff; font-weight: 800; text-decoration: none; }
.hw-applications-actions .wp-element-button.is-style-outline { background: transparent; border: 1px solid rgba(255,255,255,.55); }
.hw-application-grid-page { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; margin: 1.5rem 0 0; }
.hw-application-page-card { padding: clamp(1.2rem, 2.5vw, 1.75rem); }
.hw-application-page-card h3 { margin: 1rem 0 .65rem; color: var(--wp--preset--color--navy); }
.hw-application-page-card p { color: #42516a; line-height: 1.6; }
.hw-application-page-card a { font-weight: 800; text-decoration-thickness: 2px; }
.hw-application-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; padding: 0; list-style-position: inside; }
.hw-application-steps li { padding: 1.25rem; border: 1px solid var(--hw-border); border-radius: 16px; background: var(--wp--preset--color--mist); line-height: 1.6; }
.hw-applications-note { color: #5f6b7b; font-size: .95rem; }

.hw-enquiry-form {
margin-top: 2rem;
padding: clamp(1.2rem, 4vw, 2.5rem);
border: 1px solid var(--hw-border);
border-radius: 22px;
background: #fff;
box-shadow: var(--hw-shadow-sm);
}
.hw-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.hw-enquiry-form label { display: grid; gap: .45rem; margin-bottom: 1rem; color: #18365d; font-weight: 700; }
.hw-enquiry-form input:not([type="checkbox"]),
.hw-enquiry-form select,
.hw-enquiry-form textarea {
width: 100%;
box-sizing: border-box;
padding: .82rem .9rem;
border: 1px solid #b9c6d8;
border-radius: 8px;
background: #fff;
color: #071b3b;
font: inherit;
}
.hw-enquiry-form input:focus,
.hw-enquiry-form select:focus,
.hw-enquiry-form textarea:focus { outline: 3px solid rgba(31,112,255,.18); border-color: #1f70ff; }
.hw-enquiry-form button {
padding: .9rem 1.35rem;
border: 0;
border-radius: 7px;
background: var(--wp--preset--color--signal);
color: #fff;
font: inherit;
font-weight: 800;
cursor: pointer;
}
.hw-consent { grid-template-columns: auto 1fr !important; align-items: start; font-weight: 500 !important; }
.hw-honeypot { position: absolute !important; left: -10000px !important; }
.hw-form-notice { margin: 1rem 0; padding: 1rem; border-radius: 8px; font-weight: 700; }
.hw-form-success { background: #e8f8ef; color: #17633a; }
.hw-form-error { background: #fff0f0; color: #9c2222; }

.hw-cta {
position: relative;
overflow: hidden;
border-radius: 28px;
}

.hw-cta::before {
content: "";
position: absolute;
width: 330px;
height: 330px;
right: -130px;
top: -180px;
border: 58px solid rgba(255,255,255,.08);
border-radius: 50%;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
color: var(--wp--preset--color--navy);
background: var(--wp--preset--color--base);
}

@media (max-width: 781px) {
.hw-site-header { position: relative; }
.hw-tool-visual { min-height: 310px; margin-top: 1rem; }
.hw-hero h1 { font-size: clamp(2.5rem, 11vw, 4rem) !important; }
.hw-stat-row {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: .65rem;
}
.hw-stat-row h3 { font-size: 1rem !important; }
.hw-stat-row p { font-size: .58rem !important; line-height: 1.4; }
.hw-form-grid, .hw-process-grid { grid-template-columns: 1fr; }
.hw-application-grid-page, .hw-application-steps { grid-template-columns: 1fr; }
.hw-applications-hero, .hw-applications-cta { padding: 1.4rem; border-radius: 18px; }
.hw-applications-hero h2, .hw-applications-cta h2 { font-size: clamp(1.9rem, 9vw, 2.8rem); line-height: 1.12; }
.hw-applications-actions { flex-direction: column; }
.hw-applications-actions .wp-element-button { width: 100%; box-sizing: border-box; text-align: center; }
}

.hw-catalog-routes .hw-card {
height: 100%;
}

.hw-volume-quote {
margin-top: 1.5rem;
padding: 1.25rem;
border-left: 4px solid var(--wp--preset--color--signal, #e11d2e);
border-radius: 8px;
background: var(--wp--preset--color--mist, #eef3f9);
}

.hw-volume-quote p {
margin: 0.35rem 0 0.9rem;
}

@media (max-width: 520px) {
.hw-site-header .wp-block-buttons { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
.hw-card { transition: none; }
}

/* ===== Phase 1 homepage brand sections ===== */
.hw-section-lead { max-width: 720px; margin: .55rem 0 1.6rem; color: #5f6b7b; font-size: 1rem; line-height: 1.65; }
.hw-application-grid, .hw-capability-grid { display: grid !important; }
.hw-application-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.hw-application-grid > .wp-block-column, .hw-capability-grid > .wp-block-column { min-width: 0; width: 100%; flex-basis: auto !important; }
.hw-application-card { height: 100%; overflow: hidden; border: 1px solid var(--hw-border); border-radius: 14px; background: #fff; box-shadow: 0 8px 24px rgba(8, 27, 61, .06); transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.hw-application-card:hover { transform: translateY(-4px); border-color: rgba(31, 112, 255, .34); box-shadow: 0 16px 36px rgba(8, 27, 61, .12); }
.hw-application-card img { display: block; width: 100%; height: 150px; object-fit: contain; padding: .75rem; box-sizing: border-box; background: #f5f7fa; border-bottom: 1px solid var(--hw-border); }
.hw-application-body { padding: 1.05rem 1.05rem 1.2rem; }
.hw-application-kicker { margin: 0 0 .45rem; color: var(--wp--preset--color--accent); font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.hw-application-body h3 { margin: 0; color: var(--wp--preset--color--navy); font-size: 1rem; line-height: 1.3; }
.hw-application-body p:not(.hw-application-kicker) { margin: .55rem 0 .9rem; color: #657184; font-size: .82rem; line-height: 1.55; }
.hw-application-body a { color: var(--wp--preset--color--spark); font-size: .78rem; font-weight: 750; text-decoration: none; }
.hw-application-body a:hover { text-decoration: underline; }
.hw-capability { border-top: 1px solid var(--hw-border); border-bottom: 1px solid var(--hw-border); }
.hw-capability-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 3rem; }
.hw-capability-list { display: grid; gap: .8rem; }
.hw-capability-item { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: .8rem; align-items: start; padding: 1rem; border: 1px solid var(--hw-border); border-radius: 10px; background: rgba(255,255,255,.72); }
.hw-capability-number { color: var(--wp--preset--color--spark); font-size: .75rem; font-weight: 850; letter-spacing: .06em; }
.hw-capability-item h3 { margin: 0; color: var(--wp--preset--color--navy); font-size: .92rem; }
.hw-capability-item p { margin: .25rem 0 0; color: #657184; font-size: .78rem; line-height: 1.5; }
@media (max-width: 960px) { .hw-application-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 781px) { .hw-capability-grid { grid-template-columns: 1fr; gap: 1.5rem; } }
@media (max-width: 520px) { .hw-application-grid { grid-template-columns: 1fr; } .hw-application-card img { height: 175px; } }

/* Real HWAYNCT product photography for the homepage family cards. */
.home #products .hw-card {
	overflow: hidden;
}
.home #products .hw-card::before {
	content: "";
	display: block;
	width: calc(100% + var(--wp--preset--spacing--30) * 2);
	margin: calc(var(--wp--preset--spacing--40) * -1) calc(var(--wp--preset--spacing--30) * -1) var(--wp--preset--spacing--30);
	aspect-ratio: 4 / 3;
	background-color: #f5f7fa;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border-bottom: 1px solid var(--hw-border);
}
.home #products .wp-block-column:nth-child(1) .hw-card::before {
	background-image: url('/wp-content/uploads/2026/08/HW-TB-I-007-primary-01.webp');
}
.home #products .wp-block-column:nth-child(2) .hw-card::before {
	background-image: url('/wp-content/uploads/2026/08/HW-MF-M-001-primary-01.webp');
}
.home #products .wp-block-column:nth-child(3) .hw-card::before {
	background-image: url('/wp-content/uploads/2026/08/HW-RF-I-006-primary-01.webp');
}
@media (max-width: 781px) {
	.home #products .hw-card::before { aspect-ratio: 16 / 10; }
}

/* ===== Amazon-style ecommerce layout (Gutenberg patterns) ===== */

.hw-topbar {
	gap: 1rem;
	padding: 0.9rem 0;
}
.hw-topbar .hw-eyebrow-tiny { margin: 0.15rem 0 0; }

.hw-search {
	flex: 1 1 280px;
	min-width: 220px;
	max-width: 560px;
}
.hw-search .wp-block-search__inside-wrapper {
	border: 1px solid rgba(255,255,255,.16);
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
}
.hw-search .wp-block-search__input {
	border: 0;
	background: transparent;
	color: var(--wp--preset--color--ink);
	font-size: 0.9rem;
	padding: 0.6rem 0.8rem;
}
.hw-search .wp-block-search__input::placeholder { color: #8a919b; }
.hw-search .wp-block-search__button {
	border: 0;
	background: var(--wp--preset--color--amber);
	color: #fff;
	margin: 0;
	padding: 0.6rem 1rem;
}

.hw-mainnav .wp-block-navigation__container a,
.hw-catnav a,
.hw-catnav-right {
	color: #e9edf5;
}
.hw-mainnav a:hover,
.hw-catnav a:hover,
.hw-catnav-right:hover { color: #fff; }

.hw-tools {
	display: flex;
	align-items: center;
	gap: 0.35rem;
}
.hw-tool {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1px;
	padding: 0.45rem 0.7rem;
	border-radius: 8px;
	color: #eef1f6;
	text-decoration: none;
}
.hw-tool:hover { background: rgba(255,255,255,.09); }
.hw-tool-main { font-size: 0.8rem; font-weight: 700; line-height: 1; }
.hw-tool-sub { font-size: 0.68rem; color: #aeb7c6; }
.hw-count {
	position: absolute;
	top: 2px;
	right: 2px;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: 999px;
	background: var(--wp--preset--color--spark);
	color: #fff;
	font-size: 10.5px;
	font-weight: 700;
	display: grid;
	place-items: center;
}

.hw-catnav {
	gap: 0.35rem;
	align-items: center;
	padding: 0.2rem 0 0.55rem;
}
.hw-catnav .wp-block-navigation__container { gap: 0.35rem; }
.hw-catnav a,
.hw-catnav-right {
	padding: 0.5rem 0.7rem;
	border-radius: 7px;
	font-size: 0.82rem;
	text-decoration: none;
}
.hw-catnav a:hover,
.hw-catnav-right:hover { background: rgba(255,255,255,.09); }
.hw-catnav-right { margin-left: auto; }

.hw-promo-kick {
	display: inline-flex;
	width: fit-content;
	align-items: center;
	gap: 8px;
	padding: 5px 11px;
	border-radius: 7px;
	background: rgba(226,99,12,.18);
	color: #ffcf9c;
	font-weight: 600;
}
.hw-promo h1 { max-width: 560px; }
.hw-promo-img {
	margin: 0;
	overflow: hidden;
}
.hw-promo-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hw-cats,
.hw-shelf-grid,
.hw-trust-grid {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.9rem;
	margin: 0;
}
.hw-cats > .wp-block-column,
.hw-shelf-grid > .wp-block-column,
.hw-trust-grid > .wp-block-column {
	flex-basis: auto !important;
	width: 100%;
	min-width: 0;
}

.hw-cat {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	height: 100%;
	padding: 0.8rem;
	border: 1px solid var(--hw-border);
	border-radius: 8px;
	background: #fcfcfd;
	color: inherit;
	text-decoration: none;
}
.hw-cat:hover {
	border-color: var(--wp--preset--color--spark);
	box-shadow: var(--hw-shadow-sm);
}
.hw-cat-ic {
	width: 40px;
	height: 40px;
	flex: none;
	border-radius: 7px;
	display: grid;
	place-items: center;
	font-size: 1.05rem;
}
.hw-cat-copy b { display: block; font-size: 0.86rem; color: var(--wp--preset--color--navy); }
.hw-cat-copy span { display: block; font-size: 0.72rem; color: #8a919b; }
.hw-cat-amber .hw-cat-ic { background: #fdebd8; color: #b74a05; }
.hw-cat-teal .hw-cat-ic { background: var(--wp--preset--color--leafsoft); color: var(--wp--preset--color--leaf); }
.hw-cat-slate .hw-cat-ic { background: #e9edf4; color: #34435b; }

.hw-shelf-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 0.75rem;
	margin-bottom: 1.4rem;
}
.hw-shelf-head > .wp-block-group:first-child { margin: 0; }
.hw-shelf-head h2 { margin: 0; }
.hw-shelf-sub { margin: 0.35rem 0 0; color: #8a919b; font-size: 0.85rem; }
.hw-shelf-link { margin: 0; }
.hw-shelf-link a {
	color: var(--wp--preset--color--spark);
	font-weight: 650;
	font-size: 0.86rem;
	text-decoration: none;
}
.hw-shelf-link a:hover { text-decoration: underline; }
.hw-shelf-inner > .wp-block-group:first-child { margin-left: 0; margin-right: 0; }

.hw-pcard {
	display: flex;
	flex-direction: column;
	height: 100%;
	border: 1px solid var(--hw-border);
	border-radius: 8px;
	background: #fff;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(20,24,34,.04);
}
.hw-pcard:hover { box-shadow: var(--hw-shadow-sm); border-color: #cfd3da; }
.hw-pthumb {
	position: relative;
	aspect-ratio: 1 / 1;
	width: 100%;
	min-width: 0;
	min-height: 0;
	background: #f6f7f9;
	display: grid;
	place-items: center;
}
.hw-pimg {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0.9rem;
	box-sizing: border-box;
	width: auto !important;
	max-width: none !important;
}
.hw-pimg img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.hw-pbadge {
	position: absolute;
	top: 0.6rem;
	left: 0.6rem;
	margin: 0;
	padding: 0.25rem 0.55rem;
	border-radius: 6px;
	background: var(--wp--preset--color--spark);
	color: #fff;
	font-size: 0.62rem;
	font-weight: 800;
	text-transform: uppercase;
}
.hw-pbadge-dark { background: var(--wp--preset--color--navy); }
.hw-pbadge-leaf { background: var(--wp--preset--color--leaf); }
.hw-pbody {
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
	flex: 1;
	border-top: 1px solid var(--hw-border);
}
.hw-p-sku { margin: 0; font-size: 0.68rem; color: #8a919b; font-weight: 700; }
.hw-p-title {
	margin: 0;
	min-height: 2.6em;
	font-size: 0.9rem;
	font-weight: 650;
	line-height: 1.35;
	color: var(--wp--preset--color--navy);
}
.hw-p-chips { display: flex; flex-wrap: wrap; gap: 0.3rem; margin: 0; }
.hw-chip {
	font-size: 0.64rem;
	color: #4c535c;
	background: var(--wp--preset--color--paper);
	border: 1px solid var(--hw-border);
	padding: 0.15rem 0.45rem;
	border-radius: 5px;
	white-space: nowrap;
}
.hw-p-actions {
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0 !important;
	margin-top: auto !important;
}
.hw-p-actions .wp-block-button { flex: 1; }
.hw-p-actions .wp-block-button__link {
	width: 100%;
	justify-content: center;
	padding: 0.5rem 0.4rem;
	font-size: 0.74rem;
}

.hw-trust-band {
	border-top: 1px solid var(--hw-border);
	border-bottom: 1px solid var(--hw-border);
}
.hw-trust-item { gap: 0.8rem; }
.hw-trust-ic {
	width: 38px;
	height: 38px;
	flex: none;
	border-radius: 7px;
	background: var(--wp--preset--color--leafsoft);
	color: var(--wp--preset--color--leaf);
	display: grid;
	place-items: center;
	font-size: 1rem;
	font-weight: 700;
}
.hw-trust-title { margin: 0; font-size: 0.86rem; }
.hw-trust-sub { margin: 0.15rem 0 0; font-size: 0.74rem; color: #8a919b; }

.hw-eyebrow-on-dark { letter-spacing: 0.14em; }
.hw-quality .hw-process-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 1.8rem 0 0;
}
.hw-quality .hw-process-grid > .wp-block-column { flex-basis: auto !important; min-width: 0; }
.hw-quality-cta { background: var(--wp--preset--color--base); }

@media (max-width: 781px) {
	.hw-topbar { flex-direction: column; align-items: stretch; }
	.hw-search { order: 5; flex-basis: 100%; max-width: 100%; }
	.hw-tools { justify-content: flex-start; }
	.hw-cats, .hw-shelf-grid, .hw-trust-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hw-quality .hw-process-grid { grid-template-columns: 1fr; }
	.hw-promo-grid { grid-template-columns: 1fr !important; }
	.hw-promo-grid .wp-block-column:last-child { order: -1; }
	.hw-catnav { overflow-x: auto; flex-wrap: nowrap; }
	.hw-catnav-right { margin-left: 0; }
}

@media (max-width: 520px) {
	.hw-cats, .hw-shelf-grid, .hw-trust-grid { grid-template-columns: 1fr; }
	.hw-mainnav { display: none; }
}

/* ===== Footer ===== */
.hw-footer-grid { display: flex; margin: 0; }
.hw-footer-grid > .wp-block-column:first-child { min-width: 240px; }
.hw-footer-grid .wp-block-heading {
	margin: 0 0 0.9rem;
	color: var(--wp--preset--color--base);
	font-size: 0.72rem;
	letter-spacing: 0.14em;
}
.hw-footer-grid .wp-block-list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.hw-footer-grid .wp-block-list li { margin: 0; }
.hw-footer-grid .wp-block-list a {
	color: #c5d1e3;
	text-decoration: none;
}
.hw-footer-grid .wp-block-list a:hover { color: #fff; text-decoration: underline; }
.hw-footer-grid p:not(.wp-block-heading) a { color: #dbe3ef; text-decoration: none; }
.hw-footer-grid p:not(.wp-block-heading) a:hover { color: #fff; text-decoration: underline; }
.hw-footer-grid + .wp-block-separator { margin-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30); }

@media (max-width: 900px) {
	.hw-footer-grid { flex-wrap: wrap; gap: 2rem; }
	.hw-footer-grid > .wp-block-column:first-child { flex-basis: 100% !important; }
	.hw-footer-grid > .wp-block-column { flex: 1 1 30%; }
}

@media (max-width: 560px) {
	.hw-footer-grid > .wp-block-column { flex: 1 1 100% !important; }
}
