.hero-section {
   background:
     linear-gradient(180deg, #0A1931 0%, #1A3A6C 100%),
     repeating-linear-gradient(90deg,
       rgba(255, 255, 255, 0.04) 0px,
       rgba(255, 255, 255, 0.04) 1px,
       transparent 1px,
       transparent 40px),
     repeating-linear-gradient(180deg,
       rgba(255, 255, 255, 0.04) 0px,
       rgba(255, 255, 255, 0.04) 1px,
       transparent 1px,
       transparent 40px);
 }

 /* Common Button Styles */
 .btn-primary {
   background: var(--gradient-accent);
   color: var(--primary-dark);
   border: none;
   padding: 16px 36px;
   border-radius: 6px;
   font-weight: 600;
   cursor: pointer;
   transition: all 0.3s ease;
   font-size: 16px;
   text-decoration: none;
   display: inline-block;
   text-align: center;
 }

 .btn-primary:hover {
   transform: translateY(-2px);
   box-shadow: 0 12px 24px rgba(0, 212, 255, 0.25);
 }

 /* Common Container */
 .container {
   max-width: 1400px;
   margin: 0 auto;
   padding: 50px 0 20px;
 }

 .section-eyebrow {
   display: inline-block;
   color: var(--accent-cyan);
   font-weight: 600;
   font-size: 0.875rem;
   text-transform: uppercase;
   letter-spacing: 1px;
   margin-bottom: 1rem;
   padding: 6px 12px;
   background-color: rgba(0, 212, 255, 0.1);
   border-radius: 30px;
 }


 /* Animation Classes */
 .animate-on-scroll {
   opacity: 1;
   transform: translateY(30px);
   transition: opacity 0.6s ease, transform 0.6s ease;
 }

 .animate-on-scroll.animated {
   opacity: 1;
   transform: translateY(0);
 }

 /* ============================================
       HERO SECTION - Services Page
    ============================================ */

 .corporate-hero {
   padding: 120px 0 80px;
   background: var(--gradient-primary);
   position: relative;
   overflow: hidden;
 }

 .corporate-hero::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2300D4FF' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");

 }

 .hero-container {
   width: 100%;
   position: relative;
   z-index: 2;
 }

 .hero-content {
   max-width: 800px;
   text-align: center;
   margin: 0 auto;
 }

 .hero-content h1 {
   font-family: 'Montserrat', sans-serif;
   font-size: 3.5rem;
   font-weight: 800;
   margin-bottom: 1.5rem;
   line-height: 1.1;
   color: var(--white);
 }

 .hero-content h1 span {
   background: var(--gradient-accent);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
   display: inline-block;
 }

 .hero-subtitle {
   font-size: 1.3rem;
   margin-bottom: 3rem;
   color: rgba(255, 255, 255, 0.9);
   max-width: 700px;
   margin-left: auto;
   margin-right: auto;
 }

 .hero-stats {
   display: flex;
   justify-content: center;
   gap: 4rem;
   margin-top: 4rem;
   flex-wrap: wrap;
 }

 .hero-stat {
   text-align: center;
   background: rgba(255, 255, 255, 0.1);
   backdrop-filter: blur(10px);
   padding: 2rem;
   border-radius: var(--border-radius);
   border: 1px solid rgba(255, 255, 255, 0.1);
   min-width: 160px;
   transition: all 0.3s ease;
 }

 .hero-stat:hover {
   transform: translateY(-10px);
   background: rgba(255, 255, 255, 0.15);
   border-color: var(--accent-cyan);
 }

 .hero-stat h3 {
   font-size: 3rem;
   font-weight: 700;
   color: var(--accent-cyan);
   margin-bottom: 0.5rem;
   line-height: 1;
 }

 .hero-stat p {
   color: rgba(255, 255, 255, 0.8);
   font-size: 0.95rem;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-weight: 500;
 }

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

 .services-section {
   padding: 100px 0;
   background: var(--neutral-light);
 }

 .section-title {
   text-align: center;
   color: var(--primary-dark);
   font-family: 'Montserrat', sans-serif;
   font-size: 3rem;
   font-weight: 800;
   margin-bottom: 1.5rem;
   position: relative;
 }

 .section-title::after {
   content: '';
   position: absolute;
   width: 100px;
   height: 5px;
   background: var(--gradient-accent);
   bottom: -15px;
   left: 50%;
   transform: translateX(-50%);
   border-radius: 3px;
 }

 .section-subtitle {
   text-align: center;
   color: var(--neutral-gray);
   font-size: 1.2rem;
   max-width: 700px;
   margin: 3rem auto 4rem;
   line-height: 1.6;
 }

 .services-grid {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
   gap: 2.5rem;
   margin-top: 3rem;
 }

 .service-card {
   background: var(--white);
   border-radius: var(--border-radius);
   padding: 1.5rem;
   /* Slightly reduced padding for a tighter look */
   box-shadow: var(--shadow-soft);
   transition: all 0.4s ease;
   border: 1px solid rgba(0, 0, 0, 0.05);
   position: relative;
   overflow: hidden;
   display: flex;
   flex-direction: column;
   height: 100%;
   min-height: 520px;
   /* Increased height */
 }

 .service-card::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 5px;
   background: var(--gradient-accent);
   transform: scaleX(0);
   transition: transform 0.4s ease;
 }

 .service-card:hover {
   transform: translateY(-15px);
   box-shadow: var(--shadow-medium);
 }

 .service-card:hover::before {
   transform: scaleX(1);
 }

 .service-icon {
   width: 70px;
   height: 70px;
   background: var(--gradient-accent);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 1.8rem;
   transition: all 0.3s ease;
 }

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

 .service-icon i {
   font-size: 1.8rem;
   color: var(--white);
 }

 /* Blog Image Styling */
 .blog-card-img-wrapper {
   width: 100%;
   height: 200px;
   overflow: hidden;
   border-radius: 12px;
   margin-bottom: 1.5rem;
 }

 .blog-card-img-wrapper img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.5s ease;
 }

 .service-card:hover .blog-card-img-wrapper img {
   transform: scale(1.1);
 }

 .service-card h3 {
   color: var(--primary-dark);
   font-size: 1.4rem;
   margin-bottom: 1rem;
   font-weight: 700;
   line-height: 1.4;
   /* Line clamping for title */
   display: -webkit-box;
   -webkit-line-clamp: 2;
   line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
   min-height: 3.92rem;
   /* approx 2 lines */
   max-height: 3.92rem;
   /* strictly 2 lines */
 }

 .service-card>p {
   color: var(--neutral-gray);
   margin-bottom: 2rem;
   line-height: 1.6;
   font-size: 0.95rem;
   /* Line clamping for excerpt */
   display: -webkit-box;
   -webkit-line-clamp: 3;
   line-clamp: 3;
   -webkit-box-orient: vertical;
   overflow: hidden;
   flex-grow: 0;
   /* Static height for consistency */
   min-height: 4.56rem;
   max-height: 4.56rem;
   /* strictly 3 lines */
 }

 .service-card .btn-primary {
   margin-top: auto;
   align-self: flex-end;
   /* Move to bottom right */
   width: auto;
   /* Remove full-width */
   padding: 12px 24px;
   /* Slightly more compact button */
 }

 .service-features {
   list-style: none;
   margin-top: 1.5rem;
 }

 .service-features li {
   padding: 10px 0;
   border-bottom: 1px solid rgba(108, 117, 125, 0.1);
   position: relative;
   padding-left: 30px;
   color: var(--neutral-gray);
   transition: all 0.3s ease;
 }

 .service-features li:last-child {
   border-bottom: none;
 }

 .service-features li:hover {
   color: var(--primary-dark);
   padding-left: 35px;
 }

 .service-features li:before {
   content: '✓';
   position: absolute;
   left: 0;
   color: var(--accent-teal);
   font-weight: bold;
   font-size: 1.1rem;
 }

 /* ============================================
       CTA SECTION
    ============================================ */

 .contact-cta {
   padding: 100px 0;
   background: var(--gradient-primary);
   position: relative;
   overflow: hidden;
 }

 .contact-cta::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background:
     radial-gradient(circle at 30% 30%, rgba(0, 212, 255, 0.1) 0%, transparent 50%),
     radial-gradient(circle at 70% 70%, rgba(46, 196, 182, 0.1) 0%, transparent 50%);
 }

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

 .cta-card {
   background: rgba(255, 255, 255, 0.95);
   backdrop-filter: blur(10px);
   border-radius: var(--border-radius);
   padding: 4rem;
   text-align: center;
   box-shadow: var(--shadow-medium);
   max-width: 800px;
   margin: 0 auto;
   border: 1px solid rgba(255, 255, 255, 0.2);
 }

 .cta-card h2 {
   color: var(--primary-dark);
   font-size: 2.5rem;
   margin-bottom: 1.5rem;
   font-weight: 800;
 }

 .cta-card p {
   color: var(--neutral-gray);
   font-size: 1.2rem;
   margin-bottom: 2.5rem;
   max-width: 600px;
   margin-left: auto;
   margin-right: auto;
 }

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

 @media (max-width: 1200px) {
   .container {
     padding: 0 30px;
   }

   .hero-content h1 {
     font-size: 3rem;
   }

   .services-grid {
     grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
   }
 }

 @media (max-width: 992px) {
   .hero-content h1 {
     font-size: 2.5rem;
   }

   .hero-stats {
     gap: 2rem;
   }

   .hero-stat {
     min-width: 140px;
     padding: 1.5rem;
   }

   .hero-stat h3 {
     font-size: 2.5rem;
   }

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

   .section-title {
     font-size: 2.5rem;
   }
 }

 @media (max-width: 768px) {
   .container {
     padding: 50px 0 25px;
   }


   .corporate-hero {
     padding: 100px 0 60px;
   }

   .hero-content h1 {
     font-size: 2.2rem;
   }

   .hero-subtitle {
     font-size: 1.1rem;
     padding: 0 20px;
   }

   .hero-stats {
     gap: 1.5rem;
     margin-top: 3rem;
   }

   .hero-stat {
     min-width: 120px;
     padding: 1.2rem;
   }

   .hero-stat h3 {
     font-size: 2rem;
   }

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

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

   .service-card {
     padding: 2rem;
   }

   .contact-cta {
     padding: 80px 0;
   }

   .cta-card {
     padding: 3rem 2rem;
   }

   .cta-card h2 {
     font-size: 2rem;
   }

   .container {
     padding: 50px 0 20px;
   }
 }

 @media (max-width: 576px) {
   .hero-content h1 {
     font-size: 1.8rem;
   }

   .hero-stats {
     flex-direction: column;
     align-items: center;
     gap: 1rem;
   }

   .hero-stat {
     width: 200px;
   }

   .section-title {
     font-size: 2rem;
   }

   .section-subtitle {
     font-size: 1rem;
     margin: 2rem auto 3rem;
   }

   .service-card {
     padding: 1.5rem;
   }

   .cta-card {
     padding: 2rem 1.5rem;
   }

   .cta-card h2 {
     font-size: 1.8rem;
   }


 }

 /* ============================================
       SCROLL ANIMATION STYLES
    ============================================ */

 @keyframes fadeInUp {
   from {
     opacity: 0;
     transform: translateY(40px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 .animate-fadeInUp {
   animation: fadeInUp 0.8s ease forwards;
 }

 .delay-1 {
   animation-delay: 0.2s;
 }

 .delay-2 {
   animation-delay: 0.4s;
 }

 /* ============================================
       ADDITIONAL ENHANCEMENTS
    ============================================ */

 .services-grid {
   counter-reset: service-counter;
 }

 .service-card::after {
   counter-increment: service-counter;
   content: "0" counter(service-counter);
   position: absolute;
   top: 20px;
   right: 20px;
   font-size: 3rem;
   font-weight: 800;
   color: rgba(10, 25, 49, 0.05);
   font-family: 'Montserrat', sans-serif;
   line-height: 1;
   pointer-events: none;
 }

 .service-card:nth-child(n+10)::after {
   content: counter(service-counter);
 }

 /* Gradient text effect */
 .gradient-text {
   background: var(--gradient-accent);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
 }

 /* Loading animation for service cards */
 .service-card {
   animation: fadeInUp 0.6s ease forwards;
   opacity: 0;
 }

 .service-card:nth-child(1) {
   animation-delay: 0.1s;
 }

 .service-card:nth-child(2) {
   animation-delay: 0.2s;
 }

 .service-card:nth-child(3) {
   animation-delay: 0.3s;
 }

 .service-card:nth-child(4) {
   animation-delay: 0.4s;
 }

 .service-card:nth-child(5) {
   animation-delay: 0.5s;
 }

 .service-card:nth-child(6) {
   animation-delay: 0.6s;
 }

 /* Back to top button */
 .back-to-top {
   position: fixed;
   bottom: 30px;
   right: 30px;
   width: 50px;
   height: 50px;
   background: var(--gradient-accent);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--primary-dark);
   font-size: 1.2rem;
   text-decoration: none;
   box-shadow: 0 5px 15px rgba(0, 212, 255, 0.3);
   opacity: 0;
   visibility: hidden;
   transition: all 0.3s ease;
   z-index: 99;
 }

 .back-to-top.visible {
   opacity: 1;
   visibility: visible;
 }

 .back-to-top:hover {
   transform: translateY(-5px);
   box-shadow: 0 10px 20px rgba(0, 212, 255, 0.4);
 }