@media (max-width: 1300px) {
    .header {
        background-position: center;
    }
    .header__title,
    .why__title,
    .how__title {
        font-size: 46px;
    }
    .why__content-title {
        font-size: 40px;
    }
    .secure__title {
        font-size: 32px;
    }
    .footer__block-title {
        font-size: 51px;
    }
    .header__inner {
        padding-bottom: 50%;
    }
    .secure__boxes {
        flex-wrap: wrap;
        justify-content: center;
        gap: 40px;
    }
    .secure__box:nth-of-type(2n) {
        margin-bottom: 0;
    }
    .secure__box:nth-of-type(2) {
        border: none;
    }
    .video__header {
        font-size: 20px;
        width: 185px;
        height: 56px;
        top: -26px;
    }
    .why__image {
        width: 50%;
    }
    .mobile__image {
        width: 30%;
    }
    .footer__block-inner {
        padding: 50px;
    }
    .footer__block-phone {
        width: 300px;
    }
    .footer__block-header {
        font-size: 24px;
        margin-bottom: 20px;
    }
    .footer__block-link > svg {
        width: 150px;
    }
    .footer__block-title {
        max-width: 400px;
        width: 100%;
    }
    .footer__block-links {
        gap: 20px;
    }
    .footer__links {
        max-width: 308px;
    }
    .footer__socials {
        max-width: 150px;
    }
    .footer__links-link {
        font-size: 14px;
    }
    .footer__link-image {
        width: 180px;
    }
}

@media (min-width: 1301px) {
    .header {
        background-size: cover;
        background-position: center top;
        background-repeat: no-repeat;
    }
}
@media (max-width: 1100px) {
    .mobile__inner {
        flex-direction: column;
        align-items: center;
        gap: 50px;
    }
    .mobile__column {
        display: flex;
        gap: 50px;
    }
    .mobile__column:first-of-type > .mobile__box:first-of-type {
        margin: 0;
    }
    .mobile__column:last-of-type > .mobile__box:first-of-type {
        margin: 0;
    }
    .mobile__column:last-of-type > .mobile__box {
        margin-left: 0;
    }

    .mobile__box-icon.second {
        left: auto;
        right: -32px;
    }
    .mobile__box-icon.third {
        right: auto;
        left: -32px;
    }
    .mobile__image {
        order: 1;
    }
    .mobile__column:first-of-type {
        order: 2;
    }
    .mobile__column:last-of-type {
        order: 3;
    }
}
@media (max-width: 950px) {
    .footer__block-links {
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }
}
@media (max-width: 768px) {
    .footer__menu {
        flex-direction: column;
        gap: 30px;
    }
    .mobile__box-icon {
        width: 40px;
        top: 0;
        right: auto;
        left: -10px;
    }
    /* Ensure all icon variants are forced to top-left on small screens */
    .mobile__box-icon.first,
    .mobile__box-icon.second,
    .mobile__box-icon.third,
    .mobile__box-icon.fourth {
        left: -10px;
        right: auto;
    }
    .header__title,
    .how__title,
    .why__title {
        font-size: 41px;
    }
    .why__content-title {
        font-size: 36px;
    }
    .secure__title {
        font-size: 29px;
    }
    /* Make secure cards more compact and wider on small screens */
    .secure__boxes {
        gap: 20px;
        justify-content: center;
    }
    .secure__box {
        height: auto;
        max-width: 92%;
        padding: 24px;
    }
    .footer__block-title {
        font-size: 46px;
    }
    .header__text,
    .secure__box-text,
    .why__content-item > p,
    .mobile__box-text {
        font-size: 14px;
    }
    .header__inner {
        padding-bottom: 25%;
    }
    .secure__box-image {
        width: 50px;
        margin-bottom: 20px;
    }
    .secure {
        padding: 60px 0;
    }
    .how__content {
        flex-direction: column;
    }
    .how__title {
        text-align: center;
    }
    .why__box {
        flex-direction: column;
    }
    .footer__block-circles {
        z-index: -1;
        width: 345px;
    }
    .footer__block-phone {
        width: 210px;
        right: 10px;
    }
}
@media (max-width: 500px) {
    .mobile__inner {
        flex-direction: column;
        align-items: center;
        gap: 50px;
    }
    .mobile__image {
        width: 60%;
    }
    /* Further tighten spacing on very small screens */
    .secure__boxes {
        gap: 16px;
    }
    .secure__box {
        max-width: 94%;
        padding: 20px;
    }
    .mobile__column {
        flex-direction: column;
        align-items: center;
    }
    .video__header {
        font-size: 14px;
        right: 0;
        left: 0;
        margin: auto;
        width: 172px;
        height: 37px;
        top: -19px;
    }
    .video__overlay img {
        width: 45px;
    }
    .how__box-header {
        justify-content: space-between;
    }
    .how__box-title {
        font-size: 20px;
        text-align: right;
    }
    .how__box-text {
        font-size: 14px;
        text-align: right;
    }
    .how__box-text {
        padding-left: 60px;
    }
    .header__title,
    .why__title,
    .how__title {
        font-size: 38px;
    }

    .why__content-title {
        font-size: 33px;
    }

    .footer__block-title {
        font-size: 42px;
    }

    .header__form-submit,
    .header__form-input,
    .mobile__box-title,
    .footer__button {
        font-size: 14px;
    }
    .header__logo {
        margin-bottom: 40px;
    }
    .header__logo-image {
        width: 151px;
    }
    .header__form-input,
    .header__form-input::placeholder,
    .header__form-submit {
        font-size: 14px;
    }
    .header__form-submit {
        width: 108px;
    }
    .header__form-input {
        padding-right: 116px;
        display: block;
    }
    .header__text {
        margin-bottom: 25px;
    }
    .header__form {
        width: 100%;
    }
    .header__video {
        position: static;
        margin: 40px 0;
    }
    .header__inner {
        padding-bottom: 60px;
        padding: 70px 0 486px;
    }
    .how,
    .why,
    .mobile {
        padding: 60px 0;
    }
    .mobile {
        padding-bottom: 264px;
    }
    .why__image {
        width: 70%;
    }
    .footer__block-phone {
        display: none;
    }
    .footer__block-links {
        align-items: center;
    }
    .footer__block-title,
    .footer__block-header {
        text-align: center;
    }
    .modals {
        padding: 5px;
    }
    .form__input,
    .form__textarea,
    .form__textarea::placeholder,
    .form__subtitle,
    .form__label-text,
    .form__input::placeholder {
        font-size: 14px;
    }
    .form__title {
        font-size: 20px;
    }
    .footer__button {
        padding: 20px 10px;
    }
    .form__radioboxes{
        margin-bottom: 20px;
    }
    .popup{
        max-width: calc(100% - 40px);
        right: 0;
        left: 0;
        margin: auto;
        bottom: 20px;
    }
}
@media (max-width: 390px) {
    .header__form-box{
        padding-left: 10px;
    }
    .form__submit {
        width: 100%;
    }
    .footer__block-title {
        font-size: 30px;
    }
    .header__form-box::before {
        display: none;
    }
    .header__form-input {
        padding-left: 0;
        padding-right: 72px;
    }
    .header__form-submit {
        padding: 0;
        width: 70px;
    }
    .footer__links {
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }
    .form__header,
    .form__body {
        padding: 20px;
    }
    .closeModal > svg {
        width: 20px;
        height: 20px;
    }
    .closeModal {
        right: 20px;
    }
}

