/* Progressive enhancement: the uninitialized track remains a usable native list. */
.training-gallery.is-looping {
  position: relative;
  margin-top: 31px;
  padding-block: 32px;
  scroll-padding-inline: 0;
  scroll-behavior: auto;
  overflow-anchor: none;
}
.is-looping .training-track {
  position: relative;
  gap: clamp(28px, 3.2vw, 48px);
  padding-inline: 0;
}
.is-looping .training-card {
  scroll-snap-align: center;
  transform: scale(var(--card-scale, 1));
  transform-origin: center;
}
.is-looping .training-card.is-current {
  z-index: 1;
  border-color: #626b70;
}
.power-section .gallery-bottom { margin-top: 0; }
.gallery-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 600px) {
  .training-gallery.is-looping { margin-top: 15px; padding-block: 26px; }
  .is-looping .training-track { gap: 27px; }
}

/* Portrait dashboards: stable scroll slots with a separate rotating surface. */
.insight-section { overflow: hidden; padding-bottom: 76px; }
.insight-gallery {
  position: relative;
  margin-top: 30px;
  padding-block: 30px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: var(--gutter);
  scrollbar-width: none;
  overflow-anchor: none;
}
.insight-gallery::-webkit-scrollbar { display: none; }
.insight-gallery:focus-visible { outline-offset: -5px; }
.insight-track {
  position: relative;
  display: flex;
  gap: 24px;
  width: max-content;
  margin: 0;
  padding: 0 max(var(--gutter), calc((100vw - var(--content)) / 2));
  list-style: none;
}
.insight-gallery.is-looping { scroll-padding-inline: 0; }
.is-looping .insight-track { padding-inline: 0; gap: 0; }
.insight-card {
  position: relative;
  flex: 0 0 auto;
  width: clamp(280px, 25vw, 350px);
  scroll-snap-align: center;
}
.is-looping .insight-card { margin-right: -48px; }
.insight-card-surface {
  border: 1px solid #dfe3e5;
  border-radius: 6px;
  background: white;
  overflow: hidden;
  transform-origin: center;
  transform: perspective(1200px) translate3d(var(--card-shift, 0px), 0, calc(var(--card-depth, 0px) * 2.2)) rotateY(var(--card-rotate, 0deg));
  backface-visibility: hidden;
  box-shadow: 0 12px 30px #20282e08;
}
.insight-card.is-current .insight-card-surface { border-color: #c9ced1; }
.insight-gallery.is-looping .insight-card { visibility: hidden; pointer-events: none; }
.insight-gallery.is-looping .insight-card.is-in-view { visibility: visible; pointer-events: auto; }
.insight-gallery.is-looping .insight-card-surface { opacity: var(--card-opacity, 0); }
.dashboard-open { display: block; cursor: zoom-in; }
.dashboard-open:focus-visible { outline-offset: -4px; }
.dashboard-image { display: block; aspect-ratio: 3 / 4; width: 100%; background: #fff; cursor: zoom-in; }
.dashboard-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.dashboard-image:focus-visible { outline-offset: -4px; }
.dashboard-caption { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid #edf0f1; padding: 0 12px 0 16px; min-height: 44px; }
.dashboard-caption h3 { font-size: 14px; font-weight: 500; letter-spacing: -.25px; }
.dashboard-zoom-icon { display: grid; place-items: center; width: 44px; height: 44px; color: var(--muted); }
.dashboard-caption svg { width: 20px; height: 20px; }
.dashboard-open:hover .dashboard-zoom-icon { color: var(--ink); }
.insight-section .gallery-bottom { margin-top: 3px; }
.insight-navigation { display: flex; align-items: center; gap: 22px; }
.insight-position { font-size: 12px; color: var(--muted); letter-spacing: .75px; font-variant-numeric: tabular-nums; }
.dashboard-viewer {
  width: min(1100px, calc(100vw - 48px));
  max-width: none;
  height: calc(100dvh - 48px);
  max-height: none;
  padding: 0;
  border: 1px solid #dce0e2;
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
}
.dashboard-viewer[open] { display: flex; flex-direction: column; }
.dashboard-viewer::backdrop { background: #1c242bd1; }
.viewer-toolbar { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 24px; border-bottom: 1px solid var(--line); }
.viewer-toolbar h2 { font-size: 18px; font-weight: 500; letter-spacing: -.4px; }
.viewer-toolbar > div { display: flex; align-items: center; gap: 20px; }
.viewer-zoom { display: grid; place-items: center; border: 0; background: none; color: var(--muted); width: 44px; min-height: 44px; padding: 6px; }
.viewer-zoom svg { width: 24px; height: 24px; }
.viewer-zoom[aria-pressed="true"] .zoom-plus { display: none; }
.viewer-canvas { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 16px; }
.viewer-canvas img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; margin-inline: auto; cursor: zoom-out; }
.viewer-canvas.is-zoomed img { width: max(100%, 1400px); max-width: none; max-height: none; }
@media (max-width: 600px) {
  .insight-section { padding-bottom: 54px; }
  .insight-gallery { margin-top: 20px; padding-block: 22px; }
  .insight-card { width: min(72vw, 300px); }
  .is-looping .insight-card { margin-right: -32px; }
  .dashboard-caption { padding: 0 6px 0 12px; }
  .dashboard-caption h3 { font-size: 13px; }
  .insight-navigation { gap: 13px; }
  .insight-section .gallery-bottom > p { max-width: 145px; }
  .dashboard-viewer { width: 100vw; height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  .viewer-toolbar { padding: 10px 16px; gap: 8px; }
  .viewer-toolbar h2 { font-size: 16px; }
  .viewer-toolbar > div { gap: 8px; }
  .viewer-zoom { font-size: 13px; }
  .viewer-canvas { padding: 10px; }
  .viewer-canvas.is-zoomed img { width: 1000px; }
}
@media (max-width: 350px) { .insight-position { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .insight-card-surface { transform: none; }
  .is-looping .insight-track { gap: 20px; }
  .is-looping .insight-card { margin-right: 0; }
}