.service-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
.service-grid .card { min-width: 0; }
.service-grid .card-body { height: 100%; }
.service-grid .text-link { margin-top: auto; }
.service-hero { display: grid; gap: var(--space-6); align-items: start; }
.service-graphic { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: var(--space-5); padding: var(--space-6); min-height: 14rem; border: var(--border); border-left: 3px solid var(--color-orange); border-radius: var(--radius-md); background: var(--color-surface); }
.service-graphic .icon { width: 64px; height: 64px; }
.service-graphic span { max-width: 22rem; font-size: var(--text-h3); font-weight: 650; overflow-wrap: anywhere; }
.service-product-links { display: grid; gap: var(--space-3); list-style: none; padding: 0; margin-bottom: var(--space-5); }
.service-product-links a { display: flex; align-items: center; min-height: 48px; padding: var(--space-3); border: var(--border); border-radius: var(--radius-sm); font-weight: 600; overflow-wrap: anywhere; }
.service-product-links a:hover { background: var(--color-surface); }
.service-link-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
@media (min-width: 40rem) { .service-grid, .service-product-links { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 56rem) { .service-hero { grid-template-columns: .8fr 1.2fr; } }