:root {
            --boem-bg:#e6e4e3; --boem-paper:#f1efec; --boem-paper-2:#f7f6f3; --boem-ink:#17181a;
            --boem-soft:#6b6863; --boem-faint:#a5a29c; --boem-line:#d3d0ca; --boem-line-2:#dddad4;
            --boem-teal:#0fa6ab; --boem-teal-ink:#0b8288; --boem-teal-deep:#0a6f74; --boem-teal-tint:rgba(15,166,171,.10);
            --boem-anton:'Big Shoulders Display','Archivo',system-ui,sans-serif;
            --boem-mono:'Space Mono',ui-monospace,monospace;
            --boem-sans:'Archivo',system-ui,sans-serif;
            --boem-edge:clamp(20px,4vw,72px); --boem-maxw:1280px;
            /* corner-tick helper for product plates */
            --boem-tick: linear-gradient(var(--boem-teal),var(--boem-teal));
        }

        html { scroll-behavior: smooth; }
        body {
            color: var(--boem-ink); font-family: var(--boem-sans);
            background:
                linear-gradient(transparent 0 calc(100% - 1px), rgba(23,24,26,.028) 100%) 0 0/40px 40px,
                linear-gradient(90deg, transparent 0 calc(100% - 1px), rgba(23,24,26,.028) 100%) 0 0/40px 40px,
                var(--boem-bg);
        }
        ::selection { background: var(--boem-teal); color: #fff; }
        .wp-site-blocks { background: transparent; }

        /* ---------- header ---------- */
        header.wp-block-template-part {
            /* backdrop-filter MUSI siedziec na pseudo-elemencie, nie na headerze:
               filter/backdrop-filter na przodku robi containing block dla position:fixed,
               przez co pelnoekranowe menu mobilne renderowalo sie UWIEZIONE w pasku headera */
            position: sticky; top: 0; z-index: 50;
            border-bottom: 1px solid var(--boem-line);
            background: rgba(230,228,227,.82);
        }
        header.wp-block-template-part::before {
            content: ""; position: absolute; inset: 0; z-index: -1;
            backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
        }
        /* konto + mini-koszyk ukryte do startu sprzedazy (my-account/cart sa private —
           ikona konta prowadzila gosci na 404). Odkryc przy republishu stron sklepowych. */
        header .wp-block-woocommerce-customer-account, header .wc-block-mini-cart { display: none !important; }
        .wp-block-site-title, .wp-block-site-title a { font-size: 0; line-height: 1; text-decoration: none; }
        .wp-block-site-title a {
            display: block; width: clamp(200px, 23vw, 340px); height: clamp(22px, 2.2vw, 30px);
            background-image: var(--boem-logo);
            background-repeat: no-repeat; background-position: left center; background-size: contain;
        }
        .wp-block-navigation a {
            color: var(--boem-ink); font-family: var(--boem-mono);
            font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
        }
        .wp-block-navigation a:hover, .wp-block-navigation .current-menu-item > a { color: var(--boem-teal-ink); }
        /* enlarge tap area of the horizontal header nav to >=44px without shifting layout
           (scoped to the CLOSED responsive container so stacked overlay links don't overlap) */
        .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation-item__content {
            padding: 14px 6px; margin: -14px -6px;
        }
        .wp-block-navigation__responsive-container-open { padding: 10px; margin: -10px; }

        body.home .wp-block-post-title,
        body.front-page .wp-block-post-title,
        body.page-id-16 .wp-block-post-title { display: none; }

        /* ---------- buttons ---------- */
        .wp-block-button__link, .button, button { min-height: 48px; }
        .wp-block-button__link {
            border: 1px solid var(--boem-teal); border-radius: 0;
            background: var(--boem-teal); color: #04211f;
            font-family: var(--boem-mono); font-size: 12px; font-weight: 700; letter-spacing: .18em;
            padding: 15px 26px; text-transform: uppercase;
            transition: background 180ms ease, color 180ms ease, transform 180ms ease, border-color 180ms ease;
        }
        .wp-block-button__link:hover { background: var(--boem-teal-ink); border-color: var(--boem-teal-ink); color: #fff; transform: translateY(-1px); }

        /* ---------- page width ---------- */
        .boem-home { overflow: hidden; }
        body.page-id-16 main.wp-block-group,
        body.page-id-16 .wp-block-post-content,
        body.page-id-16 .entry-content,
        body.page-id-16 .is-layout-constrained > .boem-home,
        body.page-id-16 .boem-home {
            width: 100%; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important;
        }
        body.page-id-16 .wp-block-post-content { padding-left: 0; padding-right: 0; }
        body.page-id-16 main.wp-block-group { margin-top: 0 !important; padding-top: 0 !important; }
        body.page-id-16 .wp-block-post-content,
        body.page-id-16 .entry-content { margin-top: 0 !important; padding-top: 0 !important; }

        /* section wrappers: edge padding must sit INSIDE min(maxw,100%) — the default
           content-box made these boxes 2*edge wider than the page, so they clipped ~52px
           on the right at 1280 (asymmetric gutters, cut spec-list text). Fix applies at
           every viewport; the <=900px media block repeats it harmlessly. */
        .boem-release-strip, .boem-section, .boem-detail, .boem-process, .boem-directions, .boem-custom, .boem-newsletter {
            box-sizing: border-box;
        }

        /* ---------- shared section labels / headings ---------- */
        .boem-section-label {
            /* teal-deep, not teal-ink: 12px mono needs 4.5:1 on the silver bg (ink = 3.6:1) */
            margin: 0; color: var(--boem-teal-deep); font-family: var(--boem-mono);
            font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
        }

        /* ---------- HERO ---------- */
        .boem-campaign {
            position: relative; width: min(var(--boem-maxw), 100%); margin: 0 auto;
            display: grid; grid-template-columns: minmax(340px, .48fr) minmax(440px, .52fr);
            gap: clamp(30px, 4vw, 80px); align-items: center; align-content: center;
            min-height: calc(100vh - 76px);
            background: radial-gradient(58% 52% at 74% 40%, rgba(255,255,255,.55), transparent 68%);
            padding: clamp(56px, 6vw, 84px) var(--boem-edge) clamp(48px, 6vw, 80px);
            border-bottom: 1px solid var(--boem-line);
        }
        .boem-campaign::before {
            content: "01 / SMOOKY BANDIT — COMING SOON";
            position: absolute; top: 24px; left: var(--boem-edge);
            font-family: var(--boem-mono); font-size: 11px; letter-spacing: .22em; color: var(--boem-faint);
        }
        .boem-copy { position: relative; z-index: 3; }
        .boem-kicker {
            display: inline-flex; align-items: center; gap: 10px; margin: 0 0 26px;
            color: var(--boem-ink); font-family: var(--boem-mono);
            font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
        }
        .boem-kicker::before {
            content: ""; width: 0; height: 0;
            border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 11px solid var(--boem-teal);
        }
        .boem-campaign h1 {
            margin: 0; max-width: 640px; font-family: var(--boem-anton);
            font-size: clamp(54px, 7vw, 118px); line-height: .87; font-weight: 400;
            letter-spacing: .008em; text-transform: uppercase;
        }
        .boem-campaign h1 strong { font-weight: 400; color: var(--boem-teal-ink); }
        .boem-lead { max-width: 440px; margin: 28px 0 0; color: var(--boem-soft); font-size: clamp(16px, 1.3vw, 21px); line-height: 1.55; }
        .boem-actions { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; margin-top: 38px; }
        .boem-text-link {
            display: inline-flex; min-height: 48px; align-items: center;
            border-bottom: 1px solid var(--boem-ink); color: var(--boem-ink);
            font-family: var(--boem-mono); font-size: 12px; font-weight: 700; letter-spacing: .14em;
            text-decoration: none; text-transform: uppercase;
        }
        .boem-text-link:hover { color: var(--boem-teal-ink); border-color: var(--boem-teal-ink); }
        .boem-meta {
            display: flex; flex-wrap: wrap; gap: 18px; margin-top: 36px;
            color: var(--boem-soft); font-family: var(--boem-mono);
            font-size: 11px; letter-spacing: .13em; text-transform: uppercase;
        }
        .boem-meta span + span::before { content: "/"; margin-right: 18px; color: var(--boem-faint); }

        /* product plate — floats on paper, hairline frame + teal corner ticks (no filled dark box) */
        .boem-product-stage, .boem-detail__media {
            position: relative; display: flex; align-items: center; justify-content: center;
            padding: clamp(24px, 3.5vw, 52px); overflow: hidden;
            background:
                var(--boem-tick) 14px 14px / 17px 1.5px no-repeat,
                var(--boem-tick) 14px 14px / 1.5px 17px no-repeat,
                var(--boem-tick) top 14px right 14px / 17px 1.5px no-repeat,
                var(--boem-tick) top 14px right 14px / 1.5px 17px no-repeat,
                var(--boem-tick) bottom 14px left 14px / 17px 1.5px no-repeat,
                var(--boem-tick) bottom 14px left 14px / 1.5px 17px no-repeat,
                var(--boem-tick) bottom 14px right 14px / 17px 1.5px no-repeat,
                var(--boem-tick) bottom 14px right 14px / 1.5px 17px no-repeat,
                radial-gradient(ellipse 72% 62% at 50% 42%, #f3f1ee 0, #e8e6e3 55%, #dad8d4 100%);
        }
        .boem-product-stage { align-self: stretch; min-height: 0; padding: clamp(20px, 2.4vw, 34px); }
        .boem-product-stage::before, .boem-detail__media::before {
            content: ""; position: absolute; inset: 16px; border: 1px solid var(--boem-line); pointer-events: none;
        }
        .boem-product-stage::after, .boem-detail__media::after {
            content: "FIG.01 · SB-01"; position: absolute; top: 26px; right: 28px;
            font-family: var(--boem-mono); font-size: 11px; font-weight: 700; letter-spacing: .14em; color: var(--boem-teal-ink);
        }
        .boem-detail__media::after { content: "SB-01 · SLA"; }
        .boem-product-stage img { position: relative; z-index: 1; width: auto; height: auto; max-width: min(540px, 100%); max-height: 100%; filter: drop-shadow(0 40px 46px rgba(23,24,26,.22)) drop-shadow(0 10px 14px rgba(23,24,26,.13)); }
        .boem-callout {
            position: absolute; left: 28px; bottom: 26px; z-index: 2;
            display: flex; gap: 12px; align-items: center; color: var(--boem-soft);
            font-family: var(--boem-mono); font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
        }
        .boem-callout::after { content: ""; width: clamp(70px, 10vw, 150px); border-top: 1px solid var(--boem-line); }

        /* ---------- release strip ---------- */
        .boem-release-strip {
            display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
            width: min(var(--boem-maxw), 100%); margin: 0 auto; border-bottom: 1px solid var(--boem-line);
        }
        .boem-release {
            min-height: 190px; display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: center;
            padding: 30px clamp(20px, 3vw, 44px); border-right: 1px solid var(--boem-line); transition: background 180ms ease;
        }
        .boem-release:hover { background: var(--boem-paper-2); }
        .boem-release:last-child { border-right: 0; }
        .boem-release small { display: block; margin-bottom: 14px; font-family: var(--boem-mono); font-size: 11px; color: var(--boem-soft); letter-spacing: .14em; text-transform: uppercase; }
        .boem-release h2 { margin: 0; font-family: var(--boem-anton); font-size: clamp(19px, 1.7vw, 28px); font-weight: 400; letter-spacing: .03em; text-transform: uppercase; line-height: 1; }
        .boem-release b { display: block; margin-top: 9px; color: var(--boem-teal-deep); font-family: var(--boem-mono); font-size: 13px; font-weight: 400; letter-spacing: .1em; }
        /* 11px mono metadata: --boem-soft is 4.2:1 at this size; darken a touch to pass 4.5:1 */
        .boem-meta, .boem-release small { color: #5f5c57; }
        .boem-release img { width: 100%; max-width: 130px; justify-self: end; opacity: .95; }

        /* ---------- position ---------- */
        .boem-section {
            display: grid; grid-template-columns: minmax(150px, .2fr) 1fr;
            /* row-gap below the full-width CTA matches the section's top padding, so the button
               has equal breathing room above and below */
            row-gap: clamp(70px, 9vw, 128px); column-gap: clamp(24px, 5vw, 84px);
            width: min(var(--boem-maxw), 100%); margin: 0 auto;
            padding: clamp(70px, 9vw, 128px) var(--boem-edge); border-bottom: 1px solid var(--boem-line);
        }
        .boem-section h2 {
            max-width: 980px; margin: 0; font-family: var(--boem-anton);
            font-size: clamp(40px, 5.2vw, 82px); line-height: .99; font-weight: 400; letter-spacing: .01em; text-transform: uppercase;
        }
        /* full-width shop CTA bar above the positioning statement */
        .boem-section-main { display: block; }
        .boem-cta {
            grid-column: 1 / -1; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 16px;
            width: 100%; min-height: clamp(72px, 8vw, 96px); padding: 0 clamp(24px, 3vw, 48px);
            background: var(--boem-teal); color: #04211f; border: 1px solid var(--boem-teal); text-decoration: none;
            font-family: var(--boem-mono); font-size: clamp(15px, 1.6vw, 21px); font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
            transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
        }
        .boem-cta:hover { background: var(--boem-teal-ink); border-color: var(--boem-teal-ink); color: #fff; }
        .boem-cta .boem-cta-arrow { font-size: 1.5em; line-height: 1; transition: transform 200ms ease; }
        .boem-cta:hover .boem-cta-arrow { transform: translateX(8px); }

        /* ---------- detail ---------- */
        .boem-detail {
            display: grid; grid-template-columns: minmax(340px, .5fr) minmax(360px, .5fr); gap: clamp(30px, 6vw, 84px); align-items: center;
            width: min(var(--boem-maxw), 100%); margin: 0 auto;
            padding: clamp(70px, 9vw, 128px) var(--boem-edge); border-bottom: 1px solid var(--boem-line);
        }
        .boem-detail__media { align-self: stretch; min-height: 0; padding: clamp(20px, 2.4vw, 34px); }
        .boem-detail__media img { position: relative; z-index: 1; width: auto; height: auto; max-width: min(480px, 100%); max-height: 100%; filter: drop-shadow(0 30px 36px rgba(23,24,26,.18)) drop-shadow(0 7px 9px rgba(23,24,26,.12)); }
        .boem-detail__copy h2, .boem-process h2, .boem-availability h2 {
            margin: 14px 0 18px; font-family: var(--boem-anton);
            font-size: clamp(34px, 3.9vw, 60px); line-height: .99; font-weight: 400; letter-spacing: .01em; text-transform: uppercase;
        }
        .boem-detail__copy p, .boem-availability p { max-width: 620px; color: var(--boem-soft); font-size: clamp(16px, 1.25vw, 20px); line-height: 1.55; }
        .boem-spec-list {
            display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 30px 0 0; padding: 0; list-style: none;
            background: var(--boem-line); border: 1px solid var(--boem-line);
        }
        .boem-spec-list li { padding: 16px; background: var(--boem-bg); color: var(--boem-ink); font-family: var(--boem-mono); font-size: 12px; letter-spacing: .04em; text-transform: uppercase; }

        /* ---------- process ---------- */
        .boem-process {
            display: grid; grid-template-columns: minmax(300px, .42fr) 1fr; gap: clamp(30px, 6vw, 84px);
            width: min(var(--boem-maxw), 100%); margin: 0 auto;
            padding: clamp(70px, 9vw, 128px) var(--boem-edge); border-bottom: 1px solid var(--boem-line);
        }
        .boem-process h2 { font-size: clamp(32px, 3.6vw, 56px); }
        .boem-process-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--boem-line); border: 1px solid var(--boem-line); }
        .boem-process-grid article { min-height: 250px; padding: clamp(24px, 3vw, 36px); background: var(--boem-paper); transition: background 180ms ease; }
        .boem-process-grid article:hover { background: var(--boem-paper-2); }
        .boem-process-grid span { font-family: var(--boem-anton); color: var(--boem-teal-ink); font-size: 32px; letter-spacing: .05em; }
        .boem-process-grid h3, .boem-direction-grid h3 {
            margin: 18px 0 14px; font-size: clamp(20px, 1.6vw, 27px); line-height: 1.08; font-weight: 700; text-transform: uppercase; letter-spacing: .01em;
        }
        .boem-process-grid p, .boem-direction-grid p { margin: 0; color: var(--boem-soft); line-height: 1.5; font-size: 15px; }

        /* ---------- directions ---------- */
        .boem-directions {
            width: min(var(--boem-maxw), 100%); margin: 0 auto;
            padding: clamp(70px, 9vw, 128px) var(--boem-edge); border-bottom: 1px solid var(--boem-line);
        }
        .boem-direction-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: 32px; background: var(--boem-line); border: 1px solid var(--boem-line); }
        .boem-direction-grid article { min-height: 240px; padding: clamp(24px, 3vw, 34px); background: var(--boem-paper); transition: background 180ms ease; }
        .boem-direction-grid article:hover { background: var(--boem-paper-2); }

        /* ---------- availability (light teal plate) ---------- */
        .boem-availability {
            position: relative; width: min(var(--boem-maxw), calc(100% - 2 * var(--boem-edge))); margin: clamp(40px,5vw,72px) auto;
            padding: clamp(48px, 6vw, 84px) clamp(28px, 4vw, 64px);
            border: 1px solid var(--boem-line);
            background: linear-gradient(120deg, var(--boem-teal-tint), transparent 52%), var(--boem-paper-2);
            overflow: hidden;
        }
        .boem-availability::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--boem-teal); }
        .boem-availability h2 { max-width: 900px; font-size: clamp(36px, 4.6vw, 72px); }
        .boem-availability p { margin-bottom: 8px; }

        /* ---------- footer (branded) ---------- */
        footer.wp-block-template-part {
            border-top: 1px solid var(--boem-line); background: transparent;
        }
        /* hide theme placeholder navs + the "Twenty Twenty-Five / Designed with WordPress" credit */
        footer.wp-block-template-part nav,
        footer.wp-block-template-part p.has-small-font-size,
        footer.wp-block-template-part .wp-block-spacer { display: none; }
        footer.wp-block-template-part .wp-block-site-tagline {
            margin-top: 14px; color: var(--boem-soft);
            font-family: var(--boem-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
        }
        footer.wp-block-template-part .wp-block-site-tagline::after {
            content: "  ·  © 2026 BANDIT OEM"; color: var(--boem-faint);
        }

        /* ---------- entrance / micro-interactions ---------- */
        @keyframes boemRise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
        @keyframes boemFade { from { opacity: 0; } to { opacity: 1; } }
        .boem-copy > * { animation: boemRise .7s cubic-bezier(.2,.75,.25,1) both; }
        .boem-kicker { animation-delay: .05s; }
        .boem-campaign h1 { animation-delay: .14s; }
        .boem-lead { animation-delay: .30s; }
        .boem-actions { animation-delay: .42s; }
        .boem-meta { animation-delay: .54s; }
        .boem-product-stage { animation: boemFade 1s ease .22s both; }
        /* Kierunki cards: teal top-line reveal on hover (no layout shift with the 1px-gap grid) */
        .boem-direction-grid article { position: relative; }
        .boem-direction-grid article::after {
            content: ""; position: absolute; left: 0; top: 0; height: 2px; width: 0;
            background: var(--boem-teal); transition: width 240ms ease;
        }
        .boem-direction-grid article:hover::after { width: 100%; }
        @media (prefers-reduced-motion: reduce) {
            .boem-copy > *, .boem-product-stage { animation: none !important; }
            html { scroll-behavior: auto; }
        }

        /* ---------- mobile ---------- */
        @media (max-width: 900px) {
            /* border-box so section width incl. padding fits its container (symmetric gutters, no right-shift) */
            .boem-campaign, .boem-release-strip, .boem-section, .boem-detail,
            .boem-process, .boem-directions, .boem-availability { box-sizing: border-box; }
            .boem-campaign, .boem-release-strip, .boem-section, .boem-detail,
            .boem-process, .boem-process-grid, .boem-direction-grid, .boem-newsletter { grid-template-columns: 1fr; }
            .boem-newsletter__form { flex-wrap: wrap; }
            .boem-newsletter__form button { width: 100%; }
            .boem-campaign { min-height: auto; padding-top: 52px; }
            .boem-campaign h1 { max-width: 100%; font-size: clamp(46px, 12vw, 66px); line-height: .92; word-break: keep-all; overflow-wrap: normal; }
            .boem-lead { font-size: 17px; }
            .boem-product-stage { min-height: 300px; margin-top: 8px; }
            .boem-release { grid-template-columns: 1fr auto; border-right: 0; border-bottom: 1px solid var(--boem-line); }
            .boem-release img { justify-self: start; max-width: 120px; }
            .boem-spec-list { grid-template-columns: 1fr; }
            /* przyciski na mobile: wymuszony flex, inaczej dlugi tekst zawija sie jako
               fragmenty inline i "rozrywa" tlo przycisku na dwa prostokaty */
            .boem-actions .wp-block-button, .boem-actions .wp-block-button__link, .boem-text-link,
            .boem-buybox__cta .wp-block-button__link {
                display: flex; width: 100%; justify-content: center; text-align: center;
                box-sizing: border-box; white-space: normal;
            }
            .boem-actions { flex-direction: column; align-items: stretch; }
        }

/* ---------- scroll reveal (progressive; only when JS+IO present) ---------- */
@media (prefers-reduced-motion: no-preference) {
    .boem-js .boem-release,
    .boem-js .boem-section h2,
    .boem-js .boem-cta,
    .boem-js .boem-detail__media,
    .boem-js .boem-detail__copy,
    .boem-js .boem-process > div,
    .boem-js .boem-process-grid article,
    .boem-js .boem-directions > .boem-section-label,
    .boem-js .boem-direction-grid article,
    .boem-js .boem-custom h2,
    .boem-js .boem-newsletter,
    .boem-js .boem-availability {
        opacity: 0;
        transform: translateY(22px);
        transition: opacity .7s cubic-bezier(.2,.75,.25,1), transform .7s cubic-bezier(.2,.75,.25,1);
    }
    .boem-js .boem-reveal-in {
        opacity: 1 !important;
        transform: none !important;
    }
    .boem-js .boem-process-grid article:nth-child(2) { transition-delay: .09s; }
    .boem-js .boem-process-grid article:nth-child(3) { transition-delay: .18s; }
    .boem-js .boem-direction-grid article:nth-child(2) { transition-delay: .06s; }
    .boem-js .boem-direction-grid article:nth-child(3) { transition-delay: .12s; }
    .boem-js .boem-direction-grid article:nth-child(4) { transition-delay: .18s; }
    .boem-js .boem-release:nth-child(2) { transition-delay: .08s; }
    .boem-js .boem-release:nth-child(3) { transition-delay: .16s; }
    .boem-js .boem-detail__copy { transition-delay: .08s; }
}

/* ---------- first-impression polish: film grain + gentle product float ---------- */
body::after {
    content: "";
    position: fixed; inset: 0; z-index: 100; pointer-events: none;
    opacity: .05; mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@media (prefers-reduced-motion: no-preference) {
    @keyframes boemFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
    .boem-product-stage img { animation: boemFloat 7s ease-in-out 1.2s infinite; }
}

/* ---------- individual / custom projects ---------- */
.boem-custom {
    display: grid; grid-template-columns: minmax(150px, .2fr) 1fr; gap: clamp(24px, 5vw, 84px);
    width: min(var(--boem-maxw), 100%); margin: 0 auto;
    padding: clamp(70px, 9vw, 128px) var(--boem-edge); border-bottom: 1px solid var(--boem-line);
    background: linear-gradient(120deg, var(--boem-teal-tint), transparent 46%);
}
.boem-custom h2 {
    margin: 0; max-width: 900px; font-family: var(--boem-anton);
    font-size: clamp(34px, 4.4vw, 68px); line-height: 1.0; font-weight: 400;
    letter-spacing: .01em; text-transform: uppercase;
}
.boem-custom p { max-width: 620px; margin: 20px 0 30px; color: var(--boem-soft); font-size: clamp(16px, 1.25vw, 20px); line-height: 1.55; }
.boem-custom .boem-actions { margin-top: 0; }

/* ---------- hero scan sweep (first impression) ---------- */
.boem-scan {
    position: absolute; left: 0; right: 0; top: 0; height: 42%; z-index: 2; opacity: 0; pointer-events: none;
    background: linear-gradient(to bottom, transparent, rgba(15,166,171,.20) 50%, transparent);
}
@media (prefers-reduced-motion: no-preference) {
    @keyframes boemScan { 0% { transform: translateY(-70%); opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { transform: translateY(300%); opacity: 0; } }
    .boem-scan { animation: boemScan 2.6s cubic-bezier(.4, 0, .4, 1) 1.1s 1 both; }
}

/* ---------- Big Shoulders display weight + justified hero headline ---------- */
.boem-campaign h1, .boem-campaign h1 strong,
.boem-release h2, .boem-section h2, .boem-detail__copy h2,
.boem-process h2, .boem-availability h2, .boem-custom h2, .boem-newsletter h2,
.boem-process-grid span { font-weight: 800; }
.boem-campaign h1 .boem-fl { display: block; white-space: nowrap; line-height: .9; }

/* ---------- risk-reversal + scenario microcopy ---------- */
/* p.* so they out-cascade `.boem-detail__copy p` / `.boem-availability p` (0-1-1 tie -> source order) */
p.boem-risk {
    margin: 12px 0 0; font-family: var(--boem-mono); font-size: 11px; font-weight: 700;
    letter-spacing: .12em; text-transform: uppercase; color: #5f5c57;
}
p.boem-scenario {
    margin: 18px 0 0; font-family: var(--boem-mono); font-size: 12px; font-weight: 700;
    letter-spacing: .1em; text-transform: uppercase; color: var(--boem-teal-deep);
}
p.boem-shipline {
    margin: 6px 0 0; font-family: var(--boem-mono); font-size: 11px; font-weight: 400;
    letter-spacing: .1em; text-transform: uppercase; color: var(--boem-soft);
}

p.boem-founding {
    margin: 8px 0 0; font-family: var(--boem-mono); font-size: 11px; font-weight: 700;
    letter-spacing: .12em; text-transform: uppercase; color: var(--boem-teal-deep);
}

/* ---------- shop archive (blockified product collection) ---------- */
.wp-block-query-title, .woocommerce-products-header__title {
    font-family: var(--boem-anton); font-weight: 800; text-transform: uppercase;
    font-size: clamp(38px, 5vw, 72px); line-height: .95; letter-spacing: .01em;
}
/* count + sorting are noise with a one-product catalog; unhide when the catalog grows */
.woocommerce-result-count, .woocommerce-ordering, .wc-block-catalog-sorting { display: none !important; }
li.wc-block-product {
    background: var(--boem-paper); border: 1px solid var(--boem-line);
    padding: clamp(18px, 2vw, 28px); transition: background 180ms ease;
}
li.wc-block-product:hover { background: var(--boem-paper-2); }
li.wc-block-product img { width: 100%; height: auto; }
li.wc-block-product h3, li.wc-block-product .wp-block-post-title {
    margin: 14px 0 6px; font-family: var(--boem-anton); font-weight: 800;
    font-size: clamp(19px, 1.7vw, 26px); text-transform: uppercase; line-height: 1.05; letter-spacing: .02em;
}
li.wc-block-product h3 a, li.wc-block-product .wp-block-post-title a { text-decoration: none; color: var(--boem-ink); }

/* ---------- footer nav (sections) ---------- */
.boem-footer-nav {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px;
    margin-top: 34px; padding-top: 26px; border-top: 1px solid var(--boem-line);
    max-width: 900px;
}
.boem-footer-nav h4 {
    margin: 0 0 12px; font-family: var(--boem-mono); font-size: 11px; font-weight: 700;
    letter-spacing: .18em; text-transform: uppercase; color: var(--boem-teal-deep);
}
.boem-footer-nav a {
    display: block; margin: 0 0 9px; text-decoration: none;
    font-family: var(--boem-sans); font-size: 14px; color: var(--boem-soft);
}
.boem-footer-nav a:hover { color: var(--boem-ink); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 700px) {
    .boem-footer-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- price line (detail section) ---------- */
.boem-price { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; margin: 28px 0 0; }
.boem-price strong { font-family: var(--boem-anton); font-weight: 800; font-size: clamp(30px, 2.6vw, 42px); letter-spacing: .02em; line-height: 1; }
.boem-price span { font-family: var(--boem-mono); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #5f5c57; }

/* ---------- clickable direction cards (stretched link) ---------- */
.boem-direction-cta {
    display: inline-block; margin-top: 18px;
    font-family: var(--boem-mono); font-size: 12px; font-weight: 700; letter-spacing: .14em;
    text-transform: uppercase; color: var(--boem-teal-deep); text-decoration: none;
}
.boem-direction-cta::before { content: ""; position: absolute; inset: 0; }
.boem-direction-grid article:hover .boem-direction-cta { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- product page (classic Woo template) ---------- */
/* gallery thumbnails: equal 3-col grid flush with the main image edges
   (Woo default floats 25%-wide li's, so 3 thumbs never reach the right edge) */
.woocommerce-product-gallery ol.flex-control-thumbs {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
    margin: 10px 0 0; padding: 0; list-style: none;
}
.woocommerce-product-gallery ol.flex-control-thumbs li {
    width: auto !important; margin: 0 !important; float: none !important;
}
.woocommerce-product-gallery ol.flex-control-thumbs li img {
    display: block; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1 / 1;
}
.boem-buybox { margin: 26px 0 10px; padding-top: 20px; border-top: 1px solid var(--boem-line); }
.boem-buybox .boem-price { margin: 0 0 18px; }
.boem-buybox__cta { margin: 0 0 10px; }
.boem-spec-table { width: 100%; border-collapse: collapse; margin: 10px 0 0; }
.boem-spec-table th, .boem-spec-table td { padding: 12px 14px; border: 1px solid var(--boem-line); font-size: 14px; text-align: left; }
.boem-spec-table th { font-family: var(--boem-mono); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; background: var(--boem-paper); width: 220px; }
.boem-faq dt { margin: 18px 0 6px; font-weight: 700; }
.boem-faq dd { margin: 0; color: var(--boem-soft); }

/* ---------- newsletter ---------- */
.boem-newsletter {
    display: grid; grid-template-columns: minmax(150px, .2fr) 1fr;
    column-gap: clamp(24px, 5vw, 84px); row-gap: 26px;
    width: min(var(--boem-maxw), 100%); margin: 0 auto;
    padding: clamp(56px, 7vw, 96px) var(--boem-edge); border-bottom: 1px solid var(--boem-line);
}
.boem-newsletter h2 {
    margin: 0 0 22px; font-family: var(--boem-anton);
    font-size: clamp(26px, 2.8vw, 44px); line-height: 1; letter-spacing: .01em; text-transform: uppercase;
}
.boem-newsletter__form { display: flex; gap: 10px; max-width: 560px; }
.boem-newsletter__form input[type="email"] {
    flex: 1; min-width: 0; min-height: 48px; padding: 10px 14px;
    border: 1px solid var(--boem-line); border-radius: 0; background: var(--boem-paper);
    font-family: var(--boem-mono); font-size: 13px; color: var(--boem-ink);
}
.boem-newsletter__form input[type="email"]:focus-visible { outline: 2px solid var(--boem-teal); outline-offset: 1px; }
.boem-newsletter__form button {
    min-height: 48px; padding: 0 28px; cursor: pointer;
    border: 1px solid var(--boem-teal); border-radius: 0; background: var(--boem-teal); color: #04211f;
    font-family: var(--boem-mono); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
    transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
}
.boem-newsletter__form button:hover { background: var(--boem-teal-ink); border-color: var(--boem-teal-ink); color: #fff; }
.boem-newsletter__note { margin: 14px 0 0; font-family: var(--boem-mono); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #5f5c57; }
.boem-newsletter__thanks { margin: 0; font-family: var(--boem-mono); font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--boem-teal-deep); }
.boem-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
/* mobile override MUST sit after the component block above (same specificity — source order decides) */
@media (max-width: 900px) {
    .boem-newsletter { grid-template-columns: 1fr; row-gap: 18px; }
}

/* ---------- header search ---------- */
header .wp-block-search__input {
    border: 1px solid var(--boem-line); border-radius: 0; background: var(--boem-paper);
    font-family: var(--boem-mono); font-size: 12px; padding: 8px 10px; color: var(--boem-ink);
}
header .wp-block-search__input:focus-visible { outline: 2px solid var(--boem-teal); outline-offset: 1px; }
header .wp-block-search__button {
    border: 0; border-radius: 0; background: transparent; color: var(--boem-ink); cursor: pointer; padding: 4px 8px;
}
header .wp-block-search__button:hover { color: var(--boem-teal-ink); }