/* Batch 58 (2026-10-06): the ornament wall lives INSIDE boxes and drifts with the scroll (Justin: "when I say tree photos, this is what I mean. Not the literal tree").
   One decorative layer, used on Home (the four ticket headers, the four caption footers) and Tickets (the hero box, the five Know Before You Buy label panels).
   Markup (templates/tree-box-batch58-20261006.php): a clip element (an empty i, the box's own size, overflow hidden, rounded like the box) holding a tree element. The tree element paints a crop of an
   approved ornament wall (assets/art-20261003 ornament-wall-a, -b, -c and the portrait wall, already in the package, no new art) and is larger than the box by an overscan (half the travel plus 4px on
   every side), so the drift never shows an edge.
   Drift: assets/tree-box-batch58-20261006.js moves the tree element only (transform translate3d, vertical) with the scroll, 12 to 24 px over the box's pass through the viewport (--tb58-host-travel on the
   host: 16 Home headers, 12 caption footers and label panels, 24 the Tickets hero box). The clip, the card, its border and its text never move. Reduced motion and ?static=1: the layer rests.
   Each host sets the stacking context (position relative, isolation isolate); the clip sits at z -2, under the host's own support (::before, z -1) and its content. */
.tb58-clip{--tb58-travel:var(--tb58-host-travel,16);font-style:normal;position:absolute;z-index:-2;inset:0;display:block;overflow:hidden;border-radius:inherit;pointer-events:none;background:#080808}
.tb58-clip::after{content:"";position:absolute;inset:0;background:var(--tb58-shade,none);pointer-events:none}
.tb58-tree{position:absolute;display:block;inset:calc(var(--tb58-travel) * -.5px - 4px);background-repeat:no-repeat;background-color:#0b0b0b}
.tb58-clip[data-tb58-live="1"] .tb58-tree{will-change:transform}
@media(prefers-reduced-motion:reduce){.tb58-tree{transform:none!important;will-change:auto}}

/* ---------- Home ticket headers: one crop per tier (a different wall or focal point each), banner on top ----------
   The wall is shown at its 800px file at 1x (about 640px on a phone), never upscaled and never smaller than the layer, so the layer is always covered. The focal points leave an Ohio Made tag or
   an OH10 medallion showing beside and above the banner. A soft dark pool behind the banner art (not a rectangle) keeps the art clear of the wall. */
html body.om-mvp .omhm26-root.omhm26-journey-home .ticket-home-preview a.tc43-card .tc43-head{--tb58-host-travel:16;--tb58-s:1;position:relative;isolation:isolate;
  --tb58-shade:radial-gradient(ellipse 60% 80% at 50% 50%,rgba(5,5,5,.5) 0%,rgba(5,5,5,.3) 62%,rgba(5,5,5,.12) 100%)}
@media(max-width:767px){html body.om-mvp .omhm26-root.omhm26-journey-home .ticket-home-preview a.tc43-card .tc43-head{--tb58-s:.8}}
html body.om-mvp .omhm26-root.omhm26-journey-home .ticket-home-preview a.tc43-card .tc43-head .tb58-tree{background-size:max(calc(800px * var(--tb58-s)),100%) auto}
html body.om-mvp .omhm26-root.omhm26-journey-home .ticket-home-preview a.tc43-og .tc43-head .tb58-tree{background-image:url('./art-20261003/ornament-wall-a-800.webp');background-position:18% 52%}
html body.om-mvp .omhm26-root.omhm26-journey-home .ticket-home-preview a.tc43-vip .tc43-head .tb58-tree{background-image:url('./art-20261003/ornament-wall-b-800.webp');background-position:8% 30%}
html body.om-mvp .omhm26-root.omhm26-journey-home .ticket-home-preview a.tc43-early .tc43-head .tb58-tree{background-image:url('./art-20261003/ornament-wall-c-800.webp');background-position:46% 14%}
html body.om-mvp .omhm26-root.omhm26-journey-home .ticket-home-preview a.tc43-general .tc43-head .tb58-tree{background-image:url('./art-20261003/ornament-wall-a-800.webp');background-position:78% 90%}

/* Vera 18 (2026-10-07): the four caption footers (not the ticket headers) swept 9.4 to 10.2 px in the review probe at 12 declared; 16 declared sweeps 12.5 or more by the same probe, still inside 12 to 24. */
/* ---------- Home caption footers: the crops that were already there, now on the drift layer (same file, size, per-card crop, same dark gradient) ---------- */
html body.om-mvp .omhm26-root.omhm26-journey-home .journey-home-benefit.hp43-card .journey-home-benefit-copy{--tb58-host-travel:16;--tb58-shade:linear-gradient(90deg,rgba(5,5,5,.85) 0%,rgba(5,5,5,.7) 60%,rgba(5,5,5,.65) 100%)}
html body.om-mvp .omhm26-root.omhm26-journey-home .journey-home-benefit.hp43-card .journey-home-benefit-copy .tb58-tree{background-image:url('./art-20261003/ornament-wall-b-800.webp');background-size:200% auto;background-position:var(--hp43-x) var(--hp43-y)}

/* ---------- Tickets hero box: the wall covers the box (landscape wall, portrait wall under 768px), behind the copy and the photo ---------- */
body.om-mvp .omhm26-root.omhm26-journey .ticket-preview .ticket-intro.om42-hero .tb58-tree{background-image:url('./art-20261003/ornament-wall-c-1600.webp');background-size:cover;background-position:50% 40%}
@media(max-width:767px){body.om-mvp .omhm26-root.omhm26-journey .ticket-preview .ticket-intro.om42-hero .tb58-tree{background-image:url('./art-20261003/ornament-wall-portrait-940.webp');background-position:50% 30%}}

/* ---------- Tickets Know Before You Buy label panels: the ornament-wall-b crops that were already there, now on the drift layer ---------- */
/* Vera 18 follow-up (2026-10-07): the label panels declared 12 and swept 9.1 to 11.9 px in the review probe; 16 declared (this sheet loads after tickets-batch42, same selector). */
body.om-mvp .ticket-preview .ticket-know dt{--tb58-host-travel:16;--tb58-shade:linear-gradient(rgba(5,5,5,.64),rgba(5,5,5,.72))}
body.om-mvp .ticket-preview .ticket-know dt .tb58-tree{background-image:url('./art-20261003/ornament-wall-b-800.webp');background-size:cover;background-position:var(--om42-lx) var(--om42-ly)}
