/* JB Builder 2.8.27: Combinator artwork anchored to the OUTER section edge,
   not the padded content box. All typography and content geometry stay unchanged.
   Decorative nodes remain independent, clickable controls stay above artwork. */
.jb-co-combinator__layout {
  position: relative;
  isolation: isolate;
  overflow: visible;
  margin-block-start: var(--jb-combinator-before, 0px);
  margin-block-end: var(--jb-combinator-end, 0px);
}
.jb-co-combinator__layout--decorated { min-width: 0; }
.jb-co-combinator__layout--decorated > .jb-co-combinator__item,
.jb-co-combinator__layout--decorated > .jb-co-combinator__intro {
  position: relative;
  z-index: auto;
}
.jb-co-combinator__graphic {
  position: absolute;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  opacity: var(--jb-graphic-opacity, .7);
  width: clamp(110px, 19vw, 380px);
  max-width: 42%;
  height: auto;
  line-height: 0;
  contain: layout style;
}
.jb-co-combinator__graphic img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  margin: 0;
  border: 0;
  border-radius: 0;
}
.jb-co-combinator__graphic--small { width: clamp(80px, 11vw, 220px); }
.jb-co-combinator__graphic--large { width: clamp(150px, 27vw, 540px); }
.jb-co-combinator__graphic--front { z-index: 2; }
/* The Combinator gets horizontal/vertical padding from base/spacing.css.
   Its artwork lives inside .jb-co__inner > .jb-co-combinator__layout,
   so compensate exactly for that padding, without shifting any real content.
   Preserve standalone/nested rendering and native overflow between sections. */
.jb-co-combinator__graphic--left {
  left: calc(0px - var(--jb-pad-x, 0px));
  transform: none;
}
.jb-co-combinator__graphic--right {
  right: calc(0px - var(--jb-pad-x, 0px));
  transform: none;
}
/* Position against the section's outer block edges, including optional
   before/after spacing configured on the Kombinátor itself. */
.jb-co-combinator__graphic--top {
  top: calc(0px - var(--jb-pad-y, 0px) - var(--jb-combinator-before, 0px));
}
.jb-co-combinator__graphic--center { top: 50%; }
.jb-co-combinator__graphic--bottom {
  bottom: calc(0px - var(--jb-pad-y, 0px) - var(--jb-combinator-end, 0px));
}
.jb-co-combinator__graphic--left.jb-co-combinator__graphic--center,
.jb-co-combinator__graphic--right.jb-co-combinator__graphic--center { translate: 0 -50%; }
.jb-co-combinator__graphic--start,
.jb-co-combinator__graphic--end {
  left: 50%;
  width: min(66%, 780px);
  max-width: 90%;
  transform: translateX(-50%);
}
.jb-co-combinator__graphic--start {
  top: calc(0px - var(--jb-pad-y, 0px) - var(--jb-combinator-before, 0px));
}
.jb-co-combinator__graphic--end {
  bottom: calc(0px - var(--jb-pad-y, 0px) - var(--jb-combinator-end, 0px));
}
.jb-co-combinator__graphic--start.jb-co-combinator__graphic--overflow { transform: translate(-50%, -50%); }
.jb-co-combinator__graphic--end.jb-co-combinator__graphic--overflow { transform: translate(-50%, 50%); }
.jb-co-combinator__graphic--start.jb-co-combinator__graphic--small,
.jb-co-combinator__graphic--end.jb-co-combinator__graphic--small { width: min(35%, 380px); }
.jb-co-combinator__graphic--start.jb-co-combinator__graphic--large,
.jb-co-combinator__graphic--end.jb-co-combinator__graphic--large { width: min(85%, 1160px); }
/* Foreground artwork can overlap imagery, but text and click targets stay above it. */
.jb-co-combinator__layout--decorated :is(h1,h2,h3,h4,h5,h6,p,a,button,input,textarea,select,summary,label,.jb-co-button) {
  position: relative;
  z-index: 3;
}
.jb-co-combinator__divider {
  position: relative;
  z-index: 1;
  width: min(100%, var(--jb-text, 900px));
  height: var(--jb-divider-height, 52px);
  margin-inline: auto;
  opacity: var(--jb-divider-opacity, .8);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.jb-co-combinator__divider img { display: block; width: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
@media (max-width: 767px) {
  .jb-co-combinator__graphic--left,.jb-co-combinator__graphic--right {
    width: clamp(75px, 27vw, 150px);
    max-width: 30%;
  }
  .jb-co-combinator__graphic--large { width: min(32vw, 170px); }
  .jb-co-combinator__graphic--front { z-index: 0; }
  .jb-co-combinator__graphic--overflow { opacity: calc(var(--jb-graphic-opacity, .7) * .6); }
  .jb-co-combinator__graphic--start,.jb-co-combinator__graphic--end { max-width: 85%; }
}
