/* Knowledge at work — homepage section immediately below the hero.
   Container and gutters match the hero / How the Fabric works. */

#section-knowledge-at-work{
  background:var(--bg);
  color:var(--fg);
  padding-top:var(--section-enter);
  padding-bottom:var(--section-exit);
  scroll-margin-top:var(--header-min-height);
  box-sizing:border-box;
}

#section-knowledge-at-work *,
#section-knowledge-at-work *::before,
#section-knowledge-at-work *::after{
  box-sizing:border-box;
}

#section-knowledge-at-work .qo-wrap{
  min-width:0;
}

#section-knowledge-at-work .qo-number{
  margin:0 0 var(--kicker-gap);
  font-size:11px;
  font-weight:500;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--cyan);
}

#section-knowledge-at-work .qo-title{
  margin:0 0 var(--qf-heading-gap);
  max-width:940px;
  font-size:clamp(32px,4.5vw,50px);
  font-weight:650;
  letter-spacing:-1.7px;
  line-height:1.12;
  color:var(--fg);
  text-align:left;
}

#section-knowledge-at-work .qo-intro{
  margin:0;
  max-width:980px;
  font-size:18px;
  font-weight:400;
  line-height:1.65;
  color:var(--fg);
  text-align:left;
}

#section-knowledge-at-work .qo-tabs{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin:48px 0 60px;
  border-bottom:1px solid #2a323c;
}

#section-knowledge-at-work .qo-tabs [role="tab"]{
  appearance:none;
  margin:0;
  padding:18px 12px;
  border:0;
  border-bottom:2px solid transparent;
  background:none;
  color:#b5c0ce;
  font-family:var(--sans);
  font-size:15px;
  font-weight:400;
  line-height:1.2;
  cursor:pointer;
}

#section-knowledge-at-work .qo-tabs [role="tab"][aria-selected="true"]{
  color:var(--cyan);
  border-bottom-color:var(--cyan);
}

#section-knowledge-at-work .qo-tabs [role="tab"]:focus-visible{
  outline:2px solid #62cbd8;
  outline-offset:5px;
}

#section-knowledge-at-work .qo-cta:focus-visible{
  outline:3px solid #6ed9e2;
  outline-offset:5px;
}

#section-knowledge-at-work .qo-stage{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:48px;
  align-items:start;
  justify-content:start;
  min-width:0;
}

#section-knowledge-at-work .qo-visuals,
#section-knowledge-at-work .qo-copies{
  display:grid;
  min-width:0;
}

#section-knowledge-at-work .qo-copy-col{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-width:0;
}

#section-knowledge-at-work .qo-copies{
  width:100%;
  position:relative;
}

#section-knowledge-at-work .qo-figure,
#section-knowledge-at-work .qo-copy{
  grid-area:1 / 1;
}

#section-knowledge-at-work .qo-figure:not(.is-active),
#section-knowledge-at-work .qo-copy:not(.is-active){
  visibility:hidden;
  pointer-events:none;
}

#section-knowledge-at-work .qo-copy:not(.is-active){
  position:absolute;
  left:0;
  right:0;
  top:0;
}

#section-knowledge-at-work .qo-figure{
  margin:0;
  min-width:0;
}

#section-knowledge-at-work .qo-photo{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16 / 9;
  object-fit:cover;
  object-position:center;
  border-radius:12px;
  background:#10141c;
}

#section-knowledge-at-work .qo-fabric{
  margin-top:24px;
  padding:24px;
  background:#101c2c;
  border:1px solid #30475f;
  border-radius:18px;
}

#section-knowledge-at-work .qo-fabric-label{
  margin:0 0 20px;
  font-size:14px;
  font-weight:500;
  color:var(--fg);
}

#section-knowledge-at-work .qo-apps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

#section-knowledge-at-work .qo-app{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-width:0;
  aspect-ratio:1;
  padding:12px 5px;
  gap:10px;
  background:#18202c;
  border:1px solid #344354;
  border-radius:12px;
}

#section-knowledge-at-work .qo-app img{
  width:36px;
  height:36px;
  flex:none;
  object-fit:contain;
}

#section-knowledge-at-work .qo-app img.qo-app-wide{
  width:72%;
  max-width:88px;
  height:24px;
}

#section-knowledge-at-work .qo-app span{
  max-width:100%;
  font-size:13px;
  font-weight:500;
  line-height:1.3;
  text-align:center;
  color:var(--fg);
  overflow-wrap:break-word;
}

#section-knowledge-at-work .qo-copy{
  min-width:0;
  padding-top:28px;
  text-align:left;
}

#section-knowledge-at-work .qo-dept{
  margin:0 0 24px;
  font-size:11px;
  font-weight:500;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--cyan);
}

#section-knowledge-at-work .qo-benefit{
  margin:0 0 24px;
  font-size:32px;
  font-weight:650;
  letter-spacing:-.8px;
  line-height:1.2;
  color:var(--fg);
}

#section-knowledge-at-work .qo-description{
  margin:0 0 32px;
  font-size:18px;
  line-height:1.75;
  color:var(--fg);
}

#section-knowledge-at-work .qo-cta{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:0;
  flex:0 0 auto;
  width:var(--hero-btn-width);
  max-width:100%;
  height:var(--hero-btn-height);
  margin:0;
  padding:0 16px;
  font-size:calc(14px * 1.20);
  line-height:1.2;
  text-align:center;
  white-space:nowrap;
}

#section-knowledge-at-work .qo-cta::before,
#section-knowledge-at-work .qo-cta::after{
  content:none;
  display:none;
}

@media (min-width:1200px){
  #section-knowledge-at-work .qo-stage{
    grid-template-columns:500px 520px;
    gap:64px;
  }

  #section-knowledge-at-work .qo-figure{
    width:500px;
  }

  #section-knowledge-at-work .qo-fabric{
    padding:20px;
  }

  #section-knowledge-at-work .qo-apps{
    gap:12px;
  }

  #section-knowledge-at-work .qo-copy-col,
  #section-knowledge-at-work .qo-copy{
    width:520px;
  }
}

@media (max-width:800px){
  #section-knowledge-at-work .qo-tabs{
    flex-wrap:wrap;
    justify-content:flex-start;
    gap:4px 12px;
    margin:32px 0 38px;
  }

  #section-knowledge-at-work .qo-tabs [role="tab"]{
    padding:14px 8px;
    font-size:14px;
  }

  #section-knowledge-at-work .qo-stage{
    grid-template-columns:minmax(0,1fr);
    gap:36px;
  }

  #section-knowledge-at-work .qo-copy{
    padding-top:0;
  }

  #section-knowledge-at-work .qo-intro,
  #section-knowledge-at-work .qo-description{
    font-size:16px;
  }

  #section-knowledge-at-work .qo-benefit{
    font-size:clamp(24px,6vw,32px);
  }

  #section-knowledge-at-work .qo-fabric{
    padding:20px 16px;
  }

  #section-knowledge-at-work .qo-apps{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  #section-knowledge-at-work .qo-app{
    aspect-ratio:auto;
    min-height:100px;
  }
}

@media (prefers-reduced-motion:reduce){
  #section-knowledge-at-work .qo-figure,
  #section-knowledge-at-work .qo-copy{
    transition:none;
  }
}