/* All In House — city guides. Loads after /yachts/assets/site.css and /destinations/assets/dest.css, and only adds
   what a guide needs. One page per city: every carousel we posted about it, unrolled in the order of a day.
   Each address is set the way the carousels set it: what it is, small, above; the name in Perandory caps; then the
   street and a few words. Ink, full white, nothing fixed, sticky or scroll-driven (aih-draft-3-rejected). */

/* a long city name stays on one line on a wide screen (ST BARTHS) */
@media (min-width:701px){.dhero__name--long{font-size:clamp(72px,10.5vw,172px)}}

/* the in-page index: the day's sections as plain links */
.gidx{display:flex;flex-wrap:wrap;gap:10px 32px;padding:22px var(--gut);border-bottom:1px solid var(--rule)}
.gidx a{font:600 12px/1 var(--text);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;padding:6px 0;border-bottom:1px solid transparent;white-space:nowrap}
.gidx a:hover{border-bottom-color:var(--white)}
/* on a phone the links wrap, so every one is in sight; a sideways-scrolling row hid the last ones (Django, 9 Oct 2026) */
@media (max-width:700px){
  .gidx{gap:4px 22px;padding-top:18px;padding-bottom:18px}
}

/* a board: the photograph beside the list, sides alternating as the carousels run */
.gsec{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,88px);align-items:center;padding:var(--pad) var(--gut) 0;scroll-margin-top:16px}
.gsec--r{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.gsec--r .gsec__img{order:2}
.gsec__img img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;background:var(--panel)}
.gsec__body>.title{margin-bottom:22px}
.gnote{font-size:17px;line-height:1.55;max-width:34rem;margin:-6px 0 26px}

/* a board with no photograph: the heading where the photograph would sit */
.gsplit{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,88px);padding:var(--pad) var(--gut) 0;scroll-margin-top:16px}
.gsplit .title{margin-bottom:18px}
.gsplit>div>p{font-size:17px;line-height:1.55;max-width:30rem}
.gsplit .runsheet,.gsplit .dates{margin-top:0;max-width:none}

/* the list */
.glist{list-style:none;border-top:1px solid var(--rule)}
.glist li{border-bottom:1px solid var(--rule);padding:16px 0 18px}
.glist--2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:36px}
.glist--3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:36px}
.g__what{font:600 11px/1.4 var(--text);letter-spacing:.22em;text-transform:uppercase}
.g__name{font:400 clamp(30px,2.7vw,40px)/.95 var(--display);text-transform:uppercase;margin-top:8px;text-wrap:balance}
.g__line{font-size:16px;line-height:1.5;margin-top:8px}

/* the New Year line-ups: a day, then who plays where, as the venues print it */
.gprog{border-top:1px solid var(--rule)}
.gday{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:18px;border-bottom:1px solid var(--rule);padding:13px 0 14px}
.gday h3{font:600 11px/2.3 var(--text);letter-spacing:.22em;text-transform:uppercase}
.gday ul{list-style:none}
.gday li{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.gday li+li{margin-top:4px}
.gday b{font:400 clamp(24px,2.1vw,30px)/1.15 var(--display);font-weight:400;text-transform:uppercase}
.gday span{font-size:15px;text-align:right}

/* where the guide comes from: every post, newest first */
.gfeed{padding:var(--pad) var(--gut) 0;scroll-margin-top:16px}
.gfeed>.title{margin-bottom:28px}
.gposts{list-style:none;border-top:1px solid var(--rule)}
.gposts a{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:15px 0 16px;border-bottom:1px solid var(--rule);text-decoration:none}
.gposts b{font:400 clamp(24px,2.2vw,32px)/1.1 var(--display);font-weight:400;text-transform:uppercase}
.gposts span{font:600 12px/1.4 var(--text);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.gposts a:hover b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}

/* the ledger that follows the dates brings its own top padding */
.ledger{scroll-margin-top:16px}

@media (max-width:900px){
  .glist--3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .gsec,.gsplit{grid-template-columns:1fr;gap:32px}
  .gsec--r .gsec__img{order:0}
  .glist--2,.glist--3{grid-template-columns:1fr}
}
@media (max-width:560px){
  .gday{grid-template-columns:1fr;gap:4px}
  .gday li{display:block}
  .gday li+li{margin-top:10px}
  .gday span{display:block;text-align:left;margin-top:2px}
  .gposts a{flex-direction:column;gap:4px}
}

/* the index: one row of four cities on a wide screen, two by two below that, one by one on a phone */
.gindex .grid3{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1100px){.gindex .grid3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.gindex .grid3{grid-template-columns:1fr}}

/* a hero whose subject fills the top of a phone frame (the Arc in Paris): on a phone the words sit at the foot instead */
@media (max-width:700px){
  .dhero.dhero--low{place-items:end start}
  .dhero.dhero--low .hero__body{padding-top:0;padding-bottom:56px}
  .dhero.dhero--low.scrim::after{background:linear-gradient(0deg,rgba(10,10,11,.9) 0%,rgba(10,10,11,.62) 32%,rgba(10,10,11,0) 58%),linear-gradient(180deg,rgba(10,10,11,.55) 0%,rgba(10,10,11,0) 16%)}
}

/* the guides as slides (Paris, 9 Oct 2026): every cover as it ran, swiped like the feed, each opening its post.
   Built on the site's rail (site.css) and its arrows (site.js); the next cover always peeks in at the edge. */
.gslides .rail__track{grid-auto-columns:min(72vw,312px);gap:20px}
.gslide .card__frame{aspect-ratio:4/5}
.gslide .card__name{font-size:clamp(22px,1.9vw,28px);line-height:1.02;margin-top:16px;text-wrap:balance}
.gslide .card__meta{font:600 11px/1.4 var(--text);letter-spacing:.2em;text-transform:uppercase;margin-top:8px}
.gslide:focus-visible{outline:2px solid var(--white);outline-offset:4px}
@media (max-width:700px){
  .gslides .rail__head{margin-bottom:28px}
  .gslides .arrows{display:none}
}