/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: May 07 2026 | 17:34:16 */
/* 1. Override Divi's Grid to control the gap and column heights */
.custom-blog-grid .et_pb_salvattore_content {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    gap: 20px !important; /* CHANGE THIS VALUE to reduce or increase space between posts */
}

/* Force Divi's column wrappers to stretch */
.custom-blog-grid .et_pb_salvattore_content .column {
    width: 100% !important;
    margin: 0 !important;
    display: flex !important;
}

/* 2. Equal Heights & Hover Effects */
.custom-blog-grid .et_pb_post {
    display: flex !important;
    flex-direction: column;
    flex-grow: 1; /* Forces the card to stretch to equal height */
    width: 100% !important;
    margin-bottom: 0 !important;
    background-color: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.custom-blog-grid .et_pb_post:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
}

/* Order elements: Image (1), Date (2), Title (3), Excerpt (4) */
.custom-blog-grid .entry-featured-image-url { order: 1; margin-bottom: 0 !important; }
.custom-blog-grid .post-meta { order: 2; margin-top: 25px; }
.custom-blog-grid .entry-title { order: 3; margin-top: 10px; }
.custom-blog-grid .post-content { 
    order: 4; 
    flex-grow: 1; /* Makes the excerpt area fill the rest of the height */
    position: relative; /* Required to stick the Read More link to the bottom */
}

/* Fix inner padding */
.custom-blog-grid .post-meta,
.custom-blog-grid .entry-title,
.custom-blog-grid .post-content {
    padding-left: 20px;
    padding-right: 20px;
}
.custom-blog-grid .post-content {
    padding-bottom: 70px; /* Gives extra space at the bottom so text doesn't hit the Read More link */
}

/* 3. Stick the "Read More" link to the bottom and style it */
.custom-blog-grid .more-link {
    position: absolute;
    bottom: 30px; /* Keeps it exactly 30px from the bottom of the white card */
    left: 30px;   /* Keeps it aligned with the text padding */
    text-transform: capitalize !important;
    font-weight: 600;
    color: #1b4998 !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Add Divi's right arrow icon and animate it on hover */
.custom-blog-grid .more-link::after {
    content: '\35'; 
    font-family: "ETmodules";
    font-size: 16px;
    transition: transform 0.3s ease;
}
.custom-blog-grid .more-link:hover::after {
    transform: translateX(5px);
}