/* services.css - the services overview. Its object is the five rows, each a photograph plus a
   scope summary: a different shape from the home page's six-card grid, which is the point. */
.srows{margin-top:44px;display:grid;gap:26px}
.srow{display:grid;grid-template-columns:.9fr 1.1fr;gap:0;border:1px solid var(--line);
      border-radius:var(--radius);overflow:hidden;background:#fff}
.srow:nth-child(even){grid-template-columns:1.1fr .9fr}
.srow:nth-child(even) .shot{order:2}
.srow .shot{display:block}
.srow .shot img{width:100%;height:100%;min-height:250px;object-fit:cover}
.srow .pad{padding:32px 34px;display:flex;flex-direction:column;gap:10px;justify-content:center}
.srow h2{font-size:1.5rem;max-width:none}
.srow .when{font-size:.82rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
            color:var(--teal-deep)}
.srow p{color:var(--ink-soft);font-size:.98rem}
.srow .more{font-weight:700;font-size:.92rem;text-decoration:none;color:var(--teal-deep);margin-top:4px}
.srow .more::after{content:" \2192"}
.srow .more:hover{text-decoration:underline}
@media(max-width:820px){
  .srow,.srow:nth-child(even){grid-template-columns:1fr}
  .srow:nth-child(even) .shot{order:0}
  .srow .shot img{min-height:0;height:210px}
  .srow .pad{padding:24px 22px}
}
.numlist{margin-top:28px;list-style:none;counter-reset:n;max-width:var(--measure-read)}
.numlist li{counter-increment:n;position:relative;padding:18px 0 18px 52px;
            border-top:1px solid var(--line);color:var(--ink-soft)}
.numlist li:first-child{border-top:0}
.numlist li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:19px;
  font-family:var(--disp);font-weight:800;font-size:.9rem;color:var(--teal-deep);
  font-variant-numeric:tabular-nums}
.numlist b{color:var(--teal-ink)}