/* Projects Section Frontend Styles */
.nationalcement-projects-section .card-with-overlay {
    position: relative;
    overflow: hidden;
    border-radius: 0.375rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    height: 20rem;
    transition: transform 0.3s ease-in-out;
}

.nationalcement-projects-section .card-with-overlay:hover {
    transform: translateY(-5px);
}

/* Ensure background images display correctly */
.nationalcement-projects-section .bg-cover {
    background-size: cover;
}

.nationalcement-projects-section .bg-center {
    background-position: center;
}

/* Overlay colors */
.nationalcement-projects-section .bg-primary {
    background-color: #c81431;
}

.nationalcement-projects-section .bg-black {
    background-color: #000000;
}

/* Opacity utilities */
.nationalcement-projects-section .bg-opacity-50,
.nationalcement-projects-section .bg-primary\/50 {
    --tw-bg-opacity: 0.5;
}

.nationalcement-projects-section .bg-opacity-40,
.nationalcement-projects-section .bg-black\/40 {
    --tw-bg-opacity: 0.4;
}

/* Ensure line clamp works across browsers */
.nationalcement-projects-section .line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Ensure SVG styling is consistent */
.nationalcement-projects-section .stroke-white {
    stroke: white;
}

/* Button styling */
.nationalcement-projects-section .inline-flex {
    display: inline-flex;
    align-items: center;
}

.nationalcement-projects-section .gap-2 {
    gap: 0.5rem;
}