/** marketplace-depth.css — W5-U6 shared depth bed + calm card lift (N room)
 *  Loads AFTER marketplace-agent-listings-v2.css (same @push block), so equal-
 *  specificity overrides here win by cascade order.
 *
 *  Layering contract:
 *    .marketplace-container (position:relative; z-index:1) is the stacking
 *    context. The depth canvas is its first child at z-index:0 — it paints
 *    ABOVE the wrapper's own opaque #0d0d0d graphite ground and BELOW the
 *    inner .container content (z-index:1). No background overrides anywhere:
 *    kill-switch / no-JS / no-WebGL pages stay pixel-identical to today's.
 *
 *  Kill switch: window.NSA_DEPTH = false (JS). Removing this stylesheet also
 *  fully reverts the card lift.
 *  v20260811
 */

/* ===== Depth bed layering ===== */
.marketplace-container {
    position: relative;
    z-index: 1;
}

.marketplace-container > .container {
    position: relative;
    z-index: 1;
}

.nsa-depth-canvas {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    pointer-events: none;
    display: block;
}

/* ===== Card lift — CSS only, no three per card ===== */
/* Calmer than the base sheet: -3px + 1.005 scale, 200ms, warm border,
   deeper shadow with a faint gold underglow. */
.mp-card {
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}

@media (hover: hover) and (pointer: fine) {
    .mp-card:hover {
        transform: translateY(-3px) scale(1.005);
        border-color: rgba(245, 158, 11, 0.45);
        box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5), 0 2px 12px rgba(245, 158, 11, 0.07);
    }

    .mp-card:hover .mp-card-photo {
        transform: scale(1.03);
    }
}

/* Touch devices: neutralize the base sheet's sticky tap-hover artifacts. */
@media (hover: none) {
    .mp-card:hover {
        transform: none;
        box-shadow: none;
        border-color: #262626;
    }

    .mp-card:hover .mp-card-photo {
        transform: none;
    }
}

/* Keyboard path: gold focus ring on card links and buttons (>= 44px targets
   are the base sheet's job; the ring keeps them findable). */
.mp-card a:focus-visible,
.mp-card button:focus-visible {
    outline: 2px solid #f59e0b;
    outline-offset: 2px;
    border-radius: 6px;
}

/* ===== Reduced motion stills EVERYTHING ===== */
/* The canvas stays visible — the module renders one static frame — but all
   card motion and transitions are off. Last in file so it wins the cascade. */
@media (prefers-reduced-motion: reduce) {
    .mp-card,
    .mp-card-photo {
        transition: none !important;
    }

    .mp-card:hover {
        transform: none;
    }

    .mp-card:hover .mp-card-photo {
        transform: none;
    }
}
