/* Homepage sections (js/sections.js): header icon + accent per row, more air, a thin accent rule between sections,
   a merged "By area" row with a switch and lower-priority rows behind "See more". Mix + cinema themes. */
html.hs .rows>.row{--sec:#d9b26f;margin:0 0 6px;padding:30px 0 18px;position:relative}
html.hs .rows>.row+.row::before,html.hs .rows>.row+.hs-more::before{content:"";position:absolute;top:0;left:var(--pad);right:var(--pad);height:1px;background:linear-gradient(90deg,var(--sec) 0,color-mix(in srgb,var(--sec) 35%,transparent) 18%,rgba(255,255,255,.06) 60%,transparent)}
html.hs .rows>.row:first-of-type{padding-top:8px}
html.hs .row-head{align-items:center;gap:12px;margin-bottom:16px}
html.hs .row-head h2{display:flex;align-items:center;gap:11px}
.hs-ic{flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:color-mix(in srgb,var(--sec) 16%,transparent);border:1px solid color-mix(in srgb,var(--sec) 45%,transparent)}
.hs-ic svg{width:17px;height:17px;fill:none;stroke:var(--sec);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html.hs .row-sub{color:var(--muted)}
html.hs .row .card .num{color:var(--sec)}
.hs-hide{display:none!important}
.hs-more{position:relative;display:flex;justify-content:center;padding:26px var(--pad) 34px}
.hs-more button{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:var(--fg);font:600 14px Inter;cursor:pointer;transition:background .2s,border-color .2s}
.hs-more button:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3)}
.hs-more small{color:var(--muted);font-weight:500}
.hs-more svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;transition:transform .25s}
.hs-more[aria-expanded=true] svg{transform:rotate(180deg)}
html.hs .rows>.row.hs-rev{animation:hsIn .45s ease both}
@keyframes hsIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html.hs .rows>.row.hs-rev{animation:none}}
/* area tabs: the three region rows become one row with a switch */
.hs-areas{display:flex;gap:6px;margin-left:auto}
.hs-areas button{padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:none;color:var(--muted);font:600 12.5px Inter;cursor:pointer}
.hs-areas button[aria-pressed=true]{color:#0b0b0c;background:var(--sec);border-color:var(--sec)}
@media (max-width:760px){html.hs .rows>.row{padding:24px 0 12px}html.hs .row-head{flex-wrap:wrap}.hs-areas{margin-left:0;width:100%}}
/* editorial section + guide banners get the same rule */
html.hs .mx-ed,html.hs .mx-explore{position:relative;margin-top:28px}
html.hs .mx-ed::before,html.hs .mx-explore::before{content:"";position:absolute;top:0;left:var(--pad);right:var(--pad);height:1px;background:linear-gradient(90deg,#d9b26f,rgba(217,178,111,.25) 20%,transparent)}
.hs-anchor{display:block;position:relative;top:-90px;height:0;visibility:hidden}
.hs-areas button:focus-visible,.hs-more button:focus-visible{outline:2px solid var(--sec,#d9b26f);outline-offset:2px}
/* r71 everything: Big shows, bigger and taller. Wide lead card (image + overlay text) then tall poster cards; same row-wrap/track. */
#bigshows.bs2{--bsh:clamp(300px,82vw,330px)}
@media (min-width:900px){#bigshows.bs2{--bsh:380px}}
#bigshows.bs2 .bs-track{gap:12px;align-items:stretch}
#bigshows.bs2 .card.bs-c{width:calc(var(--bsh) * .72);background:#141317;overflow:hidden;display:flex;flex-direction:column}
#bigshows.bs2 .card.bs-lead{width:min(86vw,640px)}
#bigshows.bs2 .bs-img{aspect-ratio:auto;height:calc(var(--bsh) * .74);border-radius:var(--r) var(--r) 0 0;flex:none}
#bigshows.bs2 .bs-lead .bs-img{height:var(--bsh);border-radius:var(--r)}
#bigshows.bs2 .bs-txt{padding:10px 12px 12px;min-width:0}
#bigshows.bs2 .bs-lead .bs-txt{position:absolute;left:0;right:0;bottom:0;padding:60px 16px 16px;background:linear-gradient(180deg,transparent,rgba(8,8,10,.88) 55%);border-radius:0 0 var(--r) var(--r);z-index:2}
#bigshows.bs2 .bs-k{margin:0 0 4px;font:700 11px/1.2 var(--f-body,Inter,sans-serif);letter-spacing:.08em;text-transform:uppercase;color:#f2b66d}
#bigshows.bs2 .bs-c h3{font-size:16px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#bigshows.bs2 .bs-lead h3{font-size:clamp(20px,5.4vw,28px);letter-spacing:-.01em}
#bigshows.bs2 .bs-v{margin:4px 0 0;font-size:12.5px;color:var(--muted,#a9a39a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#bigshows.bs2 .bs-b{margin:6px 0 0;font-size:13px;color:#dcd6cc;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:620px){#bigshows.bs2 .bs-b{display:none}}
@media (hover:hover){#bigshows.bs2 .card.bs-c:hover{transform:translateY(-4px)}}
#bigshows.bs2 .card.bs-c .save{opacity:1}

/* r85 A2: no empty gap where a card has no description */
.card .blurb:empty{display:none}
/* r85 A5: search route cards + typo note */
.vs-route{display:flex;align-items:center;gap:10px;margin:6px 0 12px;padding:12px 14px;border-radius:14px;border:1px solid var(--line,rgba(255,255,255,.14));background:var(--card,rgba(255,255,255,.04));color:inherit;text-decoration:none}
.vs-route b{font-size:15px}.vs-route span{color:var(--muted,#9a958d);font-size:13px;flex:1;min-width:0}.vs-route i{font-style:normal;font-size:18px}
.vs-fix{margin:4px 0 8px;font-size:13.5px;color:var(--muted,#9a958d)}.vs-fix b{color:var(--fg,#f4f2ee)}
/* r85 B12: ?home=short */
.hs-xmore{margin:8px var(--pad,16px) 0}.hs-xmore>summary{cursor:pointer;list-style:none;padding:14px 16px;border-radius:14px;border:1px solid var(--line,rgba(255,255,255,.14));font:700 15px/1.2 var(--f-body,Inter,sans-serif)}
.hs-xmore>summary::-webkit-details-marker{display:none}.hs-xmore>summary::after{content:" ▾";opacity:.7}.hs-xmore[open]>summary::after{content:" ▴"}
.hs-xmore>.rows{margin:0 calc(-1 * var(--pad,16px))}
