/* =============================================================================
   Cortex Presets — light editorial redesign
   ----------------------------------------------------------------------------
   Loaded after the parent's screen.css (dependency on blockshop-main), so these
   rules win the cascade.

   Direction: warm-white paper, soft near-black ink, a warm humanist serif for
   reading and a geometric grotesque for structure. Calm, airy, photo-free. The
   only imagery on the site is the product tiles (Quad Cortex signal-chain grid
   shots) — near-black artwork that reads cleanly framed on white. The blog and
   the homepage guides carry NO imagery by design: type, whitespace and hairlines
   do the work, so there is never a thumbnail to source.

   Type: Jost (geometric sans, Futura lineage) for the wordmark, nav, buttons,
   small labels and headings; Newsreader (warm serif) for body copy, hero/section
   leads and long-form reading. Uppercase + wide tracking is reserved for the
   small structural labels (nav, buttons, eyebrows, footer heads); headings stay
   sentence case. Monochrome throughout — no accent colour.
   ========================================================================== */

:root {
	--paper:    #FFFFFF; /* page */
	--paper-2:  #F6F4EF; /* warm faint band for quiet section rhythm */
	--paper-3:  #F0EDE5; /* slightly deeper warm (hover wells) */

	--ink:      #18181B; /* near-black, faintly warm — headings, primary */
	--ink-soft: #55534D; /* warm grey — serif body copy (~70% ink) */
	--muted:    #8C8A82; /* meta / captions / labels */

	--line:     #E7E3DB; /* hairline */
	--line-2:   #D6D1C6; /* stronger hairline (hover / focus) */

	--btn-bg:   #18181B; /* solid button fill */
	--btn-bg-h: #000000;
	--btn-fg:   #FFFFFF;

	--tile-bg:  #0C0C0E; /* frame behind the near-black product art */

	--font-display: "Jost", system-ui, "Segoe UI", sans-serif;
	--font-body:    "Newsreader", Georgia, "Times New Roman", serif;

	--radius:    10px;
	--radius-sm: 7px;
	--maxw:      1200px;
	--gutter:    clamp(20px, 5vw, 64px);
	--header-h:  74px;

	--section:   clamp(56px, 9vw, 104px);
}

*, *::before, *::after { box-sizing: border-box; }

/* ----------------------------------------------------------------------------
   1. Kill the parent's scroll-reveal — it shipped content at opacity:0 /
      scale(.9) and faded it in on scroll, leaving the page half-broken on first
      paint. Force everything solid and present.
   ------------------------------------------------------------------------- */
.products li.product,
.products li .shop-product-box,
.post-item,
.ms-item,
.article-wrapper article,
.articles-section article,
[class*="animate"],
[data-aos] {
	opacity: 1 !important;
	transform: none !important;
	animation: none !important;
	transition: none !important;
}

/* ----------------------------------------------------------------------------
   2. Base + typographic rhythm
   ------------------------------------------------------------------------- */
html { background: var(--paper); -webkit-text-size-adjust: 100%; }

body {
	padding: 0 !important;
	background: var(--paper) !important;
	color: var(--ink-soft) !important;
	font-family: var(--font-body) !important;
	font-size: 17px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-shadow: none !important;
}
body p, body li, body td { color: var(--ink-soft); }
::selection { background: var(--ink); color: var(--paper); }

h1, h2, h3, h4, h5, h6,
.entry-title, .single-title, .cx-wordmark, .cx-h {
	font-family: var(--font-display) !important;
	color: var(--ink) !important;
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.1;
}

a { color: var(--ink); text-decoration: none; transition: color .15s ease, border-color .15s ease, background-color .15s ease, opacity .15s ease; }
a:hover { color: #000; }

img { max-width: 100%; height: auto; }
hr { border: 0; border-top: 1px solid var(--line); margin: var(--section) 0; }

/* the parent opens .container-fluid right after the header; cap + centre it */
body .container-fluid {
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 0 var(--gutter) var(--section) !important;
	background: var(--paper) !important;
}

/* a small structural label — uppercase, tracked, quiet (BeFound-style eyebrow) */
.cx-eyebrow {
	display: block;
	font-family: var(--font-display);
	font-size: 12px;
	font-weight: 500;
	color: var(--muted) !important;
	margin: 0 0 10px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}
.cx-section-head {
	display: flex; align-items: baseline; justify-content: space-between;
	gap: 24px; flex-wrap: wrap;
	margin: 0 0 clamp(28px, 4vw, 40px);
	padding-bottom: 18px;
	border-bottom: 1px solid var(--line);
}
.cx-section-head h2, .cx-section-head .cx-h {
	font-size: clamp(24px, 3.4vw, 34px);
	font-weight: 500;
	letter-spacing: -0.015em;
	margin: 0;
}
.cx-section-head__link {
	font-family: var(--font-display);
	font-size: 12px; font-weight: 500;
	letter-spacing: 0.14em; text-transform: uppercase;
	color: var(--muted) !important;
	white-space: nowrap;
}
.cx-section-head__link::after { content: " \2192"; }
.cx-section-head__link:hover { color: var(--ink) !important; }

/* ----------------------------------------------------------------------------
   3. Header — sticky top bar (left wordmark, nav + actions right)
   ------------------------------------------------------------------------- */
.header .nav .vertical-menu { display: none !important; }
.cx-header { position: relative; z-index: 200; }

.cx-topbar {
	position: sticky; top: 0; z-index: 200;
	background: rgba(255, 255, 255, 0.88);
	border-bottom: 1px solid var(--line);
	backdrop-filter: saturate(120%) blur(10px);
	-webkit-backdrop-filter: saturate(120%) blur(10px);
}
/* clear the WP admin bar when logged in (visitors have no .admin-bar class) */
.admin-bar #masthead { margin-top: 32px; }
.admin-bar .cx-topbar { top: 32px; }
@media (max-width: 782px) {
	.admin-bar #masthead { margin-top: 46px; }
	.admin-bar .cx-topbar { top: 46px; }
}

.cx-topbar__inner {
	max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter);
	min-height: var(--header-h);
	display: flex; align-items: center; gap: 32px;
}

.cx-wordmark { display: inline-flex; align-items: center; flex: 0 0 auto; }
.cx-wordmark__name {
	font-family: var(--font-display);
	font-weight: 600; font-size: 16px;
	letter-spacing: 0.22em; text-transform: uppercase;
	color: var(--ink) !important; white-space: nowrap;
}
.cx-wordmark:hover .cx-wordmark__name { color: #000 !important; }
.cx-wordmark--img img { max-height: 30px; width: auto; }

.cx-nav { flex: 1 1 auto; display: flex; justify-content: flex-end; }
.cx-nav__list { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 34px; }
.cx-nav__list li { margin: 0; position: relative; }
.cx-nav__list a {
	font-family: var(--font-display); font-size: 12.5px; font-weight: 500;
	letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--ink) !important; padding: 8px 0; position: relative; display: inline-block;
}
.cx-nav__list a:hover,
.cx-nav__list .current-menu-item > a,
.cx-nav__list .current_page_item > a { color: #000 !important; }
.cx-nav__list .current-menu-item > a::after,
.cx-nav__list a:hover::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 1px; background: var(--ink);
}
.cx-nav__list ul {
	position: absolute; top: 100%; left: -14px; min-width: 210px;
	background: var(--paper); border: 1px solid var(--line);
	border-radius: var(--radius-sm); padding: 8px; list-style: none; margin: 8px 0 0; display: none;
	box-shadow: 0 24px 50px -30px rgba(0,0,0,.4);
}
.cx-nav__list li:hover > ul { display: block; }
.cx-nav__list ul a { display: block; padding: 9px 12px; border-radius: 6px; letter-spacing: 0.04em; color: var(--ink-soft) !important; }
.cx-nav__list ul a:hover { background: var(--paper-2); color: #000 !important; }
.cx-nav__list ul a::after { display: none; }

.cx-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 2px; }
.cx-iconbtn {
	display: inline-flex; align-items: center; justify-content: center; position: relative; cursor: pointer;
	color: var(--ink) !important; border-radius: var(--radius-sm); background: transparent; border: 0;
}
.cx-iconbtn i { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; font-size: 19px; line-height: 1; }
.cx-iconbtn:hover, .cx-iconbtn:hover i { color: #000 !important; opacity: .65; }
.cx-actions .items-count {
	position: absolute; top: 5px; right: 2px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 9px;
	background: var(--ink); color: var(--paper) !important;
	font-family: var(--font-display); font-size: 10px; font-weight: 600; line-height: 16px; text-align: center;
}

.cx-burger {
	display: none; align-items: center; justify-content: center; width: 42px; height: 42px; margin-left: -10px;
	background: transparent; border: 0; color: var(--ink) !important; cursor: pointer; font-size: 20px;
}
@media (max-width: 991px) {
	.cx-nav { display: none; }
	.cx-burger { display: inline-flex; }
	.cx-topbar__inner { gap: 10px; }
	.cx-wordmark { margin: 0 auto 0 0; }
	.cx-actions { margin-left: auto; }
}

/* ----------------------------------------------------------------------------
   4. Offcanvas panels (mobile menu / search / cart / account)
   ------------------------------------------------------------------------- */
.menu, .search-box, .shopping-cart, .account-cont {
	background: var(--paper) !important; color: var(--ink) !important; box-shadow: 0 0 60px -16px rgba(0,0,0,.25);
}
.menu { border-right: 1px solid var(--line); }
.search-box, .shopping-cart, .account-cont { border-left: 1px solid var(--line); }
.menu a, .search-box a, .shopping-cart a, .account-cont a,
.menu .primary-menu a, .mobile-secondary-menu a { color: var(--ink) !important; }
.menu .primary-menu a { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.12em; font-size: 13px; }
.menu .primary-menu a:hover { color: #000 !important; }
.menu .primary-menu, .menu .mobile-secondary-menu, .menu .scroll-container, .menu .scroll-container ul { background: transparent !important; }
.menu .primary-menu > li { border-color: var(--line) !important; }
.close-menu, .close-search, .close-cart, .close-account { color: var(--muted) !important; }
.close-menu:hover, .close-search:hover, .close-cart:hover, .close-account:hover { color: #000 !important; }
.menu .mobile-secondary-menu { display: none !important; }
.menu .mobile-menu-footer { background: transparent !important; border-top: 1px solid var(--line) !important; }
/* make the "My account" row read like the other menu items, not loose text */
.menu .mobile-my-account { border-top: 1px solid var(--line) !important; margin: 0 !important; padding: 0 !important; }
.menu .mobile-my-account a {
	display: block !important; padding: 16px 0 !important;
	font-family: var(--font-display) !important; text-transform: uppercase; letter-spacing: 0.12em; font-size: 13px !important;
	color: var(--ink) !important;
}
.menu .mobile-my-account a:hover { color: #000 !important; }
.vertical-title { color: var(--muted) !important; }
body.overlay::after { background: rgba(24, 24, 27, 0.32) !important; }
/* The offcanvas panels are a fixed 650px wide. The parent makes the search + menu
   panels full-width on small screens but never does so for the CART, so on a phone
   the 650px cart drawer overflows the viewport and its contents sit off-screen —
   tapping the cart icon looked like nothing happened. Cap all three drawers to the
   viewport so they open correctly on mobile. */
@media (max-width: 768px) {
	.shopping-cart, .search-box, .account-cont {
		width: min(420px, 100vw) !important; max-width: 100vw !important; left: auto !important; right: 0 !important;
	}
}
.search-box .search-form input[type="search"], .search-box .search-field {
	background: var(--paper) !important; border: 1px solid var(--line) !important; color: var(--ink) !important;
}
.widget_shopping_cart_content, .widget_shopping_cart_content .total, .widget_shopping_cart_content .mini_cart_item { color: var(--ink) !important; }
.widget_shopping_cart_content .mini_cart_item { border-color: var(--line) !important; }

/* ----------------------------------------------------------------------------
   5. Buttons — solid ink primary, ghost outline secondary, underline tertiary
   ------------------------------------------------------------------------- */
.button, button.button, input[type="submit"],
.woocommerce a.button, .woocommerce button.button,
.woocommerce #respond input#submit, .woocommerce-page a.button,
a.cx-btn, .added_to_cart {
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--btn-bg) !important; color: var(--btn-fg) !important;
	border: 1px solid var(--btn-bg) !important; border-radius: 0 !important;
	font-family: var(--font-display) !important; font-weight: 500 !important;
	letter-spacing: 0.14em !important; text-transform: uppercase !important;
	padding: 15px 28px !important; line-height: 1 !important; font-size: 12.5px !important;
	transition: background .15s ease, color .15s ease, border-color .15s ease !important; text-shadow: none !important;
}
.button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce #respond input#submit:hover, a.cx-btn:hover, .added_to_cart:hover {
	background: var(--btn-bg-h) !important; border-color: var(--btn-bg-h) !important; color: var(--btn-fg) !important;
}
/* ghost variant — raise specificity so it beats the base a.cx-btn fill */
.cx-btn.cx-btn--ghost, a.cx-btn.cx-btn--ghost, .woocommerce a.button.wc-backward {
	background: transparent !important; color: var(--ink) !important; border: 1px solid var(--line-2) !important;
}
.cx-btn.cx-btn--ghost:hover, a.cx-btn.cx-btn--ghost:hover, .woocommerce a.button.wc-backward:hover {
	border-color: var(--ink) !important; color: #000 !important; background: transparent !important;
}
/* underline tertiary link — for the quiet secondary CTA */
.cx-link {
	font-family: var(--font-display); font-weight: 500; font-size: 12.5px;
	letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink) !important;
	box-shadow: inset 0 -1px 0 var(--ink); padding-bottom: 3px;
}
.cx-link:hover { color: #000 !important; box-shadow: inset 0 -2px 0 #000; }

/* ----------------------------------------------------------------------------
   6. Hero (front of shop) — clean typographic, left-aligned, airy
   ------------------------------------------------------------------------- */
.cx-hero {
	padding: clamp(48px, 9vw, 110px) 0 clamp(40px, 6vw, 72px);
	border-bottom: 1px solid var(--line);
	margin-bottom: clamp(44px, 6vw, 76px);
}
.cx-hero__title {
	font-size: clamp(40px, 7.4vw, 88px);
	font-weight: 500; letter-spacing: -0.025em; line-height: 1.02;
	margin: 0; max-width: 15ch; text-wrap: balance; color: var(--ink) !important;
}
.cx-hero__lead {
	font-family: var(--font-body) !important;
	margin: clamp(22px, 3vw, 30px) 0 0; max-width: 52ch;
	font-size: clamp(18px, 1.7vw, 21px); line-height: 1.55; color: var(--ink-soft) !important;
}
.cx-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: clamp(30px, 4vw, 40px); }

/* ----------------------------------------------------------------------------
   7. Shop — section header + name-forward product grid (product art kept)
   ------------------------------------------------------------------------- */
.cx-shop-anchor { display: block; height: 0; scroll-margin-top: 90px; }

/* collapse the parent's empty header shells so they don't add dead space */
.woocommerce-products-header:empty,
.woocommerce-notices-wrapper:empty { display: none !important; margin: 0 !important; padding: 0 !important; }

/* parent's category tabs + sort, restyled into one calm, left-aligned filter row */
.shop-content .shop-header-wrapper {
	border-bottom: 1px solid var(--line) !important; background: transparent !important;
	padding: 0 0 18px !important; margin: 0 0 clamp(30px, 4vw, 44px) !important;
}
.shop-header-block { border: 0 !important; background: transparent !important; justify-content: space-between !important; align-items: baseline; gap: 20px; }
.shop-categories { text-align: left !important; margin: 0 auto 0 0 !important; }
.shop-categories .shop-list { display: flex; flex-wrap: wrap; gap: 6px 28px; align-items: baseline; margin: 0; padding: 0; list-style: none; justify-content: flex-start; }
/* drop the parent's rotated 1px×30px diagonal-bar divider between category items */
.shop-categories .shop-list .cat-item::after, .shop-categories .shop-list .cat-item::before { display: none !important; content: none !important; }
.shop-categories .shop-list .cat-item { padding: 0 !important; margin: 0 !important; }
.shop-categories .shop-list li a, .shop-categories .shop-list li {
	color: var(--muted) !important; font-family: var(--font-display) !important; font-size: 12.5px !important; font-weight: 500 !important;
	letter-spacing: 0.14em; text-transform: uppercase;
}
.shop-categories .shop-list li.active a, .shop-categories .shop-list li.current-cat a, .shop-categories .shop-list li a:hover { color: var(--ink) !important; }
.shop-categories .shop-list .count { color: var(--muted) !important; font-size: 10px; vertical-align: super; margin-left: 3px; letter-spacing: 0; }
.sort-products, .woocommerce-ordering, .woocommerce-result-count { color: var(--muted) !important; }
.select2-container--default .select2-selection--single, .woocommerce-ordering select {
	background: var(--paper) !important; border: 1px solid var(--line) !important; color: var(--ink) !important; border-radius: var(--radius-sm) !important;
}
.select2-dropdown, .select2-results__option { background: var(--paper) !important; color: var(--ink) !important; }
.select2-results__option--highlighted { background: var(--paper-2) !important; color: #000 !important; }

/* the loose, breathing grid — overrides the parent's float/columns.
   Scoped to ul.products ONLY: the section wrappers `.related.products` and
   `.up-sells.products` also carry the bare `.products` class, so a `.products`
   selector would turn THEM into grids and squeeze their child <ul> into a single
   cell (the related-products column collapse). Reset those wrappers to block. */
.related.products, .up-sells.products, section.products { display: block !important; }
ul.products {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: clamp(34px, 4vw, 52px) clamp(20px, 2.4vw, 30px) !important;
	margin: 0 !important; padding: 0 !important; list-style: none !important;
}
ul.products::before, ul.products::after { display: none !important; content: none !important; }
.products li.product, ul.products li.product {
	width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important; clear: none !important;
	background: transparent !important;
}

/* name-forward card: framed signal-chain art, then the name as the focal point */
.shop-product-box {
	background: transparent !important; border: 0 !important; border-radius: 0 !important; overflow: visible;
	height: 100%; display: flex; flex-direction: column;
}
.shop-product-box .ft_image {
	position: relative; display: block; background: var(--tile-bg);
	border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
	aspect-ratio: 16 / 10; transition: border-color .18s ease;
}
.shop-product-box .ft_image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.products li.product:hover .ft_image { border-color: var(--line-2); }
.products li.product:hover .ft_image img { transform: scale(1.03); }

.shop-product-box, .shop-product-box .product-info, .shop-product-box .woocommerce-loop-product__title, .shop-product-box .price { text-align: left !important; }
.shop-product-box .cx-loop-title-link { display: block; text-decoration: none !important; }
.shop-product-box .product-info { padding: 16px 2px 0; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; flex: 1 1 auto; }
.shop-product-box .woocommerce-loop-product__title {
	font-family: var(--font-display) !important;
	font-size: 16px !important; font-weight: 500 !important; line-height: 1.28 !important; letter-spacing: -0.005em;
	margin: 0 !important; padding: 0 !important; color: var(--ink) !important;
}
.products li.product:hover .woocommerce-loop-product__title { color: #000 !important; }

.shop-product-box .price, .shop-product-box .price .amount, .shop-product-box .woocommerce-Price-currencySymbol {
	color: var(--ink-soft) !important; font-family: var(--font-display) !important; font-weight: 500 !important; font-size: 15px !important; margin: 0 !important;
}
.shop-product-box .product-info > .price { margin-top: auto !important; }
.shop-product-box a.add_to_cart_button, .shop-product-box a.added_to_cart, .shop-product-box a.button {
	align-self: flex-start; font-size: 11px !important; padding: 11px 18px !important; letter-spacing: 0.14em;
	background: transparent !important; color: var(--ink) !important; border: 1px solid var(--line-2) !important;
}
.products li.product:hover a.add_to_cart_button, .shop-product-box a.add_to_cart_button:hover {
	background: var(--btn-bg) !important; color: var(--btn-fg) !important; border-color: var(--btn-bg) !important;
}
/* kill the parent theme's corny rotate/collapse "loader" on the AJAX add — it
   shrank the button to an 18px spinning square (font-size:0). Keep the button at
   full size with its label, just dimmed, while the request runs. */
.products li.product a.add_to_cart_button.loading,
.shop-product-box a.add_to_cart_button.loading {
	animation: none !important; transform: none !important; cursor: progress;
	width: auto !important; height: auto !important; min-width: 0 !important; border-radius: 0 !important;
	font-size: 11px !important; line-height: 1 !important; text-indent: 0 !important; box-shadow: none !important;
	padding: 11px 18px !important; opacity: 0.5 !important;
	background: var(--btn-bg) !important; color: var(--btn-fg) !important; border: 1px solid var(--btn-bg) !important;
}
.products li.product a.add_to_cart_button.loading::after,
.products li.product a.add_to_cart_button.loading::before,
.shop-product-box a.add_to_cart_button.loading::after,
.shop-product-box a.add_to_cart_button.loading::before {
	animation: none !important; content: none !important; display: none !important;
}
/* same calm treatment for the single product button (rarely AJAX, but be safe) */
.single-product form.cart .single_add_to_cart_button.loading { font-size: 12px !important; opacity: 0.6 !important; }
.single-product form.cart .single_add_to_cart_button.loading::before,
.single-product form.cart .single_add_to_cart_button.loading::after { animation: none !important; content: none !important; display: none !important; }
/* the "✓ added" confirmation state */
.products li.product a.add_to_cart_button.added,
.shop-product-box a.add_to_cart_button.added {
	background: var(--btn-bg) !important; color: var(--btn-fg) !important; border-color: var(--btn-bg) !important; opacity: 1 !important;
}

/* ----------------------------------------------------------------------------
   8. Homepage "From the guides" (text-only) + "How it works"
      Both render OUTSIDE the parent's capped .container-fluid (they hook
      woocommerce_after_main_content, which closes the wrapper first), so they
      cap their own inner content with .cx-wrap to stay aligned.
   ------------------------------------------------------------------------- */
.cx-wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); }
.cx-home-section { margin: 0; }
.cx-home-guides { padding: clamp(52px, 8vw, 96px) 0 0; border-top: 1px solid var(--line); }
.cx-home-how { padding: clamp(52px, 8vw, 96px) 0 0; }
body.home .container-fluid { padding-bottom: clamp(40px, 6vw, 64px) !important; }

/* text-only guide cards: hairline-topped, like an editorial contents page */
.cx-guides { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 3vw, 40px); }
.cx-guide { display: flex; flex-direction: column; border-top: 1px solid var(--line); padding-top: 20px; }
.cx-guide__cat {
	font-family: var(--font-display); font-size: 11px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase;
	color: var(--muted) !important; margin: 0 0 14px; display: block;
}
.cx-guide__cat:hover { color: var(--ink) !important; }
.cx-guide__title {
	font-family: var(--font-display); font-size: clamp(19px, 2vw, 22px); font-weight: 500; line-height: 1.25; letter-spacing: -0.01em;
	margin: 0; color: var(--ink) !important;
}
.cx-guide__title a { color: var(--ink) !important; }
.cx-guide:hover .cx-guide__title a, .cx-guide__title a:hover { color: #000 !important; opacity: .62; }
.cx-guide__date { font-family: var(--font-display); font-size: 12px; letter-spacing: 0.08em; color: var(--muted) !important; margin: 16px 0 0; }

/* short serif intro under the section heading, for warmth + context */
.cx-home-lead {
	font-family: var(--font-body); font-size: clamp(17px, 1.7vw, 20px); line-height: 1.55;
	color: var(--ink-soft) !important; max-width: 58ch; margin: -6px 0 clamp(38px, 5vw, 56px);
}

/* the steps: a big numeral anchors each one, giving the section presence */
.cx-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 64px); }
.cx-step { border-top: 1px solid var(--ink); padding-top: clamp(20px, 2.4vw, 28px); }
.cx-step__n {
	display: block; font-family: var(--font-display); font-weight: 400;
	font-size: clamp(42px, 4.8vw, 62px); line-height: 0.9; letter-spacing: -0.03em;
	color: var(--ink); margin: 0 0 clamp(20px, 2.6vw, 30px);
}
.cx-step__h { font-family: var(--font-display); font-size: clamp(20px, 2vw, 23px); font-weight: 500; letter-spacing: -0.012em; margin: 0 0 11px; color: var(--ink); }
.cx-step__p { font-family: var(--font-body); font-size: 16.5px; line-height: 1.62; color: var(--ink-soft) !important; margin: 0; max-width: 38ch; }

@media (max-width: 760px) {
	.cx-guides { grid-template-columns: 1fr; gap: 0; }
	.cx-guide { padding: 20px 0; }
	.cx-guide + .cx-guide { border-top: 1px solid var(--line); }
	.cx-steps { grid-template-columns: 1fr; gap: clamp(26px, 7vw, 40px); }
	.cx-step__n { font-size: 48px; }
}

/* ----------------------------------------------------------------------------
   9. Blog index — text-only editorial grid (no thumbnails, by design)
   ------------------------------------------------------------------------- */
/* hide every featured image the parent tries to render on the blog */
.post-item .post-thumbnail, .article-wrapper .post-thumbnail, .post-item .post-image,
.blog .post-thumbnail, .archive .post-thumbnail { display: none !important; }

/* category nav row */
.archive-header { border-bottom: 1px solid var(--line); padding-bottom: 13px; margin: clamp(18px, 2.2vw, 28px) 0 clamp(28px, 3.2vw, 42px); }
.archive-list { display: flex; flex-wrap: wrap; gap: 7px clamp(13px, 1.7vw, 20px); align-items: baseline; list-style: none; padding: 0 !important; margin: 0 !important; }
/* drop the parent's tall diagonal-bar separators — that 30px slash was what made
   the filter read like primary nav. Spacing alone separates the items now. */
.archive-list .cat-item::after, .archive-list .cat-item::before { display: none !important; content: none !important; }
.archive-list .cat-item { padding: 0 !important; margin: 0 !important; }
.archive-list .cat-item, .archive-list .cat-item a, .archive-list h1 {
	font-family: var(--font-display) !important; font-size: 11px !important; font-weight: 500 !important;
	letter-spacing: 0.1em; text-transform: uppercase;
	color: var(--muted) !important; margin: 0; display: inline;
}
.archive-list .cat-item a:hover, .archive-list .current-cat a, .archive-list .current-cat h1 a { color: var(--ink) !important; }
.archive-list .current-cat a { box-shadow: inset 0 -1px 0 var(--ink); padding-bottom: 3px; }
.archive-list .post-count { font-family: var(--font-display); font-size: 9px; color: var(--muted) !important; vertical-align: super; margin-left: 2px; letter-spacing: 0; }
.archive-padding { display: none !important; }

/* The parent lays posts out as a Bootstrap .row of .article-wrapper.col-*
   columns, absolutely positioned by masonry JS and centre-aligning some columns
   (so the grid came out lumpy and inconsistently aligned). Flatten the whole
   thing into a single-column editorial index instead: full-width rows divided by
   hairlines, each row a big title + serif excerpt on the left with a quiet "Read
   more" pinned right. One column can't collide or mis-align, so it reads as a
   deliberate journal regardless of what the parent's JS tries to do. */
.articles-section { display: block !important; margin: clamp(4px, 1vw, 10px) 0 clamp(44px, 6vw, 68px) !important; }
.articles-masonry-layout, .articles-grid-layout { width: 100% !important; max-width: none !important; display: block !important; }
.articles-section .row {
	display: block !important;
	margin: 0 !important; width: 100% !important;
	position: static !important; height: auto !important;
}
.article-wrapper, .article-wrapper[class*="col-"], .ms-item {
	width: 100% !important; max-width: none !important; flex: none !important;
	padding: 0 !important; margin: 0 !important; display: block !important;
	position: static !important; top: auto !important; left: auto !important; right: auto !important;
	height: auto !important; transform: none !important;
	border-top: 1px solid var(--line);
}
.article-wrapper { transition: background-color .18s ease; }
.article-wrapper:hover { background: var(--paper-2); }

/* hard-left every part of the card, defeating the parent's centred columns */
.article-wrapper, .article-wrapper *, .post-item, .post-item * { text-align: left !important; }

.post-item, .article-wrapper article { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; }

/* one-line contents index: title left, category right, sharing a baseline and
   divided by the wrapper hairline. The excerpt and the separate read-more link
   are hidden — the title is the link and each post reads as one scannable row. */
.post-item .post-details, .article-wrapper .entry-content-wrap {
	padding: clamp(17px, 1.9vw, 24px) clamp(0px, 1.2vw, 18px) !important;
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto;
	column-gap: clamp(24px, 4vw, 56px);
	align-items: baseline;
}
.post-item .post-content, .article-wrapper .entry-content,
.post-item .read-more, .article-wrapper .read-more { display: none !important; }

.post-item .post-title, .article-wrapper .entry-title {
	grid-column: 1; grid-row: 1; margin: 0 !important;
	font-family: var(--font-display) !important; font-size: clamp(19px, 1.85vw, 23px) !important; line-height: 1.3 !important;
	font-weight: 500 !important; letter-spacing: -0.012em;
}
.post-item .post-title a, .article-wrapper .entry-title a { color: var(--ink) !important; }
.post-item:hover .post-title a, .post-item .post-title a:hover, .article-wrapper .entry-title a:hover { color: #000 !important; }

.post-item .post-category, .post-item .entry-meta, .article-wrapper .post-meta {
	grid-column: 2; grid-row: 1; margin: 0 !important; white-space: nowrap; text-align: right !important;
}
.post-item .post-category a, .post-item .entry-meta a, .article-wrapper .post-meta a, .post-item .cat-links a {
	font-family: var(--font-display); font-size: 11px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--muted) !important;
}
.post-item .post-category a:hover, .article-wrapper .post-meta a:hover { color: var(--ink) !important; }

@media (max-width: 560px) {
	.post-item .post-details, .article-wrapper .entry-content-wrap { grid-template-columns: 1fr; row-gap: 6px; padding-top: 18px !important; padding-bottom: 18px !important; }
	.post-item .post-category, .article-wrapper .post-meta { grid-column: 1; grid-row: 1; text-align: left !important; }
	.post-item .post-title, .article-wrapper .entry-title { grid-column: 1; grid-row: 2; }
}

/* numbered pagination — blog (the_posts_pagination) and shop (WooCommerce).
   Centred row of square buttons; current page filled ink. Replaces the parent's
   infinite-scroll / prev-next. */
.pagination .nav-links, .woocommerce-pagination ul.page-numbers {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px;
	list-style: none; margin: clamp(40px, 6vw, 64px) 0 0 !important; padding: 0 !important; border: 0 !important;
}
.pagination, .woocommerce-pagination { text-align: center; border: 0 !important; }
.woocommerce-pagination ul.page-numbers li { margin: 0 !important; border: 0 !important; }
/* drop the parent's diagonal-bar separators between page numbers (the boxes
   already separate them) — same slash we removed from the category filter */
.woocommerce-pagination ul.page-numbers li::after, .woocommerce-pagination ul.page-numbers li::before { display: none !important; content: none !important; }
.pagination .page-numbers, .woocommerce-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 14px;
	font-family: var(--font-display) !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1;
	color: var(--ink) !important; background: transparent !important;
	border: 1px solid var(--line) !important; border-radius: var(--radius-sm) !important; text-decoration: none !important;
	transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.pagination a.page-numbers:hover, .woocommerce-pagination a.page-numbers:hover {
	border-color: var(--ink) !important; color: #000 !important;
}
.pagination .page-numbers.current, .woocommerce-pagination .page-numbers.current,
.woocommerce-pagination span.current {
	background: var(--ink) !important; color: var(--paper) !important; border-color: var(--ink) !important;
}
.pagination .page-numbers.dots, .woocommerce-pagination .page-numbers.dots {
	border-color: transparent !important; background: transparent !important; min-width: 22px; padding: 0;
}
.pagination .prev.page-numbers, .pagination .next.page-numbers,
.woocommerce-pagination .prev.page-numbers, .woocommerce-pagination .next.page-numbers {
	letter-spacing: 0.12em; text-transform: uppercase; font-size: 11px !important;
}
.pagination .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }

/* ----------------------------------------------------------------------------
   10. Single post — reading column (serif), no feature image
   ------------------------------------------------------------------------- */
.single-feature-img, .single .post-thumbnail { display: none !important; }

.single-header { text-align: center; padding: clamp(48px, 7vw, 88px) 0 0; }
.single-header .post-info, .single-header .post-meta { color: var(--muted) !important; font-family: var(--font-display); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; }
.single-header .post-info .post-author { color: var(--ink) !important; font-weight: 500; }
.single-header .post-info .post-category a, .single-header .post-category a { color: var(--muted) !important; }
.single-header .post-info .post-category a:hover { color: var(--ink) !important; }
.single-title { max-width: 22ch; margin: 18px auto 0; }
.single-title .entry-title { font-size: clamp(32px, 5.4vw, 56px) !important; font-weight: 500; letter-spacing: -0.025em; line-height: 1.05; }

.entry-post-meta { list-style: none; display: flex; justify-content: center; gap: 22px; padding: 0; margin: 26px 0 0; color: var(--muted) !important; font-family: var(--font-display); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; }
.entry-post-meta span { color: var(--muted) !important; }
.entry-post-meta a { color: var(--ink-soft) !important; }

.single-content.entry-content {
	max-width: 680px; margin: clamp(36px, 5vw, 52px) auto 0; font-size: 19.5px; line-height: 1.75; color: var(--ink) !important; padding-bottom: 8px !important;
	font-family: var(--font-body) !important;
}
.single-content > p, .single-content > ul, .single-content > ol, .single-content > blockquote { color: var(--ink) !important; }
.single-content p { margin: 0 0 1.3em; color: var(--ink) !important; }
.single-content h2 { font-family: var(--font-display) !important; font-size: 30px !important; margin: 1.9em 0 .5em; letter-spacing: -0.02em; color: var(--ink) !important; }
.single-content h3 { font-family: var(--font-display) !important; font-size: 23px !important; margin: 1.6em 0 .4em; letter-spacing: -0.015em; color: var(--ink) !important; }
.single-content h2, .single-content h3, .single-content h4 { line-height: 1.2; font-weight: 500; }
.single-content ul, .single-content ol { margin: 0 0 1.3em; padding-left: 1.4em; }
.single-content li { margin: 0 0 .5em; padding: 0; line-height: 1.7; color: var(--ink); }
.single-content ul > li { list-style: disc; }
.single-content ol > li { list-style: decimal; }
.single-content li::marker { color: var(--muted); }
.single-content blockquote { margin: 1.7em 0; padding: 6px 0 6px 24px; border-left: 2px solid var(--line-2); color: var(--ink-soft) !important; font-style: italic; font-size: 21px; line-height: 1.55; }
.single-content img, .single-content figure { border-radius: var(--radius); }
.single-content figcaption { color: var(--muted) !important; font-family: var(--font-display); font-size: 13px; text-align: center; margin-top: 8px; }
.single-content a {
	color: var(--ink) !important; text-decoration: underline; text-underline-offset: 3px;
	text-decoration-color: var(--line-2); text-decoration-thickness: 1px;
}
.single-content a:hover { text-decoration-color: var(--ink) !important; }

.meta-tags { max-width: 680px; margin: 16px auto 0; }
.meta-tags a {
	display: inline-block; font-family: var(--font-display); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-soft) !important;
	border: 1px solid var(--line); border-radius: 100px; padding: 6px 14px; margin: 0 6px 6px 0;
}
.meta-tags a:hover { border-color: var(--line-2); color: #000 !important; }

.cx-post-footer { max-width: 680px; margin: clamp(44px, 6vw, 60px) auto 0; padding-top: 28px; border-top: 1px solid var(--line); display: flex; gap: 14px; flex-wrap: wrap; }
.cx-post-footer a { font-family: var(--font-display); font-weight: 500; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; padding: 13px 22px; }
.cx-post-footer__back { border: 1px solid var(--line-2); color: var(--ink) !important; }
.cx-post-footer__back:hover { border-color: var(--ink); color: #000 !important; }
.cx-post-footer__shop { background: var(--btn-bg); border: 1px solid var(--btn-bg); color: var(--btn-fg) !important; }
.cx-post-footer__shop:hover { background: var(--btn-bg-h); border-color: var(--btn-bg-h); color: var(--btn-fg) !important; }

.comments-section { max-width: 680px; margin: clamp(48px, 7vw, 64px) auto 0; }
.comments-section, .comment-body, .comment-author, .comment-meta { color: var(--ink) !important; }

/* ----------------------------------------------------------------------------
   11. WooCommerce functional pages (cart / checkout / account / product) — restyle only
   ------------------------------------------------------------------------- */
.woocommerce table.shop_table, .woocommerce-cart table.cart, .woocommerce .cart-collaterals .cart_totals,
.woocommerce-checkout #order_review, .woocommerce form .form-row, .woocommerce-info, .woocommerce-message, .woocommerce-error { color: var(--ink) !important; }
.woocommerce table.shop_table { background: var(--paper) !important; border: 1px solid var(--line) !important; border-radius: var(--radius) !important; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-color: var(--line) !important; color: var(--ink) !important; }
.woocommerce table.shop_table thead th { font-family: var(--font-display); letter-spacing: 0.1em; text-transform: uppercase; font-size: 12px; }
.woocommerce .woocommerce-message, .woocommerce-info { background: var(--paper-2) !important; border-top-color: var(--ink) !important; color: var(--ink) !important; }
.woocommerce-error { background: var(--paper-2) !important; border-top-color: #b3402c !important; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea,
input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="search"], input[type="number"], textarea, select {
	background: var(--paper) !important; border: 1px solid var(--line-2) !important; color: var(--ink) !important; border-radius: var(--radius-sm) !important;
}
input::placeholder, textarea::placeholder { color: var(--muted) !important; }
input:focus, textarea:focus, select:focus { outline: none !important; border-color: var(--ink) !important; }
.woocommerce div.product p.price, .woocommerce div.product span.price, .woocommerce div.product .price .amount { color: var(--ink) !important; font-family: var(--font-display) !important; font-weight: 500 !important; }

/* ----------------------------------------------------------------------------
   11b. Single product page — framed art + buy panel, description, related
   ------------------------------------------------------------------------- */
/* breadcrumb category row: air below the header, sit it above the product */
.single-product .shop-categories { margin: clamp(16px, 3vw, 28px) 0 clamp(26px, 4vw, 40px) !important; }

/* two-column layout: framed signal-chain art left, buy panel right */
.single-product div.product.type-product {
	display: flex !important; flex-wrap: wrap; align-items: flex-start;
	gap: clamp(28px, 5vw, 64px);
}
.single-product div.product .woocommerce-product-gallery { flex: 1 1 420px; min-width: 0; margin: 0 !important; }
.single-product .summary.entry-summary { flex: 1 1 340px; min-width: 0; margin: 0 !important; }
/* tabs / related / upsells are siblings of the gallery+summary inside div.product —
   force them onto their own full-width rows so the flex pairing only applies to the
   art + buy panel (otherwise they shrink to content width as stray flex items) */
.single-product div.product.type-product > .woocommerce-tabs,
.single-product div.product.type-product > .related.products,
.single-product div.product.type-product > .up-sells.products {
	flex: 0 0 100%; width: 100%; max-width: 100%; min-width: 0;
}

/* frame the near-black art on the light page, matching the shop tiles */
.single-product .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery img { border-radius: var(--radius); }
.single-product .woocommerce-product-gallery__image {
	border: 1px solid var(--line); background: var(--tile-bg); overflow: hidden;
}

/* title */
.single-product .summary .product_title.entry-title {
	font-family: var(--font-display) !important;
	font-size: clamp(28px, 3.2vw, 40px) !important; font-weight: 500 !important;
	line-height: 1.08 !important; letter-spacing: -0.02em;
	margin: 0 0 clamp(16px, 2vw, 22px) !important; color: var(--ink) !important;
}

/* price */
.single-product .summary .price, .single-product .summary .price .amount {
	font-family: var(--font-display) !important; font-weight: 500 !important;
	font-size: clamp(22px, 2.4vw, 26px) !important; color: var(--ink) !important;
	margin: 0 0 clamp(22px, 3vw, 30px) !important;
}

/* buy form: quantity + confident add-to-cart */
.single-product form.cart {
	display: flex !important; flex-wrap: wrap; gap: 10px; align-items: stretch;
	margin: 0 0 clamp(22px, 3vw, 28px) !important;
}
/* every preset is sold individually, so WooCommerce renders the quantity as a
   hidden input inside a (still-present) .quantity wrapper — collapse it entirely
   so the buy box is just the button; the hidden input still posts quantity = 1 */
.single-product form.cart .quantity { display: none !important; margin: 0 !important; }
.single-product form.cart .quantity input.qty {
	min-height: 52px; width: 72px; text-align: center;
	font-family: var(--font-display); font-size: 15px;
	border: 1px solid var(--line-2) !important; border-radius: var(--radius-sm) !important;
	background: var(--paper) !important; color: var(--ink) !important;
}
.single-product form.cart button.single_add_to_cart_button,
.single-product form.cart .single_add_to_cart_button.button {
	flex: 1 1 auto; min-height: 52px; min-width: 190px;
	display: inline-flex; align-items: center; justify-content: center;
	font-family: var(--font-display) !important; font-size: 12px !important;
	letter-spacing: 0.16em; text-transform: uppercase;
	background: var(--btn-bg) !important; color: var(--btn-fg) !important;
	border: 1px solid var(--btn-bg) !important; border-radius: 0 !important;
	padding: 14px 28px !important; transition: background-color .18s ease;
}
.single-product form.cart button.single_add_to_cart_button:hover,
.single-product form.cart .single_add_to_cart_button.button:hover {
	background: var(--btn-bg-h) !important; border-color: var(--btn-bg-h) !important;
}

/* product meta (category / tags) */
.single-product .product_meta {
	margin: clamp(22px, 3vw, 28px) 0 0 !important; padding-top: clamp(20px, 2.6vw, 26px);
	border-top: 1px solid var(--line);
	font-family: var(--font-display); font-size: 12.5px; color: var(--muted) !important; line-height: 1.9;
}
.single-product .product_meta > span { display: block; }
.single-product .product_meta a { color: var(--ink-soft) !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-2); }
.single-product .product_meta a:hover { color: var(--ink) !important; text-decoration-color: var(--ink); }
.single-product .sale-badge-box, .single-product span.onsale { display: none !important; }

/* tabs: horizontal hairline nav + constrained serif reading panel */
.single-product .woocommerce-tabs {
	display: block !important; margin: clamp(48px, 7vw, 80px) 0 0 !important;
	border-top: 1px solid var(--line); padding-top: clamp(28px, 4vw, 40px);
}
.single-product .woocommerce-tabs ul.tabs {
	display: flex !important; flex-wrap: nowrap; width: auto !important; max-width: none !important;
	gap: clamp(20px, 3vw, 36px); list-style: none;
	margin: 0 0 clamp(26px, 4vw, 38px) !important; padding: 0 !important; border: 0 !important;
}
.single-product .woocommerce-tabs ul.tabs::before, .single-product .woocommerce-tabs ul.tabs::after,
.single-product .woocommerce-tabs ul.tabs li::before, .single-product .woocommerce-tabs ul.tabs li::after { display: none !important; content: none !important; }
.single-product .woocommerce-tabs ul.tabs li { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; }
.single-product .woocommerce-tabs ul.tabs li a {
	font-family: var(--font-display) !important; font-size: 12px !important; font-weight: 500 !important;
	letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--muted) !important; padding: 0 0 6px !important; border-bottom: 1px solid transparent;
}
.single-product .woocommerce-tabs ul.tabs li.active a, .single-product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--ink) !important; border-bottom-color: var(--ink);
}
.single-product .woocommerce-Tabs-panel {
	max-width: 720px; font-family: var(--font-body); font-size: 17px; line-height: 1.7; color: var(--ink) !important;
}
.single-product .woocommerce-Tabs-panel p { margin: 0 0 1.3em; color: var(--ink) !important; }
.single-product .woocommerce-Tabs-panel h2, .single-product .woocommerce-Tabs-panel h3 {
	font-family: var(--font-display) !important; font-weight: 500; color: var(--ink) !important; letter-spacing: -0.015em; line-height: 1.2;
}
.single-product .woocommerce-Tabs-panel h2 { font-size: 26px !important; margin: 1.8em 0 .5em; }
.single-product .woocommerce-Tabs-panel h3 { font-size: 21px !important; margin: 1.5em 0 .4em; }
.single-product .woocommerce-Tabs-panel ul, .single-product .woocommerce-Tabs-panel ol { margin: 0 0 1.3em; padding-left: 1.4em; }
.single-product .woocommerce-Tabs-panel li { margin: 0 0 .5em; line-height: 1.7; color: var(--ink); }
.single-product .woocommerce-Tabs-panel ul > li { list-style: disc; }
.single-product .woocommerce-Tabs-panel ol > li { list-style: decimal; }
.single-product .woocommerce-Tabs-panel li::marker { color: var(--muted); }
.single-product .woocommerce-Tabs-panel iframe { max-width: 100%; border-radius: var(--radius); margin: .4em 0 1.2em; }
.single-product .woocommerce-Tabs-panel a { color: var(--ink) !important; text-decoration: underline; text-underline-offset: 2px; text-decoration-color: var(--line-2); }
.single-product #reviews h2, .single-product .woocommerce-Reviews-title { font-family: var(--font-display) !important; color: var(--ink) !important; }

/* related products: hairline-divided section, framed grid (grid itself fixed in §7) */
.single-product .related.products, .single-product .up-sells.products {
	margin: clamp(56px, 8vw, 88px) 0 0 !important;
	border-top: 1px solid var(--line); padding-top: clamp(36px, 5vw, 52px);
}
.single-product .related.products > h2, .single-product .up-sells.products > h2 {
	font-family: var(--font-display) !important; font-size: clamp(20px, 2.4vw, 26px) !important; font-weight: 500 !important;
	letter-spacing: -0.01em; color: var(--ink) !important; margin: 0 0 clamp(28px, 4vw, 40px) !important;
}

/* mobile: stack art over the buy panel */
@media (max-width: 720px) {
	.single-product div.product .woocommerce-product-gallery,
	.single-product .summary.entry-summary { flex: 1 1 100%; }
	.single-product form.cart button.single_add_to_cart_button { min-width: 160px; }
}

/* ----------------------------------------------------------------------------
   11c. Cart page — editorial two-column: line-itemed bag + sticky totals card
   ------------------------------------------------------------------------- */
body.woocommerce-cart .col-woo,
body.woocommerce-checkout .col-woo,
body.woocommerce-account .col-woo {
	flex: 1 1 100% !important; max-width: 100% !important; width: 100% !important;
}
body.woocommerce-cart .single-content.entry-content,
body.woocommerce-checkout .single-content.entry-content,
body.woocommerce-account .single-content.entry-content { max-width: none !important; width: auto !important; }

body.woocommerce-cart .entry-title,
body.woocommerce-checkout .entry-title,
body.woocommerce-account .entry-title {
	font-family: var(--font-display) !important; font-weight: 500 !important;
	font-size: clamp(30px, 4.4vw, 48px) !important; letter-spacing: -0.02em; text-align: left !important;
	margin: 0 0 clamp(20px, 3vw, 30px) !important; color: var(--ink) !important; max-width: none !important;
}
/* cart/checkout/account render on the single-post template, whose .single-header
   (48px) and .single-title (30px top + 64px bottom padding) leave a big empty band
   under the page title. Collapse it to a tidy heading block. */
body.woocommerce-cart .single-header, body.woocommerce-checkout .single-header, body.woocommerce-account .single-header { padding: clamp(18px, 4vw, 34px) 0 0 !important; }
body.woocommerce-cart .single-title, body.woocommerce-checkout .single-title, body.woocommerce-account .single-title { padding: 0 !important; margin: 0 !important; max-width: none !important; }
body.woocommerce-cart .single-content.entry-content, body.woocommerce-checkout .single-content.entry-content, body.woocommerce-account .single-content.entry-content { margin-top: clamp(16px, 3vw, 26px) !important; }

/* layout: items left, totals right (stacks on small screens) */
body.woocommerce-cart .woocommerce { display: grid; grid-template-columns: 1fr; gap: clamp(34px, 5vw, 56px); align-items: start; }
body.woocommerce-cart .woocommerce-notices-wrapper { grid-column: 1 / -1; }
body.woocommerce-cart .woocommerce-notices-wrapper:empty { display: none !important; margin: 0 !important; }
@media (min-width: 900px) {
	body.woocommerce-cart .woocommerce { grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1fr); }
	body.woocommerce-cart .cart-collaterals { position: sticky; top: calc(var(--header-h) + 20px); }
}
body.woocommerce-cart .woocommerce-cart-form { margin: 0 !important; }
body.woocommerce-cart .cart-collaterals { display: block !important; width: auto !important; float: none !important; margin: 0 !important; }
body.woocommerce-cart .cart-collaterals .cross-sells { display: none !important; }

/* items table -> clean hairline rows */
.woocommerce-cart table.cart { border: 0 !important; background: transparent !important; border-collapse: collapse; width: 100%; margin: 0 !important; }
.woocommerce-cart table.cart thead th {
	border: 0 !important; border-bottom: 1px solid var(--ink) !important; background: transparent !important;
	font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.12em; font-size: 11px; font-weight: 500; color: var(--muted) !important;
	padding: 0 0 14px !important; text-align: left;
}
.woocommerce-cart table.cart th.product-price, .woocommerce-cart table.cart th.product-subtotal { text-align: right; }
/* sold individually -> no quantity column */
.woocommerce-cart table.cart th.product-quantity, .woocommerce-cart table.cart td.product-quantity { display: none !important; }
.woocommerce-cart table.cart td {
	border: 0 !important; border-bottom: 1px solid var(--line) !important; background: transparent !important;
	padding: 20px 0 !important; vertical-align: middle;
}
.woocommerce-cart td.product-remove { width: 30px; padding-right: 6px !important; }
.woocommerce-cart td.product-remove a.remove {
	color: var(--muted) !important; font-size: 19px; width: 24px; height: 24px; line-height: 22px; text-align: center; border-radius: 50%;
}
.woocommerce-cart td.product-remove a.remove:hover { color: #000 !important; background: var(--paper-3) !important; }
.woocommerce-cart td.product-thumbnail { width: 96px; padding-right: 18px !important; }
.woocommerce-cart td.product-thumbnail img {
	width: 84px !important; height: 66px !important; object-fit: cover !important; display: block;
	border-radius: var(--radius-sm); border: 1px solid var(--line); background: var(--tile-bg);
}
.woocommerce-cart td.product-name a { font-family: var(--font-display) !important; font-weight: 500 !important; font-size: 16px !important; color: var(--ink) !important; text-decoration: none !important; line-height: 1.3; }
.woocommerce-cart td.product-name a:hover { color: #000 !important; }
.woocommerce-cart td.product-price, .woocommerce-cart td.product-subtotal { text-align: right; font-family: var(--font-display) !important; color: var(--ink) !important; white-space: nowrap; }
.woocommerce-cart td.product-subtotal { font-weight: 500; }

/* actions row: coupon kept, redundant "update cart" hidden (qty can't change) */
.woocommerce-cart tr td.actions { padding: 22px 0 0 !important; border: 0 !important; }
.woocommerce-cart td.actions button[name="update_cart"] { display: none !important; }
/* the parent absolutely-positions the cart coupon (position:absolute), which yanks
   it out of flow and over the line items. Force it back into normal flow. The long
   selector is needed to out-specify that rule. */
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form table.cart .actions .coupon {
	position: static !important; float: none !important; top: auto !important; left: auto !important; right: auto !important;
	display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap;
	box-shadow: none !important; border: 0 !important; /* parent paints an inset bottom hairline across the row */
}
.woocommerce-cart .actions .coupon .button { float: none !important; }
.woocommerce-cart tr td.actions { overflow: hidden; }
.woocommerce-cart .actions .coupon input#coupon_code {
	width: auto; max-width: 220px; flex: 1 1 200px;
	height: 46px !important; min-height: 46px; line-height: normal !important; box-sizing: border-box;
	padding: 0 14px !important; margin: 0 !important;
	border: 1px solid var(--line-2) !important; border-radius: 0 !important; background: var(--paper) !important;
	font-family: var(--font-body); font-size: 15px; color: var(--ink) !important;
}
.woocommerce-cart .actions .coupon button {
	height: 46px !important; min-height: 46px; line-height: normal !important; box-sizing: border-box; flex: 0 0 auto;
	background: transparent !important; color: var(--ink) !important; border: 1px solid var(--line-2) !important; border-radius: 0 !important;
	font-family: var(--font-display); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; padding: 0 18px !important; margin: 0 !important;
}
.woocommerce-cart .actions .coupon button:hover { background: var(--btn-bg) !important; color: var(--btn-fg) !important; border-color: var(--btn-bg) !important; }

/* totals card (high specificity to beat the parent's width:48%!important / float) */
body.woocommerce-cart .cart-collaterals .cart_totals { width: 100% !important; max-width: 100% !important; float: none !important; }
.cart_totals { background: var(--paper-2) !important; border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(22px, 3vw, 30px) !important; }
.cart_totals h2 { font-family: var(--font-display) !important; font-size: 12px !important; text-transform: uppercase; letter-spacing: 0.16em; color: var(--muted) !important; margin: 0 0 18px !important; font-weight: 500 !important; }
.cart_totals table.shop_table { border: 0 !important; background: transparent !important; width: 100%; margin: 0 !important; }
.cart_totals table th, .cart_totals table td { border: 0 !important; border-bottom: 1px solid var(--line) !important; padding: 13px 0 !important; background: transparent !important; color: var(--ink) !important; font-family: var(--font-display) !important; font-size: 14px; }
.cart_totals table th { font-weight: 500; text-align: left; color: var(--ink-soft) !important; }
.cart_totals table td { text-align: right; }
.cart_totals .order-total th, .cart_totals .order-total td { font-size: 18px !important; border-bottom: 0 !important; padding-top: 16px !important; color: var(--ink) !important; }
.cart_totals .order-total td .amount, .cart_totals .order-total .woocommerce-Price-amount { font-weight: 600 !important; }

/* proceed to checkout */
.wc-proceed-to-checkout { padding: 18px 0 0 !important; }
.wc-proceed-to-checkout a.checkout-button {
	display: block !important; width: 100%; text-align: center; white-space: nowrap; text-decoration: none !important;
	background: var(--btn-bg) !important; color: var(--btn-fg) !important; border: 1px solid var(--btn-bg) !important; border-radius: 0 !important;
	font-family: var(--font-display) !important; font-size: 12px !important; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 500;
	padding: 16px 20px !important; margin: 0 !important;
}
.wc-proceed-to-checkout a.checkout-button:hover { background: var(--btn-bg-h) !important; border-color: var(--btn-bg-h) !important; }
/* secondary "Continue shopping" -> quiet ghost, not a second heavy black slab */
body.woocommerce-cart .cart-collaterals a.button:not(.checkout-button),
body.woocommerce-cart .cart_totals a.button:not(.checkout-button) {
	display: block !important; width: 100%; text-align: center; white-space: nowrap; margin: 10px 0 0 !important; text-decoration: none !important;
	background: transparent !important; color: var(--ink) !important; border: 1px solid var(--line-2) !important; border-radius: 0 !important;
	font-family: var(--font-display) !important; font-size: 11px !important; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 500;
	padding: 13px 20px !important;
}
body.woocommerce-cart .cart-collaterals a.button:not(.checkout-button):hover,
body.woocommerce-cart .cart_totals a.button:not(.checkout-button):hover { background: var(--paper-3) !important; color: #000 !important; border-color: var(--line-2) !important; }

/* empty cart state */
.cart-empty.woocommerce-info { background: transparent !important; border: 0 !important; padding: 0 !important; font-family: var(--font-body); font-size: 19px; color: var(--ink-soft) !important; }
.woocommerce-cart .return-to-shop { margin-top: 24px; }
.woocommerce-cart .return-to-shop a.button {
	display: inline-flex; background: var(--btn-bg) !important; color: var(--btn-fg) !important; border-radius: 0 !important;
	font-family: var(--font-display); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; padding: 14px 26px !important;
}

/* mobile: stack each line item into a tidy card. High-specificity selectors are
   required to beat the parent's `...cart_item td { display:table; text-align:right }`
   rule (specificity 0,5,4) — hence the long `.woocommerce-cart-form table.cart tbody`
   prefix on every line. */
@media (max-width: 768px) {
	body.woocommerce-cart .woocommerce-cart-form,
	body.woocommerce-cart .woocommerce-cart-form table.cart,
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody { display: block !important; width: 100% !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart thead { display: none !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item {
		display: grid !important;
		grid-template-columns: 72px minmax(0, 1fr) auto;
		grid-template-areas: "thumb name remove" "thumb price remove";
		column-gap: 14px; row-gap: 2px; align-items: center;
		padding: 16px 0 !important; margin: 0 !important; border: 0 !important; border-bottom: 1px solid var(--line) !important;
	}
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td {
		display: block !important; width: auto !important; border: 0 !important; padding: 0 !important; text-align: left !important; background: transparent !important;
		line-height: 1.35 !important; font-size: 14px !important;
	}
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td::before { display: none !important; content: none !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td.product-thumbnail { grid-area: thumb; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td.product-thumbnail img { width: 72px !important; height: 58px !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td.product-name { grid-area: name; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td.product-name a { font-size: 15px !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td.product-price,
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td.product-quantity { display: none !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td.product-subtotal { grid-area: price; color: var(--ink-soft) !important; font-family: var(--font-display) !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr.cart_item td.product-remove { grid-area: remove; justify-self: end; align-self: center; }
	/* the coupon/actions row */
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr:not(.cart_item) { display: block !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody td.actions { display: block !important; height: auto !important; min-height: 0 !important; padding: 16px 0 0 !important; border: 0 !important; text-align: left !important; line-height: 1.35 !important; }
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody tr:not(.cart_item) td::before,
	body.woocommerce-cart .woocommerce-cart-form table.cart tbody td.actions::before { display: none !important; content: none !important; }
	body.woocommerce-cart .actions .coupon { display: flex !important; width: 100%; gap: 8px; margin: 0 !important; }
	body.woocommerce-cart .actions .coupon input#coupon_code { flex: 1 1 auto !important; max-width: none !important; }
	/* tighten vertical rhythm so the page isn't mostly whitespace on a phone */
	body.woocommerce-cart .entry-title { margin-bottom: 16px !important; }
	body.woocommerce-cart .woocommerce { gap: 22px !important; }
}

/* ----------------------------------------------------------------------------
   11d. My Account + Checkout — same editorial system
   ------------------------------------------------------------------------- */
/* --- My Account: horizontal tab nav, no diagonal slashes --- */
.woocommerce-MyAccount-navigation ul {
	display: flex; flex-wrap: wrap; gap: clamp(14px, 2.4vw, 30px); list-style: none;
	margin: 0 0 clamp(30px, 4vw, 44px) !important; padding: 0 0 16px !important; border-bottom: 1px solid var(--ink);
	justify-content: flex-start;
}
.woocommerce-MyAccount-navigation li { margin: 0 !important; padding: 0 !important; }
.woocommerce-MyAccount-navigation li::after, .woocommerce-MyAccount-navigation li::before { display: none !important; content: none !important; }
.woocommerce-MyAccount-navigation li a {
	display: inline-block; font-family: var(--font-display) !important; font-size: 12px !important; font-weight: 500 !important;
	letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted) !important; padding: 0 0 4px !important;
	border-bottom: 1px solid transparent; text-decoration: none !important;
}
.woocommerce-MyAccount-navigation li.is-active a, .woocommerce-MyAccount-navigation li a:hover { color: var(--ink) !important; }
.woocommerce-MyAccount-navigation li.is-active a { border-bottom-color: var(--ink); }

.woocommerce-MyAccount-content { font-family: var(--font-body); font-size: 17px; line-height: 1.7; color: var(--ink) !important; max-width: 780px; text-align: left !important; }
.woocommerce-MyAccount-content p { color: var(--ink) !important; }
.woocommerce-MyAccount-content a:not(.button) { color: var(--ink) !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-2); }
.woocommerce-MyAccount-content a:not(.button):hover { text-decoration-color: var(--ink); }
.woocommerce-MyAccount-content h2, .woocommerce-MyAccount-content h3, .woocommerce-EditAccountForm legend, .woocommerce-Address-title { font-family: var(--font-display) !important; color: var(--ink) !important; }

/* --- Shared: solid-ink primary buttons on account/checkout/order pages --- */
.woocommerce-account .woocommerce .button:not(.checkout-button),
.woocommerce-checkout #payment #place_order,
.woocommerce-account button.button, .woocommerce-checkout button.button {
	background: var(--btn-bg) !important; color: var(--btn-fg) !important; border: 1px solid var(--btn-bg) !important; border-radius: 0 !important;
	font-family: var(--font-display) !important; font-size: 12px !important; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500;
	padding: 14px 26px !important;
}
.woocommerce-account .woocommerce .button:not(.checkout-button):hover,
.woocommerce-checkout #payment #place_order:hover, .woocommerce-checkout button.button:hover { background: var(--btn-bg-h) !important; border-color: var(--btn-bg-h) !important; }

/* account tables (orders / downloads) -> clean hairline rows */
.woocommerce-account .woocommerce-orders-table, .woocommerce-account .shop_table {
	border: 0 !important; background: transparent !important; border-collapse: collapse; width: 100%;
}
.woocommerce-account .shop_table thead th { border: 0 !important; border-bottom: 1px solid var(--ink) !important; background: transparent !important; font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.1em; font-size: 11px; color: var(--muted) !important; padding: 0 12px 12px 0 !important; }
.woocommerce-account .shop_table td { border: 0 !important; border-bottom: 1px solid var(--line) !important; background: transparent !important; padding: 16px 12px 16px 0 !important; color: var(--ink) !important; }

/* --- Checkout --- */
.woocommerce-checkout h3, .woocommerce-checkout h3 label, .woocommerce-checkout #order_review_heading {
	font-family: var(--font-display) !important; font-weight: 500 !important; letter-spacing: -0.01em; color: var(--ink) !important; text-align: left !important;
}
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: 1fr; gap: clamp(34px, 5vw, 56px); align-items: start; }
@media (min-width: 900px) {
	.woocommerce-checkout form.checkout { grid-template-columns: minmax(0, 1.3fr) minmax(320px, 1fr); }
	.woocommerce-checkout #order_review, .woocommerce-checkout .woocommerce-checkout-review-order { position: sticky; top: calc(var(--header-h) + 20px); }
}
.woocommerce-checkout #customer_details { margin: 0 !important; }
.woocommerce-checkout .woocommerce-billing-fields h3, .woocommerce-checkout #order_review_heading { margin-top: 0 !important; }
.woocommerce-checkout form .form-row label { font-family: var(--font-display); font-size: 12px; letter-spacing: 0.04em; color: var(--ink-soft) !important; }
.woocommerce-checkout #order_review, .woocommerce-checkout .woocommerce-checkout-review-order {
	float: none !important; width: 100% !important; max-width: none !important; box-sizing: border-box;
	background: var(--paper) !important; border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(22px, 3vw, 30px) !important;
}
/* the review table carries the shared .shop_table class, which §11 frames as its
   own bordered white box — strip that so it's flush inside the white panel rather
   than a box-in-a-box. (Higher specificity than the .shop_table rule above.) */
body.woocommerce-checkout table.woocommerce-checkout-review-order-table {
	border: 0 !important; border-radius: 0 !important; background: transparent !important;
	width: 100%; border-collapse: collapse; margin: 0 0 22px !important;
}
.woocommerce-checkout-review-order-table th, .woocommerce-checkout-review-order-table td {
	border: 0 !important; border-bottom: 1px solid var(--line) !important; background: transparent !important;
	padding: 12px 0 !important; color: var(--ink) !important; font-family: var(--font-display); font-size: 14px; text-align: right;
}
.woocommerce-checkout-review-order-table th { text-align: left; font-weight: 500; color: var(--ink-soft) !important; }
.woocommerce-checkout-review-order-table .cart_item td.product-name { text-align: left; font-family: var(--font-body); }
.woocommerce-checkout-review-order-table tfoot .order-total th, .woocommerce-checkout-review-order-table tfoot .order-total td { font-size: 18px !important; border-bottom: 0 !important; }
.woocommerce-checkout-review-order-table tfoot .order-total td .amount { font-weight: 600 !important; }
.woocommerce-checkout #payment { background: transparent !important; border-radius: 0 !important; margin-top: 18px; }
.woocommerce-checkout #payment ul.payment_methods { border: 0 !important; padding: 0 0 12px !important; }
.woocommerce-checkout #payment div.payment_box { background: transparent !important; color: var(--ink) !important; border-radius: 0 !important; padding: 4px 0 12px !important; margin: 0 !important; }
.woocommerce-checkout #payment div.payment_box::before { display: none !important; }
.woocommerce-checkout #payment #place_order { display: block; width: 100%; text-align: center; white-space: nowrap; }
.checkout_coupon.woocommerce-form-coupon { border: 1px solid var(--line) !important; border-radius: var(--radius) !important; background: var(--paper) !important; }
.woocommerce-checkout .woocommerce-info, .woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info { background: var(--paper-2) !important; border-top-color: var(--ink) !important; }

/* The checkout form has three grid children (billing | heading | order review).
   Auto-placement dropped the "Your order" heading and the totals panel into the
   wrong cells, so the heading sat half-behind the panel. Pin them explicitly:
   billing spans both rows on the left, heading + review stack on the right. */
@media (min-width: 900px) {
	/* Billing spans both rows on the left; heading + totals panel stack on the
	   right. (A small amount of vertical air sits under "Your order" because the
	   tall billing column drives the shared row heights — acceptable, and keeps
	   the heading aligned with "Billing details".) */
	.woocommerce-checkout form.checkout > #customer_details { grid-column: 1; grid-row: 1 / 3; }
	.woocommerce-checkout form.checkout > #order_review_heading { grid-column: 2; grid-row: 1; align-self: start; margin: 0 !important; }
	.woocommerce-checkout form.checkout > #order_review { grid-column: 2; grid-row: 2; align-self: start; }
}
@media (max-width: 899px) {
	/* Stacked layout: keep clear air above "Your order" (separating it from the
	   billing form) but sit the heading close to its panel, not floating well
	   above it. The default h3 bottom margin + grid gap stacked to ~70px. */
	.woocommerce-checkout form.checkout { row-gap: 16px; }
	.woocommerce-checkout #order_review_heading { margin: 16px 0 0 !important; }
}

/* --- Form fields: real block labels above clean inputs ---
   The parent floats every field label position:absolute over its input and sets
   the placeholder to the same text, so the two overlap. It mostly looked like a
   single placeholder, but the custom "Cortex Cloud Username" field exposed the
   doubling. Convert labels to plain blocks above the input and drop the now
   redundant placeholders, on checkout + login/register/reset/edit-account. */
.woocommerce-checkout form .form-row,
.woocommerce form.woocommerce-form-login p.form-row,
.woocommerce form.woocommerce-form-register p.form-row,
.woocommerce-ResetPassword p.form-row,
.woocommerce-account form.woocommerce-EditAccountForm p.form-row { position: relative; }

.woocommerce-checkout form .form-row > label,
.woocommerce form.woocommerce-form-login p.form-row > label,
.woocommerce form.woocommerce-form-register p.form-row > label,
.woocommerce-ResetPassword p.form-row > label,
.woocommerce-account form.woocommerce-EditAccountForm p.form-row > label {
	position: static !important; top: auto !important; left: auto !important; float: none !important;
	display: block; width: auto; margin: 0 0 7px !important;
	font-family: var(--font-display) !important; font-size: 11px !important; font-weight: 500;
	letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted) !important; line-height: 1.4;
}
/* checkbox rows (remember me / marketing opt-in / terms) keep an inline body label */
.woocommerce .form-row label.checkbox,
.woocommerce .form-row label.woocommerce-form__label-for-checkbox {
	display: inline-flex !important; align-items: center; gap: 9px;
	font-family: var(--font-body) !important; font-size: 14px !important; font-weight: 400;
	letter-spacing: 0 !important; text-transform: none !important; color: var(--ink) !important; margin: 0 !important;
}
.woocommerce-checkout form .form-row input.input-text,
.woocommerce-checkout form .form-row textarea,
.woocommerce form.woocommerce-form-login .form-row input.input-text,
.woocommerce form.woocommerce-form-register .form-row input.input-text,
.woocommerce-ResetPassword .form-row input.input-text,
.woocommerce-account form.woocommerce-EditAccountForm .form-row input.input-text {
	width: 100%; box-sizing: border-box; min-height: 48px;
	padding: 12px 14px !important; line-height: normal !important;
	font-family: var(--font-body); font-size: 15px;
}
.woocommerce-checkout form .form-row textarea { min-height: 96px; }
/* placeholders duplicated the label text -> hide them on text inputs (textarea/
   order-notes keeps its placeholder as the only hint there) */
.woocommerce-checkout form .form-row input.input-text::placeholder,
.woocommerce form.woocommerce-form-login .form-row input.input-text::placeholder,
.woocommerce form.woocommerce-form-register .form-row input.input-text::placeholder,
.woocommerce-ResetPassword .form-row input.input-text::placeholder,
.woocommerce-account form.woocommerce-EditAccountForm .form-row input.input-text::placeholder { color: transparent !important; }

/* --- Show/hide password toggle ---
   WooCommerce injects a <button.show-password-input> after password inputs; the
   parent never positioned it, so it rendered as a tiny default-grey browser
   button floating in the form. Sit it inside the field as a quiet text toggle. */
.woocommerce .password-input { position: relative; display: block; }
.woocommerce .password-input > input { padding-right: 62px !important; }
.woocommerce .show-password-input {
	position: absolute; right: 0; top: 0; height: 100%;
	display: inline-flex; align-items: center; padding: 0 14px;
	margin: 0; border: 0 !important; background: transparent !important; box-shadow: none !important;
	font-family: var(--font-display); font-size: 10px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase;
	color: var(--muted); cursor: pointer;
}
.woocommerce .show-password-input::after { content: "Show"; }
.woocommerce .show-password-input.display-password::after { content: "Hide"; }
.woocommerce .show-password-input:hover { color: var(--ink); }

/* --- Login / lost-password: tidy spacing + full-width submit --- */
.woocommerce form.woocommerce-form-login,
.woocommerce-ResetPassword.lost_reset_password { margin: 0 !important; padding: 0 !important; border: 0 !important; }
.woocommerce-form-login__rememberme { margin: 0 !important; }
.woocommerce-form-login .woocommerce-form-login__submit,
.woocommerce-ResetPassword button.button { width: 100%; display: block; text-align: center; margin-top: 6px !important; }
.woocommerce form.woocommerce-form-login .lost_password,
.woocommerce-LostPassword.lost_password { margin: 0 !important; }
.woocommerce form.woocommerce-form-login .lost_password a { color: var(--ink) !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-2); font-family: var(--font-body); }

/* ----------------------------------------------------------------------------
   12. Footer — quiet, multi-column, faint warm band
   ------------------------------------------------------------------------- */
.cx-footer {
	position: static !important; right: auto !important; left: auto !important; bottom: auto !important;
	background: var(--paper-2) !important; border-top: 1px solid var(--line); padding: clamp(52px, 7vw, 80px) 0 36px !important; margin-top: 0;
}
.cx-footer__inner { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); }
.cx-footer__top { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: clamp(28px, 5vw, 64px); }
.cx-footer__brandcol { max-width: 38ch; }
.cx-footer__brand { display: inline-flex; margin: 0 0 16px; }
.cx-footer__brand .cx-wordmark__name { font-size: 15px; }
.cx-footer__blurb { font-family: var(--font-body); color: var(--ink-soft) !important; font-size: 16px; line-height: 1.6; margin: 0 0 18px; }
.cx-footer__contact { font-family: var(--font-display); font-size: 13px; letter-spacing: 0.04em; color: var(--muted) !important; margin: 0; }
.cx-footer__contact a { color: var(--ink) !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-2); }
.cx-footer__contact a:hover { text-decoration-color: var(--ink); }
.cx-footer__colhead { font-family: var(--font-display); font-size: 11px; font-weight: 500; color: var(--muted) !important; margin: 0 0 18px; letter-spacing: 0.18em; text-transform: uppercase; }
.cx-footer__col ul, .cx-footer__menu { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.cx-footer__col a, .cx-footer__menu a { color: var(--ink-soft) !important; font-family: var(--font-display); font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; }
.cx-footer__col a:hover, .cx-footer__menu a:hover { color: #000 !important; }
.cx-footer__bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: clamp(44px, 6vw, 64px); padding-top: 24px; border-top: 1px solid var(--line); }
.cx-footer__legal { font-family: var(--font-display); color: var(--muted) !important; font-size: 12px; letter-spacing: 0.06em; margin: 0; }
@media (max-width: 760px) {
	.cx-footer__top { grid-template-columns: 1fr 1fr; }
	.cx-footer__brandcol { grid-column: 1 / -1; max-width: none; }
}
@media (max-width: 460px) {
	.cx-footer__top { grid-template-columns: 1fr; gap: 28px; }
}

/* ----------------------------------------------------------------------------
   13. Misc
   ------------------------------------------------------------------------- */
.scroll-top { color: var(--ink) !important; background: var(--paper) !important; border: 1px solid var(--line) !important; }
.scroll-top:hover { color: #000 !important; border-color: var(--line-2) !important; }
.error404 .container-fluid { min-height: 50vh; }
.error404 h1, .error404 .page-title { color: var(--ink) !important; }
.page .entry-content, .single-content.entry-content { color: var(--ink) !important; }
.page-template-default .entry-content { font-family: var(--font-body); font-size: 18px; line-height: 1.7; max-width: 740px; margin-left: auto; margin-right: auto; color: var(--ink) !important; }
.page-template-default .entry-content h1, .page-template-default .entry-content h2, .page-template-default .entry-content h3 { font-family: var(--font-display) !important; }