*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

body{
background:#f4f2ea;
overflow-x:hidden;
scroll-behavior:smooth;
}

/* NAVBAR */

/* ===== HERO FIX (FINAL CLEAN) ===== */

header{
height:auto;   /* change */
padding:10px 0;
}

.hero{
margin-top:90px;
height:100vh;
background:url(images/hero.jpg) center/cover no-repeat;
display:flex;
align-items:center;
justify-content:center;
text-align:left;
position:relative;
color:white;
padding:80px 80px 80px;
}

/* MOBILE FIX */
@media(max-width:768px){

header{
padding:8px 10px;
}

.logo{
height:35px;
}

nav{
margin-top:5px;
}

nav a{
font-size:13px;
margin:4px 8px;
}

.nav-cta{
padding:8px 14px;
font-size:13px;
}

}
}

@media(max-width:480px){

header{
height:120px;
}

.hero{
margin-top:80px;
padding:70px 15px 50px;
}

}
.logo{
height:50px;
}

nav a{
margin-left:30px;
text-decoration:none;
color:#333;
font-weight:500;
transition:0.3s;
position:relative;
}

nav a:hover{
color:#f2b43d;
}

nav a::after{
content:"";
position:absolute;
left:0;
right:0;
bottom:-6px;
margin:auto;
width:0;
height:2px;
border-radius:999px;
background:linear-gradient(90deg,#ffd000,#ff8c00);
transition:width 0.25s ease-out;
}

nav a:hover::after{
width:90%;
}

.nav-cta{
padding:10px 22px;
border-radius:999px;
background:#ffd000;
color:#000;
font-weight:600;
box-shadow:0 8px 20px rgba(0,0,0,0.15);
}

.nav-cta:hover{
background:#ffb700;
color:#000;
}

/* HERO */



.overlay{
position:absolute;
width:100%;
height:100%;
background:linear-gradient(
120deg,
rgba(107,46,15,0.85),
rgba(227,164,0,0.75)
);
backdrop-filter:blur(2px);
}

.hero-inner{
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
gap:60px;
width:100%;
max-width:1200px;
z-index:1;
}

.hero-left{
flex:1.1;
min-width:0;
}

.hero-right{
flex:0.9;
min-width:260px;
display:flex;
justify-content:flex-end;
}

.hero-text{
position:relative;
max-width:620px;
}

.hero h1{
font-size:60px;
animation:glow 3s infinite alternate;
}

.hero span{
color:#ffd000;
}

@keyframes glow{
0%{text-shadow:0 0 5px #ffd000;}
100%{text-shadow:0 0 25px #ffd000;}
}

.tagline{
margin:10px 0;
font-weight:600;
}

.desc{
margin-bottom:20px;
}

.hero-stats{
margin-top:30px;
display:flex;
flex-wrap:wrap;
gap:18px 28px;
}

.stat{
display:flex;
flex-direction:column;
padding:4px 10px;
border-radius:10px;
background:rgba(0,0,0,0.35);
backdrop-filter:blur(4px);
border:1px solid rgba(255,255,255,0.08);
}

.stat-number{
font-weight:700;
font-size:20px;
}

.stat-label{
font-size:13px;
opacity:0.85;
}

.hero-mockup{
position:relative;
width:420px;
max-width:100%;
transform:translateY(18px);
}

.hero-screen{
position:relative;
background:radial-gradient(circle at 15% 0%,rgba(255,255,255,0.22),transparent 55%),
           radial-gradient(circle at 80% 20%,rgba(255,208,0,0.30),transparent 60%),
           rgba(10,6,2,0.96);
border-radius:18px 18px 10px 10px;
padding:18px 20px 20px;
box-shadow:0 30px 65px rgba(0,0,0,0.8);
border:1px solid rgba(255,255,255,0.12);
backdrop-filter:blur(3px);
}

.hero-screen-header{
display:flex;
gap:6px;
margin-bottom:14px;
}

.hero-screen-header span{
width:8px;
height:8px;
border-radius:50%;
background:rgba(255,255,255,0.25);
}

.hero-screen-body{
display:flex;
gap:14px;
}

.hero-screen-main{
flex:1.3;
display:flex;
flex-direction:column;
gap:10px;
}

.hero-screen-side{
flex:0.7;
display:flex;
flex-direction:column;
gap:8px;
}

.hero-graph-large{
position:relative;
height:82px;
border-radius:10px;
background:linear-gradient(135deg,#ffd000,#ff7a00);
box-shadow:0 16px 34px rgba(0,0,0,0.55);
overflow:hidden;
}

.hero-graph-line{
position:absolute;
inset:18px 12px auto 12px;
height:40px;
border-radius:999px;
background:linear-gradient(90deg,rgba(255,255,255,0.15),rgba(255,255,255,0.55));
mix-blend-mode:screen;
opacity:0.9;
}

.hero-graph-bars{
position:absolute;
bottom:8px;
left:10px;
right:10px;
display:flex;
align-items:flex-end;
gap:6px;
}

.hero-graph-bars span{
flex:1;
border-radius:999px;
background:rgba(0,0,0,0.22);
}

.hero-graph-bars span:nth-child(1){height:16px;}
.hero-graph-bars span:nth-child(2){height:26px;}
.hero-graph-bars span:nth-child(3){height:34px;}
.hero-graph-bars span:nth-child(4){height:22px;}

.hero-metric-row{
display:flex;
gap:10px;
margin-top:4px;
}

.hero-metric{
flex:1;
padding:6px 8px;
border-radius:8px;
background:rgba(0,0,0,0.45);
border:1px solid rgba(255,255,255,0.08);
}

.metric-label{
display:block;
font-size:9px;
opacity:0.7;
}

.metric-value{
font-size:13px;
font-weight:600;
}

.side-card{
border-radius:10px;
background:linear-gradient(135deg,#ffffff,#ffd000);
opacity:0.9;
box-shadow:0 10px 24px rgba(0,0,0,0.6);
}

.side-card.big{height:46px;}
.side-card.mid{height:34px; opacity:0.85;}
.side-card.small{height:26px; opacity:0.8;}

.hero-laptop-base{
margin:16px auto 0;
width:96%;
height:32px;
border-radius:0 0 28px 28px;
background:linear-gradient(180deg,#f9e7c3,#cda46d);
box-shadow:0 24px 45px rgba(0,0,0,0.9);
position:relative;
overflow:hidden;
}

.hero-laptop-base::before{
content:"";
position:absolute;
inset:6px 16px;
border-radius:20px;
background:radial-gradient(circle at 50% 0%,rgba(255,255,255,0.55),transparent 60%);
opacity:0.7;
}

.hero-rocket-wrap{
position:absolute;
right:-8px;
bottom:40px;
width:130px;
height:170px;
pointer-events:none;
}

.hero-cloud{
position:absolute;
bottom:6px;
left:16px;
width:100px;
height:50px;
background:radial-gradient(circle at 20% 40%,rgba(255,255,255,0.98),rgba(255,255,255,0)) ,
           radial-gradient(circle at 60% 30%,rgba(255,255,255,0.98),rgba(255,255,255,0)) ,
           radial-gradient(circle at 40% 70%,rgba(255,255,255,0.92),rgba(255,255,255,0));
filter:blur(1px);
opacity:0.96;
}

.hero-rocket{
position:absolute;
bottom:22px;
left:50px;
font-size:46px;
color:#ffd000;
text-shadow:0 0 18px rgba(255,184,0,0.9);
animation:rocketLaunch 3.5s ease-in-out infinite;
}

@keyframes rocketLaunch{
0%{ transform:translateY(0) scale(1); opacity:0; }
10%{ opacity:1; }
50%{ transform:translateY(-26px) scale(1.04); }
80%{ transform:translateY(-40px) scale(1.08); opacity:1; }
100%{ transform:translateY(-46px) scale(1.1); opacity:0; }
}

.hero-bottom-bar{
position:absolute;
left:50%;
bottom:28px;
transform:translateX(-50%);
display:flex;
gap:14px;
flex-wrap:wrap;
justify-content:center;
max-width:900px;
}

.hero-pill{
display:flex;
align-items:center;
gap:8px;
padding:8px 16px;
border-radius:999px;
background:rgba(255,255,255,0.08);
backdrop-filter:blur(8px);
border:1px solid rgba(255,255,255,0.18);
font-size:13px;
box-shadow:0 8px 20px rgba(0,0,0,0.45);
}

.hero-pill i{
font-size:16px;
color:#ffd000;
}

.btn{
padding:14px 30px;
border-radius:8px;
margin:10px;
text-decoration:none;
display:inline-block;
transition:0.3s;
}

.btn:hover{
transform:translateY(-3px);
box-shadow:0 8px 25px rgba(0,0,0,0.2);
}

.gold{
background:#ffd000;
color:black;
}

.gold:hover{
background:#ffb700;
}

.white{
background:white;
color:black;
}

/* BEES */

.bee{
position:absolute;
width:60px;
animation:fly 12s linear infinite;
}

.bee1{top:20%;left:-100px;}
.bee2{top:40%;left:-200px;animation-delay:3s;}
.bee3{top:70%;left:-150px;animation-delay:6s;}

@keyframes fly{

0%{transform:translateX(0);}
50%{transform:translateX(60vw) translateY(-40px);}
100%{transform:translateX(120vw);}
}

/* FLOATING ICONS */

.icon{
position:absolute;
font-size:35px;
animation:float 7s infinite ease-in-out, rotate 15s infinite linear;
}

.icon1{top:15%;left:20%;color:#ffd000;}
.icon2{top:35%;right:20%;color:#ff9f00;}
.icon3{top:60%;left:15%;color:#ffe066;}
.icon4{bottom:25%;right:30%;color:#ffcc00;}
.icon5{top:50%;right:10%;color:#ffae00;}

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

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

/* GOALS */

.goals{
padding:120px 80px;
text-align:center;
background:white;
}

.goals-grid{
display:flex;
gap:30px;
justify-content:center;
margin-top:40px;
flex-wrap:wrap;
}

.goal-card{
background:white;
padding:30px;
border-radius:12px;
box-shadow:0 5px 15px rgba(0,0,0,0.08);
width:260px;
transition:0.3s;
}

.goal-card:hover{
transform:translateY(-8px);
box-shadow:0 10px 30px rgba(0,0,0,0.15);
}

.goal-card i{
font-size:40px;
background:linear-gradient(45deg,#ffd000,#ff8c00);
-webkit-background-clip:text;
background-clip:text;
color:transparent;
margin-bottom:10px;
}
/* SERVICES */

/* SERVICES */

.services{
padding:120px 80px;
text-align:center;

background:linear-gradient(
135deg,
#6b2e0f,
#8a3a14
);

color:white;
}

.services h2{
color:white;
}

.service-desc{
color:#f5e6d8;
}

.services-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
margin-top:40px;
}

.service-card{
position:relative;
background:radial-gradient(circle at 0 0,rgba(255,255,255,0.08),transparent 55%),
           rgba(255,255,255,0.04);
padding:26px 22px 24px;
border-radius:16px;
border:1px solid rgba(242,180,61,0.7);
transition:transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, background 0.3s ease;
cursor:pointer;
text-align:center;
box-shadow:0 18px 40px rgba(0,0,0,0.25);
}

.service-card:hover{
transform:translateY(-10px);
box-shadow:0 26px 55px rgba(0,0,0,0.45);
border-color:#ffd000;
background:radial-gradient(circle at 0 0,rgba(255,208,0,0.16),transparent 55%),
           rgba(255,255,255,0.06);
}

.service-card i{
width:44px;
height:44px;
border-radius:14px;
display:inline-flex;
align-items:center;
justify-content:center;
font-size:24px;
color:#6b2e0f;
background:linear-gradient(135deg,#ffd000,#ff9f00);
box-shadow:0 10px 25px rgba(0,0,0,0.35);
margin-bottom:16px;
}

.service-card h3{
font-size:20px;
font-weight:700;
margin-top:5px;
margin-bottom:8px;

/* GOLD GRADIENT TEXT */
background:linear-gradient(45deg,#ffd000,#ff9f00,#ffcc00);
-webkit-background-clip:text;
background-clip:text;
color:transparent;

/* GLOW EFFECT */
text-shadow:0 0 10px rgba(255,208,0,0.4);

/* SMOOTH TRANSITION */
transition:0.3s;
}

/* HOVER EFFECT */
.service-card:hover h3{
text-shadow:0 0 20px rgba(255,208,0,0.9);
transform:scale(1.05);
}.service-card::after{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
border-radius:16px;
background:linear-gradient(120deg,transparent,rgba(255,208,0,0.15),transparent);
opacity:0;
transition:0.4s;
}

.service-card:hover::after{
opacity:1;
}
/* FOUNDERS */

.founders{
padding:120px 80px;
text-align:center;
background:#f4f2ea;
}

.founders-grid{
display:flex;
justify-content:center;
gap:40px;
margin-top:40px;
flex-wrap:wrap;
}

.founder-card{
background:white;
padding:40px;
border-radius:15px;
width:320px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
transition:0.3s;
}

.founder-card:hover{
transform:translateY(-10px);
box-shadow:0 15px 35px rgba(0,0,0,0.15);
}

.avatar{
width:120px;
height:120px;
background:linear-gradient(45deg,#ffd000,#ff8c00);
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:40px;
color:white;
margin:auto;
margin-bottom:20px;
font-weight:700;
}

.role{
color:#d98c00;
font-weight:600;
margin:5px 0;
}

/* TESTIMONIALS */

.testimonials{
	background:linear-gradient(135deg,#5a240a,#8b3c12,#6b2e0f);
	color:white;
	padding:90px 20px;
	text-align:center;
}

.testimonial-container{
	max-width:1000px;
	margin:40px auto 0;
	overflow:hidden;
	position:relative;
}

.testimonial-slider{
	overflow:hidden;
	position:relative;
}

.testimonial-track{
	display:flex;
	gap:30px;
	transition:transform 0.5s ease;
}

.testimonial{
	min-width:320px;
	max-width:320px;
	background:#8a3d14;
	padding:25px;
	border-radius:12px;
	border:1px solid rgba(255,255,255,0.1);
	box-shadow:0 10px 25px rgba(0,0,0,0.25);
	transition:0.4s;
	text-align:left;
}

.testimonial:hover{
	transform:translateY(-8px);
	box-shadow:0 20px 40px rgba(0,0,0,0.35);
}

.testimonial .stars{
	color:#ffd000;
	font-size:18px;
	margin-bottom:10px;
}

.testimonial h4{
	color:#ffd000;
	margin-top:12px;
	font-weight:600;
}

.testimonial span{
	font-size:14px;
	opacity:0.8;
}

/* slider arrows + dots (Insta-post style) */

.testi-arrow{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	background:rgba(0,0,0,0.4);
	border:none;
	color:#fff;
	width:40px;
	height:40px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	backdrop-filter:blur(3px);
	transition:0.3s;
}

.testi-arrow:hover{
	background:rgba(0,0,0,0.7);
}

.testi-prev{
	left:10px;
}

.testi-next{
	right:10px;
}

.testi-dots{
	margin-top:25px;
	display:flex;
	justify-content:center;
	gap:10px;
}

.testi-dot{
	width:9px;
	height:9px;
	border-radius:50%;
	background:rgba(255,255,255,0.4);
	cursor:pointer;
	transition:0.3s;
}

.testi-dot.active{
	background:#ffd000;
	transform:scale(1.2);
}

@media(max-width:768px){
	.testimonial{
		min-width:260px;
		max-width:260px;
	}

	/* hide arrows on very small screens if हवे असेल तर */
	.testi-arrow{
		width:34px;
		height:34px;
	}
}

/* CONTACT */

.contact{
padding:100px;
}

.contact-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
}

.contact-card{
background:white;
padding:20px;
border-radius:10px;
display:flex;
gap:15px;
margin-bottom:20px;
align-items:center;
}

.contact-card i{
font-size:25px;
color:white;
background:#ff9f00;
padding:12px;
border-radius:8px;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
width:100%;
padding:12px;
margin-bottom:15px;
border:1px solid #ddd;
border-radius:6px;
}

button{
background:#ffd000;
border:none;
padding:14px;
width:100%;
border-radius:6px;
cursor:pointer;
font-weight:600;
}

button:hover{
background:#ffb700;
}

/* FOOTER */

.footer{
background:#7a330d;
color:white;
padding:80px;
margin-top:50px;
}

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

.footer-logo{
height:60px;
margin-bottom:10px;
}

.footer-links a{
display:block;
color:white;
text-decoration:none;
margin:8px 0;
}

.footer-social .social-icons a{
color:white;
font-size:22px;
margin-right:15px;
transition:0.3s;
}

.footer-social .social-icons a:hover{
color:#ffd000;
transform:scale(1.2);
}

.footer hr{
margin:30px 0;
border-top:1px solid rgba(255,255,255,0.3);
}

.copyright{
text-align:center;
font-size:14px;
}

/* MOBILE */

/* ================= MOBILE FIX ================= */

@media(max-width:768px){

header{
padding:15px 20px;
flex-direction:column;
}

nav{
margin-top:10px;
display:flex;
flex-wrap:wrap;
justify-content:center;
}

nav a{
margin:0 10px;
font-size:14px;
}

.hero h1{
font-size:32px;
}

.hero{
padding:110px 16px 80px;
}

.hero-inner{
flex-direction:column;
align-items:flex-start;
gap:28px;
}

.hero-right{
justify-content:center;
width:100%;
}

.hero-bottom-bar{
position:static;
transform:none;
margin-top:10px;
justify-content:flex-start;
}

.goals{
padding:80px 20px;
}

.services{
padding:80px 20px;
}

.services-grid{
grid-template-columns:1fr;
}

.service-card{
padding:25px;
}

.founders{
padding:80px 20px;
}

.founders-grid{
flex-direction:column;
align-items:center;
}

.contact{
padding:80px 20px;
}

.contact-grid{
grid-template-columns:1fr;
}

.footer{
padding:50px 20px;
}

.footer-grid{
grid-template-columns:1fr;
text-align:center;
}

}

/* EXTRA SMALL MOBILE */

@media(max-width:480px){

.hero h1{
font-size:26px;
}

.tagline{
font-size:14px;
}

.desc{
font-size:14px;
}

.btn{
padding:12px 20px;
font-size:14px;
}

.logo{
height:40px;
}

}/* HONEYCOMB BACKGROUND */

.honeycomb-bg{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:center;
opacity:0.15;
pointer-events:none;
}

.hex{
width:120px;
height:120px;
background:#ffd000;
clip-path:polygon(
25% 5%,
75% 5%,
100% 50%,
75% 95%,
25% 95%,
0% 50%
);
margin:10px;
animation:hexFloat 6s infinite ease-in-out;
}

@keyframes hexFloat{

0%{
transform:translateY(0px);
}

50%{
transform:translateY(-20px);
}

100%{
transform:translateY(0px);
}

}.founder-card{
background:white;
padding:35px;
border-radius:12px;
width:320px;
text-align:center;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.founder-card h3{
color:#6b2e0f;
font-size:22px;
margin-bottom:5px;
}

.phone{
	margin-top:10px;
	font-size:16px;
}

/* (Old testimonial grid styles removed; slider styles defined earlier) */

/* ================= LOADER ================= */

#loader{
position:fixed;
top:0;
left:0;
width:100%;
height:100vh;
background:#000;
display:flex;
justify-content:center;
align-items:center;
z-index:9999;
}
.loader-box{
position:relative;
width:120px;
height:120px;
}

.loader-bee{
width:60px;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
}

.dots span{
position:absolute;
width:10px;
height:10px;
background:#00ff9c;
border-radius:50%;
top:50%;
left:50%;
transform-origin:0 -45px;
animation:spin 1.5s linear infinite;
}

.dots span:nth-child(1){animation-delay:0s;}
.dots span:nth-child(2){animation-delay:0.2s;}
.dots span:nth-child(3){animation-delay:0.4s;}
.dots span:nth-child(4){animation-delay:0.6s;}
.dots span:nth-child(5){animation-delay:0.8s;}
.dots span:nth-child(6){animation-delay:1s;}

@keyframes spin{
0%{transform:rotate(0deg) translateY(-45px);}
100%{transform:rotate(360deg) translateY(-45px);}
}
/* duplicate .testimonial-slider block removed – styles are defined earlier /* duplicate .testimonial-track block removed – styles are defined earlier */

@keyframes slide{
	/* old keyframes no longer used */
}

#loader{
position:fixed;
width:100%;
height:100vh;
background:#f4f2ea;
display:flex;
justify-content:center;
align-items:center;
z-index:9999;
}

.bee-loader{
position:relative;
width:120px;
height:120px;
display:flex;
justify-content:center;
align-items:center;
}

.bee-loader img{
width:80px;
z-index:2;
}

.dot{
position:absolute;
width:10px;
height:10px;
background:#ffd000;
border-radius:50%;
animation:orbit 8s linear infinite;
}

.dot:nth-child(2){animation-delay:8.3s}
.dot:nth-child(3){animation-delay:8s}
.dot:nth-child(4){animation-delay:8.9s}
.dot:nth-child(5){animation-delay:8.2s}
.dot:nth-child(6){animation-delay:7.5s}

@keyframes orbit{

0%{
transform:rotate(0deg) translateX(50px) rotate(0deg);
}

100%{
transform:rotate(360deg) translateX(50px) rotate(-360deg);
}

}

/* PREMIUM BEE LOADER */

#loader{
position:fixed;
width:100%;
height:100vh;
background:#f4f2ea;
display:flex;
justify-content:center;
align-items:center;
z-index:9999;
}

.loader-container{
position:relative;
width:150px;
height:150px;
display:flex;
justify-content:center;
align-items:center;
}

.loader-logo{
width:90px;
z-index:2;
}

.loader-ring span{
position:absolute;
width:10px;
height:10px;
background:#00ff9c;
border-radius:50%;
animation:orbit 1.6s linear infinite;
}

.loader-ring span:nth-child(1){transform:rotate(0deg) translate(55px);}
.loader-ring span:nth-child(2){transform:rotate(60deg) translate(55px);}
.loader-ring span:nth-child(3){transform:rotate(120deg) translate(55px);}
.loader-ring span:nth-child(4){transform:rotate(180deg) translate(55px);}
.loader-ring span:nth-child(5){transform:rotate(240deg) translate(55px);}
.loader-ring span:nth-child(6){transform:rotate(300deg) translate(55px);}

@keyframes orbit{

0%{
transform:rotate(0deg) translate(55px) rotate(0deg);
}

100%{
transform:rotate(360deg) translate(55px) rotate(-360deg);
}

}.testimonials{

background:linear-gradient(
135deg,
#5a240a,
#8b3c12,
#6b2e0f
);

color:white;
padding:90px 20px;
text-align:center;

}.testimonial{

min-width:300px;
background:#8a3d14;
padding:25px;
border-radius:12px;

border:1px solid rgba(255,255,255,0.1);

box-shadow:
0 10px 25px rgba(0,0,0,0.25);

transition:0.4s;

}

.testimonial:hover{

transform:translateY(-8px);
box-shadow:0 20px 40px rgba(0,0,0,0.35);

}@media(max-width:768px){

.testimonials{

padding:70px 15px;

}

.testimonial{

min-width:260px;

}

}.testimonial .stars{

color:#ffd000;
font-size:18px;
margin-bottom:10px;

}.testimonial h4{

color:#ffd000;
margin-top:12px;
font-weight:600;

}

/* ================= LOADER (FINAL OVERRIDE) ================= */

#loader{
	position:fixed;
	inset:0;
	width:100%;
	height:100vh;
	display:flex;
	justify-content:center;
	align-items:center;
	z-index:9999;

	/* brand glass */
	background:
		radial-gradient(900px 500px at 50% 40%, rgba(255,208,0,0.16), rgba(255,208,0,0) 60%),
		linear-gradient(135deg, rgba(107,46,15,0.96), rgba(244,242,234,0.92));
	backdrop-filter: blur(10px);

	opacity:0;
	visibility:hidden;
	transition:opacity 0.35s ease, visibility 0.35s ease;
}

#loader.is-visible{
	opacity:1;
	visibility:visible;
}

#loader.is-hidden{
	opacity:0;
	visibility:hidden;
}

.loader-container{
	position:relative;
	width:180px;
	height:180px;
	display:grid;
	place-items:center;
	isolation:isolate;
}

.loader-container::before{
	content:"";
	position:absolute;
	inset:10px;
	border-radius:28px;
	background:rgba(255,255,255,0.08);
	border:1px solid rgba(255,255,255,0.12);
	box-shadow:0 18px 40px rgba(0,0,0,0.25);
}

.loader-logo{
	width:92px;
	height:auto;
	filter:drop-shadow(0 10px 24px rgba(0,0,0,0.35));
	z-index:2;
	animation:loaderPop 1.4s ease-in-out infinite;
}

@keyframes loaderPop{
	0%,100%{ transform:translateY(0) scale(1); }
	50%{ transform:translateY(-3px) scale(1.03); }
}

.loader-ring{
	position:absolute;
	inset:0;
	display:grid;
	place-items:center;
	z-index:1;
}

.loader-ring span{
	position:absolute;
	width:12px;
	height:12px;
	border-radius:999px;
	background:linear-gradient(180deg,#ffd000,#ff9f00);
	box-shadow:0 10px 20px rgba(0,0,0,0.25);
	opacity:0.9;
	animation:beeOrbit 1.25s cubic-bezier(.55,.1,.3,1) infinite;
}

.loader-ring span:nth-child(1){ transform:rotate(0deg) translate(62px);  animation-delay:0s; }
.loader-ring span:nth-child(2){ transform:rotate(60deg) translate(62px); animation-delay:0.06s; }
.loader-ring span:nth-child(3){ transform:rotate(120deg) translate(62px);animation-delay:0.12s; }
.loader-ring span:nth-child(4){ transform:rotate(180deg) translate(62px);animation-delay:0.18s; }
.loader-ring span:nth-child(5){ transform:rotate(240deg) translate(62px);animation-delay:0.24s; }
.loader-ring span:nth-child(6){ transform:rotate(300deg) translate(62px);animation-delay:0.30s; }

@keyframes beeOrbit{
	0%{ transform:rotate(0deg) translate(62px) rotate(0deg); }
	100%{ transform:rotate(360deg) translate(62px) rotate(-360deg); }
}

@media (prefers-reduced-motion: reduce){
	#loader, .loader-logo, .loader-ring span{ animation:none !important; transition:none !important; }
}.tracking-section{
background:linear-gradient(135deg,#5a240a,#8b3c12,#6b2e0f);
color:white;
padding:80px 20px;
text-align:center;
border-radius:16px;
margin:80px auto;
max-width:900px;
box-shadow:0 20px 50px rgba(0,0,0,0.4);
}

.tracking-section h2{
font-size:28px;
margin-bottom:15px;
color:#ffd000;
}

.tracking-desc{
font-size:15px;
opacity:0.85;
margin-bottom:25px;
}

.tracking-list{
list-style:none;
padding:0;
}

.tracking-list li{
background:rgba(255,255,255,0.08);
margin:10px 0;
padding:14px;
border-radius:10px;
transition:0.3s;
}

.tracking-list li:hover{
background:rgba(255,208,0,0.15);
transform:translateX(8px);
}.social-mini{
display:flex;
gap:10px;
margin-top:15px;
}

.social-mini i{
font-size:14px;
color:#ffd000;
background:rgba(0,0,0,0.6);
padding:7px;
border-radius:6px;
transition:0.3s;
cursor:pointer;
}

.social-mini i:hover{
background:#ffd000;
color:#000;
transform:scale(1.1);
}/* ================= MOBILE HERO FIX ================= */

@media(max-width:768px){

.hero{
padding:120px 20px 60px;
text-align:left;
height:auto;
}

.hero-inner{
flex-direction:column;
align-items:flex-start;
gap:20px;
}

.hero h1{
font-size:28px;
line-height:1.3;
}

.tagline{
font-size:14px;
}

.desc{
font-size:14px;
}

.buttons{
display:flex;
flex-direction:column;
gap:12px;
width:100%;
}

.btn{
width:100%;
text-align:center;
}

.hero-stats{
flex-direction:row;
flex-wrap:wrap;
gap:12px;
}

.stat{
flex:1 1 45%;
text-align:center;
}

.hero-bottom-bar{
position:static;
transform:none;
margin-top:20px;
flex-direction:column;
gap:10px;
}

}

/* EXTRA SMALL MOBILE */

@media(max-width:480px){

.hero h1{
font-size:24px;
}

.stat{
flex:1 1 100%;
}

}@media(max-width:768px){
header{
padding:12px 15px;
}

nav{
flex-wrap:wrap;
justify-content:center;
}

nav a{
margin:5px 10px;
font-size:13px;
}
}/* HERO TEXT CUT FIX */

.hero h1{
margin-top:10px;
}@media(max-width:768px){

.hero{
height:auto; /* IMPORTANT FIX */
min-height:100vh;
padding-top:140px; /* header space sathi */
}

.hero-inner{
align-items:center;
}

.hero-text{
text-align:left;
}

.hero h1{
font-size:28px;
line-height:1.3;
}

}@media(max-width:768px){

.hero-stats{
justify-content:flex-start;
}

.stat{
background:rgba(0,0,0,0.4);
}

}@media(max-width:768px){

.hero{
margin-top:110px;
min-height:100vh;

/* 🔥 BG FIX */
background-position:center top;
background-size:cover;
background-repeat:no-repeat;

padding:120px 20px 60px;
}

}