/* Homepage composition and Figma-specific responsive layout. */
.lab-section { color: var(--lab-ink); padding: clamp(72px, 10vw, 180px) 0; }
.lab-hero { min-height: 1080px; overflow: clip; padding: 40px 0 42px; }
.lab-hero__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: 230px 420px 1fr; column-gap: clamp(24px, 8.4vw, 166px); row-gap: 42px; }
.lab-hero__intro { grid-column: 2 / 8; grid-row: 1 / 3; padding-top: 180px; position: relative; z-index: 2; }
.lab-hero__title { max-width: 1040px; }
.lab-hero__secondary-media { grid-column: 7 / 12; grid-row: 1 / 2; }
.lab-hero__image, .lab-division-card__image, .lab-method__image, .lab-project-card__image { display: block; height: 100%; object-fit: cover; width: 100%; }
.lab-hero__secondary-media .lab-hero__video { background: #000; display: block; height: 100%; object-fit: cover; width: 100%; }
.lab-hero__secondary-media .lab-hero__image { height: 270px; }
.lab-section-heading > p, .lab-method__content > p, .lab-projects__intro > p { margin: 24px 0 0; }
.lab-section-heading { max-width: 860px; }
.lab-section-heading--center { margin: 0 auto 72px; text-align: center; }
.lab-section-heading--center .lab-eyebrow { justify-content: center; }
.lab-divisions { background: #f7f9f9; }
.lab-divisions__grid { display: grid; gap: 24px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.lab-division-card { background: var(--lab-paper); display: flex; flex-direction: column; min-height: 540px; }
.lab-division-card__media { aspect-ratio: 1.13 / 1; background: #e8eeee; overflow: hidden; }
.lab-division-card__body { display: flex; flex: 1; flex-direction: column; padding: 28px; }
.lab-division-card__icon { height: 22px; margin-bottom: 18px; object-fit: contain; object-position: left; width: 24px; }
.lab-division-card h3 { margin: 0; }
.lab-division-card p { margin: 16px 0 22px; }
.lab-text-link { color: var(--lab-blue); font: 500 16px/1.2 Barlow, sans-serif; margin-top: auto; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.lab-method { padding-top: clamp(84px, 12vw, 210px); }
.lab-method__backdrop { display: none; }
.lab-method--dark { background: var(--lab-ink); color: #fff; }
.lab-method--dark .lab-eyebrow { color: #c3d1d5; }
.lab-method--dark .lab-eyebrow::before { background: #c3d1d5; }
.lab-method__grid { align-items: center; display: grid; gap: clamp(36px, 8vw, 160px); grid-template-columns: 1.6fr 1fr; }
.lab-method__media { aspect-ratio: 1.58 / 1; border-radius: 50% 50% 0 0; overflow: hidden; }
.lab-method__content { max-width: 510px; }
.lab-projects { background: #f7f9f9; }
.lab-projects__intro { margin: 0 auto 58px; max-width: 565px; }
.lab-projects__grid { display: grid; gap: clamp(24px, 4vw, 80px) clamp(24px, 7vw, 160px); grid-template-columns: repeat(12, minmax(0, 1fr)); }
.lab-project-card { grid-column: span 5; }
.lab-project-card:nth-child(2n) { grid-column: 8 / span 5; margin-top: 126px; }
.lab-project-card--wide { grid-column: span 8; }
.lab-project-card--tall { grid-column: span 4; }
.lab-project-card__link { color: inherit; display: block; text-decoration: none; }
.lab-project-card__image { aspect-ratio: 1.15 / 1; background: #dbe3e5; transition: transform .35s ease; }
.lab-project-card--tall .lab-project-card__image { aspect-ratio: .76 / 1; }
.lab-project-card__link:hover .lab-project-card__image { transform: scale(1.02); }
.lab-project-card__content { border-bottom: 1px solid var(--lab-rule); display: block; padding: 16px 0 12px; }
.lab-project-card__title { display: block; }
.lab-project-card__meta { color: var(--lab-blue); display: block; margin-top: 6px; }

#lab-statement { align-items: center; background: var(--lab-blue); color: #fff; display: flex; min-height: min(54vw, 1040px); padding: clamp(100px, 15vw, 260px) 0; text-align: center; }
#lab-news { background: #f7f9f9; padding: clamp(80px, 10vw, 170px) 0; }
#lab-news .wpb_wrapper, #lab-contact .wpb_wrapper { max-width: 560px; }
#lab-contact { background: var(--lab-ink); color: #fff; padding: clamp(80px, 10vw, 170px) 0; }
#lab-contact .nectar-button { border-radius: 999px; }

@media (max-width: 1199px) {
  .lab-hero { min-height: auto; }
  .lab-hero__grid { grid-template-rows: auto; }
  .lab-hero__intro { grid-column: 1 / 8; grid-row: 1; padding-top: 80px; }
  .lab-hero__secondary-media { grid-column: 7 / -1; grid-row: 1; }
  .lab-divisions__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 899px) {
  .lab-section { padding: 72px 0; }
  .lab-hero { padding-top: 28px; }
  .lab-hero__grid, .lab-method__grid { display: flex; flex-direction: column; gap: 30px; }
  .lab-hero__intro { order: 1; padding: 26px 0 0; }
  .lab-hero__secondary-media { order: 2; width: 100%; }
  .lab-hero__secondary-media .lab-hero__image { height: auto; max-height: 310px; }
  .lab-hero__secondary-media .lab-hero__video { height: auto; max-height: 310px; }
  .lab-divisions__grid { grid-template-columns: 1fr; }
  .lab-division-card { min-height: 0; }
  .lab-method__media { order: 2; width: 100%; }
  .lab-method__content { order: 1; }
  .lab-projects__grid { display: grid; gap: 38px; grid-template-columns: 1fr; }
  .lab-project-card, .lab-project-card:nth-child(2n), .lab-project-card--wide, .lab-project-card--tall { grid-column: auto; margin-top: 0; }
  #lab-statement { min-height: 480px; }
}

@media (prefers-reduced-motion: reduce) {
  .lab-project-card__image { transition: none; }
}

/* LAB Ideas art direction: Figma desktop composition. */
.lab-hero { padding-top: 0; }
.lab-hero__grid { grid-template-rows: 270px 390px 370px; }
.lab-hero__intro { grid-column: 2 / 8; grid-row: 1 / 3; padding-top: 84px; }
.lab-hero__title { max-width: 980px; }
.lab-hero__secondary-media { grid-column: 7 / 12; grid-row: 1 / 2; margin-top: 28px; }
.lab-hero__secondary-media .lab-hero__image { height: 270px; }

.lab-statement { align-items: center; background: #527481 var(--lab-statement-image) center/cover no-repeat; color: #fff; display: flex; min-height: min(54vw, 1042px); overflow: hidden; position: relative; }
.lab-statement__veil { background: linear-gradient(90deg, rgba(24, 59, 78, .22), rgba(24, 59, 78, .04)); inset: 0; position: absolute; }
.lab-statement__content { margin: 0 auto; max-width: 1320px; position: relative; text-align: center; width: var(--lab-shell); }
.lab-statement h2 { color: #fff; text-shadow: 0 4px 24px rgba(10, 32, 42, .24); }
.lab-statement h2 span { display: block; }
.lab-statement__mark, .lab-news__mark { bottom: -23%; color: #fff; position: absolute; right: 31%; }
.lab-statement__mark { margin-bottom: 0 !important; }

.lab-divisions { background: #fff; padding-bottom: clamp(100px, 12vw, 210px); }
.lab-divisions .lab-section-heading { max-width: 790px; }
.lab-divisions .lab-section-heading > p { margin-left: auto; margin-right: auto; max-width: 580px; }
.lab-divisions__visual { margin: clamp(38px, 7vw, 120px) auto clamp(18px, 4vw, 64px); max-width: 1032px; }
.lab-divisions__visual-image { display: block; height: auto; width: 100%; }
.lab-divisions__grid { gap: 20px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.lab-division-card { background: transparent; min-height: 0; }
.lab-division-card__body { padding: 0; }
.lab-division-card__dot { border-radius: 50%; height: 9px; margin-bottom: 17px; width: 9px; }
.lab-division-card[data-lab-division='analysis'] .lab-division-card__dot { background: #e5d67e; }
.lab-division-card[data-lab-division='business'] .lab-division-card__dot { background: #ca4f60; }
.lab-division-card[data-lab-division='architecture'] .lab-division-card__dot { background: #aeb763; }
.lab-division-card[data-lab-division='marketing'] .lab-division-card__dot { background: #6098ae; }
.lab-division-card p { color: #202221; max-width: 270px; }

.lab-method { padding: clamp(80px, 10vw, 170px) 0; }
.lab-method__grid { align-items: end; gap: 0; grid-template-columns: 1.15fr 1.6fr .75fr; position: relative; }
.lab-method__media { border-radius: 0; grid-column: 2; margin: 0; overflow: hidden; position: relative; }
.lab-method__image { aspect-ratio: 1.58 / 1; }
.lab-method__content { grid-column: 1 / 2; margin-right: -230px; max-width: 740px; padding-bottom: 28px; position: relative; z-index: 2; }
.lab-method__aside { align-self: end; color: var(--lab-ink); grid-column: 3; padding: 0 0 18px 42px; }
.lab-method__aside p { margin: 0 0 28px; }

.lab-projects { background: #fff; padding-top: clamp(70px, 11vw, 180px); }
.lab-projects__intro { margin: 0 0 74px 33.333%; max-width: 530px; }
.lab-projects__grid { gap: clamp(54px, 9vw, 175px) clamp(30px, 8vw, 165px); }
.lab-project-card { grid-column: 8 / span 4; }
.lab-project-card:nth-child(2n) { grid-column: 1 / span 5; margin-top: 220px; }
.lab-project-card--wide { grid-column: 2 / span 6; }
.lab-project-card--tall { grid-column: 8 / span 4; }
.lab-project-card__image { aspect-ratio: 1.3 / 1; }
.lab-project-card--tall .lab-project-card__image { aspect-ratio: .76 / 1; }

.lab-news { align-items: center; background: #dce8f0 var(--lab-news-image) center/cover no-repeat; color: var(--lab-ink); display: flex; justify-content: center; min-height: min(54vw, 1040px); overflow: hidden; position: relative; text-align: center; }
.lab-news::before { background: rgba(232, 241, 245, .66); content: ''; inset: 0; position: absolute; }
.lab-news__content { max-width: 550px; position: relative; z-index: 1; }
.lab-news .lab-eyebrow { justify-content: center; }
.lab-news__mark { bottom: -10%; color: rgba(255,255,255,.88); right: 10%; }

@media (max-width: 1199px) {
  .lab-hero__intro { padding-top: 50px; }
  .lab-projects__intro { margin-left: 20%; }
  .lab-method__content { margin-right: -140px; }
}

@media (max-width: 899px) {
  .lab-hero__intro { padding-top: 38px; }
  .lab-statement { background-image: var(--lab-statement-image-mobile); min-height: 650px; }
  .lab-statement__mark { right: 10%; }
  .lab-divisions__grid { gap: 42px 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lab-method__grid { display: grid; grid-template-columns: 1fr; }
  .lab-method__content { grid-column: 1; margin: 0; order: 1; padding: 0 0 24px; }
  .lab-method__media { grid-column: 1; order: 2; }
  .lab-method__aside { grid-column: 1; order: 3; padding: 20px 0 0; }
  .lab-projects__intro { margin-left: 0; }
  .lab-news { min-height: 650px; }
}

/* Figma fidelity v2: the homepage owns its rails instead of inheriting Salient's container. */
body.home.page-id-9 .container-wrap {
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}

body.home.page-id-9 .container-wrap > .main-content {
  margin-inline: 0 !important;
  max-width: none !important;
  padding-inline: 0 !important;
  width: 100% !important;
}

body.home.page-id-9 .container-wrap > .main-content > .row {
  margin-inline: 0 !important;
  padding-bottom: 0 !important;
  width: 100% !important;
}

body.home.page-id-9 .lab-home-builder-row,
body.home.page-id-9 .lab-home-builder-row > .row_col_wrap_12,
body.home.page-id-9 .lab-home-builder-row > .row_col_wrap_12 > .wpb_column,
body.home.page-id-9 .lab-home-builder-row .vc_column-inner,
body.home.page-id-9 .lab-home-builder-row .wpb_wrapper {
  box-sizing: border-box;
  margin-inline: 0 !important;
  max-width: none !important;
  padding-inline: 0 !important;
  width: 100% !important;
}

/* Salient adds 15px below images inside .row .col. Homepage artwork owns its
   vertical geometry, so remove that inherited gap from every LAB scene image. */
body.home.page-id-9 .container-wrap .row img,
body.home.page-id-9 .lab-home-builder-row img {
  margin-bottom: 0 !important;
}

body.home.page-id-9 .container-wrap > .main-content > .row > .lab-hero,
body.home.page-id-9 .container-wrap > .main-content > .row > .lab-statement,
body.home.page-id-9 .container-wrap > .main-content > .row > .lab-divisions,
body.home.page-id-9 .container-wrap > .main-content > .row > .lab-method,
body.home.page-id-9 .container-wrap > .main-content > .row > .lab-projects,
body.home.page-id-9 .container-wrap > .main-content > .row > .lab-news,
body.home.page-id-9 .container-wrap > .main-content > .row > .lab-footer {
  margin-left: 0;
  max-width: none;
  width: 100%;
}

body.home.page-id-9 #to-top,
body.home.page-id-9 .nectar-scroll-icon { display: none !important; }

body.home.page-id-9 #top .slide-out-widget-area-toggle .label {
  color: var(--lab-ink) !important;
  font: 400 20px/24px Barlow, sans-serif !important;
  text-transform: uppercase;
}

/* Keep a stable paper surface by default. The motion controller switches to
   transparent for the opening scenes and keeps it through the composed tail
   of the homepage flow. */
body.home.page-id-9 #header-outer,
body.home.page-id-9 #header-outer.transparent,
body.home.page-id-9 #header-outer.small-nav {
  background-color: var(--lab-paper) !important;
  background-image: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

body.home.page-id-9 #header-outer #top {
  background: var(--lab-paper) !important;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing,
body.home.page-id-9 #header-outer.lab-header--hero-landing.transparent,
body.home.page-id-9 #header-outer.lab-header--hero-landing.small-nav {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing #top {
  background: transparent !important;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing .bg-color-stripe {
  display: none !important;
}

/* Motion scenes continue underneath the fixed header. Once the Method scene
   starts, the surface stays transparent through Projects, News, and Footer,
   so transitions cannot create a visible white band. */
body.home.page-id-9 #header-outer.lab-header--scene-overlay,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.transparent,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.small-nav {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.home.page-id-9 #header-outer.lab-header--scene-overlay #top {
  background: transparent !important;
}

body.home.page-id-9 #header-outer.lab-header--scene-overlay .bg-color-stripe {
  display: none !important;
}

/* The divisions intro circle continues behind the fixed menu until it exits
   below the viewport. Keep this short state scoped to the header surface so
   the menu remains visible without cutting the circle. */
body.home.page-id-9 #header-outer.lab-header--divisions-intro,
body.home.page-id-9 #header-outer.lab-header--divisions-intro.transparent,
body.home.page-id-9 #header-outer.lab-header--divisions-intro.small-nav {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.home.page-id-9 #header-outer.lab-header--divisions-intro #top {
  background: transparent !important;
}

body.home.page-id-9 #header-outer.lab-header--divisions-intro .bg-color-stripe {
  display: none !important;
}

body.home.page-id-9 #header-outer #logo img,
body.home.page-id-9 #header-outer #top .slide-out-widget-area-toggle .label,
body.home.page-id-9 #header-outer #top .slide-out-widget-area-toggle .lines,
body.home.page-id-9 #header-outer #top .slide-out-widget-area-toggle .lines::before,
body.home.page-id-9 #header-outer #top .slide-out-widget-area-toggle .lines::after,
body.home.page-id-9 #header-outer #top .slide-out-widget-area-toggle .lines-button::after {
  transition-duration: 160ms;
  transition-property: background-color, color, filter;
  transition-timing-function: ease-out;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--negative #logo img,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.lab-header--negative #logo img {
  filter: brightness(0) invert(1) !important;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--adaptive-negative,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.lab-header--adaptive-negative {
  mix-blend-mode: difference;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--negative #top .slide-out-widget-area-toggle .label,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.lab-header--negative #top .slide-out-widget-area-toggle .label {
  color: #fff !important;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--negative #top .slide-out-widget-area-toggle .lines,
body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--negative #top .slide-out-widget-area-toggle .lines::before,
body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--negative #top .slide-out-widget-area-toggle .lines::after,
body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--negative #top .slide-out-widget-area-toggle .lines-button::after,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.lab-header--negative #top .slide-out-widget-area-toggle .lines,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.lab-header--negative #top .slide-out-widget-area-toggle .lines::before,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.lab-header--negative #top .slide-out-widget-area-toggle .lines::after,
body.home.page-id-9 #header-outer.lab-header--scene-overlay.lab-header--negative #top .slide-out-widget-area-toggle .lines-button::after {
  background-color: #fff !important;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--hero-video #top .slide-out-widget-area-toggle .label {
  color: #fff !important;
}

body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--hero-video #top .slide-out-widget-area-toggle .lines,
body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--hero-video #top .slide-out-widget-area-toggle .lines::before,
body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--hero-video #top .slide-out-widget-area-toggle .lines::after,
body.home.page-id-9 #header-outer.lab-header--hero-landing.lab-header--hero-video #top .slide-out-widget-area-toggle .lines-button::after {
  background-color: #fff !important;
}

@media (min-width: 1200px) {
  .lab-section {
    padding: 0;
  }

  /* Keep the header's layout space so every scene retains its authored
     vertical origin. Only the hero grid overlaps that space visually. */
  body.home.page-id-9 #header-space {
    background-color: transparent !important;
    display: block !important;
  }

  body.home.page-id-9 #header-outer {
    position: fixed !important;
  }

  .lab-hero {
    background: #fff;
    height: min(78.021vw, 1498px);
    min-height: 100vh;
    overflow: visible;
    padding: 0;
  }

  .lab-hero__grid,
  .lab-method__grid,
  .lab-projects > .lab-shell,
  .lab-projects__grid {
    column-gap: var(--lab-grid-gap);
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    height: 100%;
    position: relative;
  }

  /* The header remains in document flow for the sections below, while the
     opening hero content still reaches the viewport's top edge. */
  .lab-hero__grid {
    top: calc(-1 * var(--lab-home-header-offset, 110px));
  }

  .lab-hero__intro,
  .lab-hero__secondary-media {
    bottom: auto;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 0;
    grid-row: auto;
  }

  .lab-hero__intro {
    display: flex;
    flex-direction: column;
    grid-column: 1 / span 7;
    height: 100vh;
    justify-content: center;
    left: calc(
      var(--container-padding, 90px)
      - max(
        calc((100vw - 1740px) / 2),
        calc(clamp(40px, 9.375vw, 180px) / 2)
      )
    );
    max-width: min(51.406vw, 987px);
    top: 0;
    z-index: auto;
  }

  .lab-hero__title,
  .lab-hero__strapline {
    left: auto;
    margin: 0;
    position: static;
  }

  .lab-hero__title {
    -webkit-text-fill-color: var(--lab-ink);
    background-image: none;
    color: var(--lab-ink);
    height: auto;
    max-width: none;
    mix-blend-mode: normal;
    white-space: nowrap;
    width: 100%;
    z-index: 3;
  }

  .lab-hero__title .lab-text-highlight {
    -webkit-text-fill-color: var(--lab-blue);
    color: var(--lab-blue);
  }

  .lab-hero__title .lab-hero__title-thinking {
    color: #fff;
    display: inline-block;
    mix-blend-mode: difference;
    position: relative;
    white-space: nowrap;
    -webkit-text-fill-color: currentColor;
  }

  /* Keep the non-video presentation layer independent of the fixed motion
     stage's paper surface. The previous difference blend could be rasterized
     as a vertical cut when the fixed stage crossed the title during scroll.
     On the white hero surface this is the same visible ink as the original
     blend; the video-specific white layer below remains unchanged. */
  body.home[data-lab-motion-mode='desktop'] .lab-hero__title-thinking-layer {
    color: #000;
    display: inline-block;
    font-family: var(--lab-font-display);
    font-size: var(--lab-type-display-size);
    font-style: normal;
    font-weight: 400;
    letter-spacing: var(--lab-type-display-tracking);
    line-height: var(--lab-type-display-line);
    mix-blend-mode: normal;
    position: absolute;
    white-space: nowrap;
    -webkit-text-fill-color: #000;
    z-index: 3;
  }

  /* The outer presentation-only layer is the transparent video-rectangle mask;
     the inner layer carries only the white glyphs. The semantic H1 remains
     the only heading in the Hero. */
  body.home[data-lab-motion-mode='desktop'] .lab-hero__title-video-layer {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-sizing: border-box;
    color: transparent;
    clip-path: none;
    display: block;
    margin: 0;
    mix-blend-mode: normal;
    overflow: hidden;
    padding: 0;
    pointer-events: none;
    position: absolute;
    -webkit-text-fill-color: transparent;
    z-index: 5;
  }

  body.home[data-lab-motion-mode='desktop'] .lab-hero__title-video-text {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-sizing: border-box;
    color: #fff;
    display: block;
    height: auto;
    margin: 0;
    mix-blend-mode: normal;
    overflow: visible;
    padding: 0;
    position: absolute;
    -webkit-text-fill-color: #fff;
    white-space: nowrap;
  }

  body.home[data-lab-motion-mode='desktop'] .lab-hero__title-video-text .lab-text-highlight,
  body.home[data-lab-motion-mode='desktop'] .lab-hero__title-video-text .lab-hero__title-thinking {
    color: #fff !important;
    display: inline-block;
    mix-blend-mode: normal !important;
    position: relative;
    white-space: nowrap;
    -webkit-text-fill-color: #fff !important;
  }

  .lab-hero__strapline {
    color: var(--lab-blue);
    margin-top: 24px;
    white-space: nowrap;
  }

  .lab-hero__secondary-media {
    grid-column: auto;
    height: 100vh;
    left: auto;
    overflow: hidden;
    right: calc((100% - 100vw) / 2);
    top: 0;
    width: 55vw;
    z-index: auto;
  }

  .lab-hero__secondary-media .lab-hero__image,
  .lab-hero__secondary-media .lab-hero__video {
    height: 100%;
    object-fit: cover;
    width: 100%;
  }

  body.home.page-id-9 .main-content .lab-hero__mark {
    height: min(5.469vw, 105px) !important;
    left: min(42.891vw, 823.5px);
    margin: 0;
    max-width: none;
    position: absolute;
    top: min(2.734vw, 52.5px);
    width: min(5.833vw, 112px) !important;
    z-index: 4;
  }

  /* Statement canvas: match the motion geometry so its children never inherit
     a non-uniform scale on ultrawide viewports. */
  .lab-statement {
    height: min(56.25vw, 1080px);
    min-height: 0;
  }

  /* The homepage can be rendered either through the WPBakery builder row or
     through the legacy direct row stored in the current local page. The
     structural selector also covers pages saved before the builder template
     class was added. Keep every path on the same 1920px motion canvas. */
  body.home.page-id-9 .container-wrap > .main-content > .row > .lab-statement,
  body.home.page-id-9 .lab-home-builder-row .lab-statement,
  body.home.page-id-9 .container-wrap > .main-content > .row .wpb_wrapper > .lab-statement {
    margin-left: auto;
    margin-right: auto;
    max-width: 1920px;
    width: min(100%, 1920px);
  }

  .lab-statement__content {
    height: 100%;
    max-width: none;
    width: 100%;
  }

  .lab-statement #lab-statement-title {
    left: 50%;
    position: absolute;
    text-shadow: 0 4px 250px #2f4775;
    top: min(7.135vw, 137px);
    transform: translateX(-50%);
    width: min(68.646vw, 1318px);
  }

  .lab-statement__mark {
    bottom: 0;
    height: min(29.518vw, 566.742px) !important;
    left: 50%;
    max-width: none;
    position: absolute;
    right: auto;
    transform: translateX(-50%);
    width: min(16.198vw, 311px) !important;
  }

  /* Divisions, Figma y=2651..4013. */
  .lab-divisions {
    height: min(70.938vw, 1362px);
    padding: 0;
    position: relative;
  }

  .lab-divisions > .lab-shell {
    height: 100%;
    position: relative;
  }

  .lab-divisions .lab-section-heading {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: auto;
    left: 50%;
    margin: 0;
    max-width: min(49.635vw, 953px);
    position: absolute;
    top: min(8.698vw, 167px);
    transform: translateX(-50%);
    width: min(49.635vw, 953px);
  }

  .lab-divisions .lab-section-heading .lab-eyebrow,
  .lab-divisions .lab-section-heading .lab-heading,
  .lab-divisions .lab-section-heading > p:not(.lab-eyebrow),
  .lab-divisions .lab-section-heading > .lab-button {
    left: auto;
    position: static;
    transform: none;
  }

  .lab-divisions .lab-section-heading .lab-eyebrow { margin: 0; }

  .lab-divisions .lab-section-heading .lab-heading {
    margin: clamp(18px, 1.198vw, 23px) 0 0;
    white-space: nowrap;
    width: 100%;
  }

  .lab-divisions .lab-section-heading > p:not(.lab-eyebrow) {
    margin: clamp(22px, 1.875vw, 36px) 0 0;
    max-width: min(29.531vw, 567px);
    width: min(29.531vw, 567px);
  }

  .lab-divisions .lab-section-heading > .lab-button {
    margin: 28px 0 0;
  }

  .lab-divisions__visual {
    height: min(24.323vw, 467px);
    left: min(16.406vw, 315px);
    margin: 0;
    max-width: none;
    position: absolute;
    top: max(min(22.344vw, 429px), 410px);
    transform: none;
    width: min(53.75vw, 1032px);
  }

  .lab-divisions__visual-image {
    height: 100%;
    object-fit: cover;
  }

  .lab-divisions__grid {
    column-gap: var(--lab-grid-gap);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    left: 0;
    margin: 0;
    position: absolute;
    right: 0;
    top: min(46.693vw, 896.5px);
  }

  .lab-division-card__body {
    margin-inline: auto;
    padding: 0;
    width: min(14.219vw, 273px);
  }

  .lab-division-card__dot {
    height: min(.885vw, 17px);
    margin-bottom: min(.755vw, 14.5px);
    width: min(.938vw, 18px);
  }

  .lab-division-card p {
    margin: 7px 0 0;
    max-width: min(14.271vw, 274px);
  }

  /* Method, Figma 12-column mask composition. */
  .lab-method {
    height: min(38.073vw, 731px);
    padding: 0;
  }

  .lab-method__grid { align-items: stretch; }

  .lab-method__media,
  .lab-method__content,
  .lab-method__aside {
    bottom: auto;
    left: 0;
    margin: 0;
    position: absolute;
    right: 0;
  }

  .lab-method__media {
    aspect-ratio: auto;
    grid-column: auto;
    height: 100%;
    left: min(15.156vw, 291px);
    right: auto;
    top: 0;
    width: min(60.104vw, 1154px);
    z-index: 2;
  }

  body.home.page-id-9 .main-content .lab-method__image {
    aspect-ratio: auto;
    height: 100% !important;
    inset: 0;
    max-width: none;
    object-fit: cover;
    position: absolute;
    width: 100% !important;
  }

  .lab-method__media picture { display: block; height: 100%; }

  .lab-method__content {
    grid-column: 1 / span 7;
    max-width: none;
    padding: 0;
    top: 0;
    z-index: 1;
  }

  .lab-method__content .lab-eyebrow { margin: 0; }

  .lab-method__content .lab-display {
    height: min(10.938vw, 210px);
    margin: 0;
    position: absolute;
    top: min(2.083vw, 40px);
    white-space: normal;
    width: min(36.458vw, 700px);
  }

  .lab-method__content .lab-display br { display: block; }

  .lab-method__aside {
    grid-column: auto;
    left: min(76.302vw, calc(100% - 280px));
    padding: 0;
    right: auto;
    top: min(29.896vw, 574px);
    width: min(14.219vw, 273px);
  }

  .lab-method__aside p {
    margin: 0;
    width: min(14.219vw, 273px);
  }

  .lab-method__aside .lab-button {
    max-width: 100%;
    margin-top: min(.938vw, 18px);
    min-width: min(220px, calc(100vw - 48px));
    width: 100%;
  }

  /* Projects, fixed editorial coordinates rather than auto-flow. */
  .lab-projects {
    height: min(116.042vw, 2228px);
    padding: 0;
  }

  .lab-projects > .lab-shell { display: block; }

  .lab-projects__intro {
    display: flex;
    flex-direction: column;
    height: auto;
    left: 33.716%;
    margin: 0;
    max-width: min(20.313vw, 390px);
    position: absolute;
    top: min(16.771vw, 322px);
    width: min(20.313vw, 390px);
  }

  .lab-projects__intro .lab-eyebrow,
  .lab-projects__intro .lab-heading,
  .lab-projects__intro > p:not(.lab-eyebrow),
  .lab-projects__intro > .lab-button {
    left: auto;
    position: static;
  }

  .lab-projects__intro .lab-eyebrow { margin: 0; }

  .lab-projects__intro .lab-heading {
    margin: clamp(18px, 1.198vw, 23px) 0 0;
    white-space: nowrap;
  }

  .lab-projects__intro > p:not(.lab-eyebrow) {
    margin: clamp(26px, 2.292vw, 44px) 0 0;
    width: min(18.177vw, 349px);
  }

  .lab-projects__intro > .lab-button {
    margin: clamp(28px, 2.292vw, 44px) 0 0;
  }

  .lab-projects__grid {
    inset: 0;
    position: absolute;
  }

  .lab-project-card,
  .lab-project-card:nth-child(2n),
  .lab-project-card--wide,
  .lab-project-card--tall {
    bottom: auto;
    left: 0;
    margin: 0;
    position: absolute;
    right: 0;
  }

  .lab-project-card:nth-child(1) { grid-column: 8 / span 4; top: min(15.885vw, 305px); }
  .lab-project-card:nth-child(2) { grid-column: 1 / span 6; top: min(39.948vw, 767px); }
  .lab-project-card:nth-child(3) { grid-column: 9 / span 4; top: min(66.823vw, 1283px); }
  .lab-project-card:nth-child(4) { grid-column: 2 / span 6; top: min(76.198vw, 1463px); }

  .lab-project-card:nth-child(1) .lab-project-card__image {
    height: min(38.802vw, 745px);
    object-position: 22% 50%;
  }
  .lab-project-card:nth-child(2) .lab-project-card__image { height: min(27.865vw, 535px); }
  .lab-project-card:nth-child(3) .lab-project-card__image { height: min(20.26vw, 389px); }
  .lab-project-card:nth-child(4) .lab-project-card__image { height: min(29.01vw, 557px); }

  .lab-project-card__image {
    aspect-ratio: auto !important;
    object-fit: cover;
  }

  .lab-project-card__content {
    align-items: baseline;
    border: 0;
    display: flex;
    gap: 26px;
    padding: 14px 0 0 44px;
    position: relative;
  }

  .lab-project-card__content::before {
    background: url('../images/location-pin.svg') center / contain no-repeat;
    content: '';
    height: 24px;
    left: 0;
    position: absolute;
    top: 17px;
    width: 18px;
  }

  .lab-project-card__meta {
    color: var(--lab-ink);
    margin: 0;
  }

  /* News is three independent Figma layers; keep the motion canvas at its
     native width so ultrawide viewports do not horizontally scale its content. */
  #lab-news.lab-news,
  .lab-news {
    background: #e8ecf2;
    height: min(58.958vw, 1132px);
    min-height: 0;
    overflow: clip;
    position: relative;
  }

  body.home.page-id-9 .container-wrap > .main-content > .row > .lab-news,
  body.home.page-id-9 .lab-home-builder-row .lab-news,
  body.home.page-id-9 .container-wrap > .main-content > .row .wpb_wrapper > .lab-news {
    margin-left: auto;
    margin-right: auto;
    max-width: 1920px;
    width: min(100%, 1920px);
  }

  /* Footer background spans the viewport; its inner shell keeps the authored
     width, height, typography and spacing. */
  body.home.page-id-9 .container-wrap > .main-content > .row > .lab-footer,
  body.home.page-id-9 .lab-home-builder-row .lab-footer,
  body.home.page-id-9 .container-wrap > .main-content > .row .wpb_wrapper > .lab-footer {
    margin-left: auto;
    margin-right: auto;
    max-width: none;
    width: 100%;
  }

  .lab-news::before { display: none; }

  .lab-news__layers { inset: 0; position: absolute; }

  .lab-news__image {
    display: block;
    max-width: none;
    mix-blend-mode: multiply;
    object-fit: fill;
    position: absolute;
  }

  .lab-news__image--top {
    height: min(40.469vw, 777px);
    left: min(16.354vw, 314px);
    top: 0;
    width: calc(100% - min(16.354vw, 314px));
    z-index: 2;
  }

  .lab-news__image--bottom {
    bottom: 0;
    height: min(38.698vw, 743px);
    left: 0;
    width: min(76.979vw, 1478px);
    z-index: 1;
  }

  body.home.page-id-9 .main-content .lab-news__mark {
    bottom: 0;
    height: min(33.21vw, 637.623px) !important;
    left: min(76.979vw, 1478px);
    max-width: none;
    position: absolute;
    right: auto;
    width: min(17.606vw, 338.038px) !important;
    z-index: 3;
  }

  .lab-news__content {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: auto;
    left: 50%;
    max-width: min(29.531vw, 567px);
    position: absolute;
    text-align: center;
    /* The two image layers frame this section, not the viewport. */
    top: 50%;
    transform: translate(-50%, -50%) scale(
      var(--lab-news-content-scale-x, 1),
      var(--lab-news-content-scale-y, 1)
    ) !important;
    width: min(29.531vw, 567px);
    z-index: 3;
  }

  .lab-news__content .lab-eyebrow,
  .lab-news__content .lab-heading,
  .lab-news__content > p:not(.lab-eyebrow),
  .lab-news__content > .lab-button {
    left: auto;
    position: static;
    transform: none;
  }

  .lab-news__content .lab-eyebrow { margin: 0; }

  body.home.page-id-9 #lab-news .lab-news__content .lab-heading {
    margin: clamp(18px, 1.198vw, 23px) 0 0;
    white-space: nowrap;
    width: 100%;
  }

  .lab-news__content > p:not(.lab-eyebrow) {
    margin: clamp(22px, 1.354vw, 26px) 0 0;
    width: min(19.115vw, 367px);
  }

  .lab-news__content > .lab-button {
    margin: 23px 0 0;
  }

}

@media (max-width: 899px) {
  .lab-hero__mark { display: none; }

  .lab-hero__strapline {
    color: var(--lab-blue);
    margin: 20px 0 0;
  }

  .lab-statement__mark {
    bottom: 0;
    height: auto;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 42%;
  }

  body.home.page-id-9 .main-content .lab-statement__content { position: static; }

  body.home.page-id-9 .main-content .lab-statement h2 {
    position: relative;
    z-index: 2;
  }

  body.home.page-id-9 .main-content .lab-statement__mark {
    /* Keep the decorative circle below the title as the mobile heading grows
       on wider phone/tablet widths. The bounds are derived from the 650px
       statement canvas and the mark's authored aspect ratio. */
    bottom: clamp(-347px, calc(296px - 71.5vw), -48px) !important;
    height: 69vw !important;
    left: 50%;
    max-width: none;
    width: 38vw !important;
    z-index: 1;
  }

  .lab-divisions { height: auto; }
  .lab-divisions__visual { height: auto; }

  .lab-project-card__content {
    border: 0;
    padding: 12px 0 0 30px;
    position: relative;
  }

  .lab-projects__grid {
    gap: 52px !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .lab-project-card,
  .lab-project-card:nth-child(2n),
  .lab-project-card--wide,
  .lab-project-card--tall {
    grid-column: 1 !important;
    margin-top: 0 !important;
    width: 100% !important;
  }

  .lab-project-card__image { width: 100% !important; }

  .lab-project-card__content::before {
    background: url('../images/location-pin.svg') center / contain no-repeat;
    content: '';
    height: 19px;
    left: 0;
    position: absolute;
    top: 12px;
    width: 14px;
  }

  .lab-news {
    background: #e8ecf2;
    min-height: 650px;
  }

  .lab-news::before { display: none; }
  .lab-news__layers { inset: 0; position: absolute; }

  .lab-news__image--top {
    height: 62% !important;
    object-fit: cover;
    position: absolute;
    right: 0;
    top: 0;
    width: 86% !important;
  }

  .lab-news__image--bottom {
    bottom: 0;
    height: 58% !important;
    left: 0;
    object-fit: cover;
    position: absolute;
    width: 82% !important;
  }

  body.home.page-id-9 .main-content .lab-news__mark {
    bottom: 0;
    height: 56% !important;
    max-width: none;
    position: absolute;
    right: 2%;
    width: 30% !important;
  }

  .lab-news__content { padding-inline: 20px; z-index: 2; }

  .lab-method__grid { row-gap: 24px; }
  .lab-method__content { padding-bottom: 0; }
  .lab-method__aside { padding-top: 0; }
}

@media (max-width: 1199px) {
  #lab-news.lab-news,
  .lab-news {
    height: clamp(650px, 60vw, 740px);
    min-height: 650px;
    overflow: clip;
    padding: 0;
    position: relative;
  }

  .lab-news__layers {
    inset: 0;
    pointer-events: none;
    position: absolute;
  }

  .lab-news__image {
    display: block;
    left: 0;
    max-width: none;
    mix-blend-mode: multiply;
    object-fit: cover;
    position: absolute;
    right: 0;
    width: 100% !important;
  }

  .lab-news__image--top {
    height: 55% !important;
    top: 0;
  }

  .lab-news__image--bottom {
    bottom: 0;
    height: 55% !important;
  }

  body.home.page-id-9 .main-content .lab-news__mark {
    aspect-ratio: 338.038 / 637.623;
    bottom: 0;
    height: auto !important;
    left: auto;
    max-width: none;
    position: absolute;
    right: 0;
    width: clamp(110px, 22vw, 260px) !important;
  }

  .lab-news__content {
    max-width: 550px;
    padding-inline: 20px;
    width: min(calc(100% - 40px), 550px);
    z-index: 2;
  }
}

/* Tablet-only containment for the legacy WPBakery row. Its nested Salient
   column adds a negative rail at 1023px, which is the source of the only
   measured document overflow in the under-1024 audit. */
@media (min-width: 768px) and (max-width: 1023px) {
  body.home.page-id-9 .row_col_wrap_12,
  body.home.page-id-9 .row_col_wrap_12 > .col,
  body.home.page-id-9 .row_col_wrap_12 > .wpb_column,
  body.home.page-id-9 .row_col_wrap_12 > .col > .vc_column-inner,
  body.home.page-id-9 .row_col_wrap_12 > .wpb_column > .vc_column-inner,
  body.home.page-id-9 .row_col_wrap_12 .wpb_wrapper {
    box-sizing: border-box;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
  }
}