/*==========================
      BLOG INTRO
==========================*/

.blog-intro{
    padding:0;
}

.blog-intro .container{
    width:73%;
    max-width:1400px;
    /*margin:auto;*/
}

/*.blog-intro .intro-text{*/

/*    font-family:"Sharp Grotesk DB Cyr Medium 22 Regular";*/
/*    font-size:19.4px;*/
/*    font-weight: normal;*/
/*    line-height:27.2px;*/
/*    color:#000;*/

/*    margin-bottom:28px;*/
/*}*/



.blog-intro p{
        font-family:"Sharp Grotesk DB Cyr Medium 22 Regular";
    font-size:19.4px;
    line-height:27.2px;
    color:#000;
      font-weight: normal;
    margin-bottom:28px;
}


.blog-intro .container p:last-child{
    margin-bottom: 0;
}


/*=========================
        Recipe Section
=========================*/

.recipe-section{
    padding:30px 0 0 0;
}


.recipe-section .container{
    width:73%;
    max-width:1400px;
    margin:auto;
}

.recipe-row{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:50px;
}

.recipe-content{
    flex:1;
    
}

.recipe-title{
    font-family:"Sharp Grotesk DB Cyr Medium 22 Regular";
    font-weight: normal;
    font-size:24.3px;
    font-weight: bold;
    color:#000;
    margin-bottom:44px;
    margin-top: 17px;
}


.recipe-content p{
        font-family:"Sharp Grotesk DB Cyr Medium 22 Regular";
        font-weight: normal;
    font-size:19.4px;
    line-height:27.2px;
    color:#000;
   
    margin-bottom:28px;
}

.recipe-content p:last-of-type{
    margin-bottom: 0;
}

.direction{
     margin-top:50px;
}

.recipe-content h2{
    font-family:"Sharp Grotesk DB Cyr Medium 22 Regular";
    font-weight: bold;
    font-size:19.4px;
    color:#000;
    /*margin-bottom:20px;*/
}
.recipe-content ul{
    padding-left:40px;
    margin-bottom:40px;
}

.recipe-content li{
    font-family:"Sharp Grotesk DB Cyr Medium 22 Regular";
    font-weight: normal;
    font-size:19.4px;
    line-height:1.4;
    color:#000;
 
}



.recipe-image{
    flex: 1;
}

.recipe-image img{
    width:100%;
    height:auto;
    display:block;
    
     opacity: 0;
    transform: scale(0.9);
    transition: opacity .6s ease, transform .6s ease;
}

.recipe-image img.show{
    opacity: 1;
    animation: pulse .8s ease forwards;
}

@keyframes pulse{
    0%{
        transform: scale(1);
    }
    50%{
        transform: scale(1.06);
    }
    100%{
        transform: scale(1);
    }
}
/*Tablet*/

@media(max-width:992px){


.blog-intro .container{
    width:88%;
}

/*.blog-intro .intro-text{*/
/*    font-size:18px;*/
/*    margin-bottom:55px;*/
/*}*/


.blog-intro p{
    font-size:18px;
    margin-bottom:26px;
}



.recipe-section{
    padding:60px 0;
}

.recipe-section .container{
    width:88%;
}


.recipe-row{
    display:flex;
    align-items:center;
    gap:40px;
}

.recipe-content{
    flex:0 0 50%;
}


.recipe-content p{
    font-size:18px;
    margin-bottom:26px;
}

.recipe-content h2{
    font-size:24.3px;
}
.recipe-content li{
    font-size:20px;
}
.recipe-image{
    flex:0 0 50%;
}

.recipe-image img{
    width:100%;
    height:auto;
    display:block;
    object-fit:cover;
}
}


/*<!--Mobile Landscape-->*/

/*@media(max-width:768px){*/
@media (min-width:577px) and (max-width:991px) and (orientation: landscape) {

.blog-intro .container{
    width:92%;
}

/*.blog-intro .intro-text{*/
/*    font-size:17px;*/
/*    line-height:1.6;*/
/*    margin-bottom:40px;*/
/*}*/


.blog-intro p{
    font-size:17px;
    line-height:1.6;
}



.recipe-section{
    padding:50px 0;
}

.recipe-section .container{
    width:92%;
}

.recipe-row{
    flex-direction:column;
    gap:35px;
}

.recipe-content{
    width:100%;
}

.recipe-content p{
    font-size:17px;
    line-height:1.6;
}

.recipe-content h2{
    font-size:24px;
}

.recipe-content ul{
    padding-left:25px;
}

.recipe-content li{
    font-size:18px;
    line-height:1.6;
}

.recipe-image{
    width:100%;
    max-width:600px;
    margin:0 auto;
}

.recipe-image img{
    width:100%;
    height:auto;
    display:block;
}

}



/*Mobile Portrait*/

@media(max-width:576px){

.blog-intro{
    padding:0px 0px 30px 0px;
}

.blog-intro .container{
    width:94%;
}

/*.blog-intro .intro-text{*/
/*     font-family: "Roboto";*/
/*    font-size:21.5px;*/
/*    line-height:30.1px;*/
/*    margin-bottom:30px;*/
/*}*/


.blog-intro p{
    font-family: "Roboto";
    font-size:21.5px;
    line-height:30.1px;
    margin-bottom:30px;
}



.recipe-section{
    padding:0;
}

.recipe-section .container{
    width:94%;
}

.recipe-row{
    flex-direction:column;
    gap:25px;
}

.recipe-content{
    width:100%;
    order: 2;
}

.recipe-title{
    font-family:"Roboto";
    font-size:19.3px;
    margin-bottom:18px;
}



.recipe-content p{
    font-family: "Roboto";
    font-size:21.5px;
    line-height:30.1px;
    margin-bottom:30px;
}

.recipe-content p:last-of-type{
    margin-bottom: 40px;
}
.recipe-content h2{
    font-family:"Roboto";
    font-size:21.5px;
    /*margin-bottom:18px;*/
}

.recipe-content ul{
    padding-left:42px;
    margin-bottom:28px;
}

.recipe-content li{
    font-family:"Roboto";
    font-size:21.5px;
    line-height:1.4;
    /*margin-bottom:10px;*/
}


.recipe-image{
    width:100%;
    max-width:420px;
    margin:0 auto;
    order: 1;
}

.recipe-image img{
    width:100%;
    height:auto;
    display:block;
    border-radius:0;
}
}


/*==========================
      BLOG CLOSING
==========================*/

.blog-closing{
    padding: 0 0 80px;
}

.blog-closing .container{
    width:73%;
    max-width:1400px;
    margin:auto;
}

.blog-closing p{
    font-family:"Sharp Grotesk DB Cyr Medium 22 Regular";
    font-weight: normal;
    font-size:19.4px;
    line-height:1.4;
    color:#000;
    margin:0;
    margin-bottom: 20px;
}
.blog-closing h1{
    font-family:"Sharp Grotesk DB Cyr Medium 22 Regular";
    font-size:24.3px;
    font-weight: bold;
    color:#000;
    margin-bottom:45px;
    margin-top: 40px;
}
/* Tablet */

@media (max-width:992px){

.blog-closing{
    padding:0 0 60px;
}

.blog-closing .container{
    width:88%;
}

.blog-closing p{
    font-size:18px;
}

}

/* Mobile Landscape */

/*@media (max-width:768px){*/
@media (min-width:577px) and (max-width:991px) and (orientation: landscape) {

.blog-closing{
    padding:0 0 50px;
}

.blog-closing .container{
    width:92%;
}

.blog-closing p{
    font-size:17px;
    line-height:1.4;
}

}

/* Mobile Portrait */

@media (max-width:576px){

.blog-closing{
    padding:0 0 40px;
}

.blog-closing .container{
    width:94%;
}

.blog-closing p{
   font-family: "Roboto";
    font-size:21.5px;
    line-height:1.5;
}

.blog-closing h1{
    font-family:"Roboto";
    font-size:19.3px;
    margin-bottom:18px;
}
}