/* Surface boundaries only: no spacing, scroll geometry or interactive layers. */
:root {
    --surface-edge-top:linear-gradient(180deg,#454545 0,#292929 1px,var(--vernissage-dark-edge,#191919) 4px,var(--vernissage-dark-surface,#151515));
    --surface-edge-bottom:linear-gradient(180deg,var(--vernissage-dark-surface,#151515),var(--vernissage-dark-edge,#191919) 3px,#292929 6px,#454545);
    --surface-shadow-up:0 -2px 3px #0000004d,0 -10px 16px #00000038,0 -24px 36px #0000001a;
    --surface-shadow-down:0 2px 3px #0000004d,0 10px 16px #00000038,0 24px 36px #0000001a;
}

/* Each dark art presentation ends at a white contextual section. */
#art-space :is(.artExhibition,.artWorkPresentation,.artPlacePresentation,.artArtistPresentation) {
    position:relative;
}
#art-space :is(.artExhibition,.artWorkPresentation,.artPlacePresentation,.artArtistPresentation)::after {
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:7px;
    background:var(--surface-edge-bottom);
    box-shadow:var(--surface-shadow-down);
    pointer-events:none;
    z-index:2;
}

/* Match the visible pinned desktop navbar, not the header's spectral fallback. */
@media(min-width:801px) {
    body .footerMain {
        position:relative;
        box-shadow:var(--surface-shadow-up);
    }
    body .footerMain::before {
        content:"";
        position:absolute;
        inset:0 0 auto;
        height:1px;
        background:#fff;
        -webkit-mask-image:linear-gradient(90deg,transparent 0%,#00000026 6%,#00000073 16%,#000000c7 28%,#000 40%,#000 60%,#000000c7 72%,#00000073 84%,#00000026 94%,transparent 100%);
        mask-image:linear-gradient(90deg,transparent 0%,#00000026 6%,#00000073 16%,#000000c7 28%,#000 40%,#000 60%,#000000c7 72%,#00000073 84%,#00000026 94%,transparent 100%);
        opacity:1;
        box-shadow:none;
        pointer-events:none;
        z-index:2;
    }
}

@media(min-width:801px) {
    .body--default {
        --home-hero-atelier-surface:color-mix(in srgb,#101010,#fff calc(var(--home-carousel-canvas-bleach,0) * 100%));
        --home-canvas-surface:var(--home-hero-atelier-surface);
        --home-content-layer-background:transparent;
        background-color:var(--home-canvas-surface);
    }
    .body--default .homeHero {
        --home-hero-left-surface:#e5e5e5;
        --home-hero-diptych-title-align-self:center;
        --home-hero-diptych-title-cross-align:center;
        --home-hero-diptych-title-text-align:center;
        --home-hero-diptych-svg-align:center;
        --home-hero-diptych-banner-edge-compensate:0px;
        --home-hero-diptych-pad-center:16px;
    }
    /* Layout layers inherit one canvas, rather than painting individual white panels. */
    .body--default .homeProductCards .card-figure {
        background-color:var(--home-content-layer-background);
    }
    /* Gallery lighting stays behind the cutouts and never participates in scroll geometry. */
    .body--default .homeProductRow[data-home-product-row] {
        position:relative;
        isolation:isolate;
    }
    .body--default .homeProductRow[data-home-product-row]::before {
        content:"";
        position:absolute;
        top:-48px;
        bottom:-56px;
        left:calc((100% - 100vw) / 2 + 8px);
        right:calc((100% - 100vw) / 2 + 8px);
        background:
            linear-gradient(180deg,transparent 54%,rgb(255 255 255 / .7) 77%,rgb(255 255 255 / .22) 88%,transparent),
            linear-gradient(119deg,transparent 12%,rgb(255 255 255 / .2) 24%,rgb(255 255 255 / .96) 40%,rgb(255 255 255 / .65) 49%,transparent 67%),
            linear-gradient(241deg,transparent 34%,rgb(255 255 255 / .7) 48%,rgb(255 255 255 / .15) 63%,transparent 77%),
            linear-gradient(145deg,rgb(33 33 33 / .1),transparent 32%,transparent 69%,rgb(33 33 33 / .055)),
            #e9e9e9;
        -webkit-mask-image:linear-gradient(180deg,transparent,#000 17%,#000 78%,transparent),linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
        mask-image:linear-gradient(180deg,transparent,#000 17%,#000 78%,transparent),linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
        -webkit-mask-composite:source-in;
        mask-composite:intersect;
        pointer-events:none;
        z-index:-1;
    }
    .body--default .homeProductRow[data-home-product-row="1"]::before {
        background:
            linear-gradient(180deg,transparent 52%,rgb(255 255 255 / .64) 77%,rgb(255 255 255 / .1) 90%,transparent),
            linear-gradient(127deg,transparent 19%,rgb(255 255 255 / .12) 31%,rgb(255 255 255 / .92) 44%,rgb(255 255 255 / .3) 55%,transparent 68%),
            linear-gradient(237deg,transparent 26%,rgb(255 255 255 / .82) 43%,rgb(255 255 255 / .16) 57%,transparent 73%),
            linear-gradient(90deg,rgb(25 25 25 / .1),transparent 35%,transparent 68%,rgb(25 25 25 / .12)),
            #e3e3e3;
    }
    .body--default .homeHero__stageLight {
        background:none;
    }
    .body--default .homeHero .homeHero__drawCol .homeHeroTeacupDraw {
        filter:brightness(0) !important;
    }
    .body--default .homeHero :is(.homeHeroProductStage__title a,.homeHeroProductStage__price .price-section,.homeHeroProductStage__price .price,.homeHeroProductStage__controls button) {
        color:#292929;
    }
    .body--default .homeHero .homeHeroProductStage__title a:hover {
        color:#104b7b;
    }
    .body--default .homeHero .homeHeroProductStage__footer {
        border-color:#d1cec8;
    }
    .body--default .homeHero .homeHero__bannerCol {
        background:transparent;
        box-shadow:none;
    }
    .body--default .homeHero .homeHero__bannerCol .homeHero__titleRow--primary {
        color:#f5f5f5 !important;
        text-shadow:none !important;
    }
    .body--default .homeHero .homeHero__scrollCuePath {
        stroke:#f5f5f5 !important;
    }
    .body--default .homeHero__columns {
        box-shadow:none;
    }
    .body--default .homeHero__columns::after {
        border-bottom:0;
        box-shadow:none;
    }
    .body--default .homeHero__scrollCue {
        /* The shared anchor script still sets an inline whole-hero midpoint. */
        left:calc(75% - 8px) !important;
    }
    html:is(.is-home-hero-banner-landing,.is-home-hero-banner-landed,.is-home-hero-intro-reference-end) .body--default .homeHero__columns {
        padding-left:0 !important;
        padding-right:0 !important;
        grid-template-columns:minmax(0,calc(50% - 16px)) minmax(0,1fr);
    }
    html:is(.is-home-hero-banner-landing,.is-home-hero-banner-landed,.is-home-hero-intro-reference-end) .body--default .homeHero__drawCol {
        padding-left:16px !important;
        padding-right:16px !important;
        /* Share the canvas's gentle scroll curve instead of the front-loaded SVG wipe. */
        transform:translate3d(calc(-108% * var(--home-carousel-canvas-bleach,0)),0,0);
        will-change:transform;
    }
    html:is(.is-home-hero-banner-landing,.is-home-hero-banner-landed,.is-home-hero-intro-reference-end) .body--default .homeHero .homeHero__drawCol .homeHeroTeacupDraw {
        margin-left:auto !important;
        margin-right:auto !important;
        /* The entire plane retracts now; do not unpaint its SVG at the same time. */
        -webkit-mask-image:none !important;
        mask-image:none !important;
    }
    /* The light product plane slides over one continuous dark hero surface. */
    .body--default .homeHero__drawCol::before {
        --home-plane-light:1;
        content:"";
        position:absolute;
        inset:0;
        bottom:calc(-1 * var(--home-hero-canvas-pad-bottom,0px));
        box-sizing:border-box;
        border:0;
        background:
            linear-gradient(90deg,rgb(35 35 35 / calc(.22 * var(--home-plane-light))) 0%,rgb(35 35 35 / calc(.14 * var(--home-plane-light))) 19%,transparent 42%,transparent 58%,rgb(35 35 35 / calc(.14 * var(--home-plane-light))) 81%,rgb(35 35 35 / calc(.22 * var(--home-plane-light))) 100%),
            linear-gradient(180deg,transparent 57%,rgb(255 255 255 / calc(.071 * var(--home-plane-light))) 68%,rgb(255 255 255 / calc(.549 * var(--home-plane-light))) 81%,rgb(255 255 255 / calc(.141 * var(--home-plane-light))) 88%,rgb(51 51 51 / calc(.086 * var(--home-plane-light))) 100%),
            linear-gradient(122deg,transparent 13%,rgb(255 255 255 / calc(.094 * var(--home-plane-light))) 25%,rgb(255 255 255 / calc(.949 * var(--home-plane-light))) 43%,rgb(255 255 255 / calc(.788 * var(--home-plane-light))) 53%,rgb(255 255 255 / calc(.078 * var(--home-plane-light))) 73%,transparent 85%),
            linear-gradient(244deg,transparent 32%,rgb(255 255 255 / calc(.522 * var(--home-plane-light))) 47%,rgb(255 255 255 / calc(.141 * var(--home-plane-light))) 62%,transparent 77%),
            linear-gradient(151deg,rgb(37 37 37 / calc(.141 * var(--home-plane-light))) 0%,transparent 31%,transparent 64%,rgb(37 37 37 / calc(.125 * var(--home-plane-light))) 100%),
            var(--home-hero-plane-surface,var(--home-hero-left-surface,#fff));
        box-shadow:inset -1px 0 0 rgb(255 255 255 / calc(.251 * var(--home-plane-light))),inset 0 -1px 0 rgb(255 255 255 / calc(.18 * var(--home-plane-light))),1px 0 1px rgb(0 0 0 / calc(.38 * var(--home-plane-light))),6px 0 18px rgb(0 0 0 / calc(.141 * var(--home-plane-light))),0 1px 1px rgb(0 0 0 / calc(.239 * var(--home-plane-light))),0 8px 20px rgb(0 0 0 / calc(.102 * var(--home-plane-light)));
        pointer-events:none;
        opacity:0;
        z-index:-1;
    }
    html:is(.is-home-hero-banner-landing,.is-home-hero-banner-landed,.is-home-hero-intro-reference-end) .body--default .homeHero__drawCol::before {
        opacity:1;
    }
    @media(prefers-reduced-motion:no-preference) {
        .body--default .homeHero__drawCol::before {
            --home-plane-color-progress:clamp(0,calc((var(--home-carousel-canvas-bleach,0) - .35) * 1.538461538),1);
            --home-plane-light:calc(1 - var(--home-plane-color-progress));
            --home-plane-edge-softness:calc(160px * clamp(0,calc(var(--home-carousel-canvas-bleach,0) * 2.5),1));
            --home-hero-plane-surface:color-mix(in srgb,var(--home-hero-left-surface,#e5e5e5),var(--home-hero-atelier-surface) calc(var(--home-plane-color-progress) * 100%));
            /* Counter only the background's inherited slide; product motion stays on its parent. */
            transform:translate3d(calc(108% * var(--home-carousel-canvas-bleach,0)),0,0);
            -webkit-mask-image:linear-gradient(to right,#000 calc(100% - var(--home-plane-edge-softness)),transparent 100%),linear-gradient(to bottom,#000 calc(100% - var(--home-plane-edge-softness)),transparent 100%);
            mask-image:linear-gradient(to right,#000 calc(100% - var(--home-plane-edge-softness)),transparent 100%),linear-gradient(to bottom,#000 calc(100% - var(--home-plane-edge-softness)),transparent 100%);
            -webkit-mask-composite:source-in;
            mask-composite:intersect;
        }
    }
    html.is-home-hero-teacup-intro.is-home-hero-banner-early.is-home-hero-banner-landing:not(.is-home-hero-banner-landed) .body--default .homeHero__bannerCol {
        animation:none;
        transform:none;
    }
    html.is-home-hero-teacup-intro.is-home-hero-banner-early.is-home-hero-banner-landing:not(.is-home-hero-banner-landed) .body--default .homeHero__drawCol {
        animation:homeHeroLeftPlaneIn 920ms cubic-bezier(.22,1,.36,1) both;
    }
    @keyframes homeHeroLeftPlaneIn {
        from { opacity:0; transform:translate3d(-108%,0,0); }
        to { opacity:1; transform:translate3d(0,0,0); }
    }
    @media(prefers-reduced-motion:reduce) {
        html:is(.is-home-hero-banner-landing,.is-home-hero-banner-landed,.is-home-hero-intro-reference-end) .body--default .homeHero__drawCol {
            transform:none;
            will-change:auto;
        }
        html.is-home-hero-teacup-intro.is-home-hero-banner-early.is-home-hero-banner-landing:not(.is-home-hero-banner-landed) .body--default .homeHero__drawCol {
            animation:none;
        }
    }
    body:not(:has(.category-inkPlane)) .footerBottom {
        position:relative;
    }
    body:not(:has(.category-inkPlane)) .footerBottom::after {
        content:"";
        position:absolute;
        left:0;
        right:0;
        bottom:0;
        height:7px;
        background:linear-gradient(180deg,#000,#090909 3px,#252525 6px,#454545);
        box-shadow:var(--surface-shadow-down);
        pointer-events:none;
        z-index:2;
    }
    body:not(:has(.category-inkPlane)) #consent-manager-update-banner {
        box-shadow:inset 0 1px #454545,inset 0 3px #252525,var(--surface-shadow-up);
    }
}
@media(max-width:800px) {
    .body--default .homeHero__bannerCol::after {
        content:"";
        position:absolute;
        left:0;
        right:0;
        bottom:0;
        height:7px;
        background:linear-gradient(180deg,#050505,#191919 3px,#292929 6px,#454545);
        box-shadow:var(--surface-shadow-down);
        pointer-events:none;
        z-index:2;
    }
    /* Mobile trust benefits precede the footer, including on product pages. */
    body:not(:has(.category-inkPlane)) .footerMain {
        position:relative;
    }
    body:not(:has(.category-inkPlane)) .footerMain::before {
        content:"";
        position:absolute;
        inset:0 0 auto;
        height:7px;
        background:linear-gradient(180deg,#454545,#252525 1px,#090909 4px,#000);
        box-shadow:var(--surface-shadow-up);
        pointer-events:none;
        z-index:2;
    }
}