/* ==================== [ 1500px ] ==================== */
@media (min-width: 1500px) {

    /* ==================== [ Common Start ] ==================== */
    .container-fluid,
    .container {
        max-width: calc(1460px + 40px);
    }

    /* ==================== [ Common End ] ==================== */
}

/* ==================== [ 1199px ] ==================== */
@media (max-width: 1399px) {

    /* ==================== [ Home Banner Start ] ==================== */
    .home-banner .creative,
    .home-banner .motion,
    .home-banner .smooth {
        padding: 11px 16px;
    }

    .home-banner .creative *,
    .home-banner .motion *,
    .home-banner .smooth * {
        font-size: 20px;
    }

    /* ==================== [ Home Banner End ] ==================== */

}

/* ==================== [ 1299px ] ==================== */
@media (max-width: 1299px) {

    /* ==================== [ Home Banner Start ] ==================== */
    .home-banner .home-title .web-spacing {
        margin-left: 80px;
    }

    .home-banner .home-title .dev-spacing {
        margin-left: 180px;
    }

    /* ==================== [ Home Banner End ] ==================== */
}

/* ==================== [ 1199px ] ==================== */
@media (max-width: 1199px) {

    /* ==================== [ Typography Start ] ==================== */
    h1,
    .h1 {
        font-size: 60px;
        letter-spacing: 2px;
    }

    h1 strong,
    .h1 strong {
        font-size: 50px;
        letter-spacing: 1.4px;
    }

    h2 {
        font-size: 70px;
        letter-spacing: 2px;
    }

    h3 {
        font-size: 50px;
    }

    h4 {
        font-size: 44px;
    }

    h5 {
        font-size: 30px;
    }

    h6 {
        font-size: 22px;
    }

    /* ==================== [ Typography End ] ==================== */

    /* ==================== [ Extra Common Start ] ==================== */
    .action-group {
        margin-top: 48px;
    }

    /* ==================== [ Extra Common End ] ==================== */

    /* ==================== [ Home Banner Start ] ==================== */
    .home-banner .banner-author {
        margin-bottom: 36px;
    }

    .home-banner .banner-author .name * {
        font-size: 30px;
    }

    .home-banner .banner-author .profile-image {
        width: 40px;
        height: 40px;
    }

    .home-banner .home-title {
        margin-bottom: 35px;
    }

    .home-banner .home-disc .disc-group {
        margin-bottom: 26px;
    }

    .home-banner .motion-group {
        right: 8%;
    }

    /* ==================== [ Home Banner End ] ==================== */

    /* ==================== [ About Me Start ] ==================== */
    .about-me {
        padding: 120px 0 60px;
    }

    .about-me .about-banner-group .image {
        text-align: center;
        height: 500px;
        max-height: 500px;
    }

    .about-me .about-banner-group::before {
        width: 200px;
        height: 200px;
    }

    .about-me .card {
        gap: 48px;
    }

    /* ==================== [ About Me End ] ==================== */

    /* ==================== [ Professional Abilities & Experience Start ] ==================== */
    .experience {
        padding: 60px 0;
    }

    .experience .heading {
        margin-bottom: 60px;
    }

    .experience .action {
        margin-top: 48px;
    }

    /* ==================== [ Professional Abilities & Experience End ] ==================== */

    /* ==================== [ Crafted Solutions Start ] ==================== */
    .crafted-solutions {
        padding: 60px 0;
    }

    .crafted-solutions .heading {
        margin-bottom: 60px;
    }

    /* ==================== [ Crafted Solutions End ] ==================== */
}

/* ==================== [ 991px ] ==================== */
@media (max-width: 991px) {

    /* ==================== [ Typography Start ] ==================== */
    h1,
    .h1 {
        font-size: 50px;
        letter-spacing: 1.5px;
    }

    h1 strong,
    .h1 strong {
        font-size: 40px;
        letter-spacing: 1px;
    }

    h2 {
        font-size: 60px;
        letter-spacing: 1.5px;
    }

    h3 {
        font-size: 46px;
    }

    h4 {
        font-size: 42px;
    }

    h5 {
        font-size: 28px;
    }

    h6 {
        font-size: 20px;
    }

    /* ==================== [ Typography End ] ==================== */

    /* ==================== [ Extra Common Start ] ==================== */
    .action-group {
        margin-top: 48px;
    }

    /* ==================== [ Extra Common End ] ==================== */

    /* ==================== [ Home Banner Start ] ==================== */
    .home-banner .banner-author {
        margin-bottom: 36px;
    }

    .home-banner .banner-author .name * {
        font-size: 26px;
    }

    .home-banner .banner-author .profile-image {
        width: 40px;
        height: 40px;
    }

    .home-banner .home-title .web-spacing {
        margin-left: 0px;
    }

    .home-banner .home-title .dev-spacing {
        margin-left: 0px;
    }

    .home-banner .home-title {
        margin-bottom: 35px;
    }

    .home-banner .home-disc .disc-group {
        margin-bottom: 26px;
    }

    .home-banner .motion-group {
        top: 29.72%;
        right: 8%;
    }

    .home-banner .creative-group {
        top: 15.20%;
        left: 51.3%;
    }

    /* ==================== [ Home Banner End ] ==================== */

    /* ==================== [ About Me Start ] ==================== */
    .about-me {
        padding: 100px 0 50px;
    }

    .about-me .about-banner-group .image {
        text-align: center;
        height: 440px;
        max-height: 440px;
    }

    .about-me .about-banner-group::before {
        opacity: 0.6;
        width: 150px;
        height: 150px;
    }

    .about-me .card {
        gap: 48px;
    }

    .about-me .card .disc * {
        font-size: 20px;
    }

    /* ==================== [ About Me End ] ==================== */

    /* ==================== [ Professional Abilities & Experience Start ] ==================== */
    .experience {
        padding: 50px 0;
    }

    .experience .action {
        margin-top: 48px;
    }

    /* ==================== [ Professional Abilities & Experience End ] ==================== */

    /* ==================== [ Crafted Solutions Start ] ==================== */
    .crafted-solutions {
        padding: 50px 0;
    }

    .crafted-solutions .heading .title * {
        margin-bottom: 20px;
    }

    /* ==================== [ Crafted Solutions End ] ==================== */
}

/* ==================== [ 767px ] ==================== */
@media (max-width: 767px) {

    /* ==================== [ Typography Start ] ==================== */
    h1,
    .h1 {
        font-size: 40px;
        letter-spacing: 1px;
    }

    h1 strong,
    .h1 strong {
        font-size: 36px;
        letter-spacing: 0.5px;
    }

    h2 {
        font-size: 50px;
        letter-spacing: 1px;
    }

    h3 {
        font-size: 42px;
    }

    h4 {
        font-size: 38px;
    }

    h5 {
        font-size: 24px;
    }

    h6 {
        font-size: 18px;
    }

    /* ==================== [ Typography End ] ==================== */


    /* ==================== [ Home Banner Start ] ==================== */
    .home-banner .banner-author .name * {
        font-size: 22px;
    }

    /* ==================== [ Home Banner End ] ==================== */

    /* ==================== [ About Me Start ] ==================== */
    .about-me {
        padding: 80px 0 40px;
    }

    .about-me .about-banner-group .image {
        text-align: center;
        height: 380px;
        max-height: 380px;
    }

    .about-me .about-banner-group::before {
        opacity: 1;
        width: 100px;
        height: 100px;
    }

    .about-me .card {
        gap: 36px;
    }

    .about-me .card .disc * {
        font-size: 20px;
    }

    /* ==================== [ About Me End ] ==================== */

    /* ==================== [ Professional Abilities & Experience Start ] ==================== */
    .experience {
        padding: 40px 0;
    }

    /* ==================== [ Professional Abilities & Experience End ] ==================== */
}

/* ==================== [ 575px ] ==================== */
@media (max-width: 575px) {

    /* ==================== [ Typography Start ] ==================== */
    h1 strong,
    .h1 strong {
        font-size: 34px;
        letter-spacing: 0.5px;
    }

    /* ==================== [ Typography End ] ==================== */

    /* ==================== [ Home Banner Start ] ==================== */
    .home-banner .creative-group {
        top: 13.2%;
        left: 25.3%;
    }

    .home-banner .motion-group {
        top: 22.72%;
        right: 4%;
    }

    .home-banner .smooth-group {
        bottom: 11.98%;
        left: 5.54%;
    }

    .home-banner .banner-author .name * {
        font-size: 20px;
    }

    /* ==================== [ Home Banner End ] ==================== */

    /* ==================== [ About Me Start ] ==================== */
    .about-me .about-banner-group .image {
        text-align: center;
        max-width: 83%;
        margin: 0 auto;
        width: 100%;
        height: unset;
        max-height: unset;
    }

    .about-me .about-banner-group::before {
        opacity: 1;
        width: 100px;
        height: 100px;
    }

    .about-me .card {
        gap: 36px;
    }

    .about-me .card .disc * {
        font-size: 18px;
    }

    /* ==================== [ About Me End ] ==================== */
}