
body{
font-family:Poppins;
background:#0f0f0f;
color:white;
padding-top:110px;
}

/* prevent content hiding behind fixed navbar */
 


/* top bar */

.top-bar{

background:#000;
color:#fff;
font-size:14px;
padding:8px 0;
z-index:1030;

}


/* navbar */

.custom-navbar{

top:36px;
background:#111;
box-shadow:0 5px 20px rgba(0,0,0,0.3);
z-index:1029;

}


.nav-link{

color:white !important;

}

.nav-link:hover{

color:#ff4d4d !important;

}

.navbar-toggler{
border-color:white;
}

.navbar-toggler-icon{
filter:invert(1);
}
/* icons */

.top-social img{
height:18px;
/* filter:brightness(0) invert(1); */
margin-left:10px;
}

.top-social a{
color:white;
margin-left:10px;
}

/* NAVBAR */

.navbar{
background:#111;
}

.nav-link{
color:#fff !important;
margin:0 15px;
}

.nav-link:hover{
color:#ff4d4d !important;
}


/* HERO */

.hero{
padding:80px 0;
}

.hero h1{
font-size:60px;
font-weight:700;
}

.hero span{
color:#ff4d4d;
}

.order-btn{
background:#ff4d4d;
border:none;
padding:12px 30px;
border-radius:30px;
color:white;
margin-top:20px;
}

.hero-card{

background:linear-gradient(135deg,#ff4d4d,#7a0000);

border-radius:30px;

padding:30px;

box-shadow:0 20px 60px rgba(255,0,0,0.3);

}


.hero-card img{
width:100%;
}


/* PRODUCT CARD */

.product-card{

background:#1a1a1a;

border-radius:20px;

padding:20px;

transition:.3s;

}

.product-card:hover{

transform:translateY(-10px);

box-shadow:0 20px 40px rgba(255,0,0,0.3);

}

.product-card img{

height:180px;

width:100%;

object-fit:cover;

border-radius:15px;

}

.price{

color:#ff4d4d;

font-weight:bold;

}


/* OFFER */

.offer img{

width:100%;

border-radius:20px;

height:100%;

object-fit:cover;

}


/* STORY */

.story img{

width:100%;

border-radius:30px;

}


/* FOOTER */

footer{

background:#111;

padding:40px;

margin-top:50px;

}

.offer-card{

position:relative;
overflow:hidden;
border-radius:20px;
cursor:pointer;

}

.offer-card img{

width:100%;
height:100%;
object-fit:cover;
transition:0.5s;

}

.offer-card.big{

height:320px;

}

.offer-card.small{

height:150px;

}


.offer-card:hover img{

transform:scale(1.1);

}


/* overlay */

.offer-overlay{

position:absolute;
top:0;
left:0;
width:100%;
height:100%;

background:linear-gradient(to right, rgba(0,0,0,0.7), rgba(0,0,0,0.1));

color:white;

display:flex;
flex-direction:column;
justify-content:center;

padding:30px;

}


.offer-overlay h2,
.offer-overlay h4{

font-weight:700;

}

.offer-overlay button{

width:120px;

margin-top:10px;

border-radius:20px;

}
/* IMAGE CARD */

.story-card{

position:relative;
background:linear-gradient(135deg,#ff4d4d,#7a0000);
padding:20px;
border-radius:30px;

}

.story-card img{

width:100%;
border-radius:20px;

}


/* FLOATING CARDS */

.floating-card{

position:absolute;
background:white;
color:black;
padding:10px 15px;
border-radius:12px;
box-shadow:0 10px 30px rgba(0,0,0,0.2);

}

.card1{

top:20px;
left:-20px;

}

.card2{

bottom:20px;
right:-20px;

}


/* TEXT */

.section-subtitle{

color:#ff4d4d;
font-weight:600;

}

.section-title{

font-size:40px;
font-weight:700;

}

.section-title span{

color:#ff4d4d;

}

.section-desc{

color:#aaa;
margin-top:15px;

}


/* STATS */

.stat-box{

background:#1a1a1a;
padding:15px;
border-radius:15px;
text-align:center;
transition:.3s;

}

.stat-box:hover{

background:#ff4d4d;
transform:translateY(-5px);

}

.stat-box h4{

margin:0;
font-weight:700;

}

.stat-box p{

margin:0;
font-size:14px;

}

.hero-section{

padding:80px 0;

background:
linear-gradient(135deg,#0f0f0f,#1a1a1a);

color:white;

}


/* TAG */

.hero-tag{

color:#ff4d4d;
font-weight:600;

}


/* TITLE */

.hero-title{

font-size:60px;
font-weight:700;
line-height:1.2;

}

.hero-title span{

color:#ff4d4d;

}


/* DESC */

.hero-desc{

color:#aaa;
margin-top:15px;
max-width:450px;

}


/* BUTTONS */

.hero-buttons{

margin-top:25px;
display:flex;
gap:15px;

}

.btn-order{

background:#ff4d4d;
border:none;
padding:12px 30px;
border-radius:30px;
color:white;
font-weight:600;

}

.btn-menu{

background:transparent;
border:1px solid #ff4d4d;
padding:12px 30px;
border-radius:30px;
color:#ff4d4d;

}


/* INFO */

.hero-info{

display:flex;
gap:30px;
margin-top:30px;

}

.hero-info h4{

margin:0;
color:#ff4d4d;

}

.hero-info span{

font-size:14px;
color:#aaa;

}


/* IMAGE BOX */

.hero-image-box{

position:relative;
background:linear-gradient(135deg,#ff4d4d,#7a0000);
padding:20px;
border-radius:30px;
box-shadow:0 30px 60px rgba(255,0,0,0.3);

}

.hero-image-box img{

width:100%;
border-radius:20px;

}


/* FLOATING BADGES */

.floating-badge{

position:absolute;
top:20px;
left:-20px;
background:white;
color:black;
padding:8px 15px;
border-radius:20px;
font-weight:600;

}

.floating-price{

position:absolute;
bottom:20px;
right:-20px;
background:#ff4d4d;
padding:10px 20px;
border-radius:20px;
font-weight:600;

}

.footer{

background:#0f0f0f;
color:white;
padding:60px 0 20px;

}

.footer-logo{

color:#ff4d4d;
font-weight:700;

}

.footer-desc{

color:#aaa;
margin-top:10px;

}


/* LINKS */

.footer-title{

margin-bottom:15px;

}

.footer-links{

list-style:none;
padding:0;

}

.footer-links li{

margin-bottom:8px;

}

.footer-links a{

color:#aaa;
text-decoration:none;
transition:.3s;

}

.footer-links a:hover{

color:#ff4d4d;

}


/* SOCIAL */

.social-icons a{

color:white;
margin-right:15px;
font-size:20px;
transition:.3s;

}

.social-icons a:hover{

color:#ff4d4d;

}


/* BUTTON */

.footer-btn{

background:#ff4d4d;
border:none;
width:100%;
color:white;

}


/* LINE */

.footer-line{

border-color:#222;
margin:30px 0;

}


/* BOTTOM */

.footer-bottom{

display:flex;
justify-content:space-between;
color:#777;
font-size:14px;

}


@media(max-width:768px){

.footer-bottom{

flex-direction:column;
text-align:center;
gap:10px;

}

}
 .gallery-section{

padding:60px 0;

}

.gallery-title{

font-size:40px;
font-weight:700;

}

.gallery-title span{

color:#ff4d4d;

}

.gallery-subtitle{

color:#aaa;

}


/* CARD */

.gallery-card{

position:relative;
overflow:hidden;
border-radius:20px;
cursor:pointer;

}

.gallery-card img{

width:100%;
height:280px;
object-fit:cover;
transition:0.5s;

}


/* hover zoom */

.gallery-card:hover img{

transform:scale(1.1);

}


/* overlay */

.gallery-overlay{

position:absolute;
bottom:0;
left:0;
width:100%;
padding:20px;

background:linear-gradient(transparent,rgba(0,0,0,0.8));

color:white;
opacity:0;
transition:0.4s;

}

.gallery-card:hover .gallery-overlay{

opacity:1;

}