#sp-header {position:absolute; background: linear-gradient(0deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);}
#sp-header.header-sticky {background:#000000}
.burger-icon>span{background-color: #ffffff !important;}
.sp-page-title {
    text-align: center;
    padding: 200px 0 0;
    min-height: 525px;
    overflow: hidden;
}
.sp-page-title h2 {
    font-size: clamp(80px, 10vw, 110px)!important;
    line-height: 1;
    font-weight: 700;
    font-size: 190px;
    color: #FFFFFF;
    letter-spacing: clamp(-5px, -0.45vw, -2px);
    position: relative;
    -webkit-text-shadow: 0 11px 10px rgba(0,0,0,0.19);
    text-shadow: 0 11px 10px rgba(0, 0, 0, 0.19);
}
.sp-page-title {
    background: url(../../images/preset1-page-title-bg.jpg) no-repeat scroll center center / cover;
}
.up-curve-grey:before {
    content: '';
    position: absolute;
    top: -43px;
    background: url(../images/up-grey.png) no-repeat scroll center center / cover;
    height: 43px;
    width: 100%;
}
.down-curve-grey:after {
    content: '';
    position: absolute;
    top: auto;
    bottom: -43px;
    background: url(../images/down-grey.png) no-repeat scroll center center / cover;
    height: 43px;
    width: 100%;
}
.sppb-addon-article-layout-editorial-content {
    position: relative;
    display: block;
    overflow: hidden;
    background: #f2f2f2
}

.sppb-addon-article-layout-editorial-content::before {
    content: "";
    position: absolute;
    inset: -20% -35%;
    z-index: 2;
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(115deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.45) 50%,rgba(255,255,255,0) 62%);
    transform: translate3d(-140%,0,0) rotate(18deg);
    transition: transform .8s cubic-bezier(.22,1,.36,1),opacity .35s ease
}

.sppb-addon-article-layout-editorial-content img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.06);
    transition: transform .85s cubic-bezier(.22,1,.36,1),opacity .5s ease,filter .5s ease
}

.sppb-addon-article-layout-editorial-content:hover::before,.sppb-addon-article-layout-editorial-content:focus-visible::before {
    opacity: .9;
    transform: translate3d(140%,0,0) rotate(18deg)
}

.sppb-addon-article-layout-editorial-content:hover img,.sppb-addon-article-layout-editorial-content:focus-visible img {
    transform: scale(1);
    opacity: .84;
    filter: saturate(1.04) contrast(1.05)
}
/* 1. Pregătim containerul imaginii (izolează zoom-ul și lumina în interiorul chenarului) */
.blog .article .article-intro-image {
    position: relative;
    display: block;
    overflow: hidden; /* Taie tot ce iese din cadrul imaginii */
    width: 100%;
    height: auto;
}

/* 2. Setările inițiale pentru imagine (Pornim de la un zoom-in ușor) */
.blog .article .article-intro-image img {
    transform: scale(1.08) !important; /* Forțăm imaginea să înceapă puțin mărită */
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1) !important; /* Tranziție fină */
    display: block;
    width: 100% !important;
    height: auto !important;
}

/* 3. Efectul de ZOOM-OUT când se trece cu mouse-ul peste întregul card sau peste imagine */
.blog .article:hover .article-intro-image img {
    transform: scale(1) !important; /* Revine la dimensiunea normală (zoom-out) */
}

/* 4. Construim raza de lumină (Ray Light) ca un overlay peste div-ul imaginii */
.blog .article .article-intro-image::after {
    content: '';
    position: absolute;
    top: 0;
    left: -150%; /* Poziționată inițial în stânga, în afara cadrului */
    width: 60%;
    height: 100%;
    
    /* Degradeul alb/transparent pentru efectul de bliț */
    background: linear-gradient(
        to right, 
        rgba(255, 255, 255, 0) 0%, 
        rgba(255, 255, 255, 0.4) 50%, 
        rgba(255, 255, 255, 0) 100%
    );
    
    transform: skewX(-25deg); /* Înclinăm raza de lumină */
    pointer-events: none;     /* Ne asigurăm că nu blochează click-ul pe link */
    z-index: 2;               /* O aducem deasupra imaginii */
}

/* 5. Activăm trecerea razei de lumină la hover */
.blog .article:hover .article-intro-image::after {
    left: 150%; /* Traversează rapid imaginea spre dreapta */
    transition: left 0.7s ease-in-out !important;
}