/* home-cards.v1.css : homepage programmes strip (see lib/enhance/transforms/home-cards.ts).
 * The Bali card is the Thailand card's markup. Its widget carries the Thailand widget's Elementor class, so the stored
 * stylesheet (post-15211.css) already paints it; only the container's width, which the stored CSS sets per container id,
 * needs a rule here. Widths and gaps copy the other four cards: one column on phones, two from 768px, three from 1025px. */

.elementor-element.yn-home-bali {
  --display: flex;
  --gap: 10px 10px;
  --row-gap: 10px;
  --column-gap: 10px;
  --border-radius: 0px 0px 0px 0px;
  --padding-top: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  --padding-right: 0px;
  overflow: visible;
}

@media (min-width: 768px) {
  .elementor-element.yn-home-bali {
    --width: calc(33.33% - 20px);
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-element.yn-home-bali {
    --width: calc(50% - 15px);
  }
}

/* "Planning your training?" line under the strip: the section behind it is light (#FFFBF7), so the text inherits. */
.yn-home-planning {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0 10px;
  text-align: center;
  font-size: 16px;
  line-height: 1.6;
}

.yn-home-planning a {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}