/* Services module cards */

.mods{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid rgba(20,23,15,.2)}
.mod{padding:30px 24px 34px;border-left:1px solid rgba(20,23,15,.2);position:relative;transition:background .3s;display:flex;flex-direction:column}
.mod:first-child{border-left:0}
.mod:hover{background:var(--paper-2)}
.mod .id{font-family:var(--mono);font-size:9px;letter-spacing:.18em;color:var(--sage);display:flex;justify-content:space-between;margin-bottom:44px}
.mod .id em{font-style:normal;color:var(--sage)}
.rec{display:inline-flex;align-items:center;gap:7px;color:var(--rec);letter-spacing:.2em}
.rec i{width:8px;height:8px;border-radius:50%;background:var(--rec);flex:none;position:relative;
  animation:recblink 1.6s ease-in-out infinite}
.rec i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--rec);
  opacity:0;animation:recring 1.6s ease-out infinite}
@keyframes recblink{0%,45%{opacity:1}62%,100%{opacity:.22}}
@keyframes recring{0%{opacity:.5;transform:scale(.7)}70%,100%{opacity:0;transform:scale(1.25)}}
.mod:nth-child(2) .rec i,.mod:nth-child(2) .rec i::after{animation-delay:.4s}
.mod:nth-child(3) .rec i,.mod:nth-child(3) .rec i::after{animation-delay:.8s}
.mod:nth-child(4) .rec i,.mod:nth-child(4) .rec i::after{animation-delay:1.2s}
@media(prefers-reduced-motion:reduce){.rec i,.rec i::after{animation:none}.rec i::after{opacity:0}}
.mod h3{font-weight:700;font-size:21px;letter-spacing:-.02em;margin-bottom:12px}
.mod p{font-size:13.5px;line-height:1.66;color:#4E5748;margin-bottom:18px}
.mod ul{list-style:none;border-top:1px solid rgba(20,23,15,.18);margin-top:auto}
.mod li{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--sage);padding:8px 0;border-bottom:1px solid rgba(20,23,15,.1)}
.mod li::before{content:"+ ";color:var(--orange)}
