.elementor-28 .elementor-element.elementor-element-bd76a84{--display:flex;--margin-top:60px;--margin-bottom:60px;--margin-left:0px;--margin-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-28 .elementor-element.elementor-element-bc40b30{text-align:center;}.elementor-28 .elementor-element.elementor-element-bc40b30 .elementor-heading-title{font-family:"Cormorant Garamond", Sans-serif;font-size:48px;font-weight:400;font-style:italic;color:var( --e-global-color-093d6f0 );}.elementor-28 .elementor-element.elementor-element-9110ee3{text-align:center;}.elementor-28 .elementor-element.elementor-element-9110ee3 .elementor-heading-title{font-family:"Cormorant Garamond", Sans-serif;font-size:24px;font-weight:600;font-style:italic;color:var( --e-global-color-d5d2ccf );}.elementor-28 .elementor-element.elementor-element-4daf50e{width:var( --container-widget-width, 45% );max-width:45%;margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:45%;--container-widget-flex-grow:0;}.elementor-28 .elementor-element.elementor-element-4daf50e.elementor-element{--align-self:center;}.elementor-widget-loop-grid .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-loop-grid .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-loop-grid .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-28 .elementor-element.elementor-element-a57ee64{--grid-columns:3;}.elementor-28 .elementor-element.elementor-element-a57ee64 > .elementor-widget-container{margin:30px 0px 0px 0px;}body.elementor-page-28:not(.elementor-motion-effects-element-type-background), body.elementor-page-28 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-f18dd28 );}@media(max-width:1024px){.elementor-28 .elementor-element.elementor-element-a57ee64{--grid-columns:2;}}@media(min-width:768px){.elementor-28 .elementor-element.elementor-element-bd76a84{--content-width:1200px;}}@media(max-width:767px){.elementor-28 .elementor-element.elementor-element-4daf50e{--container-widget-width:88%;--container-widget-flex-grow:0;width:var( --container-widget-width, 88% );max-width:88%;}.elementor-28 .elementor-element.elementor-element-a57ee64{--grid-columns:1;}}/* Start custom CSS for loop-grid, class: .elementor-element-a57ee64 *//* --- BASE STYLES --- */

/* 1. Immagine (Stato iniziale) */
.foto-ovale img {
    height: 180px !important;
    width: 135px !important;
    object-fit: cover !important;
    border-radius: 50% !important; /* 50% è più pulito di 100%/100% per gli ovali */
    
    /* Filtri iniziali */
    filter: grayscale(100%);
    opacity: 0.9;
    
    /* Preparazione bordo (trasparente per evitare scatti al passaggio del mouse) */
    border: 2px solid transparent !important; 
    
    /* Transizione fluida per tutto */
    transition: all 0.5s ease-in-out !important;
    margin-bottom: 25px !important;
}

/* 2. Titolo (Stato iniziale) */
/* Aggiungiamo la transizione anche al titolo per un cambio colore morbido */
.nome-defunto, 
.nome-defunto h1, 
.nome-defunto h2, 
.nome-defunto h3,
.nome-defunto div {
    transition: color 0.5s ease-in-out !important;
}


/* --- HOVER EFFECTS --- */

/* Quando passo sopra la card, modifico l'immagine */
.card-epigrafe:hover .foto-ovale img {
    transform: scale(1.05) !important; /* Cresce del 5% */
    filter: grayscale(0%) !important;  /* Via il bianco e nero */
    opacity: 1 !important;             /* Opacità piena */
    border-color: #D4AF37 !important;  /* Il bordo diventa Oro */
}

/* Quando passo sopra la card, modifico il titolo */
.card-epigrafe:hover .info-necrologio .nome-defunto,
.card-epigrafe:hover .info-necrologio .nome-defunto h2, /* Targettiamo anche i tag interni per sicurezza */
.card-epigrafe:hover .nome-defunto h3,
.card-epigrafe:hover .nome-defunto div {
    color: #D4AF37 !important;
}


/* Quando card-epigrafe è in hover...
   ...cerca dentro info-necrologio...
   ...poi dentro nome-defunto...
   ...e colora il testo specifico */

.card-epigrafe:hover .info-necrologio .nome-defunto .elementor-heading-title,
.card-epigrafe:hover .info-necrologio .nome-defunto h2,
.card-epigrafe:hover .info-necrologio .nome-defunto h3,
.card-epigrafe:hover .info-necrologio .nome-defunto span,
.card-epigrafe:hover .info-necrologio .nome-defunto a {
    color: #D4AF37 !important;
}/* End custom CSS */