     
body { font-family: 'Inter', sans-serif; background-color: #fdfdef !important; color: #000; overflow-x: hidden; }
section{ overflow-x: hidden;}
h1, h2, h3, h4, h5, h6{font-family: "Bungee", sans-serif;color: #2457A7 !important;text-transform: uppercase;font-weight: 800 !important;}
header{ position: relative;}
header .logo span{position: absolute;top: 15px;}
header nav a{font-family: "Bungee", sans-serif;font-size: 14px;/* font-weight: normal !important; */}
header nav a:hover{color: #2457A7 !important; font-weight: 800;}

.order-online{font-family: "Bungee", sans-serif;}
.typing { display: inline-block;}        

.banner-cta{/* background: #FEE354; */margin-top: 64px;padding: 120px 0 16px;position: relative;}
.banner-cta h1{font-size: 80px;color: #EA2128;text-transform: uppercase;line-height: 88px;}
.banner-cta p{color: #000;max-width: 660px;margin: 0px auto;}
        
.btn-default{background: #EA2128 !important;padding: 11px 24px !important;border-radius: 12px !important;}
.btn-default:hover{background: transparent !important;border:1px #EA2128 solid !important; color:#EA2128 !important;fill: #EA2128;}
.btn-default:hover svg{ fill: #EA2128;}

.pattern{height: 0;position: absolute;bottom: 0;}
.pattern img{ position: absolute; bottom: 0; left: 0;}

.top-bg{background: url(../img/bg.jpg) top no-repeat;width: 100%;background-size: contain;}
.bg-dark-burger { background: #FEE354; background-position: center; background-size: cover;        }
.nav-link.active { color: #f5c642; border-bottom: 2px solid #f5c642; }
.tab-btn.active { background-color: #fcf1d0; color: #ea2128; border-radius: 12px; }
.tab-btn { transition: all 0.3s ease; }
.tab-btn:hover { background-color: #fcf1d0; color: #000; border-radius: 12px;        }
.animate-loop-ltr { animation: loop-ltr 40s linear infinite; }
.animate-loop-rtl { animation: loop-rtl 40s linear infinite; }

@keyframes loop-ltr {
            0% { transform: translateX(0); }
            100% { transform: translateX(-100%); }
        }
@keyframes loop-rtl {
            0% { transform: translateX(-100%); }
            100% { transform: translateX(0); }
        }

.gallery .whitespace-nowrap{padding: 8px 0;}        
.gallery-item {display: inline-block;width: 300px;flex-shrink: 0;margin-right: 1.5rem;border-radius: 24px;overflow: hidden;box-shadow: 3px 3px 0px #00000008;}
.gallery-item img { transition: transform 0.3s ease; }
.gallery-item:hover img { transform: scale(1.05); }
.map-section { }
.burger-ingredient { position: absolute; width: 100%; display: flex;   }
.burger-ingredient img { max-width: 100%; height: auto; transform-origin: center bottom; margin: 0px auto;        }

.burgers-more{}
.burgers-more button{   font-size: 14px;    /* margin-top: 26px; */    border: 0;    background: transparent;    padding: 12px;    min-width: 140px;}
.burgers-more button img{    display: block;    margin: 12px auto !important;} 
.tab-content{    margin-top: 40px;}
.tab-content .col{ margin:0;}
.tab-content h3{   color: #000000 !important;    font-weight: normal !important;    margin: 0px;}
.tab-content .badge{    margin: 0px !important;    border-radius: 22px;}
.tab-content .bg-success{   background: hsl(112.43deg 98.23% 22.16% / 20%) !important;   color: #0F7001;}
.tab-content .bg-danger{    background: hsl(357.12deg 100% 44.9% / 20%) !important;    color: #E5000B;}
.tab-content .text-black{font-size: 24px !important;color: #EA2128 !important;font-weight: 900 !important;min-width: 64px;text-align: right;}

footer h5{   font-family: 'Inter', sans-serif;    color: #fff !important;    /* font-size: 18px !important; */}
.ftr-logo{    position: relative;}
.ftr-logo::after{content: '';background: #ffffff29;height: 1px;position: absolute;width: 43%;right: 0;top: 48px;}
.ftr-logo::before{content: '';background: #ffffff29;height: 1px;position: absolute;width: 43%;left: 0;top: 48px;}

.py-8{ padding: 6rem 0;}
.ml-10{ margin-left: 10rem;}

/* Mobile-first adjustments for the burger ingredients */
        @media (max-width: 767px) {
            body, section{ overflow-x: hidden;}
            .burger-stack {min-height: 220px;}
            .burger-ingredient { transform: scale(0.7);  }
            .logo img{ width: 100px;}
            #top-bun {top: 0%;}
            #lettuce {top: 24%;}
            #tomato {top: 52%;}
            #pickles {top: 65%;}
            #patty {top: 76%;}
            #salad {top: 89%;}
            #bottom-bun {top: 107%;}
            .banner-cta h1{ font-size: 32px; line-height: 40px;}
            .top-bg{background-size: 250%;}
            header { width: 100%; }
            .burger-ingredient{ width: 124%; left: -12%;}
            .burgers-more .gap-3{gap: 0.2rem !important;}
            .burgers-more button{min-width: 56px;padding: 4px;font-size: 10px;}
            .burgers-more button img{width: 42px;margin: 4px auto !important;}
            .tab-content h3{font-size: 16px !important;}
            .tab-content .text-black{font-size: 18px !important;min-width: 48px;}
            .burgers-more .p-3 {padding: 0.8rem 0 !important;margin: 0 -8px;}
            .gallery h4 {font-size: 24px !important; padding: 0 24px; }
            .gallery-item{width: 176px;margin-right: 0.5rem;border-radius: 16px;}
            .order-online{ margin-right: 8px;}
.py-8{ padding: 2rem 0;}
        }
        /* Tablet and desktop adjustments */
        @media (min-width: 768px) {
            .burger-stack {
                min-height: 900px;
            }
            #top-bun {top: 3%;}
            #lettuce {top: 20%;}
            #tomato {top: 36%;}
            #pickles {top: 45%;}
            #patty {top: 54%;}
            #salad {top: 63%;}
            #bottom-bun {top: 75%;}
        }