/* Cinematic photo section adapted from the supplied motion-footer reference.
   Native CSS and the site's scroll reveals keep this static page self-contained. */
.bar-showcase {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: clamp(3rem, 7vw, 6rem);
  padding: clamp(2rem, 5vw, 4rem) clamp(.75rem, 2.5vw, 2rem) clamp(.75rem, 2.5vw, 2rem);
  border: 1px solid rgba(var(--accent-rgb), .22);
  border-radius: 24px;
  background: #050505;
}
.bar-showcase__ambient {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse 75% 35% at 25% 5%, rgba(var(--accent-rgb), .16), transparent),
    radial-gradient(ellipse 60% 35% at 100% 35%, rgba(163,166,152,.09), transparent);
}
.bar-showcase__ambient::after {
  content: "";
  position: absolute;
  inset: 0 0 65%;
  background-image: linear-gradient(rgba(238,233,227,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(238,233,227,.035) 1px, transparent 1px);
  background-size: 60px 60px;
  -webkit-mask-image: linear-gradient(transparent, #000 25%, transparent);
  mask-image: linear-gradient(transparent, #000 25%, transparent);
}
.bar-showcase__heading { position: relative; text-align: center; padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(2.5rem, 5vw, 4rem); }
.bar-showcase__wordmark {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: -1;
  pointer-events: none;
  font-family: var(--font-display);
  font-size: clamp(5rem, 19vw, 17rem);
  line-height: 1;
  letter-spacing: -.035em;
  color: rgba(238,233,227,.025);
  -webkit-text-stroke: 1px rgba(238,233,227,.07);
}
.bar-showcase__heading h2 {
  margin-top: 1rem;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2rem, 5.5vw, 4.6rem);
  line-height: 1.05;
  text-wrap: balance;
  color: var(--text);
  background: linear-gradient(180deg, var(--text) 30%, var(--accent));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.bar-showcase__photos { display: grid; gap: clamp(1.25rem, 3vw, 2.5rem); }
.bar-showcase__photo {
  overflow: hidden;
  border: 1px solid rgba(var(--accent-rgb), .25);
  border-radius: 16px;
  background: #000;
  box-shadow: 0 18px 50px -25px rgba(var(--accent-rgb), .2);
}
.bar-showcase__photo img { display: block; width: 100%; height: auto; }
.bar-showcase__coming-soon {
  display: grid;
  place-items: center;
  min-height: clamp(220px, 35vw, 420px);
  padding: 2rem 1rem;
  border: 1px solid rgba(var(--accent-rgb), .25);
  border-radius: 16px;
  background: radial-gradient(ellipse at center, rgba(var(--accent-rgb), .1), #000 75%);
}
.bar-showcase__coming-soon p {
  color: var(--accent-soft);
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 7vw, 5.5rem);
  letter-spacing: .06em;
  text-align: center;
}
.bar-slider.is-ready .bar-showcase__photos { touch-action: pan-y pinch-zoom; }
.bar-slider.is-ready .bar-showcase__photo { animation: bar-slide-in .3s ease-out; }
.bar-slider.is-ready .bar-showcase__photo img { aspect-ratio: 3 / 2; object-fit: contain; user-select: none; }
.bar-slider__controls { display: flex; align-items: center; justify-content: center; gap: clamp(1rem, 4vw, 3rem); padding: 1.25rem .25rem .25rem; }
.bar-slider__arrow {
  display: grid; place-items: center; flex: 0 0 48px; width: 48px; height: 48px;
  border: 1px solid rgba(var(--accent-rgb), .5); border-radius: 50%;
  color: var(--text); background: rgba(var(--accent-rgb), .1); font-size: 1.5rem;
  transition: background .2s, color .2s;
}
.bar-slider__arrow:hover { color: #000; background: var(--accent-soft); }
.bar-slider__pagination { min-width: 80px; text-align: center; }
.bar-slider__count { color: var(--accent-soft); font-size: .875rem; }
.bar-slider__dots { display: flex; flex-wrap: wrap; justify-content: center; }
.bar-slider__dot { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; }
.bar-slider__dot::before { content: ""; width: 7px; height: 7px; border-radius: 20px; background: var(--muted); transition: width .2s; }
.bar-slider__dot[aria-current="true"]::before { width: 22px; background: var(--accent-soft); }
@keyframes bar-slide-in { from { opacity: .4; } to { opacity: 1; } }
@media (max-width: 600px) {
  .bar-showcase { border-radius: 16px; }
  .bar-showcase__photo { border-radius: 10px; }
  .bar-showcase__heading { padding-inline: .4rem; }
}
@media (prefers-reduced-motion: reduce) {
  .bar-slider.is-ready .bar-showcase__photo { animation: none; }
  .bar-showcase [data-reveal] { opacity: 1; transform: none; transition: none; }
}