/**
 * Feature: News Blurb Module
 * Safe to remove if: feature/module no longer used
 *
 * Adds styling to Divi's Blurb module to show the content over the image on hover.
 * Very similar to the Staff Blurb Module feature
 *
 * Tokens available:
 * - See assets/css/tokens.css (var(--lfd-color-accent), etc.)
 *
 * Module class: .re-news-as-blurb
 */


/* Remove initial animation */
.et_pb_blurb.re-news-as-blurb .et_pb_animation_top,
.et_pb_blurb.re-news-as-blurb .et_pb_animation_fade_in {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
}

/* Remove the tiny “baseline” height under the image */
.re-news-as-blurb .et_pb_blurb_content,
.re-news-as-blurb .et_pb_main_blurb_image {
    line-height: 0 !important;
}

/* Restore normal line-height for the overlay text */
.re-news-as-blurb .et_pb_blurb_container {
    line-height: 1.3;
}

.re-news-as-blurb .et_pb_main_blurb_image {
    margin: 0 !important;
}

/* 1) Make the blurb a clipping/positioning context */
.re-news-as-blurb.et_pb_blurb {
    position: relative;
    overflow: hidden;          /* clips the expanding overlay */
}

/* Optional: remove any odd spacing around the image */
.re-news-as-blurb .et_pb_main_blurb_image,
.re-news-as-blurb .et_pb_main_blurb_image img {
    display: block;
    margin: 0;
}

/* 2) Turn the container into a full-cover overlay and center content */
.re-news-as-blurb .et_pb_blurb_container {
    position: absolute;
    inset: 0;                  /* top/right/bottom/left: 0 */
    z-index: 2;

    display: flex;
    flex-direction: column;
    /*align-items: center;*/
    justify-content: center;
    text-align: center;

    padding: 18px;             /* tweak */

    opacity: 0;                /* hidden until hover */
    pointer-events: none;      /* overlay doesn’t block hover */
    transition: opacity 200ms ease;
}

/* 3) Create the “radiating” overlay background */
.re-news-as-blurb .et_pb_blurb_container::before {
    content: "";
    position: absolute;
    inset: -20%;               /* oversize so edges stay covered while scaling */
    z-index: -1;

    background: var(--re-overlay-color);
    transform: scale(0);
    transform-origin: 50% 50%;
    transition: transform 350ms ease;
}

/* 4) Hover state: reveal + expand from center */
.re-news-as-blurb.et_pb_blurb:hover .et_pb_blurb_container {
    opacity: 1;
}

.re-news-as-blurb.et_pb_blurb:hover .et_pb_blurb_container::before {
    transform: scale(1);
}

/* 5) Optional: make the text fade/slide in slightly */
.re-news-as-blurb .et_pb_blurb_container .et_pb_module_header,
.re-news-as-blurb .et_pb_blurb_container .et_pb_blurb_description {
    transform: translateY(6px);
    opacity: 0;
    transition: transform 250ms ease, opacity 250ms ease;
}

.re-news-as-blurb.et_pb_blurb:hover .et_pb_blurb_container .et_pb_module_header,
.re-news-as-blurb.et_pb_blurb:hover .et_pb_blurb_container .et_pb_blurb_description {
    transform: translateY(0);
    opacity: 1;
}

/* 6) Ensure the image sits below the overlay */
.re-news-as-blurb .et_pb_main_blurb_image {
    position: relative;
    z-index: 1;
}