/* ==========================================================================
   RAWBURTZ BUILD 045 — MARK PRESENCE SYSTEM
   The RAWBURTZ SVG stops behaving like a header logo and becomes a recurring
   visual presence throughout the public realm.
   ========================================================================== */

.rb045-mark-system {
    --rb045-mark-url: url("/images/rawburtz-mark.svg");
}

/* Header: deliberately text-only. */
.rb045-mark-system .rb043-brand {
    gap: 0;
}

.rb045-mark-system .rb043-brand-copy {
    gap: 5px;
}

.rb045-mark-system .rb043-brand-name {
    letter-spacing: .075em;
}

.rb045-mark-system .rb043-brand-kicker {
    letter-spacing: .205em;
}

/* Mark hosts are assigned by the BUILD 045 JS. */
.rb045-mark-host {
    position: relative;
    isolation: isolate;
}

.rb045-mark-layer {
    position: absolute;
    left: var(--rb045-left, auto);
    right: var(--rb045-right, -9%);
    top: var(--rb045-top, 6%);
    bottom: var(--rb045-bottom, auto);
    display: block;
    width: min(46vw, 720px);
    aspect-ratio: 1 / 1;
    background-image: var(--rb045-mark-url);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0;
    pointer-events: none;
    user-select: none;




    transform:
        translate3d(var(--rb045-x, 0px), calc(var(--rb045-y, 0px) + 18px), 0)
        rotate(var(--rb045-rotate, -6deg))
        scale(calc(var(--rb045-scale, 1) * .92));
    transform-origin: center;
    transition:
        opacity .85s cubic-bezier(.2,.8,.2,1),
        transform 1.1s cubic-bezier(.2,.8,.2,1),
        filter .5s ease;
    will-change: opacity, transform;
    z-index: 1;
}

.rb045-mark-layer.is-visible {
    opacity: var(--rb045-opacity, .07);
    transform:
        translate3d(var(--rb045-x, 0px), var(--rb045-y, 0px), 0)
        rotate(var(--rb045-rotate, -6deg))
        scale(var(--rb045-scale, 1));
}

.rb045-mark-host:hover > .rb045-mark-layer.is-visible {
    opacity: var(--rb045-hover-opacity, .12);
    transform:
        translate3d(calc(var(--rb045-x, 0px) - 7px), calc(var(--rb045-y, 0px) - 5px), 0)
        rotate(calc(var(--rb045-rotate, -6deg) + 1deg))
        scale(calc(var(--rb045-scale, 1) * 1.015));
}

/* HERO PRESENCE
   Large enough to register subconsciously, never large enough to become the hero. */
.rb045-mark-layer[data-rbz-mark-mode="hero"] {
    width: min(53vw, 820px);


    --rb045-opacity: .072;
    --rb045-hover-opacity: .115;
    --rb045-y: 26px;
    --rb045-rotate: -8deg;
    filter: saturate(.9) contrast(1.08);
}

/* Homepage gets the mark behind the artwork/red-orbit presence. */
.rb043-hero > .rb045-mark-layer[data-rbz-mark-mode="hero"] {


    width: min(47vw, 710px);
    --rb045-opacity: .085;
    --rb045-hover-opacity: .13;
    --rb045-rotate: 7deg;
}

/* BUILD 044 hero sections already have ghost typography.
   Keep the mark on the opposite side so both languages can coexist. */
.rb044-catalog > section:first-child > .rb045-mark-layer,
.rb044-sold > section:first-child > .rb045-mark-layer,
.rb044-cart > section:first-child > .rb045-mark-layer,
.rb044-policy > section:first-child > .rb045-mark-layer {



    --rb045-rotate: 8deg;
    --rb045-opacity: .06;
}

.rb044-collections-index > section > .rb045-mark-layer,
.rb044-search > section > .rb045-mark-layer,
.rb044-about > section > .rb045-mark-layer,
.rb044-contact > section > .rb045-mark-layer,
.rb044-verify > section > .rb045-mark-layer,
.rb044-order-success > section > .rb045-mark-layer,
.rb044-collector-intro > .rb045-mark-layer {


}

/* ARTWORK DETAIL
   The piece remains dominant; the mark appears at the boundary between
   image encounter and archival record. */
.rb044-artwork-detail > .rb045-mark-layer[data-rbz-mark-mode="hero"] {


    width: min(38vw, 600px);
    --rb045-opacity: .052;
    --rb045-hover-opacity: .09;
    --rb045-rotate: 5deg;
}

/* TRANSITIONAL PRESENCE
   Cropped, oversized, and structural rather than logo-like. */
.rb045-mark-layer[data-rbz-mark-mode="transition"] {
    width: min(38vw, 570px);


    --rb045-opacity: .06;
    --rb045-hover-opacity: .105;
    --rb045-y: 18px;
    --rb045-rotate: 9deg;
    filter: saturate(.85) contrast(1.05);
}

.rb043-manifesto > .rb045-mark-layer,
.rb044-editorial > .rb045-mark-layer {


    --rb045-opacity: .075;
    --rb045-hover-opacity: .11;
    mix-blend-mode: multiply;
}

.rb043-begin > .rb045-mark-layer {


    width: min(34vw, 500px);
    --rb045-opacity: .055;
}

.rb043-collector > .rb045-mark-layer {


    width: min(41vw, 620px);
    --rb045-opacity: .10;
    --rb045-hover-opacity: .145;
    mix-blend-mode: multiply;
}

.rb044-related > .rb045-mark-layer {


    width: min(31vw, 470px);
    --rb045-opacity: .05;
}

/* Selected acquisition / evidence surfaces get a quieter micro-presence. */
.rb045-mark-layer[data-rbz-mark-mode="micro"] {
    width: min(20vw, 260px);


    --rb045-opacity: .055;
    --rb045-hover-opacity: .13;
    --rb045-y: 10px;
    --rb045-rotate: -5deg;
}

.rb044-artwork-detail aside > div:first-child > .rb045-mark-layer,
.rb044-cart aside > .rb045-mark-layer,
.rb044-verify form > .rb045-mark-layer,
.rb044-contact .mt-10 > .rb045-mark-layer {


}

/* Footer: a final partial sighting instead of repeating the text lockup. */
.rb043-footer > .rb045-mark-layer[data-rbz-mark-mode="footer"] {
    width: min(34vw, 520px);


    --rb045-opacity: .07;
    --rb045-hover-opacity: .11;
    --rb045-y: 22px;
    --rb045-rotate: -8deg;
    filter: saturate(.85);
}

/* Ensure common content remains comfortably above decorative layers. */
.rb043-hero-grid,
.rb043-manifesto > .mx-auto,
.rb043-begin > .mx-auto,
.rb043-collector > .mx-auto,
.rb044-editorial > .mx-auto,
.rb044-related > .mx-auto,
.rb043-footer-main,
.rb043-footer-meta,
.rb043-footer > .mx-auto:last-child,
.rb044-catalog > section:first-child > div:not(.rb045-mark-layer),
.rb044-sold > section:first-child > div:not(.rb045-mark-layer),
.rb044-cart > section:first-child > div:not(.rb045-mark-layer),
.rb044-policy > section:first-child > div:not(.rb045-mark-layer),
.rb044-collections-index > section > div:not(.rb045-mark-layer),
.rb044-search > section > div:not(.rb045-mark-layer),
.rb044-about > section > *:not(.rb045-mark-layer),
.rb044-contact > section > *:not(.rb045-mark-layer),
.rb044-verify > section > *:not(.rb045-mark-layer),
.rb044-order-success > section > *:not(.rb045-mark-layer),
.rb044-collector-intro > div:not(.rb045-mark-layer) {
    position: relative;
    z-index: 2;
}

/* Acquisition micro-hosts need containment so the cropped mark never escapes. */
.rb044-artwork-detail aside > div:first-child.rb045-mark-host,
.rb044-cart aside.rb045-mark-host,
.rb044-verify form.rb045-mark-host,
.rb044-contact .mt-10.rb045-mark-host {
    overflow: hidden;
}

/* On the light editorial/paper fields, make sure the actual prose stays pristine. */
.rb043-manifesto,
.rb044-editorial {
    overflow: hidden;
}

/* Small-screen behavior: larger crop, lower opacity, less movement. */
@media (max-width: 820px) {
    .rb045-mark-layer[data-rbz-mark-mode="hero"] {
        width: min(78vw, 620px);


        --rb045-opacity: .052;
        --rb045-hover-opacity: .075;
    }

    .rb043-hero > .rb045-mark-layer[data-rbz-mark-mode="hero"] {
        width: min(80vw, 600px);


        --rb045-opacity: .058;
    }

    .rb044-catalog > section:first-child > .rb045-mark-layer,
    .rb044-sold > section:first-child > .rb045-mark-layer,
    .rb044-cart > section:first-child > .rb045-mark-layer,
    .rb044-policy > section:first-child > .rb045-mark-layer {

    }

    .rb045-mark-layer[data-rbz-mark-mode="transition"] {
        width: min(62vw, 470px);


        --rb045-opacity: .045;
    }

    .rb045-mark-layer[data-rbz-mark-mode="micro"] {
        width: min(36vw, 230px);
        --rb045-opacity: .045;
    }

    .rb043-footer > .rb045-mark-layer[data-rbz-mark-mode="footer"] {
        width: min(64vw, 460px);


        --rb045-opacity: .05;
    }
}

@media (max-width: 560px) {
    .rb045-mark-system .rb043-brand-kicker {
        letter-spacing: .16em;
    }

    .rb045-mark-layer[data-rbz-mark-mode="hero"] {
        width: 92vw;

        --rb045-opacity: .042;
    }

    .rb043-hero > .rb045-mark-layer[data-rbz-mark-mode="hero"] {


    }

    .rb045-mark-layer[data-rbz-mark-mode="transition"] {
        width: 76vw;

        --rb045-opacity: .038;
    }

    .rb045-mark-layer[data-rbz-mark-mode="micro"] {
        width: 44vw;

    }
}

@media (prefers-reduced-motion: reduce) {
    .rb045-mark-layer,
    .rb045-mark-layer.is-visible,
    .rb045-mark-host:hover > .rb045-mark-layer.is-visible {
        transition: none !important;
        transform:
            translate3d(var(--rb045-x, 0), var(--rb045-y, 34px), 0)
            rotate(var(--rb045-rotate, -6deg))
            scale(1) !important;
    }
}

@media print {
    .rb045-mark-layer {
        display: none !important;
    }
}


/* ==========================================================================
   BUILD 045 R1 — RANDOMIZED PRESENCE
   Geometry is assigned per mark on every page load by JS.
   ========================================================================== */

.rb045-mark-system .rb045-mark-host {
    overflow: hidden;
}

/* Hero/gallery hosts that already manage overflow explicitly remain compatible. */
.rb045-mark-system .rbz-art-gallery.rb045-mark-host {
    overflow: visible;
}

/* All randomized marks are intentionally softer than a fixed composition. */
.rb045-mark-system .rb045-mark-layer.is-randomized {
    opacity: calc(var(--rb045-opacity, .055) * var(--rb045-random-opacity, 1));
}

/* The top-most hero can be bolder, but still behind content. */
.rb045-mark-system .rb045-mark-layer[data-rbz-mark-priority="primary"].is-randomized {
    --rb045-random-opacity: 1.12;
}

/* General section marks should behave as texture, not signage. */
.rb045-mark-system .rb045-mark-layer[data-rbz-mark-mode="ambient"] {
    width: var(--rb045-width, min(30vw, 430px));
    --rb045-opacity: .042;
    --rb045-hover-opacity: .075;
    filter: saturate(.78) contrast(1.03);
}

/* Alternating light sections need multiply blending so the mark remains quiet. */
.rb045-mark-system .rb045-mark-layer[data-rbz-mark-surface="light"] {
    mix-blend-mode: multiply;
    --rb045-opacity: .05;
    --rb045-hover-opacity: .08;
}

/* Never allow a random mark to block interaction. */
.rb045-mark-layer {
    pointer-events: none !important;
}

/* Optional low-contrast treatment for compact utility sections. */
.rb045-mark-layer[data-rbz-mark-density="quiet"] {
    --rb045-opacity: .028;
    --rb045-hover-opacity: .045;
}

/* Make every meaningful public section eligible without visually shouting. */
.rb045-mark-system main section.rb045-mark-host {
    isolation: isolate;
}

/* Random position should remain restrained on mobile. */
@media (max-width: 820px) {
    .rb045-mark-layer.is-randomized {
        --rb045-random-opacity: .82;
    }
}

@media (max-width: 560px) {
    .rb045-mark-layer.is-randomized {
        --rb045-random-opacity: .72;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rb045-mark-layer.is-randomized {
        transition: none !important;
    }
}
