/* ai-hr (2026-10-05): the page is an organization chart for AI in HR.
   Linked only from article-ai-hr.html. A plain masthead and the demo story, then the
   chart itself: the Chief HR Officer at the root, three functions below, five positions
   under them. Each function then gets its own branch of the page: its box, the section
   hung under it on a hairline rod, and a bus line down to the positions under it, each
   with its section hanging below. The page closes back at the root: the CHRO's box
   holds the five things it owns, with IT, legal and business partners on dotted lines.
   Under 1000px the chart becomes an indented outline with the branch lines on the left.
   Motion: the reporting lines grow from the root outward (stroke-dashoffset on paths with
   pathLength="1"), level by level, then one red line runs from the 2% back up to the CHRO. */

.oc-page{
  --oc-ink:#16150f; --oc-ink2:#33312a; --oc-mut:#6b6660; --oc-hair:#d9d3c6; --oc-line:#5b574f;
  --oc-paper:#f7f5f0; --oc-paper2:#efece4; --oc-nv:#16304F; --oc-navy:#0e1330;
  --oc-red:#A93A3A; --oc-gold:#B8862F;
  background:var(--oc-paper);
}
.oc-page ::selection{background:var(--oc-nv);color:var(--oc-paper);}
.oc-page a:focus-visible,.oc-page button:focus-visible{outline:2px solid var(--oc-red);outline-offset:3px;border-radius:1px;}
.oc-page .art-rail{display:none !important;}
.oc section{padding:0;}
.oc .oc-sheet{width:min(1160px,calc(100vw - 32px));margin:0 auto;}
.oc p{margin:0;}

/* the one label style: Inter, sentence case */
.oc .oc-lab{font-family:var(--sans);font-size:.82rem;font-weight:600;letter-spacing:.01em;line-height:1.3;color:var(--oc-nv);}

/* ---------- masthead ---------- */
.oc .oc-head{padding:clamp(1.4rem,3vw,2.2rem) 0 0;}
.oc .oc-mast{max-width:50rem;margin-top:clamp(2.4rem,5vw,3.6rem);}
.oc .oc-mast h1{margin:.9rem 0 0;font-family:var(--serif);font-size:clamp(2.5rem,5.6vw,4.6rem);font-weight:500;line-height:1.03;letter-spacing:-.025em;color:var(--oc-ink);max-width:15ch;}
.oc .oc-mast .dek{margin-top:1.4rem;max-width:38rem;font-family:var(--serif);font-size:clamp(1.18rem,1.9vw,1.38rem);line-height:1.5;color:var(--oc-ink2);}
.oc .oc-mast .article-meta{display:flex;flex-wrap:wrap;gap:.3rem .7rem;margin-top:1.5rem;font-family:var(--sans);font-size:.85rem;color:var(--oc-mut);}
.oc .oc-mast .article-meta b{color:var(--oc-ink);font-weight:600;}
.oc .oc-demo{max-width:41rem;margin-top:clamp(2.6rem,5vw,3.6rem);padding-top:1.6rem;border-top:1px solid var(--oc-ink);}
@media (min-width:1080px){
  .oc .oc-head .oc-sheet{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);column-gap:clamp(3rem,5vw,4.5rem);align-items:end;}
  .oc .oc-head .back-link{grid-column:1 / -1;justify-self:start;}
  .oc .oc-demo{margin-top:0;align-self:end;}
  .oc .oc-demo p{font-size:1.12rem;}
}
.oc .oc-demo p{font-family:var(--serif);font-size:1.18rem;line-height:1.62;color:var(--oc-ink);}
.oc .oc-demo p+p{margin-top:1rem;}

/* ---------- boxes (shared) ---------- */
.oc .oc-box{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;box-sizing:border-box;padding:.6rem .8rem .65rem;background:var(--oc-paper);border:1px solid var(--oc-ink2);color:var(--oc-ink);text-decoration:none;}
.oc a.oc-box:hover{border-color:var(--oc-red);}
.oc a.oc-box:hover .oc-role{color:var(--oc-red);}
.oc .oc-role{display:block;font-family:var(--serif);font-size:1.12rem;font-weight:500;line-height:1.2;letter-spacing:-.01em;}
.oc .oc-duty{display:block;margin-top:.22rem;font-family:var(--sans);font-size:.78rem;line-height:1.35;color:var(--oc-mut);}
.oc .oc-root{background:var(--oc-nv);border-color:var(--oc-nv);color:var(--oc-paper);}
.oc .oc-root .oc-duty{color:#d5dae4;}
.oc a.oc-root:hover .oc-role{color:#fff;}
.oc .oc-agent{border-top:3px solid var(--oc-gold);}
.oc .oc-vacant{border-style:dashed;border-color:var(--oc-mut);}
.oc .oc-vacant .oc-role{color:var(--oc-ink2);}

/* ---------- the chart ---------- */
.oc .oc-chartwrap{padding:clamp(4rem,8vw,6rem) 0 clamp(2rem,4vw,3rem);}
.oc .oc-chart-h{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-bottom:.7rem;margin-bottom:clamp(1.8rem,3.4vw,2.6rem);border-bottom:1px solid var(--oc-ink);}
.oc .oc-chart-h h2{margin:0;}
.oc .oc-ctl{appearance:none;background:none;border:0;padding:.2rem 0;font-family:var(--sans);font-size:.85rem;font-weight:500;color:var(--oc-nv);text-decoration:underline;text-decoration-color:rgba(22,48,79,.35);text-underline-offset:3px;cursor:pointer;}
.oc .oc-ctl:hover{text-decoration-color:var(--oc-red);}
.oc .oc-chart{position:relative;margin:0;}
.oc .oc-lines{display:block;width:100%;height:auto;aspect-ratio:1160/420;overflow:visible;}
.oc .oc-lines path{fill:none;stroke:var(--oc-line);stroke-width:1.25;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0;}
.oc .oc-lines path.oc-ans{stroke:var(--oc-red);stroke-width:2.25;}
.oc .oc-ov{list-style:none;margin:0;padding:0;position:absolute;left:0;right:0;top:0;aspect-ratio:1160/420;}
.oc .oc-ov li{position:absolute;margin:0;padding:0;}
.oc .oc-ov li .oc-box{width:100%;height:100%;}
.oc .oc-p-root{left:37.069%;top:0;width:25.862%;height:21.905%;}
.oc .oc-ov .lv1{top:40%;height:20.476%;width:17.931%;}
.oc .oc-ov .lv2{top:78.571%;height:21.429%;width:17.931%;}
.oc .oc-p-agents{left:0;}
.oc .oc-p-model{left:30.776%;}
.oc .oc-p-plan{left:71.810%;}
.oc .oc-p-two{left:0;}
.oc .oc-p-data{left:20.517%;}
.oc .oc-p-skills{left:41.034%;}
.oc .oc-p-entry{left:61.552%;}
.oc .oc-p-team{left:82.069%;}
.oc .oc-p-root .oc-role{font-size:1.3rem;}
.oc .oc-cap{display:flex;flex-wrap:wrap;gap:.5rem 1.8rem;margin-top:1.6rem;padding-top:.8rem;border-top:1px solid var(--oc-hair);font-family:var(--sans);font-size:.85rem;line-height:1.45;color:var(--oc-ink2);}
.oc .oc-key{display:inline-flex;align-items:center;gap:.55rem;}
.oc .oc-key:first-child{flex:1 1 24rem;}
.oc .oc-key i{flex:none;display:inline-block;}
.oc .k-red{width:1.4rem;height:2px;background:var(--oc-red);}
.oc .k-gold{width:1rem;height:.7rem;border:1px solid var(--oc-ink2);border-top:3px solid var(--oc-gold);box-sizing:border-box;}
.oc .k-dash{width:1rem;height:.7rem;border:1px dashed var(--oc-mut);box-sizing:border-box;}

/* ---------- branches ---------- */
.oc .oc-branch{padding:clamp(4.4rem,8vw,6.4rem) 0 0;}
.oc .oc-from{display:flex;flex-direction:column;align-items:center;font-family:var(--sans);font-size:.8rem;font-weight:500;color:var(--oc-mut);}
.oc .oc-from::after{content:"";width:1px;height:2rem;margin-top:.45rem;background:var(--oc-line);}
.oc .oc-hd{width:17rem;max-width:100%;margin:0 auto;padding:.75rem 1rem .8rem;}
.oc .oc-hd .oc-role{font-size:1.3rem;}
.oc .oc-hang{position:relative;max-width:42rem;margin:0 auto;padding-top:3.4rem;}
.oc .oc-hang::before{content:"";position:absolute;left:50%;top:0;width:1px;height:1.8rem;background:var(--oc-line);}
.oc .oc-hang::after{content:"";position:absolute;left:0;right:0;top:1.8rem;height:1px;background:var(--oc-line);}
.oc .oc-hang h2{margin:0 0 1.2rem;font-family:var(--serif);font-size:clamp(1.75rem,3vw,2.35rem);font-weight:500;line-height:1.12;letter-spacing:-.02em;color:var(--oc-ink);}
.oc .oc-hang h3{margin:0 0 1rem;font-family:var(--serif);font-size:clamp(1.45rem,2.2vw,1.7rem);font-weight:500;line-height:1.16;letter-spacing:-.015em;color:var(--oc-ink);}
.oc .oc-hang p{font-family:var(--serif);font-size:1.125rem;line-height:1.64;color:var(--oc-ink);}
.oc .oc-hang p+p{margin-top:1rem;}
.oc .oc-kid .oc-hang p{font-size:1.07rem;}

/* bus lines down to the positions */
.oc .oc-kids{--g:4.5rem;position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 var(--g);margin-top:2.4rem;padding-top:5rem;}
.oc .oc-kids::before{content:"";position:absolute;left:50%;top:0;width:1px;height:2.6rem;background:var(--oc-line);}
.oc .oc-kids::after{content:"";position:absolute;top:2.6rem;height:1px;left:calc((100% - var(--g)) / 4);right:calc((100% - var(--g)) / 4);background:var(--oc-line);}
.oc .oc-kid{position:relative;}
.oc .oc-kid::before{content:"";position:absolute;left:50%;top:-2.4rem;width:1px;height:2.4rem;background:var(--oc-line);}
.oc .oc-kid .oc-hd{width:15rem;}
.oc .oc-kid .oc-hang{max-width:none;}
.oc .oc-kids.oc-one{display:block;max-width:42rem;margin-left:auto;margin-right:auto;padding-top:2.6rem;}
.oc .oc-kids.oc-one::before,.oc .oc-kids.oc-one::after,.oc .oc-one .oc-kid::before{display:none;}
.oc .oc-kids.oc-one .oc-kid{padding-top:0;}
.oc .oc-kids.oc-one .oc-kid .oc-hd{position:relative;}
.oc .oc-kids.oc-one .oc-kid .oc-hd::before{content:"";position:absolute;left:50%;bottom:100%;width:1px;height:2.4rem;background:var(--oc-line);}
.oc .oc-hang-s{padding-bottom:0;}

/* roster of the agents */
.oc .oc-roster{width:100%;margin:1.8rem 0 1.9rem;border-collapse:collapse;font-variant-numeric:tabular-nums;}
.oc .oc-roster caption{caption-side:top;text-align:left;padding-bottom:.6rem;}
.oc .oc-roster thead th{padding:0 .8rem .45rem 0;border-bottom:1px solid var(--oc-ink);font-family:var(--sans);font-size:.78rem;font-weight:600;text-align:left;color:var(--oc-mut);}
.oc .oc-roster tbody th,.oc .oc-roster td{padding:.65rem .8rem .65rem 0;border-bottom:1px solid var(--oc-hair);vertical-align:top;text-align:left;}
.oc .oc-roster tbody th{width:28%;font-family:var(--sans);font-size:.88rem;font-weight:600;color:var(--oc-ink);}
.oc .oc-roster td{font-family:var(--serif);font-size:1rem;line-height:1.45;color:var(--oc-ink2);}
.oc .oc-roster td:nth-child(2){width:26%;color:var(--oc-ink);}

/* pull quote */
.oc .oc-pull{margin:2.2rem 0 0;padding:1.4rem 0 1.5rem;border-top:1px solid var(--oc-ink);border-bottom:1px solid var(--oc-ink);}
.oc .oc-hang .oc-pull p{font-family:var(--serif);font-style:italic;font-size:clamp(1.35rem,2.3vw,1.62rem);line-height:1.38;color:var(--oc-ink);}

/* which way the line runs */
.oc .oc-flip{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:1.8rem;padding-top:1.2rem;border-top:1px solid var(--oc-hair);}
.oc .oc-mini{display:flex;flex-direction:column;align-items:center;text-align:center;}
.oc .oc-mbox{position:relative;display:block;min-width:7.4rem;padding:.4rem .7rem;border:1px solid var(--oc-ink2);background:var(--oc-paper);font-family:var(--sans);font-size:.88rem;font-weight:600;color:var(--oc-ink);}
.oc .oc-mbox+.oc-mbox{margin-top:1.4rem;}
.oc .oc-mbox+.oc-mbox::before{content:"";position:absolute;left:50%;bottom:100%;height:1.4rem;border-left:1px solid var(--oc-line);}
.oc .oc-mbox em{font-style:normal;font-weight:400;color:var(--oc-mut);}
.oc .oc-mini-x .oc-mbox{border-color:#a8a194;color:var(--oc-mut);}
.oc .oc-mini-x .oc-mbox+.oc-mbox::before{border-left-color:#a8a194;}
.oc .oc-mbox-hr{background:var(--oc-nv);border-color:var(--oc-nv);color:var(--oc-paper);}
.oc .oc-mbox-dot+.oc-mbox::before,.oc .oc-mbox.oc-mbox-dot::before{border-left:2px dotted var(--oc-line);}
.oc .oc-mcap{display:block;margin-top:.7rem;font-family:var(--sans);font-size:.8rem;line-height:1.35;color:var(--oc-ink2);max-width:14rem;}
.oc .oc-mini-x .oc-mcap{color:var(--oc-mut);}

/* Deloitte gap */
.oc .oc-bars{margin:1.5rem 0 1.6rem;}
.oc .oc-bar{display:grid;grid-template-columns:11.5rem minmax(0,1fr) 3rem;align-items:center;gap:.8rem;padding:.42rem 0;border-bottom:1px solid var(--oc-hair);}
.oc .oc-bar-l{font-family:var(--sans);font-size:.82rem;line-height:1.3;color:var(--oc-ink2);}
.oc .oc-bar-t{display:block;height:.6rem;}
.oc .oc-bar-t i{display:block;height:100%;background:var(--oc-nv);transform-origin:left center;}
.oc .oc-bar-lo .oc-bar-t i{background:var(--oc-red);}
.oc .oc-bar-n{font-family:var(--sans);font-size:.92rem;font-weight:600;text-align:right;font-variant-numeric:tabular-nums;color:var(--oc-ink);}

/* ---------- back to the root ---------- */
.oc .oc-owns{margin-top:clamp(5rem,9vw,7rem);padding:clamp(3.6rem,7vw,5.4rem) 0 clamp(3.6rem,7vw,5rem);background:var(--oc-paper2);border-top:1px solid var(--oc-hair);}
.oc .oc-owns-h{max-width:42rem;margin:0 auto;text-align:center;}
.oc .oc-owns-h h2{margin:0;font-family:var(--serif);font-size:clamp(2rem,3.8vw,2.9rem);font-weight:500;line-height:1.08;letter-spacing:-.022em;color:var(--oc-ink);}
.oc .oc-owns-h p{margin-top:1.1rem;font-family:var(--serif);font-size:1.18rem;line-height:1.6;color:var(--oc-ink2);}
.oc .oc-final{margin-top:clamp(2.6rem,5vw,3.4rem);}
.oc .oc-rootbig{width:min(44rem,100%);margin:0 auto;padding:1.3rem 1.6rem 1.4rem;align-items:stretch;text-align:left;}
.oc .oc-rootbig .oc-role{font-size:1.55rem;text-align:center;}
.oc .oc-rootbig>.oc-duty{text-align:center;font-size:.82rem;}
.oc .oc-core{margin:1.1rem 0 0;padding:0;list-style:none;counter-reset:oc;}
.oc .oc-core li{counter-increment:oc;position:relative;padding:.6rem 0 .6rem 1.8rem;border-top:1px solid rgba(247,245,240,.22);font-family:var(--serif);font-size:1.05rem;line-height:1.5;color:#eef0f4;}
.oc .oc-core li::before{content:counter(oc);position:absolute;left:0;top:.6rem;font-family:var(--sans);font-size:.82rem;font-weight:600;line-height:1.9;color:#e7c27f;font-variant-numeric:tabular-nums;}
.oc .oc-core b{font-weight:600;color:#fff;}
.oc .oc-assign{--g:2.4rem;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 var(--g);padding-top:4.6rem;}
.oc .oc-assign::before{content:"";position:absolute;left:50%;top:0;height:2.4rem;border-left:2px dotted var(--oc-line);}
.oc .oc-assign::after{content:"";position:absolute;top:2.4rem;left:calc((100% - 2 * var(--g)) / 6);right:calc((100% - 2 * var(--g)) / 6);border-top:2px dotted var(--oc-line);}
.oc .oc-asg{position:relative;}
.oc .oc-asg::before{content:"";position:absolute;left:50%;top:-2.2rem;height:2.2rem;border-left:2px dotted var(--oc-line);}
.oc .oc-asg .oc-hd{width:15rem;}
.oc .oc-dates{position:relative;list-style:none;margin:0;padding:3rem 0 0;}
.oc .oc-dates::before{content:"";position:absolute;left:50%;top:0;width:1px;height:1.6rem;background:var(--oc-line);}
.oc .oc-dates::after{content:"";position:absolute;left:0;right:0;top:1.6rem;height:1px;background:var(--oc-line);}
.oc .oc-dates li{display:grid;grid-template-columns:5.2rem minmax(0,1fr);gap:.6rem;padding:.6rem 0;border-bottom:1px solid var(--oc-hair);}
.oc .oc-dates time{font-family:var(--sans);font-size:.82rem;font-weight:600;line-height:1.6;color:var(--oc-nv);font-variant-numeric:tabular-nums;}
.oc .oc-dates span{font-family:var(--serif);font-size:.98rem;line-height:1.48;color:var(--oc-ink);}
.oc .oc-final-k{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.8rem;margin-top:2.2rem;font-family:var(--sans);font-size:.82rem;color:var(--oc-ink2);}
.oc .oc-final-k span{display:inline-flex;align-items:center;gap:.5rem;}
.oc .k-own{display:inline-block;width:.9rem;height:.9rem;background:var(--oc-nv);}
.oc .k-dot{display:inline-block;width:1.6rem;border-top:2px dotted var(--oc-line);}
.oc .oc-close{max-width:42rem;margin:clamp(3rem,6vw,4.2rem) auto 0;padding-top:1.6rem;border-top:1px solid var(--oc-ink);}
.oc .oc-close p{font-family:var(--serif);font-size:1.15rem;line-height:1.64;color:var(--oc-ink);}
.oc .oc-close p+p{margin-top:1rem;}
.oc .oc-close p.oc-src{margin-top:2.2rem;padding-top:1rem;border-top:1px solid var(--oc-hair);font-family:var(--sans);font-size:.82rem;line-height:1.6;color:var(--oc-mut);}
.oc .oc-src b{color:var(--oc-ink);}
.oc .oc-cta{padding:clamp(2.4rem,5vw,3.4rem) 0 3rem;}
.oc .oc-cta .wrap{width:min(1160px,calc(100vw - 32px));padding:0;}

/* ---------- motion (scoped to classes the script adds) ---------- */
@media screen and (prefers-reduced-motion:no-preference){
  .oc .oc-chart.armed{transition:opacity .3s ease;}
  .oc .oc-chart.ghost{opacity:.2;}
  .oc .oc-chart.run .oc-lines path:not(.on){stroke-dashoffset:1;}
  .oc .oc-chart.armed .oc-ov li .oc-box{transition:opacity .4s ease,transform .5s cubic-bezier(.3,.8,.3,1);}
  .oc .oc-chart.run .oc-ov li:not(.on) .oc-box{opacity:0;transform:translateY(6px);}
  .oc .oc-chart.armed .oc-cap{transition:opacity .6s ease;}
  .oc .oc-chart.run .oc-cap:not(.on){opacity:0;}
  .oc .oc-chart.nt,.oc .oc-chart.nt *{transition:none !important;}
}

/* ---------- the chart as an outline ---------- */
@media (max-width:999px){
  .oc .oc-lines{display:none;}
  .oc .oc-ov{position:static;aspect-ratio:auto;}
  .oc .oc-ov li{position:relative;left:auto !important;top:auto !important;width:auto !important;height:auto !important;padding:0 0 .7rem calc(var(--lv) * 1.6rem);}
  .oc .oc-ov .lv0{--lv:0;} .oc .oc-ov .lv1{--lv:1;} .oc .oc-ov .lv2{--lv:2;}
  .oc .oc-ov li .oc-box{display:inline-flex;align-items:flex-start;text-align:left;width:auto;height:auto;min-width:min(15rem,100%);max-width:100%;padding:.55rem .85rem .6rem;}
  .oc .oc-ov li.lv1::before,.oc .oc-ov li.lv2::before{content:"";position:absolute;top:-.7rem;bottom:0;width:1px;background:var(--oc-line);transform-origin:top;}
  .oc .oc-ov li.lv1::before{left:.8rem;}
  .oc .oc-ov li.lv2::before{left:2.4rem;}
  .oc .oc-ov li.oc-last::before{bottom:auto;height:2.25rem;}
  .oc .oc-ov li.lv1::after,.oc .oc-ov li.lv2::after{content:"";position:absolute;top:1.55rem;width:.8rem;height:1px;background:var(--oc-line);transform-origin:left;}
  .oc .oc-ov li.lv1::after{left:.8rem;}
  .oc .oc-ov li.lv2::after{left:2.4rem;}
  .oc .oc-ov li.oc-cont{background:linear-gradient(var(--oc-line),var(--oc-line)) no-repeat .8rem 0 / 1px 100%;}
  .oc .oc-p-root .oc-role{font-size:1.2rem;}
  .oc .oc-ov li.oc-p-agents::before{background:linear-gradient(var(--oc-red) 0 2.25rem,var(--oc-line) 2.25rem);width:2px;margin-left:-.5px;}
  .oc .oc-ov li.oc-p-two::before{background:var(--oc-red);width:2px;margin-left:-.5px;}
  .oc .oc-ov li.oc-p-agents::after,.oc .oc-ov li.oc-p-two::after{background:var(--oc-red);height:2px;}
  .oc .oc-cap{margin-top:.9rem;}
}
@media screen and (max-width:999px) and (prefers-reduced-motion:no-preference){
  .oc .oc-chart.armed .oc-ov li{transition:opacity .35s ease;}
  .oc .oc-chart.armed .oc-ov li::before,.oc .oc-chart.armed .oc-ov li::after{transition:transform .4s ease;}
  .oc .oc-chart.run .oc-ov li:not(.on){opacity:0;}
  .oc .oc-chart.run .oc-ov li:not(.on)::before{transform:scaleY(0);}
  .oc .oc-chart.run .oc-ov li:not(.on)::after{transform:scaleX(0);}
}

/* ---------- branches on narrow screens: lines move to the left ---------- */
@media (max-width:760px){
  .oc .oc-from{align-items:flex-start;}
  .oc .oc-from::after{margin-left:1rem;height:1.4rem;}
  .oc .oc-hd,.oc .oc-kid .oc-hd,.oc .oc-asg .oc-hd{width:auto;margin:0;align-items:flex-start;text-align:left;}
  .oc .oc-hang{padding-top:2.6rem;}
  .oc .oc-hang::before{left:1rem;height:1.3rem;}
  .oc .oc-hang::after{left:1rem;top:1.3rem;}
  .oc .oc-hang p,.oc .oc-kid .oc-hang p{font-size:1.06rem;}
  .oc .oc-kids,.oc .oc-kids.oc-one{display:block;margin-top:2rem;padding:1.6rem 0 0 1.8rem;}
  .oc .oc-kids::before,.oc .oc-kids::after{display:none;}
  .oc .oc-kid+.oc-kid{margin-top:3rem;}
  .oc .oc-kid::before,.oc .oc-one .oc-kid::before{display:block;left:-.8rem;top:1.5rem;width:.8rem;height:1px;}
  .oc .oc-kid::after{content:"";position:absolute;left:-.8rem;top:-1.6rem;bottom:-3rem;width:1px;background:var(--oc-line);}
  .oc .oc-kid:last-child::after{bottom:auto;height:3.1rem;}
  .oc .oc-kid+.oc-kid:last-child::after{top:0;height:1.5rem;}
  .oc .oc-kids.oc-one .oc-kid .oc-hd::before{display:none;}
  .oc .oc-roster thead{display:none;}
  .oc .oc-roster caption{display:block;}
  .oc .oc-roster,.oc .oc-roster tbody,.oc .oc-roster tr,.oc .oc-roster th,.oc .oc-roster td{display:block;width:auto !important;}
  .oc .oc-roster tr{padding:.7rem 0;border-bottom:1px solid var(--oc-hair);}
  .oc .oc-roster tbody th,.oc .oc-roster td{padding:0;border:0;}
  .oc .oc-roster td:nth-child(2){margin-top:.15rem;font-weight:500;}
  .oc .oc-flip{gap:.8rem;}
  .oc .oc-mbox{min-width:0;width:100%;}
  .oc .oc-bar{grid-template-columns:minmax(0,1fr) 3rem;}
  .oc .oc-bar-l{grid-column:1 / -1;}
  .oc .oc-owns-h{text-align:left;}
  .oc .oc-rootbig .oc-role,.oc .oc-rootbig>.oc-duty{text-align:left;}
  .oc .oc-rootbig{padding:1rem 1.1rem 1.1rem;}
  .oc .oc-assign{display:block;padding:1.6rem 0 0 1.8rem;}
  .oc .oc-assign::before,.oc .oc-assign::after{display:none;}
  .oc .oc-asg+.oc-asg{margin-top:1.4rem;}
  .oc .oc-asg::before{left:-.8rem;top:1.5rem;width:.8rem;height:0;border-left:0;border-top:2px dotted var(--oc-line);}
  .oc .oc-asg::after{content:"";position:absolute;left:-.8rem;top:-1.6rem;bottom:-1.4rem;border-left:2px dotted var(--oc-line);}
  .oc .oc-asg:last-child::after{bottom:auto;height:3.1rem;}
  .oc .oc-asg+.oc-asg:last-child::after{top:0;height:1.5rem;}
  .oc .oc-dates::before{left:1rem;height:1.3rem;}
  .oc .oc-dates::after{left:1rem;top:1.3rem;}
  .oc .oc-dates{padding-top:2.4rem;}
  .oc .oc-dates li{grid-template-columns:minmax(0,1fr);gap:.1rem;}
  .oc .oc-final-k{justify-content:flex-start;}
}

@media print{
  .oc-page .reveal{opacity:1 !important;transform:none !important;}
  .oc .oc-ctl{display:none !important;}
  .oc .oc-chart{opacity:1 !important;}
  .oc .oc-lines path{stroke-dashoffset:0 !important;}
  .oc .oc-ov li,.oc .oc-ov li .oc-box,.oc .oc-cap{opacity:1 !important;transform:none !important;}
  .oc .oc-chart,.oc .oc-kid,.oc .oc-rootbig,.oc .oc-roster,.oc .oc-dates li{break-inside:avoid-page;}
  .oc .oc-owns{background:none;}
}

/* ---------- images (2026-10-05) ----------
   The 2% hangs beside its own text and leans out into the margin; the
   adoption chart runs on a full-width navy band; the bias image fills its
   branch column beside the skills branch. No frames. */
.oc .oc-branch{overflow-x:clip;}
.oc .oc-fig{margin:0;}
.oc .oc-kid .oc-hang{display:flow-root;}
.oc .oc-fig img{display:block;width:100%;height:auto;}
.oc .oc-fig figcaption{margin-top:.6rem;font-family:var(--sans);font-size:.85rem;line-height:1.45;color:var(--oc-ink2);}
.oc .oc-inset{margin:2rem 0 1.8rem;}
.oc .oc-inset figcaption{padding-top:.55rem;border-top:1px solid var(--oc-hair);}
.oc .oc-band{position:relative;width:100vw;margin:2.6rem 0 2.6rem calc(50% - 50vw);padding:clamp(2.4rem,5vw,3.6rem) 16px clamp(2rem,4vw,2.8rem);box-sizing:border-box;background:var(--oc-navy);}
.oc .oc-band-in{width:min(960px,100%);margin:0 auto;}
.oc .oc-band figcaption{margin-top:1rem;padding-top:.7rem;border-top:1px solid rgba(247,245,240,.22);color:rgba(247,245,240,.84);}
@media (min-width:761px){
  .oc .oc-inset-r{float:right;width:45%;margin:.4rem 0 1rem 1.8rem;}
}
@media (min-width:1200px){
  .oc .oc-inset-r{width:27rem;margin:.4rem -14rem 1rem 2rem;}
}
@media print{
  .oc .oc-band{width:auto;margin-left:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .oc .oc-inset-r{float:none;width:60%;margin:1.4rem 0;}
  .oc .oc-fig{break-inside:avoid;}
}

/* QA 2026-10-05: the history plate sits under the pull quote, centered on the branch rod,
   so the People data and Skills columns below it run about the same length */
.oc .oc-mid{max-width:30rem;margin:2.6rem auto 0;}
@media (min-width:761px){
  .oc .oc-kids:not(.oc-one) .oc-kid .oc-hd{min-height:5.5rem;}
}
.oc .oc-cta .cta-band p{margin:1rem 0 1.7rem;}

/* ---------- color pass (2026-10-09): green leads, gold and red keep their jobs ----------
   The three functions under the CHRO are green boxes wherever they appear, the
   agents branch gets a stat row, the workforce branch sits on a green dot-field
   band with a before and after bar pair, and the Deloitte bar and legal dates
   pick up the lead. */
.oc-page{--oc-g:#2E7D5B;--oc-gd:#1F5E42;--oc-gt:#F1F8F4;}

/* function boxes */
.oc .oc-fn{background:var(--oc-gt);border-color:var(--oc-g);}
.oc .oc-fn.oc-agent{border-top-color:var(--oc-gold);}
.oc .oc-fn .oc-role{color:var(--oc-gd);}
.oc .oc-fn .oc-duty{color:#4c5a52;}
.oc a.oc-fn:hover{border-color:var(--oc-red);}

/* stat row under the operational results */
.oc .oc-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:2rem 0 .4rem;border-top:1px solid var(--oc-hair);border-bottom:1px solid var(--oc-hair);}
.oc .oc-stat{padding:1.3rem 1.2rem 1.25rem;}
.oc .oc-stat + .oc-stat{border-left:1px solid var(--oc-hair);}
.oc .oc-stat:first-child{padding-left:0;}
.oc .oc-hang .oc-stat-n{font-family:var(--serif);font-size:clamp(2.6rem,4.6vw,3.4rem);font-weight:500;line-height:1;letter-spacing:-.03em;color:var(--oc-g);font-variant-numeric:lining-nums;}
.oc .oc-hang .oc-stat-l{margin-top:.6rem;font-family:var(--sans);font-size:.84rem;line-height:1.45;color:var(--oc-ink2);}

/* the workforce branch on a green band */
.oc .oc-branch#workforce{margin-top:clamp(4.4rem,8vw,6.4rem);padding:clamp(3.4rem,6vw,4.6rem) 0 clamp(3.6rem,6vw,5rem);
  background:radial-gradient(rgba(46,125,91,.17) 1px,transparent 1.4px) 0 0/22px 22px,var(--oc-gt);
  border-top:1px solid rgba(46,125,91,.35);border-bottom:1px solid rgba(46,125,91,.35);}
.oc .oc-branch#workforce .oc-box:not(.oc-fn){background:var(--oc-paper);}
.oc .oc-branch#workforce .oc-hd.oc-fn{background:var(--oc-gd);border-color:var(--oc-gd);}
.oc .oc-branch#workforce .oc-hd.oc-fn .oc-role{color:#fff;}
.oc .oc-branch#workforce .oc-hd.oc-fn .oc-duty{color:#d6e9df;}

/* before and after bars: what is left of the entry-level pipeline */
.oc .oc-drop{margin:1.5rem 0 1.4rem;padding:1rem 1.1rem .9rem;background:var(--oc-paper);border:1px solid rgba(46,125,91,.3);}
.oc .oc-drop-r{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem 1rem;padding:.45rem 0 .75rem;}
.oc .oc-drop-l{font-family:var(--sans);font-size:.82rem;line-height:1.35;color:var(--oc-ink2);}
.oc .oc-drop-n{font-family:var(--sans);font-size:.86rem;font-weight:700;color:var(--oc-red);white-space:nowrap;}
.oc .oc-drop-t{grid-column:1 / -1;display:flex;height:.9rem;}
.oc .oc-drop-t i{display:block;height:100%;background:var(--oc-gd);}
.oc .oc-drop-t b{display:block;height:100%;box-sizing:border-box;border:1px solid var(--oc-red);background:repeating-linear-gradient(135deg,rgba(169,58,58,.38) 0 2px,transparent 2px 6px);}
.oc .oc-drop-k{display:flex;gap:1.4rem;margin-top:.2rem !important;font-family:var(--sans) !important;font-size:.78rem !important;line-height:1.4 !important;color:var(--oc-ink2) !important;}
.oc .oc-drop-k span{display:inline-flex;align-items:center;gap:.45rem;}
.oc .oc-drop-k i{display:inline-block;width:1rem;height:.6rem;}
.oc .k-left{background:var(--oc-gd);}
.oc .k-gone{box-sizing:border-box;border:1px solid var(--oc-red);background:repeating-linear-gradient(135deg,rgba(169,58,58,.38) 0 2px,transparent 2px 5px);}

/* the Deloitte pair and the legal dates in the lead */
.oc .oc-bar-t i{background:var(--oc-g);}
.oc .oc-bar-lo .oc-bar-t i{background:var(--oc-red);}
.oc .oc-bar-t{background:rgba(46,125,91,.1);}
.oc .oc-dates time{color:var(--oc-gd);}

@media (max-width:760px){
  .oc .oc-stats{grid-template-columns:1fr;}
  .oc .oc-stat{display:grid;grid-template-columns:6.6rem minmax(0,1fr);gap:1rem;align-items:baseline;padding:.9rem 0;}
  .oc .oc-stat + .oc-stat{border-left:0;border-top:1px solid var(--oc-hair);}
  .oc .oc-hang .oc-stat-n{font-size:2.3rem;}
  .oc .oc-hang .oc-stat-l{margin-top:0;}
}
@media print{
  .oc .oc-fn,.oc .oc-branch#workforce,.oc .oc-drop-t i,.oc .oc-drop-t b,.oc .oc-drop-k i,.oc .oc-bar-t,.oc .oc-bar-t i{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .oc .oc-stats,.oc .oc-drop{break-inside:avoid;}
}
.oc .oc-mast .oc-lab{color:var(--oc-gd);}
.oc .oc-demo{border-top:2px solid var(--oc-g);}