.kain-mosaic { width: 100%; max-width: var(--kain-mosaic-max-width, none); margin-left: auto; margin-right: auto; }
.kain-mosaic__stage { position: relative; min-height: var(--kain-mosaic-height, 760px); width: 100%; }
.kain-mosaic__item { position: absolute; box-sizing: border-box; }
.kain-mosaic__item--image { overflow: hidden; background: #eee; }
.kain-mosaic__item--image img { width: 100%; height: 100%; display: block; }
.kain-mosaic__image-link { display: block; width: 100%; height: 100%; color: inherit; text-decoration: none; position: relative; }
.kain-mosaic__overlay-bg { position: absolute; inset: 0; pointer-events: none; }
.kain-mosaic__overlay { position: absolute; z-index: 2; display: grid; gap: 6px; padding: 22px; max-width: 88%; transition: opacity .25s ease; }
.kain-mosaic__item--overlay-hover .kain-mosaic__overlay,
.kain-mosaic__item--overlay-hover .kain-mosaic__overlay-bg { opacity: 0; }
.kain-mosaic__item--overlay-hover:hover .kain-mosaic__overlay,
.kain-mosaic__item--overlay-hover:hover .kain-mosaic__overlay-bg { opacity: 1; }
.kain-mosaic__overlay--light { color: #fff; }
.kain-mosaic__overlay--dark { color: #111; }
.kain-mosaic__overlay--bottom-left { left: 0; bottom: 0; }
.kain-mosaic__overlay--bottom-right { right: 0; bottom: 0; text-align: right; }
.kain-mosaic__overlay--top-left { left: 0; top: 0; }
.kain-mosaic__overlay--top-right { right: 0; top: 0; text-align: right; }
.kain-mosaic__overlay--center { left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; }
.kain-mosaic__overlay-label { font-size: 11px; text-transform: uppercase; letter-spacing: .14em; }
.kain-mosaic__overlay-title { font-size: 22px; line-height: 1.1; }
.kain-mosaic__overlay-text { font-size: 14px; line-height: 1.45; }
.kain-mosaic__item--text { color: #111; }
.kain-mosaic__text-label { font-size: 12px; text-transform: uppercase; letter-spacing: .14em; margin-bottom: 20px; }
.kain-mosaic__text-title { margin: 0 0 24px; color: inherit; }
.kain-mosaic__text-title--custom { font-size: var(--kain-title-size, 42px); line-height: 1.05; }
.kain-mosaic__text-copy { font-size: var(--kain-text-size, 16px); line-height: 1.75; margin: 0; color: inherit; }
.kain-mosaic__button { display: inline-block; margin-top: 26px; color: inherit; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 4px; }
@media (max-width: 767px) {
  .kain-mosaic__stage { min-height: auto; display: grid; gap: 18px; }
  .kain-mosaic__item { position: static !important; width: 100% !important; height: auto !important; transform: none !important; }
  .kain-mosaic__item--image { aspect-ratio: 4 / 5; }
  .kain-mosaic__item--text { padding: 0; }
  .kain-mosaic__text-title--custom { font-size: clamp(30px, 8vw, var(--kain-title-size, 42px)); }
}

/* KA IN Hero Slider */
.kain-hero-slider {
  position: relative;
  width: 100%;
  min-height: var(--kain-hero-desktop-height, 520px);
  overflow: hidden;
  background: #f3f1ed;
  isolation: isolate;
  touch-action: pan-y;
  user-select: none;
}
.kain-hero-slider__slides,
.kain-hero-slider__slide,
.kain-hero-slider__overlay {
  position: absolute;
  inset: 0;
}
.kain-hero-slider__slide {
  background-repeat: no-repeat;
  background-position: var(--kain-hero-position, 50% 50%);
  opacity: 0;
  transition: opacity 900ms ease;
  z-index: 1;
}
.kain-hero-slider__slide.is-active { opacity: 1; }
.kain-hero-slider--fit-cover .kain-hero-slider__slide { background-size: cover; }
.kain-hero-slider--fit-contain .kain-hero-slider__slide { background-size: contain; }
.kain-hero-slider__overlay {
  background: #000;
  opacity: var(--kain-hero-overlay-opacity, 0);
  pointer-events: none;
  z-index: 2;
}
.kain-hero-slider__content {
  position: relative;
  z-index: 3;
  min-height: var(--kain-hero-desktop-height, 520px);
  box-sizing: border-box;
  padding: clamp(24px, 5vw, 90px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.kain-hero-slider__dots {
  position: absolute;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  display: flex;
  gap: 9px;
  z-index: 5;
}
.kain-hero-slider__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid currentColor;
  background: transparent;
  color: #fff;
  opacity: .65;
  padding: 0;
  cursor: pointer;
}
.kain-hero-slider__dot.is-active { background: currentColor; opacity: 1; }
.kain-hero-slider__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.7);
  background: rgba(0,0,0,.18);
  color: #fff;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}
.kain-hero-slider__arrow--prev { left: 24px; }
.kain-hero-slider__arrow--next { right: 24px; }
@media (max-width: 767px) {
  .kain-hero-slider { min-height: var(--kain-hero-mobile-height, 340px); }
  .kain-hero-slider__content { min-height: var(--kain-hero-mobile-height, 340px); padding: 28px 20px; }
  .kain-hero-slider__arrow { display: none; }
}

/* KA IN Free Mosaic Gutenberg block */
.kain-free-mosaic {
  width: 100%;
  max-width: var(--kain-free-mosaic-max-width, none);
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.kain-free-mosaic__stage {
  position: relative;
  min-height: var(--kain-free-mosaic-height-desktop, 720px);
  width: 100%;
}
.kain-free-mosaic__layer {
  position: absolute;
  box-sizing: border-box;
  max-width: 100%;
}
.kain-free-mosaic__layer-inner > *:first-child { margin-top: 0; }
.kain-free-mosaic__layer-inner > *:last-child { margin-bottom: 0; }
.kain-free-mosaic__layer img {
  max-width: 100%;
  height: auto;
}
.kain-free-mosaic__layer .wp-block-image,
.kain-free-mosaic__layer figure {
  margin: 0;
}
@media (max-width: 767px) {
  .kain-free-mosaic__stage {
    min-height: var(--kain-free-mosaic-height-mobile, auto);
    display: flex;
    flex-direction: column;
    gap: 22px;
  }
  .kain-free-mosaic__layer {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    z-index: auto !important;
    order: var(--kain-layer-mobile-order, 0);
  }
}

/* KA IN Free Mosaic automatic mobile refinement */
@media (max-width: 767px) {
  .kain-free-mosaic {
    max-width: 100%;
    box-sizing: border-box;
  }

  .kain-free-mosaic__stage {
    min-height: auto !important;
    height: auto !important;
    display: flex;
    flex-direction: column;
    gap: clamp(22px, 7vw, 36px);
    width: 100%;
  }

  .kain-free-mosaic__layer {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    z-index: auto !important;
    order: var(--kain-layer-mobile-order, 0);
    overflow: visible !important;
    box-sizing: border-box;
  }

  .kain-free-mosaic__layer-inner {
    width: 100%;
    height: auto !important;
    min-height: 0;
    box-sizing: border-box;
  }

  .kain-free-mosaic__layer--custom-height .kain-free-mosaic__layer-inner,
  .kain-free-mosaic__layer--custom-height .wp-block-image,
  .kain-free-mosaic__layer--custom-height figure,
  .kain-free-mosaic__layer--custom-height img {
    height: auto !important;
  }

  .kain-free-mosaic__layer .wp-block-image,
  .kain-free-mosaic__layer figure {
    width: 100%;
    max-width: 100%;
    margin: 0;
  }

  .kain-free-mosaic__layer img {
    width: 100%;
    max-width: 100%;
    height: auto !important;
    display: block;
    object-fit: cover;
  }

  .kain-free-mosaic__layer h1,
  .kain-free-mosaic__layer h2,
  .kain-free-mosaic__layer h3,
  .kain-free-mosaic__layer h4,
  .kain-free-mosaic__layer h5,
  .kain-free-mosaic__layer h6,
  .kain-free-mosaic__layer p {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .kain-free-mosaic__layer h1 {
    font-size: clamp(34px, 10vw, 46px);
    line-height: 1.05;
    margin-top: 0;
    margin-bottom: .45em;
  }

  .kain-free-mosaic__layer h2 {
    font-size: clamp(30px, 8.5vw, 40px);
    line-height: 1.08;
    margin-top: 0;
    margin-bottom: .5em;
  }

  .kain-free-mosaic__layer h3 {
    font-size: clamp(24px, 6.8vw, 32px);
    line-height: 1.12;
    margin-top: 0;
    margin-bottom: .55em;
  }

  .kain-free-mosaic__layer h4 {
    font-size: clamp(21px, 5.8vw, 27px);
    line-height: 1.18;
    margin-top: 0;
    margin-bottom: .55em;
  }

  .kain-free-mosaic__layer p,
  .kain-free-mosaic__layer li {
    font-size: clamp(16px, 4.1vw, 17px);
    line-height: 1.65;
  }

  .kain-free-mosaic__layer p:first-child { margin-top: 0; }
  .kain-free-mosaic__layer p:last-child { margin-bottom: 0; }

  .kain-free-mosaic__layer .wp-block-buttons {
    margin-top: 20px;
    gap: 10px;
  }

  .kain-free-mosaic__layer .wp-block-button__link {
    white-space: normal;
  }
}

/* KA IN Free Mosaic: mobile portrait images (3:4)
   Applied only to layers that contain a WordPress Image block. Desktop layout is unchanged. */
@media (max-width: 767px) {
  .kain-free-mosaic__layer:has(.wp-block-image) .kain-free-mosaic__layer-inner {
    aspect-ratio: 3 / 4;
    width: 100%;
    overflow: hidden;
  }

  .kain-free-mosaic__layer:has(.wp-block-image) .wp-block-image,
  .kain-free-mosaic__layer:has(.wp-block-image) figure,
  .kain-free-mosaic__layer:has(.wp-block-image) img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
  }

  .kain-free-mosaic__layer:has(.wp-block-image) img {
    object-fit: cover !important;
    object-position: center center;
    display: block;
  }
}