/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Template: twentytwentyone
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Tags: one-column,accessibility-ready,custom-colors,custom-menu,custom-logo,editor-style,featured-images,footer-widgets,block-patterns,rtl-language-support,sticky-post,threaded-comments,translation-ready,blog,portfolio
Version: 2.6.1764311150
Updated: 2025-11-28 06:25:50

*/



:root {
  --primary: #6a1a1e;
  --secondary: #efa535;
  --light: #fff;
  --dark: #000;
  --text-color: #333;
  --font-plus:'Plus Jakarta Sans', sans-serif;

}
body {
    font-family: 'Raleway', sans-serif !important;
}
p{font-size: 16px; line-height: 24px; color: var(--text-color);}
img{max-width: 100%; height: auto;}
a{text-decoration: none !important; transition: all ease 0.4s;}
.container{max-width: 1150px !important;}
.section-padding{padding: 50px 0px;}
header nav{padding: 14px 0px; display: flex; align-items: center; gap: 20px; justify-content: space-between;}
header .phone-cont{
    display: flex; gap: 10px;
    align-items: center; font-family: var(--font-plus);
}
header .phone-cont:hover .phone-no{color: var(--primary);}
header .hot-line{font-size: 14px; color: var(--primary); font-weight: 600;line-height: 14px;}
header .phone-icon{display: block; width: 45px; height: 45px; color: var(--primary); border: 2px solid var(--primary); border-radius: 50%; display: grid; place-items: center; font-size: 24px;}
header  .phone-no{color: var(--dark); font-weight: 600; font-size: 16px;}

.hero-banner{background: url("./assets/images/hero-banner.jpg"); background-size: cover; padding: 80px 0px;}
.tag-banner { background: var(--primary);color: var(--light);font-size: 18px;font-weight: 700; padding: 10px 25px;display: inline-block;font-family: var(--font-plus); position: relative;clip-path: polygon(10% 0, 100% 0, 90% 100%, 0% 100%); margin-bottom: 30px;}
.hero-banner h1{font-size: 56px; font-weight: 800; color: var(--light); font-family: var(--font-plus); margin-bottom: 30px;}
.hero-banner h1 span{color: var(--secondary);}
.hero-banner p{font-size: 18px; line-height: 25px; color: var(--light); font-weight: 500; margin-bottom: 0px;}

.section-heading{font-size: 40px; color: var(--dark); font-family: var(--font-plus);font-weight: 700; position: relative; margin-bottom: 50px;}
.section-heading::before{position: absolute; content: ""; width: 80px; height: 4px; background: var(--primary); bottom:-20px;}
.section-heading.text-center::before{left: 50%; transform: translateX(-50%);}

.our-menu img{width: 100%;}
.our-menu .section-heading{color:#fff; position: absolute; top: 4%; left: 50%; transform: translateX(-50%);}
.our-menu .section-heading::before{background: #fff;}
.gallery_img { overflow: hidden;}
.gallery_img img{ transition: ease all 0.4s;}
.gallery_img img:hover{  scale: 1.1;}

footer{
    background: var(--primary);
}
footer .copy-right{border-top: 1px solid #932127; padding: 10px; color: #fff; text-align: center;}


footer .phone-cont{
    display: flex; gap: 10px; font-family: var(--font-plus);
}
footer .phone-cont:hover .phone-no{color: var(--secondary);}
footer .hot-line{font-size: 14px; color: var(--light); font-weight: 400;line-height: auto;}
footer .phone-icon{display: block; width: 45px; height: 45px; color: var(--light);  border-radius: 8px; display: grid; place-items: center; font-size: 24px; background: var(--secondary);}
footer  .phone-no{color: var(--light); font-weight: 400; font-size: 16px;}


@media screen and (max-width: 480px){
    .hero-banner h1{font-size: 36px;}
    .hero-banner .feel-like-home {width: 50%;}
    .our-menu .section-heading::before{ background: var(--primary);}
    header nav{padding: 8px 0px;}
    header .logo img{width: 66%;}
    header .phone-icon{display: block; width: 35px; height: 35px; color: var(--primary); border: 2px solid var(--primary); border-radius: 50%; display: grid; place-items: center; font-size: 18px;}
    header .hot-line{font-size: 12px;}
    header  .phone-no{font-size: 14px;}
    .hero-banner{ padding: 40px 0px;}
    .section-heading{font-size: 32px; text-align: center;}
    .section-heading::before{left: 50%; transform: translateX(-50%);}
}