.About .navbar-brand img {
    width: 60%;
}
.About .footer-logo img {
    width: 70%;
}

.about-section .bg-light-blue {
    background-color: #e3f2fd;
    font-weight: 600;
}

.about-section h1.display-5 {
    font-family: Playfair Display;
font-weight: 500;
font-size: 56px;
line-height: 100%;
text-transform: capitalize;
color:#161616;

}
.about-section .box {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.about-section h1.display-5 span {
    font-family: Playfair Display;
font-weight: 500;
font-style: Italic;
font-size: 56px;
line-height: 100%;
text-transform: capitalize;
color:#161616;

}
.about-section .text-muted {
    font-family: Montserrat;
font-weight: 400;
font-size: 16px;
line-height: 28px;
color:#161616;

}

/* Feature Cards */
.about-section .feature-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 16px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.about-section .feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

/* Icon Box Styling */
.about-section .icon-box {
    width: 50px;
    height: 50px;
    background-color: #e3f2fd;
    color: #0d6efd;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.2rem;
}

.about-section .rounded-4 {
    border-radius: 2rem !important;
}
.about-section .hero-badge {
   font-family: Montserrat;
    font-weight: 700;
    font-size: 14px;
    line-height: 100%;
    color: #427D9D;
    background-color: #caeafa;
    padding: 14px;
    border-radius: 23px;
    width: 16%;
}

 /* --- CTA Section Container --- */
        .cta-section {
            background-color: var(--primary-slate);
            width: 100%;
            min-height: 400px; /* Adjust based on preference */
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden; /* Ensures image doesn't spill out accidentally */
            padding-top: 60px;
        }

        .cta-section .container {
            max-width: 1200px;
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            position: relative;
            z-index: 2;
        }

        /* --- Left Side Content --- */
        .cta-section .content-col {
            flex: 1;
            max-width: 600px; /* Limits text width */
            color: var(--white);
            padding-right: 40px;
        }

        .cta-section h1 {
            font-family: 'Playfair Display', serif;
            font-size: 48px;
            font-weight: 600;
            margin-bottom: 25px;
            line-height: 1.2;
            color: #fff;
        }
        
        /* The italic style for the brand name */
        .cta-section h1 em {
            font-style: italic;
        }

        .cta-section p {
           
            margin-bottom: 35px;
            color: rgba(255, 255, 255, 0.85); /* Slight transparency for text */
            font-family: Montserrat;
            font-weight: 400;
            font-size: 16px;
            line-height: 28px;

        }

        /* --- The Button --- */
        .cta-section .btn-cta {
            display: inline-block;
            background-color: #DDF2FD;
            color: #161616; /* Dark text for button */
            text-decoration: none;
            padding: 15px 30px;
            border-radius: 50px; /* Pill shape */
            transition: transform 0.2s ease, box-shadow 0.2s ease;
            font-family: Montserrat;
            font-weight: 700;
            font-size: 14px;
            line-height: 100%;
            text-transform: uppercase;

        }
        
        
      
        .cta-section .btn-cta:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 10px rgba(0,0,0,0.2);
        }

        /* --- Right Side Image --- */
        .cta-section .image-col {
            flex: 1;
            display: flex;
            justify-content: flex-end;
            position: relative;
        }

        /* NOTE: For the exact design, you need a PNG image with a 
           transparent background of the hand holding the camera. 
        */
        .cta-section .camera-img {
            max-width: 100%;
            height: auto;
            /* In a real scenario, you might position this absolutely 
               to get it to break the grid if necessary */
            transform: scale(1.1); /* Slight zoom to match impact */
            transform-origin: bottom right;
        }

        .bg_img{
                width: 100%;
    padding: 0;
    margin: 0;

        }
        
        /* --- CTA Section Container --- */
        .cta-section {
            background-color: var(--primary-slate);
            width: 100%;
            min-height: 400px; /* Adjust based on preference */
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden; /* Ensures image doesn't spill out accidentally */
            padding-top: 60px;
        }

        .cta-section .container {
            max-width: 1200px;
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            position: relative;
            z-index: 2;
        }

        /* --- Left Side Content --- */
        .cta-section .content-col {
            flex: 1;
            max-width: 600px; /* Limits text width */
            color: var(--white);
            padding-right: 40px;
        }

        .cta-section h1 {
            font-family: 'Playfair Display', serif;
            font-size: 48px;
            font-weight: 600;
            margin-bottom: 25px;
            line-height: 1.2;
            color: #fff;
        }
        
        /* The italic style for the brand name */
        .cta-section h1 em {
            font-style: italic;
        }

        .cta-section p {
            font-size: 15px;
            line-height: 1.6;
            margin-bottom: 35px;
            color: rgba(255, 255, 255, 0.85); /* Slight transparency for text */
            font-weight: 400;
        }


      
        /* --- Right Side Image --- */
        .cta-section .image-col {
            flex: 1;
            display: flex;
            justify-content: flex-end;
            position: relative;
        }

        /* NOTE: For the exact design, you need a PNG image with a 
           transparent background of the hand holding the camera. 
        */
        .cta-section .camera-img {
            max-width: 100%;
            height: auto;
            /* In a real scenario, you might position this absolutely 
               to get it to break the grid if necessary */
            transform: scale(1.1); /* Slight zoom to match impact */
            transform-origin: bottom right;
        }

        .bg_img{
                width: 100%;
    padding: 0;
    margin: 0;

        }
        /* --- Responsive Design --- */
        @media (max-width: 900px) {
            .cta-section {
                text-align: center;
                padding-bottom: 0; /* Image sits at bottom */
            }

            .cta-section .container {
                flex-direction: column;
            }

            .cta-section .content-col {
                padding-right: 0;
                margin-bottom: 40px;
            }

            .cta-section .image-col {
                justify-content: center;
            }
            
            .cta-section h1 { font-size: 36px; }
        }

        /* --- Responsive Design --- */
        @media (max-width: 900px) {
            .cta-section {
                text-align: center;
                padding-bottom: 0; /* Image sits at bottom */
            }

            .cta-section .container {
                flex-direction: column;
            }

            .cta-section .content-col {
                padding-right: 0;
                margin-bottom: 40px;
            }

            .cta-section .image-col {
                justify-content: center;
            }
            
            .cta-section h1 { font-size: 36px; }
        }