/* Approved JAANUU thumbnail gallery, shared by the final site and previews. */
.spotlight-gallery-frame { container-type: inline-size; }
.sl-card { justify-content: flex-start; padding: 17px; }
.sl-card .bc-video-label { max-width: none; margin: 20px 0 22px; font-size: 29px; min-height: 62px; }
.sl-card .sl-video-links { margin-top: auto; display: grid; gap: 8px; }
[data-link-style="thumbnails"] .bc-gallery-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas: "launch haul event" "launch audio audio";
  align-items: stretch;
}
[data-link-style="thumbnails"] [data-video-group="0"] { grid-area: haul; }
[data-link-style="thumbnails"] [data-video-group="1"] { grid-area: launch; }
[data-link-style="thumbnails"] [data-video-group="2"] { grid-area: event; }
[data-link-style="thumbnails"] [data-video-group="3"] { grid-area: audio; }
[data-link-style="thumbnails"] .sl-card { min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto 1fr; justify-content: normal; }
[data-link-style="thumbnails"] .sl-card .bc-video-label { min-height: 0; margin-bottom: 20px; }
[data-link-style="thumbnails"] .sl-video-links { margin-top: 0; grid-auto-rows: minmax(min-content, 1fr); }
[data-link-style="thumbnails"] [data-video-group="3"] .sl-video-links { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sl-watch { display: flex; gap: 9px; align-items: center; min-width: 0; text-decoration: none; color: #693c50; border: 1px solid #693c5029; border-radius: 11px; background: #fffaf78f; padding: 8px; transition: background .2s, transform .2s, box-shadow .2s; }
.sl-watch:hover { color: #693c50; background: #fffaf7; transform: translateY(-2px); box-shadow: 0 4px 12px #693c5017; }
.sl-watch-copy { display: flex; gap: 8px; align-items: center; min-width: 0; }
.sl-watch strong { display: block; font-size: 12px; font-weight: 600; line-height: 1.3; }
.sl-watch small { display: block; margin-top: 3px; font-size: 10px; opacity: .75; }
.sl-arrow { font-size: 15px; margin-left: auto; }
.sl-inline-play { width: 25px; height: 25px; background: #693c50; color: #fff8f1; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.sl-inline-play svg { width: 14px; height: 14px; }
.sl-watch-buttons { padding: 10px; }
.sl-thumb { position: relative; display: block; width: 43px; height: 56px; border-radius: 6px; overflow: hidden; flex-shrink: 0; }
.sl-photo { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; }
.sl-photo-0-0, .sl-photo-1-1, .sl-photo-1-3, .sl-photo-3-1 { object-position: 64% 45%; }
.sl-photo-2-0, .sl-photo-2-1 { object-position: 50% 72%; }
.sl-thumb-play { position: absolute; inset: 0; display: grid; place-items: center; background: #3d203123; color: white; }
.sl-thumb-play svg { width: 21px; height: 21px; filter: drop-shadow(0 1px 3px #301e31a0); }
.bc-video-wine .sl-watch { background: #fff5f91a; border-color: #fff5f94d; color: #fff5f9; }
.bc-video-wine .sl-watch:hover { background: #fff5f92f; color: white; }
.bc-video-wine .sl-inline-play { background: #fff5f9; color: #8d405f; }
.brand-case-study .bc-video-wine .sl-watch:focus-visible { outline-color: #fff5f9; }

@container (max-width: 760px) {
  [data-link-style="thumbnails"] { padding: 26px 18px; }
  [data-link-style="thumbnails"] .bc-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "launch haul" "launch event" "audio audio"; gap: 12px; }
  [data-link-style="thumbnails"] .bc-gallery-intro { display: block; position: relative; }
  [data-link-style="thumbnails"] .bc-gallery-intro h2 { padding-right: 80px; font-size: 32px; }
  [data-link-style="thumbnails"] .bc-gallery-photo { position: absolute; top: 0; right: 0; width: 64px; margin: 0; }
  [data-link-style="thumbnails"] .bc-gallery-photo > span { width: 20px; height: 20px; top: -8px; right: -7px; }
  [data-link-style="thumbnails"] .bc-description { font-size: 14px; }
  [data-link-style="thumbnails"] .bc-tags { margin: 16px 0 22px; }
  [data-link-style="thumbnails"] .sl-card { padding: 12px; }
  [data-link-style="thumbnails"] .sl-card .bc-video-top { font-size: 8px; letter-spacing: 0; }
  [data-link-style="thumbnails"] .sl-card .bc-video-label { font-size: 24px; margin-top: 18px; }
  [data-link-style="thumbnails"] .sl-watch { gap: 6px; padding: 7px; border-radius: 8px; }
  [data-link-style="thumbnails"] .sl-watch-copy { gap: 5px; }
  [data-link-style="thumbnails"] .sl-watch strong { font-size: 10px; }
  [data-link-style="thumbnails"] .sl-watch small { font-size: 9px; }
  [data-link-style="thumbnails"] .sl-arrow { display: none; }
  [data-link-style="thumbnails"] .sl-thumb { width: 30px; height: 43px; }
  [data-link-style="thumbnails"] [data-video-group="3"] .sl-watch { flex-direction: column; align-items: stretch; }
  [data-link-style="thumbnails"] [data-video-group="3"] .sl-thumb { width: 100%; height: 72px; }
  [data-link-style="thumbnails"] [data-video-group="3"] .sl-watch-copy { padding: 3px 0; }
  [data-link-style="thumbnails"] [data-video-group="3"] .sl-watch strong { font-size: 11px; }
  [data-link-style="thumbnails"] .bc-gallery-footer { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .brand-case-study .sl-watch { transition: none; }
  .brand-case-study .sl-watch:hover { transform: none; }
}
