* {
    margin: 0;
    padding: 0;
    border: none;
}

a {
    text-decoration: none;
}
body {
    font-family: "Poppins", sans-serif;
}
.container {
    width: 90%;
    margin: 0 auto;


}
#header {
    position: sticky;
    background: rgba(239, 232, 232, 0.68);
    z-index: 99;
    top: 0;
    width: 100%;
    backdrop-filter: blur(4px);
}

.header {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 30px 0;
    animation: hed 2s ease-in-out;
}
@keyframes hed {
     0% {
         transform: translateY(-100px);
     }
 }
.header-img  {
    display: flex;
   align-items: center;
    justify-content: space-around;
}
.header-title {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.header-title a {
    padding: 0 18px;
}
.header-title button {
    margin: 0 18px;
}
.header-img h1 {
    font-weight: 700;
    font-size: 30px;
    color: #173A56;
    padding-left: 17px;
}
.header-title .nav-left a  {
    font-weight: 600;
    font-size: 16px;
    color: #173A56;

}

.header-title .nav a {
    font-weight: 600;
    font-size: 16px;
    color: #090909;
}
.header-title .bg {
    width: 110px;
    height: 43px;
    background: #02897A;
    border-radius: 5px;
    font-weight: 600;
    font-size: 16px;
    color: #FFFFFF;
    margin-right: 40px;
}
.header-title .btn {
    width: 110px;
    height: 43px;
    background: transparent;
    border-radius: 5px;
    border: 1px solid #02897A;
    font-weight: 600;
    font-size: 16px;
    color: #173A56;
}
.header-title button:hover {
    background: transparent;
    border: 2px solid #173A56;
    transform: scale(0.8);
}
.header-title button {
    transition: .4s;
}
.header-title .btn a {
    font-weight: 600;
    font-size: 16px;
    color: #173A56;
}
.header-title .bg a {
    font-weight: 600;
    font-size: 16px;
    color: #FFFFFF;
}
#hero {
    background: linear-gradient(179.59deg, #EDEDED 0.35%, rgba(255, 255, 255, 0.0001) 99.63%);
}
.hero {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 60px 0;
}
.hero-title {
    animation: hero 2s ease-in-out;
}
@keyframes hero {
    0% {
        transform: translateX(-800px);
    }

}
.img {
    animation: img 2s ease-in-out;
}
@keyframes img  {
    0% {
        transform: translateX(840px);
    }

}
.hero-title h1 {
    font-weight: 700;
    font-size: 40px;
    line-height: 60px;
    color: #22343D;
    padding-bottom: 20px;
}
.hero-title p {
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #22343D;
    padding-bottom: 50px;
}
.hero-title .btn-left {
    width: 175px;
    height: 53px;
    background: #02897A;
    border-radius: 4px;
    transition: .4s;
}
.hero-title .btn-left a {
    font-weight: 700;
    font-size: 16px;
    color: #FFFFFF;
}
.hero-title .btn-right {
    width: 175px;
    height: 53px;
    background: #FFFFFF;
    transition: .4s;
}
.hero-title .btn-right a {
    font-weight: 600;
    font-size: 19px;
    text-decoration-line: underline;
    color: #02897A;
}
.hero-title .btn-left:hover {
    background: #02897A ;
    border: 2px solid  #02897A;
    border-radius: 5px;
    transform: scale(0.8);
}
.hero-title .btn-right:hover {
    background: transparent;
    transform: scale(0.8);
}
.hero-title .btn-right a{
    display: flex;
    align-items: center;
    justify-content: space-evenly;

}

#product {
    background: url("../img/phone.png") no-repeat center/cover;
    min-height: 70vh;
}
.product {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-bottom: 90px;
}
.product-title {
    font-weight: 700;
    font-size: 32px;
    line-height: 48px;
    text-align: center;
    color: #22343D;
    padding: 90px 0;
    animation: top 2s ease-in-out;
}
@keyframes top {
0%      {
    transform: translateY(200px);
}
}

.figure {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #02897A;
    border-radius: 19px;
}
.card .figure a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-size: 18px;
}

.card h1 {
    font-weight: 600;
    font-size: 22px;
    color: #22343D;
    padding-top: 35px;

}
.card p {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #22343D;
    padding-top: 20px;
}
.product-btn button:hover {
    background: transparent;
    border: 2px solid #02897A;
    transform: scale(0.8);
}
.product-btn button {
    width: 175px;
    height: 53px;
    background: #02897A;
    border-radius: 4px;
    font-weight: 700;
    font-size: 16px;
    color: #FFFFFF;
    transition: .4s;

}
.product-btn {
    display: flex;
    align-items: center;
    justify-content: center;
}

#docum {
    background: #FFFFFF;
}
.docum {
    padding: 150px 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.docum-title h4 {
    font-weight: 600;
    font-size: 16px;
    color: #22343D;

}
.docum-title h1 {
    font-weight: 700;
    font-size: 32px;
    color: #22343D;
    padding: 20px 0;
}
.docum-title p {
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #22343D;
    padding-bottom: 20px;
}
.docum-title p span {
    font-weight: 600;
    font-size: 16px;
    color: #22343D;
    padding-bottom: 25px;
}

#lump {
    background: #FFFFFF;
}
.lump {
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.lump-top h4 {
    font-weight: 600;
    font-size: 16px;
    color: #22343D;
}
.lump-top h1 {
    font-weight: 700;
    font-size: 32px;
    color: #22343D;
    padding: 25px 0;
}
.lump-top p {
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #22343D;

}

.lump-figure {
    width: 45px;
    height: 45px;
    background: #FF9900;
    border-radius: 13.8542px;
}
.lump-figure a p {
    padding: 12px 0;
    font-weight: 900;
    font-size: 22px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lump-figure p {
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #22343D;
}
.lump-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 340px;
    padding: 20px 0;
}

.lump-figure-card {
    width: 45px;
    height: 45px;
    background: #F03E3D;
    border-radius: 13.8542px;
}
.lump-figure-card a p {
    padding: 12px 0;
    font-weight: 900;
    font-size: 22px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lump-glav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 357px;
}

.lump-myrza-card {
    width: 45px;
    height: 45px;
    background: #4D8DFF;
    border-radius: 13.8542px;
}
.lump-myrza-card a p {
    padding: 12px 0;
    font-weight: 900;
    font-size: 22px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lump-myrza {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 423px;
    padding: 20px 0;
}
#foto {
    background: url("../img/Bg foto.png") no-repeat center/cover;
    min-height: 70vh;
}

.foto-title {
    padding-top: 60px;
}
.foto-title h1 {
    font-weight: 700;
    font-size: 32px;
    text-align: center;
    color: #22343D;
}
.foto-title p {
    font-weight: 500;
    font-size: 16px;
    line-height: 26px;
    text-align: center;
    color: #22343D;
    padding-top: 15px;
    padding-bottom: 80px;
}

.foto-figure {
    width: 274px;
    height:53px;
    background: #FFFFFF;
    box-shadow: 0 2px 15px rgba(23, 58, 86, 0.1);
    border-radius: 26.5px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.foto-left p  {
    font-weight: 500;
    font-size: 16px;
    text-align: center;
    color: #2F281E;
}
.foto-left {
    display: flex;
    align-items: center;
}
.foto-left img {
    margin-right: 25px;
}
.foto-figur-right {
    width: 274px;
    height:53px;
    background: #FFFFFF;
    box-shadow: 0 2px 15px rgba(23, 58, 86, 0.1);
    border-radius: 26.5px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.foto-right p {
    font-weight: 500;
    font-size: 16px;
    text-align: center;
    color: #2F281E;
}
.foto-right {
    display: flex;
    align-items: center;
}
.foto-right img {
    margin-left: 25px;
}
.foto {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    padding-bottom: 40px;
}
.foto-figur-bg {
    width: 19px;
    height: 19px;
    background: #FFFFFF;
    border-radius:  15px;
}
.foto-figur-bg {
    position: relative;
    bottom: -25px;
    left: -215px;
}
.foto-right-bg  {
    width: 19px;
    height: 19px;
    background: #FFFFFF;
    border-radius:  15px;
}
.foto-right-bg {
    position: relative;
    bottom: -26px;
    right: 37px;
}
.foto-btn-left {
    display: flex;
    align-items: center;
}

.foto-btn-right {
    display: flex;
    align-items: center;
}
.foto-king {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.foto-btn-left img {
    margin: 20px;
}
.foto-btn-right img {
    margin: 20px;
}

.foto-btn-aza button {
    width: 216px;
    height: 53px;
    background: #02897A;
    border-radius: 4px;
    transition: .4s;

}
.foto-btn-aza button a {
    font-weight: 700;
    font-size: 16px;
    color: #FFFFFF;
}
.foto-btn-aza {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
}
.foto-btn-aza button:hover {
    background: transparent;
    border: 2px solid #02897A;
    transform: scale(0.8);
}
#blocks {
    background: #FFFFFF;
    padding-top: 100px;
}
.block-title {
    padding: 0 110px;
}
.block-title h1 {
    font-weight: 700;
    font-size: 34px;
    color: #22343D;
    padding-bottom: 15px;
}
.block-title p {
    font-weight: 500;
    font-size: 16px;
    color: #22343D;
    padding-bottom: 30px;
}

.block-card-btn h3 {
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    color: #22343D;
    padding-top: 25px  ;
}
.block-card-btn h3 span {
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    color: #000;
}
.block-card-btn h1  {
    font-weight: 700;
    font-size: 24px;
    line-height: 40px;
    color: #22343D;
    padding-top: 15px;
}


.block-card {
   border: 2px solid rgba(164, 158, 158, 0.64);
    width: 345px;
    border-radius: 9px;
}
.blocks {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.block-card-btn {
    padding-left: 25px;
    padding-bottom: 25px;
}

.block-figure {
    width: 18px;
    height: 18px;
    background: rgba(164, 158, 158, 0.64);
    border-radius: 18px;
    margin: 0 10px;

}
.block-figure-btn {
    width: 18px;
    height: 18px;
    background: #02897A;
    border-radius: 18px;
}
.figure-glav {
    padding: 40px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.block-card-btn .block-h1 {
    font-weight: 700;
    font-size: 24px;
    line-height: 40px;
    color: #02897A;
}

#price {
    background: #FFFFFF;
    }
.price {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-bottom: 80px    ;
}
.price-title h1 {
    font-weight: 700;
    font-size: 34px;
    color: #22343D;
}
.price-title p{
    font-weight: 500;
    font-size: 16px;
        color: #22343D;
}

.price-card {
    width:  322.65px;
    height: 456px;
    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    border-radius: 8px;
}

.price-card h1 {
    font-weight: 700;
    font-size: 24px;
    color: #22343D;
    padding: 15px 0;
}

.price-card p {
    font-weight: 400;
    font-size: 16px;
    color: #22343D;
    padding-bottom: 10px;
}
.price-number h1  {
    font-weight: 700;
    font-size: 76px;
    text-align: center;
    letter-spacing: 0.2px;
    color: #02897A;
    padding-right: 8px;
}
.price-number h3 {
    font-weight: 700;
    font-size: 24px;
    line-height: 30px;
    letter-spacing: 0.1px;
    color: #02897A;
}
.price-number p {
    font-weight: 400;
    font-size: 16px;
    letter-spacing: 0.1px;
    color: #AFAFAF;
}
.price-card button {
    width: 139px;
    height: 44px;
    background: #02897A;
    border-radius: 8px;
    font-weight: 600;
    font-size: 18px;
    color: #FFFFFF;
    margin-top: 15px;
    transition: .4s;
}
.price-card button:hover {
    background: transparent;
    border: 2px solid #02897A;
    transform: scale(0.8);
}
.price-number {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.price-glav {
    display: flex;
    align-items: start;
    justify-content: space-evenly;
    flex-direction: column;
}
.price-card {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.price-title {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-top: 120px;
    padding-bottom: 60px;
}

.price-card-bg {
    width: 322.65px;
    height: 456px;
    background: #02897A;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    border-radius: 8px;
}

.price-card-bg h1 {
    font-weight: 700;
    font-size: 24px;
    color: #FFFFFF;
    padding: 15px 0;
}

.price-card-bg p {
    font-weight: 400;
    font-size: 16px;
    color: #FFFFFF;
    padding-bottom: 10px;
}
.price-number-bg h1  {
    font-weight: 700;
    font-size: 76px;
    text-align: center;
    letter-spacing: 0.2px;
    color: #FFFFFF;
    padding-right: 8px;
}
.price-number-bg h3 {
    font-weight: 700;
    font-size: 24px;
    line-height: 30px;
    letter-spacing: 0.1px;
    color: #FFFFFF;
}
.price-number-bg p {
    font-weight: 400;
    font-size: 16px;
    letter-spacing: 0.1px;
    color: #E0E0E0;
}
.price-card-bg button {
    width: 139px;
    height: 44px;
    background: #FFFFFF ;
    border-radius: 8px;
    font-weight: 600;
    font-size: 18px;
    color: #02897A;
    margin-top: 15px;
    transition: .4s;
}
.price-card-bg button:hover {
    background: transparent;
    border: 2px solid #02897A;
    transform: scale(0.8);
}
.price-number-bg {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.price-glav-bg {
    display: flex;
    align-items: start;
    justify-content: space-evenly;
    flex-direction: column;
}
.price-card-bg {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.price-title-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-top: 120px;
    padding-bottom: 60px;
}

#say {
    background: #FFFFFF;
    padding-bottom: 100px;
}

.say-title h1 {
    font-weight: 700;
    font-size: 34px;
    text-align: center;
    letter-spacing: 0.2px;
    color: #22343D;
}
.say-title p {
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.2px;
    color: #22343D;
    padding-bottom: 60px;
}


.say-glav {
    width: 327px;
    height: 236px;
    background: #FFFFFF;
    border: 1px solid #DEDEDE;
    border-radius: 5px;
}
.say-figure {
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    width: 18.34px;
    height: 18.35px;
    background: #F3CD03;
}

.say-card {
    display: flex;
    align-items: start;
    justify-content: start;
}
.say-p p {
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.2px;
    color: #737373;
    padding: 15px 0;
}
.say-bg h3 {
    font-weight: 600;
    font-size: 16px;
    letter-spacing: 0.2px;
    color: #02897A;
}
.say-bg h4 {
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.2px;
    color: #252B42;
}
.say-img {
    display: flex;
}
.say-glav {
    padding: 25px 25px;
}
.say-bg {
    padding-left: 15px;
}
.say {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
#get {
    background: #FFFFFF;
    padding: 80px 0;
}
.get {
    display: flex;
    align-items: center;
    justify-content: center;
}
.get-block {
    width: 968px;
    height: 345px;
    background: #02897A;
    border-radius: 32px;
}
.get-title h1 {
    font-weight: 600;
    font-size: 32px;
    line-height: 151.4%;
    color: #FFFFFF;
    padding-bottom: 40px;
}
.get-title button:hover {
    background: transparent;
    border: 2px  #FFFFFF ;
    transform: scale(0.8);
}
.get-title button {
    width: 150px;
    height: 50px;
    background: #FFFFFF;
    border-radius: 8px;
    font-weight: 600;
    font-size: 20px;
    color: #02897A;
    transition: .4s;
}
.get-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.get-title {
    padding: 0 40px;
}
#footer {
    background: #FFFFFF;
}
.footer-img h1 {
    font-weight: 700;
    font-size: 30px;
    color: #173A56;
}
.footer-img a {
    font-size: 28px;
    color:   #173A56;
    margin: 0 20px;
}
.footer h1  {
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
    color: #22343D;
}
.footer p {
    font-weight: 400;
    font-size: 16px;
    line-height: 35px;
    color: #22343D;
}
.footer-input input {
    width: 325px;
    height: 48px;
    background: #FFFFFF;
    border: 1px solid #BCD0E5;
    border-radius: 4px;
    outline:#BCD0E5 ;
    margin: 20px 0;
    color: #02897A ;
    font-size: 14px;
    padding:0 15px;
    text-transform: uppercase;
}
.footer-input button {
    width: 133px;
    height: 39px;
    background: #02897A;
    border-radius: 4px;
    font-weight: 700;
    font-size: 16px;
    text-align: center;
    color: #FFFFFF;
    transition: .4s;
    }
    .footer {
        padding: 100px 0;
        display: flex;
        align-items: center;
            justify-content: space-around;
    }
.footer-logo {
            display: flex;
            align-items: center;
            justify-content: space-around;
        }

    .footer-logo {
        padding-bottom: 40px;
    }
.footer-input {
    display: flex;
    align-items: start;
    flex-direction: column;
}
.footer-input button:hover {
    background: transparent;
    border: 2px solid #02897A;
    transform: scale(0.8);
}









