.selm-71 .selm-ddlm.selm-ddlm-47e13d16{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:60px;--padding-bottom:60px;--padding-left:0px;--padding-right:0px;}.selm-widget-heading .selm-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.selm-71 .selm-ddlm.selm-ddlm-651f95b6{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:center;}.selm-71 .selm-ddlm.selm-ddlm-651f95b6 .selm-heading-title{font-family:"Lato", Sans-serif;font-size:60px;color:var( --e-global-color-9f3b2fd );}.selm-71 .selm-ddlm.selm-ddlm-18b7da37{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--flex-wrap:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:60px;--padding-bottom:60px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}@media(min-width:768px){.selm-71 .selm-ddlm.selm-ddlm-47e13d16{--content-width:1440px;}.selm-71 .selm-ddlm.selm-ddlm-18b7da37{--content-width:1400px;}}@media(max-width:1024px) and (min-width:768px){.selm-71 .selm-ddlm.selm-ddlm-18b7da37{--content-width:850px;}}@media(min-width:2400px){.selm-widget-heading .selm-heading-title{font-size:var( --e-global-typography-primary-font-size );}}@media(max-width:1366px){.selm-widget-heading .selm-heading-title{font-size:var( --e-global-typography-primary-font-size );}}@media(max-width:1024px){.selm-widget-heading .selm-heading-title{font-size:var( --e-global-typography-primary-font-size );}}@media(max-width:767px){.selm-widget-heading .selm-heading-title{font-size:var( --e-global-typography-primary-font-size );}.selm-71 .selm-ddlm.selm-ddlm-651f95b6 .selm-heading-title{font-size:30px;}.selm-71 .selm-ddlm.selm-ddlm-18b7da37{--content-width:100%;}}
.my-hover-card {
position: relative;
width: 400px;
height: 300px;
border-radius: 10px;
overflow: hidden;
font-family: 'Karla', sans-serif;
background-size: cover;
background-position: center;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
.my-hover-card__front {
position: absolute;
top: 0; 
left: 0; 
width: 100%; 
height: 100%;
display: flex;
align-items: center;
justify-content: center;
z-index: 1; 
transition: all 0.6s cubic-bezier(0.23, 1, 0.320, 1);
background: linear-gradient(to bottom, rgba(0,0,0,0) 60%, rgba(0,0,0,0.8) 100%);
}
.my-hover-card__front h2 {
font-size: 20px;
font-weight: 700;
margin: 0;
background: linear-gradient(to right, #ffffff, #ffffff); 
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.8));
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
width: 100%;
text-align: center;
}
.my-hover-card__back {
position: absolute;
top: 0; 
left: 0; 
width: 100%; 
height: 100%;
background: linear-gradient(to bottom, rgba(17, 17, 17, 0.9) 0%, rgba(11, 163, 96, 0.9) 100%);
display: flex;
flex-direction: column;
justify-content: flex-start; 
align-items: flex-start; 
padding: 5px 15px;
box-sizing: border-box; 
z-index: 2; 
transform: translateY(calc(-100% + 8px)); 
transition: all 1.25s cubic-bezier(0.23, 1, 0.320, 1);
}
.my-hover-card__back h3 {
color: #ffffff;
font-size: 32px;
font-weight: 700;
margin: 0;
}
.my-hover-card__back p {
font-family: 'Karla', sans-serif;
color: #FFFFFF !important; 
font-size: 16px;
font-weight: 200; 
line-height: 25px;
text-transform: none;
font-style: normal;
text-decoration: none;
letter-spacing: normal;
word-spacing: normal;
margin: 15px 0 20px 0; 
}
.my-hover-card__back a {
display: inline-block;
padding: 4px 14px;
background-color: #ffffff;
color: #000000;
text-decoration: none;
font-size: 14px;
font-weight: 700;
border-radius: 5px;
transition: all 0.3s ease;
position: absolute;
margin-top: auto;
bottom: 20px;
left: 20px;
}
.my-hover-card__back a:hover {
background-color: #0ba360; 
color: #ffffff;
box-shadow: 0 4px 8px rgba(0,0,0,0.3);
}
.my-hover-card:hover .my-hover-card__back {
transform: translateY(0);
}
.my-hover-card:hover .my-hover-card__front {
transform: translateY(30%);
opacity: 0;
}
.bg-card-1 { background-image: url('//dataletheia.com/media/2026/05/Mfcwwo-scaled.jpg'); }
.bg-card-2 { background-image: url('//dataletheia.com/media/2026/03/maturity-assessment-scaled.jpeg'); }
.bg-card-3 { background-image: url('//dataletheia.com/media/2026/03/data-strategy-scaled.jpeg'); }
.bg-card-4 { background-image: url('//dataletheia.com/media/2026/03/data-governance-scaled.jpeg'); }
.bg-card-5 { background-image: url('//dataletheia.com/media/2026/03/data-architecture-scaled.jpeg'); }
.bg-card-6 { background-image: url('//dataletheia.com/media/2026/03/business-intelligence-scaled.jpeg'); }
.bg-card-7 { background-image: url('//dataletheia.com/media/2026/03/data-quality.jpeg'); }
.bg-card-8 { background-image: url('//dataletheia.com/media/2026/03/advanced-analytics-scaled.jpeg'); }
.bg-card-9 { background-image: url('//dataletheia.com/media/2026/03/data-auditing-scaled.jpeg'); }
@media (min-width: 768px) and (max-width: 1024px) {
body .my-hover-card {
width: 330px !important; 
height: 280px !important;
margin: 0 auto 20px auto !important; 
}
body .my-hover-card__front h2 {
font-size: 18px !important;
}
body .my-hover-card__back h3 {
font-size: 26px !important;
}
body .my-hover-card__back p {
font-size: 14px !important;
line-height: 20px !important;
margin: 10px 0 15px 0 !important;
}
body .my-hover-card__back a {
font-size: 13px !important;
padding: 3px 10px !important;
bottom: 15px !important;
left: 15px !important;
}
}
@media (max-width: 767px) {
body .my-hover-card {
width: 340px !important; 
height: 300px !important; 
margin: 0 auto 20px auto !important; 
display: block !important; 
}
body .my-hover-card__front h2 {
font-size: 18px !important; 
}
body .my-hover-card__back p {
font-size: 14px !important;
margin-bottom: 5px; 
}
body .my-hover-card__back {
padding: 10px 7px 100px 7px !important; 
}
}