html,
        body {
            margin: 0;
            padding: 0;
        }
        
        body {
            font-family: "Inter", sans-serif;
            width: 1440px;
            margin: 0 auto;
            /* центрируем */
      background-color: bisque;
            /* или background-image */
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
        }

        img{
            display: block;
        }
h2 {
    font-size: 48px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: -2%;
    color: #fbfbfb;
    margin: 0;
}
.h3 {
    margin:  0;
}
p {
    margin: 0;
  
}
    ul {
            list-style: none;
            padding-left: 0;
            margin: 0;
        }

.container {
    width: 1340px;
    margin: 0 auto;
    
}
.page-header {
   width: 1440px;
  
   background-color: #0E1823;
}

    .top-nav {
        display: flex;
        padding: 4px 30px 4px 30px;
            justify-content: space-between;
            align-items: center;
            background-color: blueviolet;
    }

.header-logo-link {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 3%;
    color: #1B414B;
    display: block;
    align-items: center;
padding: auto;
}



.header-nav-list {
    display: flex;
   
    
}

.header-nav-link {
    line-height: 1.3;
        text-transform: uppercase;
        color: #fbfbfb;
    font-weight: 400;
        font-size: 9px;
    display: block;
    padding: 15px 24px 15px 24px;
    background-color: #1B414B;
    border-radius: 8px;

}
.header-social-list {
    display: flex;
    
}


.link {
    display: block;
}




.section-hero {
    background-image: linear-gradient( rgba(17, 19, 31, 0%), rgba(17, 19, 31, 100%)), url("../images/hero-img.jpg");  
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center; 
}
.section-hero .container {
    padding-top: 235px;
    padding-bottom: 180px;
    

}
.hero-title {
    width: 1000px;
    margin: 0 auto 24px auto;
    font-size: 80px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: -2%;
    color: #fbfbfb;

}

.hero-text {
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: 0;
    color: #fbfbfb;
    font-weight: 300;
    width: 597px;
    margin: 0 auto 48px auto;


}

.hero-btn {
   display: block;
    padding: 16px 40px 16px 40px;
    color: #fbfbfb;
    background-color: #1B414B;
    border-radius: 15px;
    text-align: center;
    margin: 0 581px; 
    text-decoration: none;
}
.hero-btn:hover {
            background-color: #fbfbfb;
            color: #1B414B;
}
.hero-btn:active {
    background-color: #0f5059;
    color: #fd0241ee;
}

.section-about {
    background-color: #0E1823;
}

    

.about-text-content {
    display: flex;
    background-color: #fbfbfb;
    width: 1340px;
    
    padding: 50px 50px 100px 50px;
    border-radius: 24px 24px;
    
}
.about-title {
    color: #1B414B;
    width: 537px;
    margin-right: 299px;

}
.about-text {
    display: flex;
    width: 404px;
    flex-direction: column;
}
.about-text-one {
    font-size: 23px;
    font-weight: 400;
    width: 404px;
    color: #1B414B;
    line-height: 1;
    letter-spacing: -2%;
}

.about-text-two {
    font-size: 13px;
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: -2%;
    color: #040306;
}

.about-img {
    border-top-left-radius: 24px;
    border-top-right-radius: 24px;
    border-bottom-left-radius: 24px;
    object-fit: contain;
    width: 1340px;
    margin: 0 50px;
}

.section-yachts {
     background-color: #0E1823;
    padding: 150px 0;
    }

.title-yachts-select {
    margin: 0 auto 75px auto;
    width: 714px;

}

.yachts-list-selection { 
    display: flex;
margin: 0 50px 50px 50px;

}

.yacht-card-arrow {}

.yacht-card-benetti {}

.yacht-card-belleanna {

}

.section-yacht-btn {
    display: block;
    padding: 16px 40px 16px 40px;
    background-color: #0E1823;
    border-radius: 15px;
    margin: 0 581px;
    text-decoration: none;
    color: #fbfbfb;
    border: 1px solid #fbfbfb;
}


.section-yacht-btn:hover {
    background-color: #fbfbfb;
    color: #1B414B;
}

.section-yacht-btn:active {
    background-color: #0f5059;
    color: #fd0241ee;
}

.section-benefits {
    background-color:#0E1823;
}
.section-benefits .container {
    display: flex;
    padding-bottom: 150px;}

.section-benefits-list {
    display: flex;
    width: 768px;
   
    margin: 0 32px 0 0;
    flex-wrap: wrap;
    color: #fbfbfb;
    padding: 90px 50px 90px 50px;
    row-gap: 44px;
    column-gap: 32px;
    background-color: #1B414B;
    border-radius: 24px;
}




.benefits-item {
    display: flex;
    width: 318px;
    height: 100px;
    flex-direction: column;
}

.benefits-item-title {
    font-size: 32px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: -5%;
    border-bottom: 2px solid #fbfbfb;
    padding-bottom: 18px;
    margin-bottom: 18px;
    margin-top: 0;

}

.benefits-item-text {
    font-weight: 400;
    font-size: 13px;
    line-height: 1.15;
    letter-spacing: -2%;
    

}
.section-benefits-img {
    border-radius: 24px;
}

.section-rent {}

.section-rent-img {}

.section-rent-title {}

.section-rent-input {}

.rent-btn {}

.section-reviews {}

.section-reviews-title {}

.reviews-text {}

.section-footer {}


.footer-logo-link {}

.footer-nav-menu {}

.footer-link-about {}

.footer-link-yachts {}

.footer-link-reviews {}

.footer-social-menu {}

.footer-link-inst {}

.footer-link-youtube {}

.footer-link-facebook {}

.section-footer-title {}

.section-footer-text {}