/* Styling for Premium Look */
    .page-header {
        position: relative;
        padding: 120px 0 80px; /* Thoda zyada padding premium feel ke liye */
        color: #fff;
        overflow: hidden;
    }

    .header-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        /* Darker gradient for text pop-out */
        background: linear-gradient(180deg, rgba(6, 20, 84, 0.85) 0%, rgba(11, 31, 58, 0.7) 100%);
        z-index: 1;
    }

    .header-content {
        position: relative;
        z-index: 2;
    }

    .page-title {
        font-size: 3.5rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 2px;
        margin-bottom: 15px;
        color: #fff;
    }

    /* Breadcrumb Customization */
    .breadcrumb {
        background: transparent;
        padding: 0;
        margin-bottom: 25px;
    }

    .breadcrumb-item, .breadcrumb-item a {
        color: rgba(255, 255, 255, 0.8);
        font-weight: 600;
        font-size: 1.1rem;
        text-decoration: none;
        transition: 0.3s;
    }

    .breadcrumb-item a:hover {
        color: #d62828; /* Your Brand Red */
    }

    .breadcrumb-item + .breadcrumb-item::before {
        content: ">";
        color: #d62828;
        font-weight: 900;
    }

    .breadcrumb-item.active {
        color: #fff;
    }

    /* Decorative Elements */
    .header-line {
        width: 80px;
        height: 4px;
        background: #d62828;
        margin: 0 auto 30px;
        border-radius: 2px;
    }

    .header-subtitle {
        font-size: 1.2rem;
        font-weight: 400;
        max-width: 700px;
        margin: 0 auto;
        line-height: 1.6;
        opacity: 0.9;
        font-style: italic;
    }

    /* Responsive Adjustments */
    @media (max-width: 768px) {
        .page-header {
            padding: 80px 0 50px;
        }
        .page-title {
            font-size: 2.2rem;
        }
        .header-subtitle {
            font-size: 1rem;
            padding: 0 15px;
        }
    }




    /*for services

    /* Essential Branding (Internal CSS for non-Bootstrap elements) */
    :root {
        --sat-primary: #001F3F; /* Deep Navy */
        --sat-accent: #B22222;  /* Heritage Red */
        --sat-slate: #4A5568;
        --sat-light: #F8FAFC;
    }

    /* Typography & Core Styles */
    body { font-family: 'Inter', sans-serif; background: #fff; }
    
    .sat-title { 
        font-family: 'Playfair Display', serif; 
        color: var(--sat-primary); 
        letter-spacing: -1px;
    }

    /* Professional Accents */
    .sat-accent-line {
        height: 4px;
        width: 60px;
        background: var(--sat-accent);
        display: inline-block;
    }

    /* Card Styling */
    .sat-service-card {
        border: 1px solid #eef2f6;
        border-radius: 12px;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        background: #fff;
    }

    .sat-service-card:hover {
        border-color: var(--sat-accent);
        transform: translateY(-5px);
        box-shadow: 0 15px 30px rgba(0, 31, 63, 0.08);
    }

    .sat-icon-box {
        width: 45px;
        height: 45px;
        background: rgba(0, 31, 63, 0.03);
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--sat-primary);
        font-weight: 800;
        margin-bottom: 1.25rem;
    }

    /* Image Frames */
    .sat-frame {
        border-radius: 16px;
        overflow: hidden;
        position: relative;
        background: #eee;
    }

    .sat-frame img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* Data Sheet Sidebar */
    .sat-data-sheet {
        background: var(--sat-light);
        border-radius: 16px;
        border: 1px solid #e2e8f0;
    }

    .sat-label { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 1px; color: var(--sat-slate); }
    .sat-value { color: var(--sat-accent); font-weight: 700; }

    /* Step Numbers */
    .sat-step-badge {
        font-size: 0.75rem;
        background: var(--sat-primary);
        color: #fff;
        padding: 4px 12px;
        border-radius: 4px;
        margin-bottom: 1rem;
        display: inline-block;
    }

    /* Comparison Table Styling */
    .sat-table {
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid #eef2f6;
    }
    .sat-table thead {
        background: var(--sat-primary);
        color: white;
    }

    /* Additional Info List */
    .sat-check-list {
        list-style: none;
        padding-left: 0;
    }
    .sat-check-list li {
        margin-bottom: 1rem;
        padding-left: 30px;
        position: relative;
        font-size: 0.95rem;
    }
    .sat-check-list li::before {
        content: '✓';
        position: absolute;
        left: 0;
        color: var(--sat-accent);
        font-weight: bold;
    }
     :root {
        --sat-navy: #001F3F;
        --sat-red: #B22222;
        --sat-bg: #F9FBFF;
        --sat-text: #2D3748;
    }

    /* Unique Professional Card Design */
    .service-grid-container {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 2rem;
        padding: 20px 0;
    }

    .sat-card {
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 20px;
        padding: 2.5rem 2rem;
        position: relative;
        overflow: hidden;
        transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        display: flex;
        flex-direction: column;
        height: 100%;
        background-image: radial-gradient(#e2e8f0 0.5px, transparent 0.5px);
        background-size: 24px 24px;
    }

    .sat-card:hover {
        transform: translateY(-10px);
        border-color: var(--sat-red);
        box-shadow: 0 20px 40px rgba(0, 31, 63, 0.08);
    }

    .sat-card-index {
        position: absolute;
        top: 20px;
        right: 20px;
        font-size: 0.9rem;
        font-weight: 800;
        color: var(--sat-navy);
        background: rgba(0, 31, 63, 0.05);
        width: 35px;
        height: 35px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        backdrop-filter: blur(4px);
        transition: 0.3s ease;
    }

    .sat-card:hover .sat-card-index {
        background: var(--sat-red);
        color: white;
    }

    .sat-card-indicator {
        width: 40px;
        height: 3px;
        background: #e2e8f0;
        margin-bottom: 1.5rem;
        transition: 0.3s ease;
    }

    .sat-card:hover .sat-card-indicator {
        width: 60px;
        background: var(--sat-red);
    }

    .sat-card-title {
        font-family: 'Inter', sans-serif;
        font-weight: 700;
        color: var(--sat-navy);
        font-size: 1.35rem;
        margin-bottom: 1rem;
        line-height: 1.3;
    }

    .sat-card-desc {
        color: #718096;
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 0;
    }

    .sat-card::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0;
        height: 4px;
        background: var(--sat-red);
        transition: 0.4s ease;
    }

    .sat-card:hover::after {
        width: 100%;
    }


   

      /* for projects */
        :root {
            --navy: #0d47a1;
            --navy-dark: #093170;
            --red: #d32f2f;
            --light-bg: #f8fafc;
        }

        
        .text-navy { color: var(--navy); }
        .bg-navy { background-color: var(--navy); }
        .text-red { color: var(--red); }
        
        /* Premium Hero Section */
        .project-hero {
            padding: 80px 0 60px;
            background: linear-gradient(135deg, #f0f4f8 0%, #ffffff 100%);
            border-bottom: 1px solid #e2e8f0;
        }

        .project-badge {
            display: inline-block;
            padding: 6px 16px;
            background: rgba(13, 71, 161, 0.1);
            color: var(--navy);
            border-radius: 50px;
            font-weight: 600;
            font-size: 0.85rem;
            margin-bottom: 20px;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .main-title {
            font-size: 3.5rem;
            font-weight: 800;
            color: var(--navy-dark);
            margin-bottom: 20px;
        }

        .title-accent {
            width: 80px;
            height: 5px;
            background: var(--red);
            border-radius: 10px;
            margin-bottom: 30px;
        }

        /* Stats Cards */
        .stat-card {
            background: white;
            padding: 25px;
            border-radius: 15px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.05);
            border-left: 4px solid var(--navy);
            height: 100%;
            transition: transform 0.3s;
        }
        .stat-card:hover { transform: translateY(-5px); }

        /* Content Sections */
        .section-padding { padding: 80px 0; }
        
        .image-box {
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 20px 40px rgba(0,0,0,0.1);
            position: relative;
        }

        .feature-icon {
            width: 50px;
            height: 50px;
            background: var(--navy);
            color: white;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            margin-bottom: 20px;
            font-size: 1.5rem;
        }

        /* Service Cards */
        .service-list-item {
            padding: 15px;
            border-bottom: 1px solid #edf2f7;
            display: flex;
            align-items: center;
        }
        .service-list-item i {
            color: var(--red);
            margin-right: 15px;
        }

        /* Technical Scope Table */
        .tech-table {
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
        }
        .tech-table thead {
            background-color: var(--navy);
            color: white;
        }

        /* Highlights */
        .highlight-box {
            border-left: 5px solid var(--red);
            background: #fff5f5;
            padding: 20px;
            margin: 20px 0;
            border-radius: 0 15px 15px 0;
        }

        /* CTA Section */
        .cta-box {
            background: var(--navy);
            border-radius: 30px;
            padding: 60px;
            color: white;
            position: relative;
            overflow: hidden;
        }
        .cta-box::after {
            content: '';
            position: absolute;
            top: -50%;
            right: -10%;
            width: 300px;
            height: 300px;
            background: rgba(255,255,255,0.05);
            border-radius: 50%;
        }

        .btn-premium {
            background: var(--red);
            color: white;
            padding: 15px 40px;
            border-radius: 12px;
            font-weight: 700;
            text-transform: uppercase;
            border: none;
            transition: all 0.3s;
        }
        .btn-premium:hover {
            background: #b71c1c;
            color: white;
            transform: translateY(-3px);
            box-shadow: 0 10px 20px rgba(211, 47, 47, 0.3);
        }

        @media (max-width: 768px) {
            .main-title { font-size: 2.2rem; }
            .section-padding { padding: 50px 0; }
        }
  
/*     
service page img */
 /* IMAGE CARD CONTAINER */
.position-relative {
  position: relative;
  height: 280px; /* same height for all */
  overflow: hidden;
  border-radius: 16px;
}

/* IMAGE STYLE */
.position-relative img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* no stretch, proper crop */
  transition: transform 0.5s ease;
}

/* ZOOM EFFECT */
.position-relative:hover img {
  transform: scale(1.1);
}

/* OVERLAY CONTENT */
.overlay-content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 15px;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
  color: #fff;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.4s ease;
}

/* SHOW OVERLAY ON HOVER */
.position-relative:hover .overlay-content {
  opacity: 1;
  transform: translateY(0);
}

/* TEXT STYLING */
.overlay-content h6 {
  font-size: 16px;
  font-weight: 600;
}

.overlay-content p {
  font-size: 13px;
  opacity: 0.85;
}

/* SHADOW IMPROVEMENT */
.shadow-lg {
  box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important;
}

/* RESPONSIVE HEIGHT */
@media (max-width: 768px) {
  .position-relative {
    height: 220px;
  }
}

@media (min-width: 992px) {
  .position-relative {
    height: 320px;
  }
}