/* ══════════════════════════════
   SLIDE 04 — PROBLEM ("crushing logos" graph)
══════════════════════════════ */
.s4-graph-layout{
  width:100%;
  height:100%;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:clamp(8px,1.6vh,18px);
  padding:var(--pill-reserve) clamp(24px,3.5vw,56px) clamp(16px,2.4vh,28px) 80px;
  background:var(--deck-navy);
}
.s4-graph-stage{
  position:relative;
  flex:1;
  width:100%;
  min-height:0;
}
.s4-graph-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.s4-graph-note{
  position:absolute;
  top:2px;
  left:50%;
  transform:translateX(-50%);
  z-index:2;
  max-width:calc(100% - 12px);
  text-align:center;
  line-height:1.35;
  font-size:clamp(15px,1.8vw,26px);
  font-weight:600;
  color:rgba(255,255,255,0.82);
  text-shadow:0 2px 14px rgba(0,0,0,0.6);
  pointer-events:none;
}
.s4-graph-note span{ color:#bbbbff; }
/* Retired hero figure (man-with-watches) reused as a faded bottom-right corner mark on the graph. */
.s4-graph-figure{
  position:absolute;
  right:0;
  bottom:0;
  z-index:1;
  height:34%;
  width:auto;
  max-width:42%;
  opacity:0.7;
  object-fit:contain;
  object-position:bottom right;
  pointer-events:none;
}
.s4-graph-sr{
  position:absolute;
  width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
body.deck-mobile .s4-graph-layout{ padding:var(--pill-reserve) 14px 14px; }
body.deck-mobile .s4-graph-note{ font-size:clamp(12px,3.4vw,17px); }
body.deck-mobile .s4-graph-figure{ height:24%; max-width:44%; }
