/* Gulfalts tenant hero v4 (Tenants template, e.g. /tenants/club-15), over nh-tenant-v1.css.
   v4: no rules above the amenity strip (its own top line and the About section's top line are both dropped).
   v2: faux italic accent, tighter pills. v3: smaller photo (a rounded card inset from the edges), smaller amenity icons
   with half-height separators, and the Dock magnification on hover (ga-tenant-hero-v2.js).
   Split hero: copy on the off-white left (venue / name crumbs, category pill, large serif name with its last word in
   italic bronze, lead, "Visit website" and "Directions" pills) and the photo slideshow on the right, without its count,
   dots or logo (it still advances on its own). Below it, a strip of amenity icons that scrolls on its own and pauses
   under the pointer, for tenants listed in the script. */
html .tenant-hero { --ga-strip: clamp(112px, 14vh, 128px); display: flex; flex-direction: column; padding: 0; }
html .tenant-hero .tenant-hero_inner {
  max-width: none; margin: 0; display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); gap: 0;
  align-items: stretch; min-height: clamp(560px, calc(100svh - var(--ga-strip)), 980px);
}
html .tenant-hero:not(.ga-has-strip) .tenant-hero_inner { min-height: clamp(560px, 100svh, 980px); }
html .tenant-hero .tenant-hero_copy {
  align-content: center; gap: 22px;
  padding: calc(var(--header-h) + clamp(24px, 4vh, 48px)) clamp(20px, 2.4vw, 44px) clamp(40px, 6vh, 64px) clamp(24px, 5.2vw, 96px);
}

/* Crumbs: venue / name (the "Directory" step is left out). */
html .tenant-hero .tenant-crumbs_item:first-child { display: none; }
html .tenant-hero .tenant-crumbs_item:nth-child(2)::before { content: none; }
html .tenant-hero .tenant-crumbs_list { gap: 10px; font-size: .75rem; letter-spacing: .16em; color: #4b4b4b; }
html .tenant-hero .tenant-crumbs_item + .tenant-crumbs_item::before { margin-right: 10px; }
html .tenant-hero .tenant-crumbs [aria-current] { color: #4b4b4b; }

/* Category pill only (the venue is already in the crumbs). */
html .tenant-hero .tenant-tags_item:has(a.tenant-tag) { display: none; }
html .tenant-hero .tenant-tag.is-category {
  min-height: 0; padding: 9px 16px 8px; border: 1px solid rgba(16, 16, 16, .2); background: transparent;
  font-size: .75rem; font-weight: 500; letter-spacing: .14em; color: #101010;
}

/* Name */
html .tenant-hero .tenant-hero_title {
  font-size: clamp(4.25rem, 2.4rem + 5.8vw, 9.75rem); line-height: .92; letter-spacing: -.035em; margin: 6px 0 4px;
}
html .tenant-hero .tenant-hero_title .ga-accent,
html .tenant-hero .tenant-hero_title .ga-accent .reveal-word-inner {
  font-style: italic; font-synthesis: style; letter-spacing: -.05em; padding-right: .06em;
  background: linear-gradient(172deg, #b48a57 0%, #8c6235 48%, #5e3e1f 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
html .tenant-hero .tenant-hero_lead {
  max-width: 30ch; font-size: clamp(1.125rem, .95rem + .55vw, 1.5rem); font-weight: 300; line-height: 1.45; color: #1d1b19;
}

/* Actions */
html .tenant-hero .tenant-hero_actions { gap: 12px 14px; margin-top: clamp(12px, 3vh, 36px); }
html .tenant-hero .tenant-hero_action.primary-button {
  display: inline-flex; align-items: center; gap: 16px; min-height: 58px; padding: 0 24px; border: 0; border-radius: 999px;
  background: #101010; color: #fff; font-size: .75rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase;
  box-shadow: 0 14px 30px -14px rgba(16, 16, 16, .55);
}
html .tenant-hero .tenant-hero_action.primary-button::before { content: none; }
html .tenant-hero .tenant-hero_action .tenant-icon { display: none; }
html .tenant-hero .tenant-hero_action.primary-button::after { content: '\2192'; font-size: 1.05rem; letter-spacing: 0; transition: transform .4s cubic-bezier(.16, 1, .3, 1); }
html .tenant-hero .tenant-hero_action.primary-button:hover::after { transform: translateX(4px); }
html .tenant-hero .ga-directions {
  display: inline-flex; align-items: center; gap: 12px; min-height: 58px; padding: 0 20px 0 16px;
  border: 1px solid rgba(16, 16, 16, .22); border-bottom-width: 1px; border-radius: 999px; background: transparent;
  color: #101010; font-size: .75rem; font-weight: 500; line-height: 1.25; letter-spacing: .16em; text-transform: uppercase;
  transition: border-color .3s ease, background-color .3s ease;
}
html .tenant-hero .ga-directions:hover { border-color: #101010; background: rgba(16, 16, 16, .03); color: #101010; }
html .tenant-hero .ga-directions .tenant-icon { display: none; }
html .tenant-hero .ga-directions_car { width: 26px; height: 26px; flex: none; }
html .tenant-hero .ga-directions_text { display: grid; }
html .tenant-hero .ga-directions_arrow { margin-left: 6px; font-size: 1rem; letter-spacing: 0; transition: transform .4s cubic-bezier(.16, 1, .3, 1); }
html .tenant-hero .ga-directions:hover .ga-directions_arrow { transform: translateX(4px); }

/* Photos: full-bleed on the right, no count, dots or logo. The dots stay in the page (invisible): their progress bars
   are what moves the slideshow on. */
html .tenant-hero .tenant-show {
  height: auto; align-self: stretch; aspect-ratio: auto; border-radius: 28px;
  margin: calc(var(--header-h) + 12px) var(--gutter) clamp(20px, 3vh, 32px) 0;
}
html .tenant-hero .tenant-show_count, html .tenant-hero .tenant-show_logo { display: none; }
html .tenant-hero .tenant-show_dots { opacity: 0; pointer-events: none; }
html .tenant-hero .tenant-show_scrim { background: linear-gradient(180deg, rgba(16, 16, 16, .18) 0%, transparent 22%); }

/* Amenity strip */
html .ga-amen {
  position: relative; margin: 0 var(--gutter); overflow: hidden;
  -webkit-mask: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}
html .ga-amen_track { display: flex; width: max-content; animation: ga-amen-marquee var(--ga-amen-s, 40s) linear infinite; }
html .ga-amen_list { display: flex; margin: 0; padding: 0; list-style: none; }
html .ga-amen_item {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 14px;
  height: var(--ga-strip, 128px); padding: 18px clamp(28px, 2.8vw, 48px) 18px; box-sizing: border-box; gap: 10px;
}
html .ga-amen_item::after { content: ''; position: absolute; bottom: 32px; right: 0; width: 1px; height: 36px; background: rgba(16, 16, 16, .14); }
/* Icons sit low in the strip so the Dock magnification has room above them. */
html .ga-amen_icon {
  display: block; height: clamp(38px, 4.8vh, 44px); width: auto; max-width: none;
  transform-origin: 50% 100%; transition: transform .22s cubic-bezier(.2, .8, .2, 1); will-change: transform;
}
html .ga-amen_label { font-family: var(--body-font); font-size: .6875rem; font-weight: 400; line-height: 1; letter-spacing: .2em; text-transform: uppercase; color: #3a3733; white-space: nowrap; }
@keyframes ga-amen-marquee { to { transform: translateX(-50%); } }
/* With the strip in place, the About section below starts without its divider line. */
html .tenant-hero.ga-has-strip + .tenant-detail .tenant-detail_inner { border-top: 0; }
@media (hover: hover) and (pointer: fine) {
  html .ga-amen:hover .ga-amen_track { animation-play-state: paused; }
}
@media (prefers-reduced-motion: reduce) {
  html .ga-amen_track { animation: none; margin: 0 auto; }
  html .ga-amen_list[aria-hidden='true'] { display: none; }
}

@media (max-width: 991px) {
  html .tenant-hero .tenant-hero_inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@media (max-width: 767px) {
  html .tenant-hero { --ga-strip: 108px; }
  html .tenant-hero .tenant-hero_inner { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  html .tenant-hero:not(.ga-has-strip) .tenant-hero_inner { min-height: 0; }
  html .tenant-hero .tenant-hero_copy { padding: calc(var(--header-h) + 24px) var(--gutter) 32px; gap: 18px; }
  html .tenant-hero .tenant-hero_title { font-size: clamp(3.5rem, 2rem + 9vw, 5.5rem); }
  html .tenant-hero .tenant-hero_actions { gap: 12px; }
  html .tenant-hero .tenant-hero_action.primary-button, html .tenant-hero .ga-directions { min-height: 52px; }
  html .tenant-hero .tenant-show { height: auto; aspect-ratio: 1 / 1; margin: 0 var(--gutter) 20px; border-radius: 20px; }
  html .ga-amen { margin: 0; }
  html .ga-amen_item { padding: 14px 22px 16px; gap: 10px; }
  html .ga-amen_item::after { bottom: 29px; height: 30px; }
  html .ga-amen_icon { height: 38px; }
  html .ga-amen_label { font-size: .625rem; letter-spacing: .16em; }
}
