/* Explanatory content: service cards, process deliverables and FAQ, in the monochrome direction. */
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);column-gap:44px;border-top:1px solid var(--line)}
.service-card{display:flex;flex-direction:column;gap:14px;padding:32px 0 36px;border-bottom:1px solid var(--line)}
.service-card .number{align-self:flex-start;font:10px monospace;color:var(--dim)}
.service-card h3{font-size:clamp(22px,2vw,30px);font-weight:400;line-height:1.15;letter-spacing:-1px;margin:4px 0 0;transition:transform .36s cubic-bezier(.22,1,.36,1)}
.service-card:hover h3{transform:translateX(6px)}
.service-card>p{font-size:14px;line-height:1.7;color:#bdbdba;margin:0;max-width:380px}
.service-card .service-for{font-size:12px;color:var(--dim)}
.service-for span,.step-output span{display:block;margin-bottom:6px;font:9px monospace;letter-spacing:1px;color:var(--fg)}
.service-card ul{display:grid;gap:8px;margin:auto 0 0;padding:16px 0 0;border-top:1px solid #262626;list-style:none;font:10px/1.6 monospace;letter-spacing:.5px;text-transform:uppercase;color:var(--dim)}
.service-card li::before{content:'+';margin-right:10px;color:var(--fg)}
.service-grid .service-card:nth-child(3n+2){--reveal-delay:90ms}
.service-grid .service-card:nth-child(3n){--reveal-delay:180ms}
.steps .step-output{margin:22px 0 0;padding-top:16px;border-top:1px solid #2a2a2a;font-size:13px;line-height:1.6;color:var(--fg)}
.faq-list{margin-left:25%;border-top:1px solid var(--line)}
.faq summary h3{font-size:clamp(19px,1.9vw,28px)}
.faq-answer{max-width:640px;padding:0 0 26px 50px}
.faq-answer p{margin:0;font-size:14px;line-height:1.8;color:#bec1b5}
.faq details[open] .faq-answer{animation:service-reveal .22s ease-out}
@media(max-width:1000px){.service-grid{grid-template-columns:repeat(2,1fr)}.service-grid .service-card:nth-child(n){--reveal-delay:0ms}.service-grid .service-card:nth-child(2n){--reveal-delay:90ms}.faq-list{margin-left:0}}
@media(max-width:640px){.service-grid{grid-template-columns:1fr}.service-grid .service-card:nth-child(n){--reveal-delay:0ms}.service-card{padding:26px 0 30px}.faq-answer{padding-left:31px}.steps .step-output{font-size:12px}}
@media(prefers-reduced-motion:reduce){.service-card h3{transition:none}.service-card:hover h3{transform:none}.faq details[open] .faq-answer{animation:none}}
