body {
      font-family: 'Noto Serif SC', serif;
      margin: 0; /* Added to remove default body margin */
    }
    .header-nav {
      background-color: #0974dc; /* DodgerBlue, or your preferred blue */
      /* padding: 10px 0; /* Optional: Add some padding if needed */
    }
    .header-nav .container { /* Ensure nav content remains centered with original layout */
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .header-nav nav ul li a {
        color: white; /* Make nav links white for better contrast on blue */
    }
    .header-nav nav ul li a.active,
    .header-nav nav ul li a:hover {
        color: #f0f8ff; /* Lighter color on hover/active */
    }
    .header-nav .logo span {
        color: white; /* Make logo text white */
    }
    .header-nav .search i {
        color: white; /* Make search icon white */
    }

    /* Slideshow container */
    .slideshow-container {
      max-width: 100%; /* Occupy full width */
      position: relative;
      margin: auto;
      overflow: hidden; /* Hide parts of images that are outside the container (e.g. during slide) */
    }
    .mySlides {
      display: none;
      /* Ensure images fill the banner area if they have different aspect ratios */
      /* It might be better to ensure all slideshow images have the same dimensions */
    }
    .mySlides img {
      width: 100%;
      height: auto; /* Maintain aspect ratio. Set a fixed height if all images should be same height */
      /* Example fixed height: height: 400px; object-fit: cover; */
      vertical-align: middle;
    }

    /* Next & previous buttons */
    .prev, .next {
      cursor: pointer;
      position: absolute;
      top: 50%;
      width: auto;
      padding: 16px;
      margin-top: -22px;
      color: white;
      font-weight: bold;
      font-size: 18px;
      transition: 0.6s ease;
      border-radius: 0 3px 3px 0;
      user-select: none;
      background-color: rgba(0,0,0,0.5); /* Semi-transparent background */
    }
    .next {
      right: 0;
      border-radius: 3px 0 0 3px;
    }
    .prev:hover, .next:hover {
      background-color: rgba(0,0,0,0.8);
    }
    .dot {
      cursor: pointer;
      height: 15px;
      width: 15px;
      margin: 0 2px;
      background-color: #bbb;
      border-radius: 50%;
      display: inline-block;
      transition: background-color 0.6s ease;
    }
    .active-dot, .dot:hover {
      background-color: #717171;
    }

    /* Fading animation */
    .fade {
      animation-name: fade;
      animation-duration: 1.5s;
    }
    @keyframes fade {
      from {opacity: .4}
      to {opacity: 1}
    }

    /* Custom styles for your sections */
    .section-py {
        padding: 30px 0;
    }

    .text-center {
        text-align: center;
    }

    .section-title {
        font-size: 2.2em;
        font-weight: 700;
        color: #333;
        margin-bottom: 30px;
    }

    .section-subtitle {
        font-size: 1.1em;
        color: #666;
        margin-bottom: 30px;
    }

    .section-title-2 {
        font-size: 1.8em;
        font-weight: 600;
        color: #333;
        padding-bottom: 15px;
        margin-bottom: 30px;
        border-bottom: 1px solid #e0e0e0;
    }

    .core-value-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 40px;
        align-items: center;
    }

    .core-value-grid .text-content p {
        font-size: 1em;
        line-height: 1.8;
        color: #555;
    }

    .tech-advantages-list .advantage-item {
        background-color: #f8f9fa;
        padding: 25px;
        margin-bottom: 20px;
        border-radius: 8px;
    }

    .tech-advantages-list .advantage-item h4 {
        font-size: 1.3em;
        color: #0d6efd;
        margin-bottom: 10px;
    }

    .tech-advantages-list .advantage-item p {
        font-size: 1em;
        line-height: 1.7;
        color: #666;
    }

    .tech-advantages-cards {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }

    .advantage-card {
  
        padding: 25px;
        border: 1px solid #e0e0e0;
        border-radius: 8px;
        box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    }

    .advantage-card img {
        width: 45px;
        height: 45px;
        margin-bottom: 15px;
    }

    .advantage-card h4 {
        font-size: 1.3em;
        margin-bottom: 15px;
        color: #333;
    }

    .advantage-card p, .advantage-card ul {
        font-size: 1em;
        color: #666;
        line-height: 1.7;
    }

    .advantage-card ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .advantage-card ul li {
        margin-bottom: 8px;
        position: relative;
        padding-left: 20px;
    }

    .advantage-card ul li::before {
        content: '•';
        position: absolute;
        left: 0;
        color: #0d6efd;
        font-weight: bold;
    }

    /* Service card hover effects */
    .service-card:hover {
      transform: translateY(-10px) !important;
      box-shadow: 0 25px 50px rgba(0,0,0,0.15) !important;
    }

    .service-card:hover .service-icon {
      transform: scale(1.1) !important;
    }

    .service-card:hover a {
      transform: scale(1.05) !important;
      box-shadow: 0 8px 25px rgba(0,0,0,0.2) !important;
    }

    .service-card:hover .service-decoration {
      transform: scale(1.2) !important;
      opacity: 0.8 !important;
    }

    /* Enhanced product container hover effects */
    .enhanced-product-container:hover {
      transform: translateY(-5px) !important;
      box-shadow: 0 30px 80px rgba(0,0,0,0.15) !important;
    }

    .enhanced-product-container:hover .product-icon {
      transform: scale(1.1) !important;
    }

    .enhanced-product-container:hover a {
      transform: scale(1.05) !important;
      box-shadow: 0 12px 35px rgba(0,0,0,0.25) !important;
    }

    .enhanced-product-container:hover .product-decoration {
      transform: scale(1.3) !important;
      opacity: 0.9 !important;
    }

    .enhanced-product-container:hover .product-image img {
      transform: scale(1.02) !important;
    }