/* International-site case carousel, adapted to the criminal center palette. */
.page-index #cases { container-type: inline-size; overflow: hidden; }
.case-flow-rows {
  --case-flow-width: min(1440px, calc(100cqw - 80px));
  --case-edge-fade: clamp(48px, 6cqw, 96px);
  display: grid;
  gap: 20px;
  width: var(--case-flow-width);
  margin-left: calc((100% - var(--case-flow-width)) / 2);
}
.case-flow-row { min-width: 0; }
.case-flow-viewport {
  overflow-x: auto;
  overflow-y: hidden;
  padding-block: 4px;
  scrollbar-width: none;
  scroll-behavior: auto;
  /* Ease into the section background within the original carousel bounds. */
  --case-edge-mask: linear-gradient(90deg,
    transparent,
    rgb(0 0 0 / .104) calc(var(--case-edge-fade) * .2),
    rgb(0 0 0 / .352) calc(var(--case-edge-fade) * .4),
    rgb(0 0 0 / .648) calc(var(--case-edge-fade) * .6),
    rgb(0 0 0 / .896) calc(var(--case-edge-fade) * .8),
    #000 var(--case-edge-fade),
    #000 calc(100% - var(--case-edge-fade)),
    rgb(0 0 0 / .896) calc(100% - var(--case-edge-fade) * .8),
    rgb(0 0 0 / .648) calc(100% - var(--case-edge-fade) * .6),
    rgb(0 0 0 / .352) calc(100% - var(--case-edge-fade) * .4),
    rgb(0 0 0 / .104) calc(100% - var(--case-edge-fade) * .2),
    transparent);
  mask-image: var(--case-edge-mask);
  -webkit-mask-image: var(--case-edge-mask);
}
.case-flow-viewport::-webkit-scrollbar { display: none; }
.case-flow-track {
  position: relative;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 302px;
  gap: 18px;
  align-items: stretch;
}
.case-flow-track .case-result-card { min-height: 280px; }
.case-flow-track .case-result-meta { min-height: var(--flow-meta-height, 22px); }
.case-flow-track h3 { min-height: var(--flow-result-height, 0px); }
.case-flow-track strong { min-height: var(--flow-title-height, 0px); }
.case-flow-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
@media (max-width: 767px) {
  .case-flow-rows { --case-flow-width: calc(100cqw - 32px); --case-edge-fade: 24px; }
  .case-flow-track { grid-auto-columns: min(302px, calc(100cqw - 64px)); gap: 14px; }
  .case-flow-track .case-result-card { min-height: 250px; }
}
@media (prefers-reduced-motion: reduce) {
  .case-flow-track .case-result-card, .case-flow-track .case-result-card * { transition: none; }
}
