/**
 * GOTB Design Blocks — Stacking Cards
 * One stack: optional image left or right, optional title / text / button, fixed height.
 */

.gotb-stacking-cards {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  --gotb-stack-gap: 16px;
  --gotb-stack-spacing: 24px;
  --gotb-stack-offset: 0px;
  --gotb-stack-card-height: 420px;
  --gotb-stack-card-width: 92;
  --gotb-stack-padding: 32px;
  --gotb-stack-title-text-gap: 12px;
  --gotb-stack-text-button-gap: 16px;
}

/* Kadence rows/columns use overflow:clip for radius, which breaks sticky. Keep width inside the row. */
.wp-block-kadence-rowlayout:has(.gotb-stacking-cards),
.wp-block-kadence-column:has(.gotb-stacking-cards),
.kt-row-column-wrap:has(.gotb-stacking-cards),
.kb-row-layout-wrap:has(.gotb-stacking-cards),
.kt-inside-inner-col:has(.gotb-stacking-cards),
.kb-column-inner:has(.gotb-stacking-cards) {
  overflow: visible !important;
}

.gotb-stacking-cards-inner {
  width: 100%;
  max-width: 100%;
  isolation: isolate;
}

.gotb-stacking-card:nth-child(1) { --gotb-stack-index: 1; }
.gotb-stacking-card:nth-child(2) { --gotb-stack-index: 2; }
.gotb-stacking-card:nth-child(3) { --gotb-stack-index: 3; }
.gotb-stacking-card:nth-child(4) { --gotb-stack-index: 4; }
.gotb-stacking-card:nth-child(5) { --gotb-stack-index: 5; }
.gotb-stacking-card:nth-child(6) { --gotb-stack-index: 6; }
.gotb-stacking-card:nth-child(7) { --gotb-stack-index: 7; }
.gotb-stacking-card:nth-child(8) { --gotb-stack-index: 8; }
.gotb-stacking-card:nth-child(9) { --gotb-stack-index: 9; }
.gotb-stacking-card:nth-child(10) { --gotb-stack-index: 10; }

.gotb-stacking-cards:not(.gotb-stacking-cards--horizontal):not(.gotb-stacking-cards-editor) .gotb-stacking-cards-inner {
  padding-bottom: 0;
}

.gotb-stacking-card {
  position: sticky;
  top: 0;
  z-index: var(--gotb-stack-index, 1);
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  margin: 0 0 var(--gotb-stack-spacing, 24px);
}

.gotb-stacking-cards:not(.gotb-stacking-cards--horizontal):not(.gotb-stacking-cards-editor) .gotb-stacking-card {
  top: 0;
  align-items: center;
  height: 100vh;
  height: calc(100dvh + var(--gotb-stack-spacing, 0px));
  margin: 0;
}

.gotb-stacking-cards:not(.gotb-stacking-cards--horizontal):not(.gotb-stacking-cards-editor) .gotb-stacking-card:last-child {
  height: 100vh;
  height: 100dvh;
  margin-bottom: 0;
}

.gotb-stacking-cards:not(.gotb-stacking-cards--horizontal):not(.gotb-stacking-cards-editor) .gotb-stacking-card-inner {
  position: relative;
  top: calc(var(--gotb-stack-offset, 0px) + (var(--gotb-stack-index, 1) - 1) * var(--gotb-stack-gap, 16px));
}

.gotb-stacking-card-inner {
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  width: calc(var(--gotb-stack-card-width, 92) * 1%);
  max-width: 100%;
  height: var(--gotb-stack-card-height, 420px);
  overflow: hidden;
  text-decoration: none;
  color: #111;
  background: #fff;
  border-radius: var(--gotb-radius-lg, 12px);
  box-shadow: var(--gotb-shadow-lg, 0 10px 25px rgba(0, 0, 0, 0.12));
}

.gotb-stacking-card-inner:hover,
.gotb-stacking-card-inner:focus {
  color: inherit;
}

.gotb-stacking-cards--image-right .gotb-stacking-card-inner:has(.gotb-stacking-card-image) {
  flex-direction: row-reverse;
}

.gotb-stacking-card-image {
  flex: 0 0 48%;
  height: 100%;
  overflow: hidden;
  background: #eee;
}

.gotb-stacking-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gotb-stacking-card-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0;
  min-width: 0;
  padding: var(--gotb-stack-padding, 32px);
}

.gotb-stacking-card-inner:not(:has(.gotb-stacking-card-image)) .gotb-stacking-card-body {
  flex: 1 1 100%;
}

.gotb-stacking-card-title,
.editor-styles-wrapper .gotb-stacking-card-inner h3.gotb-stacking-card-title,
.gotb-stacking-card-inner h3.gotb-stacking-card-title {
  margin: 0;
  color: var(--gotb-stack-title-color, inherit);
  font-size: var(--gotb-stack-title-size, 28px) !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: normal;
  overflow-wrap: break-word;
}

.gotb-stacking-card-title:empty,
.gotb-stacking-card-content:empty {
  display: none;
}

.gotb-stacking-card-content,
.editor-styles-wrapper .gotb-stacking-card-inner .gotb-stacking-card-content {
  margin: 0;
  color: var(--gotb-stack-text-color, #444);
  font-size: var(--gotb-stack-text-size, 16px) !important;
  line-height: 1.6;
  font-weight: 400;
  overflow-wrap: break-word;
}

.gotb-stacking-card-title + .gotb-stacking-card-content,
.editor-styles-wrapper .gotb-stacking-card-inner .gotb-stacking-card-title + .gotb-stacking-card-content {
  margin-top: var(--gotb-stack-title-text-gap, 12px);
}

.gotb-stacking-card-btn-wrap,
.gotb-stacking-card-btn-wrap.wp-block-button {
  display: block;
  margin: 0;
}

.gotb-stacking-card-content + .gotb-stacking-card-btn-wrap,
.gotb-stacking-card-content + a.gotb-stacking-card-btn,
.gotb-stacking-card-title + .gotb-stacking-card-btn-wrap,
.gotb-stacking-card-title + a.gotb-stacking-card-btn,
.editor-styles-wrapper .gotb-stacking-card-inner .gotb-stacking-card-content + .gotb-stacking-card-btn-wrap,
.editor-styles-wrapper .gotb-stacking-card-inner .gotb-stacking-card-title + .gotb-stacking-card-btn-wrap {
  margin-top: var(--gotb-stack-text-button-gap, 16px);
}

.gotb-stacking-card-btn {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  max-width: 100%;
  margin-top: 0;
  text-decoration: none;
  cursor: pointer;
}

.gotb-stacking-card-btn.kb-btn-global-fill,
.gotb-stacking-card-btn.button:not(.button-style-secondary):not(.button-style-outline):not(.gotb-stacking-card-btn--custom) {
  background: var(--global-palette-btn-bg, #3182ce);
  color: var(--global-palette-btn, #fff);
}

.gotb-stacking-card-btn.button-style-secondary {
  background: var(--global-palette-btn-sec-bg, #edf2f7);
  color: var(--global-palette-btn-sec, #1a202c);
}

.gotb-stacking-card-btn.button-style-outline,
.gotb-stacking-card-btn.kb-btn-global-outline {
  background: var(--global-palette-btn-out-bg, transparent);
  color: var(--global-palette-btn-out, #3182ce);
}

.gotb-stacking-card-btn--custom {
  padding: var(--gotb-stack-btn-pad-y, 11px) var(--gotb-stack-btn-pad-x, 19px);
  border: none;
  border-radius: var(--gotb-stack-btn-radius, 4px);
  background: var(--gotb-stack-btn-bg, #111);
  color: var(--gotb-stack-btn-color, #fff);
  font-size: var(--gotb-stack-btn-size, 15px);
  font-weight: 600;
  line-height: 1;
}

.gotb-stacking-card-btn--custom:hover,
.gotb-stacking-card-btn--custom:focus {
  color: var(--gotb-stack-btn-color, #fff);
  opacity: 0.88;
}

/* Horizontal: page scroll drives a sideways track. Width follows the Kadence row, not the viewport. */
.gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) {
  height: calc(var(--gotb-stack-numcards, 3) * 85vh);
}

.gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-cards-pin {
  position: sticky;
  top: 0;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  display: flex;
  align-items: center;
  container-type: inline-size;
}

.gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-cards-inner {
  display: flex;
  flex-direction: row;
  align-items: center;
  will-change: transform;
  padding-left: calc((100 - var(--gotb-stack-card-width, 92)) * 0.5cqw + var(--gotb-stack-offset, 0px));
  padding-right: calc((100 - var(--gotb-stack-card-width, 92)) * 0.5cqw);
}

.gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-card {
  position: relative;
  top: auto;
  translate: none;
  flex: 0 0 calc(var(--gotb-stack-card-width, 92) * 1%);
  width: calc(var(--gotb-stack-card-width, 92) * 1%);
  flex: 0 0 calc(var(--gotb-stack-card-width, 92) * 1cqw);
  width: calc(var(--gotb-stack-card-width, 92) * 1cqw);
  margin: 0 var(--gotb-stack-spacing, 24px) 0 0;
}

.gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-card-inner {
  translate: none;
  transform: none;
  width: 100%;
}

.gotb-stacking-cards-editor .gotb-stacking-cards-inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  max-width: none;
  margin: 0 auto;
}

.gotb-stacking-cards-editor .gotb-stacking-card,
.gotb-stacking-cards-editor .gotb-stacking-card-editor,
.gotb-stacking-cards-editor.is-single-card [data-type="gotb/stacking-card"] {
  position: relative !important;
  top: auto !important;
  margin: 0 auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: stretch;
  width: 100%;
  translate: none !important;
}

.gotb-stacking-cards-editor .gotb-stacking-card-inner {
  translate: none !important;
  transform: none !important;
  height: var(--gotb-stack-card-height, 420px);
  width: calc(var(--gotb-stack-card-width, 92) * 1%);
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.gotb-stacking-cards-editor.is-single-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

.gotb-stacking-cards-editor.is-single-card .gotb-stacking-cards-inner {
  width: 100%;
  max-width: none;
  min-height: var(--gotb-stack-card-height, 420px);
  gap: 0;
  overflow: visible;
  align-items: center;
}

.gotb-stacking-cards-editor.is-single-card [data-type="gotb/stacking-card"] {
  display: none !important;
  width: 100%;
}

.gotb-stacking-cards-editor.is-single-card[data-active-card="1"] [data-type="gotb/stacking-card"]:nth-child(1),
.gotb-stacking-cards-editor.is-single-card[data-active-card="2"] [data-type="gotb/stacking-card"]:nth-child(2),
.gotb-stacking-cards-editor.is-single-card[data-active-card="3"] [data-type="gotb/stacking-card"]:nth-child(3),
.gotb-stacking-cards-editor.is-single-card[data-active-card="4"] [data-type="gotb/stacking-card"]:nth-child(4),
.gotb-stacking-cards-editor.is-single-card[data-active-card="5"] [data-type="gotb/stacking-card"]:nth-child(5),
.gotb-stacking-cards-editor.is-single-card[data-active-card="6"] [data-type="gotb/stacking-card"]:nth-child(6),
.gotb-stacking-cards-editor.is-single-card[data-active-card="7"] [data-type="gotb/stacking-card"]:nth-child(7),
.gotb-stacking-cards-editor.is-single-card[data-active-card="8"] [data-type="gotb/stacking-card"]:nth-child(8),
.gotb-stacking-cards-editor.is-single-card[data-active-card="9"] [data-type="gotb/stacking-card"]:nth-child(9),
.gotb-stacking-cards-editor.is-single-card[data-active-card="10"] [data-type="gotb/stacking-card"]:nth-child(10),
.gotb-stacking-cards-editor.is-single-card[data-active-card="11"] [data-type="gotb/stacking-card"]:nth-child(11),
.gotb-stacking-cards-editor.is-single-card[data-active-card="12"] [data-type="gotb/stacking-card"]:nth-child(12),
.gotb-stacking-cards-editor.is-single-card[data-active-card="13"] [data-type="gotb/stacking-card"]:nth-child(13),
.gotb-stacking-cards-editor.is-single-card[data-active-card="14"] [data-type="gotb/stacking-card"]:nth-child(14),
.gotb-stacking-cards-editor.is-single-card[data-active-card="15"] [data-type="gotb/stacking-card"]:nth-child(15) {
  display: flex !important;
}

.gotb-stacking-cards-editor.is-single-card.gotb-stacking-cards--horizontal .gotb-stacking-cards-inner {
  flex-direction: column;
  overflow: visible;
  max-width: none;
  padding: 0;
}

.gotb-stacking-cards-editor.is-single-card.gotb-stacking-cards--horizontal .gotb-stacking-card,
.gotb-stacking-cards-editor.is-single-card.gotb-stacking-cards--horizontal .gotb-stacking-card-editor {
  flex: none;
  width: 100%;
}

.gotb-stacking-cards-editor__nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0 0 12px;
}

.gotb-stacking-cards-editor__nav-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.gotb-stacking-cards-editor__nav-label {
  min-width: 7.5em;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: #1e1e1e;
}

.gotb-stacking-cards-editor__dots {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

.gotb-stacking-cards-editor__dot {
  width: 10px;
  height: 10px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #c3c4c7;
  cursor: pointer;
}

.gotb-stacking-cards-editor__dot.is-active {
  background: #1e1e1e;
}

.gotb-stacking-cards-editor.gotb-stacking-cards--horizontal:not(.is-single-card) {
  max-width: none;
}

.gotb-stacking-cards-editor.gotb-stacking-cards--horizontal:not(.is-single-card) .gotb-stacking-cards-inner {
  flex-direction: row;
  align-items: stretch;
  overflow-x: auto;
  overflow-y: hidden;
  max-width: none;
  padding: 8px 4px 20px;
  gap: var(--gotb-stack-gap, 24px);
  will-change: auto;
}

.gotb-stacking-cards-editor.gotb-stacking-cards--horizontal:not(.is-single-card) .gotb-stacking-card,
.gotb-stacking-cards-editor.gotb-stacking-cards--horizontal:not(.is-single-card) .gotb-stacking-card-editor {
  flex: 0 0 min(86%, 900px);
  width: min(86%, 900px);
  display: flex !important;
}

.gotb-stacking-cards-editor.gotb-stacking-cards--horizontal:not(.is-single-card) .gotb-stacking-card-inner {
  width: 100%;
}

.gotb-stacking-cards-editor__hint {
  margin: 0 0 8px;
  font-size: 12px;
  color: #757575;
}

.gotb-stacking-card-editor .gotb-stacking-card-title,
.gotb-stacking-card-editor .gotb-stacking-card-content {
  min-height: 1.4em;
}

.gotb-stacking-card-editor .gotb-stacking-card-title:empty,
.gotb-stacking-card-editor .gotb-stacking-card-content:empty {
  display: block;
}

.gotb-stacking-card-editor .gotb-stacking-card-btn {
  min-height: 1em;
}

.gotb-stacking-cards-add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 12px auto 0;
  padding: 8px 14px;
  border: 1px dashed #c3c4c7;
  border-radius: 4px;
  background: #fff;
  color: #1e1e1e;
  cursor: pointer;
  font-size: 13px;
}

.gotb-stacking-cards-add:hover {
  border-color: #1e1e1e;
}

/* Kadence tablet: 1024px. Stack image above text; do not keep the desktop card height. */
@media (max-width: 1024px) {
  .gotb-stacking-card-inner,
  .gotb-stacking-cards--image-right .gotb-stacking-card-inner:has(.gotb-stacking-card-image),
  .gotb-stacking-cards-editor .gotb-stacking-card-inner {
    flex-direction: column;
    height: auto;
    min-height: 0;
  }

  .gotb-stacking-card-image {
    flex: 0 0 auto;
    width: 100%;
    height: 240px;
  }

  .gotb-stacking-card-body {
    padding: min(24px, var(--gotb-stack-padding, 32px));
  }

  .gotb-stacking-card-title,
  .editor-styles-wrapper .gotb-stacking-card-inner h3.gotb-stacking-card-title,
  .gotb-stacking-card-inner h3.gotb-stacking-card-title {
    font-size: min(24px, var(--gotb-stack-title-size, 28px)) !important;
  }

  .gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-cards-pin {
    height: 100dvh;
    align-items: stretch;
  }

  .gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-card-inner {
    height: auto;
    max-height: calc(100dvh - 2rem);
  }

  .gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-card-body {
    overflow-y: auto;
  }
}

/* Kadence mobile: 767px */
@media (max-width: 767px) {
  .gotb-stacking-card-inner,
  .gotb-stacking-cards-editor .gotb-stacking-card-inner {
    width: 100%;
  }

  .gotb-stacking-card-image {
    height: 180px;
  }

  .gotb-stacking-card-body {
    padding: min(20px, var(--gotb-stack-padding, 32px));
  }

  .gotb-stacking-card-title,
  .editor-styles-wrapper .gotb-stacking-card-inner h3.gotb-stacking-card-title,
  .gotb-stacking-card-inner h3.gotb-stacking-card-title {
    font-size: min(22px, var(--gotb-stack-title-size, 28px)) !important;
  }

  .gotb-stacking-card-content,
  .editor-styles-wrapper .gotb-stacking-card-inner .gotb-stacking-card-content {
    font-size: min(16px, var(--gotb-stack-text-size, 16px)) !important;
  }

  .gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) {
    height: calc(var(--gotb-stack-numcards, 3) * 100dvh);
  }

  .gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-cards-inner {
    padding-left: var(--gotb-stack-offset, 0px);
    padding-right: 0;
  }

  .gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-card {
    flex: 0 0 100%;
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gotb-stacking-card {
    position: relative;
    top: auto;
    height: auto;
    margin-bottom: 1.5rem;
    translate: none;
  }

  .gotb-stacking-card-inner {
    top: auto;
    translate: none;
    transform: none;
  }

  .gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) {
    height: auto;
  }

  .gotb-stacking-cards--horizontal:not(.gotb-stacking-cards-editor) .gotb-stacking-cards-pin {
    position: relative;
    height: auto;
    overflow: auto;
  }
}