.container {
    width: 100%;
    margin: auto;
    padding: 0 16px;
}

/* Extra Small Device */
@media only screen and (max-width: 430px) {
    .mobile-menu .offcanvas-start {
        width: 100%;
    }
}

/* Small Device :550px. */
@media only screen and (min-width: 576px) {
    .container {
        width: 540px;
        padding: 0 12px;
    }

    .about__wrapper,
    .trust--seciton,
    .contact__wrapper {
        padding: 64px 0;
    }
    .about__thumb {
        max-width: 500px;
        margin-bottom: 48px;
    }
    .trust__thumb {
        width: 100%;
        height: 400px;
    }
}

/* Medium Device. */
@media only screen and (min-width: 768px) {
    .container {
        width: 720px;
    }

    .fs-1 {
        font-size: 64px !important;
    }
    .fs-2 {
        font-size: 48px !important;
    }
    .btn {
        height: 60px;
        padding: 18px 28px;
        font-size: 16px;
    }
    .btn--sm {
        height: 54px;
        padding: 14px 28px;
    }
    .about__border__line {
        width: 154px;
        height: 118px;
        right: -20px;
        bottom: -20px;
        border-width: 2px;
    }

    .logo {
        max-width: 128px;
    }
    .hero__wrapper {
        padding: 192px 0 80px;
    }
    .service--section {
        padding: 64px 0;
    }
    .service__card {
        padding: 28px 22px 36px;
    }
    .service__borderLine__topLeft,
    .service__borderLine__bottomRight {
        width: 154px;
        height: 118px;
        border-width: 2px;
    }
    .trust__thumb {
        max-width: 500px;
    }
    .border-line-top-left,
    .border-line-top-right {
        width: 154px;
        height: 118px;
        left: -20px;
        top: -20px;
        border-width: 2px;
    }
    .border-line-top-right {
        left: auto;
        right: -20px;
    }
    .border-line-bottom-left,
    .border-line-bottom-right {
        width: 118px;
        height: 90px;
        left: -20px;
        bottom: -20px;
        border-width: 2px;
    }
    .border-line-bottom-right {
        left: auto;
        right: -20px;
    }
    .footer__inner {
        padding: 40px 0;
    }
    .footer__logo {
        max-width: 160px;
        margin-bottom: 40px;
    }
    .copyright-text {
        font-size: 16px;
    }
}

/* LG Device. */
@media only screen and (min-width: 992px) {
    .container {
        width: 960px;
    }

    body {
        font-size: 20px;
    }

    .header__content {
        margin-top: 14px;
    }
    .hero__content {
        max-width: 53.4%;
    }
    .hero__thumb {
        width: 46.6%;
        height: 100%;
        border-left: 4px solid var(--white);
    }
    .about__wrapper,
    .contact__wrapper {
        padding: 80px 0;
    }
    .about__thumb {
        max-width: 50%;
        width: 100%;
        margin-bottom: 0;
        position: absolute;
        padding: 0;
        top: 0;
        left: 0;
    }
    .about__content {
        padding-top: 24px;
        padding-left: 48px;
    }
    .trust--seciton {
        padding: 85px 0;
    }
    .trust--seciton::before {
        width: 27.5%;
        height: 100%;
    }
    .trust__thumb {
        max-width: 100%;
        height: auto;
    }
    .trust__content {
        padding-left: 24px;
        max-width: 608px;
    }
    .contact__btn__borderLine,
    .header__nav__borderLine__topLeft,
    .header__nav__borderLine__bottomRight,
    .hero__btn__borderLine {
        border-width: 2px;
    }
    .footer__logo {
        margin-bottom: 0;
        margin-top: -10px;
    }
    .footer__nav__link,
    .footer__contact__item,
    .footer__contact__link,
    .copyright-text {
        font-size: 17px;
        line-height: 2.705;
    }
    .footer__widget__title--contact {
        opacity: 0;
        visibility: hidden;
    }
}

/* Large Device :992px. */
@media only screen and (min-width: 1200px) {
    .container {
        width: 1140px;
    }

    .fs-1 {
        font-size: 80px !important;
    }
    .fs-2 {
        font-size: 56px !important;
    }
    .btn {
        height: 66px;
        padding: 18px 32px;
        font-size: 18px;
    }
    .btn--sm {
        height: 60px;
        padding: 14px 32px;
    }
    .about__border__line {
        width: 180px;
        height: 136px;
        right: -24px;
        bottom: -24px;
        border-width: 3px;
    }

    .logo {
        max-width: 184px;
    }
    .hero__wrapper {
        padding: 240px 0 128px;
    }
    .about--section {
        padding-bottom: 80px;
    }
    .about__content {
        padding-top: 40px;
        padding-left: 76px;
    }
    .service--section {
        padding: 0 0 128px;
    }
    .service__card {
        padding: 32px 28px 42px;
    }
    .service__borderLine__topLeft,
    .service__borderLine__bottomRight {
        width: 180px;
        height: 136px;
        border-width: 3px;
    }
    .trust__content {
        padding-left: 48px;
    }
    .border-line-top-left,
    .border-line-top-right {
        width: 180px;
        height: 136px;
        border-width: 3px;
    }
    .border-line-bottom-left,
    .border-line-bottom-right {
        width: 132px;
        height: 100px;
        border-width: 3px;
    }
    .form__input {
        padding: 16px 0;
        font-size: 18px;
    }
    .footer__logo {
        max-width: 192px;
    }
}

/* XL Device :1280px. */
@media only screen and (min-width: 1400px) {
    .container {
        max-width: 1320px;
        width: 100%;
    }
    body {
        font-size: 22px;
    }

    .logo {
        max-width: 224px;
    }
    .header__content {
        margin-top: 14px;
    }
    .header__menu {
        padding: 0 48px;
        gap: 64px;
    }
    .header__menu__link {
        font-size: 17px;
        padding: 21px 0;
    }
    .header__dropdown__link {
        font-size: 16px;
    }
    .header__nav .btn--sm {
        padding: 14px 32px;
    }
    .hero__wrapper {
        padding: 300px 0 128px;
    }
    .about--section {
        padding-bottom: 112px;
    }
    .about__wrapper {
        padding: 100px 0 84px;
    }
    .contact__wrapper {
        padding: 112px 0 142px;
    }
    .contact__btn__borderLine,
    .header__nav__borderLine__topLeft,
    .header__nav__borderLine__bottomRight,
    .hero__btn__borderLine {
        border-width: 3px;
    }
}

/* XXL Device. */
@media only screen and (min-width: 1600px) {
    .fs-1 {
        font-size: 105px !important;
    }
    .fs-2 {
        font-size: 65px !important;
    }
    .btn {
        min-width: 201px;
        height: 73px;
        padding: 22px 36px;
        font-size: 20px;
    }
    .btn--sm {
        height: 68px;
        padding: 19px 36px;
    }
    .pretitle {
        font-size: 25px;
    }
    .about__border__line {
        width: 208px;
        height: 158px;
        right: -30px;
        bottom: -30px;
        border-width: 4px;
    }

    .header__content {
        margin-right: -88px;
    }
    .logo {
        max-width: 294px;
    }
    .header__menu__link {
        padding: 25px 0;
    }
    .hero__wrapper {
        padding: 372px 0 180px;
    }
    .about--section {
        padding-bottom: 160px;
    }
    .about__content {
        padding-top: 54px;
        padding-left: 104px;
    }
    .service__card {
        padding: 36px 32px 48px;
    }
    .service__borderLine__topLeft,
    .service__borderLine__bottomRight {
        width: 208px;
        height: 158px;
        border-width: 4px;
    }
    .trust__content {
        padding-left: 72px;
    }
    .border-line-top-left,
    .border-line-top-right {
        width: 208px;
        height: 158px;
        border-width: 4px;
    }
    .border-line-bottom-left,
    .border-line-bottom-right {
        width: 146px;
        height: 112px;
        border-width: 4px;
    }
    .row--form.g-md-4 {
        --bs-gutter-x: 32px;
    }
    .form__input {
        padding: 19px 0;
        font-size: 20px;
    }
    .form__input--textarea {
        height: 108px;
    }
    .footer__logo {
        max-width: 228px;
    }
}

@media only screen and (min-width: 1750px) {
    .about--section {
        padding-bottom: 228px;
    }
    .contact__thumb__ellipse {
        width: 77%;
    }
}
@media only screen and (min-width: 1900px) {
    .about--section {
        padding-bottom: 304px;
    }
    .contact__thumb__ellipse {
        width: 70%;
    }
}
