* ✅ Downward Scroll Arrow */
.next-arrow {
    position: absolute;
    bottom: 40px; /* Distance from the bottom */
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 40px;
    cursor: pointer;
    z-index: 9999;
}

/* ✅ Pure CSS Chevron */
.next-arrow .chevron {
    width: 20px;
    height: 20px;
    border-left: 4px solid white;
    border-bottom: 4px solid white;
    transform: rotate(-45deg);
    margin: auto;}

/* ✅ Hover Effect */
.next-arrow:hover .chevron {
    opacity: 0.7;
}

/* Main container - Centers content both vertically and horizontally */
.cust-main-targetcare {
    display: flex;
    align-items: center; /* Centers content vertically */
    justify-content: center; /* Centers content horizontally */
    flex-wrap: wrap;
    width: 100%;
    min-height: 100%; /* Ensures full height */
    gap: 20px; /* Adds spacing between text and image */
}
.cust-targetcare-info h1 {
    color: #000!important;
    font-family: Outfit, sans-serif;
    font-size: 55px!important;
    font-weight: 600!important;
    line-height: normal;
    text-align: center;


}
/* Ensures the image stays centered in its section */
.cust-inner-targetcare-header {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    overflow: hidden;
    width: 30%;
    height: 50vw;
    max-width:600px;
    max-height:600px;
    flex-shrink: 0; /* Prevents resizing */
    position: relative;
    margin:auto;
}
/* Style the icon container */
.cust-icon-tc {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px; /* Adjust if needed */
    height: 80px; /* Keep square ratio */
    background-color: #011971; /* Match the correct dark blue color */
    border-radius: 15px; /* Adds rounded corners */
    padding: 10px; /* Ensures spacing inside */
    margin: 0 auto 15px; /* Centers above text */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Adds subtle shadow */
}

/* Ensure the icon image is centered inside */
.cust-icon-tc img {
    width: 50px; /* Adjust to fit */
    height: 50px;
    object-fit: contain; /* Ensures the whole icon fits */
}

.cust-inner-targetcare-header img {
    width: 110%;
    height: 110%;
    object-fit: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)!important; /* Centers image inside the circle */
}

/* Ensures text content aligns correctly */
.cust-targetcare-info {
    flex: 1;
    text-align: center;
    padding: 20px;
    max-width: 600px;
}


/* ✅ Responsive adjustments */
@media screen and (max-width: 1024px) {
    .cust-main-targetcare {
        flex-direction: column-reverse; /* ✅ Moves image to top on mobile */
        text-align: center;
    }

    .cust-inner-targetcare-header {
        max-width: 70vw;
         flex-direction: column-reverse;  /* Smaller size on tablets */
    }
}

@media screen and (max-width: 768px) {
    .cust-inner-targetcare-header {
        max-width: 80vw;
         flex-direction: column-reverse;  /* Smaller size on mobile */
    }
}