/* GLOBAL STYLES */
*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{
font-family:'Poppins',sans-serif;
background:#f8fafc;
overflow-x:hidden;
color:#1e293b;
line-height:1.7;
}

/* COLORS */
:root{
--primary:#FF5A1F;
--primary-light:#FF7A3D;
--dark:#111827;
--light:#ffffff;
--gray:#64748b;
--section:#F8FAFC;
}

/* CONTAINER */
.container{
position:relative;
z-index:2;
}

section{
padding:110px 0;
position:relative;
overflow:hidden;
}

/*  IMAGES */
img{
max-width:100%;
display:block;
}

/* LINKS */
a{
text-decoration:none;
transition:.4s;
}

/* BUTTON RESET */
button{
border:none;
outline:none;
cursor:pointer;
}
/* GLOBAL STYLES */
*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{
font-family:'Poppins',sans-serif;
background:#f8fafc;
overflow-x:hidden;
color:#1e293b;
line-height:1.7;
}

/* COLORS */
:root{
--primary:#FF5A1F;
--primary-light:#FF7A3D;
--dark:#111827;
--light:#ffffff;
--gray:#64748b;
--section:#F8FAFC;
}

/* CONTAINER */
.container{
position:relative;
z-index:2;
}

section{
padding:110px 0;
position:relative;
overflow:hidden;
}

/* IMAGES */
img{
max-width:100%;
display:block;
}

/* LINKS */
a{
text-decoration:none;
transition:.4s;
}

/* BUTTON RESET */
button{
border:none;
outline:none;
cursor:pointer;
}

/* NAVBAR */
.custom-navbar{
height:90px;
background:rgba(10,15,25,.92);
backdrop-filter:blur(18px);
-webkit-backdrop-filter:blur(18px);
box-shadow:0 10px 35px rgba(0,0,0,.35);
padding:0;
transition:.4s;
z-index:999;
}

.navbar .container{
display:flex;
align-items:center;
justify-content:space-between;
}

.navbar-brand{
display:flex;
align-items:center;
}

.logo-img{
height:68px;
width:auto;
transition:.4s;
object-fit:contain;
}

.navbar-brand:hover .logo-img{
transform:scale(1.05);
}

.navbar-nav{
display:flex;
align-items:center;
gap:10px;
}

.nav-link{
position:relative;
color:#fff !important;
font-size:16px;
font-weight:500;
padding:8px 18px !important;
transition:.35s;
}

.nav-link:hover{
color:#FF5A1F !important;
}

.nav-link.active{
color:#FF5A1F !important;
}

.nav-link::after{
content:"";
position:absolute;
left:50%;
bottom:-6px;
width:0;
height:3px;
background:#FF5A1F;
border-radius:20px;
transform:translateX(-50%);
transition:.35s;
}

.nav-link:hover::after,
.nav-link.active::after{
width:70%;
}

.navbar-toggler{
border:none;
box-shadow:none !important;
}

.navbar-toggler:focus{
box-shadow:none;
}
.navbar-toggler-icon{
filter:brightness(10);
}
/*==========================================
HERO
==========================================*/

.hero{

position:relative;

min-height:100vh;

display:flex;

align-items:center;

justify-content:center;

background:

linear-gradient(rgba(10,15,25,.72),

rgba(10,15,25,.82)),

url("../assets/about/hero.jpeg");

background-size:cover;

background-position:center;

background-attachment:fixed;

overflow:hidden;

}

.hero-overlay{

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

background:

radial-gradient(circle at center,

rgba(255,90,31,.12),

transparent 55%);

z-index:1;

}

.hero .container{

position:relative;

z-index:2;

}

.hero-badge{

display:inline-block;

padding:8px 20px;

background:rgba(255,90,31,.15);

color:#FF5A1F;

border:1px solid rgba(255,90,31,.4);

border-radius:40px;

font-size:14px;

font-weight:600;

letter-spacing:2px;

margin-bottom:25px;

}

.hero-title{

font-size:72px;

font-weight:800;

color:#fff;

line-height:1.1;

margin-bottom:30px;

}

.hero-title span{

display:block;

color:#fff;

}

.hero-text{

max-width:700px;

margin:auto;

font-size:19px;

color:#ddd;

line-height:1.8;

margin-bottom:55px;

}

.hero-buttons{

display:flex;

justify-content:center;

margin-bottom:90px;

}
/*==========================================
HERO BUTTON
==========================================*/
/* 
.hero-btn{

display:inline-flex;

align-items:center;

justify-content:space-between;

gap:30px;

min-width:230px;

padding:18px 18px 18px 34px;

border-radius:60px;

background:rgba(255,255,255,.08);

border:1px solid rgba(255,255,255,.2);

/* backdrop-filter:blur(12px); */

/* text-decoration:none;

color:#fff;

font-weight:600;

transition:.45s;

} */ 
 .hero-btn{

display:inline-flex;

align-items:center;

justify-content:space-between;

gap:18px;

min-width:190px;

height:52px;

padding:0 8px 0 22px;

background:rgba(255,255,255,.08);

border:1px solid rgba(255,255,255,.20);

border-radius:12px;

backdrop-filter:blur(12px);

text-decoration:none;

color:#fff;

font-size:15px;

font-weight:600;

transition:.4s ease;

}

.hero-btn i{

width:38px;

height:38px;

display:flex;

align-items:center;

justify-content:center;
/* this is for the about us button arrow orange circle  */
/* background:linear-gradient(135deg,#FF5A1F,#FF7A3D); */
/* border-radius:50%; */
/* box-shadow:0 12px 25px rgba(255,90,31,.35); */

transition:.4s;

}

.hero-btn:hover{

background:#fff;

color:#111827;

transform:translateY(-5px);

}

.hero-btn:hover i{

transform:translateX(5px);

}
/*==========================================
BOTTOM STATS
==========================================*/

.hero-bottom{

position:absolute;

bottom:0;

width:100%;

padding:28px 0;

background:rgba(0,0,0,.35);

backdrop-filter:blur(12px);

z-index:2;

}

.hero-stats{

display:flex;

justify-content:center;

align-items:center;

gap:60px;

}

.stat{

text-align:center;

}

.stat h2{

font-size:44px;

font-weight:800;

color:#fff;

margin-bottom:8px;

}

.stat p{

margin:0;

font-size:16px;

color:#ddd;

}

.divider{

width:1px;

height:55px;

background:rgba(255,255,255,.18);

}

/* BUTTON */
.btn-orange{
display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;
padding:16px 38px;
background:linear-gradient(135deg,#FF5A1F,#FF7A3D);
color:#fff;
font-size:16px;
font-weight:600;
text-decoration:none;
border-radius:50px;
box-shadow:0 18px 40px rgba(255,90,31,.35);
transition:.4s;
position:relative;
overflow:hidden;
}

.btn-orange::before{
content:"";
position:absolute;
left:-100%;
top:0;
width:100%;
height:100%;
background:rgba(255,255,255,.18);
transform:skewX(-30deg);
transition:.7s;
}
.btn-orange:hover::before{
left:120%;
}

.btn-orange:hover{
transform:translateY(-6px);
box-shadow:0 28px 55px rgba(255,90,31,.45);
color:#fff;
}
@media(max-width:991px){

.hero{

background-attachment:scroll;

}

.hero-title{

font-size:50px;

}

.hero-text{

font-size:17px;

}

.hero-stats{

flex-direction:column;

gap:25px;

}

.divider{

display:none;

}

.hero-bottom{

position:relative;

margin-top:50px;

}

}

/*==================================
ABOUT SECTION
==================================*/
.about-section{
background:#fff;
padding:120px 0;
}

.about-image{
position:relative;
display:flex;
justify-content:center;
align-items:center;
}

.about-image img{
width:100%;
max-width:620px;
height:550px;
object-fit:cover;
border-radius:30px;
box-shadow:
0 35px 80px rgba(0,0,0,.18);
transition:.5s;
}

.about-image:hover img{
transform:scale(1.03);
}

.experience-card{
position:absolute;
bottom:40px;
right:-20px;
background:linear-gradient(135deg,#FF5A1F,#FF7A3D);
padding:25px;
width:180px;
border-radius:20px;
text-align:center;
color:#fff;
box-shadow:
0 20px 45px rgba(255,90,31,.35);
}

.experience-card h2{
font-size:42px;
font-weight:800;
margin-bottom:5px;
}

.section-tag{
display:inline-block;
padding:10px 20px;
background:rgba(255,90,31,.10);
color:#FF5A1F;
border-radius:50px;
font-size:14px;
font-weight:700;
letter-spacing:1px;
margin-bottom:20px;
}

.section-heading{
font-size:46px;
font-weight:800;
color:#111827;
margin-bottom:25px;
line-height:1.2;
}

.section-description{
font-size:17px;
line-height:1.9;
color:#64748b;
margin-bottom:35px;
}

.about-features{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
margin-bottom:40px;
}

.feature-item{
display:flex;
align-items:center;
gap:15px;
padding:18px;
background:#fff;
border-radius:16px;
box-shadow:0 10px 25px rgba(0,0,0,.08);
transition:.4s;
}

.feature-item:hover{
transform:translateY(-8px);
box-shadow:0 20px 40px rgba(255,90,31,.18);
}

.feature-item i{
width:50px;
height:50px;
background:#FF5A1F;
color:#fff;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
font-size:18px;
flex-shrink:0;
}
.feature-item span{
font-weight:600;
color:#111827;
}
/* STATISTICS */
.stats-section{
padding:120px 0;
background:#111827;
position:relative;
overflow:hidden;
}

.stats-section::before{
content:"";
position:absolute;
top:-180px;
right:-180px;
width:450px;
height:450px;
background:rgba(255,90,31,.12);
filter:blur(120px);
border-radius:50%;
}

.stat-card{
background:rgba(255,255,255,.06);
backdrop-filter:blur(18px);
border:1px solid rgba(255,255,255,.08);
border-radius:25px;
padding:45px 30px;
text-align:center;
transition:.45s;
height:100%;
}

.stat-card:hover{
transform:translateY(-12px);
background:rgba(255,90,31,.15);
box-shadow:0 25px 50px rgba(255,90,31,.20);
}

.stat-card i{
width:80px;
height:80px;
background:linear-gradient(135deg,#FF5A1F,#FF7A3D);
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
margin:0 auto 25px;
color:#fff;
font-size:30px;
box-shadow:0 12px 30px rgba(255,90,31,.35);
}
.stat-card h2{
font-size:52px;
font-weight:800;
color:#fff;
margin-bottom:10px;
}

.stat-card p{
font-size:17px;
color:#d1d5db;
margin:0;
}
/* FEATURED PRODUCTS */
.products-section{
padding:120px 0;
background:#111827;
position:relative;
overflow:hidden;
}
.products-section::before{
content:"";
position:absolute;
top:-150px;
left:-120px;
width:420px;
height:420px;
background:rgba(255,90,31,.12);
filter:blur(120px);
border-radius:50%;
}
.products-section::after{
content:"";
position:absolute;
bottom:-180px;
right:-120px;
width:420px;
height:420px;
background:rgba(255,90,31,.10);
filter:blur(120px);
border-radius:50%;
}
.products-section .section-heading{
color:#fff;
}
.products-section .section-description{
color:#d1d5db;
}
/* CARD */
.product-card{
background:#fff;
border-radius:28px;
overflow:hidden;
height:100%;
display:flex;
flex-direction:column;
justify-content:space-between;
transition:.45s;
box-shadow:0 20px 45px rgba(0,0,0,.15);
position:relative;
}
.product-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:5px;
background:linear-gradient(90deg,#FF5A1F,#FF7A3D);
}
.product-card:hover{
transform:translateY(-12px);
box-shadow:
0 35px 65px rgba(255,90,31,.28);
}
/* IMAGE */
.product-image{
height:320px;
display:flex;
align-items:center;
justify-content:center;
padding:35px;
background:#ffffff;
overflow:hidden;
}
.product-image img{
max-width:100%;
max-height:250px;
object-fit:contain;
transition:.5s;
}
.product-card:hover .product-image img{
transform:scale(1.08);
}
/* CONTENT */
.product-content{
padding:30px;
text-align:center;
}
.product-content h4{
font-size:26px;
font-weight:700;
margin-bottom:25px;
color:#111827;
}
/* BUTTON */
.product-content .btn-orange{
width:100%;
justify-content:center;
padding:15px 0;
font-size:16px;
}
/*==================================
CTA SECTION
==================================*/

.cta-section{

padding:120px 0;

background:#f8fafc;

}

.cta-box{

background:linear-gradient(135deg,#FF5A1F,#FF7A3D);

padding:70px;

border-radius:35px;

position:relative;

overflow:hidden;

box-shadow:

0 30px 70px rgba(255,90,31,.30);

}

.cta-box::before{

content:"";

position:absolute;

width:350px;

height:350px;

background:rgba(255,255,255,.08);

border-radius:50%;

top:-120px;

right:-120px;

}

.cta-box h2{

font-size:46px;

font-weight:800;

color:#fff;

margin:20px 0;

}

.cta-box p{
font-size:18px;
line-height:1.8;
color:#fff;
opacity:.92;
max-width:700px;
margin-bottom:0;
}
.cta-box .section-tag{
background:rgba(255,255,255,.15);
color:#fff;
border:1px solid rgba(255,255,255,.2);
}
.cta-box .btn-orange{
background:#fff;
color:#FF5A1F;
box-shadow:none;
}
.cta-box .btn-orange:hover{
background:#111827;
color:#fff;
transform:translateY(-6px);
}
/*==================================
FOOTER
==================================*/

.footer{

background:#111827;

padding:90px 0 30px;

color:#d1d5db;

}

.footer-logo{

height:70px;

margin-bottom:25px;

}

.footer-text{

line-height:1.9;

margin-bottom:30px;

color:#9ca3af;

}

.footer h4{

color:#fff;

margin-bottom:25px;

font-weight:700;

}

.footer ul{

list-style:none;

padding:0;

margin:0;

}

.footer ul li{

margin-bottom:15px;

}

.footer ul li a{

color:#9ca3af;

text-decoration:none;

transition:.3s;

}

.footer ul li a:hover{

color:#FF5A1F;

padding-left:8px;

}

.contact-info li{

display:flex;

gap:12px;

align-items:flex-start;

}

.contact-info i{

color:#FF5A1F;

margin-top:5px;

}

.footer-social{

display:flex;

gap:15px;

margin-top:20px;

}

.footer-social a{

width:45px;

height:45px;

background:#1f2937;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

color:#fff;

transition:.35s;

}

.footer-social a:hover{

background:#FF5A1F;

transform:translateY(-5px);

}

.footer hr{

margin:50px 0 25px;

border-color:rgba(255,255,255,.08);

}

.footer-bottom{

text-align:center;

color:#9ca3af;

}

@keyframes floating{
0%{
transform:translateY(0);
}
50%{
transform:translateY(-18px);
}
100%{
transform:translateY(0);
}
}
@keyframes pulseGlow{
0%{
transform:scale(1);
opacity:.8;
}
50%{
transform:scale(1.08);
opacity:1;
}
100%{
transform:scale(1);
opacity:.8;
}
}

.phone-link {
    color: inherit;
    text-decoration: none;
}

.phone-link:hover {
    text-decoration: underline;
}

.email-link {
    color: inherit;
    text-decoration: none;
}

.email-link:hover {
    text-decoration: underline;
}