/* Base Variables */
        .hw-infra-wrap {
            --navy: #020332;
            --navy-3: #080b4e;
            --white: #ffffff;
            --off: #f7f8ff;
            --green: #0f9e55;
            --green-l: #12b860;
            --green-d: #0a7a41;
            --green-tint: #e8f8f0;
            --text-2: #4a4f7a;
            --text-3: #8a90b8;
            --border: rgba(2,3,50,0.08);
            --border-m: rgba(2,3,50,0.14);
            --amd: #e05a1a;
            --intel: #0074d9;
            --arm: #7c3aed;
           font-family: 'Poppins', sans-serif;
        }

        /* --- PHILOSOPHY STRIP --- */
        .hw-infra-wrap .philosophy { background: var(--navy); padding: 56px 48px; display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin-top: -1px; }
        .hw-infra-wrap .phil-item { padding: 32px; border-right: 1px solid rgba(255,255,255,0.08); }
        .hw-infra-wrap .phil-item:last-child { border-right: none; }
        .hw-infra-wrap .phil-num {  font-size: 11px; color: rgba(255,255,255,0.3); letter-spacing: 1px; margin-bottom: 18px; }
        .hw-infra-wrap .phil-item h3 { font-size: 15px; font-weight: 500; color: #fff; margin-bottom: 8px; letter-spacing: -0.3px; }
        .hw-infra-wrap .phil-item p { font-size: 13px; color: rgba(255,255,255,0.45); line-height: 1.65; font-weight: 300; }
        .hw-infra-wrap .phil-item .accent { color: var(--green-l); }


        /* --- 1. PROMO CARDS SECTION --- */
        .promo-section-bg { background-color: #e2e8f0; padding: 80px 20px;  }
        .offers-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 30px; max-width: 1200px; margin: 0 auto; }
        .promo-card { background-color: #ffffff; border-radius: 24px; padding: 32px; box-shadow: 0 15px 35px rgba(16, 30, 60, 0.08); display: flex; flex-direction: column; transition: transform 0.3s ease, box-shadow 0.3s ease; }
        .promo-card:hover { transform: translateY(-5px); box-shadow: 0 20px 45px rgba(16, 30, 60, 0.12); }
        .promo-card .badge { display: inline-flex; align-items: center; gap: 6px; background-color: #15325b; color: #ffffff; padding: 6px 16px; border-radius: 20px; font-size: 12px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; align-self: flex-start; margin-bottom: 20px; }
        .promo-card h2 { color: #15325b; font-size: 28px; font-weight: 800; margin: 0 0 12px 0; letter-spacing: -0.5px; }
        .promo-card p.subtitle { color: #4a5c78; font-size: 15px; line-height: 1.6; margin: 0 0 24px 0; }
        .features-wrapper { background-color: #f5f8fc; border-radius: 16px; padding: 8px; margin-bottom: 24px; flex-grow: 1; display: flex; flex-direction: column; gap: 4px; }
        .feature-item { display: flex; align-items: center; gap: 16px; padding: 12px; border-radius: 12px; }
        .feature-icon { background-color: #15325b; color: #ffffff; width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
        .feature-text { color: #15325b; font-size: 14px; font-weight: 600; line-height: 1.4; }
        .cta-btn { display: flex; justify-content: center; align-items: center; gap: 10px; background: linear-gradient(90deg, #c32600 0%, #324f78 50%, #341e18 100%); background-size: 200% auto; color: #ffffff; text-decoration: none; padding: 16px; border-radius: 14px; font-weight: 600; font-size: 15px; transition: all 0.3s ease; }
        .cta-btn:hover { background-position: right center; box-shadow: 0 8px 20px rgba(21, 50, 91, 0.2); color: #fff; }

        /* Promo Section Custom Headers */
        .promo-header-wrap { max-width: 1500px; margin: 0 auto 40px auto; text-align: center; }
        .promo-header-title { color: #15325b; font-size: 32px; font-weight: 800; margin-bottom: 16px; letter-spacing: -0.5px; }
        .promo-header-sub { color: #4a5c78; font-size: 16px; line-height: 1.7; max-width: 850px; margin: 0 auto; }


        /* --- 2. NEW DARK SERVICES 3-COL GRID --- */
        .services-dark-section { padding: 50px 48px; background-color: #ffffff;  }
        .services-dark-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1500px; margin: 0 auto; }
        .service-dark-card { border-radius: 8px; padding: 40px 30px; display: flex; flex-direction: column; color: #ffffff; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s ease; }
        .service-dark-card:hover { transform: translateY(-5px); }
        
        .service-card-1 { background-color: #4d6580; } 
        .service-card-2 { background-color: #002349; } 
        .service-card-3 { background-color: #4d6580; } 

        .service-dark-card h3 { font-size: 22px; font-weight: 700; margin-bottom: 16px; color: #ffffff; letter-spacing: -0.3px; line-height: 1.3;}
        .service-dark-card p { font-size: 14px; line-height: 1.7; color: rgba(255, 255, 255, 0.85); margin-bottom: 30px; font-weight: 400; flex-grow: 1; }
        .service-dark-link { display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: #ffffff; text-decoration: none; font-weight: 600; font-size: 14px; transition: opacity 0.2s; margin-top: auto; }
        .service-dark-link:hover { opacity: 0.7; color: #ffffff;}

        /* Services Section Custom Headers */
        .services-header-wrap { max-width: 1500px; margin: 0 auto 50px auto; text-align: center; }
        .services-header-title { color: #020332; font-size: 36px; font-weight: 800; margin-bottom: 16px; letter-spacing: -1px; }
        .services-header-sub { color: #4a4f7a; font-size: 16px; line-height: 1.7; max-width: 850px; margin: 0 auto; }


        /* --- 3. CLEAN SPECS SECTION --- */
        .specs-section-clean { background-color: #ffffff; padding: 100px 20px;  }
        .specs-clean-container { max-width: 1100px; margin: 0 auto; }
        .specs-clean-header { text-align: center; margin-bottom: 60px; }
        .specs-clean-header .sec-label {  font-size: 13px; color: #12b860; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 16px; display: inline-block; font-weight: 600; }
        .specs-clean-header .sec-title { font-size: 38px; font-weight: 700; color: #111827; line-height: 1.2; margin-bottom: 16px; }
        .specs-clean-header .sec-sub { font-size: 16px; color: #4b5563; font-weight: 400; line-height: 1.6; max-width: 850px; margin: 0 auto; }
        .specs-clean-grid { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 60px; row-gap: 40px; }
        .clean-spec-item { display: flex; align-items: flex-start; gap: 16px; }
        .clean-check-icon { width: 24px; height: 24px; background-color: #2563eb; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 2px; }
        .clean-check-icon svg { width: 12px; height: 12px; fill: #ffffff; }
        .clean-spec-content h3 { font-size: 18px; font-weight: 700; color: #111827; margin: 0 0 8px 0; line-height: 1.3; }
        .clean-spec-content p { font-size: 15px; color: #4b5563; line-height: 1.6; margin: 0; }


        /* --- 4. MODERN SUSTAIN SECTION --- */
        .sustain-section-modern { background-color: #f8fafc; padding: 80px 20px;  }
        .sustain-modern-container { max-width: 1500px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
        .sustain-image-wrapper { position: relative; padding-bottom: 30px; padding-right: 30px; }
        .sustain-img-backdrop { position: absolute; top: 0; left: 0; right: 40px; bottom: 50px; background-color: #e8f0fe; border-radius: 24px; z-index: 1; }
        .sustain-image-wrapper img { position: relative; z-index: 2; width: 100%; height: auto; border-radius: 16px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); transform: translate(24px, 24px); object-fit: cover; }
        .sustain-floating-badge { position: absolute; bottom: 0; right: 0; background-color: #003399; color: #ffffff; padding: 24px 32px; border-radius: 12px; z-index: 3; text-align: center; box-shadow: 0 15px 30px rgba(0, 51, 153, 0.3); }
        .sustain-badge-val { font-size: 32px; font-weight: 800; line-height: 1; margin-bottom: 6px; }
        .sustain-badge-label { font-size: 11px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; opacity: 0.9; }
        .sustain-content-wrapper { display: flex; flex-direction: column; }
        .sustain-content-wrapper .sec-label {  font-size: 13px; color: #12b860; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 12px; font-weight: 600; }
        .sustain-content-wrapper .sec-title { font-size: 36px; font-weight: 800; color: #020332; line-height: 1.2; margin-bottom: 16px; }
        .sustain-content-wrapper .sec-sub { font-size: 16px; color: #4a4f7a; line-height: 1.7; margin-bottom: 40px; }
        .sustain-feature-list { display: flex; flex-direction: column; gap: 30px; }
        .sustain-feature-item { display: flex; gap: 20px; align-items: flex-start; }
        .sustain-feature-icon { width: 54px; height: 54px; border-radius: 14px; background-color: #ffffff; border: 1px solid rgba(2, 3, 50, 0.08); box-shadow: 0 8px 20px rgba(2, 3, 50, 0.04); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #0056b3; font-size: 20px; }
        .sustain-feature-text h4 { font-size: 17px; font-weight: 700; color: #020332; margin: 0 0 8px 0; }
        .sustain-feature-text p { font-size: 14px; color: #6b7280; line-height: 1.6; margin: 0; }

        /* Mobile Adjustments */
        @media (max-width: 991px) {
            .hw-infra-wrap .philosophy { grid-template-columns: 1fr 1fr; padding: 32px 24px; gap: 20px; }
            .hw-infra-wrap .phil-item { border: none; padding: 0; }
            .services-dark-grid { grid-template-columns: 1fr; }
            .services-dark-section { padding: 60px 24px; }
            .sustain-modern-container { grid-template-columns: 1fr; gap: 60px; }
            .sustain-image-wrapper { max-width: 600px; margin: 0 auto; }
        }
        @media (max-width: 768px) {
            .specs-clean-header .sec-title { font-size: 28px; }
            .specs-clean-grid { grid-template-columns: 1fr; gap: 32px; }
        }
        @media (max-width: 480px) {
            .promo-card { padding: 24px; }
            .promo-card h2 { font-size: 24px; }
        }