Первый блок

HTML

<div class="intro">
    <div class="container">
        <div class="intro-left">
            <div class="title-big"><?php the_field('заголовок_первого_блока'); ?></div>
            <div class="title-block"><?php the_field('подзаголовок_первого_блока'); ?></div>
            <div class="title-bold"><p><?php the_field('заголовок_формы_первого_блока'); ?></p></div>
            <div class="intro-form">
                <form class="form-modal" id="form-intro">
                    <input type="text" name="phone" placeholder="Ваш телефон*" required>
                    <button class="btn">Узнать цены</button>
                    <input type="hidden" name="formData" value="Нужна консультация с сайта <?php echo get_home_url(); ?>">
                </form>
            </div>
        </div>
        <div class="miniature">
            <?php 
            $image = get_field('изображение_первого_блока');
            if( !empty($image) ): ?>
                <img src="<?php echo $image['sizes']['large']; ?>" alt="<?php echo $image['alt']; ?>" />
            <?php endif; ?>
        </div>
    </div>
</div>

LESS

.intro{
    position: relative;
    padding-top: 160px;
    padding-bottom: 160px;
    background: @bg;
    
    @media (max-width: 724px){
        padding-top: 150px;
        padding-bottom: 80px;
    }
    .intro-left{
        position: relative;
        z-index: 2;
        padding-right: 50%;
        
        @media (max-width: 724px){
            padding: 0;
        }
    }
    .title-big{
        margin-bottom: 40px;
        
        @media (max-width: 724px){
            margin-bottom: 20px;
        }
    }
    .title-block{
        margin-bottom: 60px;
        padding-left: 30px;
        border-left: 4px solid @color-1;
        
        @media (max-width: 724px){
            margin-bottom: 280px;
        }
        br{
            @media (max-width: 724px){
                display: none;
            }
        }
    }
    
    .intro-form{
        display: inline-block;
        background: #fff;
        position: relative;
        border-radius: 20px;
        
        @media (max-width: 724px){
            display: block;
        }
        .title-block{
            margin-bottom: 15px;
        }
        input{
            display: inline-block;
            vertical-align: text-top;
            border-color: #fff;
            padding-top: 30px;
            padding-bottom: 33px;
            padding-left: 30px;
            padding-right: 220px;
            
            @media (max-width: 724px){
                padding-right: 30px;
                width: 100%;
                padding-bottom: 100px;
            }
            &:focus{
                border-color: lighten(@color-1, 40%);
            }
        }
        .btn{
            display: inline-block;
            vertical-align: text-top;
            position: absolute;
            right: 20px;
            top: 15px;
            box-shadow: none;
            
            @media (max-width: 724px){
                top: auto;
                bottom: 20px;
                right: 20px;
                left: 20px;
                width: calc(~'100% - 40px');
            }
        }
    }
    
    .miniature{
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        width: calc(~'50% - 100px');
        z-index: 2;
        
        @media(max-width: 724px){
            top: 250px;
            width: 100%;
            display: block;
            height: 220px;
        }
    }
}