 body {
     font-family: 'Cairo', sans-serif;
     overflow-x: hidden;
 }

 :root {
     --primary: #0B1F66;
     --secondary: #F26522;
 }

 .slide {
     opacity: 0;
     transition: opacity 0.8s ease-in-out;
 }

 .slide.active {
     opacity: 1;
     z-index: 10;
 }

 .slider-img {
     animation: zoomEffect 8s ease-in-out infinite alternate;
 }

 @keyframes zoomEffect {
     from {
         transform: scale(1);
     }

     to {
         transform: scale(1.05);
     }
 }

 

 .tab-btn {
     padding: 6px 10px;
     border-radius: 999px;
     background: #fff;
     border: 1px solid #e5e7eb;
     font-weight: 600;
     transition: .3s;
 }

 .tab-btn.active,
 .tab-btn:hover {
     background: #F26522;
     color: #fff;
     border-color: #F26522;
 }

 .tab-content {
     display: none;
 }

 .tab-content.active {
     display: block;
 }

 .product-card {
     background: #fff;
     border-radius: 24px;
     overflow: hidden;
     border: 1px solid #f1f1f1;
     transition: .4s;
 }

 .product-card:hover {
     transform: translateY(-8px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, .08);
 }

 .product-image {
     background: #f8fafc;
     padding: 15px;
 }

 .product-image img {
     height: 260px;
     width: 100%;
     object-fit: cover;
 }

 .product-category {
     color: #F26522;
     font-size: 12px;
     font-weight: 700;
     ext-transform: uppercase;
     letter-spacing: 1px;
 }

 .product-card h3 {
     font-size: 16px;
     font-weight: 700;
     margin-top: 6px;
 }

 .product-card p {
     color: #6b7280;
     margin-top: 5px;
     font-size: 14px;
 }

 .product-card a {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     color: #F26522;
     font-weight: 600;
     margin-top: 10px;
 }

 .feature-card {
     position: relative;
     padding: 20px;
     border-radius: 24px;
     background: rgba(255, 255, 255, 0.05);
     backdrop-filter: blur(15px);
     overflow: hidden;
     transition: .4s;
 }

 .feature-card::before {
     content: "";
     position: absolute;
     inset: 0;
     padding: 1px;
     border-radius: 24px;
     background: linear-gradient(130deg,
             rgba(242, 101, 34, .9),
             rgba(255, 255, 255, .1),
             rgba(59, 130, 246, .8));
     -webkit-mask:
         linear-gradient(#fff 0 0) content-box,
         linear-gradient(#fff 0 0);
     -webkit-mask-composite: xor;
     mask-composite: exclude;

     animation: borderMove 4s linear infinite;
 }

 .feature-card:hover {
     transform: translateY(-10px);
 }

 @keyframes borderMove {
     0% {
         filter: hue-rotate(0deg);
     }

     100% {
         filter: hue-rotate(360deg);
     }
 }

 .icon-box {
     width: 60px;
     height: 60px;
     border-radius: 20px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: rgba(242, 101, 34, .15);
     border: 1px solid rgba(242, 101, 34, .25);
 }

 .icon-box i {
     font-size: 28px;
     color: #F26522;
 }

 .feature-card h3 {
     color: #fff;
     font-size: 20px;
     font-weight: 700;
     margin-top: 15px;
 }

 .feature-card p {
     color: #cbd5e1;
     margin-top: 12px;
     line-height: 1.8;
 }

 /* ======================= TESTIMONIAL ============================= */

 /* Slider */
 .testimonial-track {
     display: flex;
     transition: transform .7s ease;
 }

 .testimonial-slide {
     padding: 14px;
     box-sizing: border-box;
 }

 @media(min-width:1200px) {
     .testimonial-slide {
         flex: 0 0 25%;
     }
 }

 @media(min-width:768px) and (max-width:1199px) {
     .testimonial-slide {
         flex: 0 0 33.333%;
     }
 }

 @media(max-width:767px) {
     .testimonial-slide {
         flex: 0 0 100%;
     }
 }

 /* Card */
 .testimonial-card-wrap {
     position: relative;
     padding-top: 60px;
 }

 .testimonial-back {
     position: absolute;
     inset: 60px -12px -12px 12px;
     border-radius: 12px;
     z-index: 1;
 }

 .testimonial-tail {
     position: absolute;
     bottom: -28px;
     left: 40px;
     width: 80px;
     height: 80px;
     transform: rotate(45deg);
 }

 .testimonial-front {
     position: relative;
     z-index: 2;
     background: #fff;
     border-radius: 12px;
     min-height: 330px;
     padding: 60px 28px 30px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
 }

 /* Avatar */
 .testimonial-avatar {
     position: absolute;
     top: 25px;
     left: 50%;
     transform: translateX(-50%);
     width: 70px;
     height: 70px;
     border-radius: 50%;
     background: #fff;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 26px;
     font-weight: 700;
     z-index: 5;
 }

 /* =================  CTA SECTION =================== */

 .spark {
     position: absolute;
     width: 6px;
     height: 6px;
     background: #F26522;
     border-radius: 50%;
     box-shadow: 0 0 15px #F26522;
     animation: floatSpark 4s linear infinite;
 }

 .spark1 {
     left: 15%;
     bottom: 0;
     animation-delay: 0s;
 }

 .spark2 {
     left: 35%;
     bottom: 0;
     animation-delay: 1s;
 }

 .spark3 {
     left: 55%;
     bottom: 0;
     animation-delay: 2s;
 }

 .spark4 {
     left: 75%;
     bottom: 0;
     animation-delay: 3s;
 }

 .spark5 {
     left: 90%;
     bottom: 0;
     animation-delay: 1.5s;
 }

 @keyframes floatSpark {

     0% {
         transform: translateY(0) scale(1);
         opacity: 1;
     }

     100% {
         transform: translateY(-350px) translateX(40px) scale(0);
         opacity: 0;
     }

 }

 .footer-area{
background:
radial-gradient(circle at 15% 20%,rgba(242,101,34,.18),transparent 25%),
radial-gradient(circle at 85% 75%,rgba(242,101,34,.12),transparent 30%),
linear-gradient(
135deg,
#07184f 0%,
#0B1F66 50%,
#12339d 100%);
}

.footer-grid{
position:absolute;
inset:0;
opacity:.04;
background-image:
linear-gradient(#fff 1px,transparent 1px),
linear-gradient(90deg,#fff 1px,transparent 1px);
background-size:40px 40px;
}

.footer-heading{
font-size:22px;
font-weight:700;
margin-bottom:25px;
color:#fff;
}

.footer-link{
color:rgba(255,255,255,.75);
transition:.3s;
}

.footer-link:hover{
color:#F26522;
padding-left:8px;
}

.footer-icon{
width:42px;
height:42px;
background:#F26522;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}

.social-icon{
width:50px;
height:50px;
border-radius:14px;
background:rgba(255,255,255,.08);
display:flex;
align-items:center;
justify-content:center;
transition:.4s;
}

.social-icon:hover{
background:#F26522;
transform:translateY(-8px) rotate(8deg);
box-shadow:0 15px 30px rgba(242,101,34,.4);
}

.footer-orb{
position:absolute;
border-radius:50%;
filter:blur(80px);
}

.orb-1{
width:280px;
height:280px;
background:#F26522;
left:-100px;
top:50px;
opacity:.15;
}

.orb-2{
width:200px;
height:200px;
background:#fff;
right:-50px;
top:80px;
opacity:.05;
}

.orb-3{
width:350px;
height:350px;
background:#F26522;
right:10%;
bottom:-150px;
opacity:.10;
}

.footer-gear{
position:absolute;
color:rgba(242,101,34,.06);
animation:spinGear 25s linear infinite;
}

.gear-left{
font-size:260px;
left:-70px;
bottom:40px;
}

.gear-right{
font-size:180px;
right:-40px;
top:50px;
animation-direction:reverse;
}

@keyframes spinGear{
from{transform:rotate(0deg)}
to{transform:rotate(360deg)}
}

.sparks span{
position:absolute;
bottom:-20px;
width:4px;
height:4px;
border-radius:50%;
background:#F26522;
box-shadow:0 0 12px #F26522;
animation:spark 8s linear infinite;
}

.sparks span:nth-child(1){left:10%}
.sparks span:nth-child(2){left:20%}
.sparks span:nth-child(3){left:35%}
.sparks span:nth-child(4){left:50%}
.sparks span:nth-child(5){left:65%}
.sparks span:nth-child(6){left:75%}
.sparks span:nth-child(7){left:85%}
.sparks span:nth-child(8){left:95%}

@keyframes spark{
0%{
transform:translateY(0);
opacity:1;
}
100%{
transform:translateY(-700px) translateX(100px);
opacity:0;
}
}

.seo-location-link{
padding:12px 22px;
border-radius:50px;
background:rgba(255,255,255,.06);
border:1px solid rgba(255,255,255,.12);
color:rgba(255,255,255,.80);
font-size:14px;
font-weight:500;
transition:.35s;
}

.seo-location-link:hover{
background:#F26522;
border-color:#F26522;
color:#fff;
transform:translateY(-4px);
box-shadow:0 10px 25px rgba(242,101,34,.35);
}


.product-main img{
    transition:.4s;
}

.product-main img:hover{
    transform:scale(1.05);
}

/* ===== CONTENT AREA START ===== */
.content-area {
  font-size: 15px;
  line-height: 1.8;
  color: #444;
}

/* Paragraph */
.content-area p {
  margin-bottom: 12px;
}

/* Headings */
.content-area h1,
.content-area h2,
.content-area h3,
.content-area h4,
.content-area h5,
.content-area h6 {
  font-weight: 600;
  color: #0A2F6B;
  margin-top: 20px;
  margin-bottom: 10px;
  line-height: 1.4;
}

.content-area h1 { font-size: 28px; }
.content-area h2 { font-size: 24px; }
.content-area h3 { font-size: 20px; }
.content-area h4 { font-size: 18px; }

/* Lists */
.content-area ul {
  list-style: disc;
  padding-left: 22px;
  margin-bottom: 15px;
}

.content-area ol {
  list-style: decimal;
  padding-left: 22px;
  margin-bottom: 15px;
}

.content-area li {
  margin-bottom: 0px;
}

/* Links */
.content-area a {
  color: #1DA1F2;
  text-decoration: none;
}

.content-area a:hover {
  text-decoration: underline;
}

/* Images */
.content-area img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 15px 0;
}

/* Blockquote */
.content-area blockquote {
  border-left: 4px solid #1DA1F2;
  padding-left: 12px;
  color: #555;
  margin: 15px 0;
  font-style: italic;
}

/* Table */
.content-area table {
  width: 100%;
  border-collapse: collapse;
  margin: 15px 0;
}

.content-area table th,
.content-area table td {
  border: 1px solid #ddd;
  padding: 8px;
}

.content-area table th {
  background: #f5f5f5;
}

/* Strong / Bold */
.content-area strong {
  font-weight: 800;
}

/* Spacing Fix */
.content-area * {
  word-wrap: break-word;
}

/* ===== CONTENT AREA END ===== */