/* A small, consistent type scale for readable Home content. UI mockups keep
   their miniature labels because they are illustrations rather than copy. */
main{--home-title:clamp(35px,4.85vw,57px);--home-copy:16px;--home-card-title:18px;--home-card-copy:14px;--home-label:11px}
main .section-heading h2,
main .galaxy-copy h2,
main .contact-copy h2{font-size:var(--home-title);line-height:1.06}
main .eyebrow,
main .capability-heading .eyebrow,
main .intro-pillars-heading .eyebrow{font-size:var(--home-label)}
main .hero-copy,
main .services-section .split-heading>p,
main .cases-description,
main .galaxy-copy>p,
main .contact-copy>p{font-size:var(--home-copy);line-height:1.6}
main .capability-result p,
main .intro-section .principle-copy p,
main .services-section .service-card p,
main .process-section .process-card p,
main .faq-list details p{font-size:var(--home-card-copy);line-height:1.5}
main .intro-section .principle-copy>b,
main .services-section .service-card h3{font-size:var(--home-card-title);line-height:1.25}
main .services-section .card-link,
main .faq-list summary{font-size:14px}
main .faq-heading>p{font-size:var(--home-copy)}

/* Service cards need room for the readable copy. */
main .services-section{padding-top:44px;padding-bottom:56px}
main .services-section .split-heading{margin-bottom:20px}
main .services-section .service-grid{grid-auto-rows:auto;gap:14px;align-items:stretch}
main .services-section .service-card,
main .services-section .service-card-wide{height:184px;min-height:184px;padding:30px 18px 14px;grid-template-rows:auto minmax(0,1fr) auto;row-gap:4px}
main .services-section .service-card-wide{height:194px;min-height:194px}
main .services-section .service-card p{-webkit-line-clamp:3;line-clamp:3;min-width:0}
main .intro-section .principle{min-height:104px}

/* Three services above, two wider cards below on desktop. */
@media(min-width:1200px){
  main .services-section .service-card:nth-child(-n+3){grid-column:span 2!important}
  main .services-section .service-card:nth-child(n+4){grid-column:span 3!important}
}
@media(min-width:681px) and (max-width:1199px){
  main .services-section .service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  main .services-section .service-card{grid-column:auto!important}
}

/* The capability cards enter quickly from right to left, once on scroll. */
html.capability-entry-ready .capability-section .capability-card{
  opacity:0;
  transform:translate3d(64px,0,0);
  transition:opacity .42s ease-out,transform .42s cubic-bezier(.18,.8,.25,1),box-shadow .35s,background .35s,border-color .35s;
}
html.capability-entry-ready .capability-section.capability-entry-visible .capability-card{opacity:1;transform:translate3d(0,0,0)}
html.capability-entry-ready .capability-section.capability-entry-visible .capability-card:nth-child(4){transition-delay:0ms}
html.capability-entry-ready .capability-section.capability-entry-visible .capability-card:nth-child(3){transition-delay:65ms}
html.capability-entry-ready .capability-section.capability-entry-visible .capability-card:nth-child(2){transition-delay:130ms}
html.capability-entry-ready .capability-section.capability-entry-visible .capability-card:nth-child(1){transition-delay:195ms}
html.capability-entry-ready .capability-section.capability-entry-visible .capability-card:hover,
html.capability-entry-ready .capability-section.capability-entry-visible .capability-card:focus-within{transform:translateY(-6px)}

@media(max-width:1100px){
  main .services-section .service-card,
  main .services-section .service-card-wide{height:190px;min-height:190px}
}
@media(max-width:680px){
  main{--home-title:clamp(34px,9vw,47px);--home-copy:15px;--home-card-title:17px;--home-card-copy:14px}
  main .intro-copy .section-heading h2{font-size:var(--home-title)}
  main .process-section .section-heading h2{font-size:var(--home-title)!important;white-space:normal}
  main .services-section .service-card,
  main .services-section .service-card-wide{height:auto;min-height:190px;padding:30px 14px 14px;grid-template-columns:minmax(0,1fr) minmax(105px,.68fr)}
  main .services-section .service-card h3{font-size:16px}
  main .services-section .service-card p{font-size:13px;line-height:1.4}
  main .intro-section .principle{min-height:96px}
  html.capability-entry-ready .capability-section .capability-card{transform:translate3d(32px,0,0)}
}
@media(prefers-reduced-motion:reduce){
  html.capability-entry-ready .capability-section .capability-card,
  html.capability-entry-ready .capability-section.capability-entry-visible .capability-card{opacity:1;transform:none;transition:none;transition-delay:0ms}
}