/* Wave E (2026-10-07): Shopping Guide, Justin's walkthrough (paste 3). Guide only (enqueued on /explore/shopping-guide/ and nowhere else), after batch 52 and the batch 59b frames.
   H  hero: the right photo frame is gone; the lead box is the full-width hero; the 10th anniversary lockup (v2) at the left, "Shopping Guide" as the headline at its right; "Maker Preview below" at the top (logged in with the roster capability)
   C  cover: the contents block at the left, the wreath at the right on a black circle; "Shopping Guide" on one line, no year, bigger text
   R  rotating photo frames (hotel, Photos with Santa, Start with a Person): one frame, one photograph at a time; the markup shows the first photograph, so a still page is complete
   S  Sip and Shop box with an ornament wall behind it, bold white text; session lockups on the plaid (no wall, no support behind a heading)
   W  Pick Your Window: Ohio icons as the dots, hours in black with a mint outline
   P  Start with a Person in one row with the Backline line under it; Photos with Santa and the Raffle features; the floor plan above Meet the Makers
   Wave G (2026-10-07 night, Justin's second walkthrough): G1 the circle behind the wreath, G2 hotel pair, G3 Sip and Shop scrim over the whole box, G4 Photos with Santa gallery wall, G5 raffle gone, G7 black 3 px box edges (block at the end).
   Motion: the only motion is the opacity change between two photographs of a frame (script: guide-batche-20261007.js). Reduced motion and ?static=1 show the first photograph. Colours, radii and timings are existing site values:
   red #ef2435, mint #68f8b3, 2 px box edges, 10 to 12 px corners. */

/* ---------- H. Hero ---------- */
.gde-hero{display:block;margin-bottom:64px}
body.om-mvp .gde-hero .gde-well{width:100%;max-width:none;box-sizing:border-box;padding:clamp(18px,2.4vw,34px) clamp(20px,3vw,48px) clamp(24px,3vw,44px)}
body.om-mvp .gde-well .gde-preview{margin:0 0 clamp(10px,1.4vw,18px)!important;max-width:none!important;width:100%;text-align:center}
.gde-preview a{display:inline-flex;align-items:center;gap:12px;font:400 clamp(28px,2.6vw,38px)/1.1 "OMHM Backline",cursive;color:#68f8b3;text-decoration:none;text-shadow:0 2px 0 #000;padding:4px 10px;border-radius:8px}
.gde-preview a::after{content:"";width:12px;height:12px;margin-top:-7px;border-right:3px solid #68f8b3;border-bottom:3px solid #68f8b3;transform:rotate(45deg)}
.gde-preview a:hover span{text-decoration:underline;text-underline-offset:5px}
.gde-preview a:focus-visible{outline:3px solid #68f8b3;outline-offset:3px}
.gde-hero-grid{display:grid;grid-template-columns:minmax(0,clamp(300px,31vw,460px)) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center}
body.om-mvp .gde-hero .gd51-art{max-width:none;margin:0;width:100%}
body.om-mvp .gde-hero .gd51-art img{aspect-ratio:1/1;margin:0 auto;max-width:460px}
.gde-hero-copy{min-width:0;container-type:inline-size}
body.om-mvp .gde-hero-copy .gde-title{margin:0 0 6px!important;font-size:clamp(34px,10.2cqw,92px)!important;line-height:.98!important;white-space:nowrap;text-wrap:nowrap;text-align:left}
body.om-mvp .gde-hero h1#editorial-title{margin:4px 0 12px!important}
@media(max-width:780px){
  .gde-hero-grid{grid-template-columns:1fr;gap:14px}
  body.om-mvp .gde-hero .gd51-art img{max-width:300px}
  body.om-mvp .gde-hero-copy .gde-title{font-size:clamp(30px,10.8cqw,64px)!important;text-align:center}
  .gde-hero-copy{text-align:center}
}

/* ---------- C. Cover: contents left, wreath right on a black circle ---------- */
@media(min-width:901px){
  .gd51-cover{grid-template-columns:minmax(0,1fr) minmax(0,640px)}
  .gd51-cover-art{grid-column:2;grid-row:1}
  .gd51-contents{grid-column:1;grid-row:1}
}
.gd51-cover-art::before{content:"";position:absolute;z-index:0;left:50.6%;top:54%;width:76%;aspect-ratio:1/1;transform:translate(-50%,-50%);border-radius:50%;background:#000;pointer-events:none}
.gd51-wreath-art{z-index:1}
.gd51-cover-text{z-index:2;left:50.6%;top:54%;width:58cqw;padding:3cqw}
/* Wave G (F-G1, Justin: "Put the black circle behind the wreath. Right now, it's in front of it, and it looks bad."): the hard black disc that painted OVER the wreath's inner foliage is gone. The one black circle now sits UNDER the
   wreath (the .gd51-cover-art::before disc, z 0, under the wreath at z 1) and is sized to the whole wreath, so the wreath reads as a ring on a black medallion. The wreath art has only a small open centre (about 150 px of 640), so the live
   words (z 2, above the wreath) cannot sit on the circle alone: they take a black outline (the heading recipe) and a very soft feathered shade, never an edge, so no circle shape lies over the foliage. */
.gd51-cover-art::before{left:50%;top:50%;width:96%}
.gd51-cover-text::before{display:block;inset:-10%;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.66) 0,rgba(0,0,0,.52) 42%,rgba(0,0,0,0) 70%);box-shadow:none}
.gd51-cover-text :is(.gd51-cover-market,.gd51-cover-edition),body.om-mvp .gd51-cover .gd51-cover-date{-webkit-text-stroke:.14em #000;paint-order:stroke fill;text-shadow:none}
.gd51-cover-market{font-size:clamp(13px,2.9cqw,20px)!important}
.gd51-cover-title{font-size:clamp(24px,6.3cqw,46px)!important;line-height:1!important;white-space:nowrap;text-wrap:nowrap!important;margin:.12em 0 .08em!important}
.gd51-cover-edition{font-size:clamp(13px,2.9cqw,20px)!important}
body.om-mvp .gd51-cover .gd51-cover-date{font-size:clamp(22px,5.4cqw,38px)!important}
@media(max-width:900px){.gd51-cover-text{width:66cqw;padding:2cqw}}

/* ---------- R. Rotating photo frames ---------- */
.gde-rotor{width:100%;min-width:0}
.gde-rot{position:absolute;inset:0;overflow:hidden;background:#0b0b0b}
.gde-rot:focus-visible{outline:3px solid #68f8b3;outline-offset:-3px}
html body .omf.b59b>.omf__photo>.gde-rot>img.gde-slide,.gde-slide{position:absolute!important;inset:0;width:100%!important;height:100%!important;max-width:none;object-fit:cover;opacity:0;transition:opacity .7s ease}
html body .omf.b59b>.omf__photo>.gde-rot>img.gde-slide.is-on,.gde-slide.is-on{opacity:1}
.gde-frame{width:100%;max-width:100%;margin-inline:auto}
.gde-caption{display:inline-block;margin:6px 0 0;padding:6px 12px;border-radius:8px;background:rgba(10,10,10,.92);font:700 13px/1.35 "OMHM Tomorrow",sans-serif;letter-spacing:.04em;color:#68f8b3}
@media(prefers-reduced-motion:reduce){.gde-slide{transition:none!important}}

/* ---------- Hotel: the lockup in the arrival box, the one frame at the right ---------- */
.gde-two-days{margin:0 0 6px}
.gde-two-days img{display:block;width:100%;max-width:340px;height:auto;aspect-ratio:3/2;margin:0 auto 0 -6px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
.gde-hotel-group{display:flex;flex-direction:column;justify-content:center}
.gde-hotel-group .gde-frame--hotel{max-width:none;width:100%}
/* Wave G (F-G2): the pair is two boxes of equal height. The arrival box (lockup and copy) is one column of the grid, the photograph box the other; the grid stretches both to the taller, and the frame and its caption sit centered in the photograph box on its own ornament wall. */
.gd51-hotel-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}
.gd51-hotel-grid>.gd51-arrival{margin-bottom:0}
.gde-hotel-box{position:relative;isolation:isolate;overflow:hidden;box-sizing:border-box;align-items:center;gap:6px;padding:clamp(16px,2.2vw,32px);border:3px solid #000;border-radius:10px;background:#080808;--tb58-host-travel:16}
.gde-hotel-box>.gd52-clip{z-index:-1}
.gde-hotel-box>.gd52-clip::after{content:"";position:absolute;inset:0;background:rgba(5,5,5,.55);pointer-events:none}
.gd52-wall--hotelb{background-image:url('./art-20261003/ornament-wall-a-1600.webp');background-position:25% 45%}
@media(max-width:767px){.gd52-wall--hotelb{background-image:url('./art-20261003/ornament-wall-portrait-940.webp');background-position:50% 20%}}
.gde-hotel-box .gde-rotor{display:flex;flex-direction:column;align-items:center;width:100%}
.gde-hotel-box .gde-caption{align-self:center;text-align:center}
@media(max-width:900px){.gd51-hotel-grid{grid-template-columns:1fr}}
.gd51-arrival .gde-anchor,.gde-anchor{display:block;position:relative;top:0;height:0;width:0;overflow:hidden}
.gde-anchor{scroll-margin-top:calc(var(--om-header-h,96px) + 16px)}

/* ---------- S. Sip and Shop: ornament wall in the box, bold white text ---------- */
body.om-mvp .gd28-sip .gd51-board{position:relative;isolation:isolate;overflow:hidden;box-sizing:border-box;background:#080808;border:3px solid #000;border-radius:10px;padding:clamp(18px,2.2vw,32px);--tb58-host-travel:16}
/* Wave G (F-G3): the dark transparent support covers the whole section box (the wall shows through at about a quarter), not just the copy panel. */
.gd28-sip .gd51-board>.gd52-clip::after{content:"";position:absolute;inset:0;background:rgba(5,5,5,.74);pointer-events:none}
.gd28-sip .gd51-board>.gd52-clip{z-index:-1;border-radius:10px}
.gd52-wall--sip{background-image:url('./art-20261003/ornament-wall-a-1600.webp');background-position:78% 68%}
@media(max-width:767px){.gd52-wall--sip{background-image:url('./art-20261003/ornament-wall-portrait-940.webp');background-position:50% 40%}}
body.om-mvp .gd28-sip .gd28-copy{background:transparent;border:0;border-radius:0;box-shadow:none}
body.om-mvp .gd28-sip .gd28-copy :is(p,li,small,em,strong,span):not(.gd28-sr):not(.gd28-line){color:#fff!important;font-weight:700!important;opacity:1!important}
/* Wave G (F-G3): "While you shop" (capital W, Justin's words; the template capitalises the first letter only) in mint Backline. */
body.om-mvp .gd28-sip .gd28-copy .gd28-line{font-family:"OMHM Backline",cursive!important;font-weight:400!important;text-transform:none!important;color:#68f8b3!important;-webkit-text-fill-color:#68f8b3;opacity:1!important}
body.om-mvp .gd28-sip .gd28-copy h2,body.om-mvp .gd28-sip .gd28-copy [class*=script]{font-weight:inherit}

/* ---------- S. Session lockups: on the plaid, no wall and no support behind the heading ---------- */
.gd52-sessions{--gd52-stage-h:clamp(110px,10.4vw,150px)}
.gd52-stage--art{display:block;border:0!important;border-radius:0;padding:0;background:none;margin-bottom:8px}
.gd52-stage--art::before{display:none}
body.om-mvp .editorial-choices .editorial-choice .gd52-stage--art h2{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.gd52-stage--art .gd52-art-slot{inset:0;display:flex;align-items:center;justify-content:center}
.gd52-stage--art .gd52-art-slot img.gde-session-art{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
body.om-mvp .gd52-card.om41-support::before{--om41-support-radius:12px;inset:calc(var(--gd52-stage-h) + 8px) 0 0 0;border:2px solid #ef2435}
.gd52-card>.editorial-kicker{padding-top:calc(16px + 8px)}
@media(max-width:900px){.gd52-sessions{--gd52-stage-h:clamp(96px,26vw,140px)}}

/* ---------- W. Pick Your Window: Ohio icons for the dots, hours black with a mint outline ---------- */
.gd52-window .gd31-ladder li{grid-template-columns:minmax(0,1fr) 26px minmax(0,1.15fr)}
.gd52-window .gd31-ladder li::before{width:24px;height:26px;border-radius:0;background:#ef2435;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 100.4 108%27%3E%3Cpath d=%27M1.7 9.6 L30.6 8.8 L34.8 11.8 L41.2 14.6 L46.4 15.7 L51.7 18.5 L59.1 15.7 L67.5 15.2 L76.0 7.7 L84.4 5.2 L92.4 1.9 L92.4 38.8 L89.7 39.9 L85.5 52.3 L80.2 66.9 L73.9 74.4 L66.5 81.3 L61.2 85.4 L57.0 95.0 L48.5 100.0 L42.2 91.2 L31.7 92.3 L24.3 93.7 L12.7 89.5 L1.7 81.3 Z%27 fill=%27black%27 stroke=%27black%27 stroke-width=%274%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 100.4 108%27%3E%3Cpath d=%27M1.7 9.6 L30.6 8.8 L34.8 11.8 L41.2 14.6 L46.4 15.7 L51.7 18.5 L59.1 15.7 L67.5 15.2 L76.0 7.7 L84.4 5.2 L92.4 1.9 L92.4 38.8 L89.7 39.9 L85.5 52.3 L80.2 66.9 L73.9 74.4 L66.5 81.3 L61.2 85.4 L57.0 95.0 L48.5 100.0 L42.2 91.2 L31.7 92.3 L24.3 93.7 L12.7 89.5 L1.7 81.3 Z%27 fill=%27black%27 stroke=%27black%27 stroke-width=%274%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E") center/contain no-repeat;
  filter:drop-shadow(1.5px 0 0 #fff) drop-shadow(-1.5px 0 0 #fff) drop-shadow(0 1.5px 0 #fff) drop-shadow(0 -1.5px 0 #fff)}
/* Hours: black fill, mint #68f8b3 outline, the same recipe as Home's "Friday and Saturday" labels (stroke painted behind the fill), at .18em because these hours are about 22 px, a third of the size of Home's labels, where .12em leaves under 1.5 px of outline visible. */
.gd52-window .gd31-clock{color:#000!important;-webkit-text-fill-color:#000!important;-webkit-text-stroke:.18em #68f8b3;paint-order:stroke fill;text-shadow:none}
.gd52-window .gd31-clock .gd31-or{color:#000;-webkit-text-fill-color:#000}

/* ---------- P. Start with a Person: one row, the Backline line under it ---------- */
.gde-person{display:block;margin:0 0 64px}
.gde-person-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(24px,3.4vw,48px);align-items:center}
.gde-person-left{min-width:0;align-self:center}
body.om-mvp .gde-person-left>h2{margin:0 0 14px!important}
.gde-person-text{align-self:center}
.gde-person .gde-frame--person{max-width:none}
.gde-script{margin:clamp(14px,1.8vw,24px) 0 0!important;max-width:none!important;text-align:center!important;font:400 clamp(32px,3.2vw,48px)/1.1 "OMHM Backline",cursive!important;color:#68f8b3!important;-webkit-text-fill-color:#68f8b3;-webkit-text-stroke:.12em #050505!important;paint-order:stroke fill;text-shadow:none}
@media(max-width:899px){.gde-person-row{grid-template-columns:1fr}.gde-person{margin-bottom:48px}}

/* ---------- Photos with Santa: the gallery wall (wave G, F-G4) ---------- */
.gde-feature{margin:0 0 64px}
body.om-mvp .gde-feature>h2{margin:0 0 18px!important}
.gde-box{position:relative;box-sizing:border-box;border:3px solid #000;border-radius:10px;background:rgba(5,5,5,.9)}
.gde-wallbox{isolation:isolate;overflow:hidden;padding:clamp(16px,2.2vw,32px) clamp(10px,1.6vw,24px) clamp(18px,2.4vw,32px);background:#080808;--tb58-host-travel:16}
.gde-wallbox>.gd52-clip{z-index:-1}
.gde-wallbox>.gd52-clip::after{content:"";position:absolute;inset:0;background:rgba(5,5,5,.6);pointer-events:none}
.gd52-wall--santa{background-image:url('./art-20261003/ornament-wall-b-1600.webp');background-position:50% 50%}
@media(max-width:767px){.gd52-wall--santa{background-image:url('./art-20261003/ornament-wall-portrait-940.webp');background-position:50% 50%}}
/* five frames in one row at 1440, four, three, then two at phone widths; the slots past the count are not displayed (their photographs never load) */
.gde-wall{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(0px,.6vw,8px);align-items:center}
.gde-wall-slot{min-width:0}
.gde-wall .gde-frame--wall{max-width:none;width:100%}
@media(max-width:1099px){.gde-wall{grid-template-columns:repeat(4,minmax(0,1fr))}.gde-wall-slot:nth-child(n+5){display:none}}
@media(max-width:899px){.gde-wall{grid-template-columns:repeat(3,minmax(0,1fr))}.gde-wall-slot:nth-child(n+4){display:none}}
@media(max-width:599px){.gde-wall{grid-template-columns:repeat(2,minmax(0,1fr))}.gde-wall-slot:nth-child(n+3){display:none}}
.gde-wall-copy{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px clamp(18px,3vw,40px);margin:clamp(8px,1.4vw,18px) 0 0;text-align:center}
.gde-wall-copy>p{margin:0;max-width:60ch;color:#fff;font-weight:700}
.gde-wall-copy .editorial-actions{margin:0}
@media(max-width:899px){.gde-feature{margin-bottom:48px}}

/* ---------- The floor plan, directly above Meet the Makers ---------- */
.gde-floor{margin:0 0 64px;display:flex;justify-content:center}
.gde-floor .gd51-floorplan{max-width:640px}

/* ---------- G7 (wave G, Justin 2026-10-07: "change the red outlines on all the boxes to black ... including on the shopping guide page"): every Guide box takes the black 3 px edge, 10 px corners ----------
   The earlier sheets draw the red edges (2 px borders, a 3 px red top bar, a 1 px red ring in box-shadow, a red glow). One block here states the new edge for each box once, so the earlier sheets stay readable and the change is one place.
   The header, the footer and the ticket button are the site shell (the Home lane owns them) and are not Guide boxes. */
body.om-mvp .gde-hero .gde-well,
body.om-mvp .gd51-arrival.editorial-well,
body.om-mvp .editorial-capacity.gd31-time.editorial-well,
body.om-mvp .gd52-stay.editorial-well,
body.om-mvp .gd52-plan.editorial-well{border:3px solid #000!important;border-radius:10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1)!important}
body.om-mvp .gd51-arrival.editorial-well::before{border-top:0}
.gd51-contents::before{border:3px solid #000;border-radius:10px}
body.om-mvp .gd51-floorplan{border:3px solid #000;border-radius:10px}
body.om-mvp .gd52-card.om41-support::before{border:3px solid #000}
body.om-mvp .gd26-card{border:3px solid #000!important;border-radius:10px}
body.om-mvp .gde-hero .gde-well::after{box-shadow:none!important}
