/* GLOBAL */

body{
font-family:'Segoe UI',sans-serif;
background:#f4f7fb;
margin:0;
}

.msme-header img{
height:60px;
margin-left:15px;
background:white;
padding:4px;
border-radius:4px;
}
/* HERO SECTION */

.hero{
height:100vh;
background:linear-gradient(rgba(0,0,0,0.65),rgba(0,0,0,0.65)),
url('https://images.unsplash.com/photo-1454165804606-c3d57bc86b40');
background-size:cover;
background-position:center;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
}

.hero .container{
max-width:900px;
}

.hero h1{
font-size:60px;
font-weight:700;
margin-bottom:20px;
}
.hero-logo{
width:90px;
margin-bottom:20px;
}
.hero-msme-badge{
width:90px;
margin-bottom:20px;
}
.hero p{
font-size:20px;
margin-bottom:30px;
}


/* PRIMARY BUTTON */

.btn-main{
background:#ff6b00;
color:white;
padding:14px 32px;
border-radius:40px;
font-weight:600;
text-decoration:none;
transition:0.3s;
}

.btn-main:hover{
background:#e65c00;
}


/* ABOUT SECTION */
/* ABOUT SECTION */

.about-section{
padding:120px 0;
background:#eef3ff;
position:relative;
overflow:hidden;
}

/* large circle */

.about-section::before{
content:"";
position:absolute;
top:-120px;
right:-120px;
width:420px;
height:420px;
background:#dbe7ff;
border-radius:50%;
opacity:0.6;
}

/* second circle */

.about-section::after{
content:"";
position:absolute;
bottom:-140px;
left:-140px;
width:380px;
height:380px;
background:#cddcff;
border-radius:50%;
opacity:0.5;
}

/* third subtle circle */

.about-section .container::before{
content:"";
position:absolute;
top:60px;
left:45%;
width:200px;
height:200px;
background:#ffffff;
border-radius:50%;
opacity:0.15;
}

/* ensure content stays above circles */

.about-section .container{
position:relative;
z-index:2;
}
/* CONTACT BUTTON */

.btn-warning{
background:#ff6b00;
border:none;
padding:12px 28px;
font-weight:600;
border-radius:40px;
}

.btn-warning:hover{
background:#e85d00;
}


/* FOOTER */

footer{
background:#1e2228;
color:white;
text-align:center;
padding:20px;
margin-top:40px;
}

/* ================================= */
/* SERVICES SECTION */
/* ================================= */

.services-section{
padding:110px 0;
background:linear-gradient(135deg,#eef3ff,#e6edff);
position:relative;
overflow:hidden;
}


/* Top Right Background Shape */

.services-section::before{
content:"";
position:absolute;
top:-150px;
right:-150px;
width:420px;
height:420px;
background:#dbe5ff;
border-radius:50%;
opacity:0.6;
}


/* Bottom Left Background Shape */

.services-section::after{
content:"";
position:absolute;
bottom:-160px;
left:-160px;
width:380px;
height:380px;
background:#cfdcff;
border-radius:50%;
opacity:0.5;
}


/* Subtle Center Shape */

.services-grid::before{
content:"";
position:absolute;
top:40%;
left:40%;
width:220px;
height:220px;
background:#ffffff;
border-radius:50%;
opacity:0.12;
}


/* Section Header */

.services-header{
text-align:center;
margin-bottom:70px;
}

.services-header h2{
font-size:38px;
font-weight:700;
margin-bottom:10px;
color:#1f2d3d;
}

.services-header p{
color:#666;
font-size:18px;
}


/* Services Grid */

.services-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
position:relative;
z-index:2;
}


/* Service Card */

.service-box{
background:white;
padding:35px;
border-radius:14px;
text-align:center;

box-shadow:0 18px 40px rgba(0,0,0,0.12);

transition:all 0.4s ease;
position:relative;
}


/* Card Hover Effect */

.service-box:hover{
transform:translateY(-12px) scale(1.02);
box-shadow:0 30px 70px rgba(0,0,0,0.25);
}


/* Icon Container */

.icon-box{
width:70px;
height:70px;

display:flex;
align-items:center;
justify-content:center;

margin:auto;
margin-bottom:20px;

border-radius:18px;

background:linear-gradient(135deg,#ff7a18,#ffb347);

color:white;
font-size:26px;

transition:all 0.35s ease;
}


/* Icon Hover Animation */

.service-box:hover .icon-box{
transform:rotate(8deg) scale(1.1);
}


/* Service Title */

.service-box h4{
margin-bottom:12px;
font-weight:600;
font-size:20px;
color:#222;
}


/* Service Description */

.service-box p{
font-size:15px;
color:#666;
line-height:1.6;
}


/* Responsive Tablet */

@media (max-width:992px){

.services-grid{
grid-template-columns:repeat(2,1fr);
}

}


/* Responsive Mobile */

@media (max-width:600px){

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

.services-section{
padding:80px 20px;
}

}
/* ================================= */
/* DIFFERENT COLORS FOR SERVICE CARDS */
/* ================================= */

/* Card 1 */

.service-box:nth-child(1) .icon-box{
background:linear-gradient(135deg,#ff7a18,#ffb347);
}

.service-box:nth-child(1){
border-top:4px solid #ff7a18;
}


/* Card 2 */

.service-box:nth-child(2) .icon-box{
background:linear-gradient(135deg,#6a11cb,#2575fc);
}

.service-box:nth-child(2){
border-top:4px solid #2575fc;
}


/* Card 3 */

.service-box:nth-child(3) .icon-box{
background:linear-gradient(135deg,#00c6ff,#0072ff);
}

.service-box:nth-child(3){
border-top:4px solid #0072ff;
}


/* Card 4 */

.service-box:nth-child(4) .icon-box{
background:linear-gradient(135deg,#43e97b,#38f9d7);
}

.service-box:nth-child(4){
border-top:4px solid #38f9d7;
}


/* Card 5 */

.service-box:nth-child(5) .icon-box{
background:linear-gradient(135deg,#f7971e,#ffd200);
}

.service-box:nth-child(5){
border-top:4px solid #f7971e;
}


/* Card 6 */

.service-box:nth-child(6) .icon-box{
background:linear-gradient(135deg,#ff4e50,#f9d423);
}

.service-box:nth-child(6){
border-top:4px solid #ff4e50;
}

/* =============================== */
/* PROCESS SECTION */
/* =============================== */

.process-section{
padding:120px 0;
background:#aebbd6;
position:relative;
overflow:hidden;
}

/* subtle stars */

.process-section::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background-image:radial-gradient(white 1px, transparent 1px);
background-size:40px 40px;
opacity:0.25;
z-index:0;
}

.process-section .container{
max-width:1200px;
margin:auto;
text-align:center;
position:relative;
z-index:2;
}

/* wrapper */

.process-wrapper{
display:flex;
justify-content:space-between;
align-items:center;
position:relative;
margin-top:80px;
flex-wrap:wrap;
}

/* =============================== */
/* PLANETS */
/* =============================== */

.planet{
width:190px;
height:190px;
border-radius:50%;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
padding:30px;
color:white;
font-weight:600;
transition:0.4s;
box-shadow:0 15px 35px rgba(0,0,0,0.2);
position:relative;
}

/* floating animation */

@keyframes floatPlanet{

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

}

.planet{
animation:floatPlanet 6s ease-in-out infinite;
}

/* hover glow */

.planet:hover{

transform:scale(1.1);

box-shadow:
0 0 30px rgba(255,255,255,0.7),
0 0 60px rgba(255,140,0,0.7),
0 0 90px rgba(255,140,0,0.5);

}

/* text */

.planet h4{
font-size:22px;
font-weight:700;
margin-bottom:8px;
text-shadow:0 2px 6px rgba(0,0,0,0.35);
}

.planet p{
font-size:15px;
opacity:0.95;
text-shadow:0 2px 6px rgba(0,0,0,0.35);
}

/* step number */

.planet-number{
position:absolute;
top:-10px;
right:-10px;
background:white;
color:#ff7a18;
width:36px;
height:36px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-weight:700;
box-shadow:0 5px 10px rgba(0,0,0,0.2);
}

/* =============================== */
/* PLANET COLORS */
/* =============================== */

.p1{
background:linear-gradient(135deg,#ff7a18,#ffb347);
margin-top:120px;
}

.p2{
background:linear-gradient(135deg,#6a11cb,#2575fc);
margin-top:0px;
}

.p3{
background:linear-gradient(135deg,#00c6ff,#0072ff);
margin-top:120px;
}

.p4{
background:linear-gradient(135deg,#42e695,#3bb2b8);
margin-top:0px;
}

.p5{
background:linear-gradient(135deg,#f7971e,#ffd200);
margin-top:120px;
}

.p6{
background:linear-gradient(135deg,#ff512f,#f09819);
margin-top:0px;
}

/* =========================== */
/* INDEXING SECTION */
/* =========================== */

.indexing-section{
padding:120px 0;
background:#eef3ff;
text-align:center;
}

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

/* CARDS */

.index-card{
background:white;
padding:40px;
border-radius:14px;
height:160px;

display:flex;
align-items:center;
justify-content:center;

box-shadow:0 15px 35px rgba(0,0,0,0.08);

transition:0.4s;
}

/* IMAGE SIZE FIX */

.index-card img{
width:80%;
max-height:80px;
object-fit:contain;
transition:0.4s;
filter:grayscale(100%);
}

/* HOVER EFFECT */

.index-card:hover{
transform:translateY(-8px);
}

.index-card:hover img{
filter:grayscale(0%);
}


/* COLORED OUTLINES FOR EACH CARD */

.index-card:nth-child(1){
border:2px solid #ff7a18;
}

.index-card:nth-child(2){
border:2px solid #6a11cb;
}

.index-card:nth-child(3){
border:2px solid #00c6ff;
}

.index-card:nth-child(4){
border:2px solid #3bb2b8;
}

.index-card:nth-child(5){
border:2px solid #f7971e;
}

.index-card:nth-child(6){
border:2px solid #ff512f;
}

/* ================================= */
/* TESTIMONIALS SECTION */
/* ================================= */

.testimonials-section{
padding:120px 0;
background:linear-gradient(135deg,#f4f7fb,#e9f0ff);
text-align:center;
position:relative;
overflow:hidden;
}

/* background shapes */

.testimonials-section::before{
content:"";
position:absolute;
top:-120px;
left:-120px;
width:320px;
height:320px;
background:#dbe7ff;
border-radius:50%;
opacity:0.5;
}

.testimonials-section::after{
content:"";
position:absolute;
bottom:-140px;
right:-140px;
width:380px;
height:380px;
background:#cfdcff;
border-radius:50%;
opacity:0.45;
}

/* section title */

.testimonials-section .section-title{
margin-bottom:60px;
position:relative;
z-index:2;
}

.testimonials-section h2{
font-size:38px;
font-weight:700;
margin-bottom:10px;
color:#222;
}

.testimonials-section p{
font-size:16px;
color:#666;
}

/* wrapper */

.testimonial-wrapper{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:40px;
position:relative;
z-index:2;
}

/* testimonial cards */

.testimonial-card{
background:white;
padding:35px;
border-radius:14px;
box-shadow:0 15px 35px rgba(0,0,0,0.08);
transition:all 0.4s ease;
text-align:center;
}

/* hover effect */

.testimonial-card:hover{
transform:translateY(-10px);
box-shadow:0 25px 50px rgba(0,0,0,0.15);
}

/* testimonial text */

.testimonial-card p{
font-size:16px;
line-height:1.7;
color:#555;
margin-bottom:20px;
}

/* author name */

.testimonial-card h4{
font-size:18px;
font-weight:700;
color:#222;
margin-bottom:5px;
}

/* author field */

.testimonial-card span{
font-size:14px;
color:#777;
}


/* ================================= */
/* COLORED CARD OUTLINES */
/* ================================= */

.testimonial-card:nth-child(1){
border-top:4px solid #ff7a18;
}

.testimonial-card:nth-child(2){
border-top:4px solid #6a11cb;
}

.testimonial-card:nth-child(3){
border-top:4px solid #00c6ff;
}

.testimonial-card:nth-child(4){
border-top:4px solid #42e695;
}

.testimonial-card:nth-child(5){
border-top:4px solid #f7971e;
}

.testimonial-card:nth-child(6){
border-top:4px solid #ff512f;
}

.testimonial-card:nth-child(7){
border-top:4px solid #11998e;
}

.testimonial-card:nth-child(8){
border-top:4px solid #f953c6;
}

.testimonial-card:nth-child(9){
border-top:4px solid #8e2de2;
}

.testimonial-card:nth-child(10){
border-top:4px solid #ff9966;
}


/* ================================= */
/* RESPONSIVE DESIGN */
/* ================================= */

@media (max-width:992px){

.testimonial-wrapper{
grid-template-columns:repeat(2,1fr);
}

}

@media (max-width:600px){

.testimonial-wrapper{
grid-template-columns:1fr;
}

}

/* =========================== */
/* CONTACT SECTION */
/* =========================== */

.contact-section{
padding:120px 0;
background:linear-gradient(135deg,#eef3ff,#e3ebff);
position:relative;
overflow:hidden;
}

/* background pattern */

.contact-section::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background-image:radial-gradient(rgba(0,0,0,0.05) 1px, transparent 1px);
background-size:40px 40px;
opacity:0.3;
z-index:0;
}

/* background shapes */

.contact-section::after{
content:"";
position:absolute;
width:400px;
height:400px;
background:linear-gradient(135deg,#cfdcff,#e7eeff);
border-radius:50%;
top:-120px;
right:-120px;
opacity:0.6;
}

/* container */

.contact-section .container{
position:relative;
z-index:2;
}

/* layout */

.contact-wrapper{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
margin-top:60px;
align-items:center;
}

/* form */

.contact-form form{
display:flex;
flex-direction:column;
gap:20px;
}

.contact-form input,
.contact-form textarea{
padding:15px;
border-radius:8px;
border:1px solid #ddd;
font-size:15px;
}

.contact-form textarea{
height:120px;
resize:none;
}

.contact-form button{
background:#ff7a18;
color:white;
border:none;
padding:15px;
border-radius:8px;
font-weight:600;
cursor:pointer;
transition:0.3s;
}

.contact-form button:hover{
background:#e96c10;
}

/* image */

.contact-image{
display:flex;
justify-content:center;
align-items:center;
}

.contact-image img{
width:100%;
max-width:500px;
border-radius:14px;
box-shadow:0 15px 35px rgba(0,0,0,0.15);
transition:0.4s;
}

.contact-image img:hover{
transform:scale(1.05);
}
/* ================= */
/* LOGO + TITLE */
/* ================= */

.logo-title{
display:flex;
align-items:center;
gap:10px;
font-weight:700;
font-size:22px;
color:#222;
text-decoration:none;
}

.logo-title img{
height:60px;
width:auto;
}

.logo-title span{
font-weight:700;
font-size:22px;
}
.whatsapp-float{
position:fixed;
bottom:25px;
right:25px;
background:#25D366;
color:white;
font-size:28px;
width:55px;
height:55px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
box-shadow:0 4px 10px rgba(0,0,0,0.3);
z-index:999;
transition:0.3s;
}

.whatsapp-float:hover{
background:#20b358;
transform:scale(1.1);
}