/* Nightlife guide: one owner, no legacy section/card/fold classes. */
.nightGuide { width: min(1240px, calc(100% - 40px)); margin: 24px auto 40px; }
.nightGuide :where(section, article, aside, div, figure, nav) { min-width: 0; }
.nightGuide :where(h1,h2,h3,p,figure) { margin: 0; }
.nightGuide :where(p,li) { font-size: 15px; line-height: 1.65; }
.nightGuide :where(h2) { font-size: clamp(22px,2.2vw,29px); line-height: 1.2; }
.nightGuide :where(h3) { font-size: 19px; line-height: 1.25; }
.nightGuide :where(a,summary) { -webkit-tap-highlight-color: transparent; }
.nightGuide :where(section,details) { scroll-margin-top: 100px; }
.nightGuide .nightKicker { display: block; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.nightHero,.nightDesk { --tgz376-text2: #fff9ee; --tgz376-muted: #dbe9e2; --tgz376-copper2: #ffc078; --tgz377-mint: #fff9ee; --tgz379-mint: #fff9ee; color: #fff9ee; background: #113e45; }
.nightHero { display: grid; grid-template-columns: 1.2fr 1fr; border-radius: 24px; overflow: hidden; }
.nightHeroCopy { padding: clamp(24px,3.5vw,44px); align-self: center; }
.nightHero .nightKicker,.nightDesk .nightKicker { color: #ffc078; }
.nightHero h1 { color: #fff9ee; font-size: clamp(32px,3.5vw,49px); line-height: 1.06; letter-spacing: -.045em; margin-block: 14px 18px; max-width: 20ch; }
.nightHero p { color: #e1ece5; max-width: 57ch; }
.nightActions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.nightGuide .nightButton { --tgz376-copper2: var(--sc-ink); --tgz377-mint: var(--sc-ink); --tgz379-mint: var(--sc-ink); display: inline-flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding: 12px 16px; border: 1px solid var(--sc-line); border-radius: 10px; background: var(--sc-paper); color: var(--sc-ink); box-shadow: 0 3px 0 var(--sc-line); text-decoration: none; font-size: 14px; line-height: 1.4; font-weight: 750; }
.nightGuide .nightPrimary { --tgz376-copper2: #113e45; --tgz377-mint: #113e45; --tgz379-mint: #113e45; color: #113e45; background: #ffc078; border-color: #c58a50; box-shadow: 0 3px 0 #b5743b; }
.nightGuide .nightGhost { --tgz376-copper2: #fff9ee; --tgz377-mint: #fff9ee; --tgz379-mint: #fff9ee; color: #fff9ee; background: #285159; border-color: #789690; box-shadow: 0 3px 0 #082d34; }
.nightButton:hover { filter: brightness(1.06); }
.nightButton:active { transform: translateY(2px); box-shadow: none; }
.nightPhoto { position: relative; margin: 12px; margin-inline-start: 0; min-height: 330px; overflow: hidden; border-radius: 16px; background: #285159; }
.nightPhoto img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; }
.nightPhoto .tgzPhotoCredit { position: absolute; bottom: 0; inset-inline: 0; padding: 12px; background: #082d34e8; color: #fff9ee; font-size: 11px; }
.nightPhoto .tgzPhotoCredit a { color: #fff9ee; text-decoration: underline; }
.nightJump { display: flex; flex-wrap: wrap; column-gap: 24px; padding-block: 8px; border-bottom: 1px solid var(--sc-line); }
.nightJump a { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; color: var(--sc-ink); font-weight: 700; text-decoration: none; }
.nightJump a:hover,.nightTextLink:hover { text-decoration: underline; text-underline-offset: 4px; }
.nightSection { padding-block: 26px; }
.nightSection > h2 { margin-bottom: 18px; }
.nightSection > .nightKicker { color: var(--sc-muted); margin-bottom: 8px; }
.nightChoices { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.nightChoice { display: flex; flex-direction: column; align-items: flex-start; padding: 22px; background: var(--sc-paper); border: 1px solid var(--sc-line); border-radius: 16px; }
.nightNumber { color: var(--sc-muted); font-size: 12px; letter-spacing: .1em; font-weight: 800; margin-bottom: 12px; }
.nightChoice p { color: var(--sc-muted); margin-block: 12px; }
.nightGuide .nightTextLink { display: inline-flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 44px; color: var(--sc-ink); font-size: 14px; font-weight: 750; text-decoration: underline; text-underline-offset: 4px; }
.nightChoice .nightTextLink { margin-top: auto; }
.nightColumns { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,360px); gap: clamp(28px,5vw,68px); border-top: 1px solid var(--sc-line); }
.nightEditorial > .nightSection + .nightSection { border-top: 1px solid var(--sc-line); }
.nightMuted { color: var(--sc-muted); margin-block: -4px 16px; }
.nightGuide .nightDetail { padding: 0; margin: 0; border: 0; border-bottom: 1px solid var(--sc-line); border-radius: 0; background: transparent; box-shadow: none; }
.nightDetail summary { display: flex; align-items: center; gap: 12px; padding: 17px 0; min-height: 58px; list-style: none; cursor: pointer; color: var(--sc-ink); font-size: 16px; font-weight: 750; }
.nightDetail summary::-webkit-details-marker { display: none; }
.nightZoneNumber { font-size: 11px; font-weight: 500; color: var(--sc-muted); }
.nightPlus { margin-inline-start: auto; font-size: 23px; line-height: 1; font-weight: 400; }
.nightDetail[open] .nightPlus { transform: rotate(45deg); }
.nightDetailBody { padding: 0 0 20px; color: var(--sc-muted); max-width: 70ch; }
.nightDetailBody p { margin: 0; }
.nightDetailBody .nightTextLink { margin-top: 6px; }
.nightVenues { display: grid; grid-template-columns: max-content minmax(0,1fr); gap: 8px 14px; margin: 14px 0; }
.nightVenues dt { margin: 0; color: var(--sc-ink); font-weight: 750; }
.nightVenues dd { margin: 0; }
.nightGuide .nightSources { margin-top: 16px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: 13px; color: var(--sc-muted); }
.nightSources summary { cursor: pointer; min-height: 44px; padding-block: 12px; }
.nightSources a { display: inline-block; padding-block: 10px; color: var(--sc-ink); text-decoration: underline; }
.nightSources ul { margin: 0; padding-inline-start: 20px; }
.nightAlcohol p { margin-block: 14px; max-width: 70ch; color: var(--sc-muted); }
.nightAside { padding-top: 26px; }
.nightDesk { padding: 26px; border-radius: 18px; }
.nightDesk h2 { color: #fff9ee; margin-block: 12px; }
.nightDesk p { color: #e1ece5; }
.nightSteps { margin-block: 20px; padding-inline-start: 22px; }
.nightSteps li { padding-inline-start: 4px; margin-block: 8px; color: #e1ece5; }
.nightDesk .nightButton { width: 100%; }
.nightDesk .nightDeskNote { font-size: 12px; margin-top: 16px; }
.nightRide,.nightStay { padding-block: 24px; border-bottom: 1px solid var(--sc-line); }
.nightRide .nightKicker { color: var(--sc-muted); margin-bottom: 10px; }
.nightRide h2,.nightStay h2 { font-size: 22px; margin-bottom: 12px; }
.nightRide p,.nightStay p { color: var(--sc-muted); margin-bottom: 14px; }
.nightNext { border-top: 1px solid var(--sc-line); }
.nightNextLinks { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.nightNextLinks a { display: grid; gap: 8px; padding: 16px 0; color: var(--sc-ink); text-decoration: none; }
.nightNextLinks strong { display: flex; justify-content: space-between; gap: 12px; font-size: 16px; }
.nightNextLinks a > span { color: var(--sc-muted); font-size: 14px; line-height: 1.5; }
.nightNextLinks a:hover strong { text-decoration: underline; }
/* On the teal hero and desk the site's focus ring (copper) is under 3:1: there it is the amber of the kit. */
.nightGuide :is(.nightHero,.nightDesk) :focus-visible { outline-color: #ffc078; }
html[dir=rtl] .nightGuide :is(h1,.nightKicker) { letter-spacing: 0; }
/* The arrows are characters, so right-to-left has to turn them: "→" after an Arabic label pointed backwards. */
html[dir=rtl] .nightGuide :is(.nightButton,.nightTextLink,.nightNextLinks strong) > span[aria-hidden] { transform: scaleX(-1); }
@media (max-width: 900px) {
  .nightGuide { width: calc(100% - 32px); margin-top: 16px; }
  .nightHero { grid-template-columns: 1.3fr 1fr; }
  .nightHeroCopy { padding: 24px; }
  .nightColumns { grid-template-columns: minmax(0,1fr) minmax(250px,.8fr); gap: 24px; }
  .nightChoice { padding: 16px; }
  .nightDesk { padding: 20px; }
}
@media (max-width: 680px) {
  .nightGuide { width: calc(100% - 24px); margin: 12px auto 24px; }
  .nightHero { grid-template-columns: 1fr; border-radius: 18px; }
  .nightHeroCopy { padding: 24px 20px; }
  .nightHero h1 { font-size: 34px; max-width: 22ch; }
  .nightActions { gap: 12px; margin-top: 20px; }
  .nightActions .nightPrimary { width: 100%; }
  .nightPhoto { margin: 0 12px 12px; min-height: 160px; height: 160px; border-radius: 10px; }
  .nightJump { column-gap: 18px; }
  .nightChoices,.nightColumns,.nightNextLinks { grid-template-columns: 1fr; }
  .nightChoices { gap: 0; border-top: 1px solid var(--sc-line); }
  .nightChoice { display: grid; grid-template-columns: 24px minmax(0,1fr); gap: 8px 12px; padding: 18px 0; background: none; border: 0; border-bottom: 1px solid var(--sc-line); border-radius: 0; }
  .nightNumber { grid-row: 1 / 4; padding-top: 4px; margin: 0; }
  .nightChoice p { margin: 0; }
  .nightChoice .nightTextLink { justify-self: start; }
  .nightSection { padding-block: 22px; }
  .nightColumns { gap: 0; }
  .nightEditorial,.nightAside { display: contents; }
  .nightColumns #zones { grid-row: 1; }
  .nightColumns #night-desk { grid-row: 2; margin-block: 8px 0; }
  .nightColumns #getting-home { grid-row: 3; }
  .nightColumns #alcohol { grid-row: 4; }
  .nightColumns #night-faq { grid-row: 5; }
  .nightColumns .nightStay { grid-row: 6; }
  .nightColumns { border: 0; }
  .nightDesk { border-radius: 16px; }
  .nightSteps { margin-block: 16px; }
  .nightNextLinks { gap: 0; }
  .nightNextLinks a { border-bottom: 1px solid var(--sc-line); }
}