/* homepage services: tinted photo tiles */
.services-section {
    position: relative;
    background: #0a1124;
    overflow: hidden;
}
.services-section > .container {
    position: relative;
    z-index: 1;
}
.services-tile {
    position: relative;
    overflow: hidden;
    color: #fff;
    background-color: var(--tile-bg);
    border-top: 4px solid var(--tile);
}
.services-tile-sky { --tile: #47a3f2; --tile-bg: #04203f; --tile-tint: rgba(71, 163, 242, .4); }
.services-tile-blue { --tile: #0280ee; --tile-bg: #03173a; --tile-tint: rgba(2, 128, 238, .4); }
.services-tile-indigo { --tile: #3f51b5; --tile-bg: #0d1233; --tile-tint: rgba(63, 81, 181, .45); }
.services-tile-royal { --tile: #122bb5; --tile-bg: #060b33; --tile-tint: rgba(18, 43, 181, .45); }
.services-tile img {
    filter: grayscale(1) contrast(1.15);
    opacity: .8;
    transition: transform .7s cubic-bezier(.22, 1, .36, 1);
}
.services-tile:hover img {
    transform: scale(1.05);
}
.services-tile-shade {
    background: linear-gradient(180deg, var(--tile-bg) 0%, var(--tile-tint) 30%, var(--tile-tint) 48%, var(--tile-bg) 82%);
}

@media (max-width: 575px) {
    .services-tile { min-height: 430px !important; }
}
@media (prefers-reduced-motion: reduce) {
    .services-tile img { transition: none; }
    .services-tile:hover img { transform: none; }
}