@charset "UTF-8";
/**
 * Horizontal-scroll slider — front-end styles.
 *
 * Layout primitives:
 *
 *   .wp-block-group.is-content-slider                ← the wrapper
 *     .icp-cs-stage                                  ← view-mode container
 *       .icp-cs-viewport                             ← scrolling overflow
 *         .icp-cs-track                              ← flex row of cards
 *       .icp-cs-nav (when nav-position = absolute)   ← buttons inside stage
 *     .icp-cs-nav (when nav-position = inline)       ← buttons below stage
 *
 * View modifiers:
 *   .is-content-slider--view-overflow       stage breaks out to 100vw
 *   .is-content-slider--view-contained      stage stays at group's natural width
 *
 * Nav modifiers:
 *   .is-content-slider--nav-absolute        nav inside stage, abs-positioned at edges
 *   .is-content-slider--nav-inline          nav below stage; respects width + align
 *   .is-content-slider--nav-width-{content|wide|full}
 *   .is-content-slider--nav-align-{left|center|right|space-between}
 */
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider {
  display: block !important;
  grid-template-columns: unset !important;
  container-type: normal !important;
  box-sizing: border-box !important;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--nav-absolute {
  position: relative;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider {
  /* --------------------------------------------------------------
   * Stage — owns the view-mode dimensions.
   * -------------------------------------------------------------- */
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider > .icp-cs-stage {
  position: relative;
  box-sizing: border-box;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--view-overflow > .icp-cs-stage {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--view-contained > .icp-cs-stage {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--view-contained.is-content-slider--nav-absolute > .icp-cs-stage {
  max-width: calc(100vw - 2 * (max(var(--icp-slider-btn-size, 40px), 44px) + 2 * var(--wp--preset--spacing--30)));
  margin-left: auto;
  margin-right: auto;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider {
  /* --------------------------------------------------------------
   * Viewport — scrolling container.
   * -------------------------------------------------------------- */
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider > .icp-cs-stage > .icp-cs-viewport {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scroll-padding-left: var(--icp-anchor-left, 0px);
  scrollbar-width: none;
  touch-action: pan-y pinch-zoom;
  cursor: inherit;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider > .icp-cs-stage > .icp-cs-viewport::-webkit-scrollbar {
  display: none;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--view-contained > .icp-cs-stage > .icp-cs-viewport {
  overflow-y: hidden;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider {
  /* --------------------------------------------------------------
   * Track — flex row of cards.
   *
   * In overflow view, the track is padded by the anchor offsets so
   * the first/last cards align with the group's authored edges
   * while the viewport extends to the screen edges. In contained
   * view, anchors are zero (set in view.js) so the track sits flush
   * with the stage.
   * -------------------------------------------------------------- */
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider > .icp-cs-stage > .icp-cs-viewport > .icp-cs-track {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: var(--icp-slider-gap, var(--wp--style--block-gap, var(--wp--preset--spacing--50)));
  padding-left: var(--icp-anchor-left, 0px);
  padding-right: var(--icp-anchor-right, 0px);
  width: max-content;
  min-width: 100%;
  box-sizing: border-box;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider > .icp-cs-stage > .icp-cs-viewport > .icp-cs-track > * {
  flex: 0 0 min(480px, var(--icp-slide-base-width, 100%) / 1.5) !important;
  max-width: min(480px, var(--icp-slide-base-width, 100%) / 1.5);
  min-width: 0 !important;
  width: auto !important;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  box-sizing: border-box;
}
@media (min-width: 600px) {
  body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider > .icp-cs-stage > .icp-cs-viewport > .icp-cs-track > * {
    flex: 0 0 min(480px, var(--icp-slide-base-width, 100%) / 2.5) !important;
    max-width: min(480px, var(--icp-slide-base-width, 100%) / 2.5);
  }
}
@media (min-width: 1024px) {
  body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--mode-manual > .icp-cs-stage > .icp-cs-viewport > .icp-cs-track > * {
    flex: 0 0 calc((var(--icp-slide-base-width, 100%) - (var(--icp-slider-columns, 4) - 1) * var(--icp-slider-gap, var(--wp--style--block-gap, var(--wp--preset--spacing--50)))) / var(--icp-slider-columns, 4)) !important;
    max-width: calc((var(--icp-slide-base-width, 100%) - (var(--icp-slider-columns, 4) - 1) * var(--icp-slider-gap, var(--wp--style--block-gap, var(--wp--preset--spacing--50)))) / var(--icp-slider-columns, 4));
  }
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--mode-auto > .icp-cs-stage > .icp-cs-viewport > .icp-cs-track > * {
  flex: 0 0 var(--icp-slider-min-col-width, 240px) !important;
  max-width: var(--icp-slider-min-col-width, 240px);
  min-width: 0 !important;
  width: auto !important;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-dragging {
  cursor: grabbing;
  user-select: none;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-dragging > .icp-cs-stage > .icp-cs-viewport {
  scroll-snap-type: none;
  scroll-behavior: auto;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider:not(.is-dragging) > .icp-cs-stage > .icp-cs-viewport {
  cursor: grab;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--snap-off > .icp-cs-stage > .icp-cs-viewport {
  scroll-snap-type: none;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--snap-off > .icp-cs-stage > .icp-cs-viewport > .icp-cs-track > * {
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .wp-block-group.is-content-slider.is-content-slider--auto-scroll.is-content-slider--snap-off > .icp-cs-stage > .icp-cs-viewport {
  scroll-behavior: auto;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) {
  /* --------------------------------------------------------------
   * Navigation — shared button styles.
   * -------------------------------------------------------------- */
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .icp-cs-nav {
  display: flex;
  gap: 8px;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .icp-cs-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border-radius: 50%;
  border: 1.5px solid var(--icp-slider-btn-border, transparent);
  background: var(--icp-slider-btn-bg, transparent);
  color: var(--icp-slider-btn-color, var(--wp--preset--color--fg));
  cursor: pointer;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease;
  flex-shrink: 0;
  box-sizing: content-box;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .icp-cs-btn:hover:not(:disabled) {
  background: var(--icp-slider-btn-hover-bg, var(--icp-slider-btn-bg, transparent));
  border-color: var(--icp-slider-btn-hover-border, var(--icp-slider-btn-border, transparent));
  color: var(--icp-slider-btn-hover-color, var(--icp-slider-btn-color, var(--wp--preset--color--fg)));
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .icp-cs-btn:disabled {
  opacity: 0.3;
  cursor: default;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .icp-cs-btn svg {
  display: block;
  width: var(--icp-slider-btn-size, 18px);
  height: auto;
  stroke: currentColor;
  fill: none;
  stroke-width: var(--icp-slider-btn-stroke, 2);
  stroke-linecap: round;
  stroke-linejoin: round;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) {
  /* --------------------------------------------------------------
   * Absolute nav: buttons sit at the stage's left / right edges,
   * stretched to the FULL HEIGHT of the slider. The visual is
   * intentionally minimal by default — just the chevron icon, no
   * circular chrome, no border. The author can add a (semi-)
   * transparent background and/or a border colour via the
   * "Navigation buttons" Inspector controls to dial up visibility
   * against varied content.
   *
   * View-aware default positioning:
   *
   *   Contained view → buttons sit JUST OUTSIDE the stage edges
   *                    (prev's right edge at stage left edge, etc.).
   *                    The stage is the group's natural width, so the
   *                    buttons land in the page margin area, clear
   *                    of the cards.
   *
   *   Overflow view  → buttons sit AT the stage edges (= screen
   *                    edges). Cards in the track are padded inward
   *                    by --icp-anchor-left / right so they don't
   *                    extend to the screen edges; the buttons land
   *                    in that anchor space, clear of cards.
   *
   * The nav itself fills the stage (`inset: 0`) but is
   * `pointer-events: none` so only the buttons take clicks — the
   * middle of the slider remains draggable.
   * -------------------------------------------------------------- */
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-absolute > .icp-cs-stage > .icp-cs-nav {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  padding: 0;
  pointer-events: none;
  z-index: 2;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-absolute > .icp-cs-stage > .icp-cs-nav > .icp-cs-btn {
  pointer-events: auto;
  height: 100%;
  align-self: stretch;
  min-height: 0;
  border-radius: 0;
  border-color: var(--icp-slider-btn-border, transparent);
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-absolute > .icp-cs-stage > .icp-cs-nav > .icp-cs-btn svg {
  width: var(--icp-slider-btn-size, 40px);
  height: auto;
  stroke-width: var(--icp-slider-btn-stroke, 2.5);
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--view-contained.is-content-slider--nav-absolute > .icp-cs-stage > .icp-cs-nav > .icp-cs-btn {
  margin-left: var(--wp--preset--spacing--30);
  margin-right: var(--wp--preset--spacing--30);
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--view-contained.is-content-slider--nav-absolute > .icp-cs-stage > .icp-cs-nav > .icp-cs-prev {
  transform: translateX(calc(-100% - 2 * var(--wp--preset--spacing--30)));
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--view-contained.is-content-slider--nav-absolute > .icp-cs-stage > .icp-cs-nav > .icp-cs-next {
  transform: translateX(calc(100% + 2 * var(--wp--preset--spacing--30)));
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--view-overflow.is-content-slider--nav-absolute > .icp-cs-stage > .icp-cs-nav > .icp-cs-prev {
  transform: none;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--view-overflow.is-content-slider--nav-absolute > .icp-cs-stage > .icp-cs-nav > .icp-cs-next {
  transform: none;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) {
  /* --------------------------------------------------------------
   * Inline nav: in normal flow below the stage. Width + alignment
   * modifiers drive the horizontal positioning.
   *
   * The negative-margin breakout that used to widen inline nav past
   * the parent group was unwanted — in inline mode the nav lives
   * inside the slider's group, so it should track the group's own
   * width (set by the group's align toolbar) rather than try to break
   * out on its own. Width modifiers only set max-width / width;
   * alignment is purely flex justify-content.
   * -------------------------------------------------------------- */
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-inline > .icp-cs-nav {
  margin-top: var(--wp--preset--spacing--50);
  margin-left: auto;
  margin-right: auto;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-inline.is-content-slider--nav-width-content > .icp-cs-nav {
  max-width: var(--wp--style--global--content-size, 100%);
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-inline.is-content-slider--nav-width-wide > .icp-cs-nav {
  max-width: var(--wp--style--global--wide-size);
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-inline.is-content-slider--nav-width-full > .icp-cs-nav {
  max-width: 100vw;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-inline.is-content-slider--nav-align-left > .icp-cs-nav {
  justify-content: flex-start;
  margin-left: 0;
  margin-right: auto;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-inline.is-content-slider--nav-align-center > .icp-cs-nav {
  justify-content: center;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-inline.is-content-slider--nav-align-right > .icp-cs-nav {
  justify-content: flex-end;
  margin-left: auto;
  margin-right: 0;
}
body:not(.block-editor-iframe__body):not(.editor-styles-wrapper) .is-content-slider--nav-inline.is-content-slider--nav-align-space-between > .icp-cs-nav {
  justify-content: space-between;
}