/* Shared company ergonomics; each artifact keeps its own visual identity.
   The extra class scopes these rules above the embedded artifact styles. */
.caseart.case-page {
  --canvas:var(--white); --card:var(--white); --ink:inherit;
  --muted:inherit; --subtle:inherit; --line:var(--rule);
  --box:var(--subtle); --chip-bg:var(--subtle);
  margin-block:0; padding:42px 0 32px; overflow-wrap:anywhere;
  border-bottom:1px solid var(--rule-strong);
  background:var(--white); color:var(--ink); font-family:inherit;
}
.caseart.case-page .wrap { max-width:none; }
.caseart.case-page .case-context {
  display:inline-flex; align-items:center; gap:8px; min-height:44px;
  margin-bottom:24px; color:var(--blue); font-size:.8125rem;
  font-weight:700; letter-spacing:.13em; text-transform:uppercase;
}
.caseart.case-page .wrap>header { text-align:left; margin-bottom:40px; }
.caseart.case-page h1 {
  font-family:'Space Grotesk',sans-serif; font-weight:500;
  font-size:clamp(2.8rem,6vw,5.4rem); line-height:1.08;
  letter-spacing:-.065em; max-width:20ch; text-wrap:initial;
}
.caseart.case-page .lede,.caseart.case-page .sub {
  margin-top:24px; max-width:64ch; font-size:1.1rem; line-height:1.6;
}
.caseart.case-page .stats {
  padding-block:24px; border-block:1px solid var(--rule); gap:24px;
}
.caseart.case-page .stat { background:none; border:0; border-radius:0; }
.caseart.case-page .wordmark a {
  display:inline-block; min-height:44px; padding-block:10px;
}
.caseart.case-page .wordmark .dot {
  background:none; color:var(--green); -webkit-text-fill-color:currentColor;
}
.caseart.case-page .casenav {
  border-top:1px solid var(--rule); padding-top:32px; text-align:left;
}
.caseart.case-page .casenav .row { justify-content:flex-start; }
.caseart.case-page .case-credits {
  margin-top:24px; color:var(--muted); font-size:.8125rem;
  line-height:1.6; max-width:75ch;
}
.caseart.case-page .case-credits p+p { margin-top:8px; }
.caseart.case-page .case-credits .serif { color:var(--ink); }
.caseart.case-page .case-credits a,.caseart.case-page .casenav .home a {
  color:inherit; text-decoration:underline; text-underline-offset:4px;
  text-decoration-color:var(--rule-strong);
}
.caseart.case-page .case-credits a:hover,.caseart.case-page .case-credits a:focus-visible,
.caseart.case-page .casenav .home a:hover,
.caseart.case-page .casenav .home a:focus-visible,
.caseart.case-page .casenav a.lnk:hover,
.caseart.case-page .casenav a.lnk:focus-visible {
  color:var(--blue); text-decoration-color:currentColor;
}
.caseart.case-page .casenav a.lnk { border-color:var(--rule); }
.caseart.case-page .casenav .home { color:var(--muted); }
.caseart.case-page .button {
  color:var(--white); border-radius:0; text-decoration:none;
}
.caseart.case-page .layer.private,
.caseart.case-page .layer.private .tag,.caseart.case-page .zone {
  border-color:var(--rule-strong);
}

.caseart.case-page :focus-visible {
  outline:3px solid #2E3740; outline-offset:4px;
}
.caseart.case-page .casenav a,
.caseart.case-page button,
.caseart.case-page .bhead a {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; min-width:44px; max-width:100%; padding-block:10px;
}
.caseart.case-page .casenav .home { opacity:1; }
.caseart.case-page .casenav a.lnk { text-underline-offset:4px; }
.caseart.case-page .flowlink { text-align:left; }
.caseart.case-page .nodes {
  grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));
}
.caseart.case-page .prods { grid-template-columns:repeat(2,minmax(0,1fr)); }
.caseart.case-page .fan { grid-template-columns:repeat(3,minmax(0,1fr)); }
.caseart.case-page .node,.caseart.case-page .prod,
.caseart.case-page .card,.caseart.case-page .stat { min-width:0; }
.caseart.case-page .layer .tag { float:none; display:table; margin:0 0 12px; }
.caseart.case-page .layer.vault .tag { color:#006B5D; }
.caseart.case-page .flow b { color:#9A4700; }
.caseart.case-page .flow b span { color:inherit !important; }
.caseart.case-page .clabel i {
  background:none; color:#006B5D; -webkit-text-fill-color:currentColor;
}
.caseart.case-page .parallel .ulabel {
  position:static; margin-bottom:12px;
}
.caseart.case-page .cloudzone>.zlabel2 {
  position:static; display:block; margin:0 12px 16px;
}
.caseart.case-page .ys,.caseart.case-page .yv { color:#0E7C66; }
.caseart.case-page dialog.balloon {
  position:fixed; inset:0; margin:auto; padding:0;
  width:min(56rem,calc(100% - 32px)); max-width:none;
  max-height:calc(100dvh - 32px); color:var(--ink); overflow:auto;
}
.caseart.case-page dialog.balloon[open] { display:block; }
.caseart.case-page dialog.balloon::before { display:none; }
.caseart.case-page dialog.balloon::backdrop { background:rgb(22 36 47 / .55); }
.caseart.case-page .balloon .bhead { flex-wrap:wrap; }
.caseart.case-page .balloon .bhead b { flex:1 1 100%; }
.caseart.case-page .balloon pre {
  max-width:100%; max-height:60dvh; overflow:auto;
}
@media(max-width:680px) {
  .caseart.case-page .prods,.caseart.case-page .fan { grid-template-columns:1fr; }
}
@media(max-width:480px) {
  .caseart.case-page { padding:32px 0; }
  .caseart.case-page .cloud { padding:24px 10px 10px; }
  .caseart.case-page .layer { padding:16px 12px; }
  .caseart.case-page .hop { padding-left:28px; }
  .caseart.case-page .hop .blk { left:0; width:16px; height:16px; }
  .caseart.case-page .card { padding:16px 12px; }
  .caseart.case-page .parallel { margin-inline:28px 0; }
  .caseart.case-page .fan .card { padding-left:32px; }
  .caseart.case-page .fan .card::before { left:10px; }
  .caseart.case-page .casenav .row { gap:12px; }
}