#sertechs-site .sr-services { padding: 145px 0; background: var(--sr-page); }
#sertechs-site .sr-services__list { border-top: 1px solid var(--sr-line); }
#sertechs-site .sr-service { display: grid; grid-template-columns: 75px minmax(260px,.75fr) minmax(320px,1fr) 55px; align-items: center; gap: 34px; min-height: 138px; border-bottom: 1px solid var(--sr-line); transition: padding .35s var(--sr-ease), background .35s var(--sr-ease); }
#sertechs-site .sr-service::before { position: absolute; right: 0; left: 0; height: 100%; transform: scaleY(0); transform-origin: bottom; content: ""; transition: transform .35s var(--sr-ease); z-index: -1; }
#sertechs-site .sr-service { position: relative; z-index: 1; }
#sertechs-site .sr-service:hover { padding-inline: 22px; color: #000; }
#sertechs-site .sr-service:hover::before { transform: scaleY(1); }
#sertechs-site .sr-service > span { color: var(--sr-muted); font-size: 12px; font-weight: 800; }
#sertechs-site .sr-service h3 { font-size: clamp(28px,3vw,44px); letter-spacing: -.045em; }
#sertechs-site .sr-service p { max-width: 600px; color: var(--sr-muted); font-size: 14px; line-height: 1.7; }
#sertechs-site .sr-service b { display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid var(--sr-line); border-radius: 50%; font-size: 18px; font-weight: 400; transition: transform .3s var(--sr-ease), background .3s ease; }
#sertechs-site .sr-service:hover > span, #sertechs-site .sr-service:hover p { color: #6d6762; }
#sertechs-site .sr-service:hover b { transform: rotate(45deg); background: #fff; color: var(--sr-ink); }

@media (max-width: 1100px) {
  #sertechs-site .sr-service { grid-template-columns: 60px minmax(220px,.8fr) 1fr 46px; gap: 20px; }
}
@media (max-width: 780px) {
  #sertechs-site .sr-services { padding: 95px 0; }
  #sertechs-site .sr-service { grid-template-columns: 46px 1fr 42px; gap: 14px; min-height: 130px; padding: 22px 0; }
  #sertechs-site .sr-service p { grid-column: 2 / -1; }
  #sertechs-site .sr-service:hover { padding-inline: 14px; }
}
