/* Specialized corporate-site laboratory */
:root {
  --lab-violet: #9a6cff;
  --lab-pink: #ff5cab;
  --lab-orange: #ff9b47;
  --lab-blue: #5c8bff;
  --lab-green: #42dca2;
  --lab-white: #f5f3ef;
  --lab-panel: #101217;
}

.service-page {
  --header-height: 82px;
  background:
    radial-gradient(circle at 8% 16%, rgba(255, 155, 71, .055), transparent 20%),
    radial-gradient(circle at 91% 8%, rgba(127, 77, 255, .12), transparent 24%),
    #07080b;
}

.service-page::before {
  background-size: 72px 72px;
  opacity: .55;
}

.service-page .scroll-progress {
  background: linear-gradient(90deg, var(--lab-orange), var(--lab-pink), var(--lab-violet), var(--lab-blue));
}

.service-page .site-header {
  background: rgba(7, 8, 11, .74);
}

.service-page .header-inner {
  min-height: 82px;
  gap: 24px;
}

.service-page .main-nav {
  gap: clamp(18px, 1.55vw, 27px);
}

.service-page .main-nav a {
  color: #c9ccd4;
  font-size: 14px;
  font-weight: 720;
  letter-spacing: -.01em;
}

.service-page .header-phone {
  display: inline-flex;
  padding: 7px 0;
  color: #f0efeb;
  font-size: 16px;
  font-weight: 790;
}

.service-page .main-nav a.is-active {
  color: #fff;
}

.service-page .main-nav a.is-active::after {
  right: 0;
  left: 0;
}

.lab-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #aeb2bd;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  white-space: nowrap;
  transition: color .2s ease;
}

.lab-back:hover {
  color: #fff;
}

.lab-back span {
  color: var(--lab-orange);
  font-size: 15px;
}

.nav-back-mobile {
  display: none!important;
}

.service-page .header-cta {
  margin-left: 0;
  font-size: 12px;
}

.lab-hero {
  position: relative;
  min-height: 820px;
  overflow: hidden;
  padding: 138px 0 34px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  background:
    linear-gradient(90deg, rgba(255,255,255,.017) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.017) 1px, transparent 1px),
    radial-gradient(ellipse at 73% 45%, rgba(87, 43, 190, .17), transparent 33%),
    linear-gradient(180deg, #07080b 0%, #090a0e 72%, #0b0d12 100%);
  background-size: 76px 76px, 76px 76px, auto, auto;
}

.lab-noise {
  position: absolute;
  z-index: 0;
  inset: 0;
  opacity: .2;
  background-image: radial-gradient(rgba(255,255,255,.2) .55px, transparent .55px);
  background-size: 5px 5px;
  mask-image: linear-gradient(90deg, black, transparent 38%, black);
  pointer-events: none;
}

.lab-hero::before {
  position: absolute;
  z-index: 0;
  top: 77px;
  right: 0;
  bottom: 0;
  width: 57%;
  border-left: 1px solid rgba(255,255,255,.045);
  background: linear-gradient(145deg, rgba(255,255,255,.02), transparent 34%);
  content: "";
  pointer-events: none;
}

.lab-hero-orbit {
  position: absolute;
  z-index: 0;
  width: 430px;
  height: 430px;
  border: 1px solid currentColor;
  border-radius: 50%;
  opacity: .17;
  filter: drop-shadow(0 0 35px currentColor);
  pointer-events: none;
}

.lab-hero-orbit::before,
.lab-hero-orbit::after {
  position: absolute;
  inset: 16%;
  border: 1px solid currentColor;
  border-radius: inherit;
  content: "";
}

.lab-hero-orbit::after {
  inset: 34%;
}

.lab-hero-orbit--violet {
  top: 130px;
  right: -210px;
  color: var(--lab-violet);
}

.lab-hero-orbit--orange {
  bottom: -320px;
  left: -240px;
  color: var(--lab-orange);
}

.lab-hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(360px, .82fr) minmax(600px, 1.18fr);
  align-items: center;
  gap: clamp(30px, 4.3vw, 74px);
}

.lab-hero-copy {
  padding-bottom: 52px;
}

.lab-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 25px;
  color: #aeb2bd;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.lab-status i {
  position: relative;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--lab-green);
  box-shadow: 0 0 16px rgba(66, 220, 162, .78);
}

.lab-status i::after {
  position: absolute;
  inset: -5px;
  border: 1px solid rgba(66, 220, 162, .28);
  border-radius: inherit;
  content: "";
}

.lab-hero h1 {
  max-width: 650px;
  margin-bottom: 26px;
  font-size: clamp(48px, 5.4vw, 84px);
  font-weight: 760;
  line-height: .98;
  letter-spacing: -.062em;
}

.lab-hero h1 em,
.lab-cta h2 em {
  background: linear-gradient(100deg, var(--lab-orange), var(--lab-pink) 43%, var(--lab-violet) 86%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-style: normal;
}

.lab-hero-copy > p {
  max-width: 610px;
  margin-bottom: 31px;
  color: #a9adb7;
  font-size: 16px;
  line-height: 1.72;
}

.lab-hero-actions {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-bottom: 46px;
}

.lab-text-link {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  gap: 18px;
  padding: 0 2px;
  border-bottom: 1px solid rgba(255,255,255,.19);
  color: #daddE5;
  font-size: 11px;
  font-weight: 700;
  transition: border-color .2s ease, color .2s ease;
}

.lab-text-link i {
  color: var(--lab-orange);
  font-size: 9px;
  font-style: normal;
  letter-spacing: .12em;
}

.lab-text-link:hover {
  border-color: var(--lab-orange);
  color: #fff;
}

.lab-hero-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 560px;
  margin: 0;
  padding: 21px 0 0;
  border-top: 1px solid rgba(255,255,255,.1);
}

.lab-hero-facts div {
  min-width: 0;
  padding-right: 20px;
  border-right: 1px solid rgba(255,255,255,.08);
}

.lab-hero-facts div + div {
  padding-left: 20px;
}

.lab-hero-facts div:last-child {
  border: 0;
}

.lab-hero-facts dt {
  margin-bottom: 5px;
  color: #696f7c;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.lab-hero-facts dd {
  margin: 0;
  color: #ecebe7;
  font-size: 13px;
  font-weight: 680;
}

.assembly {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 4px 30px 4px 30px;
  background: rgba(9, 10, 14, .76);
  box-shadow: 0 44px 120px rgba(0,0,0,.47), inset 0 1px rgba(255,255,255,.035);
  perspective: 1200px;
}

.assembly::before {
  position: absolute;
  z-index: 2;
  inset: 0;
  border: 1px solid transparent;
  border-image: linear-gradient(140deg, rgba(255,155,71,.45), transparent 26%, transparent 70%, rgba(154,108,255,.35)) 1;
  content: "";
  pointer-events: none;
}

.assembly-chrome {
  display: flex;
  height: 42px;
  align-items: center;
  justify-content: space-between;
  padding: 0 17px;
  border-bottom: 1px solid rgba(255,255,255,.075);
  background: rgba(255,255,255,.018);
  color: #777d8b;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
  letter-spacing: .14em;
}

.assembly-chrome div {
  display: flex;
  gap: 5px;
}

.assembly-chrome i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #3f4450;
}

.assembly-chrome i:first-child { background: var(--lab-pink); }
.assembly-chrome i:nth-child(2) { background: var(--lab-orange); }
.assembly-chrome i:last-child { background: var(--lab-violet); }

.assembly-canvas {
  position: relative;
  height: 500px;
  overflow: hidden;
  transform-style: preserve-3d;
}

.assembly-canvas::before {
  position: absolute;
  width: 330px;
  height: 330px;
  top: 46%;
  left: 50%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(116, 67, 231, .25), rgba(116, 67, 231, .05) 40%, transparent 72%);
  content: "";
  transform: translate(-50%, -50%);
  filter: blur(4px);
}

.assembly-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(153, 119, 238, .065) 1px, transparent 1px),
    linear-gradient(90deg, rgba(153, 119, 238, .065) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: radial-gradient(ellipse at center, black, transparent 72%);
}

.assembly-axis {
  position: absolute;
  z-index: 0;
  background: rgba(255,255,255,.08);
}

.assembly-axis--x {
  top: 50%;
  right: 6%;
  left: 6%;
  height: 1px;
}

.assembly-axis--y {
  top: 7%;
  bottom: 7%;
  left: 50%;
  width: 1px;
}

.assembly-object {
  --assembly-rx: -7deg;
  --assembly-ry: -9deg;
  position: absolute;
  z-index: 1;
  top: 43%;
  left: 53%;
  width: 430px;
  height: 300px;
  transform: translate(-50%, -50%) rotateX(var(--assembly-rx)) rotateY(var(--assembly-ry)) rotateZ(-5deg);
  transform-style: preserve-3d;
  transition: transform .25s ease-out;
}

.assembly-plane {
  position: absolute;
  inset: 20px 28px;
  padding: 19px;
  border: 1px solid currentColor;
  border-radius: 5px 19px 5px 19px;
  background: linear-gradient(135deg, rgba(19,21,29,.94), rgba(10,11,16,.82));
  box-shadow: 0 18px 50px rgba(0,0,0,.3), inset 0 1px rgba(255,255,255,.04);
  color: var(--plane-color);
  opacity: .46;
  transform: translate3d(var(--plane-x), var(--plane-y), var(--plane-z));
  transform-style: preserve-3d;
  transition: opacity .45s ease, transform .65s cubic-bezier(.2,.85,.2,1), filter .45s ease;
}

.assembly-plane::before,
.assembly-plane::after {
  position: absolute;
  content: "";
}

.assembly-plane::before {
  top: 43px;
  right: 19px;
  left: 19px;
  height: 1px;
  background: currentColor;
  opacity: .25;
}

.assembly-plane::after {
  right: 18px;
  bottom: 17px;
  width: 35%;
  height: 34%;
  border: 1px solid currentColor;
  border-radius: 10px 2px 10px 2px;
  opacity: .18;
}

.assembly-plane--strategy { --plane-color: var(--lab-orange); --plane-x: -70px; --plane-y: 64px; --plane-z: -110px; }
.assembly-plane--ux { --plane-color: var(--lab-violet); --plane-x: -35px; --plane-y: 32px; --plane-z: -54px; }
.assembly-plane--design { --plane-color: var(--lab-pink); --plane-x: 0; --plane-y: 0; --plane-z: 0; }
.assembly-plane--dev { --plane-color: var(--lab-blue); --plane-x: 35px; --plane-y: -32px; --plane-z: 54px; }
.assembly-plane--growth { --plane-color: var(--lab-green); --plane-x: 70px; --plane-y: -64px; --plane-z: 110px; }

.assembly[data-active-layer="strategy"] .assembly-plane--strategy,
.assembly[data-active-layer="ux"] .assembly-plane--ux,
.assembly[data-active-layer="design"] .assembly-plane--design,
.assembly[data-active-layer="dev"] .assembly-plane--dev,
.assembly[data-active-layer="growth"] .assembly-plane--growth {
  z-index: 4;
  opacity: 1;
  filter: drop-shadow(0 0 18px color-mix(in srgb, currentColor 28%, transparent));
  transform: translate3d(0, -10px, 155px) scale(1.035);
}

.plane-code {
  display: block;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .15em;
}

.plane-content {
  display: flex;
  width: 68%;
  height: calc(100% - 38px);
  flex-direction: column;
  justify-content: center;
  padding-left: 3px;
}

.plane-content i {
  width: 34px;
  height: 3px;
  margin-bottom: 13px;
  background: currentColor;
  box-shadow: 12px 8px currentColor;
}

.plane-content b {
  margin-bottom: 5px;
  color: #f3f1ed;
  font-size: 21px;
  letter-spacing: -.04em;
}

.plane-content small {
  color: #8f95a2;
  font-size: 10px;
}

.assembly-coordinates {
  position: absolute;
  top: 14px;
  right: 15px;
  display: flex;
  gap: 12px;
  color: #555b67;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 7px;
  text-transform: uppercase;
}

.assembly-readout {
  position: absolute;
  z-index: 4;
  right: 18px;
  bottom: 17px;
  width: 205px;
  padding: 14px 15px;
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(8,9,13,.83);
  backdrop-filter: blur(12px);
}

.assembly-readout span {
  display: block;
  margin-bottom: 5px;
  color: #666c78;
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.assembly-readout strong {
  display: block;
  margin-bottom: 5px;
  font-size: 13px;
}

.assembly-readout small {
  display: block;
  color: #898f9c;
  font-size: 8px;
  line-height: 1.45;
}

.assembly-controls {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-top: 1px solid rgba(255,255,255,.075);
}

.assembly-controls button {
  position: relative;
  min-width: 0;
  min-height: 68px;
  padding: 13px 8px 11px;
  border: 0;
  border-right: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.01);
  color: #7a808d;
  cursor: pointer;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
  transition: color .2s ease, background .2s ease;
}

.assembly-controls button:last-child { border-right: 0; }

.assembly-controls button i {
  position: absolute;
  top: -1px;
  right: 0;
  left: 0;
  height: 2px;
  background: currentColor;
  opacity: 0;
}

.assembly-controls button span {
  display: block;
  margin-bottom: 6px;
  color: #4f5561;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 7px;
}

.assembly-controls button:nth-child(1).is-active { color: var(--lab-orange); }
.assembly-controls button:nth-child(2).is-active { color: var(--lab-violet); }
.assembly-controls button:nth-child(3).is-active { color: var(--lab-pink); }
.assembly-controls button:nth-child(4).is-active { color: var(--lab-blue); }
.assembly-controls button:nth-child(5).is-active { color: var(--lab-green); }
.assembly-controls button.is-active { background: rgba(255,255,255,.035); }
.assembly-controls button.is-active i { opacity: 1; }
.assembly-controls button:hover { color: #fff; }

.lab-hero-foot {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
  margin-top: 28px;
  color: #5f6571;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.lab-hero-foot i {
  height: 1px;
  overflow: hidden;
  background: rgba(255,255,255,.08);
}

.lab-hero-foot i::after {
  display: block;
  width: 24%;
  height: 100%;
  background: linear-gradient(90deg, transparent, var(--lab-violet), transparent);
  content: "";
  animation: lab-scan 3.4s ease-in-out infinite;
}

@keyframes lab-scan {
  from { transform: translateX(-110%); }
  to { transform: translateX(520%); }
}

.lab-section {
  position: relative;
  padding: 122px 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.lab-section::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(50% - min(var(--container), calc(100% - 64px)) / 2);
  width: 1px;
  background: linear-gradient(transparent, rgba(255,255,255,.055) 8%, rgba(255,255,255,.055) 92%, transparent);
  content: "";
  pointer-events: none;
}

.lab-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(310px, .58fr);
  align-items: end;
  gap: clamp(50px, 8vw, 128px);
  margin-bottom: 75px;
}

.lab-heading h2 {
  max-width: 850px;
  margin-bottom: 0;
  font-size: clamp(40px, 4.3vw, 64px);
  font-weight: 720;
  line-height: 1.02;
  letter-spacing: -.06em;
}

.lab-heading p {
  margin-bottom: 3px;
  color: #8f95a1;
  font-size: 14px;
  line-height: 1.75;
}

.lab-heading--compact {
  grid-template-columns: minmax(0, 1fr) minmax(310px, .54fr);
}

.lab-index {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 18px;
  color: var(--lab-violet);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.lab-index::before {
  width: 23px;
  height: 1px;
  background: currentColor;
  content: "";
}

.lab-architecture {
  background:
    radial-gradient(circle at 84% 43%, rgba(127,77,255,.08), transparent 27%),
    #0a0c10;
}

.story {
  display: grid;
  grid-template-columns: minmax(330px, .65fr) minmax(570px, 1.35fr);
  gap: clamp(60px, 9vw, 140px);
  align-items: start;
}

.story-steps {
  padding-bottom: 9vh;
}

.story-step {
  display: grid;
  min-height: 45vh;
  grid-template-columns: 45px 1fr;
  align-content: center;
  gap: 22px;
  border-top: 1px solid rgba(255,255,255,.08);
  opacity: .35;
  transition: opacity .45s ease, transform .45s ease;
}

.story-step:last-child { border-bottom: 1px solid rgba(255,255,255,.08); }

.story-step.is-active {
  opacity: 1;
  transform: translateX(9px);
}

.story-step > span {
  padding-top: 3px;
  color: #6b717e;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
}

.story-step small {
  display: block;
  margin-bottom: 11px;
  color: var(--lab-violet);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.story-step:nth-child(1) small { color: var(--lab-orange); }
.story-step:nth-child(3) small { color: var(--lab-pink); }
.story-step:nth-child(4) small { color: var(--lab-blue); }
.story-step:nth-child(5) small { color: var(--lab-green); }

.story-step h3 {
  margin-bottom: 12px;
  font-size: 27px;
}

.story-step p {
  margin-bottom: 0;
  color: #8b919d;
  font-size: 13px;
  line-height: 1.72;
}

.story-stage {
  position: sticky;
  top: 108px;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.105);
  border-radius: 3px 30px 3px 30px;
  background: #0d0f14;
  box-shadow: 0 38px 90px rgba(0,0,0,.34);
}

.story-stage-top {
  display: grid;
  height: 50px;
  grid-template-columns: 1fr auto 36px;
  align-items: center;
  gap: 20px;
  padding: 0 16px;
  border-bottom: 1px solid rgba(255,255,255,.075);
  color: #676d79;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 7px;
  letter-spacing: .13em;
}

.story-stage-top b { color: #8d939f; font-weight: 500; }
.story-stage-top i { color: var(--lab-violet); font-size: 11px; font-style: normal; text-align: right; }

.blueprint {
  position: relative;
  height: 475px;
  overflow: hidden;
  background:
    linear-gradient(rgba(138,108,210,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(138,108,210,.04) 1px, transparent 1px),
    radial-gradient(circle at 58% 35%, rgba(100,61,205,.13), transparent 40%),
    #0a0c10;
  background-size: 36px 36px, 36px 36px, auto, auto;
}

.blueprint-sidebar {
  position: absolute;
  z-index: 2;
  top: 27px;
  bottom: 27px;
  left: 23px;
  display: flex;
  width: 48px;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 14px 0;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.018);
}

.blueprint-sidebar b {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border: 1px solid var(--lab-violet);
  color: #fff;
  font-size: 7px;
}

.blueprint-sidebar i {
  width: 8px;
  height: 8px;
  border: 1px solid #505663;
  border-radius: 50%;
}

.blueprint-main {
  position: absolute;
  z-index: 1;
  top: 50px;
  right: 42px;
  bottom: 43px;
  left: 95px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 2px 15px 2px 15px;
  background: #11141b;
  box-shadow: 0 25px 55px rgba(0,0,0,.38);
  transform: perspective(1000px) rotateY(-5deg) rotateX(2deg);
  transition: transform .7s cubic-bezier(.2,.8,.2,1), filter .4s ease;
}

.blueprint-nav {
  display: flex;
  height: 40px;
  align-items: center;
  gap: 16px;
  padding: 0 15px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  font-size: 6px;
  color: #7e8490;
}

.blueprint-nav strong { margin-right: auto; color: #f2f0eb; font-size: 7px; }
.blueprint-nav button { padding: 4px 7px; border: 1px solid var(--lab-violet); background: transparent; color: #d9d5e4; font-size: 5px; }

.blueprint-hero {
  position: relative;
  min-height: 206px;
  padding: 39px 30px;
  background: radial-gradient(circle at 78% 40%, rgba(135,82,255,.25), transparent 25%);
}

.blueprint-hero::after {
  position: absolute;
  top: 32px;
  right: 34px;
  width: 120px;
  height: 120px;
  border: 1px solid rgba(154,108,255,.48);
  border-radius: 58% 42% 34% 66% / 52% 30% 70% 48%;
  background: radial-gradient(circle at 35% 35%, rgba(255,92,171,.5), rgba(127,77,255,.23) 48%, transparent 70%);
  box-shadow: inset 15px -12px 32px rgba(65,39,150,.27), 0 0 34px rgba(127,77,255,.16);
  content: "";
  transform: rotate(20deg);
}

.blueprint-hero small { display: block; margin-bottom: 11px; color: var(--lab-orange); font-size: 6px; text-transform: uppercase; letter-spacing: .14em; }
.blueprint-hero b { display: block; width: 58%; margin-bottom: 9px; color: #f4f2ee; font-size: 25px; line-height: 1; letter-spacing: -.05em; }
.blueprint-hero p { width: 49%; margin-bottom: 13px; color: #7c8290; font-size: 6px; }
.blueprint-hero > span { display: inline-block; padding-bottom: 3px; border-bottom: 1px solid var(--lab-violet); color: #ddd9e8; font-size: 6px; }

.blueprint-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; padding: 13px 18px; }
.blueprint-cards i { height: 60px; border: 1px solid rgba(255,255,255,.075); background: linear-gradient(135deg, rgba(255,255,255,.025), transparent); }

.blueprint-chart {
  position: absolute;
  right: 18px;
  bottom: 15px;
  left: 18px;
  display: flex;
  height: 24px;
  align-items: flex-end;
  gap: 5px;
}

.blueprint-chart span { flex: 1; height: 18%; background: rgba(154,108,255,.2); }
.blueprint-chart span:nth-child(2) { height: 35%; }
.blueprint-chart span:nth-child(3) { height: 58%; }
.blueprint-chart span:nth-child(4) { height: 72%; background: rgba(255,92,171,.28); }
.blueprint-chart span:nth-child(5) { height: 96%; background: rgba(66,220,162,.4); }

.blueprint-layer {
  position: absolute;
  z-index: 5;
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s ease, transform .65s cubic-bezier(.2,.85,.2,1);
}

.blueprint-layer--strategy {
  right: 25px;
  bottom: 28px;
  display: flex;
  gap: 6px;
  padding: 12px;
  border: 1px solid rgba(255,155,71,.5);
  background: rgba(18,13,9,.88);
  color: var(--lab-orange);
  transform: translate(20px, 15px);
}

.blueprint-layer--strategy b,
.blueprint-layer--strategy span { padding: 4px 7px; border: 1px solid currentColor; font-size: 6px; }

.blueprint-layer--ux {
  top: 58px;
  right: 20px;
  display: grid;
  width: 180px;
  height: 135px;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 15px;
  border: 1px solid rgba(154,108,255,.55);
  background: rgba(11,8,20,.88);
  color: var(--lab-violet);
  transform: translateX(24px);
}

.blueprint-layer--ux b { grid-column: 1/-1; font-size: 7px; }
.blueprint-layer--ux i { position: relative; width: 12px; height: 12px; border: 1px solid currentColor; border-radius: 50%; }
.blueprint-layer--ux i::after { position:absolute; top:50%; left:100%; width:24px; height:1px; background:currentColor; opacity:.35; content:""; }

.blueprint-layer--design {
  top: 22px;
  left: 82px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(255,92,171,.52);
  background: rgba(20,8,15,.88);
  color: var(--lab-pink);
  transform: translateY(-18px);
}

.blueprint-layer--design b { margin-right: 5px; font-size: 7px; }
.blueprint-layer--design span { width: 15px; height: 15px; border-radius: 50%; background: currentColor; }
.blueprint-layer--design span:nth-child(3) { background: var(--lab-violet); }
.blueprint-layer--design span:nth-child(4) { background: var(--lab-orange); }

.blueprint-layer--dev {
  right: 26px;
  bottom: 23px;
  width: 185px;
  padding: 14px;
  border: 1px solid rgba(92,139,255,.5);
  background: rgba(6,10,22,.92);
  color: var(--lab-blue);
  transform: translate(20px, 15px);
}

.blueprint-layer--dev b { display: block; margin-bottom: 8px; font-size: 7px; }
.blueprint-layer--dev code { color: #97a9d5; font-size: 7px; line-height: 1.7; }

.blueprint-layer--growth {
  top: 40px;
  right: 24px;
  width: 160px;
  padding: 15px;
  border: 1px solid rgba(66,220,162,.52);
  background: rgba(6,20,16,.9);
  color: var(--lab-green);
  transform: translateX(20px);
}

.blueprint-layer--growth b { display: block; margin-bottom: 4px; font-size: 24px; }
.blueprint-layer--growth span { display: block; margin-bottom: 14px; color: #8aa99e; font-size: 7px; }
.blueprint-layer--growth i { display:block; height:28px; background: linear-gradient(155deg, transparent 48%, currentColor 49%, currentColor 52%, transparent 53%); }

.story-stage[data-story-stage="strategy"] .blueprint-layer--strategy,
.story-stage[data-story-stage="ux"] .blueprint-layer--ux,
.story-stage[data-story-stage="design"] .blueprint-layer--design,
.story-stage[data-story-stage="dev"] .blueprint-layer--dev,
.story-stage[data-story-stage="growth"] .blueprint-layer--growth {
  opacity: 1;
  transform: translate(0, 0);
}

.story-stage[data-story-stage="strategy"] .blueprint-main { filter: saturate(.75); }
.story-stage[data-story-stage="ux"] .blueprint-main { transform: perspective(1000px) rotateY(-2deg) rotateX(1deg) scale(.985); }
.story-stage[data-story-stage="design"] .blueprint-main { filter: saturate(1.25); }
.story-stage[data-story-stage="dev"] .blueprint-main { transform: perspective(1000px) rotateY(4deg) rotateX(-1deg) scale(.98); }
.story-stage[data-story-stage="growth"] .blueprint-main { filter: contrast(1.05) saturate(1.08); }

.story-progress {
  height: 2px;
  background: rgba(255,255,255,.06);
}

.story-progress i {
  display: block;
  width: 20%;
  height: 100%;
  background: linear-gradient(90deg, var(--lab-orange), var(--lab-pink), var(--lab-violet), var(--lab-blue), var(--lab-green));
  transition: width .45s ease;
}

.story-caption {
  display: grid;
  min-height: 70px;
  grid-template-columns: 130px 1fr;
  align-items: center;
  gap: 20px;
  padding: 13px 17px;
}

.story-caption span { font-size: 11px; font-weight: 750; }
.story-caption p { margin: 0; color: #777d89; font-size: 9px; }

.diagnostic {
  overflow: hidden;
  background: #08090d;
}

.diagnostic-glow {
  position: absolute;
  top: 22%;
  right: -240px;
  width: 600px;
  height: 600px;
  border: 1px solid rgba(255,92,171,.1);
  border-radius: 50%;
  box-shadow: inset 0 0 100px rgba(127,77,255,.04);
}

.diagnostic-glow::before,
.diagnostic-glow::after { position:absolute; inset:16%; border:1px solid rgba(154,108,255,.09); border-radius:50%; content:""; }
.diagnostic-glow::after { inset:33%; }

.diagnostic-console {
  position: relative;
  display: grid;
  grid-template-columns: minmax(340px, .72fr) minmax(500px, 1.28fr);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 3px 30px 3px 30px;
  background: rgba(15,17,23,.86);
  box-shadow: 0 35px 90px rgba(0,0,0,.28);
}

.diagnostic-options {
  border-right: 1px solid rgba(255,255,255,.08);
}

.diagnostic-options button {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 116px;
  grid-template-columns: 43px 1fr;
  gap: 10px;
  padding: 25px 28px;
  border: 0;
  border-bottom: 1px solid rgba(255,255,255,.075);
  background: transparent;
  color: #d9d9d6;
  cursor: pointer;
  text-align: left;
  transition: background .25s ease, color .25s ease;
}

.diagnostic-options button:last-child { border-bottom: 0; }
.diagnostic-options button::after { position:absolute; top:0; bottom:0; left:0; width:2px; background:var(--lab-violet); opacity:0; content:""; }
.diagnostic-options button.is-active { background: linear-gradient(90deg, rgba(127,77,255,.1), transparent); color:#fff; }
.diagnostic-options button.is-active::after { opacity:1; }
.diagnostic-options button:hover { background-color: rgba(255,255,255,.025); }
.diagnostic-options button > span { grid-row: 1 / span 2; color:#5f6571; font-family:"SFMono-Regular",Consolas,monospace; font-size:9px; }
.diagnostic-options button b { align-self:end; font-size:16px; }
.diagnostic-options button small { color:#777d89; font-size:10px; }

.diagnostic-result {
  position: relative;
  min-height: 466px;
  padding: 50px clamp(35px, 5vw, 75px);
  background:
    radial-gradient(circle at 85% 15%, rgba(127,77,255,.1), transparent 27%),
    linear-gradient(rgba(255,255,255,.016) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
  background-size: auto, 36px 36px, 36px 36px;
}

.diagnostic-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 22px;
  color: #676d79;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.diagnostic-result-head i {
  color: var(--lab-green);
  font-size: 7px;
  font-style: normal;
}

.diagnostic-result > strong {
  display: block;
  max-width: 600px;
  margin-bottom: 13px;
  font-size: clamp(28px, 3.3vw, 44px);
  line-height: 1.04;
  letter-spacing: -.055em;
}

.diagnostic-result > p {
  max-width: 600px;
  margin-bottom: 35px;
  color: #8d939f;
  font-size: 12px;
  line-height: 1.7;
}

.diagnostic-bars {
  display: grid;
  gap: 13px;
  margin-bottom: 33px;
}

.diagnostic-bars > div {
  display: grid;
  grid-template-columns: 88px 1fr 38px;
  align-items: center;
  gap: 14px;
  color: #8c929e;
  font-size: 8px;
  text-transform: uppercase;
}

.diagnostic-bars div > i {
  height: 3px;
  background: rgba(255,255,255,.08);
}

.diagnostic-bars div > i b {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, var(--lab-violet), var(--lab-pink));
  box-shadow: 0 0 10px rgba(154,108,255,.33);
  transition: width .65s cubic-bezier(.2,.8,.2,1);
}

.diagnostic-bars em { color:#5d6370; font-style:normal; text-align:right; }

.diagnostic-next {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 18px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.09);
}

.diagnostic-next span { color:var(--lab-orange); font-size:8px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.diagnostic-next b { color:#d7d7d4; font-size:11px; font-weight:600; }

.configurator {
  background:
    radial-gradient(circle at 8% 65%, rgba(255,155,71,.055), transparent 20%),
    #0a0b0f;
}

.config-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr);
  align-items: start;
  gap: clamp(45px, 7vw, 100px);
}

.config-modules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid rgba(255,255,255,.1);
  border-left: 1px solid rgba(255,255,255,.1);
}

.config-section-label {
  display: flex;
  min-height: 48px;
  grid-column: 1/-1;
  align-items: center;
  justify-content: space-between;
  padding: 0 18px;
  border-right: 1px solid rgba(255,255,255,.1);
  border-bottom: 1px solid rgba(255,255,255,.1);
  color: #7c828f;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.config-section-label b { color: var(--lab-violet); }

.config-card {
  position: relative;
  display: grid;
  min-height: 183px;
  grid-template-columns: 42px 1fr;
  align-content: start;
  gap: 0 15px;
  padding: 27px 24px 23px;
  border-right: 1px solid rgba(255,255,255,.1);
  border-bottom: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.008);
  cursor: pointer;
  transition: background .25s ease, box-shadow .25s ease;
}

.config-card:hover { background:rgba(255,255,255,.026); }
.config-card:has(input:checked) { background:linear-gradient(135deg, rgba(127,77,255,.12), rgba(255,92,171,.025)); box-shadow:inset 0 0 0 1px rgba(154,108,255,.22); }
.config-card input { position:absolute; width:1px; height:1px; opacity:0; }
.config-card input:focus-visible + .config-check { outline:2px solid var(--lab-violet); outline-offset:3px; }

.config-check {
  position: absolute;
  top: 17px;
  right: 17px;
  display: grid;
  width: 21px;
  height: 21px;
  place-items: center;
  border: 1px solid rgba(255,255,255,.15);
  color: #777d89;
  font-size: 13px;
  line-height: 1;
  transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease;
}

.config-card:has(input:checked) .config-check { border-color:var(--lab-violet); background:var(--lab-violet); color:#fff; transform:rotate(45deg); }

.config-icon {
  display: grid;
  width: 42px;
  height: 42px;
  grid-row: 1 / span 3;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 12px 2px 12px 2px;
  background: color-mix(in srgb, currentColor 7%, transparent);
  box-shadow: inset 0 0 18px color-mix(in srgb, currentColor 6%, transparent);
  font-size: 12px;
  font-style: normal;
}

.config-icon--orange { color:var(--lab-orange); }
.config-icon--violet { color:var(--lab-violet); }
.config-icon--blue { color:var(--lab-blue); }
.config-icon--pink { color:var(--lab-pink); }
.config-icon--green { color:var(--lab-green); }

.config-card > b { align-self:end; padding-right:26px; color:#e6e5e1; font-size:14px; }
.config-card > small { margin-top:5px; color:#747b88; font-size:9px; line-height:1.5; }
.config-card > em { grid-column:2; align-self:end; margin-top:18px; color:#9a9fab; font-size:9px; font-style:normal; font-weight:700; }

.config-summary {
  position: sticky;
  top: 108px;
  overflow: hidden;
  padding: 0 28px 28px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 3px 26px 3px 26px;
  background:
    linear-gradient(rgba(255,255,255,.016) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px),
    #111319;
  background-size: 28px 28px;
  box-shadow: 0 35px 80px rgba(0,0,0,.3);
}

.config-summary::before { position:absolute; top:-90px; right:-80px; width:230px; height:230px; border:1px solid rgba(154,108,255,.18); border-radius:50%; box-shadow:inset 0 0 60px rgba(127,77,255,.07); content:""; }

.config-summary-top {
  position: relative;
  display: flex;
  height: 50px;
  align-items: center;
  justify-content: space-between;
  margin: 0 -28px 29px;
  padding: 0 18px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  color:#666c78;
  font-family:"SFMono-Regular",Consolas,monospace;
  font-size:7px;
  letter-spacing:.12em;
}

.config-summary-top i { color:var(--lab-violet); font-style:normal; }
.config-summary h3 { position:relative; margin-bottom:21px; font-size:25px; }
.config-summary ul { position:relative; min-height:145px; margin:0 0 25px; padding:0; list-style:none; }
.config-summary li { position:relative; padding:6px 0 6px 20px; border-bottom:1px solid rgba(255,255,255,.055); color:#8f95a1; font-size:9px; }
.config-summary li::before { position:absolute; left:0; color:var(--lab-violet); content:"+"; }

.config-total,
.config-time { position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding:18px 0; border-top:1px solid rgba(255,255,255,.09); }
.config-total span,
.config-time span { color:#7a808c; font-size:8px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.config-total span small { display:block; margin-top:4px; color:#555b66; font-size:6px; }
.config-total b { color:#f2f0ec; font-size:19px; letter-spacing:-.03em; text-align:right; }
.config-time { align-items:center; padding-top:2px; border:0; }
.config-time b { color:var(--lab-green); font-size:11px; }
.config-summary .button { position:relative; width:100%; margin-top:15px; }
.config-summary > p { position:relative; margin:15px 0 0; color:#5e6470; font-size:7px; text-align:center; }

.case-lab {
  background:#08090c;
}

.case-xray {
  display:grid;
  grid-template-columns:minmax(310px,.62fr) minmax(560px,1.38fr);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  border-radius:3px 28px 3px 28px;
  background:#111319;
}

.case-xray-copy { padding:clamp(35px,5vw,68px); border-right:1px solid rgba(255,255,255,.08); }
.case-xray-number { margin-bottom:37px; color:var(--lab-orange); font-family:"SFMono-Regular",Consolas,monospace; font-size:8px; font-weight:800; letter-spacing:.15em; }
.case-xray-tags { display:flex; gap:7px; margin-bottom:19px; }
.case-xray-tags span { padding:5px 8px; border:1px solid rgba(255,255,255,.12); color:#8c929e; font-size:7px; text-transform:uppercase; }
.case-xray-copy h3 { margin-bottom:13px; font-size:35px; }
.case-xray-copy > p { margin-bottom:34px; color:#8b919d; font-size:11px; line-height:1.7; }
.case-xray-copy dl { margin:0; }
.case-xray-copy dl div { display:grid; grid-template-columns:65px 1fr; gap:12px; padding:11px 0; border-top:1px solid rgba(255,255,255,.075); }
.case-xray-copy dt { color:#5f6571; font-size:7px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.case-xray-copy dd { margin:0; color:#c7c8c6; font-size:9px; }

.xray-view { position:relative; min-height:520px; overflow:hidden; background:#0b0d12; }
.xray-photo,
.xray-scheme { position:absolute; inset:0; }
.xray-photo img { width:100%; height:100%; object-fit:cover; filter:saturate(.75) contrast(1.04) brightness(.66); }
.xray-photo::after { position:absolute; inset:0; background:linear-gradient(90deg,transparent 65%,rgba(6,7,10,.22)), linear-gradient(180deg,rgba(6,7,10,.07),rgba(6,7,10,.3)); content:""; }
.xray-scheme { z-index:2; width:var(--xray-split); overflow:hidden; border-right:1px solid var(--lab-orange); background:linear-gradient(rgba(255,155,71,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,155,71,.055) 1px,transparent 1px),#0d0e12; background-size:34px 34px; color:var(--lab-orange); }
.xray-scheme::after { position:absolute; inset:0; min-width:700px; background:radial-gradient(circle at 48% 44%,rgba(255,155,71,.08),transparent 35%); content:""; }
.scheme-nav { position:absolute; z-index:1; top:38px; left:45px; width:430px; height:12px; border-top:1px solid currentColor; border-bottom:1px solid currentColor; opacity:.4; }
.scheme-title { position:absolute; z-index:1; top:122px; left:45px; width:300px; height:100px; border:1px solid currentColor; opacity:.65; }
.scheme-title::before,.scheme-title::after { position:absolute; left:17px; width:72%; height:1px; background:currentColor; content:""; }
.scheme-title::before { top:25px; box-shadow:0 12px currentColor; }
.scheme-title::after { top:64px; width:42%; }
.scheme-line { position:absolute; z-index:1; top:255px; left:45px; width:160px; height:1px; background:currentColor; opacity:.4; }
.scheme-button { position:absolute; z-index:1; top:282px; left:45px; width:88px; height:30px; border:1px solid currentColor; }
.scheme-grid { position:absolute; z-index:1; right:50px; bottom:45px; left:45px; display:grid; min-width:520px; grid-template-columns:repeat(3,1fr); gap:13px; }
.scheme-grid i { height:95px; border:1px solid currentColor; opacity:.32; }
.xray-scheme > span { position:absolute; z-index:3; bottom:17px; left:45px; width:400px; font-family:"SFMono-Regular",Consolas,monospace; font-size:7px; letter-spacing:.13em; text-transform:uppercase; }
.xray-divider { position:absolute; z-index:4; top:0; bottom:0; left:var(--xray-split); width:1px; background:var(--lab-orange); pointer-events:none; }
.xray-divider i { position:absolute; top:50%; left:0; display:grid; width:36px; height:36px; place-items:center; border:1px solid var(--lab-orange); border-radius:50%; background:#0d0e12; color:#fff; font-size:12px; font-style:normal; transform:translate(-50%,-50%); }
.xray-label { position:absolute; z-index:4; top:17px; padding:6px 8px; background:rgba(7,8,11,.8); color:#fff; font-size:7px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.xray-label--left { left:17px; color:var(--lab-orange); }
.xray-label--right { right:17px; }
.xray-view input[type="range"] { position:absolute; z-index:6; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:ew-resize; }
.xray-view:has(input:focus-visible) { box-shadow:inset 0 0 0 2px var(--lab-orange); }

.case-notes { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:18px; }
.case-note { display:grid; grid-template-columns:1fr 1fr; min-height:240px; overflow:hidden; border:1px solid rgba(255,255,255,.09); background:#101217; }
.case-note > span { position:absolute; z-index:2; margin:17px; padding:5px 7px; background:rgba(7,8,11,.82); color:#b9bdc6; font-family:"SFMono-Regular",Consolas,monospace; font-size:7px; }
.case-note > div { grid-row:1 / span 3; min-height:240px; overflow:hidden; }
.case-note img { width:100%; height:100%; object-fit:cover; filter:saturate(.62) brightness(.6); transition:filter .35s ease,transform .5s ease; }
.case-note:hover img { filter:saturate(.85) brightness(.75); transform:scale(1.025); }
.case-note h3 { align-self:end; margin:0; padding:28px 27px 10px; font-size:21px; }
.case-note p { margin:0; padding:0 27px 11px; color:#7f8591; font-size:9px; line-height:1.6; }
.case-note > b { align-self:start; padding:0 27px 25px; color:var(--lab-violet); font-size:7px; letter-spacing:.06em; text-transform:uppercase; }

.antibrief {
  overflow:hidden;
  background:linear-gradient(180deg,#0b0d12,#08090d);
}

.antibrief-orbit { position:absolute; right:-380px; bottom:-400px; width:800px; height:800px; border:1px solid rgba(154,108,255,.12); border-radius:50%; box-shadow:inset 0 0 130px rgba(127,77,255,.04); }
.antibrief-orbit::before,.antibrief-orbit::after { position:absolute; inset:17%; border:1px solid rgba(255,92,171,.08); border-radius:50%; content:""; }
.antibrief-orbit::after { inset:35%; border-color:rgba(255,155,71,.08); }

.antibrief-console { position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.11); border-radius:3px 30px 3px 30px; background:rgba(15,17,23,.94); box-shadow:0 35px 90px rgba(0,0,0,.28); }
.antibrief-progress { display:grid; height:55px; grid-template-columns:1fr 110px; align-items:center; gap:25px; padding:0 23px; border-bottom:1px solid rgba(255,255,255,.08); }
.antibrief-progress > span { height:2px; background:rgba(255,255,255,.08); }
.antibrief-progress > span i { display:block; width:25%; height:100%; background:linear-gradient(90deg,var(--lab-orange),var(--lab-pink),var(--lab-violet)); transition:width .45s ease; }
.antibrief-progress b { color:#6b717d; font-family:"SFMono-Regular",Consolas,monospace; font-size:8px; font-weight:600; letter-spacing:.1em; text-align:right; }

.brief-panels { min-height:540px; }
.brief-panel { padding:58px clamp(35px,7vw,96px) 50px; }
.brief-question-index { display:block; margin-bottom:18px; color:var(--lab-violet); font-family:"SFMono-Regular",Consolas,monospace; font-size:9px; font-weight:800; }
.brief-panel h3 { max-width:760px; margin-bottom:12px; font-size:clamp(30px,4vw,49px); }
.brief-panel > p { margin-bottom:34px; color:#7f8591; font-size:12px; }
.brief-answers { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid rgba(255,255,255,.09); border-left:1px solid rgba(255,255,255,.09); }
.brief-answers button { display:grid; min-height:120px; grid-template-columns:43px 1fr; align-items:center; gap:15px; padding:22px 25px; border:0; border-right:1px solid rgba(255,255,255,.09); border-bottom:1px solid rgba(255,255,255,.09); background:transparent; color:#dddcd8; cursor:pointer; text-align:left; transition:background .25s ease,box-shadow .25s ease; }
.brief-answers button:hover,.brief-answers button.is-selected { background:linear-gradient(135deg,rgba(127,77,255,.13),rgba(255,92,171,.025)); box-shadow:inset 0 0 0 1px rgba(154,108,255,.2); }
.brief-answers button > i { display:grid; width:40px; height:40px; place-items:center; border:1px solid rgba(154,108,255,.45); border-radius:10px 2px 10px 2px; color:var(--lab-violet); font-size:9px; font-style:normal; }
.brief-answers button:nth-child(2) > i { border-color:rgba(255,92,171,.44); color:var(--lab-pink); }
.brief-answers button:nth-child(3) > i { border-color:rgba(255,155,71,.44); color:var(--lab-orange); }
.brief-answers button:nth-child(4) > i { border-color:rgba(92,139,255,.44); color:var(--lab-blue); }
.brief-answers b { display:block; margin-bottom:5px; font-size:14px; }
.brief-answers small { display:block; color:#777d89; font-size:9px; }

.brief-controls { display:flex; align-items:center; justify-content:space-between; min-height:58px; padding:0 23px; border-top:1px solid rgba(255,255,255,.08); }
.brief-controls button { padding:8px 0; border:0; background:transparent; color:#777d89; cursor:pointer; font-size:9px; }
.brief-controls button:hover { color:#fff; }
.brief-controls button:disabled { opacity:.3; cursor:not-allowed; }

.brief-ready { display:flex; align-items:center; gap:10px; margin:-3px 0 18px; color:var(--lab-green); font-size:8px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.brief-ready i { width:7px; height:7px; border-radius:50%; background:currentColor; box-shadow:0 0 15px currentColor; }
.brief-summary { display:grid; grid-template-columns:repeat(3,1fr); margin:30px 0; border-top:1px solid rgba(255,255,255,.09); border-left:1px solid rgba(255,255,255,.09); }
.brief-summary div { min-height:110px; padding:20px; border-right:1px solid rgba(255,255,255,.09); border-bottom:1px solid rgba(255,255,255,.09); }
.brief-summary span { display:block; margin-bottom:10px; color:#626874; font-size:7px; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.brief-summary b { color:#d8d8d5; font-size:11px; line-height:1.45; }
.brief-contact-row { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-bottom:18px; }
.brief-contact-row label span { display:block; margin-bottom:7px; color:#777d89; font-size:8px; }
.brief-contact-row input { width:100%; height:48px; padding:0 15px; border:1px solid rgba(255,255,255,.11); border-radius:0; background:rgba(255,255,255,.025); color:#fff; outline:none; }
.brief-contact-row input:focus { border-color:var(--lab-violet); }
.brief-actions { display:flex; gap:10px; }
.brief-status { margin:14px 0 0!important; color:#606672!important; font-size:8px!important; }

.lab-cta {
  position:relative;
  min-height:620px;
  overflow:hidden;
  padding:120px 0 140px;
  background:
    radial-gradient(circle at 80% 28%,rgba(127,77,255,.17),transparent 24%),
    radial-gradient(circle at 66% 72%,rgba(255,92,171,.075),transparent 25%),
    #07080b;
}

.lab-cta::before { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(90deg,transparent,black); content:""; }
.lab-cta-grid { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(320px,.55fr); gap:clamp(70px,11vw,170px); align-items:start; }
.lab-cta h2 { margin:0; font-size:clamp(45px,6vw,86px); font-weight:730; line-height:.98; letter-spacing:-.065em; }
.lab-cta-contact { padding-top:34px; }
.lab-cta-contact p { margin-bottom:26px; color:#8e949f; font-size:13px; line-height:1.75; }
.lab-cta-contact a { display:flex; align-items:center; justify-content:space-between; padding:16px 0; border-top:1px solid rgba(255,255,255,.12); color:#e4e3df; font-size:14px; font-weight:650; }
.lab-cta-contact a:last-child { border-bottom:1px solid rgba(255,255,255,.12); }
.lab-cta-contact a span { color:var(--lab-violet); }
.lab-cta-contact a:hover span { color:var(--lab-orange); }
.lab-cta-word { position:absolute; right:-2vw; bottom:-10vw; color:rgba(255,255,255,.022); font-size:clamp(160px,25vw,430px); font-weight:850; line-height:1; letter-spacing:-.1em; white-space:nowrap; pointer-events:none; }

.lab-footer { border-top:1px solid rgba(255,255,255,.08); background:#06070a; }

.lab-magnetic { will-change:transform; }

@media (max-width: 1180px) {
  .service-page .main-nav { gap:20px; }
  .service-page .main-nav a { font-size:13px; }
  .service-page .header-phone { font-size:15px; }
  .service-page .header-cta { display:none; }
  .lab-back { display:none; }
  .lab-hero-grid { grid-template-columns:minmax(330px,.78fr) minmax(530px,1.22fr); gap:26px; }
  .lab-hero h1 { font-size:clamp(47px,5.4vw,68px); }
  .assembly-canvas { height:460px; }
  .story { grid-template-columns:minmax(300px,.62fr) minmax(500px,1.38fr); gap:60px; }
  .config-layout { gap:45px; }
  .config-card { padding:24px 18px; }
  .case-xray { grid-template-columns:minmax(290px,.58fr) minmax(520px,1.42fr); }
}

@media (max-width: 980px) {
  .service-page { --header-height:76px; }
  .service-page .header-inner { min-height:76px; }
  .service-page .header-phone { margin-left:auto; font-size:13px; }
  .service-page .main-nav {
    position:fixed;
    z-index:105;
    top:var(--header-height);
    right:0;
    left:0;
    display:none;
    align-items:stretch;
    padding:18px;
    border-top:1px solid rgba(255,255,255,.08);
    background:rgba(7,8,11,.98);
  }
  .service-page .main-nav.is-open { display:grid; }
  .service-page .main-nav a { padding:13px 10px; border-bottom:1px solid rgba(255,255,255,.06); font-size:18px; }
  .service-page .main-nav a::after { display:none; }
  .service-page .main-nav .nav-back-mobile {
    display:flex!important;
    align-items:center;
    margin-top:8px;
    border:1px solid rgba(243,154,72,.25);
    border-radius:8px;
    background:rgba(243,154,72,.07);
    color:#f3a55e;
    font-weight:760;
  }
  .service-page .menu-toggle { display:flex; margin-left:0; }
  .lab-hero { min-height:auto; padding-top:125px; }
  .lab-hero-grid { grid-template-columns:1fr; }
  .lab-hero-copy { max-width:720px; padding-bottom:25px; }
  .assembly { width:100%; max-width:780px; margin-inline:auto; }
  .lab-hero-foot { margin-top:22px; }
  .lab-section { padding:94px 0; }
  .lab-heading { grid-template-columns:1fr; gap:24px; margin-bottom:55px; }
  .lab-heading p { max-width:670px; }
  .story { grid-template-columns:1fr; gap:35px; }
  .story-steps { display:grid; grid-template-columns:repeat(5,1fr); padding:0; border-top:1px solid rgba(255,255,255,.08); }
  .story-step { min-height:210px; grid-template-columns:1fr; align-content:start; padding:24px 15px; border-top:0; border-right:1px solid rgba(255,255,255,.08); opacity:.55; }
  .story-step:last-child { border-bottom:0; }
  .story-step.is-active { transform:translateY(-5px); }
  .story-step > span { padding:0; }
  .story-step h3 { font-size:17px; }
  .story-step p { font-size:9px; }
  .story-stage { position:relative; top:auto; }
  .diagnostic-console { grid-template-columns:1fr; }
  .diagnostic-options { display:grid; grid-template-columns:repeat(4,1fr); border-right:0; border-bottom:1px solid rgba(255,255,255,.08); }
  .diagnostic-options button { min-height:140px; grid-template-columns:1fr; padding:22px 17px; border-right:1px solid rgba(255,255,255,.075); border-bottom:0; }
  .diagnostic-options button::after { top:auto; right:0; bottom:0; width:auto; height:2px; }
  .diagnostic-options button > span { grid-row:auto; }
  .config-layout { grid-template-columns:1fr; }
  .config-summary { position:relative; top:auto; }
  .case-xray { grid-template-columns:1fr; }
  .case-xray-copy { border-right:0; border-bottom:1px solid rgba(255,255,255,.08); }
  .xray-view { min-height:500px; }
  .lab-cta-grid { grid-template-columns:1fr; gap:30px; }
  .lab-cta-contact { max-width:520px; }
}

@media (max-width: 720px) {
  .service-page .header-cta { display:none; }
  .service-page .menu-toggle { margin-left:0; }
  .lab-hero { padding:112px 0 25px; background-size:44px 44px,44px 44px,auto,auto; }
  .lab-hero::before { display:none; }
  .lab-hero-copy > p { font-size:14px; }
  .lab-hero-actions { align-items:flex-start; flex-direction:column; gap:10px; }
  .lab-hero-facts { grid-template-columns:1fr; gap:0; }
  .lab-hero-facts div,.lab-hero-facts div + div { display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-right:0; border-bottom:1px solid rgba(255,255,255,.07); }
  .lab-hero-facts div:last-child { border-bottom:0; }
  .lab-hero-facts dt { margin:0; }
  .assembly { border-radius:3px 20px 3px 20px; }
  .assembly-canvas { height:375px; }
  .assembly-object { top:42%; width:320px; height:235px; }
  .assembly-plane { inset:16px 20px; padding:14px; }
  .assembly-plane--strategy { --plane-x:-43px; --plane-y:48px; --plane-z:-90px; }
  .assembly-plane--ux { --plane-x:-22px; --plane-y:24px; --plane-z:-44px; }
  .assembly-plane--design { --plane-x:0; --plane-y:0; --plane-z:0; }
  .assembly-plane--dev { --plane-x:22px; --plane-y:-24px; --plane-z:44px; }
  .assembly-plane--growth { --plane-x:43px; --plane-y:-48px; --plane-z:90px; }
  .plane-content b { font-size:17px; }
  .assembly-readout { right:11px; bottom:10px; width:165px; }
  .assembly-controls button { min-height:60px; padding-inline:3px; font-size:6px; }
  .lab-hero-foot { grid-template-columns:1fr auto; }
  .lab-hero-foot span { display:none; }
  .lab-section { padding:76px 0; }
  .lab-section::before { left:14px; }
  .lab-heading { margin-bottom:42px; }
  .lab-heading h2 { font-size:clamp(35px,10vw,48px); }
  .story-steps { grid-template-columns:1fr; }
  .story-step { min-height:auto; grid-template-columns:35px 1fr; padding:24px 12px; border-right:0; border-bottom:1px solid rgba(255,255,255,.08); opacity:.7; }
  .story-step p { font-size:11px; }
  .story-stage-top { grid-template-columns:1fr 26px; }
  .story-stage-top b { display:none; }
  .blueprint { height:390px; }
  .blueprint-sidebar { display:none; }
  .blueprint-main { top:43px; right:19px; bottom:35px; left:19px; }
  .blueprint-hero { padding:34px 20px; }
  .blueprint-hero::after { right:17px; width:90px; height:90px; }
  .blueprint-hero b { width:66%; font-size:20px; }
  .story-caption { grid-template-columns:90px 1fr; }
  .diagnostic-options { grid-template-columns:1fr 1fr; }
  .diagnostic-options button { min-height:115px; border-bottom:1px solid rgba(255,255,255,.075); }
  .diagnostic-result { min-height:0; padding:38px 22px; }
  .diagnostic-bars > div { grid-template-columns:70px 1fr 30px; gap:9px; }
  .diagnostic-next { grid-template-columns:1fr; gap:7px; }
  .config-modules { grid-template-columns:1fr; }
  .config-card { min-height:160px; }
  .config-summary { padding-inline:20px; }
  .config-summary-top { margin-inline:-20px; }
  .case-xray-copy { padding:34px 24px; }
  .xray-view { min-height:400px; }
  .case-notes { grid-template-columns:1fr; }
  .brief-panels { min-height:0; }
  .brief-panel { padding:38px 20px; }
  .brief-answers { grid-template-columns:1fr; }
  .brief-answers button { min-height:102px; }
  .brief-summary { grid-template-columns:1fr; }
  .brief-summary div { min-height:auto; }
  .brief-contact-row { grid-template-columns:1fr; }
  .brief-actions { align-items:stretch; flex-direction:column; }
  .brief-actions .button { width:100%; }
  .lab-cta { min-height:560px; padding:85px 0 110px; }
  .lab-cta h2 { font-size:clamp(41px,13vw,66px); }
  .lab-cta-contact a { font-size:12px; }
}

@media (max-width: 520px) {
  .service-page .header-phone { display:none; }
  .service-page .menu-toggle { margin-left:auto; }
}

@media (max-width: 430px) {
  .lab-status { font-size:8px; }
  .lab-hero h1 { font-size:44px; }
  .assembly-canvas { height:330px; }
  .assembly-object { left:49%; width:285px; height:210px; }
  .assembly-plane { inset:14px 18px; }
  .assembly-coordinates { display:none; }
  .assembly-readout { width:145px; padding:10px; }
  .assembly-readout small { display:none; }
  .assembly-controls button { min-height:54px; }
  .diagnostic-options button { padding:18px 13px; }
  .diagnostic-options button b { font-size:13px; }
  .diagnostic-options button small { font-size:8px; }
  .blueprint-nav span { display:none; }
  .blueprint-hero::after { opacity:.7; }
  .blueprint-layer--ux,.blueprint-layer--dev { right:12px; width:145px; }
  .xray-view { min-height:330px; }
  .scheme-grid { min-width:360px; }
  .case-note { grid-template-columns:.85fr 1.15fr; }
  .brief-controls { padding-inline:15px; }
}

@media (prefers-reduced-motion: reduce) {
  .lab-hero-foot i::after { animation:none; }
  .assembly-object,
  .assembly-plane,
  .blueprint-layer,
  .story-step,
  .config-card,
  .case-note img { transition:none; }
  .lab-magnetic { transform:none!important; }
}

/* Dedicated composition for wide / 2K monitors */
@media (min-width: 1800px) {
  .service-page {
    --header-height: 88px;
  }

  .service-page .header-inner {
    min-height: 88px;
    gap: 30px;
  }

  .service-page .main-nav { gap: 29px; }
  .service-page .main-nav a { font-size: 15px; }
  .service-page .header-phone { font-size: 17px; }
  .service-page .header-cta { min-height: 46px; padding-inline: 19px; font-size: 13px; }
  .lab-back { gap: 10px; font-size: 11px; }
  .lab-back span { font-size: 17px; }

  .lab-hero {
    min-height: 1050px;
    padding: 166px 0 43px;
    background-size: 84px 84px, 84px 84px, auto, auto;
  }

  .lab-hero::before { top: 88px; width: 59%; }
  .lab-hero-orbit { width: 540px; height: 540px; }
  .lab-hero-orbit--violet { top: 155px; right: -245px; }
  .lab-hero-orbit--orange { bottom: -390px; left: -285px; }

  .lab-hero-grid {
    grid-template-columns: minmax(500px, .8fr) minmax(800px, 1.2fr);
    gap: 108px;
  }

  .lab-hero-copy { padding-bottom: 64px; }
  .lab-status { margin-bottom: 30px; font-size: 11px; }
  .lab-hero h1 {
    max-width: 790px;
    margin-bottom: 32px;
    font-size: 94px;
  }
  .lab-hero-copy > p { max-width: 700px; font-size: 18px; }
  .lab-hero-actions { margin-top: 34px; }
  .lab-hero-actions .button { min-height: 54px; padding-inline: 24px; font-size: 14px; }
  .lab-text-link { font-size: 13px; }
  .lab-hero-facts { margin-top: 42px; }
  .lab-hero-facts div { padding: 19px 20px; }
  .lab-hero-facts dt { font-size: 9px; }
  .lab-hero-facts dd { font-size: 15px; }

  .assembly-chrome { height: 48px; padding-inline: 21px; font-size: 9px; }
  .assembly-canvas { height: 620px; }
  .assembly-canvas::before { width: 430px; height: 430px; }
  .assembly-grid { background-size: 38px 38px; }
  .assembly-object {
    width: 535px;
    height: 382px;
  }
  .assembly-plane { inset: 24px 34px; padding: 24px; }
  .plane-code { font-size: 9px; }
  .plane-content b { font-size: 26px; }
  .plane-content small { font-size: 12px; }
  .assembly-readout { width: 240px; padding: 17px 18px; }
  .assembly-readout strong { font-size: 15px; }
  .assembly-readout small { font-size: 9px; }
  .assembly-controls button { min-height: 80px; font-size: 9px; }
  .assembly-controls button span { font-size: 8px; }
  .lab-hero-foot { margin-top: 34px; font-size: 9px; }

  .lab-section { padding: 150px 0; }
  .lab-heading {
    grid-template-columns: minmax(0, 1.28fr) minmax(390px, .52fr);
    gap: 160px;
    margin-bottom: 94px;
  }
  .lab-heading--compact { grid-template-columns: minmax(0, 1.12fr) minmax(390px, .5fr); }
  .lab-heading h2 { max-width: 1050px; font-size: 76px; }
  .lab-heading p { font-size: 16px; }
  .lab-index { margin-bottom: 22px; font-size: 10px; }

  .story {
    grid-template-columns: minmax(400px, .62fr) minmax(820px, 1.38fr);
    gap: 165px;
  }
  .story-step {
    min-height: 560px;
    grid-template-columns: 55px 1fr;
    gap: 28px;
  }
  .story-step > span { font-size: 10px; }
  .story-step small { font-size: 9px; }
  .story-step h3 { font-size: 32px; }
  .story-step p { max-width: 500px; font-size: 15px; }
  .story-stage { top: 125px; }
  .story-stage-top { height: 58px; padding-inline: 20px; font-size: 8px; }
  .blueprint { height: 570px; }
  .blueprint-main { top: 58px; right: 50px; bottom: 51px; left: 112px; }
  .blueprint-hero { min-height: 245px; padding: 47px 38px; }
  .blueprint-hero::after { width: 148px; height: 148px; }
  .blueprint-hero small { font-size: 7px; }
  .blueprint-hero b { font-size: 31px; }
  .blueprint-hero p,
  .blueprint-hero > span { font-size: 7px; }
  .blueprint-cards i { height: 72px; }
  .story-caption { min-height: 82px; grid-template-columns: 160px 1fr; padding: 16px 21px; }
  .story-caption span { font-size: 13px; }
  .story-caption p { font-size: 10px; }

  .diagnostic-console {
    grid-template-columns: minmax(430px, .68fr) minmax(760px, 1.32fr);
  }
  .diagnostic-options button {
    min-height: 135px;
    grid-template-columns: 50px 1fr;
    padding: 29px 34px;
  }
  .diagnostic-options button > span { font-size: 10px; }
  .diagnostic-options button b { font-size: 19px; }
  .diagnostic-options button small { font-size: 11px; }
  .diagnostic-result { min-height: 540px; padding: 62px 86px; }
  .diagnostic-result-head { font-size: 9px; }
  .diagnostic-result > strong { max-width: 720px; font-size: 50px; }
  .diagnostic-result > p { max-width: 710px; font-size: 14px; }
  .diagnostic-bars { gap: 16px; }
  .diagnostic-bars > div { grid-template-columns: 105px 1fr 45px; font-size: 9px; }
  .diagnostic-next { grid-template-columns: 96px 1fr; }
  .diagnostic-next span { font-size: 9px; }
  .diagnostic-next b { font-size: 13px; }

  .config-layout {
    grid-template-columns: minmax(0, 1.38fr) minmax(430px, .62fr);
    gap: 125px;
  }
  .config-section-label { min-height: 54px; padding-inline: 22px; font-size: 9px; }
  .config-card {
    min-height: 210px;
    grid-template-columns: 48px 1fr;
    gap: 0 18px;
    padding: 32px 29px 27px;
  }
  .config-icon { width: 48px; height: 48px; font-size: 14px; }
  .config-card > b { font-size: 16px; }
  .config-card > small { font-size: 10px; }
  .config-card > em { font-size: 10px; }
  .config-summary { top: 125px; padding: 0 34px 34px; }
  .config-summary-top { height: 58px; margin-right: -34px; margin-left: -34px; font-size: 8px; }
  .config-summary h3 { font-size: 29px; }
  .config-summary ul { min-height: 170px; }
  .config-summary li { padding-block: 8px; font-size: 10px; }
  .config-total b { font-size: 22px; }
  .config-time b { font-size: 13px; }
  .config-summary > p { font-size: 8px; }

  .case-xray {
    grid-template-columns: minmax(390px, .58fr) minmax(820px, 1.42fr);
  }
  .case-xray-copy { padding: 78px; }
  .case-xray-number { font-size: 9px; }
  .case-xray-tags span { font-size: 8px; }
  .case-xray-copy h3 { font-size: 43px; }
  .case-xray-copy > p { font-size: 13px; }
  .case-xray-copy dt { font-size: 8px; }
  .case-xray-copy dd { font-size: 11px; }
  .xray-view { min-height: 640px; }
  .scheme-nav { width: 520px; }
  .scheme-title { width: 360px; height: 120px; }
  .scheme-grid { min-width: 650px; }
  .scheme-grid i { height: 118px; }
  .case-notes { gap: 22px; margin-top: 22px; }
  .case-note,
  .case-note > div { min-height: 290px; }
  .case-note h3 { padding: 34px 33px 12px; font-size: 25px; }
  .case-note p { padding-inline: 33px; font-size: 11px; }
  .case-note > b { padding: 0 33px 30px; font-size: 8px; }

  .antibrief-progress { height: 62px; }
  .brief-panels { min-height: 630px; }
  .brief-panel { padding: 72px 112px 62px; }
  .brief-question-index { font-size: 10px; }
  .brief-panel h3 { max-width: 940px; font-size: 56px; }
  .brief-panel > p { font-size: 14px; }
  .brief-answers button {
    min-height: 138px;
    grid-template-columns: 49px 1fr;
    gap: 18px;
    padding: 28px 31px;
  }
  .brief-answers button > i { width: 46px; height: 46px; font-size: 10px; }
  .brief-answers b { font-size: 16px; }
  .brief-answers small { font-size: 10px; }
  .brief-summary div { min-height: 125px; padding: 25px; }
  .brief-summary span { font-size: 8px; }
  .brief-summary b { font-size: 13px; }
  .brief-contact-row input { height: 54px; }

  .lab-cta {
    min-height: 730px;
    padding: 148px 0 170px;
  }
  .lab-cta-grid {
    grid-template-columns: minmax(0, 1.24fr) minmax(410px, .5fr);
    gap: 190px;
  }
  .lab-cta h2 { font-size: 98px; }
  .lab-cta-contact { padding-top: 42px; }
  .lab-cta-contact p { font-size: 15px; }
  .lab-cta-contact a { padding-block: 19px; font-size: 16px; }
}