/*
Theme Name: 	MFM Digital
Theme URI: 		http://themes.muffingroup.com/betheme
Author: 		MFM Digital
Author URI: 	http://mfmdigital.com.com
Description:	MFM Digital Child Theme
Template:		betheme
Version: 		1.0.0
*/

/* Theme customization starts here
-------------------------------------------------------------- */


.button.has-arrow.button_theme::after,
.button.has-arrow.action_button::after
{
	content:'';
	display:inline-block;
	height:2em;
width:2em!important;
background-image:url('dist/img/arrow-orange.svg');
background-repeat:no-repeat;
    background-size: 50%;
    background-position: center;
    background-color: #fff;
    border-radius: 40px;

}

.strong-tag{
display:inline-block;font-size:12px;line-height:1em;padding:0.8em 1.2em;background-color:#FFF0E9;color:#FD7E47;text-transform:uppercase;border-radius:40px;}
.shadow-block{
	padding:10px;
	>div{
		box-shadow: 2px 2px 22px 0px #0000000D;
		padding-top:30px;
		padding-left:30px;
		padding-right:30px;
		border-radius:30px;
		background-color:#fff;

}
}
	
	.besoins-blocs{
		display:grid;
		position:relative;
		top:90px;
		gap:20px;
		
		>div{
			padding:24px;
			position:relative;
			box-shadow: 4px 4px 49px 0px #00000008;
			border-radius:20px;
			background-color:#fff;
			a{position:absolute;inset:0;}

	}
		
		@media(width>1240px){
			grid-template-areas: "first second"
														"first third";
			&>:nth-child(1){grid-area:first;align-self:center;}
		&>:nth-child(2){grid-area:second;}
		&>:nth-child(3){grid-area:third;}
		}
		
}


.products-list{
	margin-top:60px;
  ul{
    .mfn-list-icon{display:none}
    display:grid;
    li{position:relative;
			padding-top:80px!important;
			padding-bottom:80px!important;
      .number{
        position:absolute;
        top:60px;
        left:15px;
        font-size:28px;
        font-weight:800;
      color:#fd7e47;
      font-family:Inter;
      }
       padding-left:40px!important;
			padding-right:40px!important;
       margin-bottom:4px;
       &::after{
         visibility:visible;
         content:'';
         position:absolute;
         left:100%!important;
         top:0;
         bottom:0;
         width:4px;
         background-color:#E8DEF8;
         border-radius:4px;
         display:block
       }
      }
  }
	.mfn-list-desc img{
				position:absolute;
    width:70px;
				left:60px;
				top:-50px;
/*     filter:brightness(0) saturate(100%) invert(63%) sepia(12%) saturate(5089%) hue-rotate(329deg) brightness(100%) contrast(99%); */
			}
	
	@media(width>960px){
		li{
			width:50%;
			.mfn-list-desc img{
				position:absolute;
				left:calc(100% + 120px);
				top:80px;
			}
			&:nth-child(odd){
				padding-right:80px!important
			}
			.number{top:60px;}
			
			&:nth-child(even){
				margin-left:50%;
				padding-left:80px!important;
				&::after{left:0%!important}
				.mfn-list-desc img{
				left:-120px;
			}
				.number{left:55px;}
			}
			
		}
	}
}


.step-block{
    position:relative;
	@media(width>1240px){
		h3{max-width:70%}
	}

    .column:has(.number){
        position:absolute;
        margin:0;
        top:0px;
        right:0;
        left:initial!important;
        width: auto;
        .mcb-column-inner{margin-right:0;}
        .number{
            background-color:#f3f8f8;
            display:inline-grid;
            width:80px;
            height:80px;
            place-items:center;
            border-radius:0px 0px 0px 18px;
        position:relative;
        &::after{
				content:'';
				width:40px;
				height:40px;
				position:absolute;
				top:100%;
				right:0;
				/*background-image:url(dist/img/round-18.png);
        		background-size:contain;
        background-position:right top;*/
				
			}
					@media(width>1240px){
					width:110px;
						height:100px;
					}
            
            span{
                position:relative;
                 z-index:1;
                display:inline-grid;
                width:60%;
                aspect-ratio:1;
							border-radius:12px;
                place-items:center;
                background-color:#FD7E47;
                font-size:35px;
                color:#fff;
                font-weight:600;
                font-family:Inter
                
                }
            
        }
    }
}


.service-block{
	cursor:pointer;
	h3,p{color:#33333380;}
	&.active{
		h3{color:#4A7D7A;}
		p{color:#333;}
	}
	img{display:none}
}