/*------------------------------------------------------------------
Project:Bermiz
Author: The_Krishna       
Last change: 12 June, 2023  
Primary use: Restarant Template 
-------------------------------------------------------------------*/

/*----------------Table of contents Start---------------------------
1.Default CSS
2.Homepage1 CSS
3.Homepage2 CSS
4.Homepage3 CSS
5.Header CSS
6.Marquee CSS
7.Menupage-1 CSS
8.Menupage-2 CSS
9.Menupage-3 CSS
10.Menupage-4 CSS
11.Menupage-5 CSS
12.Datepiker CSS
13.Menupage-6 CSS
14.Menupage-8 CSS
15.404 Error CSS
16.Blog1 CSS 
17.Blog2 CSS 
18.Blog4 CSS
19.Blog5 CSS
20.Blog6 CSS
21.Blog7 CSS
22.Blog8 CSS
23.Blog10 CSS
24.Blog12 CSS
25.Blog13 CSS
26.Coming Soon CSS
27.Contact Us CSS
28.ChefsPage1 CSS
29.ChefsPage2 CSS
30.ChefsPage3 CSS
31.History CSS
32.Single Chefs Details CSS
33.Preloader CSS
34.Scroll Bottom to Top CSS
35.Single Blogpage1 CSS
36.Single Shop CSS 
37.SearchPopup CSS
38. About Us CSS
39.Reservation1 CSS
40.Mobile Menu CSS
41.Cart CSS 
42.Checkout CSS
43.Animation CSS

---------Table of contents End-----------------------------------*/

/*------------------------ [Color codes] ------------------------                    
Background:     #F5E6D3
Content:        #FFFFFF,#111A1E, #111A1E   
-------------------------------------------------------------------*/

/************************ 1.Default CSS ***************************/
body {
   margin: 0;
   padding: 0;
   background: #F5E6D3;
   position: relative;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
    padding: 0;
}

html{
    scroll-behavior: smooth;
}
a{
    text-decoration: none;
}
.mt-100{
    padding-top: 100px;
}
.mt-40{
    margin-top: 40px;
}
.mt-60{
    margin-top: 60px;
}
.ptb-100{
    padding:100px 0;
}
.container {
    padding-left: 0;
    padding-right: 0;
}

/************************ 2.Homepage1 CSS ***************************/
/* ====================================================== */
/* 0. COLOR PALETTE DEFINITION                            */
/* ====================================================== */
:root {
    --dark-initial-bg: #111A1E;
    --light-hover-bg: #fffaf0;     /* Light color for the hover background */
    --dark-hover-text: #333333;    /* Dark color for the hover text */
    --transition-duration: 0.35s;  /* Smooth transition speed */
}

/* ====================================================== */
/* 1. BASE STYLES & INITIAL CURVED SHAPE                  */
/* ====================================================== */
.header-cart-sec-first a {
    width: 120px; /* Slightly wider button for the effect */
    height: 40px;
    background: var(--dark-initial-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px; /* Initial curved shape */
    color: #000000;
    font-weight: 600;
    text-decoration: none;
    font-size: 15px;
    position: relative; 
    z-index: 2; /* Text must stay on top of the pseudo-element */
    overflow: hidden; /* Crucial for clipping the pseudo-element */
    
    /* Animation: Only transition the transform, color, and shadow for smoothness */
    transition: 
        transform var(--transition-duration) ease-out,
        box-shadow var(--transition-duration) ease-out,
        color var(--transition-duration) ease-out; /* Transition text color */
}

/* ====================================================== */
/* 2. UNIQUE HOVER EFFECT: SHAPE & COLOR SWAP             */
/* ====================================================== */

/* Pseudo-element to handle the new shape and background color */
.header-cart-sec-first a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--light-hover-bg); /* The new light background */
    border-radius: 20px; /* START with the button's initial curved shape */
    z-index: -1; /* Place behind the text */
    
    /* Animation: Transition the border-radius and the transform for a fluid look */
    transition: 
        border-radius var(--transition-duration) ease-out, 
        transform var(--transition-duration) ease-out;
}

/* --- HOVER EFFECT --- */
.header-cart-sec-first a:hover {
    /* 1. Lift the button */
    transform: translateY(-3px); 
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);
    
    /* 2. KEY: Change the text color to dark */
    color: var(--dark-hover-text); 
}

/* --- KEY ANIMATION: SHAPE TRANSITION --- */
.header-cart-sec-first a:hover::before {
    /* 1. Transform the shape to a rectangle */
    border-radius: 0px; 
    
    /* 2. Add a slight scale/shift to the pseudo-element for a fluid background filling effect */
    transform: scale(1.05); 
}

/* --- CLICK (ACTIVE) EFFECT --- */
.header-cart-sec-first a:active {
    transform: scale(0.95);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    transition-duration: 0.1s; 
}


/* ====================================================== */
/* 3. MOBILE RESPONSIVENESS                               */
/* ====================================================== */
@media (max-width: 768px) {
    .header-cart-sec-first a {
        width: auto;
        height: 30px;
        padding: 0 10px;
        font-size: 12px;
        border-radius: 15px; /* Maintain curved shape on mobile */
    }
    
    /* Disable the complex shape-shifting hover on touch devices */
    .header-cart-sec-first a:hover {
        transform: none;
        box-shadow: none;
        color: #fff; /* Keep text white */
        background: var(--dark-initial-bg);
    }
    .header-cart-sec-first a:hover::before {
        border-radius: 15px; /* Revert shape */
        transform: scale(1);
        background: var(--dark-initial-bg);
    }
}


.visit-restaurant-sec1 {
    padding-bottom: 100px;
}
.index-hero-tb{
    padding-top: 100px;
    padding-bottom: 120px;
}
.index-gallery-top{
    padding-bottom: 80px;
}
.home2-testimonials-sec-full{
    position: relative;
    padding: 100px 0;
}
#footer-section {
    background: #931A2A;
    border-top: 1px solid rgb(153 169 173 / 10%);
}
#header-homepage1 {
    background: #931A2A;
}
.header-cart-sec-first{
    position: relative;
}
.image {
  overflow: hidden;
}
.image img {
  display: block;
  max-width: 100%;
  height: auto;
}
/* Default: hide logo (DESKTOP) */
.header-logo a {
    display: inline-block;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
}

/* Show logo when scrolling (DESKTOP) */
.header-logo.show-logo a {
    opacity: 1;
    visibility: visible;
}

/* MOBILE VIEW → logo always visible */
@media (max-width: 768px) {
    .header-logo a {
        opacity: 1 !important;
        visibility: visible !important;
    }
}

.dicover-menu-btn:hover,
.explore-btn:hover,
.chef-reservation-btn:hover,
.view-all-homepage1:hover,

.direction-btn:hover,

.error-home-btn:hover,
.add-cart-bnt:hover,
.dicover-menu-btn-home2:hover,
.home2-form-btn a:hover,
.home3-discover-btn:hover,
.home3-form-btn a:hover,
.blogpage2-book-btn:hover,
.load-more-blog-btn:hover {
    border: 1px solid #111A1E;
    background: transparent;
}
.menupage-1-book-now-btn:hover {
    border: 1px solid #4fa7cc;
    background: #FDDD9E;
}
a.add-cart-bnt:hover{
    color: #111A1E;
}
.book-btn:hover{
  border: 1px solid #111A1E !important;
  background: transparent !important;
  color: #111A1E;
}
.book-btn:focus-visible{
    outline-width: 0 !important;
}
.dicover-menu-btn:hover.dicover-menu-btn a
,.explore-btn:hover.explore-btn a,
.chef-reservation-btn:hover.chef-reservation-btn a,
.view-all-homepage1:hover.view-all-homepage1 a,
.menupage-1-book-now-btn:hover.menupage-1-book-now-btn a,
.direction-btn:hover.direction-btn a ,
 a,
.error-home-btn:hover.error-home-btn a,
.home3-discover-btn:hover.home3-discover-btn a,
.blogpage2-book-btn:hover.blogpage2-book-btn a,
.load-more-blog-btn:hover.load-more-blog-btn a
{
    color: #111A1E;
}
.dicover-menu-btn-home2:hover.dicover-menu-btn-home2 a,
.home2-form-btn a:hover,
.home3-form-btn a:hover{
    color: white;
}
.explore-btn.explore-btn2{
    margin-left: auto;
    margin-right: auto;
}
.fast-ordering-left,
.fast-ordering-right{
    width: 50%;
}
.header-boder {
    height: 1px;
    background: rgb(153 169 173 / 10%);
}
.cart-no {
    width: 20px;
    height: 20px;
    background: white;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    color: #F5E6D3;
    font-family: Lexend;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 15px;
}
.header-full-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px 40px;
}
.homepage2-header2full {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.menu-tab-img {
    display: flex;
}
.nav-link.menu-link {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
}
.nav-link.menu-link {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
    margin-left: 40px;
}
.nav-link.menu-link:first-child{
    margin-left: 0px;
}
.ticker-section-home3 {
    margin-top: 0 !important;
}
.hero-title {
    font-family: 'Elsie';
    font-style: normal;
    font-weight: 400;
    font-size: 128px;
    line-height: 147px;
    color: rgb(255, 255, 255);
}
.dicover-menu-btn  {
    width: 195px;
    height: 64px;
    background: #111A1E;
    margin-top: 60px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 200px;
}
.hero-bottom-wrapper {
    display: flex;
    position: relative;
}
.dicover-menu-btn a,
.explore-btn a,
.chef-reservation-btn a,
.view-all-homepage1 a,
.direction-btn a,
.home2-explore-btn a{
 color: #F5E6D3;
 font-family: 'Lexend';
 font-weight: 500;
 font-size: 18px;
 line-height: 24px;
}
.hero-para {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color:  #111A1E;
}
.hero-line {
    width: 170px;
    height: 2px;
    background: #111A1E;
}
.home3-about-no a:hover, .home3-email-txt a:hover{
    color: #111A1E;
}
#header{
    position: absolute;
    width: 100%;
    z-index:99;
    background: linear-gradient(180deg, rgba(11, 19, 21, 0.80) 0%, rgba(11, 19, 21, 0.20) 100%);
    backdrop-filter: blur(5px);
}
.restaurant-sec-wrapper {
    display: flex;
    column-gap: 30px;
    width: 100%;
}
.restaurant-first-sec,
.restaurant-second-sec{
    width: 50%;
}
.restaurant-first-sec-wrap{
    position: relative;
}
.rest-txt1,
.chefs-txt2,
.home-menu-txt1,
.fast-order-txt1,
.gallery-txt1,
.tesimonial-txt1,
.visit-txt1,
.homemenu-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    color: #9f4343;
}
.homemenu-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    color: #755151;
    padding-top: 30px;
}
.rest-txt2,
.chefs-txt3,
.home-menu-txt2,
.fast-order-txt2,
.tesimonial-txt2,
.visit-txt2,
.homemenu-txt2 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    color: #931A2A;
    margin-top: 20px;
}
#about-us-our-restaurant-section{
    overflow: hidden;
}
.rest-para,
.chefs-txt4,
.home-menu-txt3,
.fast-order-txt3,
.visit-txt3,
.homemenu-txt3 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color:  #111A1E;
    margin-top: 40px;
}
.rest-txt3 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 30px;
    line-height: 35px;
    color: #111A1E;
}
.rest-txt4 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color:  #111A1E;
    margin-top: 15px;
}
.restaurant-second-bottom-wrap,
.home2-restaurant-second-bottom-wrap {
    display: flex;
    align-items: center;
    column-gap: 30px;
}
.restaurant-second-bottom{
    margin-top: 60px;
}
.explore-btn,
.home2-explore-btn {
    width: 159px;
    height: 64px;
    background: #111A1E;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-top: 60px;
}
.ticker-txt {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    color: #F5E6D3;
}
#ticker-section {
    background: #931A2A;
}
.chefs-bottom-sec-wrap {
    display: flex;
    column-gap: 30px;
}
.chefs-bottom-left,
.chefs-bottom-rigth{
    width: 50%;
}
.chefs-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    text-align: center;
    color: #000000;
}
.booking {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color: #000000;
    margin-top: 20px;
}
.chef-number a {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 36px;
    line-height: 45px;
    color: #111A1E;
    transition: 0.3s;
}
.chef-number a:hover {
    text-decoration: underline;
    transition: 0.3s;
}
.chef-reservation-btn {
    background: #111A1E;
    width: 242px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-top: 60px;
}
.chefs-bottom-sec{
    margin-top: 80px;
}
.chef-number{
    margin-top: 10px;
}
.chefs-img-sec {
    display: flex;
    position: relative;
}
.chefs-img-sec-2 {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: -70px;
}
.counter-txt,
.counter-txt-K {
    font-family: 'Elsie';
    font-style: normal;
    font-weight: 900;
    font-size: 80px;
    line-height: 80px;
    text-align: center;
    color: #111A1E;
    margin-top: 40px;
    display: inline-block;
}
.conter-name {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 20px;
}
.counter-wrap {
    background:#931A2A;
    border: 2px solid #FFFFFF;
    padding: 40px 34px;
    box-sizing: border-box;
    width: 100%;
    height: 345px;
    transform: translateY(0px) scale();
    transition: all 0.5s ease;
}
.counter-wrap:hover {
   -webkit-transform: translateY(-16px) scale(1.02);
   -ms-transform: translateY(-16px) scale(1.02);
   transform: translateY(-16px) scale(1.02);
   -webkit-transition: all 0.5s ease;
   -o-transition: all 0.5s ease;
   transition: all 0.5s ease;
}
.counter-img{
    text-align: center;
}
#counter-section{
    background-image: url(../images/Homepage1/counter-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    max-width: 100%;  
    position: relative;
    padding: 100px 0;
}
.counter-full-section {
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 30px;
}
.home-menu-txt1,
.home-menu-txt2,
.home-menu-txt3{
    text-align: center;
}
.round-shape .white-bg {
    background: white;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    padding: 20px;
}
.round-shape {
    position: relative;
    height: 200px;
    width: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.txt-img {
    position: absolute;
    width: 200px;
    height: 200px;
    animation: rotate 15s linear infinite;
}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:focus-visible,
.nav-tabs .nav-link:hover{
    border: none !important;
    background: transparent;
}
.homemenu-txt {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    color:  #111A1E;
    margin-top: 20px;
    display: inline-block;
}
.tab-menu-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 30px;
    line-height: 35px;
    color:#931A2A;
}
.tab-menu-txt2 {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color:  #111A1E;
    margin-top: 20px;
}
.nav-link.menu-tab-homepage {
    padding: 0;
    padding: 0 30px;
}
.nav-link.menu-tab-homepage.active .menu-tab-img svg path{
    fill: #111A1E !important;
}
.nav-link.menu-tab-homepage.active .homemenu-txt{
 color: #111A1E;
}
.nav-link.menu-tab-homepage:hover .menu-tab-img svg path{
    fill: #111A1E !important;
}
.nav-link.menu-tab-homepage:hover .homemenu-txt{
 color: #111A1E;
}
.tab-menu-txt3 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 36px;
    line-height: 41px;
    color: #111A1E;
    margin-top: 20px;
}
.homepage1-menu-content {
    display: flex;
    align-items: center;
    column-gap: 20px;
}
.homepage1-menu-left {
    flex-shrink: 0;
    width: 150px;
    height: 150px;
    overflow: hidden;
    border-radius: 8px;
}
.homepage1-menu-left img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.homepage1-menu-right {
    flex: 1;
    min-width: 0;
}
.tab-menu-txt1 {
    margin: 0;
    font-size: 18px;
}
.tab-menu-txt2 {
    margin: 5px 0;
    font-size: 13px;
    color: #666;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.tab-menu-txt3 {
    margin: 10px 0 0 0;
    font-size: 20px;
}
.tab-description {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
}
.custon-nav-homepage1-menu {
    display: flex;
    align-items: center;
    justify-content: center;
}
.tab-content{
    margin-top: 60px;
}
.view-all-homepage1 {
    width: 135px;
    height: 64px;
    background: #111A1E;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 60px;
    margin-left: auto;
    margin-right: auto;
}
.nav-pills .nav-link.active{
    background: transparent;
}
.pr-10
{
    padding-right: 10px;
}
.pf-10{
    padding-left: 10px;
}
.fast-otder-media-sec{
    display: flex;
    column-gap: 40px;
    margin-top: 60px;
}
.fast-ordering-sec-full{
    display: flex;
    column-gap: 30px;
    align-items: center;
}
.gallery-txt {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    text-align: center;
    color: #931A2A;
    margin-top: 20px;
}
.reservation-1-bottom1{
    padding-bottom: 80px;
}
.reservation-1-bottom{
    padding-bottom: 100px;
}
.gallery-txt1,
.homemenu-txt1,
.homemenu-txt2,
.homemenu-txt3{
    text-align: center;
}
.homemenu-txt3{
    width: 770px;
    margin: auto;
    margin-top: 40px;
}
.tesimonila-deatils {
    display: flex;
    column-gap: 30px;
}
.tesimonila-left,
.tesimonila-right{
    width: 50%;
}
.tesimonial-txt1,
.tesimonial-txt2{
    text-align: center;
}
.tesimonial-txt4{
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #111A1E;
    margin-top: 40px;
}
.tesimonial-txt3 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 30px;
    line-height: 40px;
    text-align: center;
    color: #000000;
    margin-top: 60px;
}
.tesimonial-slider-section .slick-track{
    display: flex !important;
}
.tesimonial-slider-section .slick-dots button{
    display: block;
    width: 10px;
    height: 10px;
    padding: 0;
    border: none;
    border-radius: 100%;
    text-indent: -9999px;
    background:  #111A1E;
    margin-left: 15px;
}
.tesimonial-slider-section .slick-dots {
    display: flex;
    justify-content: center;
    margin: 0;
    margin-top: 60px;
    list-style-type: none;
    column-gap: 10px;
    padding: 0;
}
.tesimonial-slider-section .slick-dots li.slick-active button{
    outline: 2px solid #111A1E;
    outline-offset: 5px;
    background: white;
}
.tesimonial-slider-section .slick-dots button:hover{
    outline: 2px solid #111A1E;
    outline-offset: 5px;
    background: white;
}
.visit-no-txt {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color: #111A1E;
}
.Visit-no {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color: #000000;
    padding-left: 10px;
}
.Visit-no:hover{
    color:#111A1E 
}
.direction-btn {
    width: 191px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #111A1E;
    cursor: pointer;
    margin-top: 60px;
}
.homepage-calling{
    margin-top: 40px;
}
.visit-restaurant-full {
    display: flex;
    column-gap: 30px;
}
.visit-restaurant-right-full {
    display: flex;
    column-gap: 30px;
    align-items: center;
}
.homepage1-footer-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color:  #111A1E;
}
.footer-social-medial {
    display: flex;
    margin-top: 40px;
}
.visit-restaurant-sec {
    padding-bottom: 100px;
}
.subscribe_form_field {
    background-color: transparent;
    border: none;
    width: 320px;
    padding: 0;
    padding-bottom: 15px;
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color:#ffffff;
}
.subscribe_form {
    border-bottom: 2px solid #808080;
    margin-top: 20px;
}
.subscribe_email_svg {
    position: absolute;
    top: 0;
    right: 0;
}
.copyright-left,
.copyright-right{
    width: 50%;
}
.copyright-right{
    text-align: right;
}
.footer-full-section {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 30px;
    width: 100%;
    padding-bottom: 40px;
}
.subscribe_form_field:focus-visible{
    outline: 0;
}
.working-hour-sec {
    display: flex;
    justify-content: space-between;
}
.homepage1-footer-txt2 {
    font-family: 'Lexend';
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    color: #111A1E;
    height: 60px;
    display: flex;
    align-items: center;
}
.subscribe_form_field::placeholder {
    color: #ffffff;
}
.subscribe_form_field::-webkit-input-placeholder {
    color: #ffffff;
}
.subscribe_form_field::-moz-placeholder {
    color: #ffffff;
}
.subscribe_form_field:-ms-input-placeholder {
    color: #ffffff;
}
.footer-checkbox-input {
   display: none;
}
.footer-chec-txt {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color:  #111A1E;
}
.footer-checkbox-input + .footer-chec-txt:before {
  content: "";
  margin-right: 10px;
  display: inline-block;
  vertical-align: text-top;
  width: 20px;
  height: 20px;
  border: 2px solid #FFFFFF;
  border-radius: 4px;
}
.footer-checkbox-input:checked + .footer-chec-txt:before {
  background: #111A1E;
  border: none;
}
.footer-checkbox-input:checked + .footer-chec-txt:after {
  content: "";
  position: absolute;
  left: 5px;
  top: 9px;
  background: white;
  width: 2px;
  height: 2px;
  box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
  transform: rotate(45deg);
}
.footer-checkbox-input{
  position: absolute;
  opacity: 0;
}
.footer-checkbox-input+ .footer-chec-txt {
  position: relative;
  cursor: pointer;
  padding: 0;
}
.footer-checkbox-sec{
    margin-top: 40px;
}
.copyright-txt-homepage1 {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color:  #111A1E;
}
.copyright-menu ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.copyright-menu ul li {
    display: inline-block;
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    text-align: right;
    color:  #111A1E;
    padding-left: 40px;
}
.copyright-menu ul li a{
    color:  #111A1E;
}
.copyright-menu ul li a:hover {
    color: #111A1E;
}
.copyright-full-sec {
    display: flex;
    justify-content: space-between;
}
.homepage-copyright-sec{
    padding: 40px 0;
    border-top: 1px solid rgb(153 169 173 / 10%);
    background: #931A2A;
}
.restaurant-img2 {
    text-align: left;
}
.homepage-menu{
    min-width: 800px !important;
    display: flex !important;
    justify-content: center;
    padding: 20px !important;
}
li.widget_media_image,
.mega-menu-item-media_image-3,
.mega-menu-item-media_image-6{
    width: 33.33%;
    margin-left: 15px;
}
.widget_media_image:first-child{
    margin-left: 0 !important;
}
.marquee p {
  display: inline-block;
  font-family: 'Elsie';
  font-style: normal;
  font-weight: 400;
  font-size: 60px;
  line-height: 70px;
  color: #F5E6D3;
}
.marquee {
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: 80px;
}
.marquee_group {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 80px;
  min-width: 100%;
  animation: scroll 15s linear infinite;
}
.restaurant-second-img-sec{
    position: relative;
    margin-top: -75px;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
}
.round-details{
    margin-right: -100px;
}
.hero-img-sec img {
    animation: rotate 15s linear infinite;
}
.hero-img-sec1{
    display: none;
}
.fixed {
    position: fixed !important;
    z-index: 1;
    background: linear-gradient(180deg, rgba(11, 19, 21, 0.80) 0%, rgba(11, 19, 21, 0.20) 100%);
    backdrop-filter: blur(5px);
    width: 100%;
    top: 0;
    left: 0;
    -webkit-box-shadow: 0 0 22px -4px rgb(0 0 0 / 17%);
    box-shadow: 0 0 22px -4px rgb(0 0 0 / 17%);
    -webkit-animation: fixedheader 600ms ease 0ms 1 forwards;
    animation: fixedheader 600ms ease 0ms 1 forwards;
}
.hero-left{
    width: 65%;
    margin-top: 40px;
}
.hero-right{
    width:35% ;
    position: absolute;
    top: -120px;
    right: 0;
}
.yellow-line {
    background: #111A1E;
    width: 170px;
    height: 2px;
}
.hero-left-full {
    display: flex;
    align-items: center;
    column-gap: 30px;
}
.homepage-video-modal .modal-dialog{
    max-width: 1170px;
    width: 100%;
    height: 100%;
    padding: 0 20px;
    margin: 0  auto;
}
.hero-video-sec-full {
    text-align: -webkit-right;
}
#expand , #expand1 {
  min-height: 400px;
  min-width: 80%;
  will-change: width;
}
div#expand1{
    display: flex;
    text-align: right;
    width: 20%;
}
.video_sec_play {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #111A1E;
    border-radius: 40px;
}
.video_button {
    width: 100px;
    height: 100px;
    background: rgb(255 222 159 / 20%);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 60px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: scrolltop 2s infinite;
    transition: 0.5s;
}
.video-homepage{
    position: relative;
}
.fixed-serach-icon {
    width: 60px;
    height: 60px;
    background:#f5e6d3;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 30px;
    position: fixed;
    bottom: 40px;
    left: 40px;
    z-index: 1;
}
.homepage1-menu-bottom-sec{
    margin-top: 80px;
}
.gallery-bottom-sec{
    margin-top: 80px;
}
.homepage1-menu-back2-img {
    position: absolute;
    top: 0;
    right: 30px;
    animation: swing ease-in-out 1s infinite alternate;
}
.gallery-slide img {
    width: 100% !important;
    
}
.gallery-slide {
    margin: 0 15px;
}
.homepage1-menu-back1-img {
    position: absolute;
    top: 100px;
    left: 30px;
    animation: mover 1s infinite  alternate;
}
#Homepage1-menu-section{
    position: relative;
}
.home-uparrow{
    padding-left: 10px;
}
.pbmit-animation-style1.active
{
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    z-index: -1;
}
.pbmit-animation-style1 {
    clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
    position: relative;
    overflow: hidden;
    -webkit-transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
    -o-transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
    transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
}
.pbmit-animation-style1.active img{
    transform: scale(1) translate(0px, 0px);
    -webkit-transform: scale(1) translate(0px, 0px);
    -ms-transform: scale(1) translate(0px, 0px);
}
.pbmit-animation-style1 img{
    -webkit-transform: scale(1.5) translate(-100px, 0px);
    -ms-transform: scale(1.5) translate(-100px, 0px);
    transform: scale(1.5) translate(-100px, 0px);
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
    -o-transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
    transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
}
.video-sec {
    width: 100%;
}
.visit-restaurant-left,
.visit-restaurant-right{
    width: 50%;
}

/************************ 3.Homepage2 CSS ***************************/
.header2-menu-icon {
    width: 60px;
    height: 60px;
    border: 2px solid #111A1E;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.home1-mt {
    padding-bottom: 100px;
}
.bg-col{
    background:#F5E6D3;
    border-top: 1px solid rgb(153 169 173 / 10%);
    padding-top: 100px;
    position: relative;
    z-index: 1;
}
#home2-hero-section {
    background-image: url(../images/Homepage2/hero-1.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    max-width: 100%;
    width: 100%;
    height: 1080px;
    position: relative;
    z-index: 1;
}
#homepage2-menu-section{
    position: relative;
    z-index: 1;
}
.homepage2-hero-overlay {
    content: "";
    background: linear-gradient(180deg, #F5E6D3 0%, rgba(11, 19, 21, 0.5) 49.35%, #F5E6D3 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.home2-hero-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 128px;
    line-height: 147px;
    text-align: center;
    color: #FFFFFF;
}
.powered-txt-home2 {
    color: #FFF;
    font-size: 16px;
    font-family: Lexend;
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
}
.home2-form-txt3 {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-family: Lexend;
    line-height: 24px;
    margin-top: 30px;
}
.home2-hero-txt2 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 40px;
}
.dicover-menu-btn-home2{
    width: 195px;
    height: 65px;
    background: #111A1E;
    margin-top: 60px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}
.dicover-menu-btn-home2 a{
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    color: #F5E6D3;
}
#homepage2-header2{
    position: absolute;
    width: 100%;
    z-index: 99;
    padding: 15px 40px;
    border-bottom: 1px solid rgb(153 169 173 / 10%);
}
.home2-hero-section-full{
    padding-top: 220px;
    position: relative;
}
.home2-video-sec-full{
    position: relative;
    padding: 100px 0;
}
.home2-our-res-txt1{
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    color: #111A1E;
}
.home2-our-res-txt2 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    color:#931A2A;
    margin-top: 20px;
}
.chefs-bottom-left{
    margin-top: 30px;
}
.home2-restaurant-top-full {
    display: flex;
    column-gap: 30px;
}
.home2-restaurant-top-left {
    width: 50%;
}
.home2-restaurant-top-right {
    width: 50%;
}
.home2-our-restaurant-left,
.home2-our-restaurant-right{
    width: 50%;
}
.home2-rest-txt1,
.home2-rest-txt2 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color:  #111A1E;
}
.home2-rest-txt2{
    margin-top: 10px;
}
.round-details-home2 {
    position: absolute;
    top: 30px;
    right: 0;
}
.home2-restaurant-second-bottom-wrap{
    margin-top: 60px;
    width: 50%;
}
.home2-restaurant-middle-full {
    display: flex;
    column-gap: 30px;
}
.home2-restaurant-bottom-full {
    display: flex;
    column-gap: 30px;
}
.home2-our-restaurant-img-sec-left {
    width: 50%;
}
.home2-our-restaurant-img-sec-right {
    width: 50%;
}
#home2-our-restaurant-section{
    overflow: hidden;
}
.home2-our-restaurant-img-sec-left,
.home2-our-restaurant-img-sec-right{
    margin-top: 60px;
}
.home2-explore-btn {
    margin-left: auto;
    margin-right: auto;
}
.home2-our-restaurant-img-sec-right{
    text-align: right;
}
.homepage2-chefs-bottom-sec-wrap {
    display: flex;
    column-gap: 30px;
    flex-direction: row-reverse;
}
.video_button-home2{
    width: 120px;
    height: 120px;
    background: rgb(255 222 159 / 20%);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 60px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 60px;
    animation: scrolltop 2s infinite;
    transition: 0.5s;
}
#home2-video-sec {
    background-image: url(../images/Homepage2/home2-video-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    max-width: 100%;
    width: 100%;
    position: relative;
    /*padding: 100px 0;*/
}
.home2-chef-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 128px;
    line-height: 147px;
    text-align: center;
    color: #b3b6b7;
}
.home2-chef-txt2 {
    font-family: 'Lexend';
    font-weight: 300;
    font-size: 40px;
    line-height: 50px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 20px;
}
.homepage2-menu-bottom-sec{
    margin-top: 80px;
}
.homepage2-menu-img img {
    border-radius: 85px;
}
.homepage2-menu-bottom-sec-full{
    display: grid;
    grid-template-columns: repeat(2, 2fr);
    grid-gap: 30px;
}
.home2-services-top,
.home2-services-bottom{
    position: relative;
}
.home2-ser-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 32px;
    line-height: 37px;
    color: #FFFFFF;
    text-align: center;
    margin-top: 20px;
}
.home2-ser-txt2 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color:  #111A1E;
    text-align: center;
    margin-top: 20px;
}
.home2-ser-img {
    border: 2px solid #111A1E;
    padding: 20px;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    margin-left: auto;
    margin-right: auto;
}
.home2-services-bottom-full{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 30px;
    margin-top: 80px;
}
#home2-services-sec{
 background-image: url(../images/Homepage2/services-1.png);
 background-repeat: no-repeat;
 background-position: center;
 background-size: cover;
 max-width: 100%;
 width: 100%;
 position: relative;
 padding-bottom: 50px;
}
#home2-counter-sec {
    position: relative;
    top: -177px;
    z-index: 9;
}
.fast-ordering-home2 {
    margin-top: -80px;
    padding-bottom: 100px;
}
.home2-gallery-top{
    padding-bottom: 80px;
}
.home2-test-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 30px;
    line-height: 40px;
    text-align: center;
    color: #FFFFFF;
}
.home2-test-txt2 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #ffffff;
    margin-top: 40px;
}
#home2-testimonials-sec{
   background-image: url(../images/Homepage2/testimonial-1.png);
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   max-width: 100%;
   width: 100%;
   position: relative;
   overflow: hidden;
}
.homepage2-testimo-overlay{
    content: "";
    background: linear-gradient(180deg, #F5E6D3 0%, rgba(11, 19, 21, 0.7) 49.35%, #F5E6D3 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.home2-test-bottom-full{
    padding-top: 80px;
}
.home2-test-bottom-full .slick-custom-arrow:hover i.fa-solid.fa-arrow-right,
.home2-test-bottom-full .slick-custom-arrow:hover i.fa-solid.fa-arrow-left
{
    color: #F5E6D3;
}
.home2-test-bottom-full .slick-custom-arrow {
    position: absolute;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    width: 60px;
    height: 60px;
    border: 2px solid #FFFFFF;
    border-radius: 30px;
    cursor: pointer;
    color: #000;
}
.home2-test-bottom-full .slick-custom-arrow-left {
    left: -10%;
    top: 50%;
}
.home2-test-bottom-full .slick-custom-arrow-right {
    right: -10%;
    top: 50%;
}
.home2-test-bottom-full .slick-custom-arrow-right:hover,
.home2-test-bottom-full .slick-custom-arrow-left:hover {
    background: #111A1E;
    border: 1px solid #111A1E;
}
i.fa-solid.fa-arrow-right,
i.fa-solid.fa-arrow-left{
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: white;
}
.home2-test-bottom {
    width: 970px;
    margin: 0 auto;
}
.home2-blog-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #111A1E;
    margin-top: 40px;
}
.home2-blog-sec:hover .home2-blog-txt2{
    color: #111A1E;
}
.home2-blog-txt2 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 32px;
    line-height: 37px;
    color: #FFFFFF;
    margin-top: 20px;
}
.home2-blog-bottom-full {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 30px;
    margin-top: 80px;
}
.home2-blog-img1 {
  position: relative;
  display: block;
  overflow: hidden;
  z-index: 1;
}
.home2-blog-img1:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255,.2);
  visibility: hidden;
  transform-origin: left center;
  transform: scaleY(0) translateZ(100px);
  transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease;
  z-index: 1;
}
.home2-blog-sec:hover .home2-blog-img1:before {
  visibility: visible;
  transform: scaleY(1) translateZ(0px);
}
.gallery-item-sec.homepage2-gallery {
    margin-top: 0px;
}
.gallery-food-slider.gallery-home2-bottom{
    margin-top: 30px;
}
.homepage1-gallery-sec-top1{
    padding-top: 100px;
    padding-bottom: 80px;
}
#homepage1-gallery-sec{
    position: relative;
}
.reservation-3-bottom{
    padding-bottom: 100px;
}
.home2-footer-bottom-full {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 30px;
    margin-top: 60px;
}
#booking-table{
    width: 1230px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    background: #F5E6D3;
    z-index: 1;
}
.booking-table1{
    padding: 30px 0;
}
.home2-footer-txt1 {
    font-family: 'Lexend';
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #FFFFFF;
}
.home2-footer-txt2 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color:  #111A1E;
    margin-top: 40px;
}
.home2-footer-top{
    text-align: center;
}
.home2-footer-txt a {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color: #FFFFFF;
    text-align: center;
    margin-top: 20px;
}
.home2-footer-txt{
    display: flex;
    align-items: center;
    justify-content: center;
}
.home2-footer-txt a:hover{
    color: #111A1E;
}
.subscribe_form-footer {
    border-bottom: 2px solid #808080;
    margin-top: 40px;
}
.home2-footer-social-medial{
    display: flex;
    margin-top: 40px;
    justify-content: center;
}
.home2-footer-sec-full {
    padding-bottom: 40px;
}
.home2-form-btn a {
    width: 270px;
    height: 64px;
    background: #111A1E;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #F5E6D3;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    font-weight: 500;
    line-height: 24px;
}
.home2-form-bottom {
    display: grid;
    grid-template-columns: repeat(4,4fr);
    gap: 30px;
}
.custom-input-home3-form.custom-select2{
    width: 270px;
    height: 64px;
}
select.custom-select.custom-select2{
    width: 270px;
    height: 64px;
}
.home2-gallert-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 20px;
}
.home2-gallery-bottom-second{
    margin-top: 30px;
}
.pswp__caption__center{
    text-align: center;
}
.home2-gallery-sec {
    position: relative;
    overflow: hidden;
}
.content-overlay-home2 {
    background: rgb(255 222 159 / 80%);
    position: absolute;
    height: 100%;
    width: calc(100% - 30px);
    width: 100%;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    transition: all 0.4s ease-in-out 0s;
}
.home2-gallery-bottom-first .slick-track,
.home2-gallery-bottom-second .slick-track{
    display: flex !important;
    column-gap: 30px;
}
.home2-gallery-overlay {
    position: absolute;
    text-align: center;
    padding-left: 1em;
    padding-right: 1em;
    width: 100%;
    top: 50%;
    left: 50%;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.fadeIn-left {
    left: 20%;
}
.fadeIn-bottom {
    top: 80%;
}
.fadeIn-right{
    right: 80%;
}
.gallery-overlay-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 32px;
    line-height: 37px;
    color: #F5E6D3;
}
.content-overlay-home2 img{
    width: 100%
}
.home2-gallery-sec:hover .home2-gallery-overlay {
    top: 50%;
    left: 50%;
    opacity: 1;
}
.gallery-slide:hover .content-overlay-home2,
.home2-gallery-sec:hover .content-overlay-home2{
    opacity: 1;
}
a.home2-search-icon {
    margin-top: 60px;
    display: inline-block;
}
.home2-gallery-section{
    padding-bottom: 100px;
}
.home2-gallery-bottom-first{
    margin-top: 80px;
}
.gallery-slide:hover .content-overlay-home2{
    opacity: 1;
}
.home2-search-icon {
    margin-top: 60px;
}
.reservation-2-top{
    padding-bottom: 80px;
}
.gallery-slide:hover .home2-gallery-overlay{
    top: 50%;
    left: 50%;
    opacity: 1;
}
.gallery-slide{
    position: relative;
    overflow: hidden;
}
.gallery-slide:hover img{
    transform: scale(1.25);
    transition: 0.5s;
}

/************************ 4.Homepage3 CSS ***************************/
.home3-form-btn{
    margin-top: 30px;
}
.homepage3-about-sec-mt-100{
    padding-top: 100px;
}
.home3-form-btn a{
    width: 350px;
    height: 64px;
    background: #111A1E;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #F5E6D3;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    font-weight: 500;
    line-height: 24px;
}
.homepage3-form {
    width: 470px;
    height: 668px;
    border: 1px solid #FFF;
    background: linear-gradient(135deg, rgba(11, 19, 21, 0.80) 0%, rgba(11, 19, 21, 0.20) 100%);
    backdrop-filter: blur(5px);
    padding: 60px;
}
.home3-form-txt1 {
    color:#9fa2a4;
    text-align: center;
    font-size: 20px;
    font-family: Lexend;
    line-height: 24px;
    text-transform: uppercase;
}
.home3-form-txt2 {
    color: #FFF;
    font-size: 40px;
    font-family: Elsie;
    margin-top: 10px;
}
.powered-txt {
    color: #FFF;
    font-size: 16px;
    font-family: Lexend;
    line-height: 24px;
}
.custom-select {
    background: url(../images/Homepage3/form-arrow.svg) no-repeat;
    background-position: 96% center;
    appearance: none;
    color: #FFF;
    font-size: 18px;
    font-family: Lexend;
    line-height: 24px;
    width: 350px;
    height: 64px;
    border: 1px solid #ffffff;
    padding: 20px;
}
.custom-select:focus-visible,
.custom-input-home3-form:focus-visible{
    outline-offset: 0;
    outline-width: 0 !important;
}
.custom-select option{
    color:#FFF;
    font-size: 18px;
    font-family: Lexend;
    line-height: 24px;
    background: black;
}
.custom-input-home3-form {
    width: 350px;
    height: 64px;
    background: transparent;
    border: 1px solid #ffffff;
    color: #FFF;
    font-size: 18px;
    font-family: Lexend;
    line-height: 24px;
    background: url(../images/Homepage3/form-arrow.svg) no-repeat;
    background-position: 96% center;
    padding: 20px;
}
.home3-form-txt3 {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-family: Lexend;
    line-height: 24px;
    margin-top: 10px;
}
.home3-form-no {
    color: #9fa2a4;
}
.home3-form-no:hover{
    text-decoration: underline;
}
.home3-form-bottom{
    margin-top: 30px;
}
.single-input-form-home3{
    margin-bottom: 20px;
}
.open-table {
    margin-top: 30px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.home3-discover-btn {
    width: 186px;
    height: 64px;
    background: #111A1E;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 60px;
}
.home3-discover-btn a{
    font-family: 'Lexend';
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: #F5E6D3;
}
.home3-about-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    color: #111A1E;
}
.home3-about-txt2 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    color: #FFFFFF;
    margin-top: 20px;
}
.home3-about-txt3 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color:  #111A1E;
    margin-top: 40px;
}
.homepage3-about-sec-full {
    display: flex;
    column-gap: 30px;
}
.home3-about-txt4 {
    font-family: 'Lexend';
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #111A1E;
}
.home3-about-sec1,
.home3-about-sec2,
.home3-about-sec3{
    width: 33.33%;
}
.homepage3-menu-bottom-sec{
    margin-top: 80px;
}
.home3-about-txt5 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color:  #111A1E;
}
.home3-about-no a,
.home3-email-txt a
{
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    color:  #111A1E;
}
.home3-about-working {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}
.home3-about-sec-bottom{
    text-align: center;
}
.home3-about-sec-middle,
.home3-about-sec-bottom{
    margin-top: 80px;
}
.round-details-home3 {
    position: relative;
    top: -100px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#home3-services-sec{
   background-image: url(../images/Homepage3/services-1.png);
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   max-width: 100%;
   width: 100%;
   position: relative;
   padding: 100px 0;
   background-attachment: fixed;
}
.home3-menu-star ul{
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.home3-menu-star ul li{
    display: inline-block;
}
.home3-menu-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 24px;
    line-height: 28px;
    color: #FFFFFF;
    margin-top: 20px;
    text-align: center;
}
.home3-menu-txt2 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 36px;
    line-height: 41px;
    color: #111A1E;
    margin-top: 10px;
    text-align: center;
}
.home3-menu-star{
    margin-top: 10px;
    text-align: center;
}
.home3-menu-slide img{
    width: 100%;
    transition:all 500ms ease;
}
.home3-menu-slide:hover .home3-menu-txt1{
    color: #111A1E;
}
.home3-menu-slide img:hover{
   transform:scale(1.05,1.05) rotate(2deg);
   transition:all 500ms ease;
}
.home3-menu-slide{
    padding: 0 15px;
    position: relative;
    overflow: hidden;
}
.homepage3-menu-details .slick-custom-arrow {
    position: absolute;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    z-index: 98;
    width: 40px;
    height: 40px;
    cursor: pointer;
    color: #000;
}
.homepage3-menu-details .slick-custom-arrow-left {
    left:-60px;
    top: 30%;
}
.homepage3-menu-details .slick-custom-arrow-right {
    right: -60px;
    top: 30%;
}
i.fa-regular.fa-angle-right, 
i.fa-regular.fa-angle-left {
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #111A1E;
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 700;
}
#home3-feature-sec{
   background-image: url(../images/Homepage2/services-1.png);
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   max-width: 100%;
   width: 100%;
   position: relative;
   padding-top: 272px;
   padding-bottom: 100px;
   z-index: -1;
}
#home3-counter-sec {
    position: relative;
    margin-bottom: -172px;
}
.home3-fea-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    color: #FFFFFF;
}
.home3-fea-txt2 {
    font-family: 'Lexend';
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 40px;
}
.home3-feature-sec-full {
    display: flex;
    column-gap: 30px;
    position: relative;
}
.home3-feature-left,
.home3-feature-right{
    width: 50%;
}
.home3-feature-right-full {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.homepage3-featured-overlay{
    content: "";
    background: rgb(11 19 21 / 80%);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.checf-home3 {
    margin-top: -90px;
    margin-bottom: 100px;
}
.home3-team-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    text-transform: uppercase;
    color: #111A1E;
}
.home3-team-txt2 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    text-align: center;
    color: #931A2A;
    margin-top: 20px;
}
.home3-team-txt3 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    color: #931A2A;
    margin-top: 40px;
}
.home3-team-txt4 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color:  #111A1E;
    margin-top: 20px;
}
.single-chefs-des:hover .home3-team-txt3 {
    color: #111A1E;
}
.chefs1-team-slide:hover .content-overlay{
    opacity: 1;
}
.chefs1-team-slide:hover .home3-team-txt3{
    color: #111A1E;
}
.chefs1-team-slide:hover .content-details {
  top: 50%;
  left: 50%;
  opacity: 1;
}
.home3-team-bottom-sec-full .slick-track{
    display: flex !important;
}
.home3-team-bottom-sec-full .slick-dots button{
    display: block;
    width: 10px;
    height: 10px;
    padding: 0;
    border: none;
    border-radius: 100%;
    text-indent: -9999px;
    background:  #111A1E;
    margin-left: 30px;
}
.home3-team-bottom-sec-full .slick-dots {
    display: flex;
    justify-content: center;
    margin: 0;
    margin-top: 40px;
    list-style-type: none;
    column-gap: 10px;
    padding: 0;
}
.home3-team-bottom-sec-full .slick-dots li.slick-active button{
    outline: 2px solid #111A1E;
    outline-offset: 5px;
    background: white;
}
.home3-team-bottom-sec-full .slick-dots button:hover{
    outline: 2px solid #111A1E;
    outline-offset: 5px;
    background: white;
}
.home3-team-slide img{
    width: 100%;
    padding: 0 15px;
}
.home3-team-bottom-sec{
    margin-top: 80px;
}
.home3-team-sec{
    padding-bottom: 100px;
}
.content-overlay {
    position: absolute;
    height: calc(100% - 60px);
    width: calc(100% - 60px);
    background: rgb(11 19 21 / 80%);
    left: 30px;
    top: 30px;
    bottom: 30px;
    right: 30px;
    opacity: 0;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s;
}
.content-overlay-team-home3 {
    position: relative;
    max-width: 400px;
    overflow: hidden;
}
.content-details .home3-team-overlay-content:hover{
 color: #111A1E;;
}
.content-overlay-team-home3:hover .content-overlay {
    opacity: 1;
}
.content-details {
    position: absolute;
    text-align: center;
    padding-left: 1em;
    padding-right: 1em;
    width: 100%;
    top: 50%;
    left: 50%;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}
.fadeIn-right {
    left: 80%;
}
.content-overlay-team-home3:hover .content-details {
  top: 50%;
  left: 50%;
  opacity: 1;
}
.content-details .home3-team-overlay-content{
    font-family: 'Elsie';
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    text-decoration-line: underline;
    color: #FFFFFF;
}
.home3-tesimonial-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    color: #ffffff;
}
.home3-tesimonial-txt2 {
    font-family: 'Elsie';
    font-style: normal;
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    color: #FFFFFF;
    margin-top: 20px;
}
.home3-tesimonial-txt3 {
    font-family: 'Elsie';
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 36px;
    text-align: center;
    color: #931A2A;
}
.home3-tesimonial-txt4 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #111A1E;
    margin-top: 30px;
}
.home3-gallery{
    padding-bottom: 80px;
}
#home3-testimonial-sec{
    background-image: url(../images/Homepage2/testimonial-1.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    max-width: 100%;
    width: 100%;
    position: relative;
    padding-bottom: 190px;
}
.home3-testimonial-sec-full{
    display: flex;
    column-gap: 30px;
    position: relative;
}
.home3-testimonial-left,
.home3-testimonial-right{
    width: 50%;
}
.home3-testimonial-right-full {
    background: #F5E6D3;
    padding: 30px;
    height: 370px;
    width: 570px;
}
.home3-testimonial-right-full .slick-custom-arrow {
    position: absolute;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    z-index: 2;
    width: 60px;
    height: 60px;
    border: 2px solid #FFFFFF;
    border-radius: 30px;
    cursor: pointer;
    color: #000;
}
.home3-testimonial-right-full .slick-custom-arrow-left {
    left: 35%;
    bottom: -35%;
}
.home3-testimonial-right-full .slick-custom-arrow-right {
    right: 35%;
    bottom: -35%;
}
.home3-testimonial-right-full .slick-custom-arrow:hover{
    background: #F5E6D3;
    border: 1px solid transparent;
}
i.fa-solid.fa-arrow-right,
i.fa-solid.fa-arrow-left{
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: white;
}
.home3-blog-content p {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #111A1E;
}
.home3-blog-content h3 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 30px;
    line-height: 40px;
    color: #FFFFFF;
    margin-top: 10px;
}
.home3-blog-overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    content: "";
    background: linear-gradient(180deg, rgba(11, 19, 21, 0) 0%, #F5E6D3 100%);
    z-index: 1;
}
.home3-blog-sec{
    position: relative;
    overflow: hidden;
}
.home3-blog-img{
 transform: scale(100%) translateX(0);
 transition: all .4s;
}
.home3-blog-sec:hover .home3-blog-img{
 transform: scale(110%) translateX(-15px);
 transition: all .4s;
}
.home3-blog-content {
    position: absolute;
    bottom: 30px;
    left: 30px;
    right: 30px;
    z-index: 1;
}
.homepage3-blog-bottom-sec-full{
    display: grid;
    grid-template-columns: repeat(3,3fr);
    gap: 30px;
    margin-top: 80px;
}
.home3-blog-sec:hover .home3-blog-content h3{
   color: #111A1E; 
   transition: all 0.5s;
}
.home3-footer1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    color: #111A1E;
    margin-top: 30px;
}
.home3-footer-txt1 {
    font-family: 'Elsie';
    font-style: normal;
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    color: #FFFFFF;
    margin-top: 20px;
}
.home3-footer-middle,
.home3-footer-bottom{
    margin-top: 40px;
}
.home3-footer-txt4 {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 36px;
    color:  #111A1E;
}
.home3-footer-txt2 {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 36px;
    color:  #111A1E;
}
.home3-footer-txt3 {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 36px;
    color: #FFFFFF;
}
.home3-footer-email-txt {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 36px;
    color: #FFFFFF;
    padding-left: 8px;
}
.home3-footer-email {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 36px;
    color: #111A1E;
}
.home3-footer-email-txt:hover{
    color: #111A1E;
}
.about-us-our-restaurant-section{
    overflow: hidden;
}
.home3-team-bottom-sec-full .slick-list,
.homepage3-menu-details .slick-list{
    margin:0 -15px;
}
.home3-footer-section-full{
    display: flex;
    column-gap: 30px;
}
.home3-footer-first,
.home3-footer-seconf{
    width: 50%;
}
.home3-footer-map iframe {
    margin-bottom: -7px;
}
.home3-hero-txt1 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 96px;
    line-height: 111px;
    color: #FFFFFF;
}
.home3-hero-txt2 {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    color: #FFFFFF;
}
.home3-hero-section-full{
    display: flex;
    column-gap: 30px;
}
.home3-hero-second {
    display: flex;
    align-items: center;
    justify-content: right;
}
.home3-hero-first,
.home3-hero-second{
    width: 50%;
    position: relative;
}
.homepage3-menu-sec-home3 {
    padding-top: 100px;
}
.home3-counter-sec1{
    padding-top: 100px;
}
#home3-hero-section{
    background-image: url(../images/Homepage3/hero-1.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    max-width: 100%;
    width: 100%;
    position: relative;
    height: 100%;
    padding-bottom: 100px;
    padding-top: 190px;
    overflow: hidden;
}
.home3-overlay-hero{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    content: "";
    background: rgb(11 19 21 / 40%);
}
.home3-header{
    position: absolute;
    width: 100%;
    top: 0;
    z-index: 99;
}

/************************ 5.Header CSS ***************************/
.main-header.fixed-header .header-menu-wrap .navbar-nav .nav-link.active, 
.main-header.fixed-header .navbar-nav .nav-item:hover .nav-link, 
.main-header.fixed-header .navbar-nav .nav-link.active.dropdown-toggle::after, 
.main-header.fixed-header .navbar-nav .nav-item:hover .dropdown-toggle::after{
    color: #FEA02F;
}
.nav-left {
    margin-bottom: 0;
}
.header-menu-wrap .navbar-nav .nav-link{
    color: #ffffff;
    padding: 0 !important;
}
.header-menu-wrap .navbar-nav .nav-link.active, 
.header-menu-wrap .navbar-nav .nav-item:hover .nav-link, 
.header-menu-wrap .navbar-nav .nav-link.active.dropdown-toggle::after, 
.header-menu-wrap .navbar-nav .nav-item:hover .dropdown-toggle::after{
 color: #111A1E;
}
.header-menu-wrap .navbar-nav .nav-link.active{
   color: #111A1E;
}
.has-sub-menu , .has-sub-menu-main{
    display: none;
    width: auto;
}
.has-sub-main,
.sub-sub-menu{
    position: relative;
}
.has-sub-main:hover 
.has-sub-menu ,
.sub-sub-menu:hover 
.has-sub-menu-main{
    display: block;
    position: absolute;
    z-index: 9999;
    display: block;
    margin: 0;
    text-align: left;
    transition: .3s;    
    left: 100%;
    background: black;
    color: white;
    border: none;
    padding: 0;
    border-radius: 0;
    top: 0;
}
.header-menu-wrap .dropdown-toggle::after{
    color: #ffffff;
    margin: 0 0 0 10px;
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 700;
    font-size: 24px;
    content: "\f107" !important;
    border: none !important;
    vertical-align: middle;
}
li.nav-item.dropdown:nth-child(5) .dropdown-toggle::after{
    display: none;
}
.header-menu-wrap ul li.nav-item{
    margin:0 20px
}
li.nav-item.dropdown {
    padding: 27px 0px;
}
.header-menu-wrap ul li.nav-item:last-child{
    margin-right: 0;
}
.header-menu-wrap ul li.nav-item:first-child{
    margin-left: 0;
}
li.nav-item {
    display: inline-block;
}
.nav-item .dropdown-menu {
    position: absolute;
    z-index: -1;
    display: block;
    margin: 0;
    text-align: left;
    transition: .3s;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    bottom: 0;
    left: 0;
    background: #F5E6D3;
    color: white;
    border: 1px solid #111A1E;
    padding: 0;
    border-radius: 0;
    min-width: 220px;
    transform: translateY(105%);
}
.nav-item:hover .dropdown-menu{
    transform: translateY(100%);
    z-index: 99;
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
    width: 100%;
}
.widget_media_image a {
    display: block;
    width: 100%;
    height: 350px !important;
    overflow: hidden;
    position: relative;
    border: 2px solid #b3b3b3;
    border-radius: 1px;
    margin: 0 auto;
    padding: 0 !important;
}
ul.has-sub-menu {
    list-style-type: none;
    border: 1px solid #111A1E !important; 
}
.widget_media_image img {
    top: 0px;
    width: 100%;
    height: auto;
    position: absolute;
    z-index: 0;
    margin: 0;
    padding: 0;
    -webkit-transition: top 11s;
    -moz-transition: top 11s;
    -ms-transition: top 11s;
    -o-transition: top 11s;
    transition: bottom 11s;
}
.widget_media_image:hover img {
    top: -754px;
    -webkit-transition: all 11s;
    -moz-transition: all 11s;
    -ms-transition: all 11s;
    -o-transition: all 11s;
    transition: all 11s;
}
.mega-menu-item-media_image-3:hover img,
.mega-menu-item-media_image-6:hover img {
    top: -850px;
}
.arrow-right-angle {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: 2px solid white;
    border-left: 2px solid white;
    margin: 9px 0;
    position: absolute;
    right: 15px;
}
.arrow-right-angle, .long-arrow-right-angle {
    transform: rotate(135deg);
}
.dropdown-item{
    color: black ;
    font-family: Lexend;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 10px 15px;
    border-bottom: 2px solid rgba(130, 40, 40, 0.419);
    background:#65222b97;
}
.dropdown-item:hover{
 background: #111A1E;
 color: #F5E6D3;
}
.dropdown-item:hover .arrow-right-angle {
  border-top: 2px solid #F5E6D3;
  border-left: 2px solid #F5E6D3;
}

/************************ 6.Marquee CSS ***************************/
.marquee {
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: 80px;
}
.marquee_group {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 80px;
  min-width: 100%;
  animation: scroll 15s linear infinite;
}
.pbmit-animation-style2 img{
    transform-origin: 50% 50%;
    transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
}
.pbmit-animation-style2.active {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.pbmit-animation-style2.active img
{
    transform: scale(1) translate(0px, 0px);
}
.pbmit-animation-style2 {
    clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
    position: relative;
    overflow: hidden;
    transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
}
.pbmit-animation-style2 img {
    transform: scale(1.5) translate(100px, 0px);
}

/************************ 7.Menupage-1 CSS ***************************/
.menupage-1-hero-txt1,
.blog1-hero-txt1{
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 96px;
    line-height: 111px;
    text-align: center;
    color: #FFFFFF;
}
.menupage-1-section-img{
    background-image: url(../images/menupage-1/hero-1.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 100px;
    padding-bottom: 100px;
}
#app-section-menupage1{
    overflow: hidden;
}
.app-section-menupage1{
    padding: 100px 0;
}
.menupage-1-overlay {
    position: absolute;
    background: rgb(11 19 21 / 40%);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.menupage-1-conten{
    position: relative;
}
.breadcrumb-item+.breadcrumb-item::before{
    content: "-";
    color: #FFFFFF;
}
.breadcrumb{
    margin-bottom: 0;
}
.breadcrumb-item a {
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #931A2A;
    display: flex;
    align-items: center;
}
.breadcrumb-item.active{
    font-family: 'Lexend';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #111A1E;
}
.breadcrumb-item:hover.breadcrumb-item a{
    color:#111A1E;
}
.home-icon{
    padding-right: 10px;
}
.menupage1-boder{
    height: 1px;
    background: rgb(153 169 173 / 10%);
}
.breadcrumb-section{
    padding: 20px 0;
    background: #F5E6D3;
}
.menupage1-break-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    text-transform: uppercase;
    color: #111A1E;
}
.menupage1-break-txt2 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 20px;
}
.menupage1-break-txt3 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    text-align: center;
    color:  #111A1E;
    margin-top: 20px;
}
.menupage-1-breakfast-bottom{
    margin-top: 80px;
}
.reser-txt1-menu1 {
    color:#FDDD9E;
    text-align: center;
    font-size: 20px;
    font-family: Lexend;
    line-height: 24px;
    text-transform: uppercase;
}
.reser-txt2-menu1 {
    color: #FFFFFF;
    text-align: center;
    font-size: 60px;
    font-family: Elsie;
    line-height: 70px;
    margin-top: 20px;
}
.menupage1-no{
    color:#FDDD9E;
}
.menupage-1-breakfast-mt-100, .menupage-1-lunch-mt-100, .menupage-1-dinner-mt-100{
    padding-top: 100px;
}
.menupage1-no:hover{
    text-decoration: underline;
}
.menupage1-form-custom{
    width: 370px;
    height: 64px;
    border: 1px solid #ffffff;
    color:#FFF;
    font-size: 18px;
    font-family: Lexend;
    line-height: 24px;
    padding: 20px;
    background-color: rgba(21, 11, 11, 0.2);
}
.menupage1-form-custom::placeholder,
.about-us-input-custom::placeholder{
    color: white;
}
.menupage1-form-custom:focus-visible,
.about-us-input-custom:focus-visible,
.about-us-message:focus-visible{
    outline: 0 !important;
    outline-width: 0 !important;
}
.email-icon{
    background: url(../images/menupage-1/email-icon.png) no-repeat;
    background-position: 96% center;
}
.name-icon{
    background: url(../images/menupage-1/name-icon.png) no-repeat;
    background-position: 96% center;
}
.mobile-icon{
   background: url(../images/menupage-1/mobile-icon.png) no-repeat;
   background-position: 96% center; 
}
.reser-txt3-menu1 {
    color: #FFF;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    margin-top: 40px;
}
p.reser-txt3-menu1 a {
    color: white;
}
.arrow-icon{
    background: url(../images/Homepage3/form-arrow.svg) no-repeat;
    background-position: 96% center;
    font-size: 18px;
    appearance: none;
}
.reser-bottom-sec{
    margin-top: 80px;
}
.menupage1-form-custom option{
    color: #FFF;
    font-size: 18px;
    font-family: Lexend;
    line-height: 24px;
    background: black;
}
.form-menupage1 {
    display: grid;
    grid-template-columns: repeat(3,3fr);
    gap: 30px;
}
#reservation-sec{
    background-image: url(../images/menupage-1/Reservation-1.png);
    position: relative;
    padding: 100px 0;
    height: 740px;
}

.menupage-1-book-now-btn {
    width: 155px;
    height: 64px;
    background: #111A1E;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 60px;
}
.menupage-1-book-now-btn a {
    color:#F5E6D3;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    font-weight: 500;
    line-height: 24px;
}
.menupage-1-reser-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.8);
}
.menupage-1-testimo-overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    background: rgb(11 19 21 / 80%);
    top: 0;
}
#menupage-1-dinner{
    overflow: hidden;
}
.menupage-1-dinner-mt-100{
    padding-bottom: 100px;
}
.single-input-form-menupage1{
    height: 64px;
}
#menupage-1-testimonials-sec {
    background-image: url(../images/Homepage2/testimonial-1.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    max-width: 100%;
    width: 100%;
    position: relative;
    /*padding: 100px 0;*/
    overflow: hidden;
}
.menupage1-header {
    background: linear-gradient(180deg, rgba(11, 19, 21, 0.80) 0%, rgba(11, 19, 21, 0.20) 100%);
    backdrop-filter: blur(5px);
    position: absolute;
    width: 100%;
    z-index: 99;
}

/************************ 8.Menupage-2 CSS ***************************/
.menupage2-drink-txt1 {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    color: #111A1E;
    text-align: center;
}
.menupage-2-dessert-sec{
    padding-bottom: 100px;
}
.menupage-2-cocktails-sec,
.main-course-sec{
    padding: 100px 0;
}
.menupage1-cocotails-txt2 {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 60px;
    line-height: 70px;
    color: #FFFFFF;
    margin-top: 20px;
    text-align: center;
}
.menupage2-drink-name {
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 30px;
    line-height: 36px;
    color: #FFFFFF;
}
.menupage2-drink-price {
    font-family: 'Elsie';
    font-style: normal;
    font-weight: 400;
    font-size: 30px;
    line-height: 36px;
    color: #111A1E;
}
.menupage2-drink-para {
    font-family: 'Lexend';
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color:  #111A1E;
    margin-top: 20px;
}
.menupage2-dashed-line {
    border: 1px dashed  #111A1E;
    margin-top: 40px;
}
.menupage-2-cocktails-sec-full{
    display: flex;
    column-gap: 30px;
}
.menupage-2-cocotails-left,
.menupage-2-cocotails-right{
    width: 50%;
}
.menupage-2-cocotails-right-full:before{
    content: url(../images/menupage-2/dot-img.png);
    position: absolute;
    right: 0;
    top:0 ;
    z-index: -1;
}
.menupage-2-cocotails-right-full{
    position: relative;
}
.menupage2-deatails{
    margin-top: 60px;
}
.menupage-2-cocotails-left-bottom{
    margin-bottom: 40px;
}
.menupage-2-cocotails-left-bottom:hover .menupage2-drink-name{
    color:#111A1E;
}
.menupage-2-cocotails-left-bottom:last-child{
    margin-bottom: 0;
}
.menu2-descri {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cocktails-img {
    position: absolute;
    top: 120px;
    right: 70px;
}
.menupage-2-appetizers-sec-full {
    display: flex;
    flex-direction: row-reverse;
    column-gap: 30px;
}
.menupage-2-appetizer-right-full:before{
   content: url(../images/menupage-2/dot-img2.png);
   position: absolute;
   left: 0;
   top:0 ; 
}
.menupage-2-appetizer-right-full{
    position: relative;
}
.appetizer-img {
    position: absolute;
    top: 140px;
    left: 70px;
}
.menupage-2-app-left {
    width: 50%;
}
.menupage-2-app-right {
    width: 50%;
}
.menupage-2-main-course-right-full:before{
    content: url(../images/menupage-2/dot-img3.png);
    position: absolute;
    bottom:0 ; 
    z-index: -1;
}
.menupage-2-main-course-right-full{
    position: relative;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.course-img{
    margin-top: 70px;
}
.menupage-2-dessert-sec-full{
    display: flex;
    column-gap: 30px;
    flex-direction: row-reverse;
}
.menupage-2-dessert-right-full{
    position: relative;
}
.menupage-2-dessert-right-full:before{
 content: url(../images/menupage-2/dot-img.png);
 position: absolute;
 left: 0;
 top:0 ;  
}
.dessert-img {
    position: absolute;
    top: 150px;
    left: 70px;
}
.social-media:hover a svg path{
    fill:#F5E6D3;
}
.social-media {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border-radius: 20px;
}
.social-media:hover{
    background: white;
}
#menupage-1-breakfast,
#menupage-1-lunch{
    overflow: hidden;
}
.singlepage-team-sec-mt{
    padding: 0;
}

/************************ 9.Menupage-3 CSS ***************************/
.page-item-custom a {
    padding: 0;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px !important;
    color:#FFFFFF;
    font-size: 20px;
    font-family: Lexend;
    border-radius: 60px;
    border: 2px solid  #111A1E;
    background: transparent;
}
ul.pagination{
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 20px;
    margin: 0;
    padding: 0;
}
.menupage3-pagination{
    margin-top: 80px;
}
.page-link:hover{
    background: white !important;
    color: #000000 !important;
    border-color:white !important
}
.page-link:focus{
    color: black !important;
    box-shadow: none;
    background-color: white;
}
.menupage-3-menu-section{
    padding-bottom: 100px;
}
.homepage1-menu-left img,
.homepage2-menu-img img,
.menupage-6-menu-bottom-full img,
.menupage7-menu-top img
{
    transform: scale(1);
    transition: all 0.7s cubic-bezier(0.3, 0, 0.3, 1);
}
.homepage1-menu-left img:hover,
.homepage2-menu-img img:hover,
.menupage-6-menu-bottom-full img:hover,
.menupage7-menu-top img:hover{
    transform: scale(1.05);
}
.homepage1-menu-content:hover .tab-menu-txt1,
.menupage-6-menu-bottom-full:hover .home3-menu-txt1,
.menupage-7-menu-content:hover .menu7-txt1{
 color: #111A1E;
}
.menupage-7-menu-content {
    overflow: hidden;
}
.menupage8-content:hover .menupage-8-txt1{
    color: #111A1E;
}

/************************ 10.Menupage-4 CSS ***************************/
.menupage4-menu-section{
    padding-bottom: 100px;
    padding-top: 100px;
}
#menupage4-menu-tab li:first-child button{
    margin-left:0; 
}
.custom-menu4-tab-btn {
    color: #ffffff;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    line-height: 24px;
    text-transform: uppercase;
    padding: 0;
    margin-left: 60px;
    border-bottom: 2px solid transparent;
}
.nav-link.custom-menu4-tab-btn:hover,
.custom-menu4-tab-btn.active {
    color: #111A1E;
    border-bottom: 2px solid #111A1E;
    border-radius: 0;
}
.menupage4-bottom-sec ul {
    margin-top: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0 !important;
}

/************************ 11.Menupage-5 CSS ***************************/
.menupage5-menu-txt1 {
    color: #FFFFFF;
    text-align: center;
    font-size: 60px;
    font-family: Elsie;
    line-height: 70px;
    margin-top: 20px;
}
.menupage5-drink-name{
    font-family: 'Elsie';
    font-weight: 400;
    font-size: 30px;
    line-height: 36px;
    color: #FFFFFF;
}
.menupage-5-bottom:hover .menupage5-drink-name{
    color:#111A1E;
}
.menupage5-menu-sec-bottom-full {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 60px;
}
#menupage5-img1-sec{
    background-image: url(../images/menupage-5/hero-img.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    height: 500px;
}
#menupage5-img2-sec{
    background-image: url(../images/menupage-5/hero-img1.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    height: 500px;
}

/************************ 12.Datepiker CSS ***************************/
.custom-input-home3-form::placeholder{
    color: white;
}
#ui-datepicker-div {
    display: none;
    background-color: #fff;
    box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,0.1);
    margin-top: 0.25rem;
    border-radius: 0.5rem;
    padding: 0.5rem;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
.ui-datepicker-calendar thead th {
    padding: 0.25rem 0;
    text-align: center;
    font-size: 0.75rem;
    font-weight: 400;
    color: #78909C;
}
.ui-datepicker-calendar tbody td {
    width: 2.5rem;
    text-align: center;
    padding: 0;
}
.ui-datepicker-calendar tbody td a {
    display: block;
    border-radius: 0.25rem;
    line-height: 2rem;
    transition: 0.3s all;
    color: #546E7A;
    font-size: 0.875rem;
    text-decoration: none;
}
.ui-datepicker-calendar tbody td a:hover {  
    background-color: rgb(255 222 159 / 20%);
}
.ui-datepicker-calendar tbody td a.ui-state-active {
    background-color: #111A1E;
    color: white;
}
.ui-datepicker-header a.ui-corner-all {
    cursor: pointer;
    position: absolute;
    top: 0;
    width: 2rem;
    height: 2rem;
    margin: 0.5rem;
    border-radius: 0.25rem;
    transition: 0.3s all;
}
.ui-datepicker-header a.ui-corner-all:hover {
    background-color: #ECEFF1;
}
.ui-datepicker-header a.ui-datepicker-prev {    
    left: 0;    
    background: url(../images/Homepage3/calender-icon-left.png);
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: 50%;
    transform: rotate(180deg);
}
.ui-datepicker-header a.ui-datepicker-next {
    right: 0;
    background: url(../images/Homepage3/calender-icon-left.png);
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: 50%;
}
.ui-datepicker-header a>span {
    display: none;
}
.ui-datepicker-title {
    text-align: center;
    line-height: 32px;
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: 500;
}
.ui-datepicker-week-col {
    color: #78909C;
    font-weight: 400;
    font-size: 0.75rem;
}
.pbmit-animation-style3.active{
    clip-path: inset(0 0 0 0 );
    transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
}
.pbmit-animation-style3{
    clip-path: inset(0 0 100% 0 );
    transition: 2s cubic-bezier(0.5, 0.5, 0, 1);
    width: 100%;
}

/************************ 13.Menupage-6 CSS ***************************/
.menupage-6-menu-star ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.menupage-6-menu-star ul li {
    display: inline-block;
}
.menupage-6-menu-bottom {
    display: grid;
    grid-template-columns: repeat(4,4fr);
    column-gap: 30px;
    margin-top: 60px;
}
.menupage-6-menu-star {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}
.menu7-txt3 {
    color:  #111A1E;
    font-size: 16px;
    font-family: Lexend;
    line-height: 24px;
    margin-top: 20px;
}
.menupage7-deatils {
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.menu7-txt1 {
    color:#FFF;
    font-size: 24px;
    line-height: 30px;
    font-family: Elsie;
}
.menu7-txt2 {
    color:#111A1E;
    text-align: right;
    font-size: 24px;
    font-family: Lexend;
    font-weight: 500;
    line-height: 28px;
}
.tab-description-homepage-7 {
    display: grid;
    grid-template-columns: repeat(3,3fr);
    column-gap: 30px;
    margin-top: 60px;
}
.tab-description.menupage7-menu {
    display: grid;
    grid-template-columns: repeat(3,3fr);
    grid-column-gap: 30px;
}

/************************ 14.Menupage-8 CSS ***************************/
.menupage-8-txt1 {
    color: #ffffff;
    text-align: center;
    font-size: 30px;
    font-family: Elsie;
}
.menupage8-overlay {
    content: "";
    background: linear-gradient(180deg, rgba(11, 19, 21, 0.00) 0%, #F5E6D3 100%);
    border-radius: 8px;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.menupage8-content{
    position: relative;
    overflow: hidden;
}
.menupage8-img{
    border-radius: 20px;
}
.menupage8-overlay-content{
    bottom: 0;
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
}
.tab-description.menupage8-menu{
    display: grid;
    grid-template-columns: repeat(3,3fr);
    grid-column-gap: 30px;
}

/************************ 15.404 Error CSS ***************************/
.error-section-img {
    background-image: url(../images/404-error/header-img.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 100px;
    padding-bottom: 100px;
}
.error-txt1 {
    color: #FFF;
    text-align: center;
    font-size: 60px;
    font-family: Elsie;
    line-height: 70px;
}
.error-txt2 {
    color:  #111A1E;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    line-height: 30px;
    margin-top: 20px;
}
.error-home-btn {
    height: 64px;
    width: 237px;
    background: #111A1E;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 60px;
}
.error-home-btn a {
    color: #F5E6D3;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    font-weight: 500;
    line-height: 24px;
}
.error-top-sec{
    text-align: center;
}
.error-bottom-sec{
    margin-top: 60px;
}

/************************ 16.Blog1 CSS ***************************/
.blog1-section-img {
    background-image: url(../images/blogpage1/blog-bg-img.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 190px;
    padding-bottom: 100px;
}
.blog-1-wrapper:hover .blog1-txt2{
    color: #111A1E;
}
.blog1-txt1,
.blog2-txt1 {
    color: #111A1E;
    font-size: 16px;
    font-family: Lexend;
    line-height: 20px;
    margin-top: 20px;
}
.blog1-txt2,
.blog2-txt2 {
    color: #931A2A;
    font-size: 40px;
    font-family: Elsie;
    margin-top: 20px;
}
.blog2-blog-item:hover .blog2-txt2{
   color: #111A1E;
}
.blog-1-read-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-top: 40px;
    padding: 10px 22px;

    color:#000000;
    background: transparent;
    border: 2px solid #000000;
    border-radius: 25px;

    font-size: 16px;
    font-family: 'Lexend', sans-serif;
    font-weight: 500;
    line-height: 24px;
    text-decoration: none;
    cursor: pointer;

    transition:
        background-color 0.3s ease,
        color 0.3s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

/* Hover (desktop) */
.blog-1-read-more:hover {
    background: #742c2c79;
    color: #111A1E;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(255, 222, 158, 0.35);
}

/* Click (press effect) */
.blog-1-read-more:active {
    transform: scale(0.96);
    box-shadow: 0 4px 10px rgba(255, 222, 158, 0.3);
}
@media (max-width: 768px) {
    .blog-1-read-more {
        font-size: 14px;
        padding: 8px 18px;
        border-radius: 20px;
    }
}

.blogpage1-pagination{
    margin-top: 60px;
}
.blog1-txt3,
.blog2-txt3 {
    color:  #111A1E;
    font-size: 16px;
    font-family: Lexend;
    line-height: 24px;
    margin-top: 20px;
}

svg.blog1-icon{
    margin-left: 10px;
    transition: margin ease 350ms;
}

/************************ 17.Blog2 CSS ***************************/
.col-lg-8.blog8-left {
    padding: 0;
    width: calc(66.66% - 15px);
}
.col-lg-4.blog8-left {
    padding: 0;
    width: calc(33.33% - 15px);
}
.blogpage2-deatils{
    column-gap: 30px;
}
.blogpage2-pagination{
    margin-top: 60px;
}
.blog2-slider-txt1 {
    color: #111A1E;
    font-size: 30px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.blogpage2-book-btn {
    width: 180px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #111A1E;
    margin-top: 20px;
}
.blogpage2-book-btn a {
    color: #F5E6D3;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}
.blog2-slider-txt2 {
    color:  #111A1E;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 20px;
}
.blog2-search-input{
    width: 100%;
    height: 60px;
    padding: 18px 20px;
    font-weight: 400;
    font-family: Lexend;
    font-size: 18px;
    line-height: 24px;
    border: 1px solid #111A1E;
    border-right: 0;
    background:#F5E6D3;
    color:  #111A1E;
}
.blog2-search-input::placeholder{
    color:  #111A1E;
}
.blog2-search-input:focus-visible{
    outline-width: 0 !important;
}
.search-btn {
    width: 60px;
    height: 60px;
    padding: 0;
    border: none;
    line-height: 60px;
    background-color: #111A1E;
}
form.search-form{
    display: flex;
}
ul.pagination-blog-2 {
    display: flex;
    align-items: center;
    justify-content: left;
    column-gap: 20px;
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.blog2-slider-sec-img .slick-dots {
    display: block;
    margin: 0;
    list-style-type: none;
    padding: 0;
    position: absolute;
    right: 30px;
    top: 50%;
    bottom: auto;
    transform: translate(-50%, -50%);
}
.blog2-slider-sec-img .slick-dots button {
    display: block;
    width: 10px;
    height: 10px;
    padding: 0;
    border: none;
    border-radius: 100%;
    text-indent: -9999px;
    background:  #111A1E;
    margin-top: 25px;
}
.blog2-slider-sec-img .slick-dots li.slick-active button{
    outline: 2px solid #111A1E;
    outline-offset: 5px;
}
.blog2-slider-sec-img .slick-dots button:hover{
    outline: 2px solid #111A1E;
    outline-offset: 5px;
}
.blog-categroy {
    color: #931A2A;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.category-count {
    color: #090909;
    text-align: right;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
ul.category_sidebar-blog2 {
    margin: 0;
    list-style-type: none;
}
.blog-categroy:hover{
    color: #111A1E;
}
.blog2-post-txt1 {
    color: #931A2A;
    font-size: 22px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.blog2-post-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 15px;
    margin-top: 20px;
}
.blog2-post-wrapper:hover .blog2-post-txt1{
    color:#111A1E;
}
.blog2-post-txt2 {
    color: #111A1E;
    font-size: 12px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-top: 10px;
}
ul.category_sidebar-blog2 li {
    padding: 20px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgb(153 169 173 / 10%);
}
ul.category_sidebar-blog2 li:last-child{
    border-bottom: none;
}
ul.blog2-tag-list{
    margin: 0;
    list-style-type: none;
    margin-top: 20px;
}
ul.blog2-tag-list li{
    display: inline-block;
    background: rgb(153 169 173 / 20%);
    margin-left: 10px;
    margin-top: 10px;
}
ul.blog2-tag-list li a {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 8px 10px;
    display: inline-block;
}
ul.blog2-tag-list li a:hover {
    color: black;
}
ul.blog2-tag-list li:hover {
    background: #111A1E;
}
.blog2-slider-sec-img{
    margin-top: 16px;
}
.blog2-slider-sec-img .slick-list.draggable{
    width: 300px;
}

/************************ 18.Blog4 CSS ***************************/
.blogpage4-section-deatail{
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 30px;
    margin-top: 60px;
}
.blogpage4-section-deatail:nth-child(2){
    margin-top: 0;
}
#blogpage4-section{
    overflow: hidden;
}
.blog4-left-sec,
.blog4-right-sec{
    width: 50%;
}
.blog4-txt1 {
    color: #111A1E;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    padding-right: 5px;
}
.blog4-txt2 {
    color: #FFF;
    font-size: 40px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.blog4-txt3 {
    color:  #111A1E;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 40px;
}
.blog4-date {
    color:  #111A1E;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    border-left: 2px solid;
    padding-left: 8px;
}

/************************ 19.Blog5 CSS ***************************/
.blog5-txt2 {
    color: #FFFFFF;
    font-size: 40px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.blogpage5-deatils:hover .blog5-txt2{
    color: #111A1E;
}
.blog5-txt3 {
    color:  #111A1E;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 20px;
}
.blogpage5-left,
.blogpage5-right{
    width: 50%;
}
.blogpage5-wrapper {
    display: flex;
    justify-content: center;
    column-gap: 30px;
    margin-top: 60px;
}
.blogpage5-top {
    margin-top: 20px;
}
.blogpage5-full .blogpage5-wrapper:nth-child(2){
    margin-top: 0;
}
.blogpage5-readmore {
    margin-top: 40px;
    border: 2px solid #111A1E;
    width: 160px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.blogpage5-readmore:hover{
    background:#111A1E;
}
.blogpage5-readmore:hover.blogpage5-readmore a{
    color: black;
}
.blogpage5-readmore a {
    color: #111A1E;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}

/************************ 20.Blog6 CSS ***************************/
.blogpage6-txt1 {
    color: #FFFFFF;
    font-size: 30px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.blogpage6-top {
    margin-top: 20px;
}
.blogpage6-full {
    display: grid;
    grid-template-columns: repeat(3,3fr);
    grid-column-gap: 30px;
}
.blogpage6-wrapper:hover .blogpage6-txt1{
    color: #111A1E;
}
.blogpage8-wrapper:hover .blogpage6-txt1{
    color: #111A1E;
}

/************************ 21.Blog7 CSS ***************************/
.blogpage7-txt1 {
    color: #FFFFFF;
    font-size: 30px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: 40px;
    margin-top: 10px;
}
.blogpage7-wrapper{
    position: relative;
}
.blogpage7-wrapper:hover .blogpage7-txt1{
    color: #111A1E;
}
.blogpage7-overlay {
    position: absolute;
    background: linear-gradient(180deg, rgba(11, 19, 21, 0.00) 0%, #F5E6D3 100%);
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
.blogpage7-content {
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px;
}
.blogpage7-full{
    display: grid;
    grid-template-columns: repeat(3,3fr);
    grid-column-gap: 30px;
}

/************************ 22.Blog8 CSS ***************************/
.blogpage8-section-deatils {
    display: grid;
    grid-template-columns: repeat(2,2fr);
    grid-column-gap: 30px;
}
.blogpage8-pagination {
    display: flex;
    text-align: center;
    justify-content: center;
    margin-top: 60px;
}

/************************ 23.Blog10 CSS ***************************/
.blogpage10-section-deatils{
    display: grid;
    grid-template-columns: repeat(2,2fr);
    grid-column-gap: 30px;
}
.blogpage10-wrapper{
    position: relative;
}
.blogpage10-wrapper:hover .blogpage7-txt1{
    color: #111A1E;
}

/************************ 24.Blog12 CSS ***************************/
.blogpage12-full{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 30px;
}
.d-none-mobile1{
    display: none;
}

/************************ 25.Blog13 CSS ***************************/
.blogpage13-full-sec {
    display: grid;
    grid-template-columns: repeat(3,3fr);
    column-gap: 30px;
}
.mobile-none{
    display: none;
}
.load-more-blog-btn {
    width: 160px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #111A1E;
    margin-top: 60px;
    margin-left: auto;
    margin-right: auto;
}
.load-more-blog-btn a {
    color: #F5E6D3;
    font-size: 18px;
    font-family: Lexend;
    font-weight: 500;
    line-height: 24px;
}

/************************ 26.Coming Soon CSS ***************************/
.coming-txt1 {
    color: #FFF;
    text-align: center;
    font-size: 96px;
    font-family: Elsie;
    margin-top: 40px;
    font-weight: 400;
    line-height: normal;
}
.coming-txt2 {
    color: #FFF;
    text-align: center;
    font-size: 20px;
    font-family: Lexend;
    margin-top: 20px;
    font-weight: 400;
    line-height: normal;
}
.coming-counter-txt1 {
    color: #111A1E;
    text-align: center;
    font-size: 96px;
    font-family: Lexend;
    font-weight: 700;
    line-height: 100px;
}
.coming-counter-txt2 {
    color: #FFF;
    text-align: center;
    font-size: 24px;
    font-family: Lexend;
    font-weight: 500;
    margin-top: 20px;
}
.coming-soon-counter-sec{
    margin-top: 100px;
    padding-bottom: 160px;
}
.coming-soon-logo{
    text-align: center;
}
.coming-soon-full-sec{
    position: relative;
}
#coming-soon-section{
    background-image: url(../images/coming-soon/bg-img.png);
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    width: 100%;
    background-size: cover;
}
.coming-soon-overlay {
    position: absolute;
    background: rgb(11 19 21 / 40%);
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
.coming-soon-social-medial{
    display: flex;
}
.coming-soon-copyright {
    color: #FFF;
    font-size: 18px;
    font-family: Lexend;
    line-height: 24px;
}
.coming-soon-copyright-full {
    display: flex;
    justify-content: space-between;
}
.coming-soon-counter-sec-full {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    padding-top: 80px;
    padding-bottom: 80px;
}
#timer span{
    display: block;
    color: #FFF;
    text-align: center;
    font-size: 24px;
    font-family: Lexend;
    font-weight: 500;
}
.coming-soon div#timer {
    display: flex;
    line-height: 1; 
    flex-wrap: wrap;
    font-size: 40px;
    gap: 30px ;
}
.coming-soon span {
    display: block;
    font-family: Lexend;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    color: white;
    padding-top: 15px;
}
#days ,  #hours ,  #minutes , #seconds{
    text-align: center;
    color: #111A1E;
    font-family: "Lexend", Sans-serif;
    font-size: 96px;
    font-weight: 700;
    line-height: 100px;
    padding: 40px 40px 40px 40px;
    border: 2px solid #FFF;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.60) 0%, rgba(255, 255, 255, 0.10) 100%);
    backdrop-filter: blur(3px);
} 
.home3-gallery-sec {
    position: relative;
}
.home3-gallery-content {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 140px;
    height: 140px;
    border-radius: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    opacity: 0;
    transition: all 0.3s ease-in-out 0s;
}
.homepage3-gallery-bottom-sec{
    margin-top: 80px;
}
.home3-gallery-sec:hover .home3-gallery-content{
    opacity: 1;
    transform: translate(-50% , -50%);
}
.homepage3-gallery-bottom-sec .slick-track{
    display: flex !important;
    column-gap: 30px;
}

/************************ 27.Contact Us CSS ***************************/
.contact-us-img {
    background-image: url(../images/contact-us/contact-bg.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 100px;
    padding-bottom: 100px;
}
.about-us-input-custom {
    width: 100%;
    height: 64px;
    border: 1px solid #111A1E;
    color: #FFF;
    font-size: 18px;
    font-family: Lexend;
    line-height: 24px;
    padding: 20px;
    background-color: rgb(11 19 21 / 20%);
}
.about-us-message {
    height: 128px !important;
    width: 100%;
    font-size: 18px;
    font-family: Lexend;
    color: #FFFFFF;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 20px;
    background: #F5E6D3;
    border: 1px solid #111A1E;
}
.about-us-message::placeholder{
    color: #FFFFFF;
}
.message-icon {
    background: url(../images/menupage-1/message-icon.svg) no-repeat;
    background-position: 96% 20px;
}
textarea{
    resize: none;
}
.single-input-form-about-us{
    margin-top: 20px;
}
.single-input-form-about-us:first-child{
    margin-top: 0;
}
.about-us-txt1 {
    color: #931A2A;
    font-size: 60px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: 70px;
}
.about-us-txt2 {
    color:  #111A1E;
    font-size: 18px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    margin-top: 20px;
    line-height: 30px;
}
.about-us-form-bottom{
    margin-top: 40px;
}
.about-us-page-full{
    display: flex;
    column-gap: 30px;
}
.about-us-left,
.about-us-right{
    width: 50%;
}
.about-us-right-full {
    display: flex;
    align-items: center;
    position: relative;
    justify-content: right;
}
.send-message-btn {
    width: 238px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
    gap: 10px; /* Space between text and icon */

    background: #1f1f1f; /* Dark background */
    color: #EAB308;      /* Gold Text */
    border: 2px solid #EAB308;
    border-radius: 50px;
    
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.3s;
    overflow: hidden;
}

.send-message-btn .icon {
    transition: 0.3s;
    font-style: normal;
}

/* Hover: Fill background gold and fly the plane */
.send-message-btn:hover {
    background: #EAB308;
    color: #000;
}

.send-message-btn:hover .icon {
    transform: translateX(5px) translateY(-5px); /* Fly up and right */
}
.send-message-btn a {
    color: #F5E6D3;
    text-align: center;
    font-size: 18px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}
.about-first-img {
    left: 50px;
    position: absolute;
}
.map-section-about-us iframe{
    width: 100%;
    margin-bottom: -7px;
}

/************************ 28.ChefsPage1 CSS ***************************/
.chefs1-section-img {
    background-image: url(../images/chefspage2/chefs-bg-img.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 190px;
    padding-bottom: 100px;
}
.chefs-hero-txt1 {
    color: #FFF;
    text-align: center;
    font-size: 96px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.chefs1-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    background: rgb(11 19 21 / 40%);
}
.chefs1-content{
    position: relative;
}
.chefspage1-team-section-full{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 30px;
}

/************************ 29.ChefsPage2 CSS ***************************/
.chefs2-txt1 {
    color: #FFF;
    text-align: center;
    font-size: 24px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.chefs-social-media {
    width: 40px;
    height: 40px;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
}
.chefs-social-media:hover svg path {
    fill: #F5E6D3;
}
.chefs-social-media:hover{
    background: #111A1E;
}
.chefs-social-media-content {
    display: flex;
    column-gap: 10px;
    justify-content: center;
    align-items: center;
    margin-top: 36px;
}
.chefspage2-details img{
    border-radius: 185px;
}
.chefs1-social-media-overlay {
   background: rgb(11 19 21 / 80%);
   position: absolute;
   height: calc(100% - 70px);
   width: calc(100% - 70px);
   left: 50%;
   top: 50%;
   border-radius: 150px;
   right: 50%;
   transform: translate(-50% , -50%);
   opacity: 0;
   transition: all 0.4s ease-in-out 0s;
}
.chefspage2-details{
    position: relative;
    overflow: hidden;
}
.chefspage2-full {
    display: grid;
    grid-template-columns: repeat(3,3fr);
    gap: 30px;
}
.chefspage2-overlay-content  {
    position: absolute;
    width: 100%;
    bottom: 50%;
    left: 50%;
    opacity: 0;
    transform: translate(-50%, -50%);
    transition: all 0.4s ease-in-out 0s;
}
.fadeIn-top {
    top: 20%;
}
.fadeIn-right {
    left: 80%;
}
.chefspage2-details:hover .chefspage2-overlay-content{
    opacity: 1;
    top: 50%;
    left: 50%;
    transition: all 0.4s ease-in-out 0s;
}
.chefspage2-details:hover .chefs1-social-media-overlay{
    opacity: 1;
    transition: all 0.4s ease-in-out 0s;
}

/************************ 30.ChefsPage3 CSS ***************************/
.chefs3-txt1 {
    color: #111A1E;
    text-align: center;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.chefs3-social-media-overlay {
   background: #F5E6D3;
   position: absolute;
   height: calc(100% - 60px);
   width: calc(100% - 60px);
   left: 50%;
   top: 50%;
   border-radius: 150px;
   right: 50%;
   transform: translate(-50% , -50%);
   opacity: 0;
   -webkit-transition: all 0.4s ease-in-out 0s;
   -moz-transition: all 0.4s ease-in-out 0s;
   transition: all 0.4s ease-in-out 0s;
}
.chefspage2-details:hover .chefs3-social-media-overlay{
    opacity: 1;
}
.chefspage3-overlay-content  {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    opacity: 0;
    transform: translate(-50%, -50%);
    transition: all 0.3s ease-in-out 0s;
}
.chefspage2-details:hover .chefspage3-overlay-content{
    opacity: 1;
    top: 50%;
    left: 50%;
}
.chefs3-social-media-content {
    display: flex;
    column-gap: 10px;
    justify-content: center;
    align-items: center;
    margin-top: 100px;
}
.fadeIn-left {
    left: 20%;
}
.fadeIn-top {
    top: 20%;
}
.chefs3-social-media-overlay3{
    background: #F5E6D3;
    position: absolute;
    height: calc(100% - 70px);
    width: calc(100% - 70px);
    left: 50%;
    top: 50%;
    border-radius: 150px;
    right: 50%;
    transform: translate(-50% , -50%);
    opacity: 0;
    transition: all 0.4s ease-in-out 0s;
}
.chefspage2-details:hover .chefs3-social-media-overlay3{
    opacity: 1;
    transition: all 0.4s ease-in-out 0s;
}
.chefspage3-full {
    display: grid;
    grid-template-columns: repeat(3,3fr);
    gap: 30px;
}
.chefspage2-wrapper.chefspage2-wrapper1 {
    margin-top: 30px;
}
.chefspage3-none-sec {
    display: flex;
    justify-content: space-between;
    display: none;
}

/************************ 31.History CSS ***************************/
.historypage-section-img {
    background-image: url(../images/historypage/history-bg-img.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 190px;
    padding-bottom: 100px;
}
#historypage-section{
    overflow: hidden;
}
.historypage-overlay {
    position: absolute;
    background: rgb(11 19 21 / 40%);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.historypage-conten {
    position: relative;
}
.history-txt1 {
    color: #FFFFFF;
    text-align: center;
    font-size: 96px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.history-txt2 {
    color: #111A1E;
    font-size: 20px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-transform: uppercase;
}
.history-txt3 {
    color: #FFF;
    font-size: 60px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: 70px;
    margin-top: 20px;
}
.history-txt4 {
    color:  #111A1E;
    font-size: 18px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    margin-top: 40px;
}
.historypage-wrapper {
    display: flex;
    align-items: center; 
    column-gap: 30px;
}
.historypage-left,
.historypage-right{
    width: 50%;
}
.pl-70{
    padding-left: 70px;
}
.pr-70{
    padding-right: 70px;
}
.table-d-none {
    display: none;
}

/************************ 32.Single Chefs Details CSS ***************************/
.single-chefspage-section-img {
    background-image: url(../images/single-chefs-page/single-chefs-bg.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 190px;
    padding-bottom: 100px;
}
.single-chefspage-overlay {
    position: absolute;
    background: rgb(11 19 21 / 40%);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.single-chefspage-conten{
    position: relative;
}
.single-chefs-txt1 {
    color:  #111A1E;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.single-chefs-txt2 {
    color: #FFF;
    font-size: 40px;
    font-family: Elsie;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.single-chefs-txt3 {
    color:  #111A1E;
    font-size: 16px;
    font-family: Lexend;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.single-chefs-deatils{
    margin-top: 40px;
}
.single-chefs-page-social-icon {
    width: 36px;
    height: 36px;
    border-radius: 18px;
    background: rgb(153 169 173 / 20%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.single-chefs-page-social-icon a {
    height: 20px;
    display: flex;
}
.single-chefs-page-social-icon:hover{
    background: #111A1E;
}
.single-chefs-page-social-icon:hover svg path{
    fill: #F5E6D3;
}
.single-chefs-page-media-wrapper {
    display: flex;
    justify-content: center;
    column-gap: 15px;
    margin-top: 40px;
}
#single-chefspage-sec{
    overflow: hidden;
}
.single-chefspage-left {
    padding-left: 100px;
}
.mt-10{
    margin-top: 10px;
}
.singlepage-team-sec-mt{
    padding-bottom: 100px;
}
.progress-title {
 color: var(--3, #FFF);
 font-size: 16px;
 font-family: Lexend;
 font-style: normal;
 font-weight: 600;
 line-height: normal;
 float: left;
 margin-bottom: 20px;
}
.progress-value{
   color:#111A1E;
   text-align: center;
   font-size: 16px;
   font-family: Lexend;
   font-style: normal;
   font-weight: 600;
   line-height: normal;
   float: right;
}
.reveal.active .progress-value{
    animation: animate-counter 3.5s;
}
.skil-progressbar {
    height: 2px;
    background-color: #808080;
    margin-top: 20px;
    clear: both;
}
.skil-progressbar span{
    display: inline-block;
    position: absolute;
    height: 4px;
    background: #111A1E;
}
.reveal.active .skil-progressbar span{
    animation: animate-positive 3.5s;
}
.skills_top_sec {
    margin-bottom: 80px;
}
#skills_sec{
    padding-bottom: 100px;
}
.single-chefspage-bottom{
    margin-top: 40px;
}
.progresbar-counter{
    margin-top: 40px;
}

/************************ 33.Preloader CSS ***************************/
/* ============================= */
/* PRELOADER BASE                */
/* ============================= */

 body {
    margin: 0;
    font-family: Arial, sans-serif;
  }

  /* Preloader wrapper */
  #preloader {
    position: fixed;
    inset: 0;
    background: #fffaf0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
  }

  /* Fade out animation */
  #preloader.hide {
    opacity: 0;
    visibility: hidden;
    transition: 0.6s ease;
  }

.food-loader {
    text-align: center;
    color: #631919;
    font-family: 'Lexend', sans-serif;
}

/* ============================= */
/* PLATE                         */
/* ============================= */

.plate {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 6px solid #030303;
    position: relative;
    margin: 0 auto 20px;
    animation: plateSpin 3s linear infinite;
}

/* ============================= */
/* STEAM                         */
/* ============================= */

.steam {
    position: absolute;
    top: -30px;
    left: 50%;
    width: 8px;
    height: 40px;
    background: rgb(85, 22, 22);
    border-radius: 50%;
    filter: blur(2px);
    animation: steamRise 2s infinite ease-in-out;
}

.s1 { margin-left: -20px; animation-delay: 0s; }
.s2 { margin-left: 0; animation-delay: .3s; }
.s3 { margin-left: 20px; animation-delay: .6s; }

/* ============================= */
/* TEXT                          */
/* ============================= */

.food-loader p {
    font-size: 16px;
    letter-spacing: 1px;
    animation: textPulse 1.5s infinite;
}

/* ============================= */
/* ANIMATIONS                    */
/* ============================= */

@keyframes plateSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes steamRise {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translateY(-30px);
    }
}

@keyframes textPulse {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}

/* ============================= */
/* MOBILE SCALE                  */
/* ============================= */

@media (max-width: 768px) {
    .plate {
        width: 90px;
        height: 90px;
    }

    .food-loader p {
        font-size: 14px;
    }
}

/****************************** 34.Scroll Bottom to Top CSS ***********************/
.scroll-top {
    position: fixed;
    right: 25px;
    bottom: 25px;
    height: 50px;
    width: 50px;
    cursor: pointer; 
    border-radius: 50%;
    display: none;
    background: #111A1E;
    z-index: 9;
    animation: scroll_amini linear 2s infinite alternate;
    transition: all linear .3s;
}
.scroll-top::after {
    position: absolute;
    content: "\f106";
    font-family: 'FontAwesome';
    text-align: center;
    line-height: 46px;
    font-size: 24px;
    color: #F5E6D3;
    left: 0;
    top: 0;
    height: 50px;
    width: 50px;
    cursor: pointer;
}
.scroll-top.active {
 opacity: 1;
 -moz-opacity: 1;
 -webkit-opacity: 1;
 visibility: visible;
 -webkit-transform: translateY(0);
 -ms-transform: translateY(0);
 transform: translateY(0);
}
.scroll-top svg.border-circle path {
    stroke: #FD8558;
    stroke-width: 4;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    transition: all 200ms linear;
}
.scroll-top svg path {
    fill: none;
}
.scroll-top:hover {
   background: white;
   transition: 0.3s;
   -webkit-transition: 0.3s;
   -o-transition: 0.3s;
}

/************************ 35.Single Blogpage1 CSS ***************************/
.single-blogpage1-section-img {
    background-image: url(../images/single-blogpage1/single-blogpage-header.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 190px;
    padding-bottom: 100px;
}
.singleblog1-txt1 {
    color: #931A2A;
    font-family: Elsie;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.single-blogpage2-deatils{
    column-gap: 30px;
}
.singleblog1-txt2,
.singleblog1-txt3
{
    color:  #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.singleblog1-date{
    margin-top: 20px;
}
.singleblog1-txt2{
    margin-top: 20px;
}
.singleblog1-txt3{
    margin-top: 8px;
}
.singleblog1-txt4 {
    color: #931A2A;
    font-family: Elsie;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 36px;
}
.singleblog1-txt5 {
    color: #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.singleblog1-content2-sec {
    background: rgb(255 222 159 / 10%);
    padding: 40px;
    border-left: 4px solid #111A1E;
    margin-top: 40px;
}
.singleblog1-content3-sec{
    margin-top: 40px;
}
.singleblog1-content4-sec-full {
    display: flex;
    column-gap: 30px;
    margin-top: 40px;
}
.single-blogpage1-boder {
    border: 2px solid rgb(153 169 173 / 10%);
    margin-top: 40px;
}
.blog-tags {
    color: #111A1E;
    font-family: Lexend;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.blog-tags a{
    color: #111A1E;
    font-weight: 400;
}
.single-blogpage1-social-icon{
    display: flex;
    align-items: center;
    column-gap: 10px;
}
.singleblog1-content5-sec-full {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}
.single-blogpage1-txt1 {
    color: #111A1E;
    font-family: Lexend;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-transform: uppercase;
}
.singleblogpage1-txt2 {
    color:#931A2A;
    font-family: Elsie;
    font-size: 60px;
    font-style: normal;
    font-weight: 400;
    line-height: 70px;
    margin-top: 20px;
}
.singleblogpage1-txt3 {
    color: #931A2A;
    font-family: Elsie;
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.singleblog1-date1{
    margin-top: 20px;
}
.recommendations-section-full{
    display: flex;
    column-gap: 30px;
    margin-top: 40px;
}
.recommendations-section{
    margin-top: 100px;
}
.comment-txt1 {
    color: #931A2A;
    font-family: Elsie;
    font-size: 60px;
    font-style: normal;
    font-weight: 400;
    line-height: 70px;
}
.singleblogpage1-img-sec:hover img ,
.singleblog-img-sec:hover img,
.singleblog4-img-sec:hover img,
.blogpage5-left-img:hover img,
.singleblog5-img-sec:hover img{
    opacity: 1;
    -webkit-animation: flash 1.5s;
    animation: flash 1.5s;
}
.singleblogpage1-related-left:hover .singleblogpage1-txt3,
.singleblogpage1-related-right:hover .singleblogpage1-txt3 {
  color: #111A1E;
}
.comment-title {
    color: #FFF;
    font-family: Elsie;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.content p {
    color: #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 18px;
}
.comment-date span {
    color:  #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    display: inline-block;
    vertical-align: middle;
}
.date-dash {
    padding: 0 10px;
}
.reply-btn {
    background-color: transparent;
    border: none;
    font-weight: 400;
    font-size: 16px;
    padding: 0;
    line-height: 16px;
    color: #111A1E;
}
.reply-btn:hover{
    color: #FFF;
}
.reply-btn:hover svg path{
    fill: white;
}
.comment-date{
    margin-top: 20px;
}
.comment-reply {
    margin-left: 130px;
}
.comment {
    border-top: 2px solid rgb(153 169 173 / 40%);
    padding: 20px 0;
    column-gap: 30px;
}
.comment:last-child {
    padding-bottom: 0;
}
.comment:first-child {
    padding-top: 0;
    border-top: 0;
}
.comment-area{
    margin-top: 100px;
}
.comment-top{
    margin-top: 40px;
}
.comment-form h2 {
    color: #931A2A;
    font-family: Elsie;
    font-size: 60px;
    font-style: normal;
    font-weight: 400;
    line-height: 70px;
}
.comment-form span{
    color: #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
    display: inline-block;
}
.comment-form-control {
    border: none;
    padding: 0;
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
    background: transparent;
    color:  #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-left: 15px;
}
.comment-icon {
    padding: 0 0 18px 0;
    display: flex;
    margin-bottom: 30px;
    border-bottom: 2px solid rgb(153 169 173 / 40%);
}
.comment-form-control:focus-visible{
    outline-width: 0 !important;
    border: 0 !important;
}
.comment-form-control.checkbox {
    width: 24px;
    height: 24px;
    border: 2px solid #616F7D;
    background-color: #fff;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    box-shadow: inset 0 0 0 2px #616f7d;
    color: #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.book-btn {
    font-weight: 500;
    font-size: 20px;
    line-height: 20px;
    color: #ffffff;
    border: none !important;
    background-color: #111A1E;
    position: relative;
    overflow: hidden;
    z-index: 9;
    transition: all 0.3s ease-in-out;
    width: 194px;
    height: 64px;
    margin-top: 60px;
    border: 1px solid transparent !important;
}
.leave-comment-sec{
    margin-top: 100px;
}
.leave-comment{
    margin-top: 40px;
}
.blog-tags a:hover{
    color: #111A1E;
}
.single-blogpage2-txt1 {
    color:#111A1E;
    text-align: center;
    font-family: Elsie;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.single-blogpage2-quote {
    background-image: url(../images/single-blogpage1/Shape.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 138px;
    padding-bottom: 138px;
}
.single-blogpage2-txt2 {
    color:#FFF;
    text-align: center;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 20px;
}
.single-blogpage2-quote:after{
    content: url(../images/single-blogpage1/quote-icon.svg);
    position: absolute;
    left: 50%;
    top: 50px;
    right: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.single-blogpage2-quote{
    position: relative;
}
.single-blogpage2-quote:before{
   content: url(../images/single-blogpage1/quote-icon.svg);
   position: absolute;
   left: 50%;
   right: 50%;
   bottom: 50px;
   display: flex;
   align-items: center;
   justify-content: center;
}
.single-blogpage3-link {
    background-image: url(../images/single-blogpage1/Shape2.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 40px;
    padding-bottom: 60px;
    padding-left: 40px;
    padding-right: 40px;
}
.single-blog3-link-img {
    display: flex;
    align-items: center;
    justify-content: center;
}
.single-blogpage3-txt1 {
    color: #FFF;
    text-align: center;
    font-family: Elsie;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 60px;
}
.single-blogpage4-slider-full .slick-custom-arrow {
    position: absolute;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    z-index: 98;
    width: 60px;
    height: 60px;
    background: rgb(11 19 21 / 40%);
    border-radius: 30px;
    cursor: pointer;
    color: #000;
}
.single-blogpage4-slider-full .slick-custom-arrow-left {
    left: 20px;
    top: 50%;
}
.single-blogpage4-slider-full .slick-custom-arrow-right {
    right: 20px;
    top: 50%;
}
.single-blogpage4-slider-full .slick-custom-arrow-right:hover,
.single-blogpage4-slider-full .slick-custom-arrow-left:hover {
    background: #F5E6D3;
}
.single-blogpage4-slider-full i.fas.fa-angle-left,
.single-blogpage4-slider-full i.fas.fa-angle-right{
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #111A1E;
}
.single-blogpage5-slider{
    position: relative;
}
.video_sec_play-singleblog5 {
    width: 60px;
    height: 60px;
    border-radius: 30px;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
}
.video_button-singleblog5 {
    width: 80px;
    height: 80px;
    background: rgb(255 255 255 / 60%);
    border-radius: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.5s;
}
.single-blogpage5-slider:hover .video_button-singleblog5{
 animation: scrolltop 2s infinite;
 transition: 0.5s;
}
.single-blogpage5-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/************************ 36.Single Shop CSS ***************************/
.single-shop-section-img {
    background-image: url(../images/single-shop/header-img.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 100px;
    padding-bottom: 100px;
}
.single-shop-deatils-sec-full {
    display: flex;
    column-gap: 30px;
}
.single-shop-left {
    width: 50%;
}
.single-shop-right {
    width: 50%;
}
.single-shop-txt1 {
    color: #931A2A;
    font-family: Elsie;
    font-size: 60px;
    font-style: normal;
    font-weight: 400;
    line-height: 70px;
}
.single-shop-txt2 {
    color:  #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.single-shop-txt3 {
    color: #FFF;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.single-shop-txt5 {
    color:  #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.single-shop-txt6 {
    color: #111A1E;
    font-family: Elsie;
    font-size: 60px;
    font-style: normal;
    font-weight: 900;
    line-height: 70px;
}
.single-shop-content4{
    margin-top: 40px;
}
.single-shop-txt7 {
    color:  #111A1E;
    font-family: Lexend;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    margin-top: 40px;
}
.single-shop-deatils {
    display: flex;
    column-gap: 60px;
    margin-top: 20px;
}
.single-shop-content3 {
    display: flex;
    align-items: center;
}
.va_quality{
    margin-top: 40px;
    display: flex;
    align-items: center;
}
.va_quality form span{
    height: 60px;
    width: 40px;
    text-align: center;
    line-height: 60px;
    font-size: 20px;
    margin: 0;
    border: 1px solid #616F7D;
    color: #616F7D;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; 
}
.va_quality form input {
    margin: 0 -5px;
    height: 60px;
    width: 60px;
    display: inline-block;
    vertical-align: middle;
    border-top: 1px solid #616F7D;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid #616F7D;
    padding: 0 0;
    background: none;
    color: var(--3, #FFF);
    text-align: center;
    font-family: Lexend;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.add-cart-bnt {
    margin-left: 40px;
    display: inline-block;
    background-color: #111A1E;
    width: 167px;
    height: 64px;
    color:#F5E6D3;
    text-align: center;
    font-family: Lexend;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.add-cart-bnt:hover{
    color:#F5E6D3;
}
.va_quality span {
    color: #FFF;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-right: 10px;
}
.slider-bottom {
    margin-top: 30px;
}
.single-shop-txt8 {
    color: #FFF;
    font-family: Elsie;
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 40px;
}
.single-shop-content5{
    margin-top: 40px;
    border-top: 1px solid rgb(153 169 173 / 40%);
}
.slider_details_sec img {
    width: 100%;
}
.single-shop-content5 ul{
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.single-shop-content5 ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgb(153 169 173 / 40%);
    padding: 20px 0;
}
a.single-shop-txt8:hover{
    color: #111A1E;
}
.slider_details_sec1 img{
    width: 100%;
}
.single-shop-heading {
    color: #FFF;
    text-align: center;
    font-family: Elsie;
    font-size: 60px;
    font-style: normal;
    font-weight: 400;
    line-height: 70px;
}
.single-shop-name {
    color: #FFF;
    font-family: Elsie;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.single-shop-price {
    color: #111A1E;
    text-align: right;
    font-family: Lexend;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
}
.single-shop-para {
    color:  #111A1E;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 20px;
}
.single-shop-bottom-full{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 60px;
}
.single-shop-content-bottom-full {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
}
.singleshop-deatils-section-mt{
    padding-bottom: 100px;
}
.case-one_overlay {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    transition: -webkit-transform 0.4s ease;
    -webkit-transition: -webkit-transform 0.4s ease;
    -o-transition: transform 0.4s ease;
    transition: transform 0.4s ease;
    transition: transform 0.4s ease, -webkit-transform 0.4s ease;
    transition: transform 0.4s ease,-webkit-transform 0.4s ease;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
}
.case-one_overlay:before {
    position: absolute;
    content: '';
    left: 0px;
    top: 0px;
    z-index: 1;
    right: 0px;
    bottom: 0px;
    opacity: 0.80;
    background-color: rgb(21 21 21 / 30%);
}
.single-shop-bottom-img:hover .case-one_overlay {
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
}
.single-shop-bottom-img{
    position: relative;
}
.single-shop-bottom-content:hover .single-shop-name{
    color: #111A1E;
}

/************************ 37.SearchPopup CSS ***************************/
.search-popup {
  position: fixed;
  left: 0;
  top: 0;
  height: 100vh;
  width: 100%;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  transition: all 500ms ease;
  overflow: hidden;
  transform: scale(0.95);
}
.search-popup .search-back-drop {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-color:#171717;
  opacity: 0.95;
}
.search-popup .close-search {
  position: absolute;
  top: 30px;
  right: 30px;
  font-size: 26px;
  color: #111A1E;
  z-index: 3;
  border-radius: 50%;
  background-color: transparent;
  transition: all 500ms ease;
  border: 0;
  padding: 0;
  width: 50px;
  height: 50px;
  border: 2px solid transparent;
}
.close-search:hover{
    width: 50px;
    height: 50px;
    border-radius: 25px;
    border: 2px solid #111A1E;
}
.search-popup .search-inner {
  position: relative;
  display: block;
  top: 40%;
  height: auto;
  z-index: 1;
  width: calc(100% - 60px);
  max-width: 800px;
  margin: auto;
  opacity: 0;
  transform: translateY(-50px);
  transition: all 300ms ease;
}
.search-popup .form-group {
  position: relative;
  display: flex;
  align-items: center;
}
.search-popup .form-group input[type=search]{
  position: relative;
  display: block;
  line-height: 20px;
  font-size: 16px;
  width: 100%;
  height: 50px;
  border: 1px solid #e1e6dc;
  padding: 15px 20px;
  color: black;
  background: #ffffff;
  border-radius: 5px;
  transition: all 500ms ease;
  font-family: Lexend;
}
.search-popup .form-group input[type=search]:focus-visible{
    outline-width: 0 !important;
}
.search-popup .form-group button {
  position: absolute;
  right: 5px;
  top: 5px;
  height: 40px;
  width: 40px;
  display: block;
  font-size: 14px;
  color: #000;
  line-height: 40px;
  border-radius: 5px;
  font-weight: normal;
  background:#111A1E;
  transition: all 500ms ease;
  border: 0;
}
.search-popup input::placeholder {
 color: #000;
}
.search-popup.active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  border-radius: 0%;
}
.search-popup .search-inner.active {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 500ms;
}
.search-popup.active .search-inner{
    opacity: 1;
}

/************************ 38.About Us CSS ***************************/
.about-us-img {
    background-image: url(../images/about-us/header-img.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 100px;
    padding-bottom: 100px;
}
#about-us-feature-sec {
    background-image: url(../images/Homepage2/services-1.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    max-width: 100%;
    width: 100%;
    position: relative;
    padding-bottom: 272px;
    padding-top: 100px;
}
#about-us-page-counter-sec {
    margin-top: -172px;
}

/************************ 39.Reservation1 CSS ***************************/
.reservation1-section-img {
    background-image: url(../images/reservation/header-img.png);
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    padding-top: 100px;
    padding-bottom: 100px;
}
.res-txt1 {
    color: #931A2A;
    font-family: Elsie;
    font-size: 96px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.res-txt2 {
    color: #000000;
    font-family: Lexend;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    margin-top: 20px;
}
.reservation1-sec-deatils-full {
    display: flex;
    align-items: center;
    column-gap: 30px;
}
.reservarion1-fast-ordering-sec {
    padding-bottom: 100px;
}
.reservation1-left,
.reservation1-right{
    width: 50%;
}
.reservation2-right {
    margin-left: auto;
}
.reservation2-right-content{
 background-image: url(../images/reservation/table-img.png);
 position: relative;
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center;
 max-width: 100%;
}
.mt-form {
    margin-top: 60px;
}

/************************ 40.Mobile Menu CSS ***************************/
.homepage-menu-mobile {
    min-width: 100%;
    display: none !important;
    padding: 20px !important;
}
li.widget_media_image.mobile-widget {
    width: 100%;
    margin-left: 0;
    margin-top: 15px;
}
li.widget_media_image.mobile-widget:first-child{
    margin-top: 0 !important;
}
.nav-item:hover .homepage-menu-mobile{
    display: block !important;
}
ul.mobile-content {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
li.nav-item.dropdown.mobile-dropdown{
    display: block !important;
    padding: 15px !important;
}
.mobile-offcanvas{
    padding: 0 15px;
}
ul.has-sub-menu.mobile {
    position: inherit !important;
    left: 0 !important;
}
.mobile-dropdown .dropdown-toggle::after{
    color: #ffffff;
    margin: 0 0 0 10px;
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 700;
    font-size: 24px;
    content: "\f107" !important;
    border: none !important;
    vertical-align: middle;
    position: absolute;
    right: 0;
    vertical-align: middle;
    top: 15px;
}
a.nav-link.mobile-link {
    color:#FFF;
    font-family: Lexend;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
a.nav-link.mobile-link:hover{
    color: #111A1E;
}
.mobile-canvas{
    background: black !important;
}
a.dropdown-item.dropdown-item-mobile {
    background: #931A2A;
    color: rgb(255, 255, 255);
    transition: 0.5s;
}
a.dropdown-item.dropdown-item-mobile:hover {
    padding-left: 20px;
    transition: 0.5s;
}
i.fa-regular.fa-xmark {
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 700;
}
.mobile-close-btn {
    background: black;
    border: navajowhite;
    color: #ffffff;
    font-size: 24px;
    width: 50px;
    height: 50px;
    transition: 0.5s;
    border: 1px solid transparent;
    border-radius: 25px; 
}
.mobile-close-btn:hover{
    border-radius: 25px;
    border: 1px solid white;
    transition: 0.5s;
}
.mobile-header{
    justify-content: end !important;
    border-bottom: 1px solid rgb(153 169 173 / 22%);
}
img.mobile-logo {
    display: flex;
    margin-left: auto;
    margin-right: auto;
}
.mobile-menu-responsive {
    margin-top: 20px;
}
.homepage-video-modal .btn-close{
    color: #000;
    text-decoration: none;
    width: 20px !important;
    height: 20px !important;
    border-radius: 10px !important;
    border: 1px solid transparent;
    opacity: 1;
    transition: 0.5s; 
}
.homepage-video-modal .btn-close:hover {
    color: #000;
    text-decoration: none;
    border: 1px solid black;
    opacity: 1;
    transition: 0.5s; 
}
.mobile-menu-icon {
    display: none;
}
.slider_details_sec1.slick-slide {
    margin: 0 15px;
}
.slider-bottom .slick-list{
    margin: 0 -15px;
}
.gallery-slide:hover .home3-gallery-content {
    opacity: 1;
    transform: translate(-50% , -50%);
}
ul.sub-menu-toggle .dropdown-toggle::after {    
    color: #1D1A25;
}
.mobile-menu-offcanvas ul.sub-menu li a{
    padding-right: 10px;
    padding-left: 10px;
    white-space: break-spaces;
}
.menu li a.main-menu-link:hover, .menu li:hover a.main-menu-link{
    background: transparent;
    color: #FEA02F;
}
.dropdown-toggle .sub-menu ul li a{
    padding: 10px 0;
}
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #head-mobile {
    border: 0;
    list-style: none;
    line-height: 1;
    display: block;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
#cssmenu #head-mobile {
    display: none;
}
#cssmenu {
    padding-top: 80px;
    padding-left: 25px;
    padding-right: 25px;
}
#cssmenu > ul > li > a {
    padding: 15px 0;  
    text-decoration: none;  
    width: 100%;
    border-bottom: 0;
    display: block;
    color: #fff;
    font-family: Lexend;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
#cssmenu > ul > li > a.booking-link {
    color: #FFDE9F;   /* your booking text color */
    font-weight: 600;
        background: #F5E6D3;
    color: #000000;
    border-radius: 25px;
    margin: 10px 20px;
    font-weight: 600;
	text-align: center;

}

#cssmenu > ul > li:hover > a,
#cssmenu ul li.active a {
    color: #931A2A;
}
#cssmenu > ul > li.has-sub:hover > a:before {
    top: 23px;
    height: 0;
}
ul.open-detail-menu li a.active{
    color: #FEA02F !important;
}
ul.sub-back-wrap li{
    background-color: #ffffff;
}
#cssmenu li:hover > ul {
    left: auto;
}
#cssmenu ul ul li a {
    border: 1px solid #931A2A;
    padding: 11px 15px;
    text-decoration: none;
    color: white;
    font-family: Lexend;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
#cssmenu ul ul ul li.active a {
    border-left: 1px solid #333;
}
#cssmenu > ul > li.has-sub > ul > li.active > a,
#cssmenu > ul ul > li.has-sub > ul > li.active > a {
    border-top: 1px solid #333;
}
ul.open-detail-menu{
    display: block !important;
}
.arrow-right-angle, .long-arrow-right-angle {
    transform: rotate(135deg);
}
.mobile-homepage-menu{
    display:none;
}

/************************ 41.Cart CSS ***************************/
.cart-view {
    display: flex;
    justify-content: center;
}
.minus-class,
.add-class {
    width: 40px;
    height: 60px;
    border: 1px solid #616F7D;
    display: flex;
    align-items: center;
    justify-content: center;
}
.qty.input-class {
    width: 50px;
    text-align: center;
    border: 1px solid #616F7D;
    background: transparent !important;
    color:#FFF;
    text-align: center;
    font-family: Lexend;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}
.qty.input-class:focus-visible{
    outline-width: 0;
}
i.fa-regular.fa-xmark.close-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    color: white;
}
i.fa-regular.fa-xmark.close-btn:hover{
    color: #111A1E;
}
.cart-view-table{
    width: 100%;
    border: 1px solid  #111A1E;
    border-collapse: collapse;
    background: rgb(153 169 173 / 10%);
}
.cart-view-table-name th{
    background: #F5E6D3;
    color: white;
    padding: 10px;
    border-right: 1px solid  #111A1E;
    text-align: center;
    border-bottom: 1px solid  #111A1E;
}
.cart-view-table-details td{
    text-align: center;
    border-right: 1px solid  #111A1E;
    padding: 10px;
}
.prod-name-cart-view {
    color:#FFF;
    text-align: center;
    font-family: Elsie;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.prod-name-cart-view:hover{
    color: #111A1E;
}
tr.cart-view-table-details{
 border-right: 1px solid  #111A1E; 
 border-bottom: 1px solid  #111A1E;
}
.chek-txt1 {
    color:#FFF;
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    border-bottom: 1px solid #111A1E;
    padding-bottom: 5px;
    text-transform: capitalize;
}
.chek-txt2,
.chek-txt3,
.chek-txt4 {
    color: var(--3, #FFF);
    font-family: Lexend;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px;
    margin-bottom: 15px;
    text-transform: capitalize;
}
.total-txt {
    font-weight: 500;
    color: white;
    font-size: 18px;
    display: flex;
    font-family: Lexend;
    justify-content: space-between;
    border-top: 1px solid #111A1E;
    padding-top: 10px;
    text-transform: capitalize;
}
.checkout-sec-full {
    display: flex;
    column-gap: 30px;
}
.checkout-sec-left,
.checkout-sec-right{
    width: 50%;
}
.checkout-sec-right {
   background: rgb(153 169 173 / 10%);
   padding: 40px;
}
form.checkout-form button {
    padding: 5px 20px 6px 20px;
    background: #111A1E;
    border-radius: 30px;
    text-transform: capitalize;
    font-weight: 400;
    color: #F5E6D3;
    font-size: 15px;
    font-family: Lexend;
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
}
form.checkout-form button:focus-visible{
    outline-width: 0;
}
form.checkout-form button{
    border: 0 !important;
}
form.checkout-form input {
    border: 1px solid #111A1E;
    background: transparent;
    width: 100%;
    padding: 12px 20px;
    font-weight: 400;
    color: #000;
    font-size: 16px;
    font-family: Lexend;
}
.checkout-btn:hover{
    border: 1px solid transparent;
    background: transparent;
}
.checkout-btn:hover a{
   color: white;
}
form.checkout-form {
    position: relative;
    margin-top: 20px;
}
form.checkout-form input:focus-visible{
    outline-offset: 0 !important;
    outline-width: 0;
}
.checkout-btn {
    padding: 12px 20px;
    background: #111A1E;
    text-align: center;
    margin-top: 20px;
    text-transform: capitalize;
    border: 1px solid transparent;
}
.checkout-btn a{
    color: #F5E6D3;
    font-size: 18px;
    font-family: Lexend;
    font-weight: 500;
}
form.checkout-form input::placeholder{
    color: white;
}
.checkout-sec-left img {
    height: -webkit-fill-available;
}
td img{
    width: 100%;
}

/************************ 42.Checkout CSS ***************************/
.Checkout-section-full {
    display: flex;
    column-gap: 30px;
}
.Checkoutpage-left,
.Checkoutpage-right{
    width: 50%;
}
.checkout-sec-full.checkout-sec-full1 {
    display: block;
}
.checkout-sec-left.checkout-sec-left1,
.checkout-sec-right.checkout-sec-right1{
    width: 100%;
}
.checkout-descrip {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 30px;
    width: 100%;
    margin-top: 30px;
}
input.custom-form-control::placeholder,
textarea.custom-form-control::placeholder {
    color: white;
}
input.custom-form-control {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid  #111A1E;
    background: #fff;
    font-size: 16px;
    line-height: 18px;
    color: white;
    font-weight: 400;
    font-family: Lexend;
}
input.custom-form-control:focus-visible{
    outline-width: 0;
}
.bill-txt h3 {
    color: #FFF;
    font-family: Elsie;
    font-size: 40px;
    font-style: normal;
    font-weight: 400;
    line-height: 50px;
}
textarea.custom-form-control {
    background: transparent;
    font-size: 16px;
    line-height: 18px;
    color: white;
    font-weight: 400;
    margin-top: 30px;
    padding: 10px 12px;
    font-family: Lexend;
}
.payment-method-type {
    margin-top: 30px;
}
.custom-radio label {
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    padding-left: 30px;
    cursor: pointer;
    color: white;
    position: relative;
    display: block;
    transition: all 0.25s linear;
    z-index: 9;
}
.custom-radio .lu-check {
    display: block;
    position: absolute;
    border-radius: 100%!important;
    height: 21px;
    width: 21px;
    top: 0;
    left: 0;
    z-index: 5;
    border: 2px solid #616F7D!important;
}
.custom-radio input[type=radio]:checked ~ .lu-check {
    border-color: #111A1E!important;
}
.custom-radio input[type=radio] {
  position: absolute;
  visibility: hidden;
}
.custom-radio .lu-check::before {
  display: block;
  position: absolute;
  content: '';
  border-radius: 100%!important;
  height: 13px;
  width: 13px;
  top: 2px;
  left: 2px;
  margin: auto;
  -webkit-transition: all 0.25s linear;
}
.custom-radio input[type=radio]:checked ~ .lu-check::before {
  background: #111A1E;
}
.custom-radio .lu-check {
  display: block;
  position: absolute;
  border-radius: 100%!important;
  height: 21px;
  width: 21px;
  top: 0;
  left: 0;
  z-index: 5;
  -webkit-transition: all 0.25s linear;
  border: 2px solid #111A1E!important;
}
.payment-type{
    margin-top: 30px;
}
.input-group.custom-radio {
    margin-bottom: 20px;
}
.place-order-btn a {
    width: 165px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-family: Lexend;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    background: #111A1E;
    color: #F5E6D3;
    border: 1px solid transparent;
}
.place-order-btn a:hover{
    border: 1px solid #111A1E;
    color:#111A1E ;
    background: transparent;
}
.star-animation{
    animation: mover 1s infinite alternate;
}
.cup {
    animation: cup-rotate 2s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
    transform-origin: top left;
    transform-box: fill-box;
}

/************************ 43.Animation CSS ***************************/
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes scroll {
  0% {
    transform: translateX(0);
}
100% {
    transform: translateX(calc(-100% - 80px));
}
}
@keyframes fixedheader {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}
@keyframes scrolltop {
    0% {
        box-shadow: 0 0 0 0px rgb(255 222 159 / 30%);
    }
    100% {
        box-shadow: 0 0 0 15px rgb(255 222 159 / 30%);
    }
}
@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}
@keyframes swing {
    0% { transform: rotate(3deg); }
    100% { transform: rotate(-3deg); }
}

@keyframes animate-counter{
    0%{ 
        left: 0;
    }
}
@keyframes animate-positive{
    0%{ width: 0; }
}

@keyframes draw {
  100% {
    stroke-dasharray: 329;
    stroke-dashoffset: 658;
}
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
}
100% {
    transform: rotate(360deg);
}
}
@keyframes flash {
    0% {
        opacity: .4;
    }
    100% {
        opacity: 1;
    }
}
@keyframes cup-rotate {
  50% {
    transform: rotate(-5deg)
}
}
@keyframes floating {
    from { transform: translate(0,  0px); }
    65%  { transform: translate(0, 15px); }
    to   { transform: translate(0, -0px); }    
}
.floating {  
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

@keyframes scroll_amini {
    from {
        bottom: 30px;
    }

    to {
        bottom: 50px;
    }
}
.line::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  top: 0;
  left: 0;
  background: rgb(217 217 217 / 10%);
  z-index: -1;
}
.line::after {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  left: 25%;
  top: 0;
  background: rgb(217 217 217 / 10%);
  z-index: -2;
}
.line-3 {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  left: 50%;
  top: 0;
  background: rgb(217 217 217 / 10%);
  z-index: -1;
}
.line-4 {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  left: 75%;
  top: 0;
  background: rgb(217 217 217 / 10%);
  z-index: -1;
}
.line-5 {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  left: 100%;
  top: 0;
  background: rgb(217 217 217 / 10%);
  z-index: -1;
}
.line{
    position: relative;
    margin: 0 auto;
}
.singleblogpage1-related-left, .singleblogpage1-related-right {
    width: calc(50% - 15px);
}
.reservation-sec-full{
    position: relative;
}
.custom-lines-bg {
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
}
.custom-lines-bg .line {
    height: 100%;
}
#home2-our-restaurant-section .container,
#home2-services-sec .container,
#home2-video-sec .container,
#home2-counter-sec .container,
#home2-blog-sec .container
{
    position: relative;
    z-index: 9;
}
.chefs-secrets-section .container{
    position: relative;
    z-index: 9;
}
#home2-hero-section .container {
    z-index: 9;
    position: relative;
}
.line{
    position: relative;
}
.line ,
.custom-line-bg .container {
    height: 100%;
}
#home2-testimonials-sec .container {
    position: relative;
    z-index: 9;
}
.line-n{
    position: relative;
}
.line-n::before {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    top: 0;
    left: 0px;
     background: rgb(217 217 217 / 10%); 
    z-index: 1;
}
.line-n::after {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    left: 25%;
    top: 0;
     background: rgb(217 217 217 / 10%); 
    z-index: 1;
}
.line-3-n {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    left: 50%;
    top: 0;
     background: rgb(217 217 217 / 10%); 
    z-index: 1;
}
.line-4-n {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    left: 75%;
    top: 0;
     background: rgb(217 217 217 / 10%); 
    z-index: 1;
}
.line-5-n {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    left: 100%;
    top: 0;
     background: rgb(217 217 217 / 10%); 
    z-index: 1;
}
.custom-line-bg-n {
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}
.line-n,
.custom-line-bg-n .container {
    height: 100%;
}
.home2-line .gallery-home2-top{
    position: relative;
    z-index: 9;
}
.home2-line .homepage2-gallery{
    position: relative;
    z-index: 9;
}
.home2-line .fast-ordering-home2 .container{
    position: relative;
    z-index: 9;
}
.home2-line #chefs-secrets-section .container{
    position: relative;
    z-index: 9;
}
/* ================= TOP DARK BAR ================= */
/* ================= TOP HEADER ================= */
.top-header {
    width: 100%;
    background: #931A2A;
    padding: 6px 0;
}

/* White text + icons */
.top-header-inner,
.top-header-inner a,
.top-header-inner i {
    color: #ffffff !important;
}

/* Hover turns black */
.top-header-inner a:hover,
.top-header-inner i:hover {
    color: #000000 !important;
}

/* Flex alignment stays same */
.top-header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 5%;
}


.welcome-text {
    color: #ffffff !important;
    font-size: 15px;
    font-weight: 500;
}


.social-icons a {
    color: #111A1E;
    margin-left: 15px;
    font-size: 16px;
    transition: .3s;
}

.social-icons a:hover {
    color: #ffffff;
    transform: scale(1.15);
}

/* ================= CONTACT STRIP ================= */
.contact-strip {
    width: 100%;
    background: #ffffff;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding: 15px 10px;
    align-items: center;
    border-bottom: 3px solid #d4a33a;
}

.strip-logo {
    display: flex;
    align-items: center;
    justify-content: center;
}


.top-header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 30px;
    background: #fff;
    width: 100%;
    box-sizing: border-box; /* Ensures padding doesn't break width */
}

/* Container for everything on the right side (Info + Buttons) */
.header-right-side {
    display: flex;
    align-items: center;
    gap: 250px; /* Space between the Contact Info group and the Buttons */
}

/* ========================================= */
/* RED BOX FIX: TIGHTER CONTACT SPACING     */
/* ========================================= */

.contact-group {
    display: flex;
    align-items: center;
    gap: 85px; /* CONTROL THIS VALUE: Reduces the gap between phone/mail/location */
}

/* Existing styles you provided (kept for consistency) */
.contact-item {
    display: flex;
    align-items: center;
    gap: 8px;
}
.contact-icon {
    font-size: 20px; /* Adjusted slightly for balance */
    color: #d4a33a;
}
.contact-title {
    margin: 0;
    font-size: 14px; /* Adjusted for better fit */
    font-weight: 700;
    color: #000;
    line-height: 1.2;
}
.contact-text {
    margin: 0;
    font-size: 13px;
    color: #666;
    line-height: 1.2;
}

/* ========================================= */
/* GREEN BOX SOLUTION: BUTTON STYLES        */
/* ========================================= */

.auth-actions {
    display: flex;
    gap: 10px; /* Space between Login and Sign Up */
}

.btn-auth {
    text-decoration: none;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 5px; /* Rounded corners */
    transition: all 0.3s ease;
    white-space: nowrap; /* Prevents text from wrapping */
}

/* Login Button: Outline Style */
.btn-login {
    border: 2px solid #931A2A; /* Theme Red Border */
    color: #931A2A;
    background: transparent;
}
/* ========================================= */
/* MOBILE LOGIN / SIGNUP TEXT STYLING        */
/* ========================================= */

/* Container for the text links */
.mobile-auth-text {
    text-align: center;
    padding: 15px 0;
    margin-top: 10px;
    border-top: 1px solid #eee; /* Optional divider line above */
    list-style: none;
    font-family: 'Lexend', sans-serif;
    font-size: 16px;
    font-weight: 600;
}

/* The Links (Login, Sign Up) */
.mobile-auth-text a {
    color: #931A2A; /* Your Brand Red */
    text-decoration: none;
    transition: color 0.3s;
    display: inline-block; /* Ensures they sit on the same line */
}

.mobile-auth-text a:hover {
    color: #7a1522; /* Darker red on touch/hover */
}

/* The Slash Separator ( / ) */
.auth-slash {
    color: #333; /* Dark Grey or Black for contrast */
    margin: 0 8px; /* Space between the slash and words */
    font-weight: 400;
}
/* ========================================= */
/* MOBILE SPECIFIC COLORS                    */
/* ========================================= */

@media screen and (max-width: 768px) {
    
    .btn-login {
        /* Change these values to whatever color you prefer */
        background-color: #931A2A;  /* Makes it Solid Red on mobile */
        color: #ffffff;             /* Makes text White */
        border: 2px solid #931A2A;  /* Keeps the border matching */
    }

    /* Optional: Hover effect for mobile (when tapped) */
    .btn-login:hover {
        background-color: #7a1522;
        border-color: #7a1522;
    }
}
.btn-login:hover {
    background-color: #931A2A;
    color: #fff;
}

/* Sign Up Button: Solid Style */
.btn-signup {
    background-color: #931A2A; /* Theme Red Background */
    color: #fff;
    border: 2px solid #931A2A;
}

.btn-signup:hover {
    background-color: #7a1522; /* Darker red on hover */
    border-color: #7a1522;
}

/* ========================================= */
/* RESPONSIVENESS                           */
/* ========================================= */

/* Tablet adjustment: Hide contact info text or reduce padding if crowded */
@media (max-width: 1100px) {
    .contact-text { display: none; } /* Show only titles to save space */
    .contact-group { gap: 15px; }
}

/* Standard Mobile Hiding (Matches your existing code) */
@media (max-width: 768px) {
    .top-header-container {
        display: none !important; 
    }
}

/* ================= RESPONSIVE ================= */

/* Tablet (no change) */
@media(max-width: 992px) {
    .contact-strip {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 15px;
    }
}

/* MOBILE — HIDE BOTH TOP HEADER & CONTACT STRIP */
@media(max-width: 600px) {

    /* Hide entire top header */
    .top-header {
        display: none !important;
    }

    /* Hide entire contact strip */
    .contact-strip {
        display: none !important;
    }
}

/* HERO SECTION WRAPPER */
#hero-slider {
    width: 100%;
    height: 85vh;
    position: relative;
    overflow: hidden;
    background:#F5E6D3;
}

/* SLIDER CONTAINER */
.hero-slider-container {
    height: 100%;
    position: relative;
}

/* EACH SLIDE */
.hero-slide {
    position:absolute;
    top:0; left:0;
    width:100%; height:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:40px 8%;
    opacity:0;
    transform:translateX(40px);
    transition:opacity 1s ease, transform 1s ease;
}

.hero-slide.active {
    opacity:1;
    transform:translateX(0);
}

/* LEFT CONTENT */
.hero-content {
    width:50%;
    color:#111A1E;
}

.hero-title {
    font-size:55px;
    font-weight:700;
    margin-bottom:15px;
    text-shadow:0 0 8px rgba(255,220,150,.3);
}

.hero-desc {
    color: white;
    font-size:18px;
    max-width:480px;
    margin-bottom:25px;
}

.hero-btn {
    background:#d4a33a;
    color:#000;
    padding:12px 22px;
    border-radius:8px;
    font-weight:700;
    display:inline-block;
    transition:.3s;
}

.hero-btn:hover {
    background:#ffe09c;
}

/* RIGHT IMAGE */
.hero-image img {
    width:430px;
    animation:floatImg 4s ease-in-out infinite;
}

@keyframes floatImg {
    0% { transform:translateY(0); }
    50% { transform:translateY(-14px); }
    100% { transform:translateY(0); }
}

/* SLIDE DOTS */
.hero-controls {
    position:absolute;
    bottom:25px;
    width:100%;
    display:flex;
    justify-content:center;
    gap:12px;
}

.hero-dot {
    width:14px; 
    height:14px; 
    background:#d4a33a;
    border-radius:50%;
    opacity:.4;
    cursor:pointer;
    transition:.3s;
}

.hero-dot.active {
    opacity:1;
    transform:scale(1.2);
}

/* RESPONSIVE */
@media(max-width:992px) {
    .hero-slide {
        flex-direction:column;
        text-align:center;
        padding:40px 20px;
    }
    .hero-content { width:100%; }
    .hero-image img { width:300px; margin-top:30px; }
    .hero-title { font-size:38px; }
}

@media(max-width:600px) {
    .hero-title { font-size:32px; }
    .hero-desc { font-size:16px; }
    .hero-image img { width:240px; }
}
/* ======================== */
/* MENU PAGE BACKGROUND */
/* ======================== */
/* ======================== */
/* PAGE WRAPPER CONTAINER   */
/* ======================== */
.menu-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
    background: #8D1829;  /* Slightly darker red box */
    border-radius: 12px;
    box-shadow: 0 0 20px rgba(0,0,0,0.25);
}

/* ======================== */
/* SECTION TITLE            */
/* ======================== */
.menu-section-title {
    text-align: center;
    font-size: 32px;
    font-weight: 700;
    color: #111A1E;
    margin-bottom: 20px;    /* Brings cards closer */
    margin-top: 10px;
}


/* ======================== */
/* GRID LAYOUT              */
/* ======================== */
.menu-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    margin-top: 10px;    /* Very small gap after title */
}


/* ======================== */
/* MENU CARD STYLE          */
/* ======================== */
.menu-card {
    background: #111A1E;
    border: 2px solid rgba(255, 215, 0, 0.25);
    border-radius: 15px;
    overflow: hidden;
    transition: .3s ease;
}

/* IMAGE */
.menu-card img {
    width: 100%;
    height: 445px;
    object-fit: cover;
}

/* No Image Placeholder */
.no-image-placeholder {
    width: 100%;
    height: 445px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #ddd 0%, #ccc 100%);
    color: #666;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
}

/* CONTENT */
.menu-info {
    padding: 18px;
}

.menu-info h3 {
    color: #ffecb0;
    font-size: 22px;
    margin-bottom: 6px;
}

.menu-info p {
    color: #d8c9a5;
    font-size: 15px;
}

.price {
    margin-top: 10px;
    font-size: 20px;
    font-weight: 700;
    color: #d4a33a;
}


/* ======================== */
/* HOVER EFFECT (Desktop)   */
/* ======================== */
@media(min-width: 769px){
    .menu-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 0 18px rgba(255, 215, 0, 0.3);
    }
}


/* ======================== */
/* MOBILE VIEW              */
/* ======================== */
@media(max-width: 768px){
    .menu-grid {
        grid-template-columns: 1fr;
    }

    .menu-card img {
        height: 220px;
    }
}.menu-category-box {
    background: #F5E6D3;
    padding: 30px;
    border-radius: 12px;
    margin: 40px auto;
    max-width: 1200px;
}

.menu-category-title {
    text-align: center;
    color:#931A2A;
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 25px;
}


/* Footer Main Layout */
.restaurant-footer {
    background: #931A2A;
    padding: 60px 0 20px;
    color: #FFFFFF;
    font-family: 'Poppins', sans-serif;
}

.footer-container {
    width: 90%;
    max-width: 1300px;
    margin: auto;
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 40px;
}

/* Brand Section */
.footer-brand .footer-logo {
    width: 170px;
}

.footer-desc {
    margin-top: 20px;
    color:  #ffffff;
    line-height: 1.6;
}

/* Links */
.footer-links h4,
.footer-contact h4,
.footer-hours h4 {
    color: #FFDE9F;
    margin-bottom: 20px;
    font-size: 18px;
}

.footer-links ul li {
    list-style: none;
    margin-bottom: 10px;
}

.footer-links ul li a {
    color: #FFFFFF;
    text-decoration: none;
    transition: 0.3s;
}

.footer-links ul li a:hover {
    color: #111A1E;
}

/* Contact */
.footer-contact p {
    color:  #ffffff;
    margin-bottom: 8px;
}

/* Social Icons */
.footer-social a {
    color: #FFDE9F;
    font-size: 18px;
    margin-right: 12px;
    transition: 0.3s;
}

.footer-social a:hover {
    color: #FFFFFF;
}

/* Working Hours */
.footer-hours p {
    color:  #ffffff;
    margin-bottom: 8px;
}

/* Bottom Footer */
.footer-bottom {
    margin-top: 50px;
    border-top: 1px solid #1F354B;
    padding-top: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color:  #ffffff;
}

.footer-bottom-links a {
    color:  #fff;
    margin-left: 20px;
    text-decoration: none;
    transition: 0.3s;
}

.footer-bottom-links a:hover {
    color: #111A1E;
}

/* Responsive */
@media (max-width: 992px) {
    .footer-container {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 576px) {
    .footer-container {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 10px;
    }
}
/* FAQ MAIN WRAPPER */
/* ====================================================== */
/* 0. ROOT VARIABLES & FONT REDUCTION                     */
/* ====================================================== */
:root {
    --primary-red: #931A2A; 
    --primary-gold: #ffecb0;
    --dark-bg: #111A1E;
    --dark-bg-hover: #1e2a30; /* Slightly darker than active */
    --transition-speed: 0.4s;
}

.faq-wrapper {
    background: #F5E6D3;
    padding: 80px 15px; /* Reduced vertical padding */
}

.faq-heading {
    text-align: center;
    font-size: 30px; /* Reduced font size */
    font-weight: 700;
    color: var(--primary-red);
    margin-bottom: 40px; 
    padding-top: 30px;
    animation: slideInDown 0.8s ease-out;
}

@keyframes slideInDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* FAQ CARD */
.faq-container {
    max-width: 750px; /* Slightly reduced max width */
    margin: auto;
}

.faq-card {
    background: var(--dark-bg);
    border: 1px solid rgba(212, 163, 58, 0.4);
    padding: 15px 20px; /* Reduced padding */
    border-radius: 10px; /* Slightly smaller border radius */
    margin-bottom: 15px; /* Reduced margin */
    cursor: pointer;
    position: relative;
    overflow: hidden; /* Key for the border wipe */
    transition: all var(--transition-speed) cubic-bezier(0.34, 1.56, 0.64, 1);
    animation: fadeInUp 0.6s ease-out forwards;
    opacity: 0;
}

.faq-card:nth-child(1) { animation-delay: 0.1s; }
.faq-card:nth-child(2) { animation-delay: 0.2s; }
.faq-card:nth-child(3) { animation-delay: 0.3s; }
.faq-card:nth-child(4) { animation-delay: 0.4s; }
.faq-card:nth-child(5) { animation-delay: 0.5s; }
.faq-card:nth-child(6) { animation-delay: 0.6s; }
.faq-card:nth-child(7) { animation-delay: 0.7s; }
.faq-card:nth-child(8) { animation-delay: 0.8s; }
.faq-card:nth-child(9) { animation-delay: 0.9s; }
.faq-card:nth-child(10) { animation-delay: 1s; }

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- ENHANCED HOVER EFFECT WITH MULTIPLE LAYERS --- */
.faq-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 236, 176, 0.1), transparent);
    transition: left 0.5s ease;
    z-index: 1;
}

.faq-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--primary-red), var(--primary-gold));
    transition: width var(--transition-speed) cubic-bezier(0.34, 1.56, 0.64, 1);
    z-index: 2;
}

.faq-card:hover {
    background: linear-gradient(135deg, var(--dark-bg) 0%, var(--dark-bg-hover) 100%);
    box-shadow: 0 8px 25px rgba(147, 26, 42, 0.25), inset 0 1px 0 rgba(255, 236, 176, 0.1);
    transform: translateY(-5px);
    border-color: rgba(212, 163, 58, 0.8);
}

.faq-card:hover::before {
    left: 100%;
}

.faq-card:hover::after {
    width: 100%;
}

/* FAQ Header */
.faq-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 3;
}

.faq-header h3 {
    color: var(--primary-gold);
    font-size: 16px; /* Reduced font size */
    font-weight: 600;
    margin: 0;
    padding-right: 15px;
    transition: color var(--transition-speed) ease;
}

.faq-card:hover .faq-header h3 {
    color: #ffead4;
    text-shadow: 0 0 8px rgba(255, 236, 176, 0.3);
}

.faq-toggle {
    font-size: 20px; /* Reduced icon size */
    color: var(--primary-gold);
    font-weight: bold;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: rgba(255, 236, 176, 0.1);
}

.faq-card:hover .faq-toggle {
    background: rgba(147, 26, 42, 0.2);
    box-shadow: 0 0 12px rgba(147, 26, 42, 0.3);
}

/* FAQ BODY - "SLIDING DRAWER" ANIMATION */
.faq-body {
    max-height: 0;
    overflow: hidden;
    color: #d8c9a5;
    font-size: 15px; /* Reduced font size */
    line-height: 1.6;
    padding: 0 5px;
    /* --- KEY: Smoother, more defined max-height transition --- */
    transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
    opacity: 0;
}

/* ACTIVE STATE */
.faq-card.active {
    border-color: var(--primary-red); /* Highlight border with primary color */
    background: linear-gradient(135deg, var(--dark-bg-hover) 0%, #1a2530 100%);
    box-shadow: 0 12px 35px rgba(147, 26, 42, 0.35), inset 0 1px 0 rgba(255, 236, 176, 0.15);
}

.faq-card.active::after {
    width: 100%; /* Keep border active when card is open */
}

.faq-card.active .faq-body {
    max-height: 500px; /* Generous height for smooth transition */
    padding-top: 15px; 
    padding-bottom: 5px;
    opacity: 1;
    animation: slideDown 0.6s cubic-bezier(0.86, 0, 0.07, 1);
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.faq-card.active .faq-toggle {
    transform: rotate(45deg) scale(1.15); 
    color: var(--primary-red);
    background: rgba(147, 26, 42, 0.3);
    box-shadow: 0 0 15px rgba(147, 26, 42, 0.4);
}

/* ====================================================== */
/* 4. RESPONSIVE DESIGN - TABLET (769px to 1024px)       */
/* ====================================================== */
@media (min-width: 769px) and (max-width: 1024px) {
    .faq-wrapper {
        padding: 60px 20px;
    }
    
    .faq-heading {
        font-size: 28px;
        margin-bottom: 35px;
    }
    
    .faq-container {
        max-width: 680px;
    }
    
    .faq-card {
        padding: 18px 22px;
        margin-bottom: 14px;
        border-radius: 9px;
    }
    
    .faq-header h3 {
        font-size: 15px;
    }
    
    .faq-body {
        font-size: 14px;
        line-height: 1.5;
    }
    
    .faq-toggle {
        font-size: 18px;
        width: 28px;
        height: 28px;
    }
    
    .faq-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 6px 20px rgba(147, 26, 42, 0.2);
    }
}

/* ====================================================== */
/* 5. MOBILE RESPONSIVENESS (Screens 480px to 768px)     */
/* ====================================================== */
@media (max-width: 768px) {
    .faq-wrapper {
        padding: 50px 15px;
        background: #F5E6D3;
    }
    
    .faq-heading {
        font-size: 24px;
        margin-bottom: 25px;
        padding-top: 20px;
        animation: none;
    }
    
    .faq-container {
        max-width: 100%;
    }
    
    .faq-card {
        padding: 14px 16px;
        margin-bottom: 12px;
        border-radius: 8px;
        animation: none !important;
        opacity: 1 !important;
    }
    
    .faq-card::before {
        display: none;
    }
    
    .faq-header {
        flex-wrap: nowrap;
        gap: 10px;
    }
    
    .faq-header h3 {
        font-size: 14px;
        padding-right: 10px;
        flex: 1;
        line-height: 1.4;
    }
    
    .faq-body {
        font-size: 13px;
        line-height: 1.5;
        padding: 0 5px;
    }
    
    .faq-card.active .faq-body {
        max-height: 400px;
        padding-top: 12px;
        padding-bottom: 5px;
    }
    
    .faq-toggle {
        font-size: 18px;
        width: 28px;
        height: 28px;
        flex-shrink: 0;
        background: transparent;
    }
    
    .faq-card:hover .faq-toggle {
        background: transparent;
        box-shadow: none;
    }
    
    .faq-card.active .faq-toggle {
        background: rgba(147, 26, 42, 0.15);
        box-shadow: 0 0 10px rgba(147, 26, 42, 0.2);
    }
    
    /* Disable hover lift effect on touch devices */
    .faq-card:hover {
        background: var(--dark-bg);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        transform: none;
        border-color: rgba(212, 163, 58, 0.4);
    }
    
    /* Hide bottom wipe effect on mobile */
    .faq-card::after {
        height: 2px;
        width: 0;
    }
    
    .faq-card:hover::after {
        width: 0;
    }
    
    .faq-card.active::after {
        width: 100%;
        height: 2px;
    }
    
    /* Reduce active state intensity on mobile */
    .faq-card.active {
        border-color: rgba(147, 26, 42, 0.8);
        background: var(--dark-bg-hover);
        box-shadow: 0 4px 15px rgba(147, 26, 42, 0.2);
    }
    
    .faq-card:hover .faq-header h3 {
        text-shadow: none;
        color: var(--primary-gold);
    }
}

/* ====================================================== */
/* 6. SMALL MOBILE (Screens 320px to 479px)              */
/* ====================================================== */
@media (max-width: 479px) {
    .faq-wrapper {
        padding: 40px 12px;
    }
    
    .faq-heading {
        font-size: 20px;
        margin-bottom: 20px;
        padding-top: 15px;
    }
    
    .faq-card {
        padding: 12px 14px;
        margin-bottom: 10px;
        border-radius: 7px;
        border: 1px solid rgba(212, 163, 58, 0.3);
    }
    
    .faq-header {
        gap: 8px;
    }
    
    .faq-header h3 {
        font-size: 13px;
        font-weight: 500;
        padding-right: 8px;
    }
    
    .faq-body {
        font-size: 12px;
        line-height: 1.5;
        padding: 0 3px;
    }
    
    .faq-card.active .faq-body {
        max-height: 350px;
        padding-top: 10px;
        padding-bottom: 3px;
    }
    
    .faq-toggle {
        font-size: 16px;
        width: 26px;
        height: 26px;
        min-width: 26px;
    }
    
    .faq-toggle::before,
    .faq-toggle::after {
        content: '';
    }
}

/* ====================================================== */
/* 7. LANDSCAPE MOBILE (Screens with max-height: 500px)   */
/* ====================================================== */
@media (max-height: 500px) and (orientation: landscape) {
    .faq-wrapper {
        padding: 30px 15px;
    }
    
    .faq-heading {
        font-size: 20px;
        margin-bottom: 15px;
        padding-top: 10px;
    }
    
    .faq-card {
        padding: 10px 14px;
        margin-bottom: 8px;
    }
    
    .faq-header h3 {
        font-size: 13px;
    }
    
    .faq-body {
        font-size: 12px;
    }
    
    .faq-card.active .faq-body {
        max-height: 250px;
    }
}

/* ====================================================== */
/* 8. LARGE DESKTOP (Screens larger than 1200px)         */
/* ====================================================== */
@media (min-width: 1200px) {
    .faq-wrapper {
        padding: 100px 20px;
    }
    
    .faq-heading {
        font-size: 36px;
        margin-bottom: 50px;
        padding-top: 40px;
    }
    
    .faq-container {
        max-width: 900px;
    }
    
    .faq-card {
        padding: 20px 25px;
        margin-bottom: 18px;
        border-radius: 12px;
    }
    
    .faq-header h3 {
        font-size: 17px;
        padding-right: 20px;
    }
    
    .faq-body {
        font-size: 16px;
        line-height: 1.7;
    }
    
    .faq-toggle {
        font-size: 22px;
        width: 35px;
        height: 35px;
    }
    
    .faq-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 35px rgba(147, 26, 42, 0.3);
    }
    
    .faq-card.active .faq-body {
        max-height: 600px;
    }
}

/* ====================================================== */
/* 9. PRINT STYLES                                        */
/* ====================================================== */
@media print {
    .faq-card {
        page-break-inside: avoid;
    }
    
    .faq-card.active .faq-body {
        max-height: none;
    }
    
    .faq-body {
        display: block;
        opacity: 1;
    }
}
#hero-slider {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.hero-slider-container {
    width: 100%;
    height: 100%;
    position: relative;
}

.hero-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    padding-left: 5%;
    transition: opacity 0.7s ease-in-out;
    opacity: 0;
}

.hero-slide.active {
    opacity: 1;
    z-index: 2;
}

.hero-content {
    max-width: 5000px;
    color: #fff;
    text-shadow: 0 3px 10px rgba(0,0,0,0.6);
}

.hero-title {
    font-size: 4rem;
    margin-bottom: 5px;   /* reduced space below title */
    line-height: 1.5;     /* reduces space between broken lines */
}

.hero-desc {
    font-size: 1.2rem;
    margin-bottom: 20px;
}

.hero-btn {
    padding: 12px 25px;
    background: #931A2A;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 600;

    /* Add Transition property for smooth changes */
    transition: background 0.3s ease, transform 0.2s ease;
}

/* Add a hover state for the transition to take effect */
.hero-btn:hover {
    background: #7a1523; /* Slightly darker shade on hover */
    transform: translateY(-2px); /* Slight lift effect */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Subtle shadow */
}

.hero-controls {
    position: absolute;
    bottom: 25px;
    width: 100%;
    text-align: center;
    z-index: 10;
}

.hero-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 0 5px;
    background: #ffffff80;
    border-radius: 50%;
    cursor: pointer;
}

.hero-dot.active {
    background: #fff;
}
/* ============================
   RESPONSIVE DESIGN
============================ */

/* ===== Tablets (768px - 1024px) ===== */
@media (max-width: 1024px) {

    #hero-slider {
        height: 75vh;
    }

    .hero-title {
        font-size: 2.4rem;
    }

    .hero-desc {
        font-size: 1rem;
        max-width: 90%;
    }

    .hero-btn {
        padding: 10px 20px;
        font-size: 0.95rem;
    }

    .hero-slide {
        background-position: center;
        padding-left: 4%;
    }
}

/* ===== Mobile Landscape (600px - 767px) ===== */
@media (max-width: 767px) {

    #hero-slider {
        height: 70vh;
    }

    .hero-slide {
        padding-left: 3%;
        justify-content: flex-start;
        background-position: center right;
    }

    .hero-title {
        font-size: 1.9rem;
        line-height: 1.3;
    }

    .hero-desc {
        font-size: 0.9rem;
    }

    .hero-btn {
        padding: 8px 18px;
        font-size: 0.85rem;
    }

    .hero-controls {
        bottom: 15px;
    }
}

/* ===== Mobile Portrait (0px - 599px) ===== */
@media (max-width: 599px) {

    #hero-slider {
        height: 65vh;
    }

    .hero-slide {
        padding-left: 20px;
        padding-right: 20px;
        background-position: center; /* Full focus on food */
        justify-content: center;     /* Center-align text */
        text-align: center;
        padding-top: 50px;
    }

    .hero-content {
        max-width: 90%;
    }

    .hero-title {
        font-size: 1.6rem;
    }

    .hero-desc {
        font-size: 0.85rem;
    }

    .hero-btn {
        padding: 8px 16px;
        font-size: 0.8rem;
        display: inline-block;
    }

    .hero-dot {
        width: 10px;
        height: 10px;
    }
}
.contact-info-box {
    margin-top: 30px;
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
}

.contact-info-item {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}


.contact-info-item i {
    font-size: 22px;
    color: #931A2A;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: rgba(147, 26, 42, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
}

.contact-info-item h4 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #111;
}

.contact-info-item p {
    margin: 3px 0 0;
    font-size: 14px;
    color: #555;
}

/* ============================= */
/* MOBILE RESPONSIVE             */
/* ============================= */

@media (max-width: 768px) {
    .contact-info-box {
        padding: 20px;
    }

    .contact-info-item i {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }
}
/* ============================= */
/* CONTACT INFO HORIZONTAL       */
/* ============================= */

.contact-info-box {
    margin: 30px auto;        /* center container */
    display: flex;
    justify-content: center; /* center items */
    align-items: center;
    gap: 80px;               /* space between items */
    background: transparent;
    padding: 0;
    box-shadow: none;
    max-width: 1100px;       /* keeps it centered nicely */
}


/* Each item */
.contact-info-item {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

/* Icon style */
.contact-info-item i {
    font-size: 20px;
    color: #931A2A;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: rgba(147, 26, 42, 0.15); /* soft icon bg only */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Text */
.contact-info-item h4 {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #111;
}

.contact-info-item p {
    margin: 2px 0 0;
    font-size: 13px;
    color: #555;
}
/* ============================= */
/* HOVER SCALE ANIMATION         */
/* ============================= */

.contact-info-item {
    transition: transform 0.3s ease;
}

.contact-info-item:hover {
    transform: scale(1.05); /* gentle increase */
}

/* Icon hover enhancement */
.contact-info-item i {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.contact-info-item:hover i {
    transform: scale(1.15);
    box-shadow: 0 6px 18px rgba(147, 26, 42, 0.35);
}

/* ============================= */
/* MOBILE STACK                  */
/* ============================= */

@media (max-width: 768px) {
    .contact-info-box {
        flex-direction: column;
        align-items: center;   /* center block */
        gap: 25px;
        text-align: center;
    }

    .contact-info-item {
        flex-direction: column; /* icon on top */
        align-items: center;
        justify-content: center;
        gap: 10px;
    }

    .contact-info-item i {
        width: 48px;
        height: 48px;
        font-size: 22px;       /* medium icon size */
    }

    .contact-info-item h4 {
        font-size: 15px;
    }

    .contact-info-item p {
        font-size: 14px;
    }
}
@media (max-width: 768px) {
    .contact-info-item:hover {
        transform: none;
    }

    .contact-info-item:hover i {
        transform: none;
        box-shadow: none;
    }
}
/* ====================================================== */
/* 0. ROOT VARIABLES & GLOBAL STYLES                      */
/* ====================================================== */
:root {
    /* Primary Brand Color: Deep Red/Maroon */
    --primary-color: #931A2A; 
    /* Light tint for initial icon background */
    --light-tint: rgba(147, 26, 42, 0.15); 
    --transition-speed: 0.4s;
}

/* Custom Keyframe Animation for the Icon Pulse (Used in section 2) */
@keyframes iconPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.15); }
    100% { transform: scale(1); }
}

/* Custom Keyframe Animation for the Button Shake (Used in section 3) */
@keyframes buttonShake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-3px); }
    40%, 80% { transform: translateX(3px); }
}


/* ====================================================== */
/* 1. CONTACT INFO BOXES (Horizontal Layout & Hover Effect) */
/* ====================================================== */

/* Container for the three contact items (Horizontal on Desktop) */
/* Container CSS (Ensures uniform height) */
.contact-info-box {
    /* ... other styles ... */
    
    display: flex;
    justify-content: center;
    /* This rule forces all items to be the same height */
    align-items: stretch; 
    
    /* ... other styles ... */
}

/* Item CSS (Ensures uniform width) */
.contact-info-item {
    /* This rule ensures all items take an equal amount of width */
    flex: 1; 
    
    /* Important for the content inside to be vertically centered */
    display: flex; 
    align-items: center; 

    padding: 15px; /* Ensure sufficient and consistent internal padding */
    height: auto;
    
    /* ... other styles ... */
}
/* Individual contact item styles */
.contact-info-item {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
    position: relative;
    padding: 25px;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
    /* Base transition for lift, background, and scale */
    transition: all var(--transition-speed) ease-in-out;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

/* Base style for the icon circle */
.contact-info-item i {
    font-size: 22px;
    color: var(--primary-color);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: var(--light-tint); /* Initial soft icon background */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--transition-speed) ease-in-out;
}

/* Text styles (h4 and p) */
.contact-info-item h4 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #111;
}

.contact-info-item p {
    margin: 3px 0 0;
    font-size: 14px;
    color: #555;
}

/* --- Gradient Inner-Glow Pseudo-Element --- */
.contact-info-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 12px;
    background: linear-gradient(45deg, var(--primary-color), var(--primary-color));
    z-index: -1;
    transform: scale(0.9);
    opacity: 0;
    filter: blur(8px);
    transition: all var(--transition-speed) ease-in-out;
}

/* --- HOVER EFFECT: Dark Background and White Text --- */
.contact-info-item:hover {
    transform: translateY(-5px); /* Lift */
    box-shadow: 0 12px 35px rgba(147, 26, 42, 0.4); 
    background: var(--primary-color); /* Solid dark background */
    cursor: pointer;
}

/* Activate the glow on hover */
.contact-info-item:hover::before {
    transform: scale(1.05);
    opacity: 1;
}

/* Icon Hover State */
.contact-info-item:hover i {
    background: #FFFFFF; /* White background */
    color: var(--primary-color); /* Dark icon on white background */
    animation: iconPulse 0.6s ease-out; /* Pulse animation */
}

/* Text Hover State (High Contrast) */
.contact-info-item:hover h4,
.contact-info-item:hover p {
    color: #FFFFFF; /* White text */
    transition: color var(--transition-speed) ease-in-out;
}


/* ====================================================== */
/* 2. CONTACT FORM (Input Focus Animation)                */
/* ====================================================== */

/* Form Container */
.about-us-left {
    padding: 30px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

/* Input & Textarea Base */
.about-us-input-custom,
.about-us-message {
    width: 100%;
    padding: 15px 18px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    color: #333;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
    overflow: hidden;
}

.about-us-message {
    min-height: 150px;
    resize: vertical;
}

/* Input/Textarea Focus Effect (Border Fill) */
.about-us-input-custom:focus,
.about-us-message:focus {
    outline: none;
    border-color: #ddd;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

/* Pseudo-element for the dynamic bottom border */
.about-us-input-custom::after,
.about-us-message::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0; 
    height: 4px;
    background: var(--primary-color); 
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* The actual focus animation */
.about-us-input-custom:focus::after,
.about-us-message:focus::after {
    width: 100%;
}


/* ====================================================== */
/* 3. SUBMIT BUTTON ("3D Press" and "Shake")              */
/* ====================================================== */

.send-message-btn {
    text-align: center;
    padding-top: 10px;
}

.send-message-btn a {
    display: inline-block;
    padding: 14px 40px;
    background-color: var(--primary-color);
    color: white;
    text-decoration: none;
    font-size: 17px;
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.2s ease-out;
    position: relative;
    box-shadow: 0 8px 15px rgba(147, 26, 42, 0.4), 0 4px 5px rgba(0, 0, 0, 0.1);
}

/* Hover Animation: Subtle Shake */
.send-message-btn a:hover {
    background-color: #A32A3A; 
    animation: buttonShake 0.6s ease-in-out; 
    box-shadow: 0 10px 20px rgba(147, 26, 42, 0.6);
}

/* Active/Click Animation: The 3D Press */
.send-message-btn a:active {
    transform: translateY(2px);
    box-shadow: 0 4px 8px rgba(147, 26, 42, 0.3), 0 2px 3px rgba(0, 0, 0, 0.05);
}


/* ====================================================== */
/* 4. LAYOUT & RESPONSIVENESS (Desktop vs. Mobile)        */
/* ====================================================== */

/* Desktop Layout: Form and Images Side-by-Side */
.about-us-page-full {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 40px;
}

.about-us-left { max-width: 55%; }
.about-us-right { max-width: 45%; }


/* --- MEDIA QUERY for Mobile & Tablet --- */
@media (max-width: 992px) {
    /* Stacks Form and Images Vertically */
    .about-us-page-full {
        flex-direction: column;
    }
    .about-us-left,
    .about-us-right {
        max-width: 100%; 
    }

    /* Stacks Contact Info Boxes Vertically */
    .contact-info-box {
        flex-direction: column;
        align-items: center;
        gap: 25px;
    }

    /* Adjusts Individual Contact Items for stacking */
    .contact-info-item {
        width: 100%; 
        flex: none;
        flex-direction: column; /* Icon on top of text */
        align-items: center;
        text-align: center;
        padding: 20px;
    }

    /* Disable complex hover effects on touch devices */
    .contact-info-item:hover {
        transform: none;
        box-shadow: none;
        background: #fff; /* Revert background to white */
    }
    .contact-info-item:hover i {
        background: var(--light-tint); /* Revert icon background */
        color: var(--primary-color);
        animation: none;
    }
    .contact-info-item:hover h4,
    .contact-info-item:hover p {
        color: #111; /* Revert text color */
    }
    .contact-info-item::before {
        display: none; /* Hide the complex gradient glow on mobile */
    }
}
.header-cart-sec {
    display: flex;
    align-items: center;
    gap: 45px;
}

/* CART (DESKTOP) */
.header-cart-btn a {
    position: relative;
    color: #fff;
    font-size: 18px;
    display: flex;
    align-items: center;
    text-decoration: none;
}

.cart-count {
    position: absolute;
    top: -6px;
    right: -8px;
    background: #fff;
    color: #000;
    font-size: 11px;
    padding: 1px 5px;
    border-radius: 50%;
    font-weight: 600;
}

/* BOOKING */
.booking-btn-text {
    background: #fff;
    color: #8e1b2a;
    padding: 8px 22px;
    border-radius: 30px;
    font-weight: 600;
    text-decoration: none;
}

/* ================= MOBILE MENU EXTRAS ================= */
.mobile-cart,
.mobile-booking {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 12px;
    font-size: 16px;
    text-decoration: none;
}

.mobile-cart {
    color: #fff;
}

.mobile-cart-count {
    background: #fff;
    color: #000;
    font-size: 12px;
    padding: 2px 6px;
    border-radius: 4px;
}

/* Booking button inside toggle */


/* ================= MOBILE BEHAVIOR ================= */
@media (max-width: 1199px) {
    .header-cart-btn,
    .header-cart-sec-first {
        display: none !important;
    }
}
/* --- 1. Variable Definitions (Customize Your Primary Color) --- */
/* ============================= */
/* PRIMARY THEME SETUP          */
/* ============================= */
:root{
    --primary:#931A2A;
    --cream:#F5E6D3;
}

/* ============================= */
/* CART PAGE BASE               */
/* ============================= */
.cart-box,
.summary-box{
    background:#fff1dc;
    padding:28px;
    border-radius:18px;
    color:var(--primary);
}

.cart-box h3,
.summary-box h4,
.summary-box h5{
    color:var(--primary);
    font-weight:600;
}

/* ============================= */
/* CART TABLE                   */
/* ============================= */
.cart-table{
    margin-top:15px;
    border-collapse:separate;
    border-spacing:0 14px;
}

.cart-table th{
    color:var(--primary);
    font-weight:600;
    border-bottom:1px solid rgba(147,26,42,0.3);
}

.cart-table td{
    color:var(--primary);
    vertical-align:middle;
    padding:16px 10px;
}

/* ============================= */
/* ORDER TYPE RADIO             */
/* ============================= */
.radio-box{
    display:block;
    margin:10px 0;
    font-weight:500;
    color:var(--primary);
}

.radio-box input{
    margin-right:8px;
    accent-color:var(--primary);
}

/* ============================= */
/* BILLING SECTION              */
/* ============================= */
.summary-box p{
    display:flex;
    justify-content:space-between;
    margin-bottom:12px;
    font-size:15px;
}

.summary-box h5{
    display:flex;
    justify-content:space-between;
    margin-top:18px;
    padding-top:15px;
    border-top:1px solid rgba(147,26,42,0.35);
    font-size:18px;
}

/* ============================= */
/* CHECKOUT BUTTON              */
/* ============================= */
.checkout-btn{
    width:100%;
    padding:14px;
    background: #871D1D;
    color:#000;
    border:none;
    border-radius:10px;
    font-weight:600;
    letter-spacing:0.5px;
    transition:all 0.3s ease;
}

/* Hover & Interaction */
.checkout-btn:hover{
    background:#fff;
    transform:translateY(-2px);
    box-shadow:0 10px 25px rgba(147,26,42,0.35);
}

/* Active Click */
.checkout-btn:active{
    transform:scale(0.97);
}

/* ============================= */
/* RESPONSIVE POLISH            */
/* ============================= */
@media(max-width:768px){
    .cart-box,
    .summary-box{
        padding:20px;
    }
}
@media(max-width:576px){
    .cart-table th,
    .cart-table td{
        font-size:14px;
        padding:12px 6px;
    }
}
/* ======================== */
/* HERO SLIDER STYLES      */
/* ================= COLOR VARIABLES ================= */
:root {
    --primary: #8E1B2A;
    --secondary: #F5E6D3;
    --dark: #0B1315;
    --white: #ffffff;
}

/* ================= CHECKOUT SECTION ================= */
#Checkout-section {
    background: var(--secondary);
    padding: 60px 0;
}

/* ================= LEFT FORM CARD ================= */
.checkout-form1 {
    background: var(--white);
    padding: 35px;
    border-radius: 18px;
    box-shadow: 0 10px 35px rgba(0,0,0,0.08);
}

/* Section Titles */
.bill-txt h3 {
    font-size: 22px;
    font-weight: 600;
    color: var(--primary);
    margin-bottom: 20px;
}

/* ================= INPUT FIELDS ================= */
.custom-form-control {
    width: 100%;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1px solid #ddd;
    font-size: 15px;
    background: #fff;
    color: var(--dark);
    transition: all 0.3s ease;
}

.custom-form-control:hover {
    border-color: var(--primary);
}

.custom-form-control:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(142,27,42,0.2);
    outline: none;
}

/* Input spacing */
.checkout-deatils {
    margin-bottom: 16px;
}

/* ================= PAYMENT OPTIONS ================= */
.custom-radio label {
    cursor: pointer;
    font-size: 16px;
    color: var(--dark);
    transition: color 0.3s;
}

.custom-radio:hover label {
    color: var(--primary);
}

.custom-radio input:checked + label {
    color: var(--primary);
    font-weight: 600;
}

/* ================= PLACE ORDER BUTTON ================= */
.place-order-btn a {
    display: block;
    background: var(--primary);
    color: var(--white);
    text-align: center;
    padding: 14px;
    border-radius: 30px;
    font-weight: 600;
    text-decoration: none;
    margin-top: 25px;
    transition: all 0.3s ease;
}

.place-order-btn a:hover {
    background: #731520;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(142,27,42,0.4);
}

/* ================= RIGHT CART SUMMARY ================= */
.checkout-sec-full1 {
    background: var(--white);
    border-radius: 18px;
    box-shadow: 0 10px 35px rgba(0,0,0,0.08);
    overflow: hidden;
}

.cart-sec-coupon {
    padding: 25px;
}

.cart-sec-coupon h4 {
    color: var(--primary);
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
}

.cart-sec-coupon p {
    display: flex;
    justify-content: space-between;
    font-size: 15px;
    color: var(--dark);
    margin-bottom: 8px;
}

.total-txt {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary);
    border-top: 1px dashed #ddd;
    padding-top: 12px;
    margin-top: 12px;
}

/* ================= BACK TO CART BUTTON ================= */
.checkout-btn a {
    display: block;
    text-align: center;
    background: var(--secondary);
    color: var(--primary);
    padding: 12px;
    border-radius: 30px;
    font-weight: 600;
    text-decoration: none;
    margin-top: 18px;
    transition: all 0.3s ease;
}

.checkout-btn a:hover {
    background: var(--primary);
    color: var(--white);
}

/* ================= MOBILE RESPONSIVE ================= */
@media (max-width: 991px) {

    #Checkout-section {
        padding: 40px 0;
    }

    .Checkout-section-full {
        display: flex;
        flex-direction: column;
        gap: 30px;   /* ✅ MOBILE GAP FIX */
    }

    .checkout-form1 {
        padding: 25px;
    }

    .cart-sec-coupon {
        padding: 20px;
    }

    .bill-txt h3 {
        font-size: 20px;
    }

    .custom-form-control {
        font-size: 14px;
        padding: 12px 14px;
    }

    .place-order-btn a,
    .checkout-btn a {
        padding: 12px;
        font-size: 15px;
    }
}

/* ================= SMALL MOBILE ================= */
@media (max-width: 576px) {

    .checkout-form1,
    .checkout-sec-full1 {
        border-radius: 14px;
    }

    .cart-sec-coupon h4 {
        font-size: 18px;
    }

    .total-txt {
        font-size: 16px;
    }
}
/* ================= COLOR VARIABLES ================= */
:root {
    --primary: #8E1B2A;     /* Restaurant primary */
    --secondary: #F5E6D3;   /* Cream background */
    --dark: #0B1315;
    --white: #ffffff;
    --gray: #6B6B6B;
}

/* ================= CHECKOUT SECTION ================= */
#Checkout-section {
    background: var(--secondary);
    padding: 60px 0;
}

/* ================= MAIN WRAPPER ================= */
.Checkout-section-full {
    display: flex;
    gap: 40px;
}

/* ================= LEFT FORM CARD ================= */
.checkout-form1 {
    background: var(--white);
    padding: 35px;
    border-radius: 18px;
    box-shadow: 0 10px 35px rgba(0,0,0,0.08);
}

/* Force readable text */
.checkout-form1,
.checkout-form1 label,
.checkout-form1 input,
.checkout-form1 textarea {
    color: var(--dark);
}

/* Section titles */
.bill-txt h3 {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 20px;
    text-align: center;
}

/* ================= INPUT FIELDS ================= */
.custom-form-control {
    width: 100%;
    min-height: 48px;
    padding: 14px 16px;
    border-radius: 12px;
    border: 1.5px solid var(--dark);
    font-size: 15px;
    font-weight: 500;
    background: var(--white);
    color: var(--dark);
    transition: all 0.3s ease;
}

/* Placeholder visibility */
.custom-form-control::placeholder {
    color: var(--gray);
    opacity: 1;
}

/* Hover */
.custom-form-control:hover {
    border-color: var(--primary);
}

/* Focus */
.custom-form-control:focus {
    border-color: var(--primary);
    background: var(--white);
    color: var(--dark);
    box-shadow: 0 0 0 2px rgba(142,27,42,0.25);
    outline: none;
}

/* Field spacing */
.checkout-deatils {
    margin-bottom: 16px;
}

/* ================= PAYMENT OPTIONS ================= */
.payment-method-type {
    margin-top: 30px;
}

.custom-radio {
    margin-bottom: 12px;
}

.custom-radio label {
    cursor: pointer;
    font-size: 16px;
    color: var(--dark);
    transition: color 0.3s;
}

.custom-radio:hover label {
    color: var(--primary);
}

.custom-radio input:checked + label {
    color: var(--primary);
    font-weight: 600;
}

/* ================= PLACE ORDER BUTTON ================= */
.place-order-btn a {
    display: block;
    background: var(--primary);
    color: var(--white);
    text-align: center;
    padding: 14px;
    border-radius: 30px;
    font-weight: 600;
    text-decoration: none;
    margin-top: 25px;
    transition: all 0.3s ease;
}

.place-order-btn a:hover {
    background: #731520;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(142,27,42,0.4);
}

/* ================= RIGHT CART SUMMARY ================= */
.checkout-sec-full1 {
    background: var(--white);
    border-radius: 18px;
    box-shadow: 0 10px 35px rgba(0,0,0,0.08);
    overflow: hidden;
}

.checkout-sec-left1 img {
    width: 100%;
    height: auto;
    display: block;
}

.cart-sec-coupon {
    padding: 25px;
}

/* Cart heading */
.cart-sec-coupon h4 {
    color: var(--primary);
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 15px;
}

/* Cart text */
.cart-sec-coupon p {
    display: flex;
    justify-content: space-between;
    font-size: 15px;
    color: var(--dark);
    margin-bottom: 8px;
}

/* Total */
.total-txt {
    display: flex;
    justify-content: space-between;
    font-size: 18px;
    font-weight: 700;
    color: var(--primary);
    border-top: 1px dashed #ccc;
    padding-top: 12px;
    margin-top: 12px;
}

/* ================= BACK TO CART BUTTON ================= */
.checkout-btn a {
    display: block;
    text-align: center;
    background: var(--secondary);
    color: var(--primary);
    padding: 12px;
    border-radius: 30px;
    font-weight: 600;
    text-decoration: none;
    margin-top: 18px;
    transition: all 0.3s ease;
}

.checkout-btn a:hover {
    background: var(--primary);
    color: var(--white);
}

/* ================= MOBILE RESPONSIVE ================= */
@media (max-width: 991px) {

    #Checkout-section {
        padding: 40px 0;
    }

    .Checkout-section-full {
        flex-direction: column;
        gap: 30px;
    }

    .checkout-form1 {
        padding: 25px;
    }

    .cart-sec-coupon {
        padding: 20px;
    }

    .bill-txt h3 {
        font-size: 20px;
    }

    .custom-form-control {
        font-size: 14px;
        padding: 12px 14px;
    }

    .place-order-btn a,
    .checkout-btn a {
        font-size: 15px;
    }
}

/* ================= SMALL MOBILE ================= */
@media (max-width: 576px) {

    .checkout-form1,
    .checkout-sec-full1 {
        border-radius: 14px;
    }

    .cart-sec-coupon h4 {
        font-size: 18px;
    }

    .total-txt {
        font-size: 16px;
    }
}
.restaurant-new {
    background: #F5E6D3;
    padding: 100px 0;
}

.restaurant-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

/* IMAGES */
.restaurant-images {
    position: relative;
}

.restaurant-images img {
    width: 100%;
    border-radius: 20px;
}

.img-main {
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

.img-overlay {
    position: absolute;
    bottom: -40px;
    right: -40px;
    width: 60%;
    border-radius: 16px;
    box-shadow: 0 15px 30px rgba(0,0,0,0.25);
}

/* CONTENT */
.restaurant-content .section-tag {
    color: #8E1B2A;
    font-weight: 600;
    margin-bottom: 10px;
}

.restaurant-content h2 {
    font-size: 42px;
    font-weight: 700;
    color: #0B1315;
    line-height: 1.2;
}

.restaurant-content h2 span {
    color: #8E1B2A;
}

.restaurant-content .desc {
    margin: 20px 0 30px;
    color: #333;
    font-size: 16px;
}

/* FEATURES */
.features {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.feature {
    display: flex;
    gap: 18px;
    align-items: flex-start;
}

.feature img {
    width: 55px;
}

.feature h4 {
    font-size: 18px;
    color: #0B1315;
    margin-bottom: 5px;
}

.feature p {
    font-size: 14px;
    color: #555;
}

/* BUTTON */
.btn-explore {
    display: inline-block;
    margin-top: 35px;
    padding: 14px 36px;
    background: #8E1B2A;
    color: #fff;
    border-radius: 30px;
    text-decoration: none;
    font-weight: 600;
    transition: 0.3s;
}

.btn-explore:hover {
    background: #6f1320;
    transform: translateY(-2px);
}

/* ================= RESPONSIVE ================= */
@media (max-width: 991px) {
    .restaurant-grid {
        grid-template-columns: 1fr;
    }

    .img-overlay {
        position: relative;
        width: 100%;
        right: 0;
        bottom: 0;
        margin-top: 20px;
    }

    .restaurant-content h2 {
        font-size: 32px;
    }
}
.restaurant-content h2,
.restaurant-content .desc,
.restaurant-content .features,
.btn-explore {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeUp 0.8s ease forwards;
}

.restaurant-content h2 { animation-delay: 0.2s; }
.restaurant-content .desc { animation-delay: 0.4s; }
.restaurant-content .features { animation-delay: 0.6s; }
.btn-explore { animation-delay: 0.8s; }

@keyframes fadeUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Smooth transitions globally */
.restaurant-new * {
    transition: all 0.4s ease;
}

/* Image hover */
.restaurant-images img {
    transform: scale(1);
}

.restaurant-images:hover img {
    transform: scale(1.04);
}

/* Overlay image */
.img-overlay {
    transform: translateY(0);
}

.restaurant-images:hover .img-overlay {
    transform: translateY(-10px);
}

/* Feature hover */
.feature:hover {
    transform: translateX(6px);
}

.feature:hover h4 {
    color: #8E1B2A;
}

/* Button hover */
.btn-explore:hover {
    box-shadow: 0 10px 30px rgba(142,27,42,0.4);
}
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s ease;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}
/* Change placeholder color */
/* ================= CHECKOUT PLACEHOLDER COLOR ================= */

/* Chrome, Edge, Safari */
.checkout-form1 .custom-form-control::placeholder {
    color: #000000;   /* BLACK */
    opacity: 1;       /* important for Safari */
}

/* Firefox */
.checkout-form1 .custom-form-control::-moz-placeholder {
    color: #000000;
    opacity: 1;
}

/* Internet Explorer */
.checkout-form1 .custom-form-control:-ms-input-placeholder {
    color: #000000;
}

/* Old Edge */
.checkout-form1 .custom-form-control::-ms-input-placeholder {
    color: #000000;
}

/* Optional UX: hide placeholder on focus */
.checkout-form1 .custom-form-control:focus::placeholder {
    color: transparent;
}
/* ========================================= */
/* MOBILE MENU AUTH BUTTONS (RESPONSIVE)     */
/* ========================================= */

@media screen and (max-width: 768px) {

    /* Container to stack the buttons vertically */
    .mobile-auth-container {
        margin-top: 25px;       /* Pushes buttons down from the menu links */
        padding: 0 10px;        /* Adds a little breathing room on sides */
        display: flex;
        flex-direction: column; /* THIS stacks them: Login on top of Sign Up */
        gap: 15px;              /* Space between the two buttons */
    }

    /* Specific adjustments for Mobile Buttons */
    .mobile-btn {
        width: 100%;            /* Forces button to stretch full width */
        text-align: center;     /* Centers the text */
        display: block;         /* Ensures dimensions work correctly */
        padding: 12px 0;        /* Taller buttons for easier tapping on phone */
    }
}

    /* --- SCOPED CSS FOR LOGIN SECTION --- */

    /* --- SCOPED CSS FOR LOGIN SECTION --- */
    .login-wrapper {
        background-color: #FDECEE; 
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: 800px; 
        width: 100%;
        padding: 50px 0;
        background-image: linear-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0.4)), url('https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?q=80&w=2070&auto=format&fit=crop');
        background-size: cover;
        background-position: center;
    }

    /* Typography */
    .login-container h1, .login-container p, .login-container span, .login-container a, .login-container button, .login-container input {
        font-family: 'Lexend', sans-serif; 
    }

    .login-container h1 {
        font-weight: 700;
        margin: 0;
        color: #931A2A; 
        margin-bottom: 10px;
    }

    .login-container p {
        font-size: 14px;
        font-weight: 300;
        line-height: 20px;
        letter-spacing: 0.5px;
        margin: 20px 0 30px;
    }

    .login-container span {
        font-size: 12px;
        color: #666;
        margin-bottom: 10px;
    }

    .login-container a {
        color: #333;
        font-size: 14px;
        text-decoration: none;
        margin: 15px 0;
    }

    /* Buttons */
    .login-container button {
        border-radius: 5px; 
        border: 1px solid #931A2A; 
        background-color: #931A2A; 
        color: #FFFFFF;
        font-size: 12px;
        font-weight: bold;
        padding: 12px 45px;
        letter-spacing: 1px;
        text-transform: uppercase;
        transition: transform 80ms ease-in;
        cursor: pointer;
        margin-top: 10px;
    }

    .login-container button:active {
        transform: scale(0.95);
    }

    .login-container button:focus {
        outline: none;
    }

    .login-container button.ghost {
        background-color: transparent;
        border-color: #931A2A; 
        color: #931A2A;
        border-width: 2px;
    }

    /* Main Container */
    .login-container {
        background-color: #fff;
        border-radius: 10px;
        box-shadow: 0 14px 28px rgba(147, 26, 42, 0.1), 
                    0 10px 10px rgba(147, 26, 42, 0.1);
        position: relative;
        overflow: hidden;
        width: 850px;
        max-width: 95%;
        min-height: 550px;
    }

    .form-container {
        position: absolute;
        top: 0;
        height: 100%;
        transition: all 0.6s ease-in-out;
        padding: 0;
    }

    /* Form Styling */
    .login-wrapper form {
        background-color: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding: 0 50px;
        height: 100%;
        text-align: center;
    }

    .login-wrapper input {
        background-color: #FFF5F6; 
        border: 1px solid #f0d0d4;
        padding: 12px 15px;
        margin: 8px 0;
        width: 100%;
        border-radius: 4px;
        outline: none;
        color: #333;
    }
    
    .login-wrapper input:focus {
        background-color: #fff;
        border-color: #931A2A;
    }

    /* --- DESKTOP SLIDING LOGIC (Left/Right) --- */
    .sign-in-container {
        left: 0;
        width: 50%;
        z-index: 1;
    }

    .login-container.right-panel-active .sign-in-container {
        transform: translateX(100%);
    }

    .sign-up-container {
        left: 0;
        width: 50%;
        opacity: 0;
        z-index: 1;
    }

    .login-container.right-panel-active .sign-up-container {
        transform: translateX(100%);
        opacity: 1;
        z-index: 5;
        animation: show 0.6s;
    }

    @keyframes show {
        0%, 49.99% { opacity: 0; z-index: 1; }
        50%, 100% { opacity: 1; z-index: 5; }
    }

    .overlay-container {
        position: absolute;
        top: 0;
        left: 50%;
        width: 50%;
        height: 100%;
        overflow: hidden;
        transition: transform 0.6s ease-in-out;
        z-index: 1;
    }

    .login-container.right-panel-active .overlay-container {
        transform: translateX(-100%);
    }

    .overlay {
        background: #ffc3a0;
        background: -webkit-linear-gradient(to right, #ffafbd, #ffc3a0);
        background: linear-gradient(to right, #ffafbd, #ffc3a0);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 0 0;
        color: #931A2A; 
        position: relative;
        left: -100%;
        height: 100%;
        width: 200%;
        transform: translateX(0);
        transition: transform 0.6s ease-in-out;
    }

    .login-container.right-panel-active .overlay {
        transform: translateX(50%);
    }

    .overlay-panel {
        position: absolute;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding: 0 40px;
        text-align: center;
        top: 0;
        height: 100%;
        width: 50%;
        transform: translateX(0);
        transition: transform 0.6s ease-in-out;
    }

    .overlay-left {
        transform: translateX(-20%);
    }

    .login-container.right-panel-active .overlay-left {
        transform: translateX(0);
    }

    .overlay-right {
        right: 0;
        transform: translateX(0);
    }

    .login-container.right-panel-active .overlay-right {
        transform: translateX(20%);
    }

    /* --- MOBILE RESPONSIVE FIXES (Top/Bottom Split) --- */
    @media (max-width: 768px) {
        
        /* FIX 1: Add padding to top so it doesn't touch header */
        .login-wrapper {
            padding-top: 120px; /* Increased from 50px */
            padding-bottom: 50px;
            align-items: flex-start; 
        }
        
        .login-container {
            width: 100%;
            min-height: 700px; 
            border-radius: 10px;
        }

        /* Make Forms Full Width & Top Heavy */
        .sign-in-container, .sign-up-container {
            width: 100%;
            height: 70%; 
            top: 0;
            left: 0;
        }

        .login-wrapper form {
            padding: 0 20px;
        }
        
        /* Move Sliding Panel to Bottom */
        .overlay-container {
            width: 100%;
            height: 30%; 
            top: 70%;  
            left: 0;
            border-radius: 0 0 10px 10px;
        }

        .overlay {
            width: 100%; 
            height: 100%;
            left: 0;
            transform: none !important; 
        }

        .overlay-panel {
            width: 100%;
            height: 100%;
            padding: 10px;
            top: 0;
            transform: none !important; 
        }

        /* FIX 2: POINTER EVENTS (This makes the button clickable) */
        
        /* --- Default State (Login Form is Active) --- */
        /* Overlay Right (Sign Up Button) is visible */
        .overlay-right {
            opacity: 1;
            z-index: 2;
            pointer-events: auto; /* Clickable */
        }
        /* Overlay Left (Sign In Button) is hidden */
        .overlay-left {
            opacity: 0;
            z-index: 1;
            position: absolute;
            pointer-events: none; /* NOT Clickable (Important!) */
        }

        /* --- Active State (Sign Up Form is Active) --- */
        
        /* Move Sign In form down */
        .login-container.right-panel-active .sign-in-container {
            transform: translateY(100%); 
            opacity: 0;
        }
        
        /* Move Sign Up form up */
        .login-container.right-panel-active .sign-up-container {
            transform: translateY(0); 
            opacity: 1;
            z-index: 5;
        }

        .login-container.right-panel-active .overlay-container {
            transform: none; 
        }

        /* Swap Button Visibility */
        .login-container.right-panel-active .overlay-right {
            opacity: 0;
            z-index: 1;
            pointer-events: none; /* NOT Clickable when hidden */
        }
        .login-container.right-panel-active .overlay-left {
            opacity: 1;
            z-index: 2;
            pointer-events: auto; /* Clickable when visible */
        }
    }
/* Container for the dropdown */
.user-menu-dropdown {
    position: relative;
    display: inline-block;
}

/* The button that shows the Name */
.user-btn {
    background-color: transparent;
    color: #333; /* Dark text */
    padding: 10px 15px;
    font-size: 16px;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px; /* Space between icon and name */
    font-weight: 600;
}

/* Optional: Color the icon red to match your theme */
.user-btn i {
    color: #b71c1c; 
}

/* The hidden menu */
.dropdown-content {
    display: none; /* Hidden by default */
    position: absolute;
    right: 0; /* Align to the right side of the button */
    background-color: #fff;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1000;
    border-radius: 4px;
    overflow: hidden;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-size: 14px;
    text-align: left;
    transition: background 0.3s;
}

/* Change color on hover */
.dropdown-content a:hover {
    background-color: #f1f1f1;
    color: #b71c1c;
}

/* Show the menu on hover */
.user-menu-dropdown:hover .dropdown-content {
    display: block;
}