/* Layered, image-only clip gallery. Heights stay stable as CMS cards arrive. */
.clips-showcase-rail { padding: 20px 0 36px; max-width: 1440px; }
.clips-showcase-rail::before, .clips-showcase-rail::after { display: none; }
.clips-showcase .shortform-track {
  --clip-width: clamp(220px, 29vw, 340px);
  position: relative; display: block; width: 100%;
  height: calc(var(--clip-width) * 1.25 + 48px);
  padding: 0; animation: none; transform: none; touch-action: pan-y;
}
.clips-showcase .shortform-card:nth-child(n) {
  position: absolute; left: 50%; top: 20px; margin: 0;
  width: var(--clip-width); border: 0; border-radius: 16px;
  background: var(--brand-light-gray); overflow: hidden;
  box-shadow: 0 18px 40px rgba(16, 0, 33, .19);
  transform: translateX(calc(-50% + var(--clip-offset, 0) * 73%)) scale(var(--clip-scale, 1));
  opacity: var(--clip-opacity, 0); z-index: var(--clip-depth, 0);
  visibility: hidden; pointer-events: none;
  transition: transform .55s cubic-bezier(.22,.68,.2,1), opacity .4s ease;
}
.clips-showcase .shortform-card.is-visible { visibility: visible; pointer-events: auto; }
.clips-showcase .shortform-card .card-photo { aspect-ratio: 4 / 5; }
.clips-showcase .shortform-card .card-info { display: none; }
.clips-showcase .shortform-card .card-photo::after { background: linear-gradient(transparent 70%, rgba(16,0,33,.23)); }
.clips-showcase .shortform-card .card-play {
  top: 50%; left: 50%; bottom: auto; right: auto; transform: translate(-50%, -50%);
  width: 54px; height: 54px; background: rgba(255,255,255,.94);
  color: var(--brand-deep-purple); border: 0; backdrop-filter: none;
}
.clips-showcase .shortform-card .card-play svg { width: 17px; height: 17px; fill: currentColor; }
.clips-showcase .shortform-card:hover .card-play { transform: translate(-50%, -50%) scale(1.08); background: #fff; }
.clips-showcase .shortform-card:hover .card-photo img { transform: scale(1.025); }
.clips-showcase .shortform-card:focus-visible { outline: 3px solid var(--cyan); outline-offset: 5px; }
.clips-carousel-controls { display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 8px; color: var(--brand-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.clips-carousel-controls button { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid rgba(16,0,33,.16); border-radius: 50%; color: var(--brand-deep-purple); background: transparent; cursor: pointer; transition: background .2s; }
.clips-carousel-controls button:hover { background: #eeeaf2; }
.clips-carousel-controls button:focus-visible { outline: 3px solid var(--cyan); outline-offset: 3px; }
.clips-carousel-controls button:disabled { opacity: .3; cursor: default; }
@media (max-width: 760px) {
  .clips-showcase-rail { padding: 12px 0 20px; }
  .clips-showcase .shortform-track { --clip-width: clamp(200px, 59vw, 300px); }
}
@media (prefers-reduced-motion: reduce) {
  .clips-showcase .shortform-card:nth-child(n) { transition: none; }
}

/* Gallery-only presentation after the introductory copy was removed. */
body[data-page="home"] #shortform { padding: 32px 0 48px; }
body[data-page="home"] #shortform .clips-showcase-rail { margin-top: 0; }
@media(max-width:760px) {
  body[data-page="home"] #shortform { padding: 20px 0 32px; }
}