/* Nine Loofts — theme CSS. Tokens live in theme.json; this file only adds
   what blocks cannot express. Keep selectors one class deep where possible. */

:root {
	--nl-ink: var(--wp--preset--color--ink);
	--nl-muted: var(--wp--preset--color--muted);
	--nl-ginger: var(--wp--preset--color--ginger);
	--nl-sage: var(--wp--preset--color--sage);
	--nl-sage-dark: var(--wp--preset--color--sage-dark);
	--nl-oat: var(--wp--preset--color--oat);
	--nl-line: var(--wp--preset--color--line);
	--nl-radius: 14px;
	--nl-ease: cubic-bezier(.2, .7, .2, 1);
	--nl-header-h: 72px;
}

html { scroll-padding-top: calc(var(--nl-header-h) + 16px); }
body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; overflow-x: clip; }

/* Custom full-width sections carry the root gutter themselves. */
.nl-hero, .nl-section, .nl-trust { padding-inline: var(--wp--style--root--padding-left); }
img { height: auto; }

/* ---------- Focus & accessibility ---------- */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--nl-ink);
	outline-offset: 3px;
	border-radius: 4px;
}
.skip-link.screen-reader-text:focus { background: var(--nl-ink); color: #fff; padding: .75rem 1rem; border-radius: 8px; z-index: 100000; }

/* ---------- Buttons ---------- */
.wp-element-button, .wp-block-button__link { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; transition: background-color .15s var(--nl-ease), color .15s var(--nl-ease), border-color .15s var(--nl-ease); }
.wp-block-button.is-style-secondary .wp-block-button__link {
	background: transparent; color: var(--nl-sage-dark); box-shadow: inset 0 0 0 1.5px var(--nl-sage);
}
.wp-block-button.is-style-secondary .wp-block-button__link:hover { background: var(--nl-sage-dark); color: #fff; box-shadow: none; }
.wp-block-button.is-style-text .wp-block-button__link {
	background: transparent; color: var(--nl-ink); padding-left: 0; padding-right: 0;
	text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: .3em; text-decoration-color: var(--nl-sage);
}
.wp-block-button.is-style-text .wp-block-button__link:hover { text-decoration-color: var(--nl-ink); }

/* ---------- Announcement bar ---------- */
.nl-announce { background: var(--nl-sage-dark); color: #fff; font-size: var(--wp--preset--font-size--xs); }
.nl-announce__list { list-style: none; margin: 0 auto; padding: 0; display: flex; justify-content: center; gap: clamp(1rem, 4vw, 3rem); max-width: 1240px; }
.nl-announce__item a { color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: .45rem; min-height: 36px; font-weight: 500; letter-spacing: .01em; }
.nl-announce__item a:hover span { text-decoration: underline; text-underline-offset: .25em; }
.nl-announce .nl-icon { opacity: .9; flex: none; }
@media (max-width: 781px) {
	.nl-announce__item--2 { display: none; }
	.nl-announce__list { gap: 1.25rem; }
}
@media (max-width: 380px) {
	.nl-announce__item--1 { display: none; }
}

/* ---------- Header ---------- */
.nl-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--nl-line); }
.admin-bar .nl-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .nl-header { top: 46px; } }
.nl-header__row { min-height: var(--nl-header-h); }
.nl-logo { display: inline-flex; align-items: center; gap: .55rem; color: var(--nl-ink); text-decoration: none; min-height: 44px; }
.nl-logo .nl-mark { color: var(--nl-ginger); flex: none; }
.nl-logo__word { font-family: var(--wp--preset--font-family--display); font-weight: 600; font-size: 1.5rem; letter-spacing: -.02em; line-height: 1; white-space: nowrap; }
@media (max-width: 380px) { .nl-logo__word { font-size: 1.3rem; } .nl-logo .nl-mark { width: 30px; height: 30px; } }

/* Navigation collapses to the drawer below 1024px (core switches at 600px). */
@media (min-width: 600px) and (max-width: 1023px) {
	.nl-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.nl-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
.nl-header__row > .wp-block-group:first-child { flex-shrink: 1; min-width: 0; }
@media (max-width: 1023px) {
	/* Logo left, tools right, menu button first in the tools row order. */
	.nl-header__row > .wp-block-group:first-child { gap: .25rem; }
	.nl-header .wp-block-navigation { order: -1; }
}
.nl-logo:hover .nl-logo__word { color: var(--nl-sage-dark); }

.nl-header .wp-block-navigation a { text-decoration: none; }
.nl-header .wp-block-navigation .wp-block-navigation-item__content { padding: .5rem .25rem; min-height: 44px; display: inline-flex; align-items: center; }
.nl-header .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--nl-sage-dark); text-decoration: underline; text-underline-offset: .35em; text-decoration-thickness: 1.5px; }

/* Shop submenu as a two-column panel on desktop */
@media (min-width: 1024px) {
	.nl-header .wp-block-navigation .wp-block-navigation__submenu-container {
		border: 1px solid var(--nl-line) !important; border-radius: var(--nl-radius); padding: .75rem !important;
		box-shadow: var(--wp--preset--shadow--lift); min-width: 460px !important;
		display: grid !important; grid-template-columns: 1fr 1fr; gap: .25rem;
		top: calc(100% + 4px) !important;
	}
	.nl-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: .7rem .9rem; border-radius: 10px; width: 100%; }
	.nl-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--nl-oat); text-decoration: none; color: var(--nl-ink); }
}
/* Mobile drawer */
.nl-header .wp-block-navigation__responsive-container.is-menu-open { padding: 1.25rem 16px 2rem; }
.nl-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.25rem; padding: .6rem 0; }
.nl-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-size: 1.0625rem; color: var(--nl-muted); }
.nl-header .wp-block-navigation__responsive-container-open,
.nl-header .wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; align-items: center; justify-content: center; }
.nl-header .wp-block-navigation__container { flex-wrap: nowrap; }

/* Header utilities: search, account, mini-cart */
.nl-header__tools { gap: .25rem !important; }
.nl-header__tools .wp-block-search__button,

.nl-header__tools .wc-block-mini-cart__button { min-width: 44px; min-height: 44px; }
.nl-header__tools .wp-block-search__button { background: transparent; color: var(--nl-ink); border: 0; padding: 0; }
.nl-header__tools .wp-block-search__button:hover { background: var(--nl-oat); border-radius: 999px; }
.nl-header__tools .wp-block-search__input { border-radius: 999px; border: 1px solid var(--nl-line); padding: .55rem 1rem; min-height: 44px; }
.nl-header__tools .wc-block-mini-cart__badge { background: var(--nl-ginger); color: #fff; font-weight: 600; }
.nl-header__tools .wc-block-customer-account__link { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; color: var(--nl-ink); }

/* ---------- Checkout header ---------- */
.nl-checkout-header { border-bottom: 1px solid var(--nl-line); }
.nl-secure { display: inline-flex; align-items: center; gap: .4rem; color: var(--nl-muted); font-size: var(--wp--preset--font-size--sm); }

/* ---------- Image slots (placeholders until Codex images arrive) ---------- */
.nl-slot {
	position: relative; width: 100%; background: var(--nl-oat); border-radius: var(--nl-radius); overflow: hidden;
	display: grid; place-items: center;
	background-image: repeating-linear-gradient(135deg, transparent 0 22px, rgba(31, 42, 46, .035) 22px 23px);
}
.nl-slot__id { font-size: var(--wp--preset--font-size--xs); color: var(--nl-muted); background: #fff; padding: .3rem .6rem; border-radius: 999px; border: 1px solid var(--nl-line); font-variant-numeric: tabular-nums; }

/* ---------- The ruler (signature element) ---------- */
.nl-ruler { display: block; overflow: visible; flex: none; }
.nl-ruler line { stroke: var(--nl-line); stroke-width: 1.5; }
.nl-ruler text { fill: var(--nl-muted); font: 500 11px/1 var(--wp--preset--font-family--body); font-variant-numeric: tabular-nums; }
.nl-hero__rail .nl-ruler line { stroke: #CFC7BC; }
@media (prefers-reduced-motion: no-preference) {
	.nl-hero__rail .nl-ruler line { transform-origin: left center; animation: nl-tick .5s var(--nl-ease) both; animation-delay: calc(var(--i) * 7ms); }
	.nl-hero__rail .nl-ruler text { animation: nl-fade .4s ease both; animation-delay: .45s; }
}
@keyframes nl-tick { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes nl-fade { from { opacity: 0; } to { opacity: 1; } }

/* Ruler separator (block style) */
.wp-block-separator.is-style-ruler {
	border: 0 !important; height: 14px; max-width: none; opacity: 1; background: none;
	background-image:
		linear-gradient(var(--nl-line), var(--nl-line)),
		repeating-linear-gradient(90deg, var(--nl-line) 0 1.5px, transparent 1.5px 12px),
		repeating-linear-gradient(90deg, var(--nl-line) 0 1.5px, transparent 1.5px 72px);
	background-size: 100% 1.5px, 100% 6px, 100% 12px;
	background-position: 0 100%, 0 100%, 0 100%;
	background-repeat: no-repeat;
}

/* ---------- Hero ---------- */
.nl-hero { padding-block: clamp(2rem, 1rem + 4vw, 4.5rem) clamp(2.5rem, 1.5rem + 4vw, 5rem); }
.nl-hero__grid { display: grid; grid-template-columns: 1fr; gap: clamp(1.75rem, 3vw, 3rem); align-items: center; max-width: 1240px; margin-inline: auto; }
.nl-hero__copy h1 { margin: 0; max-width: 13ch; font-size: clamp(2.5rem, 1.4rem + 4.2vw, 4rem); }
.nl-hero__lead { font-size: var(--wp--preset--font-size--lg); color: var(--nl-muted); max-width: 38ch; margin: 1.25rem 0 1.75rem; line-height: 1.5; }
.nl-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem; }
.nl-hero__visual { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: stretch; }
.nl-hero__rail { position: relative; padding-block: 2px; }
.nl-hero__rail .nl-ruler { height: 100%; }
.nl-hero__visual .nl-slot { aspect-ratio: 4 / 5; }
@media (min-width: 900px) {
	.nl-hero__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
	.nl-hero__visual .nl-slot { aspect-ratio: 4 / 5; max-height: 640px; }
}
@media (max-width: 599px) {
	.nl-hero__visual { grid-template-columns: 32px 1fr; gap: 8px; }
	.nl-hero__visual .nl-ruler text { display: none; }
}

/* ---------- Trust band ---------- */
.nl-trust { border-block: 1px solid var(--nl-line); }
.nl-trust__list { list-style: none; margin: 0 auto; padding: 0; max-width: 1240px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nl-trust__item { display: flex; gap: .75rem; align-items: flex-start; padding: 1.25rem .75rem 1.25rem 0; }
.nl-trust__item .nl-icon { color: var(--nl-sage); flex: none; margin-top: .15rem; }
.nl-trust__item strong { display: block; font-weight: 600; }
.nl-trust__item span { color: var(--nl-muted); font-size: var(--wp--preset--font-size--sm); line-height: 1.45; }
@media (min-width: 900px) {
	.nl-trust__list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.nl-trust__item + .nl-trust__item { border-left: 1px solid var(--nl-line); padding-left: 1.25rem; }
}

/* ---------- Section heading row ---------- */
.nl-section { padding-block: clamp(3rem, 2rem + 4vw, 6rem); }
.nl-section--oat { background: var(--nl-oat); }
.nl-section__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: .75rem 2rem; margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.nl-section__head h2 { margin: 0; max-width: 20ch; }
.nl-section__head p { margin: 0; color: var(--nl-muted); max-width: 46ch; }
.nl-inner { max-width: 1240px; margin-inline: auto; }

/* ---------- Shop by space ---------- */
.nl-spaces { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nl-space { position: relative; display: block; color: var(--nl-ink); text-decoration: none; }
.nl-space .nl-slot { aspect-ratio: 3 / 4; }
.nl-space__label { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; margin-top: .75rem; }
.nl-space__label strong { font-family: var(--wp--preset--font-family--display); font-weight: 560; font-size: 1.375rem; letter-spacing: -.01em; }
.nl-space__label span { color: var(--nl-muted); font-size: var(--wp--preset--font-size--sm); }
.nl-space:hover strong { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: .2em; text-decoration-color: var(--nl-sage); }
@media (min-width: 900px) {
	.nl-spaces { grid-template-columns: 1.25fr 1fr 1fr 1.25fr; align-items: end; }
	.nl-space:nth-child(1) .nl-slot { aspect-ratio: 3 / 4.4; }
	.nl-space:nth-child(2) .nl-slot { aspect-ratio: 1 / 1; }
	.nl-space:nth-child(3) .nl-slot { aspect-ratio: 3 / 4; }
	.nl-space:nth-child(4) .nl-slot { aspect-ratio: 4 / 3.4; }
}

/* ---------- Product cards (Product Collection) ---------- */
.wc-block-product-template { gap: clamp(1rem, 2vw, 1.75rem) !important; }
.wc-block-product-template .wc-block-product { text-align: left; position: relative; }
.wc-block-product-template .wc-block-components-product-image,
.wc-block-product-template .wp-block-woocommerce-product-image { border-radius: var(--nl-radius); overflow: hidden; background: var(--nl-oat); margin-bottom: .85rem; }
.wc-block-product-template .wc-block-components-product-image img { aspect-ratio: 1 / 1; object-fit: cover; transition: transform .35s var(--nl-ease); }
.wc-block-product-template .wc-block-product:hover .wc-block-components-product-image img { transform: scale(1.03); }
.wc-block-product-template .wp-block-post-title { font-family: var(--wp--preset--font-family--body); font-size: 1.0625rem; font-weight: 500; letter-spacing: 0; line-height: 1.35; margin: 0 0 .35rem; }
.wc-block-product-template .wp-block-post-title a { color: var(--nl-ink); text-decoration: none; }
.wc-block-product-template .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; } /* whole card clickable */
.wc-block-product-template .wc-block-components-product-price { font-weight: 600; }
.wc-block-product-template .wp-block-button, .wc-block-product-template .wc-block-components-product-button { position: relative; z-index: 1; }
.wc-block-components-product-price ins, .wc-block-components-product-price__value.is-discounted { color: var(--nl-ginger); text-decoration: none; }
.wc-block-components-product-sale-badge { background: #fff; color: var(--nl-ink); border: 1px solid var(--nl-line); border-radius: 999px; font-weight: 600; text-transform: none; }

/* Empty state for collections */
.nl-empty { border: 1px dashed var(--nl-line); border-radius: var(--nl-radius); padding: clamp(1.5rem, 4vw, 3rem); color: var(--nl-muted); }
.nl-empty strong { color: var(--nl-ink); display: block; font-family: var(--wp--preset--font-family--display); font-size: 1.375rem; font-weight: 560; margin-bottom: .35rem; }

/* ---------- Bundles teaser ---------- */
.nl-bundles { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
.nl-bundle { display: grid; gap: 1rem; align-content: start; }
.nl-bundle .nl-slot { aspect-ratio: 4 / 3; }
.nl-bundle h3 { margin: .25rem 0 0; }
.nl-bundle p { margin: 0; color: var(--nl-muted); }
.nl-bundle__items { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.nl-bundle__items li { font-size: var(--wp--preset--font-size--sm); border: 1px solid var(--nl-line); border-radius: 999px; padding: .2rem .7rem; background: #fff; }
@media (min-width: 900px) { .nl-bundles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem; } }

/* ---------- Why enrichment ---------- */
.nl-why { display: grid; gap: clamp(2rem, 4vw, 4rem); grid-template-columns: 1fr; align-items: start; }
.nl-why .nl-slot { aspect-ratio: 4 / 5; }
.nl-why__points { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; gap: 1.25rem; }
.nl-why__points li { display: grid; grid-template-columns: 28px 1fr; gap: .75rem; }
.nl-why__points .nl-icon { color: var(--nl-sage); margin-top: .2rem; }
.nl-why__points strong { display: block; }
.nl-why__points span { color: var(--nl-muted); }
@media (min-width: 900px) { .nl-why { grid-template-columns: 5fr 6fr; } }

/* ---------- How we choose (a real sequence, so it is numbered) ---------- */
.nl-steps { list-style: none; margin: 0; padding: 0; counter-reset: step; display: grid; gap: 0; grid-template-columns: 1fr; }
.nl-steps li { counter-increment: step; display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1.25rem 0; border-top: 1px solid var(--nl-line); }
.nl-steps li::before { content: counter(step); font-family: var(--wp--preset--font-family--display); font-size: 1.75rem; line-height: 1; color: var(--nl-sage); font-weight: 560; }
.nl-steps strong { display: block; font-size: 1.125rem; margin-bottom: .2rem; }
.nl-steps span { color: var(--nl-muted); }
@media (min-width: 900px) {
	.nl-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.75rem; }
	.nl-steps li { grid-template-columns: 1fr; padding-top: 1.25rem; }
}

/* ---------- FAQ / accordions (core/details) ---------- */
.wp-block-details { border-bottom: 1px solid var(--nl-line); }
.wp-block-details summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; align-items: center; font-weight: 600; min-height: 44px; font-size: 1.0625rem; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: ""; flex: none; width: 12px; height: 12px; border-right: 1.75px solid var(--nl-ink); border-bottom: 1.75px solid var(--nl-ink);
	transform: translateY(-3px) rotate(45deg); transition: transform .2s var(--nl-ease);
}
.wp-block-details[open] summary::after { transform: translateY(2px) rotate(-135deg); }
.wp-block-details > :not(summary) { color: var(--nl-muted); max-width: 68ch; }
.wp-block-details > :not(summary):first-of-type { margin-top: .5rem; }

/* ---------- Newsletter ---------- */
.nl-news { background: var(--nl-oat); border-radius: var(--nl-radius); padding: clamp(1.75rem, 4vw, 3.5rem); display: grid; gap: 1.5rem; grid-template-columns: 1fr; align-items: center; }
.nl-news h2 { margin: 0 0 .5rem; }
.nl-news p { margin: 0; color: var(--nl-muted); }
.nl-news__form { display: grid; gap: .75rem; }
.nl-news__row { display: flex; gap: .5rem; flex-wrap: wrap; }
.nl-news__row input[type=email] { flex: 1 1 220px; }
.nl-news__consent { display: flex; gap: .6rem; align-items: flex-start; font-size: var(--wp--preset--font-size--sm); color: var(--nl-muted); }
.nl-news__consent input { margin-top: .25rem; width: 18px; height: 18px; accent-color: var(--nl-sage-dark); flex: none; }
@media (min-width: 900px) { .nl-news { grid-template-columns: 1fr 1fr; gap: 3rem; } }

/* ---------- Forms (theme + WooCommerce) ---------- */
input[type=text], input[type=email], input[type=tel], input[type=search], input[type=number], input[type=password], select, textarea {
	font: inherit; color: var(--nl-ink); background: #fff; border: 1px solid #CFC7BC; border-radius: 10px; padding: .7rem .9rem; min-height: 48px;
}
input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: var(--nl-ink); }
.nl-btn { font: 600 1.0625rem/1.25 var(--wp--preset--font-family--body); background: var(--nl-sage-dark); color: #fff; border: 0; border-radius: 999px; padding: .8rem 1.5rem; min-height: 48px; cursor: pointer; }
.nl-btn:hover { background: var(--nl-ink); }

/* ---------- Footer ---------- */
.nl-footer { background: var(--nl-oat); margin-top: 0; }
.nl-footer a { color: var(--nl-ink); text-decoration: none; }
.nl-footer a:hover { text-decoration: underline; text-underline-offset: .25em; }
.nl-footer__grid { display: grid; gap: 2rem; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 1240px; margin-inline: auto; padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.nl-footer__brand { grid-column: 1 / -1; }
.nl-footer__brand p { color: var(--nl-muted); max-width: 34ch; margin: .75rem 0 0; }
.nl-footer h2 { font-family: var(--wp--preset--font-family--body); font-size: 1rem; font-weight: 600; letter-spacing: 0; margin: 0 0 .75rem; }
.nl-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .15rem; }
.nl-footer li a { display: inline-flex; min-height: 36px; align-items: center; font-size: var(--wp--preset--font-size--sm); }
.nl-footer__legal { background: var(--nl-sage-dark); color: #fff; font-size: var(--wp--preset--font-size--xs); }
.nl-footer__legal a { color: #fff; text-decoration: underline; text-underline-offset: .2em; }
.nl-footer__legal-inner { max-width: 1240px; margin-inline: auto; padding-block: 1.1rem; display: flex; flex-wrap: wrap; gap: .75rem 2rem; justify-content: space-between; align-items: center; }
.nl-footer__legal p { margin: 0; }
.nl-link-button { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: .2em; cursor: pointer; min-height: 36px; }
@media (min-width: 900px) {
	.nl-footer__grid { grid-template-columns: 1.6fr repeat(4, minmax(0, 1fr)); }
	.nl-footer__brand { grid-column: auto; }
}
.nl-pay { list-style: none; display: flex !important; flex-wrap: wrap; gap: .4rem !important; margin: 1rem 0 0; padding: 0; }
.nl-pay li { font-size: .75rem; font-weight: 600; border: 1px solid #D6CEC2; border-radius: 6px; padding: .2rem .5rem; background: #fff; color: var(--nl-ink); }
.nl-social { display: flex !important; gap: .25rem !important; }
.nl-social a { min-width: 44px; min-height: 44px; display: inline-flex !important; align-items: center; justify-content: center; }

/* ---------- Breadcrumbs ---------- */
.woocommerce-breadcrumb, .wc-block-breadcrumbs { font-size: var(--wp--preset--font-size--sm); color: var(--nl-muted); }
.woocommerce-breadcrumb a, .wc-block-breadcrumbs a { color: var(--nl-muted); }

/* ---------- Shop / category ---------- */
.nl-cat-intro { max-width: 68ch; color: var(--nl-muted); font-size: var(--wp--preset--font-size--lg); line-height: 1.55; }
.nl-cat-guide { max-width: 68ch; }
.wc-block-product-filters, .wp-block-woocommerce-product-filters { font-size: var(--wp--preset--font-size--sm); }
.nl-shop-layout { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media (min-width: 1024px) { .nl-shop-layout { grid-template-columns: 240px minmax(0, 1fr); gap: 3rem; } }

/* ---------- Single product ---------- */
.nl-pdp { display: grid; grid-template-columns: 1fr; gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
@media (min-width: 900px) {
	.nl-pdp { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
	.nl-pdp__summary { position: sticky; top: calc(var(--nl-header-h) + 24px); }
}
.nl-pdp .woocommerce-product-gallery__image, .nl-pdp .wc-block-product-gallery, .nl-pdp .wp-block-woocommerce-product-image-gallery img { border-radius: var(--nl-radius); }
.nl-pdp .woocommerce-product-gallery .flex-control-thumbs { display: flex; gap: .5rem; margin-top: .75rem; }
.nl-pdp .woocommerce-product-gallery .flex-control-thumbs li { width: 72px !important; border-radius: 10px; overflow: hidden; }
.nl-pdp__summary .wp-block-post-title { font-size: clamp(1.875rem, 1.4rem + 1.6vw, 2.5rem); margin: 0; }
.nl-pdp__summary .wc-block-components-product-price, .nl-pdp__summary .wp-block-woocommerce-product-price { font-size: 1.5rem; }
.nl-pdp__summary form.cart { display: flex; flex-wrap: wrap; gap: .75rem; align-items: stretch; margin: 0; }
.nl-pdp__summary form.cart .quantity input { width: 5rem; text-align: center; }
.nl-pdp__summary .single_add_to_cart_button, .nl-pdp__summary .wc-block-components-product-button__button {
	flex: 1 1 220px; background: var(--nl-ginger) !important; color: #fff !important; border: 0; border-radius: 999px !important; min-height: 52px; font-weight: 600; font-size: 1.0625rem;
}
.nl-pdp__summary .single_add_to_cart_button:hover { background: var(--wp--preset--color--ginger-hover) !important; }
.nl-pdp__summary table.variations { width: 100%; border: 0; }
.nl-pdp__summary table.variations th, .nl-pdp__summary table.variations td { display: block; text-align: left; padding: 0 0 .5rem; }
.nl-pdp__summary .reset_variations { font-size: var(--wp--preset--font-size--sm); }

/* Shipping chip (rendered by the mu-plugin) */
.nl-ship { display: flex; gap: .7rem; align-items: flex-start; border: 1px solid var(--nl-line); border-radius: 12px; padding: .8rem 1rem; }
.nl-ship .nl-icon { color: var(--nl-sage); flex: none; margin-top: .1rem; }
.nl-ship strong { display: block; font-weight: 600; }
.nl-ship span { color: var(--nl-muted); font-size: var(--wp--preset--font-size--sm); }
.nl-assurances { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; font-size: var(--wp--preset--font-size--sm); color: var(--nl-muted); }
.nl-assurances li { display: flex; gap: .5rem; align-items: center; }
.nl-assurances .nl-icon { color: var(--nl-sage); }

/* Will it fit? */
.nl-fit { border: 1px solid var(--nl-line); border-radius: var(--nl-radius); padding: 1.25rem; }
.nl-fit__title { font-size: 1.375rem; margin: 0 0 1rem; }
.nl-fit__body { display: grid; grid-template-columns: 180px 1fr; gap: 1.25rem; align-items: end; }
.nl-fit__gauge { position: relative; height: 220px; display: grid; grid-template-columns: 44px 1fr 1fr; gap: 10px; align-items: end; }
.nl-fit__gauge .nl-ruler { height: 100%; grid-row: 1; grid-column: 1; }
.nl-fit__door, .nl-fit__item { position: relative; border-radius: 6px 6px 0 0; grid-row: 1; }
.nl-fit__door { grid-column: 2; border: 1.5px dashed #CFC7BC; border-bottom: 0; }
.nl-fit__item { grid-column: 3; background: var(--nl-sage); }
.nl-fit__door span, .nl-fit__item span { position: absolute; bottom: calc(100% + 4px); left: 0; font-size: .7rem; line-height: 1.2; color: var(--nl-muted); width: 90px; }
.nl-fit__item span { color: var(--nl-sage-dark); font-weight: 600; }
.nl-fit__dims { margin: 0; display: grid; gap: .5rem; }
.nl-fit__dims div { display: flex; justify-content: space-between; border-bottom: 1px solid var(--nl-line); padding-bottom: .4rem; }
.nl-fit__dims dt { color: var(--nl-muted); }
.nl-fit__dims dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.nl-fit__note { color: var(--nl-muted); font-size: var(--wp--preset--font-size--sm); margin: 1rem 0 0; }
@media (max-width: 420px) { .nl-fit__body { grid-template-columns: 1fr; } }

/* Product tabs → accordions look */
.nl-pdp-details .wp-block-details { padding-block: 1rem; }

/* Sticky add-to-cart (mobile) */
.nl-sticky-atc {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: #fff; border-top: 1px solid var(--nl-line);
	padding: .6rem 16px calc(.6rem + env(safe-area-inset-bottom)); display: flex; align-items: center; gap: .75rem;
	transform: translateY(110%); transition: transform .25s var(--nl-ease);
}
.nl-sticky-atc.is-visible { transform: none; }
.nl-sticky-atc__info { min-width: 0; flex: 1; }
.nl-sticky-atc__title { font-size: .875rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; }
.nl-sticky-atc__price { font-weight: 600; }
.nl-sticky-atc button { background: var(--nl-ginger); color: #fff; border: 0; border-radius: 999px; font: 600 1rem/1 var(--wp--preset--font-family--body); padding: .9rem 1.4rem; min-height: 48px; cursor: pointer; }
@media (min-width: 900px) { .nl-sticky-atc { display: none; } }

/* ---------- Cart & checkout ---------- */
.wc-block-cart, .wc-block-checkout { font-size: 1rem; }
.wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button, .wc-block-mini-cart__footer-checkout {
	background: var(--nl-ginger) !important; color: #fff !important; border-radius: 999px !important; min-height: 52px; font-weight: 600;
}
.wc-block-cart__submit-button:hover, .wc-block-components-checkout-place-order-button:hover, .wc-block-mini-cart__footer-checkout:hover { background: var(--wp--preset--color--ginger-hover) !important; }
.wc-block-mini-cart__footer-cart { border-radius: 999px !important; }
.wc-block-components-drawer__close { background: transparent !important; color: var(--nl-ink) !important; }
.wc-block-components-text-input input, .wc-block-components-combobox .wc-block-components-combobox-control input, .wc-blocks-components-select__select { border-radius: 10px !important; }
.wc-block-components-product-details { color: var(--nl-muted); font-size: .875rem; }
.wc-block-components-notice-banner { border-radius: 12px; }

/* ---------- Content (pages, posts, legal) ---------- */
.nl-prose { max-width: 68ch; }
.nl-prose h2 { font-size: clamp(1.625rem, 1.3rem + 1vw, 2rem); margin-top: 2.5rem; }
.nl-prose h3 { margin-top: 2rem; }
.nl-prose table { border-collapse: collapse; width: 100%; font-size: var(--wp--preset--font-size--sm); }
.nl-prose th, .nl-prose td { border-bottom: 1px solid var(--nl-line); padding: .6rem .5rem; text-align: left; vertical-align: top; }
.nl-placeholder { background: #FFF3CD; outline: 1px dashed #B58100; padding: 0 .25em; border-radius: 3px; }
.nl-meta { color: var(--nl-muted); font-size: var(--wp--preset--font-size--sm); }

/* ---------- 404 ---------- */
.nl-404 .nl-mark { color: var(--nl-ginger); }

/* ---------- Motion safety ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Placeholders stay visible on oat bands. */
.nl-section--oat .nl-slot, .nl-news .nl-slot { background-color: #ECE4D8; }

/* Space labels: name over description, never squeezed side by side. */
.nl-space__label { flex-direction: column; align-items: flex-start; gap: .1rem; }

/* Header icons share one optical size. */
.nl-header__tools svg { width: 24px !important; height: 24px !important; }
.nl-header__tools .wp-block-woocommerce-customer-account { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; }

/* Intros and guides read from the left edge, like the rest of the page. */
.nl-cat-intro, .nl-cat-guide, main > .wp-block-term-description { margin-left: 0 !important; }

/* Bundle card titles keep the h3 look when used as h2 on /bundles/. */
.nl-bundle h2 { font-size: var(--wp--preset--font-size--subtitle); line-height: 1.2; letter-spacing: -.01em; margin: .25rem 0 0; }

/* Hidden mini-cart drawer: out of the tab order and the accessibility tree. */
.wc-block-components-drawer__screen-overlay--is-hidden { visibility: hidden; }

/* Product Collection has no spacing support, so its offsets live here. */
main > .wp-block-woocommerce-product-collection { margin-top: var(--wp--preset--spacing--40); }
main > section.wp-block-woocommerce-product-collection { margin-top: var(--wp--preset--spacing--60); }

/* Polish: shipping chip and fit gauge proportions. */
.nl-ship span { display: block; line-height: 1.45; margin-top: .1rem; }
.nl-ship strong { line-height: 1.35; }
.nl-fit__body { grid-template-columns: minmax(170px, 210px) 1fr; }
.nl-fit__gauge { height: 240px; padding-top: 2.5rem; box-sizing: border-box; grid-template-columns: 44px 1fr 1fr; }
.nl-fit__door span, .nl-fit__item span { width: 80px; }
@media (max-width: 420px) {
	.nl-fit__body { grid-template-columns: 1fr; }
	.nl-fit__gauge { width: 100%; max-width: 240px; }
}
.nl-fit__item span { white-space: nowrap; width: auto; }
.nl-fit__title { margin-bottom: .25rem; }

/* Post cards and titles: ink, underline on hover. */
.wp-block-post-title a { color: var(--nl-ink); text-decoration: none; }
.wp-block-post-title a:hover { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: .15em; text-decoration-color: var(--nl-sage); }
.wp-block-post-template .wp-block-post-excerpt { color: var(--nl-muted); }

/* Footer breathing room between tagline and payment marks. */
.nl-footer .nl-pay { margin-top: 1.25rem; }

/* Empty cart: brand voice instead of WooCommerce's sad face. */
.wc-block-cart__empty-cart__title.with-empty-cart-icon::before { display: none; }
.wp-block-woocommerce-empty-cart-block { text-align: left; }
.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title { text-align: left; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--subtitle); font-weight: 560; margin-top: 0; }
.wp-block-woocommerce-empty-cart-block .wp-block-separator.is-style-dots { display: none; }
.wp-block-woocommerce-empty-cart-block h2.has-text-align-center { text-align: left; }

/* Article meta: "Updated" label only appears when the modified date shows. */
.nl-updated::before { content: "updated "; }
.nl-meta .wp-block-post-author-name::after, .nl-meta .wp-block-post-date:has(+ .nl-updated)::after { content: ","; }

/* Real images in slots: same box as the placeholder, cropped to fill. */
.nl-img { display: block; width: 100%; height: auto; object-fit: cover; }
@media (min-width: 900px) {
	.nl-space:nth-child(1) .nl-slot { aspect-ratio: 3 / 4.4 !important; }
	.nl-space:nth-child(2) .nl-slot { aspect-ratio: 1 / 1 !important; }
	.nl-space:nth-child(3) .nl-slot { aspect-ratio: 3 / 4 !important; }
	.nl-space:nth-child(4) .nl-slot { aspect-ratio: 4 / 3.4 !important; }
}
.nl-space .nl-img { transition: transform .4s var(--nl-ease); }
.nl-space { overflow: hidden; }
.nl-space:hover .nl-img { transform: scale(1.02); }
@media (prefers-reduced-motion: reduce) { .nl-space:hover .nl-img { transform: none; } }

/* Category header: text left, category image right. */
.nl-cat-head { display: grid; gap: 1.5rem; }
.nl-cat-head__text > :first-child { margin-top: 0; }
.nl-cat-image { margin: 0; max-width: 360px; }
.nl-cat-image .nl-img { border-radius: var(--nl-radius); }
@media (min-width: 900px) {
	.nl-cat-head:has(.nl-cat-image) { grid-template-columns: minmax(0, 1fr) 360px; align-items: center; gap: 3rem; }
}
@media (max-width: 899px) {
	.nl-cat-image { max-width: none; }
	.nl-cat-image .nl-img { aspect-ratio: 16 / 9 !important; }
}
@media (min-width: 900px) { .nl-space:nth-child(4) .nl-img { object-position: 50% 12%; } }

/* "Nine Loofts" is a letter longer: keep header breathing room on narrow phones. */
@media (max-width: 420px) {
	.nl-logo__word { font-size: 1.28rem; }
	.nl-logo .nl-mark { width: 30px; height: 30px; }
	.nl-header__tools { gap: 0 !important; }
}
@media (max-width: 360px) {
	.nl-logo__word { font-size: 1.12rem; }
}

/* Legal pages: calmer headings and readable tables. */
.nl-prose-page .wp-block-post-content h2 { font-size: clamp(1.5rem, 1.25rem + 0.9vw, 1.875rem); margin-top: 2.75rem; margin-bottom: .75rem; }
.nl-prose-page .wp-block-post-content h3 { font-size: 1.25rem; margin-top: 2rem; }
.nl-prose-page .wp-block-post-content p, .nl-prose-page .wp-block-post-content li { max-width: 70ch; }
.nl-prose-page .wp-block-table { margin: 1.25rem 0 1.75rem; overflow-x: auto; }
.nl-prose-page .wp-block-table table { border-collapse: collapse; width: 100%; font-size: var(--wp--preset--font-size--sm); line-height: 1.5; }
.nl-prose-page .wp-block-table th, .nl-prose-page .wp-block-table td { border: 0; border-bottom: 1px solid var(--nl-line); padding: .7rem .75rem .7rem 0; text-align: left; vertical-align: top; }
.nl-prose-page .wp-block-table th { font-weight: 600; color: var(--nl-ink); border-bottom-width: 2px; }
.nl-prose-page .wp-block-table tbody td:first-child { color: var(--nl-muted); width: 34%; }
.nl-prose-page .wp-block-table table.has-fixed-layout { table-layout: auto; }
.nl-prose-page .wp-block-list li + li { margin-top: .35rem; }

/* Contact form (mu-plugin shortcode) */
.nl-form { display: grid; gap: .25rem; max-width: 640px; }
.nl-form__row { display: grid; gap: 0 1rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .nl-form__row { grid-template-columns: 1fr 1fr; } }
.nl-field { display: grid; gap: .35rem; margin: 0 0 1rem; }
.nl-field label { font-weight: 600; font-size: var(--wp--preset--font-size--sm); }
.nl-field input, .nl-field select, .nl-field textarea { width: 100%; box-sizing: border-box; }
.nl-field textarea { min-height: 150px; resize: vertical; }
.nl-field [aria-invalid="true"] { border-color: var(--wp--preset--color--error); box-shadow: 0 0 0 1px var(--wp--preset--color--error); }
.nl-field--check { grid-template-columns: 20px 1fr; align-items: start; gap: .65rem; }
.nl-field--check input { width: 18px; height: 18px; margin-top: .2rem; accent-color: var(--nl-sage-dark); }
.nl-field--check label { font-weight: 400; color: var(--nl-muted); }
.nl-optional { font-weight: 400; color: var(--nl-muted); }
.nl-form__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.nl-form-notice { border-radius: 12px; padding: 1rem 1.25rem; margin: 0 0 1.25rem; max-width: 640px; }
.nl-form-notice--ok { background: #EAF4EE; color: #1F4A33; border: 1px solid #BFDCCB; }
.nl-form-notice--error { background: #FDECEA; color: #7A1C14; border: 1px solid #F3C4BE; }