/* A Dark Theme: content-width panel with photo panorama horizontal insets. */
.pattern-a-dark{
  --a-dark-inset:var(--space-6);
  width:100%;
  margin-inline:auto;
  overflow:hidden;
}
.pattern-a-dark .section-shell{
  width:100%;
  padding-inline:var(--a-dark-inset);
}
@media(min-width:768px){
  .pattern-a-dark{
    width:min(calc(100% - var(--gutter)*2),var(--content-max));
  }
}
@media(min-width:1024px){
  .pattern-a-dark{--a-dark-inset:var(--space-8)}
}
@media(min-width:1366px){
  .pattern-a-dark{--a-dark-inset:var(--space-12);padding-block:0}
  .pattern-a-dark .section-shell{padding-block:var(--space-8)}

  /* Three cards fit at this breakpoint; larger sets retain the shared carousel. */
  .pattern-a-dark .flow-carousel--peek:not(:has(.flow-slide:nth-child(4))) .flow-track{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(0,1fr);
  }
  .pattern-a-dark .flow-carousel--peek:not(:has(.flow-slide:nth-child(4))) .flow-track::after{display:none}
  .pattern-a-dark .flow-carousel--peek:not(:has(.flow-slide:nth-child(4))) .flow-viewport{
    overflow:visible;
    scroll-snap-type:none;
  }
  .pattern-a-dark .flow-carousel--peek:not(:has(.flow-slide:nth-child(4))) .flow-controls{display:none}
}
/* From 1600px the common A rules fit up to four cards without controls. */