/* Extra styles for service x city landing pages and the service links on city pages */
.cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.cases article { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 1.8rem; border-top: 4px solid var(--navy); transition: border-color .25s, transform .3s var(--ease), box-shadow .3s var(--ease); }
.cases article:hover { border-top-color: var(--red); transform: translateY(-4px); box-shadow: 0 26px 50px -30px rgba(8, 43, 104, .45); }
.cases h3 { margin-bottom: .6rem; }
.related { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 5vw, 5rem); }
.related h2 { font-size: 1.4rem; letter-spacing: -.02em; margin-bottom: 1rem; }
.related li { border-top: 1px solid var(--line); }
.related li:last-child { border-bottom: 1px solid var(--line); }
.related a { display: block; padding: .85rem 0; font-weight: 700; color: var(--navy); transition: color .2s, padding .25s var(--ease); }
.related a:hover { color: var(--red); padding-left: .5rem; }
.svc-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.svc-links a { display: block; padding: 1.2rem 1.4rem; border: 1px solid var(--line); border-radius: var(--r); background: #fff; font-weight: 700; color: var(--navy); transition: border-color .2s, transform .3s var(--ease); }
.svc-links a:hover { border-color: var(--red); transform: translateY(-3px); }
@media (max-width: 860px) {
  .cases, .related { grid-template-columns: minmax(0, 1fr); }
}