.hover-img-label {
position: relative;
overflow: hidden;
} .hover-img-label::before {
content: "";
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.35);
opacity: 0;
transition: opacity 0.4s ease;
z-index: 1;
} .hover-img-label:hover::before {
opacity: 1;
} .hover-img-label::after {
position: absolute;
left: 0;
bottom: -100%;
width: 100%;
padding: 12px 10px;
background: #1E3A8A; color: #ffffff;
font-size: 15px;
font-weight: 600;
text-align: center;
transition: bottom 0.35s ease;
z-index: 2;
} .hover-img-label:hover::after {
bottom: 0;
} .hover-img-label::before,
.hover-img-label::after {
pointer-events: none;
} .label-akumulator::after { content: "Akümülatör Kontrolü"; }
.label-basincli::after { content: "Basınçlı Kaplar"; }
.label-elektrik::after { content: "Elektrik Tesisatı"; }
.label-kapi-raf::after { content: "Endüstriyel Kapı ve Raflar"; }
.label-havalandirma::after { content: "Havalandırma Tesisatı"; }
.label-is-makineleri::after { content: "İş Makineleri"; }
.label-jenerator::after { content: "Jeneratör Muayenesi"; }
.label-kaldirma::after { content: "Kaldırma İletme Ekipmanları"; }
.label-katodik::after { content: "Katodik Koruma Ölçümü"; }
.label-tezgah::after { content: "Tezgahların Muayenesi"; }
.label-topraklama::after { content: "Topraklama Ölçümü"; }
.label-trafo::after { content: "Trafo Kontrolü"; }
.label-yangin-alg::after { content: "Yangın Algılama Sistemi"; }
.label-yangin-tesisat::after { content: "Yangın Tesisatı"; }
.label-paratoner::after { content: "Yıldırımlık (Paratoner)"; } .label-akumulator::after,
.label-elektrik::after,
.label-jenerator::after,
.label-katodik::after,
.label-topraklama::after,
.label-trafo::after,
.label-paratoner::after,
.label-yangin-alg::after {
background: #dc2626;
} @media (max-width: 768px) { .hover-img-label::before {
display: none;
} .hover-img-label::after {
bottom: -100%;
} .hover-img-label:active::after,
.hover-img-label:focus-within::after {
bottom: 0;
}
}