@layer sections{
  [ui-section=image-with-text] .wrapper-area{
    --bg-shade-color:oklch(from var(--bg-color) calc(l - 0.0225) calc(c + 0.0181) calc(h + 6.6));
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    height:var(--height);
    overflow:hidden;
    grid-gap:var(--spacing-16);
    gap:var(--spacing-16);
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=media],
  [ui-section=image-with-text] .wrapper-area [ui-block=content]{
    border-radius:var(--radius-media);
    background-color:var(--bg-shade-color);
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=media]{
    height:inherit;
    overflow:hidden;
    color:oklch(from var(--fg-color) calc(l - 0.4) calc(c + 0.0181) calc(h + 6.6));
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=media] > img{
    -o-object-fit:cover;
       object-fit:cover;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=media][data-image-placement=first]{
    order:-1;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=media][data-image-placement=second]{
    order:1;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content]{
    display:flex;
    flex-direction:column;
    padding:var(--spacing-48);
    gap:var(--spacing-32);
    color:var(--fg-color);
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content][data-text-alignment=start]{
    align-items:flex-start;
    text-align:start;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content][data-text-alignment=center]{
    align-items:center;
    text-align:center;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content][data-text-alignment=end]{
    align-items:flex-end;
    text-align:end;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content][data-vertical-alignment=start]{
    justify-content:flex-start;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content][data-vertical-alignment=center]{
    justify-content:center;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content][data-vertical-alignment=end]{
    justify-content:flex-end;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content] .description{
    opacity:0.72;
    font:var(--font-body-md);
    text-wrap:balance;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content] .cta{
    width:-moz-fit-content;
    width:fit-content;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content] .cta[ui-slot=button]{
    min-width:180px;
  }
  [ui-section=image-with-text] .wrapper-area [ui-block=content] .cta[ui-slot=button][data-variant=secondary] [ui-slot=button-front]{
    color:var(--fg-color);
  }
  @media (max-width: 1024px){
    [ui-section=image-with-text] .wrapper-area{
      grid-template-columns:1fr;
      height:auto;
    }
    [ui-section=image-with-text] .wrapper-area [ui-block=media]{
      height:calc(70vh / 2);
      height:calc(var(--height, 70vh) / 2);
    }
    [ui-section=image-with-text] .wrapper-area [ui-block=content]{
      padding-inline:var(--spacing-24);
    }
  }
}