/* Batch 28 (2026-10-03). Loads last. Groups:
   1 Guide Sip and Shop split section (two vertical rails, one mobile rail)
   2 Header banners (Guide makers, Holiday Our Makers)
   3 Ornament walls (newsletter card, Guide hero), 55 percent scrim
   4 Ohio Made badge mark (undated year chips, footer)
   5 Holiday photo stripe goes landscape and carries the three tree walls
   6 Holiday Family Volunteers carousel: one 16x9 framed photo per slide
   Motion is CSS only. Reduced motion and ?static=1 show a static grid. No controls are added. */

/* ---------- 1. Sip and Shop ---------- */
.gd28-sip{padding-top:0!important;margin-top:24px}
.gd28-sip .gd28-board{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center;padding:32px 28px;overflow:hidden}
.gd28-copy{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;min-width:0}
.gd28-badge{display:block;width:100%;max-width:460px;height:auto;aspect-ratio:3/2}
body.om-mvp .gd28-sip h2#gd26-cocktails-title{margin:6px 0 0;font-size:clamp(1.75rem,3vw,2.6rem);line-height:1.04;max-width:none}
.gd28-sip .gd26-line.gd28-line{margin:2px 0 8px;font-family:"OMHM Backline",cursive;font-size:clamp(28px,3vw,40px);line-height:1.1;color:#68f8b3}
.gd28-sip .gd26-fine{margin:4px 0 0!important}
.gd28-rails{display:grid;grid-template-columns:1fr 1fr;gap:24px;min-width:0}
.gd28-rail{position:relative;height:640px;overflow:hidden;min-width:0;-webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}
.gd28-rail:focus-visible{outline:3px solid #68f8b3;outline-offset:2px}
.gd28-track{display:flex;flex-direction:column;will-change:transform}
.gd28-rail--up .gd28-track{animation:gd28-up 70s linear infinite}
.gd28-rail--down .gd28-track{animation:gd28-down 85s linear -30s infinite}
.gd28-group{list-style:none;margin:0;padding:0 0 22px;display:flex;flex-direction:column;align-items:center;gap:22px}
.gd28-card{flex:0 0 auto;width:260px;max-width:100%;margin:0;padding:0;aspect-ratio:4/5}
.gd28-card:nth-child(odd){transform:rotate(-3deg)}
.gd28-card:nth-child(even){transform:rotate(3deg)}
.gd28-card img{display:block;width:100%;height:100%;object-fit:cover}
.gd28-card--badge img{object-fit:contain}
@keyframes gd28-up{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-50%,0)}}
@keyframes gd28-down{from{transform:translate3d(0,-50%,0)}to{transform:translate3d(0,0,0)}}
/* The one mobile rail is only for narrow screens. */
.gd28-rail--m{display:none}
@media(max-width:899px){
  .gd28-sip .gd28-board{grid-template-columns:1fr;gap:20px;padding:24px 12px}
  .gd28-rails{display:none}
  .gd28-rail--m{display:block;height:240px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
  .gd28-rail--m .gd28-track{flex-direction:row;width:max-content;animation:gd28-left 80s linear infinite}
  .gd28-rail--m .gd28-group{flex-direction:row;align-items:center;padding:0 14px 0 0;gap:14px}
  .gd28-rail--m .gd28-card{width:192px;height:240px}
}
@keyframes gd28-left{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
/* Static: reduced motion or ?static=1. First six cards, two columns, no drift. */
@media(prefers-reduced-motion:reduce){
  .gd28-track{animation:none!important;transform:none!important}
  .gd28-group[data-gd28-copy]{display:none}
  .gd28-rail{height:auto;overflow:visible;-webkit-mask-image:none;mask-image:none}
  .gd28-rail .gd28-card:nth-child(n+4){display:none}
  .gd28-rail--m{display:none!important}
  .gd28-rails{display:grid!important}
}
.gd28-static .gd28-track{animation:none!important;transform:none!important}
.gd28-static .gd28-group[data-gd28-copy]{display:none}
.gd28-static .gd28-rail{height:auto;overflow:visible;-webkit-mask-image:none;mask-image:none}
.gd28-static .gd28-rail .gd28-card:nth-child(n+4){display:none}
.gd28-static .gd28-rail--m{display:none!important}
.gd28-static .gd28-rails{display:grid!important}
@media(max-width:899px){
  .gd28-static .gd28-rails{display:grid!important;grid-template-columns:1fr 1fr;gap:12px}
  .gd28-static .gd28-card{width:100%}
}
@media(max-width:899px) and (prefers-reduced-motion:reduce){.gd28-rails{display:grid!important;grid-template-columns:1fr 1fr;gap:12px}.gd28-rails .gd28-card{width:100%}}

/* ---------- 2. Header banners ---------- */
.gd28-banner{display:block;width:100%;max-width:980px;height:auto;margin:0 auto 18px}
.gd28-banner--badge{max-width:640px}
.gd28-banner-wrap{display:block;margin:0 auto 24px;text-align:center}
.gd28-makers .editorial-well,.gd28-makers .editorial-well h2{text-align:center}

/* ---------- 3. Ornament walls ---------- */
.om28-wall-card{position:relative;overflow:hidden;isolation:isolate}
.om28-wall-card>.om28-wall{position:absolute;inset:0;z-index:-2;display:block;margin:0}
.om28-wall-card>.om28-wall img{display:block;width:100%;height:100%;object-fit:cover}
.om28-wall-card::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,0,0,.55);pointer-events:none}
body.om-mvp .om-site-newsletter-call.om28-wall-card{background:#0a0a0a!important}
body.om-mvp .om-site-newsletter-call.om28-wall-card::after{display:none!important}
/* Batch 30: ornament-wall-b lives inside the Guide hero well (the batch 28 section backdrop is gone, plaid shows around the box).
   The blur is on the image layer only, the scrim is a pseudo layer above it, text and buttons paint above both. */
.gd30-well{position:relative;isolation:isolate;overflow:hidden}
.gd30-well>.gd30-wall{position:absolute;inset:0;z-index:-2;display:block;overflow:hidden;margin:0}
.gd30-well>.gd30-wall img{display:block;width:100%;height:100%;object-fit:cover;filter:blur(2.5px);transform:scale(1.04)}
.gd30-well::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,0,0,.62);pointer-events:none}
body.om-mvp .gd30-well .om17-date{color:var(--om17-mint)!important}
/* Batch 30: the Tenth Anniversary Shopping Party lockup above the Guide hero box, centered, 720px max at desktop, 300px on mobile, clear of the box. */
.gd30-lockup{display:block;width:100%;max-width:720px;margin:0 auto 36px;padding:0;text-align:center}
.gd30-lockup img{display:block;width:100%;height:auto;margin:0 auto}
@media(max-width:600px){.gd30-lockup{max-width:300px;margin-bottom:28px}}
/* Batch 30: Start with a person, the three past-market photos are a fanned feature inside the box. Mobile first: one column, text then a single row of three, no overlap. */
.gd30-person-text{min-width:0}
.gd30-fan{--w:30%;display:flex;justify-content:center;align-items:center;gap:4%;margin:24px 0 0;padding:12px 4px 16px}
.gd30-fan figure{flex:0 0 auto;width:var(--w);aspect-ratio:4/5;margin:0;box-sizing:border-box;border:3px solid #ef2435;border-radius:12px;overflow:hidden;background:#111;box-shadow:0 10px 22px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.5)}
.gd30-fan figure:nth-child(1){transform:rotate(-6deg)}
.gd30-fan figure:nth-child(2){transform:rotate(3deg);z-index:2}
.gd30-fan figure:nth-child(3){transform:rotate(-2deg)}
.gd30-fan img{display:block;width:100%;height:100%;object-fit:cover}
@media(min-width:900px){
  .gd30-person{display:grid;grid-template-columns:minmax(0,58fr) minmax(0,42fr);gap:32px;align-items:center}
  .gd30-fan{--w:clamp(130px,15.3vw,220px);gap:0;margin:0;padding:18px 0 22px}
  .gd30-fan figure+figure{margin-left:calc(var(--w) * -.5)}
  .gd30-fan figure:nth-child(1){transform:rotate(-6deg) translateY(10px)}
  .gd30-fan figure:nth-child(2){transform:rotate(3deg) translateY(-8px)}
  .gd30-fan figure:nth-child(3){transform:rotate(-2deg) translateY(12px)}
}

/* ---------- 4. Ohio Made badge mark (undated photo chips only; the footer carries the wordmark alone) ---------- */
.om28-year-badge{display:block;height:44px;width:53px;flex:0 0 auto;margin:0;background:center/contain no-repeat}
.omhm-gallery-year.is-badge{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;line-height:0}
html.omhm-holiday .maker-accordion-caption strong.is-badge{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;line-height:0!important;width:auto!important;flex:0 0 auto!important}

/* ---------- 5. Holiday stripe, landscape ---------- */
.hm19-stripe--land .hm19-track{animation-duration:54s}
.hm19-stripe--land .hm19-tile--land{width:clamp(300px,29.2vw,420px)}
.hm19-stripe--land .hm19-tile--land img{aspect-ratio:16/9}
.hm19-stripe--land .hm19-tile--trees img{background:#0a0a0a}
@media(max-width:600px){.hm19-stripe--land .hm19-tile--land{width:300px;padding:8px}}

/* ---------- 6. Holiday Family Volunteers carousel ---------- */
/* Batch 30: the landscape carousel lids (Volunteers, Our Makers) take the Bags lid fit. They keep the Bags lid class, grid row, z-index, shadow and 7 percent overlap.
   The only difference is the box: the Bags box is the whole accordion, while a landscape carousel's box is the middle column of the same 48 / 1fr / 48 grid (20 / 1fr / 20 under 780px),
   so the lid is the accordion width minus the two side columns plus the same 16px (8px each side) and it is centered. */
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .feature-gift-lid{justify-self:center;width:calc(100% - 80px)!important;margin-bottom:calc((100% - 80px) * -.07)!important}
@media(max-width:780px){html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .feature-gift-lid{width:calc(100% - 24px)!important;margin-bottom:calc((100% - 24px) * -.07)!important}}
/* Batch 30: year-era sections. The lid is the Bags lid (class feature-gift-lid, section class feature-gift); the box moves from the section to the era body so the lid sits on its top edge. */
html.omhm-holiday .hm9-years .review-year-archive.album-gift{padding:0!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
html.omhm-holiday .hm9-years .review-year-archive.album-gift .album-gift-body{width:100%!important;margin-inline:0!important;padding-top:34px!important;background:linear-gradient(90deg,#202020 0,#101010 10px,#050505 22px,#080808 calc(100% - 22px),#151515 calc(100% - 10px),#252525 100%)!important;border:1px solid #3c3c3c!important;border-radius:7px!important}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-strip{display:block!important;position:relative;width:min(100%,960px)!important;max-width:960px!important;height:auto!important;min-height:0!important;aspect-ratio:auto!important;margin:0 auto!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;overflow:visible!important;transform:none!important}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-strip[hidden]{display:none!important}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-panel{display:block!important;position:relative!important;width:100%!important;max-width:none!important;flex:none!important;height:auto!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;outline:0!important;background:none!important;box-shadow:none!important;transform:none!important;overflow:visible!important;cursor:pointer}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-panel[hidden]{display:none!important}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-panel:focus-visible{outline:3px solid #68f8b3!important;outline-offset:6px}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-panel>img{display:block!important;position:static!important;box-sizing:border-box!important;width:100%!important;height:auto!important;aspect-ratio:16/9!important;object-fit:cover!important;padding:12px!important;border:3px solid #ef2435!important;border-radius:10px!important;background:#c4101f url('./journey-weave-tile.jpg') 0 0/94px 93px!important;box-shadow:0 10px 18px #0009,inset 0 0 0 2px #0006!important;transform:none!important}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-caption{position:static!important;margin:16px 0 0!important;width:100%!important;box-sizing:border-box!important;display:flex!important;flex-wrap:nowrap!important;align-items:center!important;gap:12px!important;padding:8px 10px!important;text-align:left;background:#050505!important;border-radius:6px!important;transform:none!important}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-caption>span{flex:1 1 auto!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-controls{margin-top:12px}
@media(max-width:780px){
  html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-strip{width:min(100%,340px)!important;padding-bottom:0!important}
  html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-panel img{padding:8px!important}
  html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-caption>span{white-space:normal}
}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land{background:none!important;border:0!important;box-shadow:none!important;padding:0!important}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-controls output,html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-controls output *{color:#fff!important}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land::before{content:none!important;display:none!important}
html.omhm-holiday section:is(#story-volunteers,#story-makers).feature-gift{max-width:1040px!important;width:calc(100% - 40px)!important}
@media(max-width:780px){html.omhm-holiday section:is(#story-volunteers,#story-makers).feature-gift{width:calc(100% - 28px)!important}}
html.omhm-holiday :is(#story-volunteers,#story-makers) .hm28-land .maker-accordion-caption strong.is-badge{background:transparent!important;background-image:none!important;border:0!important;box-shadow:none!important;padding:0!important;min-width:0!important}

/* Contrast on the wall: body text clears 4.5:1 on the scrimmed art in the worst pixel (4.55). Smaller muted and mint text get a solid backing instead. */
body.om-mvp .om-site-community .om-site-newsletter-call.om28-wall-card .om-signup-hint{color:#fff9f1}
body.om-mvp .om-site-newsletter-call.om28-wall-card .om-site-call-kicker{display:inline-block;width:fit-content;padding:3px 10px;border-radius:6px;background:rgba(0,0,0,.72)}
.gd28-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.gd28-makers .editorial-well{padding-bottom:8px!important;padding-top:16px!important}.gd28-makers .gd28-banner{margin-bottom:0}

/* Vera 12 (2026-10-07): the newsletter card is one partial shared by every route (Home, Tickets, Holiday, FAQ, Makers). The heading and paragraph on the left half sat on the bare busy ornament wall.
   A confined, feathered, near-black support now lies behind that copy block only: 93 to 84 percent at the start edge to the far edge, a 16 px feather on every side, 12 px corners, same technique as the
   batch 43 labels (mask intersect, no box edge). Nothing else on the card changes (wall, scrim, right half, form, border, copy, ids). Reads on the copy div's own ::before, under the text, over the wall and the card scrim. */
body.om-mvp .om-site-newsletter-call.om28-wall-card>div:not(.om-site-call-action){position:relative;isolation:isolate}
body.om-mvp .om-site-newsletter-call.om28-wall-card>div:not(.om-site-call-action)::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:-18px -22px;border-radius:12px;
  background:linear-gradient(100deg,rgba(5,5,5,.93) 0%,rgba(5,5,5,.84) 100%);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%),linear-gradient(to right,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%),linear-gradient(to right,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%);mask-composite:intersect}
@media(max-width:767px){body.om-mvp .om-site-newsletter-call.om28-wall-card>div:not(.om-site-call-action)::before{inset:-16px -16px}}
