/*********************************************
 * Image with Content - General
**********************************************/
.br-image-content {
    --ic-content-column-width:60%;
    --ic-image-column-width:40%;
    --ic-content-width:540px;
    --ic-ratio:565/380;
    border-radius:2px;
}
.br-image-content__col.image {width:var(--ic-image-column-width);}
.br-image-content__col.content {width:var(--ic-content-column-width);}

/* image */
.br-image-content__image {aspect-ratio:var(--ic-ratio);}

/* content */
.br-image-content__content {max-width:var(--ic-content-width);}


/* image position */
@media only screen and (min-width:769px) {
    /* Image position left */
    .image-position-left .br-image-content__col.content {padding-left:var(--br-gap-container);}
    .image-position-left .br-image-content__content {margin-left:auto;}

    /* Image position right */
    .image-position-right .br-image-content__col.content {padding-right:var(--br-gap-container);}
    .image-position-right .br-image-content__inner {flex-direction:row-reverse;}
}

/* Responsive */
@media only screen and (max-width:768px) {
    .br-image-content {
        --ic-content-column-width:100%;
        --ic-image-column-width:100%;
    }
    .br-image-content__inner {flex-direction:column-reverse;}
    .br-image-content__col.content {margin-bottom:30px;}

    /* center block with max-width */
    .br-image-content__image {max-width:520px;}
    .br-image-content__image,
    .br-image-content__content {margin-left:auto; margin-right:auto;}
}

/* icon */
.br-image-content__icon {
    top:20px; right:32px; pointer-events:none;
    font-size:120px;
}
.br-image-content__icon i {
    background:-webkit-linear-gradient(270deg, #fda4a7 0%, #cf1e24 85%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}
@media only screen and (max-width:1024px) {
    .br-image-content__icon {
        top:5px; right:var(--br-gap-container);
        font-size:var(--br-size-100);
    }
}


/*********************************************
 * Image with Content - Has background color
**********************************************/
.br-image-content.image-style-has-background-color .br-image-content__col.content {padding:40px 24px 40px var(--br-gap-container);}

@media only screen and (min-width:769px) {
    .br-image-content.image-style-has-background-color {
        --ic-content-column-width:52%;
        --ic-image-column-width:48%;
        --ic-content-width:100%;
        position:relative;
    }
    .br-image-content.image-style-has-background-color .br-image-content__inner {align-items:unset;}
    .br-image-content.image-style-has-background-color .br-image-content__image {aspect-ratio:unset; position:relative; height:100%;}
    .br-image-content.image-style-has-background-color .br-image-content__col.image img {position:absolute; inset:0;}
    .br-image-content.image-style-has-background-color .br-image-content__col.content {
        min-height:clamp(250px, 20vw, 380px); display:flex; align-items:center;
    }
    .br-image-content.image-style-has-background-color .br-image-content__content {position:relative; z-index:1;}
}
@media only screen and (max-width:768px) {
    .br-image-content.image-style-has-background-color  {
        --ic-content-width:100%;
    }
    .br-image-content.image-style-has-background-color .br-image-content__col.content {padding:30px var(--br-gap-container) 0;}
    .br-image-content.image-style-has-background-color .br-image-content__image {max-width:100%;}
}