/* =========================================================================
   Cranebags theme. Dark-only by brand direction (black + neon green).
   Type: Big Shoulders Display (headings), its Stencil cut (highlighted words),
   Barlow (body), IBM Plex Mono (labels). Shape: chamfered steel-plate corners.
   Section classes (cb-*) are set on core blocks, so all text and images stay
   editable in the block editor.
   ========================================================================= */
:root {
	--asphalt: #0B0D0A; --steel: #121510; --plate: #1A1E18; --line: #2B3128;
	--bone: #ECEFE6; --muted: #A3AA9C; --signal: #6CFF34; --signal-hi: #9BFF6E;
	--display: var(--wp--preset--font-family--display); --stencil: var(--wp--preset--font-family--stencil);
	--body: var(--wp--preset--font-family--body); --mono: var(--wp--preset--font-family--mono);
	--cut: 16px;
	--chamfer: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));
	--wrap: 1520px; --gutter: clamp(20px, 4vw, 64px); --ease: cubic-bezier(0.16, 1, 0.3, 1);
}
html { scroll-padding-top: 110px; }
body { -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body::after { content: ""; position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .06;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
img { max-width: 100%; height: auto; }
:focus-visible { outline: 2px solid var(--signal); outline-offset: 3px; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * + *, .cb-main > * + * { margin-block-start: 0; }
main.cb-main { overflow-x: clip; }

/* Highlighted words (Highlight > Signal green in the toolbar) become stencil */
h1 mark.has-inline-color, h2 mark.has-inline-color, h3 mark.has-inline-color, .wp-block-heading mark {
	font-family: var(--stencil); color: var(--signal); background: none !important; font-weight: 900; }

/* Layout primitives */
.cb-wrap { max-width: var(--wrap); margin-inline: auto !important; padding-inline: var(--gutter); box-sizing: border-box; width: 100%; }
.cb-wrap > * { margin-block: 0; }
.cb-sec { padding-block: clamp(5rem, 10vw, 9rem); }
.cb-split { display: grid; gap: clamp(2.5rem, 6vw, 7rem); align-items: start; }
.cb-split-5-7 { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.cb-split-7-5 { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.cb-mono, .cb-eyebrow, .cb-foot-h, .cb-tag { font-family: var(--mono); font-weight: 500; font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; }
.cb-eyebrow { color: var(--signal); margin: 0; }
.cb-lede { color: var(--muted); font-size: 1.15rem; max-width: 52ch; }
.cb-muted { color: var(--muted); font-size: .95rem; }
.cb-note { color: var(--muted); font-size: .9rem; }

/* Icons on blocks: add class cb-ico-<name> (crane, truck, phone, ...) */
[class*="cb-ico-"]::before { content: ""; display: block; width: 2rem; height: 2rem; background: var(--signal); -webkit-mask: var(--cb-mask) center / contain no-repeat; mask: var(--cb-mask) center / contain no-repeat; }
.cb-ico-crane { --cb-mask: url("../icons/crane.svg"); }
.cb-ico-mountains { --cb-mask: url("../icons/mountains.svg"); }
.cb-ico-hand-grabbing { --cb-mask: url("../icons/hand-grabbing.svg"); }
.cb-ico-truck { --cb-mask: url("../icons/truck.svg"); }
.cb-ico-warning { --cb-mask: url("../icons/warning.svg"); }
.cb-ico-arrows-out-line-horizontal { --cb-mask: url("../icons/arrows-out-line-horizontal.svg"); }
.cb-ico-stack-simple { --cb-mask: url("../icons/stack-simple.svg"); }
.cb-ico-tree-evergreen { --cb-mask: url("../icons/tree-evergreen.svg"); }
.cb-ico-house-line { --cb-mask: url("../icons/house-line.svg"); }
.cb-ico-lightning { --cb-mask: url("../icons/lightning.svg"); }
.cb-ico-hard-hat { --cb-mask: url("../icons/hard-hat.svg"); }
.cb-ico-crane-tower { --cb-mask: url("../icons/crane-tower.svg"); }
.cb-ico-phone { --cb-mask: url("../icons/phone.svg"); }
.cb-ico-shield-check { --cb-mask: url("../icons/shield-check.svg"); }
.cb-note[class*="cb-ico-"] { display: flex; align-items: center; gap: .6rem; margin: 0; }
.cb-note[class*="cb-ico-"]::before { width: 1.1rem; height: 1.1rem; flex: none; }

/* Buttons */
.wp-block-button__link { clip-path: var(--chamfer); --cut: 14px; transition: background-color .25s var(--ease), transform .15s var(--ease); white-space: nowrap; }
.wp-block-button__link:active { transform: translateY(1px) scale(.99); }
.wp-block-button__link:focus-visible { clip-path: none; }
.is-style-cb-ghost .wp-block-button__link { background: rgb(236 239 230 / .06) !important; color: var(--bone) !important; box-shadow: inset 0 0 0 1px rgb(236 239 230 / .25); backdrop-filter: blur(6px); }
.is-style-cb-ghost .wp-block-button__link:hover { background: rgb(236 239 230 / .14) !important; }
.wp-block-buttons { gap: .8rem; }

/* ================= Header ================= */
.cb-header { position: sticky; top: 0; z-index: 50; }
.admin-bar .cb-header { top: 32px; }
.cb-ubar { background: var(--signal); color: var(--asphalt); }
.cb-ubar-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 36px; }
.cb-ubar p { margin: 0; font-size: .75rem; letter-spacing: .1em; }
.cb-ubar strong { font-weight: 500; }
/* Blur sits on a pseudo-element: backdrop-filter on .cb-nav itself would trap the fixed mobile menu overlay inside the header. */
.cb-nav { position: relative; border-bottom: 1px solid var(--line); }
.cb-nav::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgb(11 13 10 / .88); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.cb-nav-row { display: flex; align-items: center; gap: 2rem; min-height: 80px; }
.cb-nav-row .wp-block-site-logo img { filter: drop-shadow(0 0 14px rgb(108 255 52 / .25)); max-height: 62px; width: auto; }
.cb-menu { margin-left: auto; font-weight: 500; gap: 2rem; }
.cb-menu .wp-block-navigation-item__content { color: var(--muted); text-decoration: none; position: relative; transition: color .2s; }
.cb-menu .wp-block-navigation-item__content:hover { color: var(--bone); }
.cb-menu .wp-block-navigation__responsive-container.is-menu-open { background: var(--asphalt) !important; color: var(--bone) !important; padding: 2rem var(--gutter); }
.cb-menu .is-menu-open .wp-block-navigation-item__content { font: 900 2.4rem/1 var(--display); text-transform: uppercase; color: var(--bone); padding-block: .6rem; }
.cb-menu .wp-block-navigation__responsive-container-open, .cb-menu .wp-block-navigation__responsive-container-close { color: var(--bone); width: 44px; height: 44px; place-items: center; }
.cb-menu .wp-block-navigation__responsive-container-open:not([hidden]) { background: var(--plate); box-shadow: inset 0 0 0 1px var(--line); }
@media (max-width: 599px) { .cb-menu .wp-block-navigation__responsive-container-open { display: grid; } }
.cb-nav-row .wp-block-woocommerce-customer-account { display: none; }
.cb-nav-row .wc-block-mini-cart__button { padding: .4rem; }
.cb-nav-row .wc-block-mini-cart__icon { width: 1.5rem; height: 1.5rem; }
.cb-nav-tools { display: flex; align-items: center; gap: 1.1rem; }
.cb-nav-tools > * { margin: 0 !important; }
.cb-nav-phone a { color: var(--bone); text-decoration: none; font-weight: 600; display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; }
.cb-nav-phone a::before { content: ""; width: 1.1rem; height: 1.1rem; background: var(--signal); -webkit-mask: url("../icons/phone.svg") center / contain no-repeat; mask: url("../icons/phone.svg") center / contain no-repeat; }
.cb-nav-cta .wp-block-button__link { padding: .85rem 1.2rem; font-size: .875rem; --cut: 10px; }
.wc-block-mini-cart__button { color: var(--bone); min-height: 44px; }
.wc-block-mini-cart__badge { background: var(--signal) !important; color: var(--asphalt) !important; border-radius: 0 !important; }
.wc-block-mini-cart__drawer .components-modal__content, .wc-block-mini-cart__drawer { background: var(--steel) !important; color: var(--bone) !important; }

/* ================= Footer ================= */
.cb-footer { background: var(--steel); border-top: 1px solid var(--line); }
.cb-footer::before { content: ""; display: block; height: 12px; background: repeating-linear-gradient(-45deg, var(--signal) 0 16px, var(--asphalt) 16px 32px); }
.cb-foot { display: grid; grid-template-columns: minmax(0, 4fr) repeat(4, minmax(0, 2fr)); gap: 2.5rem; padding-block: 4.5rem 3rem; }
.cb-foot-brand p { color: var(--muted); max-width: 36ch; margin-top: 1.2rem; }
.cb-foot-h { color: var(--signal); margin: 0 0 1rem; }
.cb-foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.cb-foot ul a, .cb-foot-legal a { color: var(--muted); text-decoration: none; min-height: 40px; display: inline-flex; align-items: center; transition: color .2s; }
.cb-foot ul a:hover, .cb-foot-legal a:hover { color: var(--bone); }
.cb-foot-base { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5rem 1rem; padding-block: 1rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .875rem; }
.cb-foot-base p { margin: 0; }
.cb-foot-legal { display: flex; gap: .2rem 1.4rem; flex-wrap: wrap; }

/* ================= Hero ================= */
.cb-hero { position: relative; min-height: min(calc(100dvh - 116px), 940px); display: grid; align-items: center; overflow: hidden; isolation: isolate; margin: 0; }
.cb-hero-bg { position: absolute !important; inset: -8% 0 0 34%; z-index: -2; margin: 0 !important; }
.cb-hero-bg img { width: 100%; height: 100% !important; object-fit: cover; object-position: 34% 60%; }
.cb-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background:
	linear-gradient(90deg, var(--asphalt) 0%, var(--asphalt) 34%, rgb(11 13 10 / .55) 46%, rgb(11 13 10 / 0) 62%),
	linear-gradient(0deg, var(--asphalt) 0%, rgb(11 13 10 / 0) 26%); }
.cb-hero > .cb-wrap { padding-block: 4rem 5.5rem; }
.cb-hero-copy { max-width: 760px; display: grid; gap: 1.75rem; }
.cb-hero-copy > * { margin: 0 !important; }
.cb-hero-title { font-size: clamp(3.75rem, 7.8vw, 8.75rem) !important; line-height: .84 !important; }
.cb-hero .cb-lede { font-size: 1.25rem; color: #C9CEC2; max-width: 34ch; }

/* ================= Highlights band ================= */
.cb-specs { background: var(--steel); border-bottom: 1px solid var(--line); }
.cb-specs-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cb-spec { display: grid; grid-template-columns: auto 1fr; column-gap: 1rem; padding: 2.2rem 1.75rem; border-left: 1px solid var(--line); }
.cb-spec:first-child { border-left: 0; padding-left: 0; }
.cb-spec::before { grid-row: span 2; width: 2.1rem; height: 2.1rem; }
.cb-spec h2, .cb-spec h3 { font-size: 1.35rem !important; font-weight: 800; line-height: 1; letter-spacing: .02em; margin: 0; }
.cb-spec p { color: var(--muted); font-size: .9375rem; line-height: 1.45; margin: .3rem 0 0; }

/* ================= Marquee ================= */
.cb-marquee { background: var(--signal); color: var(--asphalt); overflow: hidden; transform: rotate(-1.4deg); margin: 4.5rem -2vw !important; box-shadow: 0 20px 60px rgb(108 255 52 / .12); }
.cb-marquee-track { display: flex; width: max-content; animation: cb-slide 38s linear infinite; }
.cb-marquee-track p { margin: 0 !important; font: 900 clamp(2.4rem, 4.6vw, 4.5rem)/1 var(--stencil); text-transform: uppercase; padding: 1.1rem 0; display: inline-flex; align-items: center; white-space: nowrap; }
.cb-marquee-track p::after { content: ""; width: .5em; height: .5em; background: var(--asphalt); transform: rotate(45deg); margin: 0 .9em; }
@keyframes cb-slide { to { transform: translateX(-50%); } }

/* ================= Problem ================= */
.cb-problem-head { position: sticky; top: 140px; display: grid; gap: 1.6rem; }
.cb-problem-head > * { margin: 0; }
.cb-prob-list > * { margin: 0; }
.cb-prob { display: grid; grid-template-columns: 64px minmax(0, 1fr) minmax(0, 220px); gap: 1.6rem; align-items: center; padding-block: 2.2rem; border-top: 1px solid var(--line); }
.cb-prob:last-child { border-bottom: 1px solid var(--line); }
.cb-prob::before { width: 64px; height: 64px; background: var(--bone); -webkit-mask-size: 2rem; mask-size: 2rem; box-shadow: none; }
.cb-prob-text h3 { margin: 0 0 .6rem; }
.cb-prob-text p { color: var(--muted); max-width: 48ch; margin: 0; }
.cb-prob-img { margin: 0 !important; aspect-ratio: 4 / 3; overflow: hidden; clip-path: var(--chamfer); --cut: 12px; background: var(--plate); }
.cb-prob-img img { width: 100%; height: 100% !important; object-fit: cover; filter: grayscale(.25) contrast(1.05); transition: transform .8s var(--ease), filter .5s; }
.cb-prob:hover .cb-prob-img img { transform: scale(1.06); filter: none; }

/* ================= Compare (signature) ================= */
.cb-compare { background: var(--steel); border-block: 1px solid var(--line); }
.cb-compare-stage { min-height: min(100dvh, 1000px); display: grid; align-items: center; padding-block: 5rem 3rem; background: var(--steel); }
.cb-cmp-top { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 4vw, 5rem); align-items: end; margin-bottom: 2.25rem; }
.cb-cmp-top > * { margin: 0; }
.cb-cmp-title { font-size: clamp(2.75rem, 4.8vw, 4.75rem) !important; }
.rail-wrap { display: grid; gap: .9rem; }
.rail-box { position: relative; }
.rail { position: relative; list-style: none; margin: 0; padding: 16px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.rail::before, .rail-fill { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; z-index: 1; }
.rail::before { background: var(--line); }
.rail-fill { z-index: 2; background: var(--signal); transform-origin: left; transform: scaleX(var(--p, 1)); box-shadow: 0 0 14px rgb(108 255 52 / .5); }
.rail li { font: 800 1.35rem/1 var(--display); text-transform: uppercase; color: #7E8678; transition: color .4s var(--ease); }
.rail li.on { color: var(--bone); }
.rail li.on::before { content: ""; display: inline-block; width: .5em; height: .5em; background: var(--signal); transform: rotate(45deg); margin-right: .5em; vertical-align: .12em; }
#phaseText { color: var(--muted); min-height: 3.2em; max-width: 60ch; margin: 0; }
.duel { display: grid; grid-template-columns: minmax(0, 1fr) 96px minmax(0, 1fr); gap: 1rem; }
.side { margin: 0; display: grid; grid-template-rows: auto 1fr auto; gap: .5rem; padding: 1.25rem 1.4rem 1.1rem; background: radial-gradient(110% 80% at 50% 25%, #1B2018 0%, var(--asphalt) 72%); box-shadow: inset 0 0 0 1px var(--line); clip-path: var(--chamfer); --cut: 22px; }
.side-bag { box-shadow: inset 0 0 0 1px rgb(108 255 52 / .35); }
.side figcaption { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.side h3 { font-size: clamp(1.6rem, 2.2vw, 2.2rem); margin: 0; }
.side-bag h3 { color: var(--signal); }
.side .mono, .mid .mono { font-family: var(--mono); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.side svg { width: 100%; height: auto; max-height: 50vh; display: block; overflow: visible; }
.verdict { display: flex; align-items: center; gap: .6rem; font-weight: 600; margin: 0; }
.verdict .icon { width: 1.3rem; height: 1.3rem; }
.verdict.bad .icon { color: #FF8A6B; } .verdict.good .icon { color: var(--signal); }
.mid { display: grid; justify-items: center; align-content: center; gap: 1.1rem; }
.vs { font: 900 3.4rem/1 var(--stencil); color: #646D5F; }
.vticks { display: flex; flex-direction: column-reverse; gap: 5px; width: 40px; }
.vticks i { height: 11px; background: var(--plate); box-shadow: inset 0 0 0 1px var(--line); transition: background-color .25s; }
.vticks i.lit { background: var(--signal); box-shadow: 0 0 10px rgb(108 255 52 / .5); }
.svg-label { font: 500 15px var(--mono); letter-spacing: .08em; text-transform: uppercase; fill: var(--muted); }
.svg-label.on { fill: var(--signal); } .svg-label.bad { fill: #FF8A6B; }
.cb-compare .cb-note { margin-top: 1.5rem; }

/* ================= Built (bento) ================= */
.cb-built .cb-wrap > h2 { margin-bottom: 3.5rem; max-width: 1100px; }
.cb-bento { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(280px, auto)); gap: 14px; }
.cb-bento > * { margin: 0 !important; }
.cb-cell { position: relative; overflow: hidden; background: var(--plate); clip-path: var(--chamfer); --cut: 20px; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(1.5rem, 2.5vw, 2.4rem); min-height: 280px; isolation: isolate; }
.cb-cell > * { margin: 0; position: relative; }
.cb-cell h3 { margin-bottom: .55rem; }
.cb-cell p { color: #C2C8BB; max-width: 40ch; }
.cb-cell-bg { position: absolute !important; inset: 0; z-index: -2; margin: 0 !important; }
.cb-cell-bg img { width: 100%; height: 100% !important; object-fit: cover; }
.cb-photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgb(11 13 10 / .95) 0%, rgb(11 13 10 / .25) 55%, rgb(11 13 10 / 0) 100%); }
.cb-cell-a { grid-column: 1 / 8; grid-row: 1 / 3; min-height: 600px; justify-content: flex-start; }
.cb-cell-a.cb-photo::after { background: linear-gradient(180deg, rgb(11 13 10 / .9) 0%, rgb(11 13 10 / .2) 40%, rgb(11 13 10 / 0) 60%, rgb(11 13 10 / .35) 100%); }
.cb-cell-b { grid-column: 8 / 13; grid-row: 1; justify-content: center; align-items: center; background: var(--asphalt); box-shadow: inset 0 0 0 1px var(--line); }
.cb-cell-b::before, .cb-cell-b::after { content: ""; position: absolute; left: 0; right: 0; height: 12px; background: repeating-linear-gradient(-45deg, var(--signal) 0 14px, var(--asphalt) 14px 28px); }
.cb-cell-b::before { top: 0; } .cb-cell-b::after { bottom: 0; }
.cb-cell-logo img { width: min(82%, 400px); margin-inline: auto; display: block; filter: drop-shadow(0 0 30px rgb(108 255 52 / .28)); }
.cb-cell-c { grid-column: 8 / 10; grid-row: 2; background: linear-gradient(160deg, #1E2A17 0%, var(--plate) 60%); }
.cb-cell-c::before { margin-bottom: auto; width: 2.4rem; height: 2.4rem; }
.cb-cell-d { grid-column: 10 / 13; grid-row: 2; }
.cb-cell-d .cb-cell-bg img { object-position: 30% 85%; }
.cb-hotspots { position: absolute !important; inset: 0; z-index: 2; pointer-events: none; }
.hotspot { position: absolute; transform: translate(-50%, -50%); pointer-events: auto; }
.hotspot > button { width: 44px; height: 44px; display: grid; place-items: center; border: 0; cursor: pointer; background: var(--signal); color: var(--asphalt); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); transition: transform .3s var(--ease); }
.hotspot > button .icon { width: 16px; height: 16px; transition: transform .3s var(--ease); }
.hotspot::before { content: ""; position: absolute; inset: -10px; border: 1.5px solid var(--signal); transform: rotate(45deg) scale(.6); opacity: 0; pointer-events: none; }
.hotspot:hover > button, .hotspot.open > button { transform: scale(1.12); }
.hotspot.open > button .icon { transform: rotate(45deg); }
.hot-card { position: absolute; left: 50%; bottom: calc(100% + 14px); width: 240px; transform: translate(-50%, 8px); opacity: 0; pointer-events: none; background: rgb(11 13 10 / .92); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px var(--line); padding: 1rem 1.1rem; transition: opacity .3s var(--ease), transform .4s var(--ease); }
.hot-card b { display: block; font: 800 1.2rem/1 var(--display); text-transform: uppercase; margin-bottom: .35rem; color: var(--signal); }
.hot-card span { color: #C2C8BB; font-size: .9rem; line-height: 1.45; display: block; }
.hotspot:hover .hot-card, .hotspot.open .hot-card, .hotspot:focus-within .hot-card { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
@media (prefers-reduced-motion: no-preference) { .hotspot::before { animation: cb-ping 2.4s var(--ease) infinite; } }
@keyframes cb-ping { 0% { opacity: .9; transform: rotate(45deg) scale(.6); } 80%, 100% { opacity: 0; transform: rotate(45deg) scale(1.5); } }

/* ================= Who it's for ================= */
.cb-who-top { display: grid; gap: 1.4rem; max-width: 1150px; margin-bottom: clamp(2.5rem, 5vw, 4rem) !important; }
.cb-who-top > * { margin: 0; }
.cb-who-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.cb-who-stage { position: sticky; top: 130px; display: grid; gap: 1.1rem; }
.cb-who-frame { position: relative; margin: 0; aspect-ratio: 4 / 5; max-height: calc(100dvh - 230px); width: 100%; overflow: hidden; clip-path: var(--chamfer); --cut: 26px; background: var(--plate); }
.cb-who-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; clip-path: inset(100% 0 0 0); transform: scale(1.14); transition: clip-path .85s var(--ease), transform 1.4s var(--ease); }
.cb-who-frame img.prev { clip-path: inset(0); transform: scale(1); z-index: 1; }
.cb-who-frame img.on { clip-path: inset(0); transform: scale(1); z-index: 2; }
.cb-who-sweep { position: absolute; inset: 0; z-index: 4; pointer-events: none; transform: translateY(101%); }
.cb-who-sweep::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--signal); box-shadow: 0 0 18px 2px rgb(108 255 52 / .7); }
.cb-who-frame.swap .cb-who-sweep { animation: cb-sweep .85s var(--ease); }
@keyframes cb-sweep { from { transform: translateY(100%); } to { transform: translateY(-2%); opacity: .2; } }
.cb-who-cap b { display: block; font: 900 1.8rem/1 var(--display); text-transform: uppercase; color: var(--signal); }
.cb-who-cap span { color: var(--muted); }
.cb-trades { border-top: 1px solid var(--line); }
.cb-trade { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; column-gap: 1.4rem; padding: 1.9rem .9rem; border-bottom: 1px solid var(--line); overflow: hidden; isolation: isolate; cursor: pointer; margin: 0 !important; }
.cb-trade::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--signal); transform: scaleY(0); transform-origin: bottom; transition: transform .5s var(--ease); }
.cb-trade::before { width: 2.1rem; height: 2.1rem; transition: background-color .3s; }
.cb-trade h3 { margin: 0; font-size: clamp(2.1rem, 4.4vw, 4.4rem) !important; color: #8D9488; transition: color .3s, transform .5s var(--ease); }
.cb-trade .cb-trade-where { margin: 0; color: var(--muted); text-align: right; transition: color .3s; }
.cb-trade .cb-trade-line, .cb-trade .cb-trade-img { display: none; }
.cb-trade:hover h3, .cb-trade:focus-visible h3 { color: var(--bone); }
.cb-trade.on::after { transform: scaleY(1); }
.cb-trade.on::before { background: var(--asphalt); }
.cb-trade.on h3, .cb-trade.on .cb-trade-where { color: var(--asphalt); }
.cb-trade.on h3 { transform: translateX(10px); }

/* ================= Order (packs) ================= */
.cb-order { border-top: 1px solid var(--line); }
.cb-order-head { display: grid; gap: 1rem; margin-bottom: 3rem !important; }
.cb-order-head > * { margin: 0; }
.cb-packs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.cb-packs > * { margin: 0 !important; }
.cb-pack { position: relative; display: flex; flex-direction: column; gap: .7rem; padding: 0 0 1.6rem; background: var(--steel); box-shadow: inset 0 0 0 1px var(--line); clip-path: var(--chamfer); --cut: 22px; }
.cb-pack > * { margin: 0 1.6rem !important; }
.cb-pack.is-popular { box-shadow: inset 0 0 0 2px var(--signal); background: linear-gradient(180deg, rgb(108 255 52 / .07), transparent 40%), var(--steel); }
.cb-pack-img { margin: 0 0 .6rem !important; aspect-ratio: 4 / 3; overflow: hidden; }
.cb-pack-img img { width: 100%; height: 100% !important; object-fit: cover; transition: transform .8s var(--ease); }
.cb-pack:hover .cb-pack-img img { transform: scale(1.05); }
.cb-tag { position: absolute; top: 1.2rem; right: 0; margin: 0 1.2rem !important; background: var(--signal); color: var(--asphalt); padding: .35rem .5rem; font-size: .7rem; }
.cb-pack h3 { font-size: 2rem !important; }
.cb-pack-note { color: var(--muted); }
.cb-pack-price { font: 500 .9rem var(--mono); color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.cb-pack-price strong { font: 900 2.4rem/1 var(--display); color: var(--bone); letter-spacing: 0; margin-left: .3rem; }
.cb-pack .wp-block-buttons { margin-top: auto !important; }
.cb-pack .wp-block-button, .cb-pack .wp-block-button__link { width: 100%; text-align: center; }
.cb-notes { display: grid; gap: .5rem; }
.cb-notes-row { display: flex; flex-wrap: wrap; gap: .6rem 2.2rem; margin-top: 1.8rem !important; }

/* ================= Video ================= */
.cb-video { position: relative; min-height: min(92dvh, 860px); display: grid; align-items: end; overflow: hidden; isolation: isolate; margin: 0; }
.cb-video-bg { position: absolute !important; inset: -12% 0; z-index: -2; margin: 0 !important; }
.cb-video-bg img { width: 100%; height: 100% !important; object-fit: cover; object-position: 50% 40%; filter: grayscale(.65) contrast(1.1) brightness(.72); }
.cb-video::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgb(11 13 10 / .95) 6%, rgb(11 13 10 / .15) 55%, rgb(11 13 10 / .5) 100%); }
.cb-video-row { display: flex !important; align-items: end; justify-content: space-between; gap: 2rem; flex-wrap: wrap; padding-block-end: clamp(3rem, 6vw, 5.5rem); }
.cb-video-title { font-size: clamp(3rem, 7vw, 7.5rem) !important; max-width: 11ch; margin: 0; }
.cb-play .wp-block-button__link { display: inline-flex; align-items: center; gap: 1rem; padding: 1.4rem 1.8rem; font-size: 1.05rem; }
.cb-play .wp-block-button__link::before { content: ""; width: 1.4rem; height: 1.4rem; background: currentColor; -webkit-mask: url("../icons/play.svg") center / contain no-repeat; mask: url("../icons/play.svg") center / contain no-repeat; }
.cb-play.is-pending .wp-block-button__link { background: transparent; color: var(--bone); box-shadow: inset 0 0 0 1px var(--line); cursor: default; }
.cb-play.is-pending .wp-block-button__link::before { background: var(--muted); }
/* The video block lives in the section so it can be edited there; on the site it only shows in the lightbox. */
body:not(.editor-styles-wrapper) .cb-video > .cb-video-media, body:not(.editor-styles-wrapper) .cb-video > .wp-block-embed { display: none; }
.editor-styles-wrapper .cb-video > .cb-video-media, .editor-styles-wrapper .cb-video > .wp-block-embed { position: relative; width: min(520px, 90%); margin: 0 auto 2rem; outline: 2px dashed var(--signal); }
.cb-lightbox { width: min(1200px, 94vw); max-width: none; max-height: 94dvh; padding: 0; border: 0; background: var(--asphalt); color: var(--bone); overflow: visible; }
.cb-lightbox::backdrop { background: rgb(11 13 10 / .92); }
.cb-lightbox figure { margin: 0; }
.cb-lightbox video, .cb-lightbox iframe { display: block; width: 100%; height: auto; max-height: 86dvh; aspect-ratio: 16 / 9; background: #000; border: 0; }
.cb-lightbox .wp-block-embed__wrapper::before { display: none; }
.cb-lightbox-close { position: absolute; right: 0; bottom: calc(100% + .6rem); min-height: 44px; padding: 0 1rem; border: 0; background: var(--signal); color: var(--asphalt); font: 700 .85rem var(--mono); text-transform: uppercase; letter-spacing: .08em; cursor: pointer; }

/* ================= FAQ + panels ================= */
.cb-faq > h2 { margin-bottom: 2.5rem; }
.cb-faq .wp-block-details { border-top: 1px solid var(--line); margin: 0; }
.cb-faq .wp-block-details:last-child { border-bottom: 1px solid var(--line); }
.cb-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.5rem 0; font: 800 1.6rem/1.1 var(--display); text-transform: uppercase; transition: color .2s; }
.cb-faq summary::-webkit-details-marker { display: none; }
.cb-faq summary::after { content: ""; flex: none; width: 1.3rem; height: 1.3rem; background: var(--signal); -webkit-mask: url("../icons/plus.svg") center / contain no-repeat; mask: url("../icons/plus.svg") center / contain no-repeat; transition: transform .35s var(--ease); }
.cb-faq details[open] summary::after { transform: rotate(45deg); }
.cb-faq summary:hover { color: var(--signal); }
.cb-faq details p { color: var(--muted); padding: 0 0 1.6rem; max-width: 62ch; margin: 0; }
.cb-panel, .is-style-cb-panel { position: sticky; top: 130px; display: grid; gap: 1.3rem; background: var(--steel); box-shadow: inset 0 0 0 1px var(--line); clip-path: var(--chamfer); --cut: 24px; padding: clamp(1.75rem, 3vw, 2.75rem); }
.cb-panel > * { margin: 0 !important; }
.cb-panel h3 { font-size: 2.4rem; }
.cb-big-phone a { font: 900 clamp(1.9rem, 7.5vw, 2.6rem)/1 var(--display); color: var(--bone); text-decoration: none; white-space: nowrap; display: inline-flex; align-items: center; gap: .7rem; min-height: 44px; }
.cb-big-phone a::before { content: ""; width: 1.7rem; height: 1.7rem; background: var(--signal); -webkit-mask: url("../icons/phone.svg") center / contain no-repeat; mask: url("../icons/phone.svg") center / contain no-repeat; }
.cb-big-phone a:hover { color: var(--signal); }
.cb-checks { list-style: none; padding: 0; display: grid; gap: .55rem; }
.cb-checks li { display: flex; gap: .6rem; align-items: center; color: #C2C8BB; }
.cb-checks li::before { content: ""; flex: none; width: 1.1rem; height: 1.1rem; background: var(--signal); -webkit-mask: url("../icons/check.svg") center / contain no-repeat; mask: url("../icons/check.svg") center / contain no-repeat; }

/* ================= Comparison table ================= */
.cb-stack { border-top: 1px solid var(--line); }
.cb-stack .cb-wrap > h2 { margin-bottom: 1.2rem; }
.cb-cmp-table { margin: 3rem 0 0 !important; overflow-x: auto; }
.cb-cmp-table table { width: 100%; border-collapse: separate; border-spacing: 0; border: 0; }
.cb-cmp-table.wp-block-table th, .cb-cmp-table.wp-block-table td { padding: 1.35rem 1.5rem; text-align: left; border: 0; border-bottom: 1px solid var(--line); vertical-align: middle; box-sizing: border-box; }
.cb-cmp-table.wp-block-table thead { border: 0; }
.cb-cmp-table.wp-block-table table { border: 0; }
.cb-cmp-table thead th { font: 800 1.5rem/1 var(--display); text-transform: uppercase; color: var(--muted); padding-block: 1.6rem; }
.cb-cmp-table thead th:first-child { color: transparent; }
.cb-cmp-table thead th:nth-child(2) { color: var(--asphalt); background: var(--signal); }
.cb-cmp-table tbody th { font-weight: 600; font-size: 1.05rem; width: 34%; }
.cb-cmp-table td { color: var(--muted); }
.cb-cmp-table td:nth-child(2) { background: rgb(108 255 52 / .06); color: var(--bone); box-shadow: inset 1px 0 0 rgb(108 255 52 / .35), inset -1px 0 0 rgb(108 255 52 / .35); }
.cb-cmp-table .m-yes { color: var(--signal); font-weight: 700; margin-right: .35rem; }
.cb-cmp-table .m-no { color: #FF8A6B; font-weight: 700; margin-right: .35rem; }
.cb-cmp-table .m-part { color: #E8C547; font-weight: 700; margin-right: .35rem; }

/* ================= Closer ================= */
.cb-closer { padding-block: clamp(5rem, 9vw, 8rem) clamp(4rem, 7vw, 6rem); border-top: 1px solid var(--line); overflow: hidden; }
.cb-closer-title { font-size: clamp(4.5rem, 15.5vw, 17rem) !important; line-height: .82 !important; white-space: nowrap; margin: 0; }
.cb-closer-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2rem; margin-top: 3rem !important; padding-top: 2rem; border-top: 1px solid var(--line); }
.cb-closer-row > * { margin: 0 !important; }

/* ================= Inner pages ================= */
.cb-page-head { position: relative; padding-block: clamp(3.5rem, 7vw, 6rem) clamp(2.5rem, 5vw, 4rem); border-bottom: 1px solid var(--line); overflow: hidden; isolation: isolate; }
.cb-page-head::after { content: ""; position: absolute; right: -4%; top: 0; bottom: 0; width: 46%; z-index: -1; background: repeating-linear-gradient(-45deg, rgb(108 255 52 / .05) 0 2px, transparent 2px 22px); -webkit-mask-image: linear-gradient(90deg, transparent, #000 60%); mask-image: linear-gradient(90deg, transparent, #000 60%); }
.cb-page-head h1, .cb-page-head .wp-block-post-title { font-size: clamp(3.25rem, 7.5vw, 7.5rem); line-height: .86; margin: 0; }
.cb-page-head .cb-lede { margin-top: 1.4rem; }
.cb-page-head .wp-block-buttons { margin-top: 1.6rem; }
.cb-404 { min-height: 60vh; display: grid; align-items: center; border-bottom: 0; }
.cb-prose { padding-block: clamp(3rem, 6vw, 5rem) clamp(5rem, 9vw, 8rem); }
.cb-prose h2 { font-size: clamp(1.8rem, 2.6vw, 2.4rem); margin-top: 2.4rem; }
.cb-prose p, .cb-prose li { color: #C2C8BB; }
.cb-todo { padding: 1rem 1.2rem; background: rgb(232 197 71 / .07); box-shadow: inset 3px 0 0 #E8C547; color: #E9D9A0 !important; font-size: .95rem; }
.cb-todo strong { color: #E8C547; }

/* Contact page */
.cb-ways { display: grid; gap: 14px; position: sticky; top: 130px; }
.cb-ways > * { margin: 0; }
.cb-way { display: grid; grid-template-columns: 56px 1fr; column-gap: 1.1rem; padding: 1.6rem; background: var(--steel); box-shadow: inset 0 0 0 1px var(--line); clip-path: var(--chamfer); --cut: 16px; }
.cb-way::before { grid-row: span 3; width: 56px; height: 56px; -webkit-mask-size: 1.6rem; mask-size: 1.6rem; background: var(--signal); }
.cb-way > * { grid-column: 2; margin: 0; }
.cb-way .cb-big-phone a::before { display: none; }
.cb-way-call { background: linear-gradient(150deg, #1F2C17 0%, var(--steel) 70%); box-shadow: inset 0 0 0 1px rgb(108 255 52 / .3); }
.cb-big-mail a { font: 900 clamp(1.4rem, 2vw, 1.9rem)/1.2 var(--display); color: var(--bone); text-decoration: none; }
.cb-ways h2, .cb-ways h3 { margin-top: 1.4rem; font-size: 1.5rem; font-weight: 800; line-height: 1; }
.cb-form-panel { position: static; }
.cb-form-panel h2 { font-size: clamp(2.4rem, 3.6vw, 3.4rem); }

/* Forms (Contact Form 7 and WooCommerce) */
.wpcf7-form { display: grid; gap: 1.1rem; }
.wpcf7-form p { margin: 0; }
.wpcf7-form label, .wc-block-components-text-input label { font-weight: 600; font-size: .9375rem; display: grid; gap: .45rem; }
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="search"], textarea, select {
	font: 400 1rem var(--body); color: var(--bone); background: var(--asphalt); border: 1px solid var(--line); border-radius: 0; padding: .9rem 1rem; width: 100%; box-sizing: border-box; }
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--signal); box-shadow: 0 0 0 1px var(--signal); }
.wpcf7-submit, .wpcf7 input[type="submit"] { justify-self: start; width: auto; background: var(--signal); color: var(--asphalt); border: 0; font: 700 1rem/1 var(--body); letter-spacing: .09em; text-transform: uppercase; padding: 1.1rem 1.6rem; cursor: pointer; clip-path: var(--chamfer); --cut: 14px; }
.wpcf7-not-valid-tip { color: #FF8A6B; font-size: .875rem; }
.wpcf7 form .wpcf7-response-output { margin: 0; border-color: var(--signal); color: var(--bone); }
.wpcf7-list-item { margin: 0 1rem 0 0; }

/* ================= WooCommerce: single product ================= */
.cb-pdp { padding-block: 2.2rem clamp(4rem, 8vw, 7rem); }
.cb-pdp .woocommerce-breadcrumb, .cb-pdp .wc-block-breadcrumbs { font-family: var(--mono); font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: 1.6rem; }
.cb-pdp .woocommerce-breadcrumb a { color: var(--muted); text-decoration: none; }
.cb-pdp-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 5.5rem); align-items: start; }
.cb-pdp-gallery { position: sticky; top: 130px; }
.cb-pdp-gallery .woocommerce-product-gallery, .woocommerce .cb-pdp-gallery div.product div.images, .cb-pdp-gallery div.images { margin: 0; width: 100% !important; float: none !important; }
.cb-pdp-gallery .flex-viewport, .cb-pdp-gallery .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper:only-child { clip-path: var(--chamfer); --cut: 28px; background: var(--plate); }
.cb-pdp-gallery .woocommerce-product-gallery__image img { width: 100%; height: auto; display: block; }
/* Until the gallery slider has sized its slides, show only the first photo and reserve the thumbnail row, so nothing below it jumps. */
.cb-pdp-gallery .woocommerce-product-gallery__image:nth-child(n+2):not([style*="width"]) { display: none !important; }
.cb-pdp-gallery .woocommerce-product-gallery:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(2)) { padding-bottom: calc((100% - 2rem) / 5 + .8rem); }
.cb-pdp-gallery .woocommerce-product-gallery:not(:has(.flex-control-thumbs)):has(.woocommerce-product-gallery__image:nth-child(6)) { padding-bottom: calc(((100% - 2rem) / 5 + .8rem) * 2); }
.cb-pdp-gallery .woocommerce-product-gallery { container-type: inline-size; }
.cb-pdp-gallery .woocommerce-product-gallery__image:first-child:not([style*="width"]) { max-width: 100cqw; }
.cb-pdp-gallery .flex-control-thumbs img { aspect-ratio: 1; object-fit: cover; width: 100%; height: auto; }
.cb-pdp-gallery .flex-control-thumbs { display: grid !important; grid-template-columns: repeat(5, 1fr); gap: .5rem; margin: .8rem 0 0 !important; padding: 0; }
.cb-pdp-gallery .flex-control-thumbs li { width: auto !important; list-style: none; }
.cb-pdp-gallery .flex-control-thumbs img { opacity: .6; box-shadow: inset 0 0 0 1px var(--line); cursor: pointer; transition: opacity .3s; }
.cb-pdp-gallery .flex-control-thumbs img.flex-active, .cb-pdp-gallery .flex-control-thumbs img:hover { opacity: 1; outline: 2px solid var(--signal); outline-offset: -2px; }
.cb-pdp-gallery .woocommerce-product-gallery__trigger { background: var(--asphalt); border-radius: 0; }
.cb-pdp-buy { display: grid; gap: 1.4rem; }
.cb-pdp-buy > * { margin: 0 !important; }
.cb-pdp-buy .wp-block-post-title { font-size: clamp(3rem, 5.4vw, 5.75rem); line-height: .86; }
.cb-pdp-price, .cb-pdp-price .amount { font: 900 3rem/1 var(--display) !important; color: var(--bone); }
.cb-pdp-buy .variations { border: 0; margin: 0 0 1rem; width: 100%; }
.cb-pdp-buy .variations th, .cb-pdp-buy .variations td { display: block; padding: 0; text-align: left; border: 0; }
.cb-pdp-buy .variations th label { font: 500 .8125rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.cb-pdp-buy .variations, .cb-pdp-buy .variations tbody { display: block; }
.cb-pdp-buy .variations tr { display: block; margin-bottom: 1.2rem; }
.cb-pills { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: .5rem; margin-top: .6rem; }
.cb-pills button { font: 800 1.35rem/1 var(--display); text-transform: uppercase; color: var(--bone); background: var(--steel); border: 0; box-shadow: inset 0 0 0 1px var(--line); padding: 1.05rem 1rem; cursor: pointer; text-align: left; transition: box-shadow .2s, background-color .2s; }
.cb-pills button:hover { background: var(--plate); }
.cb-pills button:disabled { color: var(--muted); background: transparent; cursor: not-allowed; }
.cb-pills button small { display: block; margin-top: .4rem; font: 500 .7rem var(--mono); letter-spacing: .08em; }
.cb-pills button[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--signal); background: linear-gradient(90deg, rgb(108 255 52 / .07), transparent 60%), var(--plate); }
.cb-pdp-buy .variations td { position: relative; }
.cb-pdp-buy .variations select.cb-hidden { position: absolute; left: 0; top: 0; opacity: 0; pointer-events: none; width: 1px !important; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.cb-pdp-buy .reset_variations { color: var(--muted); font-size: .85rem; }
.cb-pdp-buy .woocommerce-variation-price .price, .cb-pdp-buy .woocommerce-variation-price .amount { font: 900 2.4rem/1 var(--display); color: var(--bone); }
.cb-pdp-buy .single_variation_wrap { display: grid; gap: 1rem; }
.cb-pdp-buy .woocommerce-variation-add-to-cart, .cb-pdp-buy form.cart:not(.variations_form) { display: grid; grid-template-columns: auto 1fr; gap: .6rem; }
.cb-pdp-buy .quantity input.qty { width: 90px; text-align: center; font: 800 1.35rem var(--display); height: 100%; }
.single_add_to_cart_button, .woocommerce .button, .wc-block-components-button:not(.is-link) {
	background: var(--signal) !important; color: var(--asphalt) !important; border: 0 !important; border-radius: 0 !important; font: 700 1rem/1 var(--body) !important; letter-spacing: .09em; text-transform: uppercase; padding: 1.15rem 1.6rem !important; clip-path: var(--chamfer); --cut: 14px; cursor: pointer; }
.single_add_to_cart_button:hover, .woocommerce .button:hover { background: var(--signal-hi) !important; }
.single_add_to_cart_button.disabled { opacity: .45; }
.cb-pdp-details { margin-top: clamp(3rem, 6vw, 5rem) !important; }
.woocommerce-tabs .tabs, .wc-tabs { display: flex; gap: 1.5rem; list-style: none; padding: 0; margin: 0 0 1.5rem; border-bottom: 1px solid var(--line); }
.woocommerce-tabs .tabs li a { display: inline-block; padding: 1rem 0; color: var(--muted); text-decoration: none; font: 800 1.3rem var(--display); text-transform: uppercase; }
.woocommerce-tabs .tabs li.active a { color: var(--bone); box-shadow: inset 0 -2px 0 var(--signal); }
.woocommerce div.product .woocommerce-tabs ul.tabs li, .woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: none; border: 0; border-radius: 0; padding: 0; margin: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after, .woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--muted); padding: 1rem 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--bone); }
.woocommerce-tabs .panel { color: #C2C8BB; max-width: 72ch; }
.woocommerce-tabs .panel h2 { display: none; }
.woocommerce-Tabs-panel table.shop_attributes { border: 0; }
.woocommerce-Tabs-panel table.shop_attributes th, .woocommerce-Tabs-panel table.shop_attributes td { border: 0; border-bottom: 1px solid var(--line); padding: .8rem 0; background: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner { background: var(--steel) !important; color: var(--bone) !important; border: 0 !important; box-shadow: inset 3px 0 0 var(--signal); border-radius: 0 !important; }
.woocommerce-message a, .wc-block-components-notice-banner a { color: var(--signal); }

/* ================= WooCommerce: cart + checkout blocks ================= */
.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout { max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.wc-block-components-sidebar-layout .wc-block-components-main, .wc-block-components-sidebar { color: var(--bone); }
.wc-block-cart-items, .wc-block-components-totals-wrapper, .wc-block-components-panel { border-color: var(--line) !important; }
.wc-block-components-product-name { color: var(--bone) !important; font: 800 1.3rem/1.1 var(--display); text-transform: uppercase; text-decoration: none; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value, .wc-block-components-totals-footer-item .wc-block-components-totals-item__label { font: 900 1.8rem/1 var(--display); }
.wc-block-components-quantity-selector { border-color: var(--line) !important; border-radius: 0 !important; }
.wc-block-components-quantity-selector input { background: var(--asphalt) !important; color: var(--bone) !important; }
.wc-block-components-text-input input, .wc-block-components-combobox input, .wc-blocks-components-select select { background: var(--asphalt) !important; color: var(--bone) !important; border-color: var(--line) !important; border-radius: 0 !important; }
.wc-block-components-text-input label, .wc-blocks-components-select label { color: var(--muted) !important; }
.wc-block-components-checkout-step__title, .wp-block-woocommerce-cart-order-summary-heading-block, .wc-block-cart__totals-title { font: 900 1.8rem/1 var(--display) !important; text-transform: uppercase; }
.wc-block-components-radio-control__option, .wc-block-components-radio-control-accordion-option { border-color: var(--line) !important; border-radius: 0 !important; }
.wc-block-components-sidebar .wc-block-components-panel, .wp-block-woocommerce-checkout-order-summary-block { background: var(--steel); }
.wc-block-components-product-metadata, .wc-block-components-formatted-money-amount { color: inherit; }

/* ================= Responsive ================= */
@media (max-width: 1200px) {
	.cb-specs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cb-spec:nth-child(3) { border-left: 0; padding-left: 0; }
	.cb-spec:nth-child(n+3) { border-top: 1px solid var(--line); }
	.cb-nav-phone { display: none; }
	.cb-foot { grid-template-columns: 1fr 1fr; }
	.cb-foot-brand { grid-column: 1 / -1; }
}
@media (max-width: 960px) {
	.cb-split-5-7, .cb-split-7-5, .cb-cmp-top, .cb-who-grid, .cb-pdp-grid { grid-template-columns: 1fr; }
	.cb-problem-head, .cb-panel, .cb-ways, .cb-pdp-gallery { position: static; }
	.cb-compare-stage { min-height: 0; padding-block: 5rem; }
	.duel { grid-template-columns: 1fr; }
	.mid { grid-auto-flow: column; justify-content: center; align-items: center; }
	.vticks { flex-direction: row; width: auto; } .vticks i { width: 14px; height: 10px; }
	.side svg { max-height: none; }
	.cb-bento { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
	.cb-cell-a { grid-column: 1 / 3; grid-row: auto; min-height: 460px; }
	.cb-cell-b { grid-column: 1 / 3; grid-row: auto; min-height: 260px; }
	.cb-cell-c, .cb-cell-d { grid-column: auto; grid-row: auto; }
	.cb-packs { grid-template-columns: 1fr; }
	/* Trades: auto-scrolling carousel of tall cards */
	.cb-who-stage { display: none; }
	.cb-trades { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border: 0; margin-inline: calc(var(--gutter) * -1) !important; padding-inline: var(--gutter); scroll-padding: 0 var(--gutter); }
	.cb-trades::-webkit-scrollbar { display: none; }
	.cb-trade { flex: 0 0 82%; aspect-ratio: 3 / 4; max-height: 78dvh; scroll-snap-align: center; display: flex; flex-direction: column; justify-content: flex-end; gap: .3rem; padding: 1.2rem; border: 0; clip-path: var(--chamfer); --cut: 20px; background: var(--plate); }
	.cb-trade::after { transform: none; background: linear-gradient(0deg, rgb(11 13 10 / .95) 0%, rgb(11 13 10 / .55) 30%, rgb(11 13 10 / 0) 58%); }
	.cb-trade.on::after { transform: none; }
	.cb-trade::before { position: relative; width: 1.7rem; height: 1.7rem; background: var(--signal) !important; }
	.cb-trade .cb-trade-img { display: block; position: absolute !important; inset: 0; z-index: -2; margin: 0 !important; }
	.cb-trade .cb-trade-img img { width: 100%; height: 100% !important; object-fit: cover; }
	.cb-trade h3, .cb-trade.on h3 { color: var(--bone) !important; transform: none; font-size: clamp(2rem, 9vw, 2.8rem) !important; }
	.cb-trade .cb-trade-where { display: none; }
	.cb-trade .cb-trade-line { display: block; color: #C9CEC2; font-size: .98rem; margin: 0; }
	.cb-dots { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-top: 1rem; }
	.cb-dots button { height: 44px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; align-items: center; }
	.cb-dots i { display: block; height: 4px; background: var(--line); position: relative; overflow: hidden; }
	.cb-dots i::after { content: ""; position: absolute; inset: 0; background: var(--signal); transform: scaleX(0); transform-origin: left; }
	.cb-dots button.done i::after, .cb-dots button.on i::after { transform: scaleX(1); }
	.cb-trades.playing ~ .cb-dots button.on i::after { transform: scaleX(0); animation: cb-fill 3500ms linear forwards; }
}
@keyframes cb-fill { to { transform: scaleX(1); } }
@media (min-width: 961px) { .cb-dots { display: none; } }
@media (max-width: 760px) {
	.cb-cmp-table table, .cb-cmp-table tbody, .cb-cmp-table tr, .cb-cmp-table th, .cb-cmp-table td { display: block; width: 100% !important; }
	.cb-cmp-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.cb-cmp-table tr { margin-bottom: 14px; background: var(--steel); box-shadow: inset 0 0 0 1px var(--line); clip-path: var(--chamfer); --cut: 14px; }
	.cb-cmp-table tbody th { font: 800 1.4rem/1.1 var(--display); text-transform: uppercase; padding: 1.1rem 1.2rem .6rem; border: 0; }
	.cb-cmp-table.wp-block-table td { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 1.2rem; border: 0; border-top: 1px solid var(--line); box-shadow: none !important; }
	.cb-cmp-table.wp-block-table tbody th { border: 0; }
	.cb-cmp-table td::before { content: attr(data-label); font: 500 .75rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
	.cb-cmp-table td:nth-child(2)::before { color: var(--signal); }
}
@media (max-width: 640px) {
	.cb-ubar .cb-long, .cb-ubar-right { display: none; }
	.cb-nav-tools .cb-nav-cta { display: none !important; }
	.cb-nav-row { gap: .8rem; min-height: 70px; }
	.cb-nav-row .wp-block-site-logo img { max-height: 50px; }
	.cb-hero-bg { left: 0; }
	.cb-hero::before { background: linear-gradient(0deg, var(--asphalt) 8%, rgb(11 13 10 / .75) 55%, rgb(11 13 10 / .35) 100%); }
	.cb-hero > .cb-wrap { padding-block: 7rem 3.5rem; }
	.cb-specs-grid { grid-template-columns: 1fr; }
	.cb-spec, .cb-spec:nth-child(3) { border-left: 0; padding: 1.5rem 0; }
	.cb-spec + .cb-spec { border-top: 1px solid var(--line); }
	.cb-prob { grid-template-columns: 56px minmax(0, 1fr); }
	.cb-prob::before { width: 56px; height: 56px; }
	.cb-prob-img { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
	.cb-bento { grid-template-columns: 1fr; }
	.cb-cell-a, .cb-cell-b, .cb-cell-c, .cb-cell-d { grid-column: auto; }
	.hotspot, .cb-hs-hint { display: none; }
	.cb-closer-title { font-size: 19vw !important; }
	.cb-foot { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.cb-marquee-track { animation: none; }
	.cb-trade::after, .cb-trade h3, .cb-who-frame img { transition: none; }
	.cb-who-frame.swap .cb-who-sweep { animation: none; }
}

/* Editor: show everything statically (no JS runs there) */
.editor-styles-wrapper .cb-trade .cb-trade-img, .editor-styles-wrapper .cb-trade .cb-trade-line { display: block; position: static !important; max-width: 160px; }
.editor-styles-wrapper .cb-header { position: static; }
.cb-nav.is-scrolled { background: rgb(11 13 10 / .96); }
.cb-pdp-gallery .wp-block-woocommerce-product-image-gallery { max-width: none !important; width: 100%; }
/* Cart and checkout inside the theme wrapper */
.cb-wc { padding-block: clamp(2.5rem, 5vw, 4rem) clamp(5rem, 9vw, 8rem); }
.cb-wc .wp-block-woocommerce-cart, .cb-wc .wp-block-woocommerce-checkout { max-width: none; padding-inline: 0; margin: 0; }
.cb-wc .alignwide, .cb-wc .alignfull { max-width: none; margin-inline: 0; width: auto; }
.cb-wc .wc-block-components-sidebar-layout { margin: 0; }
.cb-wc .wc-block-components-sidebar { padding: clamp(1.25rem, 2vw, 2rem); background: var(--steel); box-shadow: inset 0 0 0 1px var(--line); clip-path: var(--chamfer); --cut: 20px; }
.cb-wc .wc-block-cart-items th, .cb-wc .wc-block-cart-items__header { font-family: var(--mono); font-weight: 500; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.cb-wc .wc-block-components-radio-control__option--checked-option-highlighted, .cb-wc .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option--checked-option-highlighted { box-shadow: inset 0 0 0 2px var(--signal) !important; }
.cb-wc .wc-block-components-checkout-place-order-button { width: 100%; }