/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: May 06 2026 | 13:30:16 */
:not(.sticky)  .logo img  {
    clip-path: circle();
    padding: 10px;
    background: #ffffff;
}

/* Force the interactive text container to respect its parent width */
.w-itext-part {
    max-width: 100% !important;
    width: auto !important;
    display: inline-block !important;
    white-space: normal !important; /* Forces text to wrap to the next line */
    word-wrap: break-word !important;
}

/* Ensure the individual text states also wrap */
.w-itext-state {
    display: inline !important;
    white-space: normal !important;
}



/* Container for the 3-column layout */
.benefit-grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    padding: 40px 0;
}

/* Individual Box */
.benefit-item {
    text-align: center;
    transition: transform 0.3s ease;
}

/* Text above the image */
.benefit-text-top h4 {
    font-size: 1.1rem;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 20px;
    min-height: 50px; /* Keeps boxes aligned if text lengths vary */
}

/* The Image Box */
.benefit-image-wrapper {
    height: 250px;
    background-size: cover;
    background-position: center;
    position: relative;
    border: 1px solid rgba(255,255,255,0.1); /* Subtle border like the ref */
}

/* Darkening overlay for that moody look */
.image-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.4); 
}