.elementor-1667 .elementor-element.elementor-element-82a8468{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1667 .elementor-element.elementor-element-82a8468.e-con{--align-self:flex-start;}.elementor-1667 .elementor-element.elementor-element-eec28ba{--display:flex;}.elementor-1667 .elementor-element.elementor-element-22d2f60{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1667 .elementor-element.elementor-element-22d2f60.e-con{--align-self:flex-start;}.elementor-1667 .elementor-element.elementor-element-fbc2dbc{--display:flex;--justify-content:flex-start;--border-radius:30px 30px 30px 30px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1667 .elementor-element.elementor-element-fbc2dbc:not(.elementor-motion-effects-element-type-background), .elementor-1667 .elementor-element.elementor-element-fbc2dbc > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-1667 .elementor-element.elementor-element-fbc2dbc.e-con{--align-self:flex-start;}@media(max-width:1024px){.elementor-1667 .elementor-element.elementor-element-82a8468{--padding-top:0px;--padding-bottom:0px;--padding-left:10px;--padding-right:10px;}}@media(min-width:768px){.elementor-1667 .elementor-element.elementor-element-82a8468{--content-width:1100px;}.elementor-1667 .elementor-element.elementor-element-22d2f60{--content-width:1100px;}.elementor-1667 .elementor-element.elementor-element-fbc2dbc{--content-width:1100px;}}/* Start custom CSS for html, class: .elementor-element-caf6cc2 *//* Let the hero section + first article go full width */
.sheep-explainer .hero-art,
.sheep-explainer .intro-panel {
  max-width: none;
  width: 100%;
}

/* Keep all later panels at the narrower width */
.sheep-explainer .sheep-panel {
  max-width: 820px;
  margin-inline: auto;  /* center them */
}

<style>
  /* knobs — make this the width you like for the smaller cards */
  .sheep-explainer { --narrow: 960px; }  /* try 900–1000px */

  /* let the section fill the parent container */
  .sheep-explainer .sheep-wrap { max-width: 100% !important; }

  /* hero + first article = full width of the container */
  .sheep-explainer .hero-art,
  .sheep-explainer .intro-panel {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .sheep-explainer .hero-art img { display:block; width:100% !important; height:auto; }

  /* all other panels = your chosen narrow width, centered */
  .sheep-explainer .sheep-panel:not(.intro-panel) {
    max-width: var(--narrow) !important;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }

  /* if your theme/Elementor caps inner widgets, uncap inside this section only */
  .sheep-explainer .elementor-widget,
  .sheep-explainer .elementor-widget-container {
    max-width: none !important;
  }
</style>
.hero-split {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: flex-start;
  margin-bottom: 20px;
}

.hero-pic {
  flex: 0 0 40%;       /* Image takes ~40% */
}

.hero-pic img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
}

.hero-text {
  flex: 1;             /* Text fills the rest */
  min-width: 260px;    /* Keep it from collapsing on small screens */
}

@media (max-width: 768px) {
  .hero-split {
    flex-direction: column;
  }
  .hero-pic, .hero-text {
    flex: 1 1 100%;
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-22d2f60 */<style>
    .container{max-width:1050px;margin:0 auto;line-height:1.65}
    .row{display:flex;gap:22px;align-items:center}
    .row.stack{align-items:flex-start}
    .col{flex:1 1 0}
    .media{border-radius:14px;overflow:hidden}
    .media img{width:100%;height:auto;display:block}
    .callout{padding:12px 16px;border-radius:12px;margin:16px 0}
    .callout--purple{border-left:4px solid #6b46c1;background:#f7f2ff}
    .callout--green{border-left:4px solid #2f855a;background:#f0fff4}
    .callout--rose{border-left:4px solid #e53e3e;background:#fff5f5}
    .callout--slate{border-left:4px solid #718096;background:#f7fafc}
    .small{font-size:.95rem;color:#444}
    .em{font-style:italic}
    .cards{display:flex;gap:18px;flex-wrap:wrap;margin:10px 0 6px}
    .card{flex:1 1 300px;border:1px solid #eee;border-radius:14px;padding:14px;background:#fff}
    .card h3{margin:4px 0 6px;font-size:1.15rem}
    figure{margin:0}
    figcaption{font-size:.9rem;color:#666;margin-top:6px}
    .imgwrapL{float:left;margin:0 16px 10px 0;max-width:42%;border-radius:12px}
    @media (max-width:860px){
      .row{flex-direction:column}
      .imgwrapL{float:none;display:block;max-width:100%;margin:0 0 12px 0}
    }
  </style>/* End custom CSS */