/* ==========================================================
   Clinical case study · instrument-panel language.
   Deliberately different from the infrastructure page:
   centred heads, alternating pale bands, live dashboard cards,
   one deep-navy "boundaries" section. One brand blue (#3c5eb4);
   red/amber/green appear only as clinical severity, never as brand.
   ========================================================== */
.case-clinical{
  --cl-blue:#3c5eb4; --cl-deep:#2c4a94; --cl-soft:#8aa2dc;
  --cl-ink:#0f1d40;  --cl-copy:#44547a; --cl-mute:#5c6c93;
  --cl-line:#dde5f4; --cl-line-2:#e9effa;
  --cl-field:#f5f8fd;--cl-field-2:#edf2fc;
  --cl-navy:#101f45;
  --cl-hi:#b03a31; --cl-hi-bg:#fdeeec; --cl-hi-ln:#f3cec9;
  --cl-me:#8a5f0c; --cl-me-bg:#fdf5e4; --cl-me-ln:#f0dfba;
  --cl-lo:#0c7a58; --cl-lo-bg:#e6f5ef; --cl-lo-ln:#c3e5d7;
  --cl-r:15px;
  color:var(--cl-copy);
}
.case-clinical main{font-size:15px;line-height:1.6;overflow:clip}
.case-clinical main svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

.case-clinical .cl-wrap{width:min(1220px,calc(100% - clamp(32px,7vw,80px)));margin-inline:auto}
.case-clinical .cl-sec{padding:clamp(50px,6vw,86px) 0}
.case-clinical .cl-band{
  padding:clamp(50px,6vw,86px) 0;
  background:var(--cl-field);
  box-shadow:inset 0 1px 0 var(--cl-line-2),inset 0 -1px 0 var(--cl-line-2);
}
.case-clinical .cl-band--deep{background:linear-gradient(180deg,var(--cl-field-2),var(--cl-field) 62%)}

/* ---------- section heads (centred · the page's spine) ---------- */
.case-clinical .cl-head{max-width:750px;margin:0 auto clamp(26px,3.4vw,42px);text-align:center}
.case-clinical .cl-eyebrow{
  display:inline-flex;align-items:center;gap:7px;margin-bottom:15px;
  padding:5px 12px 5px 11px;border-radius:999px;
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line),0 2px 6px rgba(30,60,130,.05);
  font-size:10.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--cl-blue);
}
.case-clinical .cl-eyebrow::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--cl-blue)}
.case-clinical .cl-eyebrow--on{background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);color:#bcd0f6}
.case-clinical .cl-eyebrow--on::before{background:#7fd7b4}
.case-clinical .cl-head h2{font-size:clamp(1.55rem,1.05rem + 1.7vw,2.3rem);line-height:1.1;letter-spacing:-.038em;color:var(--cl-ink)}
.case-clinical .cl-head p{margin-top:15px;font-size:15.5px;line-height:1.66;color:var(--cl-copy)}
.case-clinical .cl-head p b{color:var(--cl-ink);font-weight:700}
.case-clinical .cl-note{
  max-width:74ch;margin:clamp(22px,2.6vw,32px) auto 0;padding-left:16px;
  border-left:2px solid var(--cl-line);
  font-size:13.6px;line-height:1.62;color:var(--cl-mute);text-align:left;
}
.case-clinical .cl-two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.6vw,40px);max-width:960px;margin:0 auto}
.case-clinical .cl-two p{font-size:14.6px;line-height:1.68}
.case-clinical .cl-two b{color:var(--cl-ink);font-weight:700}
.case-clinical .cl-two--tight{margin-top:clamp(26px,3vw,38px)}

/* ═══════════════ HERO ═══════════════ */
.case-clinical .cl-hero{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);
  gap:clamp(26px,3.4vw,54px);align-items:center;
  padding:clamp(24px,3vw,42px) 0 clamp(38px,4.4vw,60px);
  position:relative;
}
.case-clinical .cl-hero::after{
  content:"";position:absolute;z-index:-1;inset:-40px -50vw 20px auto;width:150vw;height:calc(100% + 60px);
  pointer-events:none;opacity:.72;
  background:
    radial-gradient(760px 380px at 78% 34%,rgba(88,128,220,.15),transparent 62%),
    radial-gradient(520px 300px at 8% 12%,rgba(60,94,180,.07),transparent 66%);
}
.case-clinical .cl-hero .cs-back{margin-bottom:20px;font-size:12.5px;color:#5c6e98}
.case-clinical .cl-hero .cs-back svg{width:12px;height:12px}
.case-clinical .cl-hero h1{
  margin:14px 0 15px;font-size:clamp(2rem,1.15rem + 2.7vw,3.1rem);
  line-height:1.06;letter-spacing:-.044em;color:var(--cl-ink);
}
.case-clinical .cl-hero .lead{max-width:50ch;font-size:15.6px;line-height:1.65;color:#26386a}
.case-clinical .cl-hero .lead b{color:var(--cl-ink);font-weight:700}
.case-clinical .cl-hero-cta{display:flex;flex-wrap:wrap;gap:11px;margin-top:24px}
.case-clinical .btn svg{width:15px;height:15px;stroke-width:2.3}
.case-clinical .cl-btn-ghost{
  background:#fff;color:var(--cl-deep);
  box-shadow:inset 0 0 0 1.5px var(--cl-line),0 2px 8px rgba(30,60,130,.05);
  transition:box-shadow .32s var(--ease),transform .32s var(--ease),color .32s var(--ease);
}
.case-clinical .cl-btn-ghost:hover{
  transform:translateY(-2px);color:var(--cl-blue);
  box-shadow:inset 0 0 0 1.5px var(--cl-soft),0 10px 22px rgba(30,60,130,.11);
}
.case-clinical .cl-facts{display:flex;flex-wrap:wrap;gap:10px 30px;margin-top:28px;padding-top:20px;box-shadow:inset 0 1px 0 var(--cl-line-2)}
.case-clinical .cl-facts li{display:flex;align-items:baseline;gap:9px}
.case-clinical .cl-facts b{font-size:21px;font-weight:800;letter-spacing:-.03em;color:var(--cl-blue)}
.case-clinical .cl-facts span{font-size:12.2px;font-weight:600;line-height:1.34;color:var(--cl-mute);max-width:14ch}

/* ═══════════════ THE LIVE MONITOR ═══════════════ */
.case-clinical .cl-mon{
  border-radius:19px;overflow:hidden;background:#fff;
  box-shadow:0 22px 54px rgba(23,52,120,.15),0 3px 10px rgba(23,52,120,.06),inset 0 0 0 1px var(--cl-line);
}
.case-clinical .cl-mon-bar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 15px;background:linear-gradient(97deg,#22376f,#2f4f9d 56%,#3c5eb4);
}
.case-clinical .cl-live{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:700;letter-spacing:.05em;color:#fff}
.case-clinical .cl-live i{width:7px;height:7px;border-radius:50%;background:#7fe0b4;box-shadow:0 0 0 0 rgba(127,224,180,.7)}
.case-clinical .cl-mon.is-live .cl-live i{animation:cl-pulse 2s infinite}
@keyframes cl-pulse{0%{box-shadow:0 0 0 0 rgba(127,224,180,.65)}70%{box-shadow:0 0 0 8px rgba(127,224,180,0)}100%{box-shadow:0 0 0 0 rgba(127,224,180,0)}}
.case-clinical .cl-study{
  display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:8px;
  background:rgba(255,255,255,.14);font-size:11px;font-weight:700;letter-spacing:.04em;color:#fff;
}
.case-clinical .cl-study svg{width:13px;height:13px;stroke-width:1.9}
.case-clinical .cl-simnote{
  display:flex;align-items:center;gap:7px;padding:7px 15px;
  background:var(--cl-me-bg);box-shadow:inset 0 -1px 0 var(--cl-me-ln);
  font-size:11px;font-weight:700;letter-spacing:.02em;color:#8a5f0c;
}
.case-clinical .cl-simnote svg{width:13px;height:13px;flex:none;stroke-width:1.9}

.case-clinical .cl-mon-body{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--cl-line-2);padding:1px}
.case-clinical .cl-card{background:#fff;padding:13px 14px 14px}
.case-clinical .cl-card h3{
  display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:11px;
  font-size:10.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--cl-ink);
}
.case-clinical .cl-card h3 span{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:none;color:var(--cl-mute)}
.case-clinical .cl-sig,.case-clinical .cl-feed{grid-column:span 1}

.case-clinical .cl-sig-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.case-clinical .cl-sig-row li{
  display:flex;flex-direction:column;gap:2px;padding:9px 10px;border-radius:10px;
  background:var(--cl-field);box-shadow:inset 0 0 0 1px var(--cl-line-2);
}
.case-clinical .cl-sig-row b{font-size:22px;font-weight:800;letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums}
.case-clinical .cl-sig-row span{font-size:10.5px;font-weight:700;color:var(--cl-mute)}
.case-clinical .cl-sig-row .s-hi{background:var(--cl-hi-bg);box-shadow:inset 0 0 0 1px var(--cl-hi-ln)}
.case-clinical .cl-sig-row .s-hi b{color:var(--cl-hi)}
.case-clinical .cl-sig-row .s-me{background:var(--cl-me-bg);box-shadow:inset 0 0 0 1px var(--cl-me-ln)}
.case-clinical .cl-sig-row .s-me b{color:var(--cl-me)}
.case-clinical .cl-sig-row .s-lo{background:var(--cl-lo-bg);box-shadow:inset 0 0 0 1px var(--cl-lo-ln)}
.case-clinical .cl-sig-row .s-lo b{color:var(--cl-lo)}

.case-clinical .cl-team{grid-row:span 2}
.case-clinical .cl-ring{width:100%;height:auto;max-height:186px;display:block;margin:2px auto 0}
.case-clinical .cl-ring .rays line{stroke:var(--cl-line);stroke-width:1.2}
.case-clinical .cl-ring .hub circle{fill:var(--cl-blue);stroke:none}
.case-clinical .cl-ring .hub use{color:#fff;stroke-width:1.5}
.case-clinical .cl-ring .nd circle{fill:#fff;stroke:var(--cl-line);stroke-width:1.4;transition:fill .4s var(--ease),stroke .4s var(--ease)}
.case-clinical .cl-ring .nd use{color:var(--cl-soft);stroke-width:1.7;transition:color .4s var(--ease)}
.case-clinical .cl-ring .nd{transform-box:fill-box;transform-origin:center;transition:transform .4s var(--ease)}
.case-clinical .cl-ring .nd.on circle{fill:var(--cl-blue);stroke:var(--cl-blue)}
.case-clinical .cl-ring .nd.on use{color:#fff}
.case-clinical .cl-ring .nd.on{transform:scale(1.14)}
.case-clinical .cl-ring-cap{margin-top:4px;text-align:center;font-size:10.8px;font-weight:700;color:var(--cl-mute);min-height:1.4em}

.case-clinical .cl-feed ul,.case-clinical #mon-feed{display:flex;flex-direction:column;gap:5px;min-height:132px}
.case-clinical #mon-feed li{
  display:grid;grid-template-columns:6px 1fr auto;align-items:center;gap:8px;
  padding:7px 9px;border-radius:9px;background:var(--cl-field);
  box-shadow:inset 0 0 0 1px var(--cl-line-2);
  transition:opacity .4s var(--ease),transform .4s var(--ease);
}
.case-clinical #mon-feed li i{width:6px;height:6px;border-radius:50%}
.case-clinical #mon-feed .w{font-size:11.6px;font-weight:700;color:var(--cl-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.case-clinical #mon-feed .s{display:none}
.case-clinical #mon-feed em{font-size:9.6px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-style:normal;padding:2px 6px;border-radius:5px}
.case-clinical #mon-feed .s-hi i{background:var(--cl-hi)}
.case-clinical #mon-feed .s-hi em{background:var(--cl-hi-bg);color:var(--cl-hi)}
.case-clinical #mon-feed .s-me i{background:var(--cl-me)}
.case-clinical #mon-feed .s-me em{background:var(--cl-me-bg);color:var(--cl-me)}
.case-clinical #mon-feed .s-lo i{background:var(--cl-lo)}
.case-clinical #mon-feed .s-lo em{background:var(--cl-lo-bg);color:var(--cl-lo)}
.case-clinical #mon-feed li.is-new{opacity:0;transform:translateY(-9px)}
.case-clinical #mon-feed li.is-out{opacity:0;transform:translateY(7px)}

.case-clinical .cl-sitebar{display:flex;gap:2px;height:7px;border-radius:99px;overflow:hidden;margin-bottom:10px}
.case-clinical .cl-sitebar i{display:block;height:100%}
.case-clinical .cl-sitebar .a{background:var(--cl-blue)}
.case-clinical .cl-sitebar .r{background:var(--cl-me)}
.case-clinical .cl-sitebar .p{background:#c3cee6}
.case-clinical .cl-sitelist{display:flex;flex-direction:column;gap:6px}
.case-clinical .cl-sitelist li{display:flex;align-items:center;gap:7px;font-size:11.4px;font-weight:600;color:var(--cl-copy)}
.case-clinical .cl-sitelist i{width:7px;height:7px;border-radius:2px;flex:none}
.case-clinical .cl-sitelist .a{background:var(--cl-blue)}
.case-clinical .cl-sitelist .r{background:var(--cl-me)}
.case-clinical .cl-sitelist .p{background:#c3cee6}
.case-clinical .cl-sitelist b{margin-left:auto;font-size:12.6px;font-weight:800;color:var(--cl-ink);font-variant-numeric:tabular-nums}

.case-clinical .cl-spark svg{width:100%;height:58px;display:block}
.case-clinical .cl-spark .fill{fill:url(#spg);stroke:none}
.case-clinical .cl-spark .line{stroke:var(--cl-blue);stroke-width:2;fill:none;
  stroke-dasharray:340;stroke-dashoffset:340}
.case-clinical .cl-mon.is-live .cl-spark .line{animation:cl-draw 1.9s var(--ease) .25s forwards}
@keyframes cl-draw{to{stroke-dashoffset:0}}
.case-clinical .cl-spark-cap{margin-top:7px;font-size:10.8px;font-weight:600;line-height:1.4;color:var(--cl-mute)}

/* ═══════════════ DOMAIN CHIPS ═══════════════ */
.case-clinical .cl-domains{
  display:flex;flex-wrap:wrap;justify-content:center;gap:9px;
  margin-top:clamp(26px,3vw,40px);
}
.case-clinical .cl-domains li{
  display:inline-flex;align-items:center;gap:9px;padding:10px 16px 10px 13px;border-radius:11px;
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line),0 2px 7px rgba(30,60,130,.05);
  font-size:12.8px;font-weight:700;color:var(--cl-ink);
  transition:transform .34s var(--ease),box-shadow .34s var(--ease);
}
.case-clinical .cl-domains li:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px var(--cl-soft),0 12px 24px rgba(30,60,130,.11)}
.case-clinical .cl-domains svg{width:16px;height:16px;color:var(--cl-blue);stroke-width:1.75}

/* ═══════════════ THE CHALLENGE · signal grid ═══════════════ */
.case-clinical .cl-grid-wrap{position:relative}
.case-clinical .cl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.case-clinical .cl-grid li{
  position:relative;overflow:hidden;
  display:flex;align-items:center;min-height:66px;padding:13px 14px;border-radius:var(--cl-r);
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line),0 2px 8px rgba(30,60,130,.045);
  font-size:13.2px;font-weight:600;color:var(--cl-copy);
  transition:transform .38s var(--ease),box-shadow .38s var(--ease),color .38s var(--ease),background .38s var(--ease);
}
.case-clinical .cl-grid li::after{
  content:"";position:absolute;right:11px;top:11px;width:6px;height:6px;border-radius:50%;
  background:var(--cl-line);transition:background .4s var(--ease),box-shadow .4s var(--ease);
}
.case-clinical .cl-grid li:hover{transform:translateY(-3px);color:var(--cl-ink);box-shadow:inset 0 0 0 1px var(--cl-soft),0 12px 26px rgba(30,60,130,.11)}
.case-clinical .cl-conv{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:20px}
.case-clinical .cl-conv-btn{
  display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border-radius:11px;flex:none;
  background:var(--cl-ink);color:#fff;font-size:13px;font-weight:700;
  box-shadow:0 8px 20px rgba(15,29,64,.2);
  transition:transform .32s var(--ease),box-shadow .32s var(--ease),background .32s var(--ease);
}
.case-clinical .cl-conv-btn:hover{transform:translateY(-2px);box-shadow:0 13px 28px rgba(15,29,64,.26)}
.case-clinical .cl-conv-btn.is-on{background:var(--cl-hi);box-shadow:0 8px 20px rgba(194,69,59,.28)}
.case-clinical .cl-conv-btn svg{width:16px;height:16px;stroke-width:1.9}
.case-clinical .cl-conv-out{font-size:13.6px;font-weight:700;line-height:1.5;color:var(--cl-ink);max-width:60ch}

/* ═══════════════ SPECIALISTS ═══════════════ */
.case-clinical .cl-spec{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.case-clinical .cl-spec li{
  position:relative;display:flex;flex-direction:column;gap:8px;padding:18px 18px 16px;border-radius:var(--cl-r);
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line),0 3px 12px rgba(30,60,130,.05);
  transition:transform .38s var(--ease),box-shadow .38s var(--ease);
}
.case-clinical .cl-spec li:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px var(--cl-soft),0 16px 34px rgba(30,60,130,.13)}
.case-clinical .cl-spec li.flash{box-shadow:inset 0 0 0 1.5px var(--cl-soft),0 12px 30px rgba(60,94,180,.18)}
.case-clinical .cl-spec .ic{
  display:grid;place-items:center;width:38px;height:38px;border-radius:11px;
  background:var(--cl-field);box-shadow:inset 0 0 0 1px var(--cl-line-2);
}
.case-clinical .cl-spec .ic svg{width:19px;height:19px;color:var(--cl-blue);stroke-width:1.7}
.case-clinical .cl-spec b{font-size:15px;font-weight:800;letter-spacing:-.02em;color:var(--cl-ink)}
.case-clinical .cl-spec p{font-size:13.2px;line-height:1.55;color:var(--cl-copy)}
.case-clinical .cl-spec .pill{
  align-self:flex-start;margin-top:auto;padding:4px 10px;border-radius:99px;
  font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  background:var(--cl-lo-bg);color:var(--cl-lo);
  transition:background .3s var(--ease),color .3s var(--ease);
}
.case-clinical .cl-spec .pill.is-busy{background:var(--cl-blue);color:#fff}
.case-clinical .cl-spec .pill.is-done{background:var(--cl-field-2);color:var(--cl-deep)}
.case-clinical .cl-spec .pill.is-wait{background:var(--cl-me-bg);color:var(--cl-me)}

.case-clinical .cl-mem{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;
  margin-top:14px;padding:14px 18px;border-radius:var(--cl-r);
  background:linear-gradient(100deg,#fff,var(--cl-field));
  box-shadow:inset 0 0 0 1px var(--cl-line);
}
.case-clinical .cl-mem-h{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--cl-ink)}
.case-clinical .cl-mem-h svg{width:16px;height:16px;color:var(--cl-blue);stroke-width:1.7}
.case-clinical .cl-mem ul{display:flex;flex-wrap:wrap;gap:7px}
.case-clinical .cl-mem li{padding:5px 11px;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line);font-size:11.6px;font-weight:700;color:var(--cl-copy)}

/* ═══════════════ EXAMPLE SCENARIO · split ═══════════════ */
.case-clinical .cl-split{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:14px;align-items:start}
.case-clinical .cl-signal{
  padding:20px;border-radius:18px;background:#fff;
  box-shadow:0 14px 38px rgba(23,52,120,.1),inset 0 0 0 1px var(--cl-line);
}
.case-clinical .cl-signal header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}
.case-clinical .cl-sev{padding:4px 10px;border-radius:99px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.case-clinical .cl-sev.s-hi{background:var(--cl-hi-bg);color:var(--cl-hi);box-shadow:inset 0 0 0 1px var(--cl-hi-ln)}
.case-clinical .cl-sev-id{font-size:10.6px;font-weight:700;letter-spacing:.05em;color:var(--cl-mute)}
.case-clinical .cl-signal h3{font-size:19px;line-height:1.2;letter-spacing:-.032em;color:var(--cl-ink)}
.case-clinical .cl-meta{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin:15px 0 18px;background:var(--cl-line-2);border-radius:11px;overflow:hidden;box-shadow:0 0 0 1px var(--cl-line-2)}
.case-clinical .cl-meta > div{background:#fff;padding:9px 11px}
.case-clinical .cl-meta dt{font-size:9.8px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--cl-mute)}
.case-clinical .cl-meta dd{margin:2px 0 0;font-size:13px;font-weight:700;color:var(--cl-ink)}
.case-clinical .cl-meta dd.await{color:var(--cl-me)}
.case-clinical .cl-signal h4{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--cl-ink);margin-bottom:11px}
.case-clinical .cl-drift{display:flex;flex-direction:column;gap:10px}
.case-clinical .cl-drift li{display:grid;grid-template-columns:1fr;gap:5px}
.case-clinical .cl-drift span{font-size:12.6px;font-weight:700;color:var(--cl-copy)}
.case-clinical .cl-drift em{font-size:10.4px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-style:normal;color:var(--cl-me);justify-self:end;margin-top:-19px}
.case-clinical .cl-drift i{position:relative;display:block;height:6px;border-radius:99px;background:var(--cl-field-2);overflow:hidden}
.case-clinical .cl-drift i::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--cl-blue),var(--cl-me));
  transform:scaleX(0);transform-origin:left center;
  transition:transform 1.1s var(--ease);
}
.case-clinical .cl-drift.is-on i::after{transform:scaleX(calc(var(--v) / 100))}
.case-clinical .cl-drift.is-on li:nth-child(2) i::after{transition-delay:.1s}
.case-clinical .cl-drift.is-on li:nth-child(3) i::after{transition-delay:.2s}
.case-clinical .cl-drift.is-on li:nth-child(4) i::after{transition-delay:.3s}
.case-clinical .cl-drift.is-on li:nth-child(5) i::after{transition-delay:.4s}
.case-clinical .cl-src{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:18px;padding-top:14px;box-shadow:inset 0 1px 0 var(--cl-line-2)}
.case-clinical .cl-src span{font-size:9.8px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--cl-mute);margin-right:3px}
.case-clinical .cl-src i{padding:4px 9px;border-radius:6px;background:var(--cl-field);box-shadow:inset 0 0 0 1px var(--cl-line-2);font-size:10.6px;font-weight:700;font-style:normal;color:var(--cl-deep)}

.case-clinical .cl-review{padding:20px;border-radius:18px;background:#fff;box-shadow:0 14px 38px rgba(23,52,120,.1),inset 0 0 0 1px var(--cl-line)}
.case-clinical .cl-review-h{font-size:13px;font-weight:700;color:var(--cl-mute);margin-bottom:13px}
.case-clinical .cl-tabs{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:14px;box-shadow:inset 0 -1px 0 var(--cl-line-2)}
.case-clinical .cl-tabs button{
  display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:9px;
  background:var(--cl-field);box-shadow:inset 0 0 0 1px transparent;
  font-size:12.2px;font-weight:700;color:var(--cl-mute);
  transition:background .3s var(--ease),color .3s var(--ease),box-shadow .3s var(--ease),transform .3s var(--ease);
}
.case-clinical .cl-tabs button svg{width:14px;height:14px;stroke-width:1.85}
.case-clinical .cl-tabs button:hover{color:var(--cl-deep);box-shadow:inset 0 0 0 1px var(--cl-line);transform:translateY(-1px)}
.case-clinical .cl-tabs button[aria-selected="true"]{background:var(--cl-blue);color:#fff;box-shadow:0 6px 16px rgba(60,94,180,.25)}
.case-clinical .cl-panes{padding-top:16px;min-height:238px}
.case-clinical .cl-pane-lead{font-size:13.4px;font-weight:700;color:var(--cl-ink);margin-bottom:12px}
.case-clinical .cl-lines{display:flex;flex-direction:column;gap:9px}
.case-clinical .cl-lines li{display:grid;grid-template-columns:8px 1fr;align-items:start;gap:11px;font-size:13.4px;line-height:1.55;color:var(--cl-copy)}
.case-clinical .cl-lines i{width:8px;height:8px;border-radius:50%;margin-top:6px}
.case-clinical .cl-lines .s-hi{background:var(--cl-hi)}
.case-clinical .cl-lines .s-me{background:var(--cl-me)}
.case-clinical .cl-lines .s-lo{background:var(--cl-lo)}
@media (prefers-reduced-motion:no-preference){
  .case-clinical .cl-pane.is-on .cl-lines li{animation:cl-in .5s var(--ease) backwards}
  .case-clinical .cl-pane.is-on .cl-lines li:nth-child(2){animation-delay:.06s}
  .case-clinical .cl-pane.is-on .cl-lines li:nth-child(3){animation-delay:.12s}
  .case-clinical .cl-pane.is-on .cl-lines li:nth-child(4){animation-delay:.18s}
  .case-clinical .cl-pane.is-on .cl-lines li:nth-child(5){animation-delay:.24s}
  .case-clinical .cl-pane.is-on .cl-pane-lead{animation:cl-in .45s var(--ease) backwards}
}
@keyframes cl-in{from{opacity:0;transform:translateY(9px)}}
.case-clinical .cl-decide{
  display:flex;align-items:flex-start;gap:10px;margin-top:15px;padding:12px 14px;border-radius:11px;
  background:var(--cl-field);box-shadow:inset 0 0 0 1px var(--cl-line-2);
  font-size:12.6px;line-height:1.5;font-weight:600;color:var(--cl-deep);
}
.case-clinical .cl-decide svg{width:16px;height:16px;flex:none;margin-top:1px;color:var(--cl-blue);stroke-width:1.75}
.case-clinical .cl-activity{margin-top:18px;padding-top:15px;box-shadow:inset 0 1px 0 var(--cl-line-2)}
.case-clinical .cl-activity-h{display:inline-flex;align-items:center;gap:7px;margin-bottom:11px;font-size:10.4px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--cl-ink)}
.case-clinical .cl-activity-h svg{width:14px;height:14px;color:var(--cl-blue);stroke-width:1.8}
.case-clinical .cl-activity ol{display:flex;flex-direction:column;gap:2px}
.case-clinical .cl-activity li{
  display:grid;grid-template-columns:44px 152px 1fr;align-items:center;gap:10px;
  padding:7px 10px;border-radius:8px;font-size:12.2px;color:var(--cl-copy);
  transition:background .3s var(--ease);
}
.case-clinical .cl-activity li:hover{background:var(--cl-field)}
.case-clinical .cl-activity time{font-size:10.8px;font-weight:800;color:var(--cl-mute);font-variant-numeric:tabular-nums}
.case-clinical .cl-activity b{font-size:11.6px;font-weight:800;color:var(--cl-deep)}
.case-clinical .cl-activity li.human{background:var(--cl-me-bg);box-shadow:inset 0 0 0 1px var(--cl-me-ln)}
.case-clinical .cl-activity li.human b,.case-clinical .cl-activity li.human span{color:var(--cl-me);font-weight:700}

/* ═══════════════ CONTINUITY ═══════════════ */
.case-clinical .cl-cont{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:clamp(24px,3.2vw,52px);align-items:center}
.case-clinical .cl-cont h2{font-size:clamp(1.5rem,1.05rem + 1.5vw,2.15rem);line-height:1.1;letter-spacing:-.038em;color:var(--cl-ink);margin:14px 0 14px}
.case-clinical .cl-cont p{font-size:14.8px;line-height:1.68}
.case-clinical .cl-shift{
  display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:18px;padding:15px 17px;border-radius:var(--cl-r);
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line);font-size:13.6px;font-weight:700;color:var(--cl-mute);
}
.case-clinical .cl-shift .was{color:var(--cl-mute);text-decoration:line-through;text-decoration-color:var(--cl-line)}
.case-clinical .cl-shift .now{color:var(--cl-ink)}
.case-clinical .cl-shift .ar{width:16px;height:16px;color:var(--cl-blue);stroke-width:2.2}
.case-clinical .cl-stack{padding:18px;border-radius:18px;background:#fff;box-shadow:0 14px 38px rgba(23,52,120,.09),inset 0 0 0 1px var(--cl-line)}
.case-clinical .cl-stack-h{display:flex;align-items:center;gap:8px;margin-bottom:14px;font-size:10.4px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--cl-ink)}
.case-clinical .cl-stack-h svg{width:15px;height:15px;color:var(--cl-blue);stroke-width:1.8}
.case-clinical .cl-stack ol{display:flex;flex-direction:column;gap:8px;position:relative;padding-left:18px}
.case-clinical .cl-stack ol::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:1.5px;background:linear-gradient(180deg,var(--cl-line),var(--cl-blue))}
.case-clinical .cl-stack li{position:relative;display:grid;grid-template-columns:58px 1fr;gap:10px;font-size:12.6px;line-height:1.5;color:var(--cl-copy)}
.case-clinical .cl-stack li::before{content:"";position:absolute;left:-18px;top:6px;width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px var(--cl-line)}
.case-clinical .cl-stack time{font-size:10.6px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--cl-mute)}
.case-clinical .cl-stack li.live{font-weight:700;color:var(--cl-ink)}
.case-clinical .cl-stack li.live::before{background:var(--cl-blue);box-shadow:0 0 0 2px rgba(60,94,180,.22)}
.case-clinical .cl-stack li.live time{color:var(--cl-blue)}
@media (prefers-reduced-motion:no-preference){
  .case-clinical .cl-stack li.live::before{animation:cl-pulse2 2.4s infinite}
}
@keyframes cl-pulse2{0%{box-shadow:0 0 0 2px rgba(60,94,180,.3)}70%{box-shadow:0 0 0 9px rgba(60,94,180,0)}100%{box-shadow:0 0 0 2px rgba(60,94,180,0)}}

/* ═══════════════ REVIEW QUEUE + WORKLOAD ═══════════════ */
.case-clinical .cl-queue-wrap{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.62fr);gap:14px;align-items:start}
.case-clinical .cl-queue{padding:6px 6px 14px;border-radius:18px;background:#fff;box-shadow:0 14px 38px rgba(23,52,120,.09),inset 0 0 0 1px var(--cl-line)}
.case-clinical .cl-queue > header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:13px 15px 12px}
.case-clinical .cl-queue > header span:first-child{display:inline-flex;align-items:center;gap:8px;font-size:10.6px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--cl-ink)}
.case-clinical .cl-queue > header svg{width:15px;height:15px;color:var(--cl-blue);stroke-width:1.8}
.case-clinical .cl-queue-tag{font-size:10.8px;font-weight:700;color:var(--cl-mute)}
.case-clinical #queue{display:flex;flex-direction:column;gap:5px;padding:0 6px}
.case-clinical #queue li{
  display:grid;grid-template-columns:26px minmax(0,1fr) 66px 82px;align-items:center;gap:11px;
  padding:11px 12px;border-radius:12px;background:var(--cl-field);
  box-shadow:inset 0 0 0 1px var(--cl-line-2);
  transition:opacity .4s var(--ease),transform .45s var(--ease),background .35s var(--ease),box-shadow .35s var(--ease);
}
.case-clinical #queue li:hover{background:#fff;box-shadow:inset 0 0 0 1px var(--cl-soft),0 8px 20px rgba(30,60,130,.09)}
.case-clinical #queue .n{
  display:grid;place-items:center;width:24px;height:24px;border-radius:8px;
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line);
  font-size:12px;font-weight:800;color:var(--cl-deep);font-variant-numeric:tabular-nums;
}
.case-clinical #queue .it{display:flex;flex-direction:column;gap:1px;min-width:0}
.case-clinical #queue .it b{font-size:13.4px;font-weight:700;color:var(--cl-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.case-clinical #queue .it em{font-size:11.4px;font-style:normal;font-weight:600;color:var(--cl-mute)}
.case-clinical #queue .sv{justify-self:start;padding:4px 9px;border-radius:99px;font-size:9.8px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.case-clinical #queue .sv.s-hi{background:var(--cl-hi-bg);color:var(--cl-hi)}
.case-clinical #queue .sv.s-me{background:var(--cl-me-bg);color:var(--cl-me)}
.case-clinical #queue .sv.s-lo{background:var(--cl-lo-bg);color:var(--cl-lo)}
.case-clinical #queue button{
  padding:8px 13px;border-radius:9px;background:var(--cl-blue);color:#fff;
  font-size:11.8px;font-weight:700;
  box-shadow:0 5px 14px rgba(60,94,180,.22);
  transition:transform .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease);
}
.case-clinical #queue button:hover{transform:translateY(-2px);background:var(--cl-deep);box-shadow:0 9px 20px rgba(60,94,180,.3)}
.case-clinical #queue li.is-done{background:#fff;box-shadow:inset 0 0 0 1px var(--cl-lo-ln)}
.case-clinical #queue li.is-done .it b{color:var(--cl-mute);text-decoration:line-through;text-decoration-color:var(--cl-lo-ln)}
.case-clinical #queue li.is-done .n{background:var(--cl-lo-bg);color:var(--cl-lo);box-shadow:inset 0 0 0 1px var(--cl-lo-ln)}
.case-clinical #queue li.is-done button{background:var(--cl-lo-bg);color:var(--cl-lo);box-shadow:none;cursor:default;transform:none}
.case-clinical #queue li.is-arriving{opacity:0;transform:translateY(-12px) scale(.98)}
.case-clinical .cl-queue-done{margin:13px 15px 0;font-size:12.4px;font-weight:700;color:var(--cl-deep);min-height:1.2em}

.case-clinical .cl-load{padding:20px 18px;border-radius:18px;background:#fff;box-shadow:0 14px 38px rgba(23,52,120,.09),inset 0 0 0 1px var(--cl-line);text-align:center}
.case-clinical .cl-load h3{font-size:10.6px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--cl-ink)}
.case-clinical .cl-donut{
  --sum:calc(var(--hi) + var(--me) + var(--lo));
  position:relative;width:142px;height:142px;margin:18px auto 16px;border-radius:50%;
  background:conic-gradient(
    var(--cl-hi) 0 calc(var(--hi) / var(--sum) * 100%),
    var(--cl-me) 0 calc((var(--hi) + var(--me)) / var(--sum) * 100%),
    var(--cl-lo) 0 100%);
  transition:transform .4s var(--ease);
}
.case-clinical .cl-donut.is-clear{background:var(--cl-lo-bg)}
.case-clinical .cl-donut::after{content:"";position:absolute;inset:19px;border-radius:50%;background:#fff}
.case-clinical .cl-donut > span{position:absolute;inset:0;z-index:1;display:grid;place-content:center;gap:1px}
.case-clinical .cl-donut b{font-size:29px;font-weight:800;letter-spacing:-.04em;color:var(--cl-ink);font-variant-numeric:tabular-nums}
.case-clinical .cl-donut em{font-size:10.4px;font-weight:700;font-style:normal;color:var(--cl-mute)}
.case-clinical .cl-legend{display:flex;justify-content:center;gap:14px;margin-bottom:15px}
.case-clinical .cl-legend li{display:inline-flex;align-items:center;gap:6px;font-size:11.4px;font-weight:700;color:var(--cl-mute)}
.case-clinical .cl-legend i{width:8px;height:8px;border-radius:3px}
.case-clinical .cl-legend .s-hi{background:var(--cl-hi)}
.case-clinical .cl-legend .s-me{background:var(--cl-me)}
.case-clinical .cl-legend .s-lo{background:var(--cl-lo)}
.case-clinical .cl-legend b{color:var(--cl-ink);font-variant-numeric:tabular-nums}
.case-clinical .cl-load > p{font-size:12.6px;line-height:1.55;color:var(--cl-copy);padding-top:14px;box-shadow:inset 0 1px 0 var(--cl-line-2)}

/* ═══════════════ VALUE ═══════════════ */
.case-clinical .cl-value{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.case-clinical .cl-value li{
  position:relative;overflow:hidden;padding:19px 18px 17px;border-radius:var(--cl-r);background:#fff;
  box-shadow:inset 0 0 0 1px var(--cl-line),0 3px 12px rgba(30,60,130,.05);
  transition:transform .38s var(--ease),box-shadow .38s var(--ease);
}
.case-clinical .cl-value li::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--cl-blue),var(--cl-soft));
  transform:scaleX(0);transform-origin:0 50%;transition:transform .45s var(--ease);
}
.case-clinical .cl-value li:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px var(--cl-soft),0 16px 34px rgba(30,60,130,.13)}
.case-clinical .cl-value li:hover::before{transform:scaleX(1)}
.case-clinical .cl-value li:nth-child(7){grid-column:span 1}
.case-clinical .cl-value .ic{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;margin-bottom:11px;background:var(--cl-field);box-shadow:inset 0 0 0 1px var(--cl-line-2)}
.case-clinical .cl-value .ic svg{width:17px;height:17px;color:var(--cl-blue);stroke-width:1.75}
.case-clinical .cl-value b{display:block;margin-bottom:6px;font-size:14.2px;font-weight:800;letter-spacing:-.02em;line-height:1.25;color:var(--cl-ink)}
.case-clinical .cl-value p{font-size:12.8px;line-height:1.55;color:var(--cl-copy)}

/* ═══════════════ METRICS ═══════════════ */
.case-clinical .cl-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.case-clinical .cl-metrics li{
  padding:15px 15px 13px;border-radius:13px;background:#fff;
  box-shadow:inset 0 0 0 1px var(--cl-line),0 2px 8px rgba(30,60,130,.045);
  transition:transform .36s var(--ease),box-shadow .36s var(--ease);
}
.case-clinical .cl-metrics li:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px var(--cl-soft),0 12px 26px rgba(30,60,130,.11)}
.case-clinical .cl-metrics b{display:block;font-size:13px;font-weight:700;line-height:1.35;color:var(--cl-ink)}
.case-clinical .cl-metrics i{
  position:relative;display:block;height:2px;margin-top:13px;border-radius:99px;
  background:linear-gradient(90deg,var(--cl-blue) 0 22%,var(--cl-line) 22% 100%);
}
.case-clinical .cl-metrics i::before,.case-clinical .cl-metrics i::after{content:"";position:absolute;top:50%;width:8px;height:8px;border-radius:50%;translate:0 -50%}
.case-clinical .cl-metrics i::before{left:0;background:var(--cl-blue)}
.case-clinical .cl-metrics i::after{right:0;background:#fff;box-shadow:inset 0 0 0 2px var(--cl-line)}
.case-clinical .cl-metrics-key{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 24px;margin-top:20px;font-size:11.8px;font-weight:700;color:var(--cl-mute)}
.case-clinical .cl-metrics-key span{display:inline-flex;align-items:center;gap:8px}
.case-clinical .cl-metrics-key i{width:9px;height:9px;border-radius:50%}
.case-clinical .cl-metrics-key .b{background:var(--cl-blue)}
.case-clinical .cl-metrics-key .p{background:#fff;box-shadow:inset 0 0 0 2px var(--cl-line)}

/* ═══════════════ HUMAN AUTHORITY (the dark beat) ═══════════════ */
.case-clinical .cl-authority{
  position:relative;padding:clamp(52px,6vw,88px) 0;overflow:hidden;
  background:
    radial-gradient(760px 420px at 76% 18%,rgba(74,110,200,.2),transparent 62%),
    linear-gradient(155deg,#132550,#0d1a3c 62%,#101f45);
  color:#b9c6e4;
}
.case-clinical .cl-authority::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.45;
  background-image:radial-gradient(rgba(150,180,240,.16) 1px,transparent 1px);background-size:22px 22px;
  -webkit-mask-image:radial-gradient(110% 90% at 78% 12%,#000,transparent 66%);
          mask-image:radial-gradient(110% 90% at 78% 12%,#000,transparent 66%);
}
.case-clinical .cl-auth-in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.52fr);gap:clamp(28px,3.6vw,56px);align-items:center}
.case-clinical .cl-authority h2{font-size:clamp(1.5rem,1.05rem + 1.5vw,2.15rem);line-height:1.1;letter-spacing:-.038em;color:#fff;margin:13px 0 14px}
.case-clinical .cl-authority > .cl-wrap p{font-size:14.8px;line-height:1.66;color:#a9b8da;max-width:62ch}
.case-clinical .cl-never{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:20px}
.case-clinical .cl-never li{
  display:flex;align-items:center;gap:9px;padding:11px 13px;border-radius:11px;
  background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.09);
  font-size:12.6px;font-weight:600;color:#d5dff4;
  transition:background .34s var(--ease),box-shadow .34s var(--ease),transform .34s var(--ease);
}
.case-clinical .cl-never li:hover{transform:translateY(-2px);background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 1px rgba(160,190,250,.3)}
.case-clinical .cl-never svg{width:15px;height:15px;flex:none;color:#7f9ada;stroke-width:1.7}
.case-clinical .cl-auth-note{margin-top:20px;padding-top:17px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1);font-size:13.6px!important;color:#a3b2d2!important}
.case-clinical .cl-auth-note b{color:#fff;font-weight:700}
.case-clinical .cl-auth-art{display:grid;justify-items:center;gap:14px}
.case-clinical .cl-auth-art svg{width:min(220px,72%);height:auto;overflow:visible}
.case-clinical .cl-auth-art .sh{fill:rgba(120,160,240,.08);stroke:rgba(150,185,250,.32);stroke-width:2}
.case-clinical .cl-auth-art .sh2{fill:none;stroke:#8fb0f0;stroke-width:2.4;stroke-dasharray:700;stroke-dashoffset:700}
.case-clinical .cl-auth-art .tick{fill:none;stroke:#7fd7b4;stroke-width:9;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:120;stroke-dashoffset:120}
.case-clinical .cl-auth-art .orb circle{fill:none;stroke:rgba(150,185,250,.16);stroke-width:1.4}
@media (prefers-reduced-motion:no-preference){
  .case-clinical .cl-auth-art.in .sh2{animation:cl-draw2 2s var(--ease) .2s forwards}
  .case-clinical .cl-auth-art.in .tick{animation:cl-draw3 .8s var(--ease) 1.5s forwards}
  .case-clinical .cl-auth-art.in .orb circle{animation:cl-breathe 5s ease-in-out infinite}
  .case-clinical .cl-auth-art.in .orb circle:last-child{animation-delay:.7s}
}
@keyframes cl-draw2{to{stroke-dashoffset:0}}
@keyframes cl-draw3{to{stroke-dashoffset:0}}
@keyframes cl-breathe{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.035)}}
.case-clinical .cl-auth-art .orb{transform-box:fill-box;transform-origin:center}
.case-clinical .cl-auth-cap{font-size:11.6px!important;font-weight:700;text-align:center;color:#93a6cb!important;max-width:24ch}

/* ═══════════════ FUTURE ═══════════════ */
.case-clinical .cl-sec--center{text-align:center}
.case-clinical .cl-future-line{max-width:74ch;margin:0 auto;font-size:15.4px;line-height:1.68;color:var(--cl-copy)}
.case-clinical .cl-future-line b{color:var(--cl-ink);font-weight:700}
.case-clinical .cl-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px}
.case-clinical .cl-chips li{
  display:inline-flex;align-items:center;gap:9px;padding:11px 19px 11px 15px;border-radius:99px;
  background:linear-gradient(120deg,#fff,var(--cl-field));
  box-shadow:inset 0 0 0 1px var(--cl-line),0 3px 10px rgba(30,60,130,.06);
  font-size:13.2px;font-weight:700;color:var(--cl-ink);
  transition:transform .34s var(--ease),box-shadow .34s var(--ease);
}
.case-clinical .cl-chips li:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px var(--cl-soft),0 13px 28px rgba(30,60,130,.12)}
.case-clinical .cl-chips svg{width:16px;height:16px;color:var(--cl-blue);stroke-width:1.75}

/* ═══════════════ OUTCOME ═══════════════ */
.case-clinical .cl-outcome{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
.case-clinical .cl-outcome article{padding:20px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line),0 6px 20px rgba(30,60,130,.06)}
.case-clinical .cl-outcome .toward{box-shadow:inset 0 0 0 1.5px var(--cl-soft),0 16px 40px rgba(30,60,130,.14)}
.case-clinical .cl-o-tag{
  display:inline-block;margin-bottom:15px;padding:5px 12px;border-radius:99px;
  font-size:10.4px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  background:var(--cl-field);color:var(--cl-mute);
}
.case-clinical .cl-outcome .toward .cl-o-tag{background:var(--cl-blue);color:#fff}
.case-clinical .cl-outcome ol{display:flex;flex-direction:column;gap:7px;counter-reset:o}
.case-clinical .cl-outcome li{
  counter-increment:o;position:relative;display:flex;align-items:center;gap:11px;
  padding:10px 13px;border-radius:11px;background:var(--cl-field);
  font-size:13px;font-weight:600;color:var(--cl-copy);
  transition:transform .34s var(--ease),background .34s var(--ease),color .34s var(--ease);
}
.case-clinical .cl-outcome li::before{
  content:counter(o,decimal-leading-zero);
  font-size:10.4px;font-weight:800;letter-spacing:.03em;color:var(--cl-mute);font-variant-numeric:tabular-nums;
}
.case-clinical .cl-outcome li:hover{transform:translateX(4px)}
.case-clinical .cl-outcome .toward li{background:var(--cl-field-2);color:var(--cl-deep)}
.case-clinical .cl-outcome .toward li::before{color:var(--cl-blue)}
.case-clinical .cl-outcome .toward li.hi{background:var(--cl-me-bg);box-shadow:inset 0 0 0 1px var(--cl-me-ln);color:var(--cl-me);font-weight:800}
.case-clinical .cl-outcome .toward li.hi::before{color:var(--cl-me)}
.case-clinical .cl-kicker{
  margin-top:26px;text-align:center;font-size:clamp(1.1rem,.9rem + .7vw,1.5rem);
  font-weight:800;letter-spacing:-.032em;color:var(--cl-ink);
}

/* ═══════════════ CTA ═══════════════ */
.case-clinical .cl-cta{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(20px,3vw,44px);align-items:center;
  margin:clamp(48px,5.6vw,84px) 0 clamp(56px,6vw,90px);padding:clamp(28px,3.4vw,44px);
  border-radius:22px;position:relative;overflow:hidden;
  background:
    radial-gradient(620px 320px at 88% 14%,rgba(96,134,222,.26),transparent 64%),
    linear-gradient(150deg,#16294f,#0f1d40 66%);
}
.case-clinical .cl-cta::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;
  background-image:radial-gradient(rgba(150,180,240,.2) 1px,transparent 1px);background-size:20px 20px;
  -webkit-mask-image:radial-gradient(90% 100% at 92% 0,#000,transparent 62%);
          mask-image:radial-gradient(90% 100% at 92% 0,#000,transparent 62%);
}
.case-clinical .cl-cta > div{position:relative}
.case-clinical .cl-cta h2{margin:12px 0 11px;font-size:clamp(1.4rem,1.05rem + 1.2vw,1.95rem);letter-spacing:-.036em;color:#fff}
.case-clinical .cl-cta p{font-size:14.4px;line-height:1.62;color:#a9b8da;max-width:52ch}
.case-clinical .cl-cta-act{display:flex;flex-wrap:wrap;gap:11px}
.case-clinical .cl-cta .cl-btn-ghost{background:rgba(255,255,255,.06);color:#dce6fb;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.18)}
.case-clinical .cl-cta .cl-btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.36)}

/* ═══════════════ RESPONSIVE ═══════════════ */
@media (max-width:1080px){
  .case-clinical .cl-hero{grid-template-columns:1fr;gap:34px}
  .case-clinical .cl-hero .lead{max-width:58ch}
  .case-clinical .cl-mon{max-width:640px}
  .case-clinical .cl-grid{grid-template-columns:repeat(3,1fr)}
  .case-clinical .cl-spec{grid-template-columns:repeat(2,1fr)}
  .case-clinical .cl-value{grid-template-columns:repeat(3,1fr)}
  .case-clinical .cl-metrics{grid-template-columns:repeat(3,1fr)}
  .case-clinical .cl-never{grid-template-columns:repeat(2,1fr)}
  .case-clinical .cl-split{grid-template-columns:1fr;gap:12px}
  .case-clinical .cl-queue-wrap{grid-template-columns:1fr}
  .case-clinical .cl-cont,.case-clinical .cl-auth-in{grid-template-columns:1fr;gap:28px}
  .case-clinical .cl-auth-art{order:-1;justify-items:start}
  .case-clinical .cl-auth-art svg{width:150px}
  .case-clinical .cl-cta{grid-template-columns:1fr}
}
@media (max-width:760px){
  .case-clinical main{font-size:14.4px}
  .case-clinical .cl-two{grid-template-columns:1fr;gap:14px}
  .case-clinical .cl-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .case-clinical .cl-grid li{min-height:60px;padding:12px 12px;font-size:12.5px}
  .case-clinical .cl-spec{grid-template-columns:1fr}
  .case-clinical .cl-value{grid-template-columns:1fr}
  .case-clinical .cl-metrics{grid-template-columns:repeat(2,1fr)}
  .case-clinical .cl-never{grid-template-columns:1fr}
  .case-clinical .cl-outcome{grid-template-columns:1fr}
  .case-clinical .cl-mon-body{grid-template-columns:1fr}
  .case-clinical .cl-team{grid-row:auto}
  .case-clinical .cl-ring{max-height:210px}
  .case-clinical .cl-facts{gap:14px 22px}
  .case-clinical .cl-facts span{max-width:20ch}
  .case-clinical .cl-hero-cta .btn{flex:1 1 auto;justify-content:center}
  .case-clinical .cl-tabs{gap:5px}
  .case-clinical .cl-tabs button{padding:7px 10px;font-size:11.4px}
  .case-clinical .cl-panes{min-height:0}
  .case-clinical .cl-activity li{grid-template-columns:40px 1fr;row-gap:1px}
  .case-clinical .cl-activity li b{grid-column:2}
  .case-clinical .cl-activity li span{grid-column:2}
  .case-clinical #queue li{grid-template-columns:24px minmax(0,1fr) auto;row-gap:9px}
  .case-clinical #queue .sv{grid-column:3;grid-row:1}
  .case-clinical #queue button{grid-column:2 / span 2;justify-self:end}
  .case-clinical .cl-signal,.case-clinical .cl-review,.case-clinical .cl-stack,.case-clinical .cl-queue,.case-clinical .cl-load{padding:16px}
  .case-clinical .cl-queue{padding:6px 4px 12px}
  .case-clinical .cl-conv-out{font-size:12.8px}
  .case-clinical .cl-domains li{font-size:12px;padding:9px 13px 9px 11px}
  .case-clinical .cl-note{margin-top:20px}
}
@media (max-width:430px){
  .case-clinical .cl-grid{grid-template-columns:1fr}
  .case-clinical .cl-metrics{grid-template-columns:1fr}
  .case-clinical .cl-sig-row{grid-template-columns:1fr;gap:5px}
  .case-clinical .cl-sig-row li{flex-direction:row;align-items:baseline;gap:8px}
  .case-clinical .cl-meta{grid-template-columns:1fr}
  .case-clinical .cl-hero h1{font-size:1.85rem}
}

/* ---------- corrections layer ---------- */
/* blink stagger so the grid reads as independent signals, not a metronome */
.case-clinical .cl-grid li:nth-child(4n+1){--d:0}
.case-clinical .cl-grid li:nth-child(4n+2){--d:1.6}
.case-clinical .cl-grid li:nth-child(4n+3){--d:3.1}
.case-clinical .cl-grid li:nth-child(4n+4){--d:4.4}
.case-clinical .cl-grid li:nth-child(n+5){animation-duration:6.2s}
.case-clinical .cl-grid li:nth-child(n+9){animation-duration:7.1s}

/* seventh value card closes its row */
.case-clinical .cl-value li:nth-child(7){grid-column:span 2}
@media (max-width:1080px){.case-clinical .cl-value li:nth-child(7){grid-column:span 1}}

/* drift rows: label + verdict share a line, the bar spans beneath */
.case-clinical .cl-drift li{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:baseline}
.case-clinical .cl-drift span{grid-column:1;grid-row:1}
.case-clinical .cl-drift em{grid-column:2;grid-row:1;justify-self:end;margin-top:0}
.case-clinical .cl-drift i{grid-column:1/-1;grid-row:2}

/* feed rows carry the site, not just the signal */
.case-clinical #mon-feed li{grid-template-columns:6px minmax(0,1fr) auto;grid-template-rows:auto auto;row-gap:1px}
.case-clinical #mon-feed li i{grid-column:1;grid-row:1/3;align-self:center}
.case-clinical #mon-feed .w{grid-column:2;grid-row:1}
.case-clinical #mon-feed .s{grid-column:2;grid-row:2;display:block;font-size:10.2px;font-weight:600;color:var(--cl-mute)}
.case-clinical #mon-feed em{grid-column:3;grid-row:1/3;align-self:center}

/* an emptied queue must not divide by zero */
.case-clinical .cl-donut.is-clear{background:var(--cl-lo-bg)!important}
.case-clinical .cl-donut.is-clear b{color:var(--cl-lo)}

/* ---------- polish pass ---------- */
/* the shift line is prose, not a flex row · gaps were splitting the sentence */
.case-clinical .cl-shift{display:block;line-height:1.75}
.case-clinical .cl-shift .was{
  color:var(--cl-mute);text-decoration:line-through;
  text-decoration-thickness:1.5px;text-decoration-color:#b6c3dd;
}
.case-clinical .cl-shift .ar{
  display:inline-block;width:15px;height:15px;vertical-align:-3px;margin:0 5px;
  color:var(--cl-blue);stroke-width:2.3;
}

/* metric rails align across a row even when a title wraps */
.case-clinical .cl-metrics li{display:flex;flex-direction:column}
.case-clinical .cl-metrics i{margin-top:auto}
.case-clinical .cl-metrics b{margin-bottom:13px}

/* the ring fills the height its card already occupies */
.case-clinical .cl-ring{max-height:250px}

/* five review tabs read as a deliberate 3 + 2, not 4 + orphan */
.case-clinical .cl-tabs{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.case-clinical .cl-tabs button{grid-column:span 2;justify-content:center;text-align:center;padding:9px 10px}
.case-clinical .cl-tabs button:nth-child(4),
.case-clinical .cl-tabs button:nth-child(5){grid-column:span 3}
@media (max-width:760px){
  .case-clinical .cl-tabs{grid-template-columns:repeat(2,1fr)}
  .case-clinical .cl-tabs button,
  .case-clinical .cl-tabs button:nth-child(4),
  .case-clinical .cl-tabs button:nth-child(5){grid-column:span 1}
  .case-clinical .cl-tabs button:nth-child(5){grid-column:span 2}
}

/* ══════════════════════════════════════════════════════════
   INTERACTION + SURFACE PASS
   ══════════════════════════════════════════════════════════ */

/* ---------- section grounds, same system the home page uses ---------- */
.case-clinical #clhero{--bgi:url(backgrounds/bg-hero.webp);--bgo:.5}
.case-clinical #shift{--bgi:url(backgrounds/bg-teams.webp);--bgo:.7}
.case-clinical #challenge{--bgi:url(backgrounds/bg-usecases.webp);--bgo:.62}
.case-clinical #team{--bgi:url(backgrounds/bg-contact.webp);--bgo:.5}
.case-clinical #scenario{--bgi:url(backgrounds/bg-value.webp);--bgo:.6}
.case-clinical #continuous{--bgi:url(backgrounds/bg-callout.webp);--bgo:.5}
.case-clinical #attention{--bgi:url(backgrounds/bg-roi.webp);--bgo:.62}
.case-clinical #value{--bgi:url(backgrounds/bg-teams.webp);--bgo:.5}
.case-clinical #measure{--bgi:url(backgrounds/bg-contact.webp);--bgo:.6}
.case-clinical #future{--bgi:url(backgrounds/bg-callout.webp);--bgo:.66}
.case-clinical #outcome{--bgi:url(backgrounds/bg-usecases.webp);--bgo:.5}
/* mirror every other one so the same seven images never read as a repeat */
.case-clinical #challenge::before,.case-clinical #continuous::before,
.case-clinical #measure::before,.case-clinical #outcome::before{transform:scaleX(-1)}

/* ---------- white panels get a faint instrument grid ---------- */
.case-clinical .cl-signal,.case-clinical .cl-review,.case-clinical .cl-queue,
.case-clinical .cl-load,.case-clinical .cl-stack,.case-clinical .cl-outcome article,
.case-clinical .cl-spec li,.case-clinical .cl-mem{
  position:relative;overflow:hidden;isolation:isolate;
  background-image:linear-gradient(166deg,#fff 44%,#f6f9fd 100%);
}
.case-clinical .cl-signal::after,.case-clinical .cl-review::after,.case-clinical .cl-queue::after,
.case-clinical .cl-load::after,.case-clinical .cl-stack::after,.case-clinical .cl-outcome article::after,
.case-clinical .cl-spec li::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:
    linear-gradient(rgba(60,94,180,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(60,94,180,.055) 1px,transparent 1px);
  background-size:24px 24px;
  -webkit-mask-image:radial-gradient(128% 116% at 100% 0,#000 2%,transparent 58%);
          mask-image:radial-gradient(128% 116% at 100% 0,#000 2%,transparent 58%);
}
/* smaller tiles: the wash only, so the page never turns into wallpaper */
.case-clinical .cl-grid li,.case-clinical .cl-metrics li,
.case-clinical .cl-domains button,.case-clinical .cl-chips li,.case-clinical .cl-value li{
  background-image:linear-gradient(160deg,#fff 52%,#f7fafe 100%);
}

/* ---------- clickable ring ---------- */
.case-clinical .cl-ring .nd{cursor:pointer}
.case-clinical .cl-ring .hit{fill:transparent;stroke:none}
.case-clinical .cl-ring .nd:hover circle:not(.hit){stroke:var(--cl-soft)}
.case-clinical .cl-ring .nd:hover use{color:var(--cl-blue)}
.case-clinical .cl-ring .nd:hover{transform:scale(1.09)}
.case-clinical .cl-ring .nd.on:hover{transform:scale(1.14)}
.case-clinical .cl-ring .nd:focus{outline:none}
.case-clinical .cl-ring .nd:focus-visible circle:not(.hit){stroke:var(--cl-blue);stroke-width:2.6}
/* the caption is a fixed slot, so no specialist can stretch the card */
.case-clinical .cl-ring-cap{
  display:flex;flex-direction:column;justify-content:center;gap:1px;
  height:38px;margin-top:6px;overflow:hidden;text-align:center;
}
.case-clinical .cl-ring-cap b{font-size:11.6px;font-weight:800;letter-spacing:-.01em;color:var(--cl-ink)}
.case-clinical .cl-ring-cap span{font-size:10.4px;font-weight:600;color:var(--cl-mute)}

/* ---------- severity counters filter the feed ---------- */
.case-clinical .cl-sig-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.case-clinical .cl-sig-row button{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;
  padding:9px 10px;border-radius:10px;text-align:left;
  background:var(--cl-field);box-shadow:inset 0 0 0 1px var(--cl-line-2);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),opacity .3s var(--ease);
}
.case-clinical .cl-sig-row button:hover{transform:translateY(-2px)}
.case-clinical .cl-sig-row button b{font-size:22px;font-weight:800;letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums}
.case-clinical .cl-sig-row button span{font-size:10.5px;font-weight:700;color:var(--cl-mute)}
.case-clinical .cl-sig-row .s-hi{background:var(--cl-hi-bg);box-shadow:inset 0 0 0 1px var(--cl-hi-ln)}
.case-clinical .cl-sig-row .s-hi b{color:var(--cl-hi)}
.case-clinical .cl-sig-row .s-me{background:var(--cl-me-bg);box-shadow:inset 0 0 0 1px var(--cl-me-ln)}
.case-clinical .cl-sig-row .s-me b{color:var(--cl-me)}
.case-clinical .cl-sig-row .s-lo{background:var(--cl-lo-bg);box-shadow:inset 0 0 0 1px var(--cl-lo-ln)}
.case-clinical .cl-sig-row .s-lo b{color:var(--cl-lo)}
.case-clinical .cl-sig-row.has-filter button[aria-pressed="false"]{opacity:.42}
.case-clinical .cl-sig-row button[aria-pressed="true"]{
  transform:translateY(-2px);
  box-shadow:inset 0 0 0 1.6px currentColor,0 7px 16px rgba(30,60,130,.13);
}
.case-clinical .cl-sig-row .s-hi[aria-pressed="true"]{color:var(--cl-hi)}
.case-clinical .cl-sig-row .s-me[aria-pressed="true"]{color:var(--cl-me)}
.case-clinical .cl-sig-row .s-lo[aria-pressed="true"]{color:var(--cl-lo)}
.case-clinical .cl-feed h3 span.is-filtered{color:var(--cl-blue);font-weight:800}

/* ---------- domain chips ---------- */
.case-clinical .cl-domains-wrap{margin-top:clamp(26px,3vw,40px)}
.case-clinical .cl-domains{margin-top:0}
.case-clinical .cl-domains li{all:unset}
.case-clinical .cl-domains button{
  display:inline-flex;align-items:center;gap:9px;padding:10px 16px 10px 13px;border-radius:11px;
  box-shadow:inset 0 0 0 1px var(--cl-line),0 2px 7px rgba(30,60,130,.05);
  font-size:12.8px;font-weight:700;color:var(--cl-ink);
  transition:transform .34s var(--ease),box-shadow .34s var(--ease),color .34s var(--ease);
}
.case-clinical .cl-domains button:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px var(--cl-soft),0 12px 24px rgba(30,60,130,.11)}
.case-clinical .cl-domains button[aria-pressed="true"]{
  background-image:linear-gradient(150deg,var(--cl-blue),var(--cl-deep));color:#fff;
  box-shadow:0 10px 22px rgba(60,94,180,.28);transform:translateY(-3px);
}
.case-clinical .cl-domains button[aria-pressed="true"] svg{color:#fff}
.case-clinical .cl-domains-out{
  max-width:64ch;margin:16px auto 0;min-height:2.9em;
  text-align:center;font-size:13.4px;line-height:1.55;font-weight:600;color:var(--cl-copy);
}

/* ---------- authority lines reveal the owner ---------- */
.case-clinical .cl-never li{all:unset;display:block}
.case-clinical .cl-never button{
  display:grid;grid-template-columns:15px 1fr;align-items:center;gap:9px;width:100%;
  padding:11px 13px;border-radius:11px;text-align:left;
  background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.09);
  font-size:12.6px;font-weight:600;color:#d5dff4;
  transition:background .34s var(--ease),box-shadow .34s var(--ease),transform .34s var(--ease);
}
.case-clinical .cl-never button:hover{transform:translateY(-2px);background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 1px rgba(160,190,250,.3)}
.case-clinical .cl-never svg{width:15px;height:15px;flex:none;color:#7f9ada;stroke-width:1.7}
.case-clinical .cl-never .who{
  grid-column:2;display:block;overflow:hidden;
  max-height:0;opacity:0;font-size:11.4px;font-weight:700;color:#7fd7b4;
  transition:max-height .4s var(--ease),opacity .32s var(--ease),margin-top .4s var(--ease);
}
.case-clinical .cl-never button[aria-pressed="true"]{background:rgba(127,215,180,.09);box-shadow:inset 0 0 0 1px rgba(127,215,180,.34)}
.case-clinical .cl-never button[aria-pressed="true"] svg{color:#7fd7b4}
.case-clinical .cl-never button[aria-pressed="true"] .who{max-height:3.4em;opacity:1;margin-top:4px}
.case-clinical .cl-never-hint{margin-top:14px!important;font-size:11.8px!important;font-weight:700;color:#93a3c6!important}

/* ---------- equal boxes ---------- */
.case-clinical .cl-split{align-items:stretch}
.case-clinical .cl-signal{display:flex;flex-direction:column}
.case-clinical .cl-src{margin-top:auto}
.case-clinical .cl-outcome{align-items:stretch}
.case-clinical .cl-outcome article{display:flex;flex-direction:column}
.case-clinical .cl-outcome ol{flex:1;justify-content:space-between}

/* ---------- outcome cross-highlight ---------- */
.case-clinical .cl-outcome li{cursor:pointer;outline:none}
.case-clinical .cl-outcome li.dim{opacity:.34}
.case-clinical .cl-outcome li.lit{
  background:var(--cl-field-2);color:var(--cl-deep);
  box-shadow:inset 0 0 0 1.5px var(--cl-soft);transform:translateX(4px);
}
.case-clinical .cl-outcome .toward li.lit{background:#e6edfb}
.case-clinical .cl-outcome li.lit::before{color:var(--cl-blue)}
.case-clinical .cl-outcome li.only{
  background:var(--cl-lo-bg);color:var(--cl-lo);
  box-shadow:inset 0 0 0 1.5px var(--cl-lo-ln);
}
.case-clinical .cl-outcome li.only::before{color:var(--cl-lo)}
.case-clinical .cl-outcome-out{
  max-width:70ch;margin:20px auto 0;min-height:2.6em;text-align:center;
  font-size:13.4px;line-height:1.5;font-weight:700;color:var(--cl-deep);
}

@media (max-width:1080px){
  .case-clinical .cl-split,.case-clinical .cl-outcome{align-items:start}
  .case-clinical .cl-outcome ol{flex:0 1 auto;justify-content:flex-start}
}

/* an opened boundary line must not leave its row-mates short */
.case-clinical .cl-never li{all:unset;display:grid}
.case-clinical .cl-never button{height:100%;align-content:start}

/* ══════════════════════════════════════════════════════════
   THE SHIFT · the five domains orbit, then settle into a row
   ══════════════════════════════════════════════════════════ */
.case-clinical .cl-shift-sec{position:relative;overflow:clip;padding-block:clamp(56px,6.6vw,96px)}
.case-clinical .cl-shift-sec > .cl-wrap{position:relative;z-index:1}
.case-clinical .cl-orbit{position:absolute;inset:0;z-index:0;pointer-events:none}
.case-clinical .cl-orbit svg{position:absolute;inset:0;width:100%;height:100%}
.case-clinical .cl-orbit .arcs ellipse{fill:none;stroke:rgba(60,94,180,.13);stroke-width:1.1}
.case-clinical .cl-orbit .arcs ellipse:nth-child(even){stroke:rgba(60,94,180,.09)}
.case-clinical .cl-orbit .pips circle{fill:#c3d1ee;stroke:none}
.case-clinical .cl-orbit .pips circle:nth-child(odd){fill:#b0c3e8}

.case-clinical .cl-orb-ico{
  position:absolute;display:grid;place-items:center;
  width:clamp(34px,3vw,44px);height:clamp(34px,3vw,44px);border-radius:13px;
  background:rgba(255,255,255,.72);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.1),0 6px 18px rgba(30,60,130,.06);
  backdrop-filter:blur(2px);
}
.case-clinical .cl-orb-ico svg{width:48%;height:48%;color:#93a9dc;stroke-width:1.75;fill:none;stroke-linecap:round;stroke-linejoin:round}
.case-clinical .cl-orb-ico.o1{left:16%;top:24%}
.case-clinical .cl-orb-ico.o2{left:7.6%;top:36%;width:30px;height:30px;border-radius:10px}
.case-clinical .cl-orb-ico.o3{right:14%;top:37%}
.case-clinical .cl-orb-ico.o4{right:8%;top:56%;width:30px;height:30px;border-radius:10px}
.case-clinical .cl-orb-ico.o5{left:5.4%;top:66%;width:30px;height:30px;border-radius:10px}
@media (prefers-reduced-motion:no-preference){
  .case-clinical .cl-orb-ico{animation:cl-drift 11s ease-in-out infinite}
  .case-clinical .cl-orb-ico.o2{animation-duration:14s;animation-delay:-3s}
  .case-clinical .cl-orb-ico.o3{animation-duration:12.5s;animation-delay:-6s}
  .case-clinical .cl-orb-ico.o4{animation-duration:15s;animation-delay:-2s}
  .case-clinical .cl-orb-ico.o5{animation-duration:13s;animation-delay:-8s}
  .case-clinical .cl-orbit .pips circle{animation:cl-twinkle 6s ease-in-out infinite}
  .case-clinical .cl-orbit .pips circle:nth-child(3n){animation-delay:-2s}
  .case-clinical .cl-orbit .pips circle:nth-child(3n+1){animation-delay:-4s}
}
@keyframes cl-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@keyframes cl-twinkle{0%,100%{opacity:.5}50%{opacity:1}}
@media (max-width:900px){.case-clinical .cl-orb-ico{display:none}}

.case-clinical .cl-shift-sec .cl-head h2{font-size:clamp(1.7rem,1.1rem + 2vw,2.6rem)}
.case-clinical .cl-shift-sec .cl-head p{font-size:16px}

/* the two paragraphs become one panel, split by a hairline */
.case-clinical .cl-twopanel{
  position:relative;display:grid;grid-template-columns:1fr 1fr;gap:0;
  max-width:1000px;margin:clamp(28px,3.2vw,44px) auto 0;
  border-radius:20px;overflow:hidden;
  background:linear-gradient(150deg,rgba(255,255,255,.86),rgba(255,255,255,.52));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),0 10px 34px rgba(30,60,130,.05);
  backdrop-filter:blur(3px);
}
.case-clinical .cl-tp{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(14px,1.6vw,22px);padding:clamp(20px,2.4vw,30px) clamp(20px,2.4vw,32px)}
.case-clinical .cl-tp:first-of-type{box-shadow:inset -1px 0 0 rgba(60,94,180,.1)}
.case-clinical .cl-tp .ic{
  display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:14px;
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line-2),0 5px 14px rgba(30,60,130,.07);
}
.case-clinical .cl-tp .ic svg{width:21px;height:21px;color:var(--cl-blue);stroke-width:1.75}
.case-clinical .cl-tp p{font-size:14.6px;line-height:1.7;color:var(--cl-copy)}
.case-clinical .cl-tp b{color:var(--cl-ink);font-weight:700}
.case-clinical .cl-tp b.hl{color:var(--cl-blue);font-weight:700}
.case-clinical .cl-tp-dots{
  position:absolute;left:50%;top:50%;translate:calc(-50% - 42px) -50%;
  width:22px;height:22px;
  background-image:radial-gradient(#9db2e2 1.3px,transparent 1.3px);
  background-size:5.5px 5.5px;opacity:.75;
}

/* the domain row: chips joined by a dotted rail */
.case-clinical .cl-domains li{all:unset;display:block;position:relative}
.case-clinical .cl-domains button{background-image:linear-gradient(160deg,#fff 52%,#f7fafe 100%)}
.case-clinical .cl-domains button .ict{
  display:grid;place-items:center;width:32px;height:32px;flex:none;border-radius:10px;
  background:var(--cl-field-2);box-shadow:inset 0 0 0 1px rgba(60,94,180,.08);
  transition:background .34s var(--ease);
}
.case-clinical .cl-domains button .ict svg{width:16px;height:16px;color:var(--cl-blue)}
.case-clinical .cl-domains button[aria-pressed="true"] .ict{background:rgba(255,255,255,.2)}
.case-clinical .cl-domains button[aria-pressed="true"] .ict svg{color:#fff}
@media (min-width:901px){
  .case-clinical .cl-domains{gap:9px 34px}
  .case-clinical .cl-domains li:not(:last-child)::after{
    content:"";position:absolute;right:-30px;top:50%;width:26px;height:1px;translate:0 -50%;
    background-image:linear-gradient(90deg,#bfcdea 45%,transparent 0);background-size:5px 1px;
  }
  .case-clinical .cl-domains li:not(:last-child)::before{
    content:"";position:absolute;right:-19px;top:50%;width:5px;height:5px;border-radius:50%;
    translate:0 -50%;background:#9db2e2;z-index:1;
  }
}
@media (max-width:760px){
  .case-clinical .cl-twopanel{grid-template-columns:1fr}
  .case-clinical .cl-tp:first-of-type{box-shadow:inset 0 -1px 0 rgba(60,94,180,.1)}
  .case-clinical .cl-tp-dots{display:none}
}

/* ---------- the feed must never resize the page ----------
   Two things used to move it: the initial fill from empty, and the
   outgoing row still holding a slot while the new one is already in.
   Fixed slot + the leaver taken out of flow. */
.case-clinical .cl-feed ul,.case-clinical #mon-feed{
  position:relative;height:215px;min-height:0;overflow:hidden;
}
.case-clinical #mon-feed li.is-out{position:absolute;left:0;right:0;bottom:0}
.case-clinical .cl-feed-empty{
  display:grid;place-items:center;height:100%;text-align:center;
  font-size:11.6px;font-weight:600;color:var(--cl-mute);
  box-shadow:inset 0 0 0 1px var(--cl-line-2);border-radius:10px;
}

/* ---------- section grounds: full-bleed and never distorted ----------
   The home page can stretch these to 100% 100% because its sections are
   viewport-wide. Half of this page's sections are content-width, so the
   art was being cut at the text column AND squashed out of proportion. */
.case-clinical .has-bg::before{
  background-size:cover;
  background-position:50% 50%;
}
.case-clinical .cl-wrap.has-bg{overflow:visible}
.case-clinical .cl-wrap.has-bg::before{
  left:50%;right:auto;width:100vw;transform:translateX(-50%);
}

/* the arriving queue item is pre-allocated, so nothing below it jumps */
.case-clinical .cl-q-slot{visibility:hidden;pointer-events:none}

@media (max-width:760px){
  /* on a phone the badge column steals half the measure · stack it */
  .case-clinical .cl-tp{grid-template-columns:1fr;gap:13px}
  .case-clinical .cl-tp .ic{width:40px;height:40px;justify-self:start}
}

/* ══════════════════════════════════════════════════════════
   ICON CRISPNESS
   Three things were softening them:
   1. the ring was drawn into a 582x250 box at 1.4x with 150px of
      dead space each side, so every glyph rendered small;
   2. the active node grew via CSS transform, which makes Chrome
      rescale a cached raster instead of redrawing the vector;
   3. backdrop-filter pushed the floating chips onto their own
      composited layer and washed them out.
   ══════════════════════════════════════════════════════════ */

/* 1 · size the ring to its content, never stretch its box */
.case-clinical .cl-ring{
  width:min(100%,272px);max-width:272px;height:auto;max-height:none;
  display:block;margin:2px auto 0;
}

/* 2 · the node never scales · the radius grows and a halo pulses */
.case-clinical .cl-ring .nd{transform:none!important}
.case-clinical .cl-ring .nd .dot{
  fill:#fff;stroke:var(--cl-line);stroke-width:1.4;
  transition:fill .38s var(--ease),stroke .38s var(--ease),r .38s var(--ease);
}
.case-clinical .cl-ring .nd.on .dot{fill:var(--cl-blue);stroke:var(--cl-blue);r:18.5px}
.case-clinical .cl-ring .nd:hover .dot{stroke:var(--cl-soft)}
.case-clinical .cl-ring .nd:focus-visible .dot{stroke:var(--cl-blue);stroke-width:2.6}
.case-clinical .cl-ring .halo{
  fill:none;stroke:var(--cl-blue);stroke-width:1.5;opacity:0;
  transform-box:fill-box;transform-origin:center;
}
.case-clinical .cl-ring .nd.on .halo{opacity:.32}
@media (prefers-reduced-motion:no-preference){
  .case-clinical .cl-ring .nd.on .halo{animation:cl-halo 1.9s ease-out infinite}
}
@keyframes cl-halo{0%{transform:scale(1);opacity:.42}100%{transform:scale(1.8);opacity:0}}
/* the glyph itself: a touch heavier so it reads solid at ring scale */
.case-clinical .cl-ring .nd use{color:#8aa1d6;stroke-width:1.95;transition:color .38s var(--ease)}
.case-clinical .cl-ring .nd.on use{color:#fff}
.case-clinical .cl-ring .nd:hover use{color:var(--cl-blue)}
.case-clinical .cl-ring .hub use{stroke-width:1.75}

/* 3 · no compositing tricks on the floating chips or the panel */
.case-clinical .cl-orb-ico{
  backdrop-filter:none;
  background:rgba(255,255,255,.92);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.13),0 6px 18px rgba(30,60,130,.07);
}
.case-clinical .cl-orb-ico svg{width:50%;height:50%;color:#7f97d1;stroke-width:1.9}
.case-clinical .cl-twopanel{backdrop-filter:none;background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(255,255,255,.8))}

/* small tile glyphs, same treatment */
.case-clinical .cl-domains .ict svg,.case-clinical .cl-spec .ic svg,
.case-clinical .cl-value .ic svg,.case-clinical .cl-tp .ic svg{stroke-width:1.9}

/* ---------- the orbit backdrop must not claim the chips' own glyphs ----------
   `.cl-orbit svg` was matching the icons inside .cl-orb-ico too, pinning each
   one to its chip's top-left corner instead of centring it. */
.case-clinical .cl-orbit > svg{position:absolute;inset:0;width:100%;height:100%}
.case-clinical .cl-orb-ico > svg{position:static;inset:auto;width:50%;height:50%}

/* ---------- domain chips: one frame, not two ---------- */
.case-clinical .cl-domains button{
  gap:11px;padding:9px 18px 9px 9px;border-radius:13px;
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.11),0 2px 8px rgba(30,60,130,.05);
}
.case-clinical .cl-domains button .ict{
  width:34px;height:34px;border-radius:10px;
  background:#eef3fc;box-shadow:none;
  transition:background .34s var(--ease),transform .34s var(--ease);
}
.case-clinical .cl-domains button:hover{
  transform:translateY(-3px);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.16),0 12px 24px rgba(30,60,130,.1);
}
.case-clinical .cl-domains button:hover .ict{background:var(--cl-field-2);transform:scale(1.06)}
.case-clinical .cl-domains button[aria-pressed="true"]{box-shadow:0 10px 24px rgba(60,94,180,.26)}
.case-clinical .cl-domains button[aria-pressed="true"] .ict{background:rgba(255,255,255,.18)}

/* ---------- hover reaches everything that is a thing, not just cards ---------- */
.case-clinical .cl-facts li,.case-clinical .cl-mem li,.case-clinical .cl-src i,
.case-clinical .cl-stack li,.case-clinical .cl-sitelist li,.case-clinical .cl-lines li,
.case-clinical .cl-drift li,.case-clinical .cl-meta > div,.case-clinical .cl-metrics li,
.case-clinical .cl-legend li{
  transition:transform .3s var(--ease),background .3s var(--ease),
             box-shadow .3s var(--ease),color .3s var(--ease);
}
.case-clinical .cl-mem li:hover,.case-clinical .cl-src i:hover{
  transform:translateY(-2px);color:var(--cl-deep);
  box-shadow:inset 0 0 0 1px var(--cl-soft),0 6px 14px rgba(30,60,130,.09);
}
.case-clinical .cl-stack li:hover{color:var(--cl-ink)}
.case-clinical .cl-stack li:hover::before{box-shadow:0 0 0 2px var(--cl-soft)}
.case-clinical .cl-stack li:hover time{color:var(--cl-blue)}
.case-clinical .cl-sitelist li:hover,.case-clinical .cl-legend li:hover{color:var(--cl-ink)}
.case-clinical .cl-sitelist li:hover b{color:var(--cl-blue)}
.case-clinical .cl-lines li:hover{color:var(--cl-ink)}
.case-clinical .cl-lines li:hover i{box-shadow:0 0 0 4px rgba(60,94,180,.1)}
.case-clinical .cl-lines i{transition:box-shadow .3s var(--ease)}
.case-clinical .cl-drift li:hover span{color:var(--cl-ink)}
.case-clinical .cl-drift li:hover i::after{filter:saturate(1.25)}
.case-clinical .cl-meta > div:hover{background:var(--cl-field)}
.case-clinical .cl-meta > div:hover dd{color:var(--cl-blue)}
.case-clinical .cl-meta > div:hover dd.await{color:var(--cl-me)}
.case-clinical .cl-facts li:hover b{color:var(--cl-deep)}
.case-clinical .cl-facts li:hover span{color:var(--cl-copy)}
.case-clinical .cl-tp .ic,.case-clinical .cl-spec .ic,.case-clinical .cl-value .ic{
  transition:transform .34s var(--ease),background .34s var(--ease),box-shadow .34s var(--ease);
}
.case-clinical .cl-spec li:hover .ic,.case-clinical .cl-value li:hover .ic{
  transform:scale(1.07);background:var(--cl-field-2);
}
.case-clinical .cl-tp:hover .ic{transform:scale(1.06);box-shadow:inset 0 0 0 1px var(--cl-line),0 8px 18px rgba(30,60,130,.1)}
.case-clinical .cl-orb-ico{transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.case-clinical .cl-shift-sec:hover .cl-orb-ico{box-shadow:inset 0 0 0 1px rgba(60,94,180,.2),0 9px 22px rgba(30,60,130,.1)}
.case-clinical .cl-spark:hover .line{filter:drop-shadow(0 2px 5px rgba(60,94,180,.3))}
.case-clinical .cl-spark svg .line{transition:filter .35s var(--ease)}
.case-clinical .cl-sitebar i{transition:filter .3s var(--ease)}
.case-clinical .cl-sites:hover .cl-sitebar i{filter:saturate(1.2)}

/* ---------- no pulsing rings ----------
   The halo behind the active specialist read as a separate, badly
   registered circle. The node's own fill and radius already say
   "this one is working"; the shield's rings frame it without breathing. */
.case-clinical .cl-ring .halo{display:none}
.case-clinical .cl-orbit .pips circle{animation:none;opacity:.85}
.case-clinical .cl-auth-art.in .orb circle,
.case-clinical .cl-auth-art .orb circle{animation:none;opacity:.7}

/* ---------- domain chips: the house hover ----------
   Same move the Use Cases cards make on the home page · a brand gradient
   painted into a transparent border that sweeps from a corner accent to
   the full frame, while the icon tile fills and previews the pressed state. */
.case-clinical .cl-domains button{
  display:inline-flex;align-items:center;gap:11px;
  padding:9px 18px 9px 9px;
  border:2px solid transparent;border-radius:14px;
  background-image:
    linear-gradient(158deg,#ffffff 46%,#f6fafe 100%),
    var(--br-a),
    linear-gradient(rgba(60,94,180,.13),rgba(60,94,180,.13));
  background-origin:padding-box,border-box,border-box;
  background-clip:padding-box,border-box,border-box;
  background-repeat:no-repeat;
  background-size:auto,38% 38%,auto;
  box-shadow:0 2px 8px rgba(30,60,130,.05);
  transition:background-size .55s ease,transform .34s var(--ease),
             box-shadow .34s var(--ease),color .3s var(--ease);
}
.case-clinical .cl-domains button:hover,
.case-clinical .cl-domains button:focus-visible{
  background-size:auto,100% 100%,auto;
  transform:translateY(-3px);
  box-shadow:0 14px 28px rgba(30,60,130,.14);
}
.case-clinical .cl-domains button .ict{
  width:34px;height:34px;border-radius:10px;background:#eef3fc;box-shadow:none;
  transition:background .34s var(--ease),transform .34s var(--ease);
}
.case-clinical .cl-domains button .ict svg{color:var(--cl-blue);transition:color .34s var(--ease)}
.case-clinical .cl-domains button:hover .ict,
.case-clinical .cl-domains button:focus-visible .ict{background:var(--cl-blue);transform:scale(1.05)}
.case-clinical .cl-domains button:hover .ict svg,
.case-clinical .cl-domains button:focus-visible .ict svg{color:#fff}

.case-clinical .cl-domains button[aria-pressed="true"]{
  background-image:
    linear-gradient(150deg,var(--cl-blue),var(--cl-deep)),
    var(--br-a),
    linear-gradient(rgba(60,94,180,.13),rgba(60,94,180,.13));
  background-size:auto,100% 100%,auto;
  color:#fff;transform:translateY(-3px);
  box-shadow:0 12px 26px rgba(60,94,180,.28);
}
.case-clinical .cl-domains button[aria-pressed="true"] .ict{background:rgba(255,255,255,.2)}
.case-clinical .cl-domains button[aria-pressed="true"] .ict svg{color:#fff}
@media (prefers-reduced-motion:reduce){
  .case-clinical .cl-domains button{transition:none}
}

/* ══════════════════════════════════════════════════════════
   THE CHALLENGE · one panel, twelve signals, five that line up
   ══════════════════════════════════════════════════════════ */
.case-clinical .cl-chal{
  border-radius:24px;overflow:hidden;
  background:linear-gradient(168deg,rgba(255,255,255,.96),rgba(246,249,253,.92));
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.09),0 14px 40px rgba(30,60,130,.06);
}
.case-clinical .cl-chal-body{
  display:grid;grid-template-columns:158px minmax(0,1fr);
  gap:clamp(14px,1.8vw,26px);
  padding:clamp(20px,2.4vw,30px) clamp(18px,2.2vw,28px);
}

/* the rail: where the convergence idea lives */
.case-clinical .cl-rail{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center}
.case-clinical .cl-rail-mark{
  display:grid;place-items:center;width:60px;height:60px;border-radius:50%;
  background:var(--cl-field-2);box-shadow:inset 0 0 0 1px rgba(60,94,180,.12);
  transition:background .45s var(--ease),box-shadow .45s var(--ease);
}
.case-clinical .cl-rail-mark svg{width:26px;height:26px;color:var(--cl-blue);stroke-width:2;transition:color .45s var(--ease)}
.case-clinical .cl-rail p{font-size:11.8px;line-height:1.5;font-weight:600;color:var(--cl-mute);max-width:19ch}
.case-clinical .cl-rail-arrows{
  position:absolute;left:50%;top:50%;translate:-14% -50%;
  width:104px;height:232px;overflow:visible;pointer-events:none;opacity:0;
  transition:opacity .5s var(--ease);
}
.case-clinical .cl-rail-arrows path{
  fill:none;stroke:var(--cl-hi);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:5 5;
}
.case-clinical .cl-rail-arrows .h1,.case-clinical .cl-rail-arrows .h2{stroke-dasharray:none;stroke-width:1.9}

/* the twelve */
.case-clinical .cl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(9px,1vw,13px)}
.case-clinical .cl-grid li{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;
  min-height:74px;padding:13px 15px 13px 13px;border-radius:15px;
  background:linear-gradient(160deg,#fff 52%,#f8fbfe 100%);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.1),0 2px 8px rgba(30,60,130,.04);
  font-size:12.9px;font-weight:600;line-height:1.35;color:var(--cl-copy);
  transition:transform .38s var(--ease),box-shadow .38s var(--ease),
             color .38s var(--ease),opacity .45s var(--ease),background .45s var(--ease);
}
.case-clinical .cl-grid .tico{
  display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:12px;
  background:#eef3fc;transition:background .4s var(--ease),transform .38s var(--ease);
}
.case-clinical .cl-grid .tico svg{width:18px;height:18px;color:var(--cl-blue);stroke-width:1.9;transition:color .4s var(--ease)}
.case-clinical .cl-grid li::after{
  content:"";position:absolute;right:12px;top:12px;width:7px;height:7px;border-radius:50%;
  background:#d3dcee;animation:none;transition:background .4s var(--ease),box-shadow .4s var(--ease);
}
.case-clinical .cl-grid li:hover{
  transform:translateY(-3px);color:var(--cl-ink);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.18),0 12px 26px rgba(30,60,130,.1);
}
.case-clinical .cl-grid li:hover .tico{background:var(--cl-blue);transform:scale(1.05)}
.case-clinical .cl-grid li:hover .tico svg{color:#fff}.case-clinical .cl-chal.is-conv .cl-rail-arrows{opacity:1}
.case-clinical .cl-chal.is-conv .cl-rail-mark{background:#fbe3e0;box-shadow:inset 0 0 0 1px var(--cl-hi-ln)}
.case-clinical .cl-chal.is-conv .cl-rail-mark svg{color:var(--cl-hi)}

/* the footer bar */
.case-clinical .cl-chal-foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;
  padding:16px clamp(18px,2.2vw,28px);
  background:rgba(255,255,255,.6);
  box-shadow:inset 0 1px 0 rgba(60,94,180,.09);
}
.case-clinical .cl-conv-btn{
  display:inline-flex;align-items:center;gap:9px;flex:none;
  padding:10px 18px;border-radius:11px;
  background:#fff;color:var(--cl-deep);
  box-shadow:inset 0 0 0 1.5px rgba(60,94,180,.22),0 2px 8px rgba(30,60,130,.05);
  font-size:12.8px;font-weight:700;
  transition:transform .32s var(--ease),box-shadow .32s var(--ease),background .32s var(--ease),color .32s var(--ease);
}
.case-clinical .cl-conv-btn svg{width:16px;height:16px;stroke-width:2;transition:transform .5s var(--ease)}
.case-clinical .cl-conv-btn:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1.5px var(--cl-blue),0 10px 22px rgba(60,94,180,.16)}
.case-clinical .cl-conv-btn:hover svg{transform:rotate(-90deg)}
.case-clinical .cl-conv-btn.is-on{background:var(--cl-blue);color:#fff;box-shadow:0 8px 20px rgba(60,94,180,.26)}
.case-clinical .cl-conv-btn.is-on:hover{box-shadow:0 12px 26px rgba(60,94,180,.32)}
.case-clinical .cl-conv-out{
  display:grid;gap:2px;padding-left:20px;
  box-shadow:inset 1px 0 0 rgba(60,94,180,.12);
  font-size:13.4px;line-height:1.5;color:var(--cl-copy);
}
.case-clinical .cl-conv-out b{font-weight:800;color:var(--cl-ink)}
.case-clinical .cl-chal.is-conv .cl-conv-out b{color:var(--cl-hi)}

/* the two closing notes, split by a dotted rule */
.case-clinical .cl-twosplit{
  position:relative;display:grid;grid-template-columns:1fr auto 1fr;
  gap:clamp(18px,2.6vw,44px);align-items:center;
  max-width:1060px;margin:clamp(26px,3vw,40px) auto 0;
}
.case-clinical .cl-ts{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:16px}
.case-clinical .cl-ts .ic{
  display:grid;place-items:center;width:42px;height:42px;flex:none;border-radius:13px;
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line-2),0 4px 12px rgba(30,60,130,.06);
  transition:transform .34s var(--ease),background .34s var(--ease);
}
.case-clinical .cl-ts .ic svg{width:20px;height:20px;color:var(--cl-blue);stroke-width:1.9}
.case-clinical .cl-ts:hover .ic{transform:scale(1.06);background:var(--cl-field-2)}
.case-clinical .cl-ts p{font-size:13.8px;line-height:1.68;color:var(--cl-copy)}
.case-clinical .cl-ts b{color:var(--cl-ink);font-weight:700}
.case-clinical .cl-ts-rule{
  position:relative;display:grid;place-items:center;align-self:stretch;width:1px;
  background:repeating-linear-gradient(180deg,rgba(60,94,180,.22) 0 4px,transparent 4px 9px);
}
.case-clinical .cl-ts-rule svg{
  width:26px;height:26px;padding:5px;border-radius:50%;
  background:#fff;box-shadow:inset 0 0 0 1px var(--cl-line-2);
  color:var(--cl-soft);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;
}

@media (max-width:1080px){
  .case-clinical .cl-grid{grid-template-columns:repeat(3,1fr)}
  .case-clinical .cl-chal-body{grid-template-columns:1fr}
  .case-clinical .cl-rail{flex-direction:row;gap:16px;text-align:left;justify-content:flex-start}
  .case-clinical .cl-rail p{max-width:34ch}
  .case-clinical .cl-rail-arrows{display:none}
  .case-clinical .cl-twosplit{grid-template-columns:1fr;gap:20px}
  .case-clinical .cl-ts-rule{width:auto;height:1px;background:repeating-linear-gradient(90deg,rgba(60,94,180,.22) 0 4px,transparent 4px 9px)}
}
@media (max-width:760px){
  .case-clinical .cl-grid{grid-template-columns:repeat(2,1fr)}
  .case-clinical .cl-grid li{min-height:70px;padding:11px 12px;font-size:12.2px;gap:10px}
  .case-clinical .cl-grid .tico{width:32px;height:32px;border-radius:10px}
  .case-clinical .cl-grid .tico svg{width:16px;height:16px}
  .case-clinical .cl-conv-out{padding-left:0;box-shadow:none;padding-top:12px}
  .case-clinical .cl-chal-foot{box-shadow:inset 0 1px 0 rgba(60,94,180,.09)}
}
@media (max-width:430px){
  .case-clinical .cl-grid{grid-template-columns:1fr}
}

/* ══════════════════════════════════════════════════════════
   THE SEMANTIC TEAM APPROACH
   ══════════════════════════════════════════════════════════ */
.case-clinical .cl-eyebrow--ico{padding-left:9px;gap:8px}
.case-clinical .cl-eyebrow--ico::before{display:none}
.case-clinical .cl-eyebrow--ico svg{width:15px;height:15px;color:var(--cl-blue);stroke-width:1.9}
.case-clinical .cl-head p b.hl{color:var(--cl-blue);font-weight:700}

.case-clinical .cl-spec-wrap{position:relative}
.case-clinical .cl-spec-net{position:absolute;inset:0;z-index:0;pointer-events:none}
.case-clinical .cl-spec-net i{position:absolute;display:block;background:rgba(60,94,180,.16)}
.case-clinical .cl-spec-net .h{height:1px;width:26px;translate:-50% -50%}
.case-clinical .cl-spec-net .r1{top:50%}
.case-clinical .cl-spec-net .r2{top:50%}
.case-clinical .cl-spec-net .h.r1{top:25%}
.case-clinical .cl-spec-net .h.r2{top:75%}
.case-clinical .cl-spec-net .c1{left:33.33%}
.case-clinical .cl-spec-net .c2{left:66.67%}
.case-clinical .cl-spec-net .v{left:50%;top:50%;width:1px;height:26px;translate:-50% -50%}
.case-clinical .cl-spec-net .knot{
  left:50%;top:50%;width:7px;height:7px;border-radius:50%;translate:-50% -50%;
  background:var(--cl-blue);box-shadow:0 0 0 4px rgba(60,94,180,.12);
}

.case-clinical .cl-spec{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.5vw,20px)}
.case-clinical .cl-spec li{
  position:relative;overflow:hidden;isolation:isolate;
  display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 1fr auto;
  gap:0 15px;align-items:center;
  padding:clamp(18px,1.9vw,24px);border-radius:19px;
  background:linear-gradient(162deg,#ffffff 46%,#f7fafe 100%);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.1),0 6px 20px rgba(30,60,130,.05);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);
}
.case-clinical .cl-spec li:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px rgba(60,94,180,.2),0 18px 38px rgba(30,60,130,.12)}
.case-clinical .cl-spec li:last-child{box-shadow:inset 0 0 0 1.6px var(--cl-soft),0 16px 38px rgba(30,60,130,.13)}
.case-clinical .cl-spec li:last-child:hover{box-shadow:inset 0 0 0 1.6px var(--cl-blue),0 22px 46px rgba(30,60,130,.16)}
.case-clinical .cl-spec .ic{
  grid-column:1;grid-row:1;
  display:grid;place-items:center;width:46px;height:46px;border-radius:14px;
  background:#eef3fc;box-shadow:none;
}
.case-clinical .cl-spec .ic svg{width:22px;height:22px;color:var(--cl-blue);stroke-width:1.9}
.case-clinical .cl-spec b{grid-column:2;grid-row:1;font-size:16.5px;font-weight:800;letter-spacing:-.024em;color:var(--cl-ink)}
.case-clinical .cl-spec p{grid-column:1/-1;grid-row:2;margin-top:17px;font-size:13.4px;line-height:1.6;color:var(--cl-copy)}
.case-clinical .cl-spec .pill{grid-column:1/-1;grid-row:3;justify-self:start;margin-top:17px}

/* each specialist carries its own faint corner texture */
.case-clinical .cl-spec li::after{
  content:"";position:absolute;right:0;top:0;width:118px;height:104px;z-index:-1;pointer-events:none;
  -webkit-mask-image:radial-gradient(122% 118% at 100% 0,#000 6%,transparent 72%);
          mask-image:radial-gradient(122% 118% at 100% 0,#000 6%,transparent 72%);
}
.case-clinical .cl-spec li:nth-child(1)::after,
.case-clinical .cl-spec li:nth-child(3)::after,
.case-clinical .cl-spec li:nth-child(4)::after{
  background-image:radial-gradient(rgba(60,94,180,.22) 1.25px,transparent 1.25px);background-size:13px 13px;
}
.case-clinical .cl-spec li:nth-child(2)::after{
  background-image:repeating-linear-gradient(135deg,rgba(60,94,180,.16) 0 1px,transparent 1px 8px);
}
.case-clinical .cl-spec li:nth-child(5)::after{
  background-image:
    repeating-linear-gradient(90deg,rgba(60,94,180,.16) 0 1px,transparent 1px 17px),
    repeating-linear-gradient(180deg,rgba(60,94,180,.16) 0 1px,transparent 1px 17px);
}
.case-clinical .cl-spec li:nth-child(6)::after{
  background-image:repeating-radial-gradient(circle at 118% -14%,transparent 0 11px,rgba(60,94,180,.16) 11px 12px);
}

/* shared context bar */
.case-clinical .cl-mem{
  position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:14px clamp(16px,2vw,28px);
  margin-top:clamp(16px,2vw,24px);padding:15px clamp(18px,2vw,26px);border-radius:19px;
  background:#fff;box-shadow:inset 0 0 0 1px rgba(60,94,180,.1),0 8px 26px rgba(30,60,130,.06);
}
.case-clinical .cl-mem::before,.case-clinical .cl-mem::after{
  content:"";position:absolute;top:50%;width:clamp(16px,3vw,42px);height:1px;translate:0 -50%;
  background-image:linear-gradient(90deg,rgba(60,94,180,.3) 45%,transparent 0);background-size:5px 1px;
}
.case-clinical .cl-mem::before{right:100%}
.case-clinical .cl-mem::after{left:100%}
.case-clinical .cl-mem-h{display:inline-flex;align-items:center;gap:13px;flex:none}
.case-clinical .cl-mem-ic{
  display:grid;place-items:center;width:46px;height:46px;flex:none;border-radius:50%;
  background:var(--cl-field-2);box-shadow:inset 0 0 0 1px rgba(60,94,180,.1);
}
.case-clinical .cl-mem-ic svg{width:23px;height:23px;color:var(--cl-blue);stroke-width:1.8}
.case-clinical .cl-mem-h > span{font-size:11.6px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;line-height:1.35;color:var(--cl-ink)}
.case-clinical .cl-mem ul{display:flex;flex-wrap:wrap;gap:8px}
.case-clinical .cl-mem li{
  display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:11px;
  background:#fff;box-shadow:inset 0 0 0 1px rgba(60,94,180,.12);
  font-size:12.2px;font-weight:700;color:var(--cl-copy);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),color .3s var(--ease);
}
.case-clinical .cl-mem li svg{width:15px;height:15px;flex:none;color:var(--cl-soft);stroke-width:1.9;transition:color .3s var(--ease)}
.case-clinical .cl-mem li:hover{transform:translateY(-2px);color:var(--cl-ink);box-shadow:inset 0 0 0 1px var(--cl-soft),0 7px 16px rgba(30,60,130,.1)}
.case-clinical .cl-mem li:hover svg{color:var(--cl-blue)}

/* the closing note, ruled on both sides */
.case-clinical .cl-teamnote{
  position:relative;display:flex;align-items:center;justify-content:center;gap:18px;
  margin-top:clamp(30px,3.4vw,46px);
}
.case-clinical .cl-teamnote::before,.case-clinical .cl-teamnote::after{
  content:"";flex:1 1 0;max-width:190px;height:1px;
  background-image:linear-gradient(90deg,rgba(60,94,180,.28) 45%,transparent 0);background-size:6px 1px;
}
.case-clinical .cl-teamnote p{
  flex:none;max-width:56ch;text-align:center;font-size:13.8px;line-height:1.62;color:var(--cl-copy);
}
.case-clinical .cl-teamnote-ic{
  position:absolute;left:50%;top:-30px;translate:-50% 0;
  display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  background:#fff;box-shadow:inset 0 0 0 1px rgba(60,94,180,.12),0 4px 12px rgba(30,60,130,.06);
}
.case-clinical .cl-teamnote-ic svg{width:17px;height:17px;color:var(--cl-blue);stroke-width:1.9}

@media (max-width:1080px){
  .case-clinical .cl-spec{grid-template-columns:repeat(2,1fr)}
  .case-clinical .cl-spec-net{display:none}
}
@media (max-width:760px){
  .case-clinical .cl-spec{grid-template-columns:1fr}
  .case-clinical .cl-mem{flex-direction:column;align-items:flex-start}
  .case-clinical .cl-mem::before,.case-clinical .cl-mem::after{display:none}
  .case-clinical .cl-teamnote::before,.case-clinical .cl-teamnote::after{display:none}
  .case-clinical .cl-teamnote p{font-size:13px}
}

/* ---------- domain chips, final ----------
   The gradient-in-the-border trick reads as a broken rectangle at chip
   scale: the 38% swatch cuts off mid-edge, and at 100% it becomes a hard
   frame. One hairline and a filling icon tile say the same thing better. */
.case-clinical .cl-domains button{
  display:inline-flex;align-items:center;gap:11px;
  padding:9px 18px 9px 9px;
  border:0;border-radius:14px;
  background:linear-gradient(158deg,#ffffff 46%,#f6fafe 100%);
  background-image:linear-gradient(158deg,#ffffff 46%,#f6fafe 100%);
  background-size:auto;background-origin:padding-box;background-clip:padding-box;
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.12),0 2px 8px rgba(30,60,130,.05);
  will-change:auto;
  transition:transform .34s var(--ease),box-shadow .34s var(--ease),
             background .34s var(--ease),color .3s var(--ease);
}
.case-clinical .cl-domains li:hover{
  transform:none;
  box-shadow:none;
}
.case-clinical .cl-domains button:hover,
.case-clinical .cl-domains button:focus-visible{
  transform:translateY(-3px);
  box-shadow:inset 0 0 0 1.4px var(--cl-blue),0 14px 28px rgba(30,60,130,.14);
}
.case-clinical .cl-domains button[aria-pressed="true"]{
  background-image:linear-gradient(150deg,var(--cl-blue),var(--cl-deep));
  color:#fff;transform:translateY(-3px);
  box-shadow:inset 0 0 0 1.4px var(--cl-deep),0 12px 26px rgba(60,94,180,.28);
}

/* ---------- challenge tiles are pickable ---------- */
.case-clinical .cl-grid li{all:unset;display:block;position:relative}
.case-clinical .cl-grid button{
  position:relative;overflow:hidden;width:100%;text-align:left;
  display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;
  min-height:74px;padding:13px 15px 13px 13px;border-radius:15px;
  background:linear-gradient(160deg,#fff 52%,#f8fbfe 100%);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.1),0 2px 8px rgba(30,60,130,.04);
  font-size:12.9px;font-weight:600;line-height:1.35;color:var(--cl-copy);
  transition:transform .38s var(--ease),box-shadow .38s var(--ease),
             color .38s var(--ease),opacity .45s var(--ease),background .45s var(--ease);
}
.case-clinical .cl-grid button::after{
  content:"";position:absolute;right:12px;top:12px;width:7px;height:7px;border-radius:50%;
  background:#d3dcee;transition:background .4s var(--ease),box-shadow .4s var(--ease);
}
.case-clinical .cl-grid button:hover{
  transform:translateY(-3px);color:var(--cl-ink);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.2),0 12px 26px rgba(30,60,130,.1);
}
.case-clinical .cl-grid button:hover .tico{background:var(--cl-blue);transform:scale(1.05)}
.case-clinical .cl-grid button:hover .tico svg{color:#fff}
/* picked by the reader */
.case-clinical .cl-grid button[aria-pressed="true"]{
  color:var(--cl-ink);
  background:linear-gradient(155deg,#fff 38%,#eaf0fc 100%);
  box-shadow:inset 0 0 0 1.5px var(--cl-soft),0 10px 24px rgba(30,60,130,.11);
}
.case-clinical .cl-grid button[aria-pressed="true"] .tico{background:var(--cl-blue)}
.case-clinical .cl-grid button[aria-pressed="true"] .tico svg{color:#fff}
.case-clinical .cl-grid button[aria-pressed="true"]::after{background:var(--cl-blue);box-shadow:0 0 0 4px rgba(60,94,180,.14)}
/* the pattern the team finds wins over the reader's pick */
.case-clinical .cl-grid.is-conv button{opacity:.55}.case-clinical .cl-pick-out{
  display:flex;align-items:center;gap:11px;flex:1 1 100%;min-height:0;
  font-size:13px;font-weight:700;color:var(--cl-deep);
}
.case-clinical .cl-pick-out:empty{display:none}
.case-clinical .cl-pick-out i{
  display:grid;place-items:center;width:26px;height:26px;flex:none;border-radius:9px;
  background:var(--cl-blue);color:#fff;font-size:12.5px;font-weight:800;font-style:normal;
}

/* Focus rings follow the shape they belong to. The legacy outline rule that
   used to sit here painted a sharp rectangle around rounded controls; it was
   already dead (killed by outline:0!important further down) and is now gone.
   The live substitute rings live in the remediation layer at the end. */

/* ══════════════════════════════════════════════════════════
   SECTION GROUNDS, redone
   The webp textures read as heavy, half-covered photos. Replace them
   with a whisper-quiet dot field + a single soft brand glow · the same
   clean, near-white ground the mockups use. Nothing photographic.
   ══════════════════════════════════════════════════════════ */
.case-clinical .has-bg{--bgi:none!important}
.case-clinical .has-bg::before{
  background-image:
    radial-gradient(720px 460px at 82% 8%,rgba(70,104,190,.06),transparent 60%),
    radial-gradient(560px 420px at 6% 92%,rgba(70,104,190,.05),transparent 62%),
    radial-gradient(rgba(60,94,180,.05) 1px,transparent 1px)!important;
  background-size:auto,auto,26px 26px!important;
  background-position:0 0,0 0,0 0!important;
  opacity:1!important;
}
.case-clinical .cl-wrap.has-bg::before{left:50%;right:auto;width:100vw;transform:translateX(-50%)}
/* the pale bands and the deep bands keep their fill; the dots ride on top */
.case-clinical .cl-band.has-bg{background:var(--cl-field)}
.case-clinical .cl-band--deep.has-bg{background:linear-gradient(180deg,var(--cl-field-2),var(--cl-field) 62%)}
/* the two dark sections never take the dot field */
.case-clinical #team.has-bg::before{opacity:.5!important}

/* the hero glow stays, but no photo underneath */
.case-clinical #clhero::before{
  background-image:
    radial-gradient(760px 380px at 80% 30%,rgba(88,128,220,.13),transparent 60%),
    radial-gradient(520px 340px at 4% 8%,rgba(60,94,180,.06),transparent 64%)!important;
  background-size:auto!important;opacity:1!important;
}

/* ══════════════════════════════════════════════════════════
   NO SHARP RECTANGLES · anywhere.
   A focus outline on a rounded control renders as a hard-cornered
   box in some paint paths. Kill every outline on these controls and
   use a rounded box-shadow ring instead, which always follows the
   element's border-radius.
   ══════════════════════════════════════════════════════════ */
.case-clinical .cl-domains button,
.case-clinical .cl-grid button,
.case-clinical .cl-tabs button,
.case-clinical .cl-conv-btn,
.case-clinical #queue button,
.case-clinical .cl-never button,
.case-clinical .cl-sig-row button,
.case-clinical .cl-ring .nd{outline:none!important}

.case-clinical .cl-domains button:focus-visible{
  box-shadow:inset 0 0 0 1.6px var(--cl-blue),0 0 0 3px rgba(60,94,180,.22),0 12px 26px rgba(30,60,130,.14);
}
.case-clinical .cl-grid button:focus-visible{
  box-shadow:inset 0 0 0 1.6px var(--cl-blue),0 0 0 3px rgba(60,94,180,.2);
}
.case-clinical .cl-tabs button:focus-visible,
.case-clinical .cl-conv-btn:focus-visible,
.case-clinical #queue button:focus-visible,
.case-clinical .cl-never button:focus-visible,
.case-clinical .cl-sig-row button:focus-visible{
  box-shadow:0 0 0 3px rgba(60,94,180,.28)!important;
}
/* the ring nodes keep their round focus via the dot's stroke */
.case-clinical .cl-ring .nd:focus-visible .dot{stroke:var(--cl-blue);stroke-width:2.6}

/* ---------- rail arrows: short, in the gutter, never over text ---------- */
.case-clinical .cl-rail{position:relative}
.case-clinical .cl-rail-arrows{
  position:absolute;left:auto;right:-22px;top:50%;translate:0 -50%;
  width:34px;height:82px;overflow:visible;opacity:0;pointer-events:none;
  transition:opacity .5s var(--ease);
}
.case-clinical .cl-rail-arrows .ln,.case-clinical .cl-rail-arrows .hd{
  fill:none;stroke:var(--cl-hi);stroke-linecap:round;stroke-linejoin:round;
}
.case-clinical .cl-rail-arrows .ln{stroke-width:1.6;stroke-dasharray:4 4}
.case-clinical .cl-rail-arrows .hd{stroke-width:1.9}
.case-clinical .cl-chal.is-conv .cl-rail-arrows{opacity:.9}
@media (max-width:1080px){.case-clinical .cl-rail-arrows{display:none}}

/* ---------- converge now emphasises the READER'S picks, not a fixed set ---------- */
.case-clinical .cl-grid.is-conv button{opacity:.5;transition:opacity .45s var(--ease),box-shadow .4s var(--ease),background .45s var(--ease),color .4s var(--ease),transform .4s var(--ease)}
.case-clinical .cl-grid.is-conv button[aria-pressed="true"]{
  opacity:1;color:var(--cl-ink);transform:none;
  background:linear-gradient(155deg,#fff 38%,#fdf0ee 100%);
  box-shadow:inset 0 0 0 1.5px var(--cl-hi-ln),0 10px 24px rgba(180,66,55,.1);
}
.case-clinical .cl-grid.is-conv button[aria-pressed="true"] .tico{background:#fbe3e0}
.case-clinical .cl-grid.is-conv button[aria-pressed="true"] .tico svg{color:var(--cl-hi)}
.case-clinical .cl-grid.is-conv button[aria-pressed="true"]::after{background:var(--cl-hi);box-shadow:0 0 0 4px rgba(194,69,59,.13)}
.case-clinical .cl-grid.is-conv button[aria-pressed="true"]:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1.5px var(--cl-hi),0 14px 30px rgba(180,66,55,.16)}
/* the converge glyph pulls inward on hover; the reset glyph keeps its spin */
.case-clinical .cl-conv-btn:not(.is-on):hover svg{transform:scale(.86)}
.case-clinical .cl-conv-btn.is-on:hover svg{transform:rotate(-90deg)}

/* ══════════════════════════════════════════════════════════
   REFERENCE-ALIGNED CHALLENGE + SEMANTIC TEAM
   Visual-only refinements. Existing controls and state classes stay intact.
   ══════════════════════════════════════════════════════════ */

/* Challenge · wider editorial canvas and stronger signal cards. */
.case-clinical #challenge{
  width:min(1460px,calc(100% - clamp(32px,5vw,64px)));
  padding-block:48px 60px;
}
.case-clinical #challenge .cl-head{
  max-width:980px;
  margin-bottom:26px;
}
.case-clinical #challenge .cl-eyebrow,
.case-clinical #team .cl-eyebrow{
  padding:7px 16px 7px 14px;
  font-size:12px;
  letter-spacing:.14em;
}
.case-clinical #challenge .cl-head h2,
.case-clinical #team .cl-head h2{
  font-size:clamp(42px,3.35vw,58px);
  line-height:1.02;
  letter-spacing:-.047em;
}
.case-clinical #challenge .cl-head p{
  margin-top:22px;
  font-size:17px;
  line-height:1.6;
}
.case-clinical #challenge .cl-chal{
  border-radius:23px;
  background:linear-gradient(168deg,rgba(255,255,255,.985),rgba(248,250,254,.95));
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.1),0 18px 46px rgba(30,60,130,.075);
}
.case-clinical #challenge .cl-chal-body{
  grid-template-columns:184px minmax(0,1fr);
  gap:28px;
  padding:24px 30px 22px;
}
.case-clinical #challenge .cl-rail{gap:15px}
.case-clinical #challenge .cl-rail-mark{
  width:68px;
  height:68px;
  box-shadow:0 0 0 10px rgba(60,94,180,.04),inset 0 0 0 1px rgba(60,94,180,.12);
}
.case-clinical #challenge .cl-rail-mark svg{width:30px;height:30px}
.case-clinical #challenge .cl-rail p{
  max-width:17ch;
  font-size:13.5px;
  line-height:1.5;
  color:var(--cl-deep);
}
.case-clinical #challenge .cl-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px 22px;
}
.case-clinical #challenge .cl-grid button{
  min-height:92px;
  padding:14px 18px;
  gap:16px;
  border-radius:15px;
  font-size:15px;
  line-height:1.35;
  color:var(--cl-ink);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.13),0 5px 15px rgba(30,60,130,.045);
}
.case-clinical #challenge .cl-grid .tico{
  width:52px;
  height:52px;
  border-radius:50%;
}
.case-clinical #challenge .cl-grid .tico svg{width:25px;height:25px}
.case-clinical #challenge .cl-grid button::after{right:14px;top:14px}
.case-clinical #challenge .cl-grid.is-conv button{opacity:1}
.case-clinical #challenge .cl-grid.is-conv button[aria-pressed="true"]{
  background:linear-gradient(155deg,#fff 34%,#fff3f1 100%);
  box-shadow:inset 0 0 0 1.5px #ef8179,0 10px 24px rgba(180,66,55,.11);
}
.case-clinical #challenge .cl-grid.is-conv button[aria-pressed="true"] .tico{
  background:#fde7e4;
  box-shadow:0 0 0 9px rgba(194,69,59,.035);
}
.case-clinical #challenge .cl-chal-foot{
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr);
  align-items:center;
  gap:20px;
  min-height:86px;
  padding:16px 34px 16px 220px;
  background:rgba(255,255,255,.82);
}
.case-clinical #challenge .cl-conv-btn,
.case-clinical #challenge .cl-conv-btn.is-on{
  min-height:48px;
  padding:11px 22px;
  background:#fff;
  color:var(--cl-blue);
  box-shadow:inset 0 0 0 1.5px var(--cl-soft),0 3px 10px rgba(30,60,130,.05);
  font-size:14px;
}
.case-clinical #challenge .cl-conv-btn.is-on:hover{
  color:var(--cl-deep);
  box-shadow:inset 0 0 0 1.5px var(--cl-blue),0 10px 22px rgba(60,94,180,.14);
}
.case-clinical .cl-conv-shield{
  position:relative;
  display:grid;
  place-items:center;
  width:40px;
  height:44px;
  margin-left:18px;
  color:#fff;
  background:linear-gradient(180deg,#5277d0,var(--cl-blue));
  clip-path:polygon(50% 0,91% 16%,86% 66%,50% 100%,14% 66%,9% 16%);
}
.case-clinical .cl-conv-shield::before{
  content:"";
  position:absolute;
  right:calc(100% + 18px);
  width:1px;
  height:48px;
  background:var(--cl-line);
}
.case-clinical .cl-conv-shield svg{width:18px;height:18px;stroke-width:2}
.case-clinical #challenge .cl-conv-out{
  padding-left:0;
  box-shadow:none;
  font-size:14px;
  line-height:1.45;
}
.case-clinical #challenge .cl-chal.is-conv .cl-conv-out b{color:var(--cl-ink)}
.case-clinical #challenge .cl-pick-out{grid-column:1/-1}
.case-clinical #challenge .cl-chal.is-conv .cl-pick-out{display:none}
.case-clinical #challenge .cl-twosplit{
  max-width:1140px;
  margin-top:38px;
  gap:48px;
}
.case-clinical #challenge .cl-ts{gap:18px}
.case-clinical #challenge .cl-ts .ic{width:48px;height:48px;border-radius:50%}
.case-clinical #challenge .cl-ts p{font-size:14.5px;line-height:1.7}

/* Semantic Team · white canvas, larger specialist cards, single memory rail. */
.case-clinical #team.cl-band--deep.has-bg{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding-block:44px 46px;
  background:#fff;
}
.case-clinical #team.has-bg::before{
  inset:0;
  z-index:0;
  width:auto;
  transform:none;
  opacity:.7!important;
  background-image:radial-gradient(rgba(60,94,180,.2) 1.15px,transparent 1.2px)!important;
  background-size:12px 12px!important;
  background-position:7% 5%!important;
  -webkit-mask-image:radial-gradient(ellipse 145px 92px at 9% 8%,#000 4%,transparent 74%);
          mask-image:radial-gradient(ellipse 145px 92px at 9% 8%,#000 4%,transparent 74%);
}
.case-clinical #team::after{
  content:"";
  position:absolute;
  z-index:0;
  right:-90px;
  top:-170px;
  width:560px;
  height:420px;
  border-radius:50%;
  pointer-events:none;
  opacity:.7;
  background:repeating-radial-gradient(circle at 100% 0,transparent 0 57px,rgba(60,94,180,.2) 58px 59px);
  -webkit-mask-image:linear-gradient(135deg,transparent 12%,#000 45%,transparent 90%);
          mask-image:linear-gradient(135deg,transparent 12%,#000 45%,transparent 90%);
}
.case-clinical #team > .cl-wrap{
  position:relative;
  z-index:1;
  width:min(1264px,calc(100% - clamp(32px,5vw,64px)));
}
.case-clinical #team .cl-head{
  max-width:980px;
  margin-bottom:28px;
}
.case-clinical #team .cl-head p{
  margin-top:22px;
  font-size:16.5px;
  line-height:1.55;
}
.case-clinical #team .cl-spec{gap:20px 24px}
.case-clinical #team .cl-spec li{
  min-height:214px;
  height:214px;
  padding:20px 24px;
  border-radius:18px;
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.14),0 10px 28px rgba(30,60,130,.075);
}
.case-clinical #team .cl-spec li:last-child{
  box-shadow:inset 0 0 0 1.7px #7395e3,0 18px 40px rgba(40,78,164,.13);
}
.case-clinical #team .cl-spec .ic{width:54px;height:54px;border-radius:14px}
.case-clinical #team .cl-spec .ic svg{width:26px;height:26px}
.case-clinical #team .cl-spec b{font-size:18px}
.case-clinical #team .cl-spec p{
  margin-top:18px;
  font-size:14.7px;
  line-height:1.5;
}
.case-clinical #team .cl-spec .pill{
  margin-top:14px;
  padding:5px 12px;
  font-size:11px;
}
.case-clinical #team .cl-mem{
  flex-wrap:nowrap;
  gap:22px;
  min-height:92px;
  margin:20px -34px 0;
  padding:14px 26px;
  border-radius:16px;
  box-shadow:inset 0 0 0 1.5px #7da0ef,0 14px 34px rgba(30,60,130,.09);
}
.case-clinical #team .cl-mem-h{min-width:220px}
.case-clinical #team .cl-mem-ic{width:58px;height:58px}
.case-clinical #team .cl-mem-ic svg{width:28px;height:28px}
.case-clinical #team .cl-mem-h > span{font-size:12.5px}
.case-clinical #team .cl-mem ul{
  flex:1 1 auto;
  flex-wrap:nowrap;
  justify-content:space-between;
  gap:8px;
}
.case-clinical #team .cl-mem li{
  padding:8px 11px;
  border-radius:9px;
  white-space:nowrap;
  font-size:11.5px;
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.16),0 4px 12px rgba(30,60,130,.05);
}
.case-clinical #team .cl-teamnote{margin-top:48px}
.case-clinical #team .cl-teamnote p{font-size:14.5px;line-height:1.55}
.case-clinical #team .cl-teamnote::before,
.case-clinical #team .cl-teamnote::after{max-width:220px;background-size:7px 1px}

@media (max-width:1080px){
  .case-clinical #challenge{width:min(100% - 36px,920px)}
  .case-clinical #challenge .cl-chal-body{grid-template-columns:1fr;gap:18px}
  .case-clinical #challenge .cl-rail{flex-direction:row;text-align:left;justify-content:flex-start}
  .case-clinical #challenge .cl-rail p{max-width:34ch}
  .case-clinical #challenge .cl-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .case-clinical #challenge .cl-chal-foot{grid-template-columns:auto auto minmax(0,1fr);padding-left:24px}
  .case-clinical #team .cl-spec{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case-clinical #team .cl-spec-net{display:none}
  .case-clinical #team .cl-mem{margin-inline:0;flex-wrap:wrap}
  .case-clinical #team .cl-mem ul{flex-wrap:wrap;justify-content:flex-start}
}
@media (max-width:760px){
  .case-clinical #challenge,
  .case-clinical #team.cl-band--deep.has-bg{padding-block:42px}
  .case-clinical #challenge .cl-head h2,
  .case-clinical #team .cl-head h2{font-size:clamp(34px,10vw,42px)}
  .case-clinical #challenge .cl-head p,
  .case-clinical #team .cl-head p{font-size:15px}
  .case-clinical #challenge .cl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case-clinical #challenge .cl-grid button{min-height:80px;padding:12px;font-size:13px;gap:11px}
  .case-clinical #challenge .cl-grid .tico{width:42px;height:42px}
  .case-clinical #challenge .cl-grid .tico svg{width:20px;height:20px}
  .case-clinical #challenge .cl-chal-foot{grid-template-columns:auto 1fr;gap:14px;padding:16px}
  .case-clinical .cl-conv-shield{display:none}
  .case-clinical #challenge .cl-conv-out{font-size:12.5px}
  .case-clinical #challenge .cl-pick-out{grid-column:1/-1}
  .case-clinical #team .cl-spec{grid-template-columns:1fr}
  .case-clinical #team .cl-spec li{min-height:0;height:auto}
  .case-clinical #team .cl-mem{flex-direction:column;align-items:flex-start}
  .case-clinical #team .cl-mem-h{min-width:0}
  .case-clinical #team .cl-mem ul{width:100%}
  .case-clinical #team .cl-mem li{white-space:normal}
}
@media (max-width:430px){
  .case-clinical #challenge .cl-grid{grid-template-columns:1fr}
  .case-clinical #challenge .cl-chal-foot{grid-template-columns:1fr}
}

/* ---------- clean interaction states ----------
   Some browsers paint an outer focus layer as a square bounding box even
   when the control itself is rounded. Keep the accessible state inside the
   component so hover, click and keyboard focus never create sharp frames. */
.case-clinical button:focus,
.case-clinical button:focus-visible,
.case-clinical a:focus,
.case-clinical a:focus-visible,
.case-clinical [tabindex]:focus,
.case-clinical [tabindex]:focus-visible{
  outline:0!important;
  outline-offset:0!important;
}
.case-clinical .cl-domains li:hover,
.case-clinical .cl-domains li:focus-within,
.case-clinical .cl-grid li:hover,
.case-clinical .cl-grid li:focus-within{
  outline:0!important;
  box-shadow:none!important;
}
/* The marker belongs to the button. The legacy marker on the list item
   otherwise sits beside it and makes every card look as if it has two dots. */
.case-clinical .cl-grid li::after{
  content:none!important;
  display:none!important;
}
.case-clinical .cl-domains button:focus-visible{
  box-shadow:inset 0 0 0 1.6px var(--cl-blue),0 12px 26px rgba(30,60,130,.14)!important;
}
.case-clinical .cl-grid button:focus-visible{
  box-shadow:inset 0 0 0 1.6px var(--cl-blue),0 10px 22px rgba(30,60,130,.1)!important;
}
.case-clinical .cl-tabs button:focus-visible,
.case-clinical .cl-conv-btn:focus-visible,
.case-clinical #queue button:focus-visible,
.case-clinical .cl-never button:focus-visible,
.case-clinical .cl-sig-row button:focus-visible{
  box-shadow:inset 0 0 0 1.6px var(--cl-blue),0 8px 20px rgba(30,60,130,.12)!important;
}

/* Center the signal-card grid on the same page axis as its heading.
   The third, empty rail mirrors the explanatory rail on the left, so the
   cards no longer get pushed to the right. */
@media (min-width:1081px){
  .case-clinical #challenge .cl-chal-body{
    grid-template-columns:120px minmax(0,1fr) 120px;
    gap:18px;
  }
  .case-clinical #challenge .cl-rail{grid-column:1}
  .case-clinical #challenge .cl-grid{grid-column:2}
}

/* ══════════════════════════════════════════════════════════
   CONTINUITY · reference composition
   Large editorial copy, persistent-monitoring timeline and a clear
   continuous-awareness state. Visual only; no page behaviour changes.
   ══════════════════════════════════════════════════════════ */
.case-clinical #continuous{
  position:relative;
  padding-block:clamp(70px,6.2vw,106px) clamp(82px,7vw,118px);
  background:
    radial-gradient(760px 520px at 72% 36%,rgba(86,124,214,.14),transparent 66%),
    radial-gradient(580px 430px at 10% 82%,rgba(86,124,214,.055),transparent 68%),
    linear-gradient(180deg,#fbfcff 0%,#f6f9ff 100%)!important;
}
.case-clinical #continuous.has-bg::before{
  inset:0;
  z-index:-1;
  opacity:.72!important;
  transform:none!important;
  background-image:radial-gradient(rgba(60,94,180,.23) 1.15px,transparent 1.2px)!important;
  background-size:12px 12px!important;
  background-position:55% 3%!important;
  -webkit-mask-image:radial-gradient(ellipse 180px 116px at 55% 4%,#000 4%,transparent 75%);
          mask-image:radial-gradient(ellipse 180px 116px at 55% 4%,#000 4%,transparent 75%);
}
.case-clinical #continuous .cl-cont{
  width:min(1480px,calc(100% - clamp(64px,14vw,240px)));
  grid-template-columns:minmax(0,.88fr) minmax(560px,1.12fr);
  gap:clamp(48px,5.2vw,88px);
  align-items:center;
}
.case-clinical #continuous .cl-cont-copy{padding-top:8px}
.case-clinical #continuous .cl-eyebrow{
  margin-bottom:36px;
  padding:8px 18px 8px 16px;
  font-size:12px;
  letter-spacing:.14em;
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.16),0 8px 20px rgba(30,60,130,.08);
}
.case-clinical #continuous .cl-cont h2{
  max-width:640px;
  margin:0 0 24px;
  font-size:clamp(42px,3.55vw,60px);
  line-height:1.12;
  letter-spacing:-.048em;
  color:var(--cl-ink);
}
.case-clinical #continuous .cl-cont h2 span{color:var(--cl-blue)}
.case-clinical #continuous .cl-cont-copy > p{
  max-width:670px;
  font-size:clamp(15px,1.08vw,18px);
  line-height:1.92;
  color:var(--cl-copy);
}
.case-clinical #continuous .cl-shift{
  display:grid;
  grid-template-columns:82px minmax(0,1fr);
  align-items:center;
  gap:24px;
  margin-top:30px;
  padding:26px 30px;
  border-radius:24px;
  background:rgba(255,255,255,.72);
  box-shadow:inset 0 0 0 1.4px rgba(60,94,180,.2),0 12px 28px rgba(30,60,130,.045);
  backdrop-filter:blur(4px);
}
.case-clinical #continuous .cl-shift-icon{
  display:grid;
  place-items:center;
  width:76px;
  height:76px;
  border-radius:50%;
  background:var(--cl-field-2);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.1);
}
.case-clinical #continuous .cl-shift-icon svg{width:36px;height:36px;color:var(--cl-blue);stroke-width:2}
.case-clinical #continuous .cl-shift p{
  margin:0;
  font-size:clamp(15px,1.12vw,18px);
  line-height:1.62;
  font-weight:700;
  color:var(--cl-ink);
}
.case-clinical #continuous .cl-shift b{font-weight:700;color:var(--cl-ink)}
.case-clinical #continuous .cl-shift strong{font-weight:800;color:var(--cl-blue)}
.case-clinical #continuous .cl-shift .ar{display:inline;width:17px;height:17px;margin:0 7px;color:var(--cl-blue);vertical-align:-3px}

.case-clinical #continuous .cl-cont-visual{position:relative;padding-bottom:88px}
.case-clinical #continuous .cl-stack{
  padding:0 34px 16px;
  border-radius:26px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.16),0 24px 54px rgba(30,60,130,.11);
  backdrop-filter:blur(7px);
}
.case-clinical #continuous .cl-stack-top{
  min-height:88px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  box-shadow:inset 0 -1px 0 rgba(60,94,180,.09);
}
.case-clinical #continuous .cl-stack-h{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin:0;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.055em;
  color:var(--cl-copy);
}
.case-clinical #continuous .cl-stack-h b{font-weight:800;color:var(--cl-ink)}
.case-clinical #continuous .cl-stack-h svg{width:17px;height:17px;color:var(--cl-blue);stroke-width:2}
.case-clinical #continuous .cl-stack-status{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex:none;
  padding:7px 14px;
  border-radius:999px;
  background:#ecf8f2;
  box-shadow:inset 0 0 0 1px rgba(18,153,111,.12);
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.055em;
  text-transform:uppercase;
  color:var(--cl-lo);
}
.case-clinical #continuous .cl-stack-status i,
.case-clinical #continuous .cl-awareness > i{width:7px;height:7px;border-radius:50%;background:#18ad77}
.case-clinical #continuous .cl-stack ol{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:0;
  padding:8px 0 2px 0;
}
.case-clinical #continuous .cl-stack ol::before{
  content:"";
  position:absolute;
  left:14px;
  top:42px;
  bottom:48px;
  width:1.5px;
  background:linear-gradient(180deg,var(--cl-blue),var(--cl-line) 22%,var(--cl-line) 78%,var(--cl-blue));
}
.case-clinical #continuous .cl-stack li{
  position:relative;
  display:grid;
  grid-template-columns:108px minmax(0,1fr);
  align-items:center;
  gap:18px;
  min-height:92px;
  padding:14px 0 14px 46px;
  font-size:13.5px;
  line-height:1.5;
  color:var(--cl-copy);
}
.case-clinical #continuous .cl-stack li:not(:last-child){box-shadow:inset 0 -1px 0 rgba(60,94,180,.09)}
.case-clinical #continuous .cl-stack li::before{
  content:"";
  position:absolute;
  z-index:1;
  left:5px;
  top:50%;
  width:18px;
  height:18px;
  translate:0 -50%;
  border-radius:50%;
  background:#fff;
  box-shadow:inset 0 0 0 4px #d6deef,0 0 0 3px #fff;
}
.case-clinical #continuous .cl-stack li.live::before{
  left:9px;
  width:10px;
  height:10px;
  background:var(--cl-blue);
  box-shadow:0 0 0 10px #fff,0 0 0 11px var(--cl-line);
  animation:cl-pulse2 2.4s infinite;
}
.case-clinical #continuous .cl-stack li.done::before{
  left:0;
  width:28px;
  height:28px;
  background:var(--cl-blue);
  box-shadow:0 7px 15px rgba(60,94,180,.26);
}
.case-clinical #continuous .cl-stack li.done::after{
  content:"";
  position:absolute;
  z-index:2;
  left:9px;
  top:50%;
  width:8px;
  height:4px;
  translate:0 -68%;
  rotate:-45deg;
  border-left:2px solid #fff;
  border-bottom:2px solid #fff;
}
.case-clinical #continuous .cl-stack time{
  justify-self:start;
  padding:7px 15px;
  border-radius:999px;
  background:#f2f6fd;
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.08),0 6px 13px rgba(30,60,130,.045);
  font-size:11px;
  font-weight:800;
  letter-spacing:.045em;
  text-transform:uppercase;
  color:var(--cl-blue);
  white-space:nowrap;
}
.case-clinical #continuous .cl-stack li > span{display:flex;flex-direction:column;gap:6px;min-width:0}
.case-clinical #continuous .cl-stack li b{font-size:13.2px;line-height:1.42;font-weight:750;color:var(--cl-ink)}
.case-clinical #continuous .cl-stack li.live b{color:var(--cl-blue)}
.case-clinical #continuous .cl-stack li em{font-size:12.8px;line-height:1.42;font-style:normal;color:var(--cl-copy)}

.case-clinical #continuous .cl-aware-route{
  position:absolute;
  left:16%;
  bottom:27px;
  width:112px;
  height:64px;
  border-left:2px dashed #6f99ea;
  border-bottom:2px dashed #6f99ea;
  border-radius:0 0 0 42px;
}
.case-clinical #continuous .cl-aware-route::before{
  content:"";
  position:absolute;
  left:-5px;
  top:-4px;
  width:8px;
  height:8px;
  border-top:2px solid #6f99ea;
  border-right:2px solid #6f99ea;
  rotate:-45deg;
}
.case-clinical #continuous .cl-aware-route::after{
  content:"";
  position:absolute;
  right:-1px;
  bottom:-5px;
  width:8px;
  height:8px;
  border-top:2px solid #6f99ea;
  border-right:2px solid #6f99ea;
  rotate:45deg;
}
.case-clinical #continuous .cl-awareness{
  position:absolute;
  right:13%;
  bottom:0;
  min-height:58px;
  display:flex;
  align-items:center;
  gap:17px;
  padding:7px 22px 7px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.94);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.09),0 15px 32px rgba(30,60,130,.11);
}
.case-clinical #continuous .cl-awareness > span{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:50%;
  background:linear-gradient(145deg,#4e78d7,var(--cl-blue));
  color:#fff;
  box-shadow:0 8px 17px rgba(60,94,180,.28);
}
.case-clinical #continuous .cl-awareness svg{width:21px;height:21px;stroke-width:2}
.case-clinical #continuous .cl-awareness b{
  font-size:12px;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--cl-blue);
  white-space:nowrap;
}

@media (max-width:1080px){
  .case-clinical #continuous .cl-cont{
    width:min(900px,calc(100% - 48px));
    grid-template-columns:1fr;
    gap:46px;
  }
  .case-clinical #continuous .cl-cont-copy{text-align:center}
  .case-clinical #continuous .cl-cont h2,
  .case-clinical #continuous .cl-cont-copy > p{margin-inline:auto}
  .case-clinical #continuous .cl-shift{text-align:left}
}
@media (max-width:680px){
  .case-clinical #continuous{padding-block:54px 66px}
  .case-clinical #continuous .cl-cont{width:min(100% - 32px,620px);gap:34px}
  .case-clinical #continuous .cl-eyebrow{margin-bottom:24px}
  .case-clinical #continuous .cl-cont h2{font-size:clamp(36px,11vw,48px)}
  .case-clinical #continuous .cl-cont-copy > p{font-size:15px;line-height:1.72;text-align:left}
  .case-clinical #continuous .cl-shift{grid-template-columns:1fr;padding:22px}
  .case-clinical #continuous .cl-shift-icon{width:60px;height:60px}
  .case-clinical #continuous .cl-stack{padding-inline:18px;border-radius:22px}
  .case-clinical #continuous .cl-stack-top{min-height:76px;align-items:flex-start;flex-direction:column;justify-content:center;gap:8px}
  .case-clinical #continuous .cl-stack-h{font-size:10.5px}
  .case-clinical #continuous .cl-stack li{grid-template-columns:78px 1fr;gap:12px;padding-left:36px;min-height:100px}
  .case-clinical #continuous .cl-stack time{padding:6px 10px;font-size:9px}
  .case-clinical #continuous .cl-stack li b,
  .case-clinical #continuous .cl-stack li em{font-size:11.5px}
  .case-clinical #continuous .cl-stack ol::before{left:10px}
  .case-clinical #continuous .cl-stack li::before{left:1px}
  .case-clinical #continuous .cl-stack li.live::before{left:5px}
  .case-clinical #continuous .cl-stack li.done::before{left:-4px}
  .case-clinical #continuous .cl-stack li.done::after{left:5px}
  .case-clinical #continuous .cl-cont-visual{padding-bottom:78px}
  .case-clinical #continuous .cl-aware-route{display:none}
  .case-clinical #continuous .cl-awareness{right:50%;translate:50% 0}
}

/* the converge bar sits centred under the grid, not hugging the left edge */
.case-clinical .cl-chal-foot{justify-content:center}
.case-clinical .cl-pick-out{flex:0 1 auto;justify-content:center}
@media (max-width:760px){
  .case-clinical .cl-chal-foot{justify-content:flex-start}
  .case-clinical .cl-pick-out{justify-content:flex-start}
}

/* ══════════════════════════════════════════════════════════
   HOME PARITY LAYER
   Three things this page was missing next to index.html:
   entry reveal on the section heads, the home hover language
   (lift · icon ring · rotating conic border) and the mobile
   deck + depth recipe. Visual only: no text, no structure,
   no desktop layout changes.
   ══════════════════════════════════════════════════════════ */

/* ---------- 1 · entry parity : section heads rise with a focus pull ----------
   app.css already gives h1 and .sec-head the rise-blur treatment. This page
   names its heads .cl-head, so the same override is repeated for them.
   Guarded exactly like app.css: outside the guard it would resurrect the
   animation that the reduce block switches off. */
@media (prefers-reduced-motion:no-preference){
  .js .case-clinical .cl-head.reveal.in{animation-name:rise-blur;animation-duration:.75s}
}

/* ---------- 2 · hover parity (desktop) ----------
   a) the icon tile gains the strengthened inset ring + deeper shadow,
      the way .pcard:hover .pcard-top .tile does on the home page.
      The existing scale(1.07) is left untouched. */
.case-clinical .cl-spec li:hover .ic,
.case-clinical .cl-value li:hover .ic{
  box-shadow:0 10px 22px rgba(60,94,180,.18),inset 0 0 0 1.5px rgba(60,94,180,.28);
}

/* b) the rotating conic hover border.
   Same mechanism as app.css (.ent / .objective / .pcard::after): a registered
   <angle> custom property drives conic-gradient(from ...), the ring is carved
   out with a content-box mask so only the padding band paints.
   Own property + keyframe names so nothing collides with the design system.
   .cl-spec li::after carries the corner texture and .cl-value li::before the
   sweeping top bar, so the ring takes the free pseudo on each family:
   ::before on .cl-spec li, ::after on .cl-value li.
   Both families clip themselves (overflow:hidden), so the ring is drawn at
   inset:0 rather than app.css's negative inset, and inherits the radius. */
@property --cl-bd{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes cl-bd-rot{to{--cl-bd:360deg}}

.case-clinical .cl-spec li::before,
.case-clinical .cl-value li::after{
  content:"";position:absolute;inset:0;display:block;
  border-radius:inherit;padding:2.5px;pointer-events:none;
  background:conic-gradient(from var(--cl-bd),transparent 0deg,transparent 40deg,#5b82d8 110deg,#8aa2dc 150deg,transparent 220deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .35s var(--ease);
}
.case-clinical .cl-value li::after{
  background:conic-gradient(from calc(var(--cl-bd) + 185deg),transparent 0deg,transparent 40deg,#5b82d8 110deg,#8aa2dc 150deg,transparent 220deg,transparent 360deg);
}
.case-clinical .cl-spec li:hover::before,
.case-clinical .cl-value li:hover::after{opacity:1}
@media (prefers-reduced-motion:no-preference){
  .case-clinical .cl-spec li:hover::before,
  .case-clinical .cl-value li:hover::after{animation:cl-bd-rot 1.7s linear infinite}
}
@media (prefers-reduced-motion:reduce){
  .case-clinical .cl-spec li::before,
  .case-clinical .cl-value li::after{animation:none!important;transition:none}
  .case-clinical .cl-spec li:hover .ic,
  .case-clinical .cl-value li:hover .ic{transform:none}
}

/* ---------- 3a · mobile + tablet : cycling accent lines ----------
   When the cards pile up, six identical blue ticks read as repetition, so the
   line cycles the same three blues app.css uses. Both families already spend
   their pseudos, so the tick is layered as an extra background image: no
   pseudo needed, and the card's own wash is restated as the layer beneath. */
@media (max-width:999px){
  .case-clinical .cl-spec li{
    --cl-ln:var(--ln-a);
    background-image:var(--cl-ln),linear-gradient(162deg,#ffffff 46%,#f7fafe 100%);
    background-repeat:no-repeat,no-repeat;
    background-position:22px 0,0 0;
    background-size:30px 2.5px,auto;
  }
  .case-clinical .cl-spec li:nth-child(3n+2){--cl-ln:var(--ln-b)}
  .case-clinical .cl-spec li:nth-child(3n){--cl-ln:var(--ln-c)}

  .case-clinical .cl-value li{
    --cl-ln:var(--ln-a);
    background-image:var(--cl-ln),linear-gradient(160deg,#fff 52%,#f7fafe 100%);
    background-repeat:no-repeat,no-repeat;
    background-position:22px 0,0 0;
    background-size:30px 2.5px,auto;
  }
  .case-clinical .cl-value li:nth-child(3n+2){--cl-ln:var(--ln-b)}
  .case-clinical .cl-value li:nth-child(3n){--cl-ln:var(--ln-c)}
}

/* ---------- 3b · phones : the two homogeneous runs become a card deck ---------- */
@media (max-width:700px){
  /* #team clips itself with overflow:hidden, which turns it into a scroll
     container and silently kills sticky. overflow:clip keeps the decorative
     arcs contained without creating one. Only this section, only here. */
  .case-clinical #team.cl-band--deep.has-bg{overflow:clip}

  .case-clinical .cl-spec,.case-clinical .cl-value{display:block}
  .case-clinical #team .cl-spec li,
  .case-clinical .cl-value li{
    position:sticky;top:calc(14px + var(--k,0) * 14px);
    margin-bottom:20px;
    box-shadow:0 -8px 24px rgba(24,56,132,.08),0 12px 30px rgba(24,56,132,.09);
  }
  /* the Operations Coordinator keeps its emphasis ring, gains the deck depth */
  .case-clinical #team .cl-spec li:last-child{
    box-shadow:inset 0 0 0 1.7px #7395e3,
               0 -8px 24px rgba(24,56,132,.08),0 12px 30px rgba(24,56,132,.09);
  }
  .case-clinical .cl-spec > :nth-child(1),.case-clinical .cl-value > :nth-child(1){--k:0}
  .case-clinical .cl-spec > :nth-child(2),.case-clinical .cl-value > :nth-child(2){--k:1}
  .case-clinical .cl-spec > :nth-child(3),.case-clinical .cl-value > :nth-child(3){--k:2}
  .case-clinical .cl-spec > :nth-child(4),.case-clinical .cl-value > :nth-child(4){--k:3}
  .case-clinical .cl-spec > :nth-child(5),.case-clinical .cl-value > :nth-child(5){--k:4}
  .case-clinical .cl-spec > :nth-child(6),.case-clinical .cl-value > :nth-child(6){--k:5}
  .case-clinical .cl-value > :nth-child(7){--k:6}
  .case-clinical .cl-spec > :last-child,.case-clinical .cl-value > :last-child{margin-bottom:0}

  /* ---------- 3c · phones : the standalone panels get the home depth ----------
     They already carry the white to pale-blue wash and a faint instrument
     grid, so only the fine triple shadow and the accent tick are missing. */
  .case-clinical .cl-signal,.case-clinical .cl-review,
  .case-clinical .cl-queue,.case-clinical .cl-load,
  .case-clinical .cl-outcome article{
    box-shadow:0 8px 22px rgba(24,56,132,.07),
               inset 0 0 0 1px var(--line-2),
               inset 0 1px 0 rgba(255,255,255,.9);
  }
  /* the timeline and the memory rail keep their own stronger rings */
  .case-clinical #continuous .cl-stack{
    box-shadow:0 8px 22px rgba(24,56,132,.07),
               inset 0 0 0 1px rgba(60,94,180,.16),
               inset 0 1px 0 rgba(255,255,255,.9);
  }
  .case-clinical #team .cl-mem{
    box-shadow:0 8px 22px rgba(24,56,132,.07),
               inset 0 0 0 1.5px #7da0ef,
               inset 0 1px 0 rgba(255,255,255,.9);
  }

  /* accent tick: ::before is free on every panel except .cl-mem, which spends
     both pseudos on its connector dashes and therefore uses a background layer. */
  .case-clinical .cl-signal::before,.case-clinical .cl-review::before,
  .case-clinical .cl-queue::before,.case-clinical .cl-load::before,
  .case-clinical #continuous .cl-stack::before,
  .case-clinical .cl-outcome article::before{
    content:"";position:absolute;top:0;left:22px;display:block;
    width:30px;height:2.5px;border-radius:0 0 3px 3px;
    pointer-events:none;background:var(--ln-a);
  }
  .case-clinical .cl-review::before{background:var(--ln-b)}
  .case-clinical #continuous .cl-stack::before{background:var(--ln-c)}
  .case-clinical .cl-load::before{background:var(--ln-b)}
  .case-clinical .cl-outcome article:nth-child(2)::before{background:var(--ln-b)}
  .case-clinical #team .cl-mem{
    background-image:var(--ln-c);
    background-repeat:no-repeat;
    background-position:22px 0;
    background-size:30px 2.5px;
  }

  /* ---------- 3d · phones : soft glow behind the icons ---------- */
  .case-clinical .cl-spec .ic,.case-clinical .cl-value .ic,
  .case-clinical .cl-grid .tico{
    box-shadow:0 8px 18px rgba(60,94,180,.16),
               0 0 0 6px rgba(60,94,180,.045),
               inset 0 0 0 1px rgba(60,94,180,.14);
  }
}

/* ══════════════════════════════════════════════════════════
   MEASUREMENT · reference composition
   A five-by-two baseline board with shared legend and validation note.
   ══════════════════════════════════════════════════════════ */
.case-clinical #measure{
  position:relative;
  width:min(1620px,calc(100% - clamp(64px,8vw,150px)));
  padding-block:clamp(58px,5vw,86px) clamp(48px,4vw,70px);
  isolation:isolate;
  background:transparent;
}
.case-clinical #measure.has-bg::before{
  top:0;
  bottom:0;
  left:50%;
  right:auto;
  width:100vw;
  transform:translateX(-50%)!important;
  opacity:1!important;
  background-image:
    repeating-radial-gradient(ellipse 920px 520px at 50% 28%,transparent 0 76px,rgba(60,94,180,.065) 77px 78px,transparent 79px 112px),
    radial-gradient(760px 430px at 78% 12%,rgba(88,128,220,.08),transparent 66%),
    linear-gradient(180deg,#fbfdff 0%,#f7faff 100%)!important;
  background-size:auto!important;
  background-position:50% 0!important;
  -webkit-mask-image:none;
          mask-image:none;
}
.case-clinical #measure::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0 50% 0 auto;
  width:100vw;
  translate:50% 0;
  pointer-events:none;
  opacity:.62;
  background-image:radial-gradient(rgba(60,94,180,.26) 1.15px,transparent 1.2px);
  background-size:12px 12px;
  background-position:0 0;
  -webkit-mask-image:
    radial-gradient(ellipse 150px 110px at 3% 12%,#000 3%,transparent 76%),
    radial-gradient(ellipse 150px 110px at 97% 22%,#000 3%,transparent 76%);
          mask-image:
    radial-gradient(ellipse 150px 110px at 3% 12%,#000 3%,transparent 76%),
    radial-gradient(ellipse 150px 110px at 97% 22%,#000 3%,transparent 76%);
}
.case-clinical #measure .cl-head{
  max-width:980px;
  margin:0 auto 28px;
}
.case-clinical #measure .cl-eyebrow{
  margin-bottom:24px;
  padding:8px 18px 8px 16px;
  font-size:12px;
  letter-spacing:.13em;
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.15),0 8px 20px rgba(30,60,130,.07);
}
.case-clinical #measure .cl-head h2{
  font-size:clamp(42px,3.25vw,58px);
  line-height:1.04;
  letter-spacing:-.047em;
  color:var(--cl-ink);
}
.case-clinical #measure .cl-head p{
  margin-top:22px;
  font-size:clamp(15px,1.15vw,18px);
  line-height:1.7;
  color:var(--cl-copy);
}
.case-clinical #measure .cl-metrics{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:20px 22px;
  margin-top:24px;
}
.case-clinical #measure .cl-metrics li{
  position:relative;
  min-height:150px;
  padding:21px 24px 48px;
  border-radius:17px;
  background:rgba(255,255,255,.94);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.14),0 12px 28px rgba(30,60,130,.08);
  transition:transform .34s var(--ease),box-shadow .34s var(--ease);
}
.case-clinical #measure .cl-metrics li:hover{
  transform:translateY(-3px);
  box-shadow:inset 0 0 0 1.35px rgba(60,94,180,.3),0 18px 34px rgba(30,60,130,.11);
}
.case-clinical #measure .cl-metrics b{
  display:block;
  min-height:42px;
  font-size:15px;
  font-weight:750;
  line-height:1.38;
  letter-spacing:-.018em;
  color:var(--cl-ink);
}
.case-clinical #measure .cl-metrics i{
  position:relative;
  display:block;
  height:18px;
  margin-top:18px;
  border-radius:0;
  background:
    linear-gradient(90deg,var(--cl-blue),var(--cl-blue)) 0 2px/34% 2px no-repeat,
    repeating-linear-gradient(90deg,#ccd6ea 0 5px,transparent 5px 9px) 0 2px/100% 2px no-repeat,
    repeating-linear-gradient(90deg,transparent 0 38px,#d7e0f1 38px 39px) 0 11px/100% 6px no-repeat;
}
.case-clinical #measure .cl-metrics i::before,
.case-clinical #measure .cl-metrics i::after{
  content:"";
  position:absolute;
  top:2px;
  width:11px;
  height:11px;
  translate:0 -50%;
  border-radius:50%;
}
.case-clinical #measure .cl-metrics i::before{left:0;background:var(--cl-blue);box-shadow:0 4px 9px rgba(60,94,180,.2)}
.case-clinical #measure .cl-metrics i::after{right:0;background:#fff;box-shadow:inset 0 0 0 1.7px var(--cl-blue)}
.case-clinical #measure .cl-metrics li::before,
.case-clinical #measure .cl-metrics li::after{
  position:absolute;
  bottom:18px;
  font-size:11.5px;
  font-weight:650;
  line-height:1;
  color:var(--cl-copy);
  white-space:nowrap;
}
.case-clinical #measure .cl-metrics li::before{content:"●  Baseline";left:24px;color:var(--cl-copy)}
.case-clinical #measure .cl-metrics li::after{content:"○  Pilot result";right:24px;color:var(--cl-copy)}
.case-clinical #measure .cl-metrics-key{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px 22px;
  margin-top:26px;
  font-size:12.5px;
  font-weight:700;
  color:var(--cl-blue);
}
.case-clinical #measure .cl-metrics-key span{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:40px;
  padding:7px 19px;
  border-radius:999px;
  background:rgba(255,255,255,.93);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.13),0 8px 20px rgba(30,60,130,.07);
}
.case-clinical #measure .cl-metrics-key i{width:10px;height:10px;flex:none}
.case-clinical #measure .cl-metrics-key .b{background:var(--cl-blue);box-shadow:0 3px 8px rgba(60,94,180,.2)}
.case-clinical #measure .cl-metrics-key .p{background:#fff;box-shadow:inset 0 0 0 1.6px var(--cl-blue)}
.case-clinical #measure .cl-measure-note{
  max-width:1024px;
  min-height:64px;
  display:flex;
  align-items:center;
  gap:18px;
  margin:16px auto 0;
  padding:10px 22px;
  border:0;
  border-radius:14px;
  background:rgba(255,255,255,.76);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.12),0 9px 24px rgba(30,60,130,.055);
  font-size:13px;
  line-height:1.55;
  color:var(--cl-copy);
}
.case-clinical #measure .cl-measure-note-icon{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  flex:none;
  border-radius:50%;
  background:var(--cl-field-2);
  box-shadow:inset 0 0 0 1px rgba(60,94,180,.08);
  color:var(--cl-blue);
}
.case-clinical #measure .cl-measure-note-icon svg{width:21px;height:21px;stroke-width:1.9}

@media (max-width:1200px){
  .case-clinical #measure .cl-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:760px){
  .case-clinical #measure{width:min(100% - 32px,620px);padding-block:48px}
  .case-clinical #measure .cl-head h2{font-size:clamp(36px,10.5vw,48px)}
  .case-clinical #measure .cl-head p{font-size:15px}
  .case-clinical #measure .cl-metrics{grid-template-columns:1fr;gap:14px}
  .case-clinical #measure .cl-metrics li{min-height:140px}
  .case-clinical #measure .cl-measure-note{align-items:flex-start;padding:16px}
}

/* ---------- the authority rows' rectangle at hover ----------
   The old li-level hover survived the switch to buttons: it painted an
   UNROUNDED background + 1px ring on the wrapper (border-radius 0) behind
   the rounded button. All hover feedback on converted lists belongs to the
   button alone; the wrappers stay inert. */
.case-clinical .cl-never li:hover,
.case-clinical .cl-never li:focus-within{
  transform:none!important;
  background:transparent!important;
  box-shadow:none!important;
}
.case-clinical .cl-domains li:hover,
.case-clinical .cl-grid li:hover{
  transform:none!important;
}

/* ══════════════════════════════════════════════════════════
   ACCESSIBILITY REMEDIATION LAYER
   Appended last on purpose: the per-family focus rings above use
   !important and keep winning where they exist. Everything else on
   the page now inherits one substitute ring. No outline anywhere ·
   the two-layer box-shadow follows each control's own border-radius.
   ══════════════════════════════════════════════════════════ */

/* ---------- screen-reader-only utility ---------- */
.case-clinical .sr-only{
  position:absolute;width:1px;height:1px;
  clip-path:inset(50%);overflow:hidden;white-space:nowrap;
}

/* ---------- P0 · the global substitute focus ring ----------
   Fires for every interactive element inside the page: brand, nav links,
   nav CTA, burger, drawer links, back link, hero and CTA buttons, footer
   links. Deliberately WITHOUT !important, so the seven tighter component
   rings declared above keep precedence. White inner layer + brand outer
   layer, so the ring reads on white bands and on the navy section alike. */
.case-clinical a:focus-visible,
.case-clinical button:focus-visible,
.case-clinical summary:focus-visible,
.case-clinical input:focus-visible,
.case-clinical select:focus-visible,
.case-clinical textarea:focus-visible,
.case-clinical [tabindex]:focus-visible{
  box-shadow:0 0 0 2px #fff,0 0 0 4.5px rgba(60,94,180,.85);
}

/* The CTA band's ghost button carries an unconditional inset hairline at
   (0,3,0), which outranks the global ring above. It needs its own line. */
.case-clinical .cl-cta .cl-btn-ghost:focus-visible{
  box-shadow:0 0 0 2px #fff,0 0 0 4.5px rgba(60,94,180,.85);
}

/* ---------- P1 · severity chip labels carry their own semantic ink ----------
   The spans used to inherit --cl-mute on a tinted ground, which fell short
   of 4.5:1. Each label now takes the ink of its own severity. */
.case-clinical .cl-sig-row .s-hi span{color:var(--cl-hi)}
.case-clinical .cl-sig-row .s-me span{color:var(--cl-me)}
.case-clinical .cl-sig-row .s-lo span{color:var(--cl-lo)}

/* ---------- P3 · the outcome rail is keyboard-reachable, so it shows it ---------- */
.case-clinical .cl-outcome li[data-side]:focus-visible{
  box-shadow:inset 0 0 0 2px var(--cl-blue);
}

/* ---------- P2 · touch targets on a phone ---------- */
@media (max-width:760px){
  .case-clinical #queue button{min-height:44px}
  .case-clinical .cl-tabs button{min-height:44px}
  .case-clinical .nav-cta{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
}

/* ---------- P2 · motion guards ----------
   The two infinite pulses, the sparkline draw and the two layout
   transitions were running regardless of the user's motion setting. */
@media (prefers-reduced-motion:reduce){
  .case-clinical .cl-mon.is-live .cl-live i{animation:none}
  .case-clinical .cl-stack li.live::before{animation:none}
  .case-clinical #continuous .cl-stack li.live::before{animation:none}
  /* the sparkline has to be visible without the draw */
  .case-clinical .cl-spark .line{stroke-dashoffset:0;animation:none}
  .case-clinical .cl-mon.is-live .cl-spark .line{animation:none}
  /* no animated layout: the drift bars and the who-reveal land instantly */
  .case-clinical .cl-drift i::after{transition:none}
  .case-clinical .cl-never .who{transition:none}
  /* the late queue row never arrives, so its placeholder is dead weight */
  .case-clinical .cl-q-slot{display:none}
}