.outlet-banner {

    height: 85vh;

    background: url('../images/outlets/photo-1556742393-d75f468bfcb0.jpg') center center;

    background-size: cover;

    position: relative;

    display: flex;

    align-items: center;

}

.outlet-banner .overlay {

    position: absolute;

    width: 100%;

    height: 100%;

    background: rgba(31, 58, 46, .72);

}

.banner-content {

    position: relative;

    color: #fff;

    max-width: 700px;

    z-index: 2;

}

.banner-content span {

    color: #C5A678;

    letter-spacing: 3px;

    text-transform: uppercase;

}

.banner-content h1 {

    font-size: 72px;

    margin: 20px 0;

    font-family: 'Playfair Display', serif;

}

.banner-content p {

    font-size: 20px;

    line-height: 1.9;

}

.outlet-intro {

    padding: 120px 0;

    background: #FFFDF9;

}

.sub-title {

    color: #C5A678;

    letter-spacing: 3px;

    text-transform: uppercase;

}

.outlet-intro h2 {

    font-size: 52px;

    margin: 20px 0;

    color: #3E2D20;

}

.outlet-intro p {

    color: #6E6256;

    line-height: 1.9;

    margin-bottom: 20px;

}

.all-outlets {

    padding: 100px 0;

    background: #F8F5EF;

}

.section-title {

    text-align: center;

    margin-bottom: 80px;

}

.section-title span {

    color: #C5A678;

    letter-spacing: 3px;

    text-transform: uppercase;

}

.section-title h2 {

    font-size: 52px;

    margin: 15px 0;

    color: #3E2D20;

}




.outlet-row {

    display: flex;

    align-items: center;

    gap: 70px;

    margin-bottom: 120px;
    padding-left: 30px;
    padding-right: 30px;

}

.outlet-row.reverse {

    flex-direction: row-reverse;

}

.outlet-image {

    flex: 1;

    overflow: hidden;

    border-radius: 25px;

}

.outlet-image img {

    width: 100%;

    height: 520px;

    object-fit: cover;

    transition: .6s;

    display: block;

}

.outlet-image:hover img {

    transform: scale(1.08);

}

.outlet-content {

    flex: 1;

}

.location-tag {

    display: inline-block;

    margin-bottom: 15px;

    font-size: 14px;

    letter-spacing: 3px;

    text-transform: uppercase;

    color: #C5A678;

    font-weight: 600;

}

.outlet-content h2 {

    font-size: 46px;

    margin-bottom: 25px;

    color: #3E2D20;

    font-family: 'Playfair Display', serif;

}

.outlet-content p {

    font-size: 17px;

    line-height: 1.9;

    color: #6E6256;

    margin-bottom: 35px;

}

.outlet-content ul {

    margin: 0;

    padding: 0;

    list-style: none;

}

.outlet-content ul li {

    margin-bottom: 18px;

    font-size: 17px;

    color: #3E2D20;

}

.outlet-content ul li i {

    width: 30px;

    color: #C5A678;

}

.direction-btn {

    display: inline-block;

    margin-top: 40px;

    padding: 16px 40px;

    background: #1F3A2E;

    color: #fff;

    text-decoration: none;

    border-radius: 50px;

    transition: .4s;

    font-weight: 500;

}

.direction-btn:hover {

    background: #C5A678;

    color: #fff;

}

.outlet-row:not(:last-child) {

    padding-bottom: 90px;

    border-bottom: 1px solid #E8DDCF;

}



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

.our-promise {

    padding: 120px 0;

    background: #FFFDF9;

}

.promise-wrapper {

    display: flex;

    align-items: center;

    gap: 80px;

}

.promise-content {

    flex: 1;

}

.promise-image {

    flex: 1;

}

.promise-image img {

    width: 100%;

    border-radius: 25px;

    display: block;

}

.sub-heading {

    display: inline-block;

    margin-bottom: 15px;

    letter-spacing: 3px;

    text-transform: uppercase;

    color: #C5A678;

    font-size: 14px;

    font-weight: 600;

}

.promise-content h2 {

    font-size: 52px;

    margin-bottom: 25px;

    color: #3E2D20;

    font-family: 'Playfair Display', serif;

}

.promise-content p {

    font-size: 17px;

    line-height: 1.9;

    margin-bottom: 25px;

    color: #6E6256;

}

.theme-btn {

    display: inline-block;

    padding: 16px 38px;

    background: #1F3A2E;

    color: #fff;

    text-decoration: none;

    border-radius: 50px;

    transition: .4s;

    margin-top: 20px;

}

.theme-btn:hover {

    background: #C5A678;

}

.visit-teaberg {

    padding: 170px 0;

    background: url('../images/outlets/photo-1561122081-9ddec5940bb1.jpg') center center;

    background-size: cover;

    position: relative;

}

.visit-teaberg .overlay {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background: rgba(31, 58, 46, .78);

}

.visit-content {

    position: relative;

    z-index: 2;

    text-align: center;

    color: #fff;

    max-width: 800px;

    margin: auto;

}

.visit-content span {

    letter-spacing: 4px;

    text-transform: uppercase;

    color: #C5A678;

}

.visit-content h2 {

    font-size: 62px;

    margin: 20px 0;

    font-family: 'Playfair Display', serif;

}

.visit-content p {

    font-size: 20px;

    line-height: 1.9;

    margin-bottom: 40px;

}

.visit-buttons {

    display: flex;

    justify-content: center;

    gap: 20px;

    flex-wrap: wrap;

}

.visit-buttons a {

    padding: 16px 40px;

    border-radius: 50px;

    text-decoration: none;

    background: #C5A678;

    color: #fff;

    transition: .4s;

}

.visit-buttons a:last-child {

    background: #fff;

    color: #1F3A2E;

}

.visit-buttons a:hover {

    transform: translateY(-3px);

}

.closing-section {

    padding: 100px 0;

    background: #F8F5EF;

}

.closing-box {

    max-width: 900px;

    margin: auto;

    text-align: center;

}

.closing-box h2 {

    font-size: 48px;

    margin-bottom: 25px;

    color: #3E2D20;

    font-family: 'Playfair Display', serif;

}

.closing-box p {

    font-size: 18px;

    line-height: 2;

    color: #6E6256;

}


/*Responsive */

/*=========================================
Responsive Design
=========================================*/

@media (max-width:1200px) {

    .banner-content h1 {
        font-size: 60px;
    }

    .outlet-content h2 {
        font-size: 40px;
    }

    .promise-content h2 {
        font-size: 42px;
    }

    .visit-content h2 {
        font-size: 52px;
    }

}

@media (max-width:992px) {

    .outlet-row,
    .outlet-row.reverse,
    .promise-wrapper {

        flex-direction: column;
        

    }

    .outlet-image,
    .outlet-content,
    .promise-image,
    .promise-content {

        width: 100%;

    }

    .outlet-row {

        gap: 40px;
        margin-bottom: 80px;

    }

    .outlet-image img {

        height: 420px;

    }

    .banner-content {

        text-align: center;
        margin: auto;

    }

    .banner-content h1 {

        font-size: 52px;

    }

    .banner-content p {

        font-size: 18px;

    }

    .section-title h2 {

        font-size: 42px;

    }

    .visit-content h2 {

        font-size: 46px;

    }

}

@media (max-width:768px) {

    .outlet-banner {

        height: 70vh;

    }

    .banner-content h1 {

        font-size: 42px;

    }

    .banner-content p {

        font-size: 17px;

    }

    .section-title {

        margin-bottom: 50px;

    }

    .section-title h2 {

        font-size: 34px;

    }

    .outlet-content h2 {

        font-size: 34px;

    }

    .promise-content h2 {

        font-size: 34px;

    }

    .visit-content h2 {

        font-size: 38px;

    }

    .closing-box h2 {

        font-size: 34px;

    }

    .visit-buttons {

        flex-direction: column;

    }

    .visit-buttons a {

        width: 100%;

        text-align: center;

    }

    .direction-btn {

        width: 100%;

        text-align: center;

    }

}

@media (max-width:576px) {

    .outlet-banner {

        height: 60vh;

    }

    .banner-content h1 {

        font-size: 34px;

    }

    .banner-content p {

        font-size: 16px;

    }

    .outlet-image img {

        height: 280px;

    }

    .outlet-content h2 {

        font-size: 28px;

    }

    .promise-content h2 {

        font-size: 30px;

    }

    .visit-content h2 {

        font-size: 30px;

    }

    .closing-box h2 {

        font-size: 30px;

    }

    .theme-btn {

        width: 100%;

        text-align: center;

    }

}


/*scroll animation*/

.fade-up {

    opacity: 0;

    transform: translateY(60px);

    transition: all .8s ease;

}

.fade-up.show {

    opacity: 1;

    transform: translateY(0);

}


/*Premium hover effect*/

.outlet-image {

    overflow: hidden;

    border-radius: 25px;

}

.outlet-image img {

    transition: .8s;

}

.outlet-row:hover img {

    transform: scale(1.08);

}

.direction-btn {

    position: relative;

    overflow: hidden;

}

.direction-btn::before {

    content: "";

    position: absolute;

    left: -100%;

    top: 0;

    width: 100%;

    height: 100%;

    background: rgba(255, 255, 255, .2);

    transition: .5s;

}

.direction-btn:hover::before {

    left: 100%;

}

/*smooth scrolling*/

html {

    scroll-behavior: smooth;

}


/*page spacing*/

section {

    position: relative;

    overflow: hidden;

}

.container {

    max-width: 1320px;

    margin: auto;

    padding: 0 15px;

}



body {

    font-family: 'Poppins', sans-serif;

}

h1,
h2,
h3,
h4 {

    font-family: 'Playfair Display', serif;

}