/* SERVICES 01 · Reuse the approved Consumer Insights AURA project and
   browser / white foreground-panel treatment (2026-10-22).
   The existing square frame, gradient and shared page grid remain the owners
   of outer geometry. Only the illustration responds to its own container. */
body[data-responsive-page="solution-global-site"] #services .svq__fig {
  container-type:inline-size;
  container-name:global-site-artwork;
}
.svq__fig .gs-diagnostic {
  pointer-events:none;
  visibility:hidden;
  transition:opacity .45s var(--wy-ease),transform .45s var(--wy-ease),visibility 0s .45s;
}
.svq__fig .gs-diagnostic.is-on { visibility:visible;transition-delay:0s; }
.gs-diagnostic .gsd-scene {
  --gsd-micro:min(1.5625cqw,var(--wy-fs-micro));
  --gsd-small:min(1.8029cqw,var(--wy-fs-small));
  --gsd-body:min(2.0433cqw,var(--wy-fs-body));
  --gsd-title:min(2.8846cqw,var(--wy-fs-h3));
  --gsd-pad:min(2.8846cqw,var(--wy-s5));
  position:absolute;
  inset:0;
  color:var(--wy-g700);
  font-family:var(--wy-font-cn);
  line-height:1.4;
  letter-spacing:normal;
}
.gs-diagnostic .gsd-scene *,
.gs-diagnostic .gsd-scene *::before,
.gs-diagnostic .gsd-scene *::after { box-sizing:border-box; }
.gs-diagnostic .gsd-browser {
  position:absolute;
  inset-inline-start:5.7692%;
  inset-block-start:7.6923%;
  inline-size:84.6154%;
  aspect-ratio:3 / 2;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--wy-blue-light) 32%,var(--wy-g100));
  border-radius:min(1.4423cqw,var(--wy-r-card));
  background:var(--wy-g0);
  box-shadow:0 8px 24px -12px color-mix(in srgb,var(--wy-blue-dark) 14%,transparent);
}
.gs-diagnostic .gsd-browser img {
  display:block;
  inline-size:100%;
  block-size:100%;
  max-inline-size:none;
  border-radius:0;
  object-fit:cover;
}
.gs-diagnostic .gsd-panel {
  position:absolute;
  inset-inline-start:24.0385%;
  inset-block-start:56.7308%;
  inline-size:70.1923%;
  padding:var(--gsd-pad);
  border:1px solid color-mix(in srgb,var(--wy-primary-light) 26%,var(--wy-g100));
  border-radius:min(1.9231cqw,var(--wy-r-lg));
  background:var(--wy-g0);
  box-shadow:0 12px 32px -12px color-mix(in srgb,var(--wy-blue-dark) 12%,transparent),0 2px 6px color-mix(in srgb,var(--wy-ink) 3%,transparent);
}
.gs-diagnostic .gsd-heading {
  display:flex;
  align-items:center;
  gap:min(1.4423cqw,var(--wy-s3));
}
.gs-diagnostic .gsd-heading-icon {
  display:grid;
  place-items:center;
  flex:none;
  inline-size:min(4.8077cqw,40px);
  block-size:min(4.8077cqw,40px);
  border-radius:min(.9615cqw,var(--wy-r-btn));
  color:var(--wy-primary);
  background:var(--wy-primary-subtle);
}
.gs-diagnostic .gsd-icon {
  display:block;
  flex:none;
  inline-size:min(2.4038cqw,20px);
  block-size:min(2.4038cqw,20px);
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.gs-diagnostic .gsd-title {
  color:var(--wy-ink);
  font-size:var(--gsd-title);
  font-weight:500;
  line-height:1.4;
  letter-spacing:normal;
  white-space:nowrap;
}
.gs-diagnostic .gsd-journey {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:min(1.2019cqw,10px);
  margin-block-start:min(2.8846cqw,var(--wy-s5));
}
.gs-diagnostic .gsd-step {
  display:grid;
  justify-items:center;
  gap:min(.4808cqw,var(--wy-s1));
  padding:min(1.4423cqw,var(--wy-s3)) min(.4808cqw,var(--wy-s1));
  border:1px solid var(--wy-g50);
  border-radius:min(.9615cqw,var(--wy-r-btn));
  background:var(--wy-g25);
  font-size:var(--gsd-small);
  white-space:nowrap;
}
.gs-diagnostic .gsd-step--focus { color:var(--wy-primary);border-color:var(--wy-primary-light);background:var(--wy-primary-subtle); }
.gs-diagnostic .gsd-step-number { color:var(--wy-g400);font-size:var(--gsd-micro);font-family:var(--wy-font-en);line-height:1; }
.gs-diagnostic .gsd-step--focus .gsd-step-number { color:var(--wy-primary); }
.gs-diagnostic .gsd-arrow { inline-size:min(1.9231cqw,var(--wy-s4));block-size:min(1.9231cqw,var(--wy-s4));color:var(--wy-g300); }
.gs-diagnostic .gsd-findings { display:grid;gap:min(1.4423cqw,var(--wy-s3));margin:min(2.4038cqw,20px) 0 0;padding:0; }
.gs-diagnostic .gsd-finding {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:min(1.4423cqw,var(--wy-s3));
  padding-block-start:min(1.4423cqw,var(--wy-s3));
}
.gs-diagnostic .gsd-finding dt { display:flex;align-items:center;gap:min(.9615cqw,var(--wy-s2));font-size:var(--gsd-body);white-space:nowrap; }
.gs-diagnostic .gsd-finding dt .gsd-icon { inline-size:min(1.9231cqw,var(--wy-s4));block-size:min(1.9231cqw,var(--wy-s4));color:var(--wy-primary); }
.gs-diagnostic .gsd-finding dd { margin:0;color:var(--wy-g500);font-size:var(--gsd-small);white-space:nowrap; }

/* Same 600px artwork capacity used by Consumer Insights. The foreground
   widens as the frame narrows; external service copy retains shared type. */
@container global-site-artwork (max-width:600px) {
  .gs-diagnostic .gsd-scene {
    --gsd-micro:clamp(9px,1.8cqw,12px);
    --gsd-small:clamp(10px,2.2cqw,14px);
    --gsd-body:clamp(11px,2.5cqw,15px);
    --gsd-title:clamp(13px,3cqw,18px);
    --gsd-pad:3cqw;
  }
  .gs-diagnostic .gsd-browser { inset-inline-start:5%;inset-block-start:6%;inline-size:90%;border-radius:2cqw; }
  .gs-diagnostic .gsd-panel { inset-inline-start:12%;inset-block-start:auto;inset-block-end:5%;inline-size:83%;border-radius:2.5cqw; }
  .gs-diagnostic .gsd-heading { gap:2cqw; }
  .gs-diagnostic .gsd-heading-icon { inline-size:6cqw;block-size:6cqw;border-radius:1.5cqw; }
  .gs-diagnostic .gsd-heading-icon .gsd-icon { inline-size:3.5cqw;block-size:3.5cqw; }
  .gs-diagnostic .gsd-journey { gap:1.5cqw;margin-block-start:3cqw; }
  .gs-diagnostic .gsd-step { padding:2cqw 1cqw;gap:1cqw;border-radius:1.5cqw; }
  .gs-diagnostic .gsd-arrow { inline-size:2.5cqw;block-size:2.5cqw; }
  .gs-diagnostic .gsd-findings { margin-block-start:2.5cqw;gap:2cqw; }
  .gs-diagnostic .gsd-finding { padding-block-start:2cqw;gap:2cqw; }
  .gs-diagnostic .gsd-finding dt { gap:1cqw; }
  .gs-diagnostic .gsd-finding dt .gsd-icon { inline-size:3cqw;block-size:3cqw; }
}
@media (prefers-reduced-motion:reduce) {
  #services .svq__fig .svx { transition:none;transform:none; }
}