/* KWNY Path Steps widget — every rule is scoped to .kwny-path, nothing else on the site is touched. */

.kwny-path{
  --kp-green: var(--e-global-color-primary,   #035E39);
  --kp-deep:  var(--e-global-color-5aa2f98,   #023822);
  --kp-ink:   var(--e-global-color-secondary, #00140E);
  --kp-serif: var(--e-global-typography-primary-font-family, "Test Financier"), Georgia, serif;
  --kp-sans:  var(--e-global-typography-text-font-family, "Inter"), Arial, sans-serif;
  --kp-gutter: 20px;
  --kp-gap: 24px;
  --kp-slide: min(80%, 300px);

  background-color: #FFFFFF;
  padding: 88px 0;
  font-family: var(--kp-sans);
  box-sizing: border-box;
}
.kwny-path *,
.kwny-path *::before,
.kwny-path *::after{ box-sizing: border-box; }

/* full-width breakout (switch in the widget) — scrollbar-safe */
.kwny-path-full-yes .kwny-path{
  width: calc(100vw - var(--kwny-sb, 0px));
  max-width: calc(100vw - var(--kwny-sb, 0px));
  margin-left: calc(50% - 50vw + (var(--kwny-sb, 0px) / 2));
  margin-right: calc(50% - 50vw + (var(--kwny-sb, 0px) / 2));
  overflow-x: clip;
}

.kwny-path__inner{
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 var(--kp-gutter);

  /* desktop: title left + button right on the same row, cards underneath.
     mobile (below): title, cards, then the button. */
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "head cta"
    "track track";
  align-items: end;
  column-gap: 24px;
}

/* ---------- header ---------- */
.kwny-path .kwny-path__head{
  grid-area: head;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin: 0;
}
.kwny-path .kwny-path__cta{
  grid-area: cta;
  display: flex;
  justify-content: flex-end;
  margin: 0;
}
.kwny-path .kwny-path__title{
  margin: 0;
  padding: 0;
  font-family: var(--kp-serif);
  font-weight: 400;
  font-size: var(--e-global-typography-1179395-font-size, clamp(1.875rem, 1.5865rem + 1.2821vw, 3.125rem));
  line-height: 1.35em;
  letter-spacing: -0.01em;
  color: var(--kp-ink);
}
.kwny-path__l2{ display: block; }
.kwny-path .kwny-path__title em{
  font-style: italic;
  color: var(--kp-green);
}

.kwny-path .kwny-path__btn{
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 .35em;
  padding: 14px 20px;
  border: 0;
  border-radius: 100px;
  background-color: var(--kp-deep);
  font-size: 1.0625rem;
  line-height: 1.2;
  color: #FFFFFF;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .25s ease, color .25s ease;
}
.kwny-path .kwny-path__btn:hover,
.kwny-path .kwny-path__btn:focus{ background-color: var(--kp-green); color: #FFFFFF; }
.kwny-path .kwny-path__btn:focus-visible{ outline: 2px solid var(--kp-deep); outline-offset: 3px; }

/* ---------- cards ---------- */
.kwny-path .kwny-path__track{
  grid-area: track;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--kp-gap);
  margin: 40px 0 0;            /* "Space Under Heading" control */
  padding: 0;
  list-style: none;
}
.kwny-path .kwny-path__card{
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  padding: 0;
  border-radius: 16px;
  overflow: hidden;
  background-color: #F3F7F5;
}
.kwny-path__card::before,
.kwny-path__card::marker{ content: none; }
.kwny-path .kwny-path__media{
  margin: 0;
  aspect-ratio: 4 / 3;
  background-color: #DCE5E0;
  overflow: hidden;
}
.kwny-path .kwny-path__media img{
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  object-fit: cover;
  -webkit-user-drag: none;
}
.kwny-path .kwny-path__body{ padding: 16px 16px 22px; }
.kwny-path .kwny-path__num{
  display: block;
  margin: 0 0 16px;
  font-family: var(--kp-sans);
  font-weight: 500;
  font-size: 1.375rem;
  line-height: 1.2;
  letter-spacing: .02em;
  color: #6B7A70;
}
.kwny-path .kwny-path__card-title{
  margin: 0 0 12px;
  padding: 0;
  font-family: var(--kp-serif);
  font-weight: 400;
  font-size: clamp(1.1875rem, 1.1442rem + .1923vw, 1.375rem);
  line-height: 1.3;
  color: var(--kp-ink);
}
.kwny-path .kwny-path__card-desc{
  margin: 0;
  font-size: clamp(.9375rem, .9231rem + .0641vw, 1rem);
  line-height: 1.5;
  color: #3F4B44;
}

/* ---------- tablet ---------- */
@media (max-width: 1024px){
  .kwny-path .kwny-path__track{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- mobile ---------- */
@media (max-width: 767px){
  .kwny-path{ padding: 48px 0; --kp-gutter: 16px; }
  .kwny-path__inner{
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "head"
      "track"
      "cta";                      /* button comes after the cards */
    column-gap: 0;
  }
  .kwny-path .kwny-path__head{
    flex-direction: column;
    align-items: stretch;
    gap: 22px;
    margin-bottom: 0;
  }
  .kwny-path .kwny-path__track{ margin-top: 24px; }
  .kwny-path .kwny-path__cta{ justify-content: center; margin-top: 24px; }
  .kwny-path .kwny-path__title{ text-align: center; }
  .kwny-path__l2{ display: inline; }
  .kwny-path .kwny-path__title em{ display: block; }   /* italic part on its own line */
  .kwny-path .kwny-path__btn{ margin: 0; }
  .kwny-path-btnfull-yes .kwny-path .kwny-path__cta{ display: block; }
  .kwny-path-btnfull-yes .kwny-path .kwny-path__btn{ display: flex; width: 100%; padding: 15px 20px; }

  .kwny-path .kwny-path__track{ grid-template-columns: minmax(0, 1fr); }
  .kwny-path .kwny-path__media{ aspect-ratio: 3 / 2; }
  .kwny-path .kwny-path__num{ margin-bottom: 14px; font-size: 1.25rem; }
  .kwny-path .kwny-path__card-title{ margin-bottom: 10px; }

  /* swipe slider — bleeds to the right edge so the next card peeks in */
  .kwny-path-slider-yes .kwny-path .kwny-path__track{
    display: flex;
    margin-right: calc(var(--kp-gutter) * -1);
    padding: 0 var(--kp-gutter) 6px 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .kwny-path-slider-yes .kwny-path__track::-webkit-scrollbar{ display: none; }
  .kwny-path-slider-yes .kwny-path .kwny-path__card{
    flex: 0 0 var(--kp-slide);
    scroll-snap-align: start;
  }
}

@media (prefers-reduced-motion: reduce){
  .kwny-path .kwny-path__btn{ transition: none; }
}