/* Fade over the previous still photo so the scene never dims between slides. */
.hero-slide {z-index:0;transition:none}
.hero-slide.is-previous {z-index:1;opacity:1}
.hero-slide.is-active {z-index:2;opacity:1}
.hero-slide.is-entering {animation:hero-dissolve 2.2s cubic-bezier(.25,.1,.25,1) both}
@keyframes hero-dissolve {from {opacity:0} to {opacity:1}}
@media(prefers-reduced-motion:reduce) {
  .hero-slide.is-entering {animation:none}
  .hero-slide.is-previous {opacity:0}
}

/* Service cards: shared rows on desktop, natural document flow on smaller screens. */
.ai-services {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:0;
}
.ai-services>div {
  display:grid;
  grid-template-rows:36px minmax(88px,auto) 1fr auto;
  gap:22px;
  justify-items:center;
  align-content:start;
  min-width:0;
  padding:0 clamp(16px,2vw,25px);
  text-align:center;
}
.ai-services>div>span {
  align-self:start;
  margin:0;
  padding:0;
  font:italic 23px/1.5 Georgia,serif;
}
.ai-services>div>div {display:contents}
.ai-services h3 {
  align-self:stretch;
  width:100%;
  height:auto;
  min-height:88px;
  margin:0;
  padding:0 0 24px;
  font-size:clamp(19px,1.65vw,24px);
  line-height:1.6;
}
.ai-services h3 .service-title {
  white-space:normal;
  overflow-wrap:anywhere;
  text-wrap:balance;
}
.ai-services p {
  align-self:start;
  width:100%;
  max-width:30em;
  min-height:0;
  margin:0;
  font-size:14px;
  line-height:2.1;
  text-wrap:pretty;
  overflow-wrap:anywhere;
  line-break:strict;
}
.ai-services p br {display:none}
.ai-services .service-scope {
  align-self:end;
  max-width:100%;
  margin:0;
  font-size:10px;
  line-height:1.9;
  white-space:normal;
  text-wrap:balance;
}

/* A tablet portrait needs readable lines rather than three narrow columns. */
@media(max-width:1023px) {
  .business .ai-block {display:block}
  .digital-illustration {
    width:100%;
    max-width:440px;
    margin:36px auto 0;
  }
  .ai-services {
    grid-template-columns:minmax(0,1fr);
    width:100%;
    max-width:640px;
    margin:48px auto 0;
    padding-top:36px;
  }
  .ai-services>div {
    grid-template-rows:auto auto auto auto;
    gap:20px;
    width:100%;
    padding:36px 0;
    border:0;
  }
  .ai-services>div+div {
    border-left:0;
    border-top:1px solid #ffffff26;
  }
  .ai-services>div:first-child {padding-top:0}
  .ai-services>div:last-child {padding-bottom:0}
  .ai-services>div>span {margin:0;padding:0}
  .ai-services h3 {
    min-height:64px;
    margin:0;
    padding-bottom:22px;
    font-size:24px;
  }
  .ai-services p {font-size:15px;max-width:30em}
  .ai-services .service-scope {font-size:11px}
  .philosophy-grid,.company-grid {grid-template-columns:minmax(0,1fr);gap:44px}
  .philosophy-message {width:100%;max-width:640px;margin-inline:auto}
  .philosophy-copy {min-width:0;padding:0}
  .company-grid h2 {font-size:32px}
  .company-table {min-width:0}
  .company-table dd {min-width:0;overflow-wrap:anywhere}
}
@media(max-width:760px) {
  .ai-services {margin-top:32px;padding-top:32px}
  .ai-services h3 {font-size:23px}
  .ai-services p {font-size:14px;max-width:28em}
  .ai-services .service-scope {font-size:10px}
  .digital-illustration {max-width:380px;margin-top:32px}
  .philosophy-grid,.company-grid {gap:36px}
  .company-grid h2 {font-size:30px}
}
@media(max-width:370px) {
  .ai-services h3 {font-size:21px}
  .ai-services p {font-size:14px}
}