/***********************************
              NAVBAR
***********************************/
.navbar-nav {
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/***********************************
           HERO SECTION
***********************************/
.hero-bg-img::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(360deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.15) 50.5%, rgba(0, 0, 0, 0.35) 100%);
    pointer-events: none;
}

.hero-content .main-title {
    font-size: 6rem;
}

/***********************************
           SECTION 2
***********************************/
/*.search-input {*/
/*    min-width: 300px;*/
/*}*/

.search-input svg {
    right: 20px;
}

.img-gallery img {
    width: 20vw;
    max-width: 250px;
    aspect-ratio: 1/1;
    box-shadow: 0 1px 30px 0 #00000026;
    transition: transform 0.3s ease-in-out;
}
.img-gallery img:hover {
    transform: scale(1.05);
}

.img-gallery .img-1 {
    transform: rotate(10deg);
    z-index: 5;
    margin-left: -60px;
}

.img-gallery .img-2 {
    transform: rotate(10deg);
    z-index: 4;
    margin-left: -30px;
}

.img-gallery .img-3 {
    z-index: 3;
}

.img-gallery .img-4 {
    transform: rotate(-10deg);
    z-index: 2;
    margin-right: -30px;
}

.img-gallery .img-5 {
    transform: rotate(-5deg);
    z-index: 1;
    margin-right: -60px;
}


/***********************************
           SECTION 3
***********************************/
.btn-filter:hover {
    background-color: white;
    border: 1px solid #E9E9E9;
}

.btn-filter:focus {
    background-color: white;
    border: 1px solid #E9E9E9;
}

.form-select {
    background: transparent;
    outline: none;
    appearance: none;
    padding: 5px;
    cursor: pointer;
}

.form-select:focus {
    outline: none;
    box-shadow: none;
}

.form-select-arrow {
    position: absolute;
    left: 15px;
    pointer-events: none;
}

.btn-filter-2 {
    background-color: white;
    border: 1px solid #E9E9E9;
}

.btn-filter-2:hover {
    background-color: #E9E9E9;
    border: 1px solid #E9E9E9;
}

.card-img-container {
    height: 300px;
}

.card-logo-container {
    width: 50px;
    height: 50px;
}

.card-grid-layout {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.5rem;
}

.btn-more {
    background-color: #F5F5F5;
    border: 1px solid #CACACA;
    margin-top: 6rem;
}

.btn-more:hover {
    background-color: #CACACA;
    border: 1px solid #CACACA;
}


/***********************************
           SECTION 4
***********************************/
.wave-container {
    gap: 40px;
    height: calc(150px + 80px);
}

.wave-container img {
    width: 80px;
    height: 80px;
    opacity: 75%;
}

/* top wave */
.wave-container.top img:nth-child(1) {
    transform: translateY(50px);
}

.wave-container.top img:nth-child(2) {
    transform: translateY(0);
}

.wave-container.top img:nth-child(3) {
    transform: translateY(50px);
}

.wave-container.top img:nth-child(4) {
    transform: translateY(100px);
}

.wave-container.top img:nth-child(5) {
    transform: translateY(150px);
}

.wave-container.top img:nth-child(6) {
    transform: translateY(100px);
}

.wave-container.top img:nth-child(7) {
    transform: translateY(50px);
}

.wave-container.top img:nth-child(8) {
    transform: translateY(0);
}

.wave-container.top img:nth-child(9) {
    transform: translateY(50px);
}

.wave-container.top img:nth-child(10) {
    transform: translateY(100px);
}

.wave-container.top img:nth-child(11) {
    transform: translateY(150px);
}

.wave-container.top img:nth-child(12) {
    transform: translateY(100px);
}

.wave-container.top img:nth-child(13) {
    transform: translateY(50px);
}

.wave-container.top img:nth-child(14) {
    transform: translateY(0);
}

.wave-container.top img:nth-child(15) {
    transform: translateY(50px);
}

/* bottom wave */
.wave-container.bottom img:nth-child(1) {
    transform: translateY(100px);
}

.wave-container.bottom img:nth-child(2) {
    transform: translateY(150px);
}

.wave-container.bottom img:nth-child(3) {
    transform: translateY(100px);
}

.wave-container.bottom img:nth-child(4) {
    transform: translateY(50px);
}

.wave-container.bottom img:nth-child(5) {
    transform: translateY(0);
}

.wave-container.bottom img:nth-child(6) {
    transform: translateY(50px);
}

.wave-container.bottom img:nth-child(7) {
    transform: translateY(100px);
}

.wave-container.bottom img:nth-child(8) {
    transform: translateY(150px);
}

.wave-container.bottom img:nth-child(9) {
    transform: translateY(100px);
}

.wave-container.bottom img:nth-child(10) {
    transform: translateY(50px);
}

.wave-container.bottom img:nth-child(11) {
    transform: translateY(0);
}

.wave-container.bottom img:nth-child(12) {
    transform: translateY(50px);
}

.wave-container.bottom img:nth-child(13) {
    transform: translateY(100px);
}

.wave-container.bottom img:nth-child(14) {
    transform: translateY(150px);
}

.wave-container.bottom img:nth-child(15) {
    transform: translateY(100px);
}