/* Homepage offer sections, Services use-case lines and Selected work cases. */
.ho-situations,.ho-work,.sv-work{background:#fff;color:var(--anthracite);font-family:var(--font-body)}
.ho-start{background:var(--taupe,#ECE6DE);color:var(--anthracite);font-family:var(--font-body)}
section.ho-situations:not(.field-hero):not(.hero):not(.vh-hero):not(.page-hero){padding-top:clamp(56px,7vw,104px);padding-bottom:clamp(40px,5vw,72px)}
section.ho-start:not(.field-hero):not(.hero):not(.vh-hero):not(.page-hero),section.ho-work:not(.field-hero):not(.hero):not(.vh-hero):not(.page-hero){padding-block:clamp(40px,5vw,72px)}
section.sv-work:not(.field-hero):not(.hero):not(.vh-hero):not(.page-hero){padding-block:clamp(40px,5vw,80px)}
.ho-title{font-family:var(--font-body);font-weight:500;font-size:clamp(1.75rem,3vw,3rem);line-height:1.1;letter-spacing:-.03em;margin:0 0 clamp(24px,3vw,40px);color:var(--anthracite)}
.ho-note{font-size:.9375rem;color:#555d5d;margin:-16px 0 24px}

/* Situations: the client's words on the left, the service that answers on the right */
.ho-sit-list{border-top:2px solid var(--anthracite)}
.ho-sit{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:center;min-height:88px;padding:16px 0;border-bottom:1px solid var(--line);color:var(--anthracite);text-decoration:none;transition:background-color .35s ease,color .35s ease,padding .45s var(--ease)}
.ho-sit:hover,.ho-sit:focus-visible{background:var(--frame);color:#fff;padding-left:28px;padding-right:28px}
.ho-sit-q{font-size:clamp(1.25rem,2vw,1.75rem);font-weight:500;line-height:1.25;letter-spacing:-.02em}
.ho-sit-to{display:inline-flex;align-items:center;gap:8px;font-size:1rem;color:#555d5d;justify-self:start}
.ho-sit:hover .ho-sit-to,.ho-sit:focus-visible .ho-sit-to{color:var(--signal)}

/* Ways to start */
.ho-start-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:2px solid var(--anthracite);border-bottom:1px solid var(--taupe-line,var(--line))}
.ho-start-item{display:flex;flex-direction:column;gap:14px;padding:clamp(20px,2.5vw,28px);border-right:1px solid var(--taupe-line,var(--line));color:var(--anthracite);text-decoration:none;min-height:190px;transition:background-color .35s ease,color .35s ease}
.ho-start-item:last-child{border-right:0}
.ho-start-item:hover,.ho-start-item:focus-visible{background:var(--frame);color:#fff}
.ho-start-name{font-size:clamp(1.125rem,1.5vw,1.375rem);font-weight:500;letter-spacing:-.02em;line-height:1.2}
.ho-start-copy{font-size:1rem;line-height:1.5}

/* Cases */
.case{display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,2.4fr);gap:clamp(24px,4vw,64px);border-top:2px solid var(--anthracite);padding:clamp(24px,3vw,36px) 0}
.case+.case{border-top-width:1px;border-top-color:var(--line)}
.case-meta,.case-label{font-size:.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--jade);margin:0 0 10px}
.case-title{font-family:var(--font-body);font-size:clamp(1.25rem,1.9vw,1.75rem);font-weight:500;line-height:1.2;letter-spacing:-.02em;margin:0 0 16px}
.case-link{font-size:.9375rem;font-weight:600;color:var(--anthracite);text-decoration:none;border-bottom:1px solid var(--jade)}
.case-link:hover{color:var(--jade)}
.case-parts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.5vw,36px)}
.case-parts p:not(.case-label){font-size:1rem;line-height:1.55;margin:0}
.ho-more{display:inline-block;margin-top:8px;font-weight:600;color:var(--anthracite);text-decoration:none;border-bottom:1px solid var(--jade)}

/* Services: use-case lines inside each open row */
.fm-lead{font-size:1.125rem;line-height:1.5;color:#555d5d;margin:0 0 20px;max-width:60ch}
.fm-use{margin:24px 0 0;display:grid;gap:16px}
.fm-use div{border-left:2px solid var(--anthracite);padding-left:16px}
.fm-use dt{font-size:.8125rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--jade);margin:0 0 4px}
.fm-use dd{margin:0;font-size:1.0625rem;line-height:1.5}

@media(max-width:900px){
  .ho-start-grid{grid-template-columns:1fr 1fr}
  .ho-start-item:nth-child(2){border-right:0}
  .ho-start-item:nth-child(-n+2){border-bottom:1px solid var(--taupe-line,var(--line))}
  .case{grid-template-columns:1fr}
}
@media(max-width:640px){
  .ho-sit{grid-template-columns:1fr;gap:8px}
  .ho-start-grid{grid-template-columns:1fr}
  .ho-start-item{border-right:0;border-bottom:1px solid var(--taupe-line,var(--line));min-height:0}
  .case-parts{grid-template-columns:1fr}
}
