.saas-hero-3.banner {
    text-align: left;
    padding: 60px 0; /* Reduced padding */
}

.saas-hero-3.banner h1,
.saas-hero-3.banner h2 {
    font-size: 45px; /* Reduced font size */
    font-weight: 300;
    line-height: 55px; /* Adjusted line height */
    margin: 0 0 30px; /* Reduced bottom margin */
}

.saas-hero-3 .button,
.saas-hero-3 .hs-button {
    display: inline-block;
    width: auto;
    text-transform: none;
}

.saas-hero-3.banner:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(93, 93, 93, .76);
}

.banner h3 a {
    color: #fff;
}

.banner.text-center .dir-arrow {
    margin: 50px auto 0; /* Reduced top margin */
    text-align: center;
}

.dir-arrow {
    animation-name: bounce;
    animation-fill-mode: both;
    animation-iteration-count: 4;
    animation-duration: 2s;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-30px); }
    60% { transform: translateY(-15px); }
}

@media(max-width: 1024px) {
    .saas-hero-3.banner h1,
    .saas-hero-3.banner h2 {
        font-size: 36px; /* Adjusted for medium screens */
        line-height: normal;
        margin: 0 0 30px; /* Adjusted bottom margin */
    }
}

@media(max-width: 767px) {
    .saas-hero-3.banner h1,
    .saas-hero-3.banner h2 {
        font-size: 28px; /* Adjusted for small screens */
        line-height: normal;
    }

    .saas-hero-3.banner .span6:first-of-type {
        margin-bottom: 30px; /* Reduced margin */
    }

    .saas-hero-3.banner .video-img {
        text-align: center;
    }

    .saas-hero-3.banner .video-img img {
        max-width: 300px; /* Adjusted max width */
    }
}