* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

img {
    display: block;
    width: 100%;
    height: auto;
}

ul {
    list-style: none;
}

a {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}


:root {
    --primary-color: #0c43b7;
    --secondary-color: #0935B2;
    --background-color: #010B58;
    --backgroundS-color: #0216a9;
    --text-color: #fff;
    --textS-color: #011080;
    --link-color: #5147A4;
    --base-transform: translate(0, 0);
    --float-duration: 5s;
    --float-timing: ease-in-out;
}

body {
    font-family: "Inter", sans-serif;
}

header {
    padding: 100px 0;
    background: var(--primary-color);
    position: relative;
    z-index: 10;
}

.nav__mob {
    position: fixed;
    width: 100%;
    height: 67px;
    left: 0;
    top: 0;
    z-index: 9999;
}


.nav__mob {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--background-color);
    padding: 10px;
}

.logo {
    max-width: 63px;
}

.people__cnt {
    display: flex;
    align-items: center;
    background: var(--secondary-color);
    border-radius: 32px;
    max-width: 135px;
    padding-right: 15px;
}

.people__number {
    background: #fff;
    border-radius: 50%;
    min-width: 44px;
    height: 44px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
}

.people__cnt p {
    color: #fff;
    font-size: 9px;
    margin-left: 8px;
}

/* ============BURGER=============== */


/* Responsive Adjustments */
@media (min-width: 768px) {
    .nav-menu {
        width: 750px;
    }
}

/*Medium Screens */
@media (min-width: 922px) {
    .nav-menu {
        width: 970px;
    }
}

/*Large Screens */
@media (min-width: 1200px) {
    .nav-menu {
        width: 1170px;
    }
}

/* Burger Icon Container */
.burger-container {
    z-index: 1000;
    cursor: pointer;
    width: 40px;
    height: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 5px;
    border-radius: 5px;
}

/* Burger Icon Lines */
.burger-line {
    width: 100%;
    height: 3px;
    background-color: #fff;
    border-radius: 2px;
    transform-origin: center;
    transition: all 0.4s ease-in-out;
}

/* Checkbox Hack */
#burger-toggle {
    display: none;
}

/* Navigation Styles */
.nav-menu {
    position: fixed;
    top: 0;
    right: -300px;
    width: 300px;
    height: 100%;
    background: linear-gradient(111.6deg, #081DBD 1.49%, #011187 98.73%);

    transition: right 0.4s cubic-bezier(0.77, 0.2, 0.05, 1);
    box-shadow: -4px 0 15px #00000033;
    overflow-y: auto;
    padding-top: 100px;
}

.nav-menu::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 67px;
    background: #ffffff0d;
    backdrop-filter: blur(10px);
}

.nav-menu ul {
    list-style-type: none;
}

.nav-menu ul li {
    margin: 0 15px;
    border-bottom: 1px solid #ffffff1a;
}

.nav-menu ul li a {
    color: white;
    text-decoration: none;
    display: block;
    padding: 15px;
    font-weight: 500;
    position: relative;
    overflow: hidden;
}

.nav-menu ul li a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -100%;
    width: 100%;
    height: 2px;
    background-color: var(--secondary-color);
    transition: left 0.3s ease;
}

.nav-menu ul li a:hover::after {
    left: 0;
}

/* Burger Icon Animation on Checkbox Checked */
#burger-toggle:checked ~ .burger-container .burger-line:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

#burger-toggle:checked ~ .burger-container .burger-line:nth-child(2) {
    opacity: 0;
}

#burger-toggle:checked ~ .burger-container .burger-line:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}

/* Navigation Slide In */
#burger-toggle:checked ~ .nav-menu {
    right: 0;
}

h1 {
    max-width: 361px;
    margin: 0 auto 20px;
    color: var(--text-color);
    font-weight: 600;
    font-size: 38px;
    text-align: center;
    line-height: 96%;
}

.after__title {
    font-size: 10px;
    max-width: 206px;
    margin: 0 auto 25px;
    text-align: center;
    color: var(--text-color);
}

.offer__link {
    background: var(--text-color);
    color: var(--link-color);
    border-radius: 32px;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    max-width: 200px;
    padding: 20px 10px;
    margin: 0 auto;
}

/* ================================================================== */

.cycle {
    padding: 51px 10px 100px;
    position: relative;
}

.cycle__circle,
.formF__circle {
    position: absolute;
    top: -49px;
    left: 50%;
    max-width: 97px;
    transform: translate(-50%, 0);
    z-index: 1;
}

.cycle__cubeR,
.cycle__cubeL {
    position: absolute;
    max-width: 85px;
    right: 0;
    top: -62px;
    z-index: 11;
}

.cycle__cubeL {
    top: unset;
    bottom: -62px;
    right: unset;
    left: 0;
}

.clock {
    max-width: 290px;
    margin: 0 auto;
}

.cycle__cnt {
    width: 100%;
    max-width: 323px;
    height: 326px;
    margin: 0 auto;
}

.title__b {
    font-weight: 500;
    font-size: 44px;
    line-height: 96%;
    text-align: start;
    margin: 0 0 20px;
    color: var(--textS-color);
}

.cycle__list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cycle__list li {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #011080CC;
    font-size: 19px;
}

.check {
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #011080CC;
    min-width: 26px;
    height: 26px;
}

.check img {
    max-width: 14px;
}

.formF {
    background: var(--primary-color);
    padding: 100px 10px;
    position: relative;
}

.form__cnt {
    max-width: 330px;
    margin: 0 auto;
}

.form__title {
    color: var(--text-color);
    text-align: center;
    font-weight: 500;
    font-size: 38px;
    margin: 0 auto 25px;
}

.form__main {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.form__main input {
    width: 100%;
    background: transparent;
    padding: 15px;
    border: 1px solid #fff;
    border-radius: 28px;
}

.form__main input::placeholder {
    color: #D1D0D0;
}

.btnSend {
    display: flex;
    border: none;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 262px;
    margin: 0 auto;
    padding: 15px;
    color: #574CB2;
    background: var(--text-color);
    border-radius: 30px;
    font-weight: 600;
    font-size: 18px;
}

.blue__wrapper {
    background: linear-gradient(111.6deg, #081DBD 1.49%, #011187 98.73%);
}

.ideas {
    padding: 50px 10px;
    position: relative;
}

h3 {
    text-align: center;
    color: var(--text-color);
    font-weight: 600;
    font-size: 38px;
    line-height: 96%;
    max-width: 315px;
    margin: 0 auto 20px;
}

.ideas__afterTitle {
    text-align: center;
    color: #D1D0D0;
    font-size: 10px;
    max-width: 226px;
    margin: 0 auto 25px;
}

.zigL {
    position: absolute;
    left: 0;
    top: 240px;
    max-width: 85px;
}

.zigR {
    position: absolute;
    right: 0;
    top: 240px;
    max-width: 85px;
}

.offer__link-m {
    margin: 0 auto 40px;
}

.ideas__list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
    align-items: center;
    margin: 0 auto 50px;
}

.ideas__list li {
    width: 100%;
    max-width: 348px;
    border-radius: 32px;
    border: 1px solid #fff;
    padding: 160px 10px 30px;
    position: relative;
}

.eclBw {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 0);
}

.spiral__cnt {
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 100%;
    max-width: 288px;
    background: url('../img/eclW.png') no-repeat bottom / cover;
    padding: 0px 15px 15px 15px;
}

.spiral {
    max-width: 240px;
    margin: 0 auto;
}

.ideas__listCnt {
    color: var(--text-color);
    text-align: center;
    max-width: 277px;
    margin: 0 auto;
}

.ideas__listTitle {
    font-weight: 500;
    font-size: 40px;
    line-height: 96%;
    margin: 0 auto 25px;
}

.ideas__listText {
    font-size: 14px;
    margin: 0 auto 20px;
}

.offer__link-ideas {
    max-width: 100%;
    padding: 15px 10px;
}

.ideas__li-w {
    background: var(--text-color);
}

.spiral__cnt-w {
    background: url('../img/eclBl.png') no-repeat center / cover;
}

.ideas__listCnt-w {
    color: var(--textS-color);
}

.offer__link-ideas-w {
    background: var(--textS-color);
    color: var(--text-color);
}

.knwon__titleCnt {
    background: #fff;
    border-radius: 30px;
    padding: 30px 20px;
    max-width: 370px;
    margin: 0 auto 15px;
}

.known__title {
    text-align: center;
    font-weight: 600;
    font-size: 38px;
    line-height: 96%;
    margin: 0 auto 20px;
    color: var(--textS-color);
}

.known__titleAfter {
    font-size: 10px;
    text-align: center;
    width: 100%;
    max-width: 226px;
    margin: 0 auto 25px;
    color: #011080CC;
}

.known__list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
}

.known__list li {
    background: #fff;
    border-radius: 30px;
    padding: 20px;
    text-align: center;
    width: 100%;
    max-width: 370px;
}

.known__list img {
    max-width: 223px;
    margin: 0 auto 20px;
}

.known__list img:first-child {
    margin: 0 auto;
}

.known__listTitle {
    color: #3B479C;
    font-size: 22px;
    font-weight: 500;
    margin: 0 auto 15px;
}

.knwon__listText {
    color: #404B9D;
    font-size: 14px;
    font-weight: 400;
    line-height: 150%;
}

.innov {
    padding: 0 0 50px;
}

.innov__man {
    max-width: 400px;
    margin: 0 auto 15px;
}

h4 {
    text-align: center;
    font-weight: 600;
    font-size: 38px;
    line-height: 96%;
    color: var(--text-color);
    max-width: 361px;
    margin: 0 auto 20px;
}

.innov__titleAfter {
    color: #D1D0D0;
    font-size: 10px;
    max-width: 232px;
    margin: 0 auto 20px;
    text-align: center;
}

.innov__cnt {
    margin: 0 auto 40px;
}

.innov__list {
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
    padding: 30px;
    background: #fff;
    border-radius: 30px;
    width: 100%;
    max-width: 296px;
    margin: 0 auto 70px;
}

.innov__list li {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #3B479C;
    font-size: 18px;
}

.magic {
    margin: 0 auto 10px;
}

.magicBlock {
    background: #fff;
    width: 100%;
    text-align: center;
    padding: 100px 20px 30px 20px;
    position: relative;
    margin: 0 auto 20px;
}

.magic__circle {
    position: absolute;
    top: -47px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 100%;
    max-width: 97px;
}

.cleverL,
.cleverR {
    position: absolute;
    width: 100%;
    max-width: 90px;
    top: -62px;
}

.cleverR {
    top: -68px;
}

.cleverL {
    left: 0;
}

.cleverR {
    right: 0;
}

.magic__cnt {
    width: 100%;
    max-width: 346px;
    margin: 0 auto;
}

.magic__title {
    font-weight: 600;
    font-size: 38px;
    line-height: 96%;
    color: var(--textS-color);
    margin: 0 auto 20px;
}

.magic__titleAfter {
    font-size: 10px;
    width: 100%;
    margin: 0 auto;
    max-width: 240px;
    color: #011080CC;
}

.com__cnt {
    width: 100%;
    max-width: 375px;
    margin: 0 auto 10px;
    position: relative;
}

.com__lCnt {
    background: url('../img/1mPaul.png') no-repeat center / cover;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    height: 248px;
    overflow: hidden;
    padding: 1px 1px 1px 4px;
}

.com__imgCnt {
    position: relative;
    max-width: 200px;
}

.com__imgOverlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.com__bLayer {
    position: relative;
    z-index: 5;
}

.com__textCnt {
    width: 100%;
    max-width: 150px;
    color: #fff;
    padding: 20px 10px 20px 0;
}

.com__textTitle {
    font-size: 25px;
    margin: 0 0 10px;
}

.com__text {
    color: #D1D0D0;
    font-size: 9px;
}

.com__leCnt {
    position: absolute;
    right: 0;
    top: 0;
    background: #fff;
    width: 100%;
    max-width: 154px;
    border-radius: 19px;
    padding: 15px 15px 10px;
    text-align: center;
}

.com__leNum {
    color: #434D97;
    font-size: 50px;
}

.com__leNumText {
    color: #404B9D;
    font-size: 9px;
}

.com__lCnt_r {
    flex-direction: row-reverse;
    background: url('../img/1mPaulR.png') no-repeat center / cover;
}

.com__leCnt_r {
    left: 0;
    right: unset;
}

.com__lCnt_r .com__bLayer {
    max-width: 190px;
}

.com__lCnt_r .com__textCnt {
    padding: 20px 0 20px 10px;
}

.com__wrapper {
    position: relative;
    margin: 0 auto;
}

.comCubeL,
.comCubeR {
    position: absolute;
    max-width: 30px;
}

.comCubeR {
    right: 0;
    top: 86px;
}

.comCubeL {
    bottom: 115px;
}

.business {
    padding: 60px 0;
    background: #fff;
    position: relative;
}

.busCircle {
    position: absolute;
    left: 50%;
    bottom: -40px;
    transform: translate(-50%, 0);
    max-width: 96px;
}

.busMeduzaL,
.busMeduzaR {
    position: absolute;
}

.busMeduzaL {
    max-width: 70px;
    left: 0;
    top: 350px;
}

.busMeduzaR {
    right: 0;
    bottom: -60px;
    max-width: 90px;
}

.businessTitle__cnt {
    margin: 0 auto 40px;
}

.business__title {
    font-weight: 600;
    font-size: 38px;
    line-height: 96%;
    color: var(--textS-color);
    margin: 0 auto 20px;
    text-align: center;
    max-width: 315px;

}

.business__titleAfter {
    font-size: 10px;
    width: 100%;
    margin: 0 auto 40px;
    max-width: 240px;
    text-align: center;
    color: #011080CC;
}

.business__list {
    display: flex;
    flex-direction: column;
    gap: 15px;
    justify-content: center;
    align-items: center;
}

.business__list li {
    width: 100%;
    max-width: 360px;
    background: #000a57;
    border-radius: 32px;
    padding: 60px 20px;
    text-align: center;
    position: relative;
}

.bus__listTitle {
    color: #fff;
    font-size: 40px;
    font-weight: 500;
    margin: 0 auto 20px;
}

.bus__listText {
    color: #D1D0D0;
    font-size: 14px;
    margin: 0 auto 30px;
}

.busO,
.busS {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    max-width: 298px;
}

.busO {
    top: 0;

}

.busS {
    bottom: 0;
}

footer {
    background: var(--background-color);
    padding: 60px 0 0;
}

.footer__logo {
    max-width: 84px;
    margin: 0 auto 25px;
}

.footer__phone {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    gap: 10px;
    font-weight: 700;
    font-size: 22px;
    margin: 0 auto 30px;
}

.footer__phone img {
    max-width: 38px;
}

footer span {
    color: #fff;
    font-size: 14px;
    text-align: center;
    margin: 0 auto 30px;
    width: 100%;
    display: block;
}

.footer__links {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    padding: 0 15px;
    margin: 0 auto 40px;
}

.social__links {
    background: #fff;
    padding: 20px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.social__links li {
    max-width: 85px;
}

.main__wrapperDes {
    display: none;
    padding: 10px 0;
}

@media (min-width: 1200px) {
    .main__wrapperMob {
        display: none;
    }

    header {
        background: transparent;
        padding: 0;
        position: relative;
        height: 624px;
    }

    .heO {
        position: absolute;
        width: 100%;
        z-index: 3;
    }

    nav {
        padding: 2px 0;
        position: relative;
    }

    .nav__bg {
        position: absolute;
        width: 100%;
        max-width: 629px;
        height: 98px;
        left: 0;
        top: 0;
    }

    .main__wrapperDes {
        display: block;
        background: linear-gradient(171.5deg, #0E46B8 0.4%, #0D042E 96.57%);
    }

    .desMain {
        width: 100%;
        max-width: 1205px;
        margin: 0 auto;
    }

    .nav__list {
        font-size: 18px;
        font-weight: 600;
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 629px;
        padding: 0 77px;
        justify-content: space-between;
        color: #fff;
        position: relative;
        z-index: 20;
    }

    .logo {
        position: relative;
        z-index: 3;
        margin-right: 78px;
    }

    .offer__link {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 15px;
        border-radius: 40px;
        background: #fff;
        color: #3B479C;
        font-size: 18px;
        margin: 0;
        position: relative;
        z-index: 30;
    }

    nav {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .people__number {
        background: #535EB1;
        color: #fff;
        font-size: 30px;
        min-width: 54px;
        height: 54px;
    }

    .people__cnt {
        background: #454F9E;
        max-width: 171px;
    }

    .people__cnt p {
        font-size: 11px;
    }

    .header__wrapper {
        display: flex;
        position: relative;
        z-index: 3;
        justify-content: flex-end;
        align-items: center;
        padding: 0 20px 0 0;
    }

    .manH {
        max-width: 841px;
        position: absolute;
        left: -40px;
        top: 2px;
    }

    .header__cnt {
        padding-top: 60px;
        width: 100%;
        max-width: 501px;
        position: relative;
    }

    .plO {
        position: absolute;
        max-width: 170px;
        right: 0;
        bottom: -50px;
    }

    h1 {
        text-align: start;
        font-size: 50px;
        font-weight: 600;
        max-width: 100%;
        margin: 0 auto 20px;
    }

    .after__title {
        font-size: 14px;
        text-align: start;
        margin: 0 0 20px;
        max-width: 292px;
        color: #D1D0D0;
    }

    .cycle {
        padding: 5px 0;
        display: flex;
        justify-content: space-between;
        position: relative;
        margin: 0 auto 5px;
    }

    .pl_cycle {
        position: absolute;
        max-width: 170px;
        right: 400px;
        top: -115px;
        z-index: 11;
    }

    .cycle__cnt {
        position: relative;
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        max-width: 748px;
        background: #fff;
        border-radius: 30px;
        margin: 0;
    }

    .circle_w {
        position: absolute;
        right: -40px;
        top: 51%;
        transform: translate(0, -50%);
        width: 80px;
        height: 80px;
        border-radius: 50%;
        background: #fff;
    }

    .clockImg {
        max-width: 321px;
    }

    .title__b {
        font-size: 40px;
    }

    .cycle__formWrapper {
        width: 100%;
        max-width: 441px;
        background: url('../img/des/fBG.png') no-repeat center / cover;
        height: 448px;
        position: absolute;
        right: 2px;
        top: -114px;
    }

    .form__title {
        color: #fff;
        padding-top: 20px;
    }

    .form__main {
        max-width: 350px;
        /*font-size: 40px;*/
    }

    .form__main input {
        padding: 10px;
        height: 44px;
    }

    .ideas {
        padding: 80px 10px;
        background: linear-gradient(111.12deg, #011291 1.49%, #011080 164.61%);
        border-radius: 40px;
        border: 1px solid #fff;
        position: relative;
        margin: 0 auto 5px;
    }

    .zigF {
        position: absolute;
        max-width: 173px;
        left: 64px;
        top: 108px;
    }

    .zigS {
        position: absolute;
        max-width: 173px;
        right: 64px;
        top: 108px;
    }

    .ideas__title {
        max-width: 899px;
        margin: 0 auto 20px;
        font-size: 50px;
        font-weight: 600;
        text-align: center;
        color: #fff;
    }

    .ideas__afterTitle {
        max-width: 554px;
        font-size: 14px;
        color: #D1D0D0;
        text-align: center;
        margin: 0 auto 60px;
    }

    .ideas__list {
        max-width: 1053px;
        margin: 0 auto;
        width: 100%;
        display: flex;
        flex-direction: row;
        gap: 5px;
    }

    .ideas__list li {
        max-width: 348px;
        padding-top: 140px;
        border: none;
        height: 392px;
        background: url('../img/des/o1.png') no-repeat center / cover;
    }

    .ideas__list li:nth-child(2) {
        background: url('../img/des/o2.png') no-repeat center / cover;
        position: relative;

    }

    .ideas__list li:nth-child(2) .ideas__listCnt {
        color: #3B479C;
    }

    .ideas__list li:nth-child(2)::before {
        position: absolute;
        content: '';
        width: 80px;
        height: 80px;
        border-radius: 50%;
        background: #fff;
        left: -40px;
        top: 50%;
        transform: translate(0, -50%);
    }

    .ideas__list li:nth-child(2)::after {
        position: absolute;
        content: '';
        width: 80px;
        height: 80px;
        border-radius: 50%;
        background: #fff;
        right: -40px;
        top: 50%;
        transform: translate(0, -50%);
        z-index: 3;
    }

    .ideas__list li:last-child {
        background: url('../img/des/o3.png') no-repeat center / cover;
    }

    .offer__link-ideas_b {
        background: linear-gradient(84.6deg, #4D43A1 -7.59%, #2C265C 225.6%);
        color: #fff;
    }

    .ideas__listText {
        color: #D1D0D0;
    }

    .ideas__listText-b {
        color: #404B9D;
    }

    .tech {
        position: relative;
        margin: 0 auto 5px;
    }

    .cubeF {
        position: absolute;
        max-width: 290px;
        top: 50%;
        right: 270px;
        transform: translate(0, -50%);
    }

    .cubeL {
        position: absolute;
        max-width: 290px;
        left: 270px;
        top: 58%;
        transform: translate(0, -50%);
    }

    .tech__wrapper {
        display: flex;
        align-items: center;
        margin: 0 auto 5px;
        gap: 5px;
    }

    .tech__wrap {
        background: #fff;
        border-radius: 40px;
        padding: 40px 20px;
        width: 100%;
        max-width: 795px;
        height: 326px;
    }

    .tech__title {
        font-size: 50px;
        font-weight: 600;
        max-width: 694px;
        margin: 0 auto 20px;
        color: #5B69CD;
        text-align: center;
        line-height: .96;
    }

    .tech__titleCnt {
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 457px;
        margin: 0 auto;
        justify-content: space-between;
    }

    .tech__titleCnt p {
        max-width: 227px;
        text-align: end;
        font-size: 14px;
        line-height: 1.5;
        color: #5B69CD;
    }

    .offer__link-b {
        background: #011080;
        color: #fff;
    }

    .tech__cnt {
        width: 100%;
        max-width: 394px;
        height: 326px;
        background: #fff;
        border-radius: 40px;
        text-align: center;
    }

    .tech__cnt img {
        max-width: 224px;
        margin: 0 auto;
    }

    .known__listTitle {
        text-align: center;
    }

    .tech__list {
        display: flex;
        justify-content: space-between;
    }

    .tech__list li {
        width: 100%;
        max-width: 394px;
        height: 326px;
    }

    .inno {
        width: 100%;
        height: 734px;
        background: url('../img/des/ino.png') no-repeat center / cover;
        position: relative;
        padding: 30px 0;
        margin: 0 auto 5px;
    }

    .inno__tech {
        position: absolute;
        right: 0;
        bottom: 0;
        max-width: 583px;
    }

    .flowO {
        position: absolute;
        left: 42%;
        top: 45%;
        transform: translate(-42%, -45%);
        max-width: 178px;
    }

    .flowS {
        position: absolute;
        max-width: 142px;
        bottom: 100px;
        left: 50%;
        transform: translate(-50%, 0);
    }


    .inno__wrap {
        width: 100%;
        max-width: 683px;
        color: #fff;
        padding: 0 0 0 40px;
    }

    .inno__title {
        font-weight: 600;
        font-size: 55px;
        line-height: .96;
        margin: 0 auto 20px;
    }

    .inno__afterTitle {
        color: #D1D0D0;
        font-size: 14px;
        line-height: 1.5;

    }

    .inno__cnt {
        width: 100%;
        max-width: 625px;
        border-radius: 30px;
        background: #fff;
        position: absolute;
        bottom: 0;
        height: 357px;
        left: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .innov__list {
        width: 100%;
        max-width: 528px;
        margin: 0 auto;
        background: transparent;
        border-radius: unset;
        flex-wrap: wrap;
        padding: 0;
        flex-direction: unset;
        justify-content: flex-start;
        gap: 10px;
    }

    .innov__list li {
        width: 100%;
        max-width: 250px;
    }

    .magic__wrap {
        position: relative;
        background: #fff;
        border-radius: 40px;
        padding: 75px 0;
        text-align: center;
        margin: 0 auto 10px;
    }

    .palaF {
        position: absolute;
        max-width: 145px;
        left: 30px;
        top: 30px;
    }

    .palaS {
        position: absolute;
        max-width: 145px;
        bottom: 30px;
        right: 30px;
    }

    .mF {
        position: absolute;
        left: 30px;
        bottom: 0;
        max-width: 300px;
    }

    .mS {
        position: absolute;
        right: 30px;
        top: 0;
        max-width: 300px;
    }

    .magic__title {
        color: #4D569D;
        max-width: 748px;
        margin: 0 auto 20px;
    }

    .magic__afterTitle {
        font-size: 14px;
        color: #404B9D;
        max-width: 463px;
        margin: 0 auto;
    }

    .com__wrapper {
        display: flex;
        gap: 10px;
        justify-content: center;
    }

    .com__pala {
        position: absolute;
        max-width: 105px;
        top: 45%;
        left: 50%;
        transform: translate(-50%, -45%);
        z-index: 10;
    }

    .com__cnt {
        margin: 0;
        max-width: 595px;
        height: 393px;
    }

    .com__lCnt {
        height: 100%;
    }

    .com__imgCnt {
        max-width: 342px;
    }

    .com__lCnt_r .com__bLayer {
        max-width: 304px;
    }

    .com__textCnt,
    .com__lCnt_r .com__textCnt {
        max-width: 238px;
        padding: 20px 10px 40px 0;
    }

    .com__lCnt_r .com__textCnt {
        padding: 20px 0 40px 10px;
    }

    .com__text {
        font-size: 14px;
    }

    .com__textTitle {
        font-size: 40px;
    }

    .com__leCnt {
        max-width: 245px;
        padding: 22px 15px 10px;
        border-radius: 30px;
    }

    .com__leNum {
        font-size: 80px;
    }

    .com__leNumText {
        font-size: 14px;
    }

    .profit {
        background: url('../img/des/prBg.png') no-repeat center / cover;
        padding: 100px 10px;
        position: relative;

    }

    .plateO, .plateS, .plateT, .plateF {
        position: absolute;
        z-index: 9;
        max-width: 173px;
    }

    .plateO {
        top: -14px;
        left: 50px;
    }

    .plateS {
        left: 30%;
        top: 50%;
        transform: translate(0, -50%);
    }

    .plateT {
        right: 0;
        top: 50%;
        transform: translate(0, -50%);
    }

    .plateF {
        bottom: 0;
        right: 27%;
    }


    .profit__wrapper {
        max-width: 1100px;
        width: 100%;
        margin: 0 auto;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
    }


    .profit__wrap {
        background: url('../img/des/prI.png') no-repeat center / cover;
        max-width: 360px;
        width: 100%;
        height: 300px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        color: #fff;
        position: relative;
        z-index: 3;
    }

    .profit__wrap-wC::after {
        position: absolute;
        content: '';
        background: #fff;
        border-radius: 50%;
        max-width: 80px;
        width: 100%;
        height: 80px;
        bottom: -40px;
        left: 50%;
        transform: translate(-50%, 0);
    }


    .profit__wrap-bT:before {
        position: absolute;
        content: '';
        top: -32px;
        left: 50%;
        border-radius: 50%;
        background: linear-gradient(180deg, #000A58 0%, #010B58 100%);
        transform: translate(-50%, 0);
        width: 100%;
        max-width: 65px;
        height: 65px;
    }

    .profit__wrap-bT:after {
        position: absolute;
        content: '';
        top: 50%;
        right: -32px;
        border-radius: 50%;
        background: linear-gradient(180deg, #000A58 0%, #010B58 100%);
        transform: translate(0, -50%);
        width: 100%;
        max-width: 65px;
        height: 65px;
        z-index: 10;
    }

    .profit__wrap-bT-w {
        z-index: 2;
    }

    .profit__wrap-bT-w::before {
        position: absolute;
        content: '';
        top: 50%;
        left: -48px;
        border-radius: 50%;
        background: #fff;
        transform: translate(0, -50%);
        width: 100%;
        max-width: 77px;
        height: 77px;
    }

    .profit__wrap-bT-s {
        z-index: 1;
    }

    .profit__title {
        font-size: 40px;
        font-weight: 500;
        margin: 0 auto 10px;
    }

    .profit__text {
        color: #D1D0D0;
        font-size: 14px;
        max-width: 310px;
        margin: 0 auto 30px;
        text-align: center;
    }

    .offer__link-profit {
        width: 100%;
        max-width: 290px;
    }

    .profit__cnt {
        width: 100%;
        max-width: 589px;
    }

    .pr__title {
        font-weight: 600;
        font-size: 55px;
        text-align: center;
        line-height: .96;
        color: #404B9D;
        margin: 0 0 10px;
    }

    .pr__cnt {
        display: flex;
        align-items: center;
        gap: 20px;
        max-width: 509px;
        margin: 0 auto;
    }

    .offer__link-pr {
        background: #011080;
        color: #fff;
        width: 100%;
        max-width: 200px;
    }

    .pr__cnt p {
        color: #404B9D;
        font-size: 14px;
    }

    .profit__list {
        max-width: 1100px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .profit__list li {
        width: 100%;
        max-width: 360px;
    }

    footer {
        background: url('../img/des/bgFoo.png') no-repeat center / cover;
        width: 100%;
        max-width: 1201px;
        height: 353px;
        transform: translate(3px, -60px);
        position: relative;
        padding: 120px 0 0 0;
    }

    .social__links {
        position: absolute;
        width: 100%;
        max-width: 433px;
        background: #fff;
        border-radius: 30px;
        left: 0;
        bottom: 0;
    }

    .footer__logo {
        max-width: 63px;
        margin: 0;
    }

    .footer__wrapper {
        max-width: 1077px;
        width: 100%;
        margin: 0 auto 60px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .footer__list {
        display: flex;
        justify-content: space-between;
        color: #fff;
        width: 100%;
        max-width: 474px;
    }

    .footer__phone {
        margin: 0;
    }

    .footer__wrap {
        color: #fff;
        width: 100%;
        max-width: 341px;
        margin: 0 200px 0 auto;
    }

    .footer__cnt {
        display: flex;
        justify-content: space-between;
        font-size: 16px;
        margin: 0 auto 20px;
    }

    .footer__wrap p {
        text-align: center;
        font-size: 14px;
    }


}


/* Floating/Levitating Animation for #img-1 */
#img-4, #img-5, #img-7, #img-10, #img-9 {
    --base-transform: translate(0, -50%);
}

#img-6 {
    --base-transform: translate(-42%, -45%)
}


/* Universal floating animation that uses CSS variables */
.float-gentle {
    animation: var(--float-duration, 4s) var(--float-timing, ease-in-out) infinite floatWithVars;
}

.float-intense {
    animation: var(--float-duration, 2s) var(--float-timing, ease-in-out) infinite floatIntenseWithVars;
}

.float-dreamy {
    animation: var(--float-duration, 5s) var(--float-timing, ease-in-out) infinite floatDreamyWithVars;
}

.float-vert {
    animation: var(--float-duration, 4s) var(--float-timing, ease-in-out) infinite floatVertWithVars;
}

/* Keyframes using CSS variables */
@keyframes floatWithVars {
    0%, 100% {
        transform: var(--base-transform, translate(0, 0)) translateY(0px) translateX(0px);
    }
    25% {
        transform: var(--base-transform, translate(0, 0)) translateY(-8px) translateX(2px);
    }
    50% {
        transform: var(--base-transform, translate(0, 0)) translateY(-5px) translateX(0px);
    }
    75% {
        transform: var(--base-transform, translate(0, 0)) translateY(-12px) translateX(-2px);
    }
}

@keyframes floatIntenseWithVars {
    0%, 100% {
        transform: var(--base-transform, translate(0, 0)) translateY(0px) rotate(0deg) scale(1);
    }
    25% {
        transform: var(--base-transform, translate(0, 0)) translateY(-25px) rotate(2deg) scale(1.02);
    }
    50% {
        transform: var(--base-transform, translate(0, 0)) translateY(-15px) rotate(0deg) scale(1);
    }
    75% {
        transform: var(--base-transform, translate(0, 0)) translateY(-30px) rotate(-2deg) scale(0.98);
    }
}

@keyframes floatDreamyWithVars {
    0%, 100% {
        transform: var(--base-transform, translate(0, 0)) translateY(0px) translateX(0px) rotate(0deg);
    }
    33% {
        transform: var(--base-transform, translate(0, 0)) translateY(-10px) translateX(5px) rotate(1deg);
    }
    66% {
        transform: var(--base-transform, translate(0, 0)) translateY(-5px) translateX(-3px) rotate(-0.5deg);
    }
}

@keyframes floatVertWithVars {
    0%, 100% {
        transform: var(--base-transform, translate(0, 0)) translateY(0px);
    }
    25% {
        transform: var(--base-transform, translate(0, 0)) translateY(-15px);
    }
    50% {
        transform: var(--base-transform, translate(0, 0)) translateY(-8px);
    }
    75% {
        transform: var(--base-transform, translate(0, 0)) translateY(-20px);
    }
}


/* Basic scale pulse */
.pulse-scale {
    animation: pulseScale 2s ease-in-out infinite;
}

@keyframes pulseScale {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

/* Opacity pulse */
.pulse-opacity {
    animation: pulseOpacity 2s ease-in-out infinite;
}

@keyframes pulseOpacity {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

/* Brightness pulse */
.pulse-brightness {
    animation: pulseBrightness 2s ease-in-out infinite;
}

@keyframes pulseBrightness {
    0%, 100% {
        filter: brightness(1);
    }
    50% {
        filter: brightness(1.3);
    }
}

/* Glow filter pulse */
.pulse-glow {
    animation: pulseGlow 2s ease-in-out infinite;
}

@keyframes pulseGlow {
    0%, 100% {
        filter: brightness(1) saturate(1);
    }
    50% {
        filter: brightness(1.4) saturate(1.5);
    }
}

/* Gentle scale pulse */
.pulse-gentle {
    animation: pulseGentle 3s ease-in-out infinite;
}

@keyframes pulseGentle {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
}

/* Intense scale pulse */
.pulse-intense {
    animation: pulseIntense 1.5s ease-in-out infinite;
}

@keyframes pulseIntense {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.15);
    }
}

/* Breathing pulse (combined scale + opacity) */
.pulse-breathing {
    animation: pulseBreathing 4s ease-in-out infinite;
}

@keyframes pulseBreathing {
    0%, 100% {
        filter: saturate(1);
        transform: scale(1);
        opacity: 1;
    }
    50% {
        filter: saturate(1.2);
        transform: scale(1.05);
        opacity: 0.9;
    }
}

/* Fast pulse */
.pulse-fast {
    animation: pulseFast 0.8s ease-in-out infinite;
}

@keyframes pulseFast {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

/* Slow pulse */
.pulse-slow {
    animation: pulseSlow 5s ease-in-out infinite;
}

@keyframes pulseSlow {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.06);
    }
}

/* Heartbeat pulse */
.pulse-heartbeat {
    animation: pulseHeartbeat 1.5s ease-in-out infinite;
}

@keyframes pulseHeartbeat {
    0%, 100% {
        transform: scale(1);
    }
    14% {
        transform: scale(1.1);
    }
    28% {
        transform: scale(1);
    }
    42% {
        transform: scale(1.1);
    }
    70% {
        transform: scale(1);
    }
}

/* Saturation pulse */
.pulse-saturation {
    animation: pulseSaturation 2.5s ease-in-out infinite;
}

@keyframes pulseSaturation {
    0%, 100% {
        filter: saturate(1);
    }
    50% {
        filter: saturate(2);
    }
}

/* Combined filter pulse */
.pulse-filter {
    animation: pulseFilter 2s ease-in-out infinite;
}

@keyframes pulseFilter {
    0%, 100% {
        filter: brightness(1) saturate(1) contrast(1);
    }
    50% {
        filter: brightness(1.2) saturate(1.3) contrast(1.1);
    }
}

/* Hue rotation pulse */
.pulse-hue {
    animation: pulseHue 3s ease-in-out infinite;
}

@keyframes pulseHue {
    0%, 100% {
        filter: hue-rotate(0deg);
    }
    50% {
        filter: hue-rotate(30deg);
    }
}

/* Blur pulse */
.pulse-blur {
    animation: pulseBlur 2s ease-in-out infinite;
}

@keyframes pulseBlur {
    0%, 100% {
        filter: blur(0px);
    }
    50% {
        filter: blur(2px);
    }
}

/* Scale with preserve origin */
.pulse-scale-preserve {
    transform-origin: center center;
    animation: pulseScalePreserve 2s ease-in-out infinite;
}

@keyframes pulseScalePreserve {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}


/* CSS for show animations using *[show] */
*[show] {
    opacity: 0;
    transition: all 0.6s ease;
}

/* Initial states based on animation type */
*[show="right"] {
    transform: translateX(50px);
}

*[show="left"] {
    transform: translateX(-50px);
}

*[show="top"] {
    transform: translateY(-50px);
}

*[show="bottom"] {
    transform: translateY(50px);
}

*[show="scale"] {
    transform: scale(0.8);
}

*[show="opacity"] {
    transform: none;
}

*[show="fade-up"] {
    transform: translateY(30px);
}

*[show="zoom"] {
    transform: scale(0);
}

*[show="rotate"] {
    transform: rotate(-10deg) scale(0.9);
}

*[show="flip"] {
    transform: rotateY(90deg);
}

/* Speed variations */
*[show*="fast"] {
    transition-duration: 0.3s;
}

*[show*="slow"] {
    transition-duration: 1s;
}

/* When animated */
*[show].show-animated {
    opacity: 1 !important;
    transform: translateX(0) translateY(0) scale(1) rotate(0) rotateY(0) !important;
}

.no-overflow {
    overflow: hidden;
}