/* Feature 02 extends the verified Feature 01 figure / scene / panel / header
   classes. Background, tokens, shadows and the outer 16:10 media stay shared.
   Every override below is scoped to this illustration. */
.ctg-figure .ctg-workspace { left:3.8462%;top:10.7692%;width:65.8654%;height:78.4615%; }
.ctg-figure .ctg-workspace-header { justify-content:space-between; }
.ctg-figure .ctg-heading { display:flex;align-items:center;gap:min(1.2019cqw,10px);min-width:0; }
.ctg-figure .ctg-new-tag { display:flex;align-items:center;gap:min(.7212cqw,6px);flex:none;padding:min(.6009cqw,5px) min(1.2019cqw,10px);border:1px solid var(--wy-g100);border-radius:var(--wy-r-sm);font-size:var(--gcp-micro);line-height:1.4;color:var(--wy-g600);background:var(--wy-g10);white-space:nowrap; }
.ctg-figure .ctg-new-tag svg { width:min(1.4423cqw,var(--wy-s3));height:min(1.4423cqw,var(--wy-s3));stroke:currentColor;stroke-width:1.5;stroke-linecap:round; }
.ctg-figure .ctg-workspace-body { justify-content:space-between;gap:min(1.9231cqw,var(--wy-s4));padding-right:calc(var(--gcp-pad) + 1.9231cqw); }
.ctg-figure .ctg-category { min-width:0; }
.ctg-figure .ctg-category-heading { display:flex;align-items:center;gap:min(.9615cqw,var(--wy-s2)); }
.ctg-figure .ctg-category-icon { flex:none;width:min(2.1635cqw,18px);height:min(2.1635cqw,18px);stroke:var(--wy-g500);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round; }
.ctg-figure .ctg-category-name { font-size:var(--gcp-small);line-height:1.4;font-weight:500;color:var(--wy-g700); }
.ctg-figure .ctg-chips { display:flex;flex-wrap:wrap;gap:min(.9615cqw,var(--wy-s2));list-style:none;margin:min(.9615cqw,var(--wy-s2)) 0 0;padding:0; }
.ctg-figure .ctg-chip { display:block;max-width:100%;padding:min(.4808cqw,var(--wy-s1)) min(.9615cqw,var(--wy-s2));border:1px solid color-mix(in srgb,var(--wy-g100) 36%,transparent);border-radius:var(--wy-r-sm);font-size:var(--gcp-micro);line-height:1.4;font-weight:400;color:var(--wy-g700);white-space:nowrap;background:var(--ctg-chip-fill); }
.ctg-figure :is(.ctg-category--identity,.ctg-chip--identity) { --ctg-chip-fill:color-mix(in srgb,var(--wy-blue-subtle) 45%,var(--wy-g25)); }
.ctg-figure :is(.ctg-category--intent,.ctg-chip--intent) { --ctg-chip-fill:color-mix(in srgb,var(--wy-primary-subtle) 70%,var(--wy-g0)); }
.ctg-figure :is(.ctg-category--behavior,.ctg-chip--behavior) { --ctg-chip-fill:color-mix(in srgb,var(--wy-blue-subtle) 80%,var(--wy-g0)); }
.ctg-figure .ctg-category--lifecycle { --ctg-chip-fill:color-mix(in srgb,var(--wy-primary-subtle) 40%,var(--wy-g25)); }
.ctg-figure .ctg-chip--applied { border-color:color-mix(in srgb,var(--wy-blue-light) 48%,var(--wy-g100)); }
.ctg-figure .ctg-category--intent .ctg-chip--applied { border-color:color-mix(in srgb,var(--wy-primary-light) 48%,var(--wy-g100)); }
.ctg-figure .ctg-segment { left:67.3077%;top:27.6923%;width:28.8462%;height:61.5385%;z-index:1;background:color-mix(in srgb,var(--wy-g0) 90%,var(--wy-g25)); }
.ctg-figure .ctg-segment-header { gap:min(.9615cqw,var(--wy-s2));padding:min(1.9231cqw,var(--wy-s4)); }
.ctg-figure .ctg-segment-header .gcp-title { font-size:var(--gcp-small); }
.ctg-figure .ctg-segment-header .gcp-profile-icon { width:min(2.1635cqw,18px);height:min(2.1635cqw,18px); }
.ctg-figure .ctg-segment-body { flex:1;min-height:0;display:flex;flex-direction:column;align-items:flex-start;padding:min(1.9231cqw,var(--wy-s4)); }
.ctg-figure .ctg-segment-name { font-size:var(--gcp-small);line-height:1.4;font-weight:500;color:var(--wy-g800); }
.ctg-figure .ctg-applied-label { margin-top:min(1.4423cqw,var(--wy-s3));font-size:var(--gcp-micro);line-height:1.4;color:var(--wy-g500); }
.ctg-figure .ctg-segment-tags { width:100%;flex-direction:column;align-items:flex-start;gap:min(.7212cqw,6px); }
.ctg-figure .ctg-segment-total { display:grid;gap:min(.4808cqw,var(--wy-s1));margin-top:auto;padding-top:min(1.9231cqw,var(--wy-s4)); }
.ctg-figure .ctg-count { font-size:min(3.8462cqw,var(--wy-fs-h2));line-height:1.1;letter-spacing:var(--wy-ls-num);font-weight:500;font-variant-numeric:tabular-nums;color:var(--wy-g800); }
.ctg-figure .ctg-customers { font-size:var(--gcp-micro);line-height:1.4;color:var(--wy-g500); }

/* Follow Feature 01's compact media rule. Retain left/right card hierarchy;
   remove tertiary examples before reducing the verified typography floor. */
@container gcp-artwork (max-width:600px) {
  .ctg-figure .ctg-workspace { left:3.5088%;top:5.5%;width:65.5%;height:87%; }
  .ctg-figure .ctg-workspace-header { padding:1.75cqw 2cqw;gap:1cqw; }
  .ctg-figure .ctg-workspace-header .gcp-title { font-size:var(--gcp-body); }
  .ctg-figure .ctg-heading { gap:1cqw; }
  .ctg-figure .ctg-heading .gcp-profile-icon { width:3cqw;height:3cqw; }
  .ctg-figure .ctg-new-tag { padding:.3cqw .8cqw;gap:.5cqw;border-radius:.8cqw;line-height:1.2; }
  .ctg-figure .ctg-new-tag svg { width:2cqw;height:2cqw; }
  .ctg-figure .ctg-workspace-body { padding:2cqw 4cqw 2cqw 2cqw;gap:1cqw; }
  .ctg-figure .ctg-category-heading { gap:1cqw; }
  .ctg-figure .ctg-category-icon { width:3cqw;height:3cqw; }
  .ctg-figure .ctg-category-name { font-size:var(--gcp-small);line-height:1.2; }
  .ctg-figure .ctg-chips { margin-top:.6cqw;gap:.8cqw; }
  .ctg-figure .ctg-chip { padding:.3cqw .8cqw;line-height:1.2;border-radius:.8cqw; }
  .ctg-figure .ctg-chip--optional { display:none; }
  .ctg-figure .ctg-segment { left:66%;top:12%;width:31%;height:81%; }
  .ctg-figure .ctg-segment-header { padding:1cqw 1.75cqw;gap:0; }
  .ctg-figure .ctg-segment-header .gcp-profile-icon { display:none; }
  .ctg-figure .ctg-segment-header .gcp-title { font-size:var(--gcp-micro); }
  .ctg-figure .ctg-segment-body { padding:1.75cqw; }
  .ctg-figure .ctg-segment-name { font-size:var(--gcp-small);line-height:1.15; }
  .ctg-figure .ctg-applied-label { display:none; }
  .ctg-figure .ctg-segment-tags { gap:.8cqw;margin-top:1.5cqw; }
  .ctg-figure .ctg-segment-tags .ctg-chip { white-space:normal;line-height:1.15;padding:.3cqw .6cqw; }
  .ctg-figure .ctg-segment-total { gap:.5cqw;padding-top:1cqw; }
  .ctg-figure .ctg-count { font-size:clamp(17px,5.8479cqw,28px); }
  .ctg-figure .ctg-customers { line-height:1.2; }
}
@container gcp-artwork (max-width:340px) {
  .ctg-figure .ctg-workspace-header { padding-block:1.25cqw; }
  .ctg-figure .ctg-workspace-body { padding-block:1.5cqw;gap:.5cqw; }
  .ctg-figure .ctg-chip--compact-optional { display:none; }
  .ctg-figure .ctg-segment { top:10%;height:83%; }
  .ctg-figure .ctg-segment-header { padding-block:.8cqw; }
  .ctg-figure .ctg-segment-tags { margin-top:1cqw;gap:.5cqw; }
}
