/* /operacao-contabil — composição própria. Conceito: um cliente, muitos movimentos, um histórico operacional.
   Ritmo: hero com o cliente no centro (sinais chegando e seguindo, narrativo) → Cliente 360 como dossiê com lentes de papel
   (explorável) → Minha Fila por horizonte de tempo com trilho de filtros (explorável) → matriz de obrigações com bloqueio
   (revelação) → um pedido mudando de forma (narrativo) → bifurcação de documentos (revelação) → certificados → semana
   obrigação × evento → trilha de histórico (escuro) → fechamento.
   Estados ocultos de motion só existem com .is-armed (aplicado pelo JS); sem JS ou com reduced motion, tudo no estado final. */

/* ---------- Utilitários ---------- */
.oc-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:28px clamp(40px,6vw,96px);align-items:end;margin-bottom:var(--space-head)}
.oc-head .eyebrow{display:block}
.oc-head-copy{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.oc-head--stack{grid-template-columns:minmax(0,1fr);max-width:860px;gap:24px}
.oc-note{margin-top:16px;font-family:var(--f-ui);font-size:12px;color:var(--ink-2)}
.dark .oc-note{color:var(--paper-2)}
.oc-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:34px;margin-bottom:20px}
.oc-ui-foot{padding:11px 18px;border-top:1px solid var(--line);font-size:11.5px;color:var(--ink-2)}
.oc-av{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--blue-wash);color:var(--blue-text);font-family:var(--f-ui);font-size:12px;font-weight:600;flex:none}
.oc-vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip-path:inset(50%);white-space:nowrap}
.oc-h2-s{font-size:clamp(1.9rem,1.2rem + 1.8vw,2.8rem)}
@media (max-width:900px){.oc-head{grid-template-columns:minmax(0,1fr);align-items:start}}

/* ---------- Hero ---------- */
.oc-hero{padding-block:clamp(40px,5vw,88px) var(--space-section)}
.oc-hero .eyebrow{display:block;margin-bottom:24px}
.oc-h1{font-size:clamp(2.2rem,1.1rem + 3vw,4.1rem);line-height:1.05;max-width:24ch}
.oc-hero-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px clamp(40px,6vw,96px);margin-top:clamp(32px,3.4vw,48px);align-items:start}
.oc-hero-lead{max-width:46ch}
.oc-hero-side{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.oc-hero-em{display:flex;flex-direction:column;font-size:var(--fs-lead);line-height:1.5;letter-spacing:-.008em}
.oc-hero-em span:first-child{color:var(--ink-2)}
@media (max-width:900px){.oc-hero-row{grid-template-columns:minmax(0,1fr)}}

.oc-stage{margin-top:var(--space-head)}
.oc-flow{display:grid;grid-template-columns:minmax(0,1fr) clamp(28px,4vw,56px) minmax(0,1.05fr) clamp(28px,4vw,56px) minmax(0,1fr);row-gap:14px;align-items:center}
.oc-flow-k{font-size:var(--fs-label);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);font-weight:500;grid-row:1}
.oc-k-in{grid-column:1}
.oc-k-out{grid-column:5}
.oc-in,.oc-out{display:flex;flex-direction:column;gap:3px;padding:14px 16px;border-radius:14px;font-family:var(--f-ui);transition:opacity .55s var(--ease),transform .55s var(--ease),box-shadow .4s}
.oc-in{grid-column:1;background:var(--white);box-shadow:0 0 0 1px var(--line)}
.oc-out{grid-column:5;background:var(--white);box-shadow:0 0 0 1px var(--line),var(--shadow-ui)}
.oc-in[data-p="0"],.oc-ln[data-p="0"],.oc-out[data-p="0"]{grid-row:2}
.oc-in[data-p="1"],.oc-ln[data-p="1"],.oc-out[data-p="1"]{grid-row:3}
.oc-in[data-p="2"],.oc-ln[data-p="2"],.oc-out[data-p="2"]{grid-row:4}
.oc-sig-k{display:flex;align-items:center;gap:7px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.oc-sig-k svg{width:14px;height:14px;color:var(--ink-2)}
.oc-out .oc-sig-k{color:var(--blue-text)}
.oc-sig-v{font-size:13.5px;font-weight:500;line-height:1.35}
.oc-sig-m{font-size:12px;color:var(--ink-2)}
.oc-ln{position:relative;height:1px;background:var(--line-2);align-self:center}
.oc-ln-in{grid-column:2}
.oc-ln-out{grid-column:4}
.oc-ln::after{content:"";position:absolute;inset:0;background:var(--blue);transform-origin:left center;transition:transform .5s var(--ease)}
.oc-ln-out::before{content:"";position:absolute;right:-1px;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--blue)}
.oc-core{grid-column:3;grid-row:2 / span 3;align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:clamp(20px,2.4vw,30px);border-radius:20px;background:var(--ink);color:var(--paper);box-shadow:0 30px 60px -34px rgba(29,29,31,.6);transition:box-shadow .4s}
.oc-core.flash{box-shadow:0 0 0 2px var(--blue),0 30px 60px -34px rgba(29,29,31,.6)}
.oc-core-k{font-size:var(--fs-label);letter-spacing:.09em;text-transform:uppercase;color:var(--paper-2);font-weight:500}
.oc-core-n{font-size:clamp(1.25rem,1rem + .8vw,1.6rem);letter-spacing:-.02em;line-height:1.2;margin-top:6px}
.oc-core-s{font-family:var(--f-ui);font-size:12.5px;color:var(--paper-2)}
.oc-core-dl{margin:18px 0 0;display:flex;flex-direction:column;font-family:var(--f-ui)}
.oc-core-dl div{display:grid;grid-template-columns:104px minmax(0,1fr);gap:12px;padding:10px 0;border-top:1px solid var(--line-d);align-items:baseline}
.oc-core-dl dt{font-size:11.5px;color:var(--paper-3)}
.oc-core-dl dd{margin:0;font-size:13px;line-height:1.4}
.oc-core-team{display:flex;flex-wrap:wrap;gap:6px}
.oc-core-team span{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;background:rgba(245,245,247,.08);font-size:12px;transition:background .35s,color .35s}
.oc-core-team span.on{background:var(--blue);color:#fff}
[data-core-next]{transition:opacity .3s}
/* motion */
.is-armed .oc-in:not(.in){opacity:0;transform:translateX(-14px)}
.is-armed .oc-out:not(.in){opacity:0;transform:translateX(-10px)}
.is-armed .oc-ln:not(.in)::after{transform:scaleX(0)}
.is-armed .oc-ln-out:not(.in)::before{opacity:0}
.oc-ln-out::before{transition:opacity .3s .3s}
@media (max-width:900px){
  .oc-flow{grid-template-columns:minmax(0,1fr);row-gap:10px}
  .oc-flow-k,.oc-ln{display:none}
  .oc-core{grid-column:1;grid-row:auto;order:-1;margin-bottom:14px}
  .oc-in,.oc-out{grid-column:1;grid-row:auto!important}
  .oc-in[data-p="1"]{order:3}.oc-out[data-p="1"]{order:4}
  .oc-in[data-p="2"]{order:5}.oc-out[data-p="2"]{order:6}
  .oc-out[data-p="0"]{order:2}.oc-in[data-p="0"]{order:1}
  .oc-out{margin-left:28px;position:relative}
  .oc-out::before{content:"";position:absolute;left:-17px;top:-10px;height:calc(50% + 10px);width:10px;border-left:1px solid var(--blue);border-bottom:1px solid var(--blue);border-bottom-left-radius:8px}
  .oc-in[data-p="1"],.oc-in[data-p="2"]{margin-top:10px}
  .is-armed .oc-out:not(.in){transform:translateY(-6px)}
}

/* ---------- Cliente 360 · dossiê ---------- */
.oc-dos-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,264px);gap:clamp(28px,3.4vw,48px);align-items:start}
.oc-dos{overflow:hidden}
.oc-dos-id{display:flex;align-items:center;gap:14px;padding:18px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.oc-dos-mono{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--ink);color:var(--paper);font-weight:600;font-size:14px;flex:none}
.oc-dos-name{flex:1 1 220px;min-width:0}
.oc-dos-n{font-size:15px;font-weight:600}
.oc-dos-flags{display:flex;flex-wrap:wrap;gap:6px}
.oc-dos-tabs{margin:12px 20px 0}
.oc-dos-panel{padding:18px 20px 20px;min-height:292px}
.oc-dos-panel h3{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);font-weight:500;margin-bottom:10px}
.oc-g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.oc-blk{padding:14px 16px;border-radius:12px;background:#FAFAFB;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:6px}
.oc-blk b{font-weight:600;font-size:13.5px}
.oc-blk ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.oc-blk li{display:flex;gap:8px;align-items:baseline;color:var(--ink-2);font-size:12.5px}
.oc-blk li .dot{transform:translateY(-1px)}
.oc-strip{margin-top:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:12px;background:var(--blue-wash);color:var(--blue-text);font-size:12.5px}
.oc-strip b{font-weight:600}
.oc-rows{list-style:none;margin:0;padding:0}
.oc-rows li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.oc-rows li:last-child{border-bottom:0}
.oc-rows .who{font-weight:500}
.oc-rows .what{color:var(--ink-2);font-size:12.5px}
.oc-log{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.oc-log li{display:grid;grid-template-columns:86px minmax(0,1fr);gap:14px;padding:10px 0;border-bottom:1px solid var(--line);align-items:baseline}
.oc-log li:last-child{border-bottom:0}
.oc-log time{font-size:12px;color:var(--ink-2)}
.oc-log span .quiet{display:block;font-size:12px}
.oc-tbl{display:flex;flex-direction:column;font-size:12.5px}
.oc-tr{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,.7fr) minmax(0,1.2fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.oc-tr:last-child{border-bottom:0}
.oc-tr > span{min-width:0;overflow-wrap:anywhere}
.oc-tr.th{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);padding-top:0}
.oc-tr .f{font-weight:500}
.oc-lens{padding-top:4px}
.oc-lens-k{font-size:var(--fs-label);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);font-weight:500;margin-bottom:14px}
.oc-lens ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.oc-lens li{display:flex;flex-direction:column;gap:2px;padding:14px 0 14px 16px;border-top:1px solid var(--line);position:relative;transition:opacity .35s}
.oc-lens li:last-child{border-bottom:1px solid var(--line)}
.oc-lens li::before{content:"";position:absolute;left:0;top:20px;width:6px;height:6px;border-radius:50%;background:var(--neutral);transition:background .3s}
.oc-lens li b{font-weight:500;font-size:1rem;letter-spacing:-.01em}
.oc-lens li span{font-size:var(--fs-small);color:var(--ink-2);line-height:1.45}
.oc-lens li:not(.on){opacity:.42}
.oc-lens li.on::before{background:var(--blue)}
@media (max-width:980px){.oc-dos-grid{grid-template-columns:minmax(0,1fr)}.oc-lens ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}.oc-lens li:nth-last-child(2){border-bottom:1px solid var(--line)}}
@media (max-width:760px){
  .oc-g3{grid-template-columns:minmax(0,1fr)}
  .oc-dos-tabs{margin-inline:16px}
  .oc-dos-panel{padding:16px}
  .oc-dos-id{padding:16px}
  .oc-tr.th{display:none}
  .oc-tr{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"f c" "t d";gap:2px 12px}
  .oc-tr .f{grid-area:f}.oc-tr .c{grid-area:c;text-align:right;color:var(--ink-2)}.oc-tr .t{grid-area:t;color:var(--ink-2);font-size:12px}.oc-tr .d{grid-area:d;text-align:right;color:var(--ink-2);font-size:12px}
}
@media (max-width:520px){.oc-lens ul{grid-template-columns:minmax(0,1fr)}.oc-lens li:nth-last-child(2){border-bottom:0}}

/* ---------- Minha Fila ---------- */
.oc-fila{display:grid;grid-template-columns:minmax(200px,240px) minmax(0,1fr);gap:clamp(28px,3.4vw,48px);align-items:start}
.oc-fila-rail{position:sticky;top:calc(var(--header-h) + 24px)}
.oc-rail{display:flex;flex-direction:column;gap:4px}
.oc-rail button{appearance:none;border:0;background:none;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:0 12px 0 14px;border-radius:12px;font-family:var(--f-ui);font-size:13.5px;color:var(--ink-2);cursor:pointer;text-align:left;transition:background .2s,color .2s,box-shadow .2s}
.oc-rail button:hover{background:var(--wash);color:var(--ink)}
.oc-rail button[aria-pressed="true"]{background:var(--white);color:var(--ink);font-weight:500;box-shadow:0 0 0 1px var(--line),var(--shadow-ui);cursor:default}
.oc-rail-n{min-width:24px;height:22px;padding:0 7px;border-radius:999px;background:rgba(29,29,31,.06);display:grid;place-items:center;font-size:11.5px;font-weight:500;color:var(--ink-2)}
.oc-rail button[aria-pressed="true"] .oc-rail-n{background:var(--blue);color:#fff}
.oc-rail-who{display:flex;align-items:center;gap:10px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line);font-family:var(--f-ui);font-size:12.5px;line-height:1.4}
.oc-fila-board{display:flex;flex-direction:column;gap:28px;min-height:420px}
.oc-grp-k{display:flex;align-items:baseline;gap:10px;font-family:var(--f-ui);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);margin-bottom:12px}
.oc-grp-k span{font-weight:400;color:var(--ink-2);text-transform:none;letter-spacing:0}
.oc-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.oc-card{display:flex;flex-direction:column;gap:8px;padding:16px 18px;border-radius:16px;background:var(--white);box-shadow:0 0 0 1px var(--line),var(--shadow-ui);font-family:var(--f-ui);font-size:13px}
.oc-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.oc-card-due{font-size:12px;font-weight:500;color:var(--ink-2)}
.oc-card-due.today{color:var(--alert-text)}
.oc-card .who{font-weight:600;font-size:14px;line-height:1.3}
.oc-card .what{color:var(--ink-2);font-size:12.5px;margin-top:-4px}
.oc-dep{display:flex;gap:8px;align-items:baseline;font-size:12px;padding:8px 10px;border-radius:10px;background:var(--paper);color:var(--ink-2)}
.oc-dep b{font-weight:600;color:var(--ink)}
.oc-dep.block{background:rgba(255,59,48,.07)}
.oc-dep.block b{color:var(--alert-text)}
.oc-dep.wait b{color:var(--ink)}
.oc-dep.rev{background:var(--blue-wash)}
.oc-dep.rev b{color:var(--blue-text)}
.oc-card-foot{margin-top:auto;display:flex;align-items:center;gap:10px;padding-top:10px;border-top:1px solid var(--line);font-size:12.5px}
.oc-card-foot .oc-av{width:24px;height:24px;font-size:10.5px;background:var(--paper);color:var(--ink)}
.oc-card-foot .oc-av.me{background:var(--blue-wash);color:var(--blue-text)}
.oc-card-foot p{min-width:0}
.oc-card-foot p span{color:var(--ink-2)}
.oc-empty{padding:28px;border-radius:16px;background:var(--wash);font-family:var(--f-ui);font-size:13px;color:var(--ink-2)}
@media (max-width:980px){
  .oc-fila{grid-template-columns:minmax(0,1fr);gap:20px}
  .oc-fila-rail{position:static}
  .oc-rail{flex-direction:row;overflow-x:auto;padding:2px 2px 6px;gap:6px}
  .oc-rail button{flex:none;min-height:42px}
  .oc-rail-who{margin-top:12px;padding-top:0;border-top:0}
}
@media (max-width:640px){.oc-cards{grid-template-columns:minmax(0,1fr)}.oc-fila-board{min-height:0}}

/* ---------- Obrigações · matriz ---------- */
.oc-mx{--lab:minmax(200px,1.35fr);font-family:var(--f-ui)}
.oc-mx-head,.oc-mx-row{display:grid;grid-template-columns:var(--lab) repeat(6,minmax(0,1fr));column-gap:6px}
.oc-mx-head{padding:0 0 14px;border-bottom:1px solid var(--line-2);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.oc-mx-head span:first-child{padding-right:18px}
.oc-mx-rows{list-style:none;margin:0;padding:0}
.oc-mx-row{padding:22px 0;border-bottom:1px solid var(--line);row-gap:6px;align-items:center}
.oc-mx-label{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:2px;padding-right:18px}
.oc-mx-label b{font-weight:600;font-size:14px}
.oc-mx-label span{font-size:12px;color:var(--ink-2)}
.oc-mx-state{grid-column:1;grid-row:2;font-size:12.5px;color:var(--ink);padding-right:18px}
.oc-mx-bar{display:contents;list-style:none}
.oc-mx-bar li{grid-row:1 / span 2;height:10px;border-radius:5px;background:var(--line-2);font-size:0;color:transparent;transition:background .45s var(--ease);transition-delay:calc(var(--i,0) * 110ms)}
.oc-mx-bar li.done{background:var(--ink)}
.oc-mx-bar li.now{background:var(--blue)}
.oc-mx-bar li.block{background:var(--alert)}
.oc-mx-row.is-blocked .oc-mx-state{color:var(--alert-text)}
.oc-mx-why{grid-column:2 / -1;grid-row:3;display:flex;gap:10px;align-items:baseline;margin-top:10px;padding:12px 14px;border-radius:12px;background:rgba(255,59,48,.06);font-size:12.5px;line-height:1.5;color:var(--ink-2);transition:opacity .5s var(--ease) .7s,transform .5s var(--ease) .7s}
.oc-mx-why b{font-weight:600;color:var(--ink)}
.oc-mx-why .chip{flex:none}
.is-armed .oc-mx-row:not(.in) .oc-mx-bar li{background:var(--line-2)}
.is-armed .oc-mx-row:not(.in) .oc-mx-why{opacity:0;transform:translateY(6px)}
.is-armed .oc-mx-row:not(.in) .oc-mx-state{opacity:0}
.oc-mx-state{transition:opacity .4s .6s}
@media (max-width:760px){
  .oc-mx-head{display:none}
  .oc-mx-row{grid-template-columns:repeat(6,minmax(0,1fr));row-gap:10px}
  .oc-mx-label{grid-column:1 / -1;grid-row:1;padding-right:0}
  .oc-mx-bar li{grid-row:2;height:8px}
  .oc-mx-state{grid-column:1 / -1;grid-row:3;padding-right:0}
  .oc-mx-why{grid-column:1 / -1;grid-row:4;margin-top:4px}
}

/* ---------- Solicitação mudando de forma ---------- */
.oc-morph-grid{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:clamp(28px,4vw,72px);align-items:start}
.oc-forms{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.oc-forms li{display:flex;flex-direction:column;gap:2px;padding:14px 0 14px 18px;border-left:2px solid var(--line-2);transition:border-color .4s,opacity .4s}
.oc-forms-n{font-size:var(--fs-h3);letter-spacing:-.018em;line-height:1.2}
.oc-forms-d{font-size:var(--fs-small);color:var(--ink-2)}
.oc-forms li.on{border-color:var(--blue)}
.oc-forms li.on .oc-forms-n{color:var(--ink)}
.is-armed .oc-forms li:not(.on):not(.past){opacity:.35}
.oc-forms li.past{opacity:.6}
.oc-obj{overflow:hidden}
.oc-obj-type{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:12px;font-weight:600;letter-spacing:.01em;transition:background .3s}
.oc-obj-keep{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;padding:12px 18px;background:#FAFAFB;border-bottom:1px solid var(--line);font-size:12.5px}
.oc-obj-keep span:first-child{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.oc-obj-keep svg{width:13px;height:13px}
.oc-obj-body{padding:18px;min-height:206px}
.oc-obj-hist{padding:14px 18px 16px;border-top:1px solid var(--line);display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px}
.oc-obj-hk{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);padding-top:2px}
.oc-obj-hist ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:12.5px;min-height:110px}
.oc-obj-hist li{display:flex;gap:10px}
.oc-obj-hist time{color:var(--ink-2);flex:none;width:44px}
.oc-bubble{max-width:440px;padding:12px 14px;border-radius:14px 14px 14px 4px;background:var(--paper);font-size:13.5px;line-height:1.5}
.oc-from{font-size:12px;color:var(--ink-2);margin-bottom:8px}
.oc-kv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px}
.oc-kv div{display:flex;flex-direction:column;gap:2px}
.oc-kv dt{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.oc-kv dd{margin:0;font-size:13px}
.oc-kv{margin:0}
.oc-check{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.oc-check li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.oc-check li:last-child{border-bottom:0}
.oc-proto{display:flex;flex-direction:column;gap:10px}
.oc-proto-n{font-size:clamp(1.15rem,1rem + .6vw,1.45rem);letter-spacing:-.01em;font-family:var(--f-brand)}
.oc-body-k{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);margin-bottom:10px}
@media (max-width:860px){
  .oc-morph-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  .oc-forms{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
  .oc-forms li{padding:0 0 8px;border-left:0;border-bottom:2px solid var(--line-2);min-width:0}
  .oc-forms-n{font-family:var(--f-ui);font-size:11.5px;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .oc-forms-d{display:none}
}
@media (max-width:520px){.oc-kv{grid-template-columns:minmax(0,1fr)}.oc-obj-hist{grid-template-columns:minmax(0,1fr);gap:6px}}

/* ---------- Documentos · bifurcação ---------- */
.oc-fork{display:flex;flex-direction:column;gap:clamp(28px,3vw,40px);font-family:var(--f-ui)}
.oc-fork-k{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:500;margin-bottom:12px}
.oc-fork-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.oc-fork-steps li{position:relative;display:flex;flex-direction:column;gap:3px;padding:14px 16px;border-radius:14px;background:var(--paper);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.oc-fork-steps li:not(:last-child)::after{content:"";position:absolute;left:100%;top:50%;width:32px;height:1px;background:var(--neutral)}
.oc-fork-steps li:not(:last-child)::before{content:"";position:absolute;left:calc(100% + 26px);top:calc(50% - 3px);width:6px;height:6px;border-top:1px solid var(--neutral);border-right:1px solid var(--neutral);transform:rotate(45deg);transform-origin:center}
.oc-fork-steps .k{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.oc-fork-steps .v{font-size:13.5px;font-weight:500;line-height:1.35;overflow-wrap:anywhere}
.oc-fork-steps .m{font-size:12px;color:var(--ink-2)}
.oc-fork-steps li.doubt{background:rgba(255,59,48,.06);box-shadow:inset 0 0 0 1px rgba(255,59,48,.22)}
.oc-fork-steps li.doubt .k{color:var(--alert-text)}
.oc-fork-steps li.human{background:var(--blue-wash);box-shadow:inset 0 0 0 1px rgba(0,122,255,.25)}
.oc-fork-steps li.human .k{color:var(--blue-text)}
.oc-fork-steps li.end{background:var(--ink);color:var(--paper)}
.oc-fork-steps li.end .k,.oc-fork-steps li.end .m{color:var(--paper-2)}
.is-armed .oc-fork-steps li:not(.in){opacity:0;transform:translateX(-10px)}
@media (max-width:860px){
  .oc-fork-steps{grid-template-columns:minmax(0,1fr);gap:18px}
  .oc-fork-steps li:not(:last-child)::after{left:24px;top:100%;width:1px;height:18px}
  .oc-fork-steps li:not(:last-child)::before{left:21px;top:calc(100% + 11px);transform:rotate(135deg)}
  .is-armed .oc-fork-steps li:not(.in){transform:translateY(-8px)}
}

/* ---------- Certificados ---------- */
.oc-cert{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,5vw,88px);align-items:center}
.oc-vault{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:16px;background:var(--white);box-shadow:0 0 0 1px var(--line)}
.oc-vault-ic{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--ink);color:var(--paper);flex:none}
.oc-vault-ic svg{width:16px;height:16px}
.oc-vault-t{font-weight:500;font-size:.95rem}
.oc-vault-d{font-size:var(--fs-small);color:var(--ink-2);line-height:1.5;margin-top:2px}
.oc-cert-ui{overflow:hidden}
.oc-cert-ui{--cc:minmax(0,1.25fr) minmax(0,1fr) minmax(0,.85fr) minmax(0,.8fr) minmax(0,1.3fr)}
.oc-cert-cols,.oc-cert-list li{display:grid;grid-template-columns:var(--cc);gap:12px;align-items:center;padding:12px 18px}
.oc-cert-cols{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);background:#FAFAFB;border-bottom:1px solid var(--line);padding-block:9px}
.oc-cert-list{list-style:none;margin:0;padding:0}
.oc-cert-list li{border-bottom:1px solid var(--line)}
.oc-cert-list li:last-child{border-bottom:0}
.oc-c-emp{font-weight:500}
.oc-c-type,.oc-c-resp{color:var(--ink-2);font-size:12.5px}
.oc-c-val{font-size:12.5px}
.oc-c-st .chip{max-width:100%}
@media (max-width:1100px){.oc-cert{grid-template-columns:minmax(0,1fr)}.oc-cert-copy{max-width:640px}}
@media (max-width:640px){
  .oc-cert-cols{display:none}
  .oc-cert-list li{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"emp st" "type val" "resp resp";gap:4px 12px;padding:14px 16px}
  .oc-c-emp{grid-area:emp}.oc-c-st{grid-area:st;justify-self:end}.oc-c-type{grid-area:type}.oc-c-val{grid-area:val;justify-self:end;color:var(--ink-2)}.oc-c-resp{grid-area:resp}
  .oc-c-resp::before{content:"Responsável: "}
}

/* ---------- Agenda ---------- */
.oc-week-legend{display:flex;flex-wrap:wrap;gap:10px 28px;margin-bottom:20px;font-family:var(--f-ui);font-size:12.5px;color:var(--ink-2)}
.oc-lg{display:inline-flex;align-items:center;gap:10px}
.oc-lg i{width:18px;height:12px;border-radius:4px;flex:none}
.oc-lg-obr i{background:var(--blue-wash);box-shadow:inset 3px 0 0 var(--blue)}
.oc-lg-evt i{border:1px dashed var(--neutral)}
.oc-days{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;font-family:var(--f-ui)}
.oc-days > li{display:flex;flex-direction:column;gap:8px;padding:14px 12px 16px;border-radius:16px;background:var(--paper);min-height:240px}
.oc-day{font-size:12px;color:var(--ink-2);display:flex;align-items:baseline;gap:6px;margin-bottom:4px}
.oc-day b{font-family:var(--f-brand);font-weight:400;font-size:1.5rem;color:var(--ink);letter-spacing:-.03em}
.oc-it{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:10px;font-size:12.5px;line-height:1.35}
.oc-it .t{font-size:11px;color:var(--ink-2)}
.oc-it .n{font-weight:500}
.oc-it.obr{background:var(--white);box-shadow:inset 3px 0 0 var(--blue),0 0 0 1px var(--line)}
.oc-it.obr .t{color:var(--blue-text)}
.oc-it.evt{border:1px dashed var(--neutral)}
@media (max-width:900px){
  .oc-days{grid-template-columns:minmax(0,1fr);gap:8px}
  .oc-days > li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:8px 12px;min-height:0;padding:12px 14px;align-items:start}
  .oc-day{grid-row:1 / span 3;flex-direction:column;gap:0;margin:0}
  .oc-it{grid-column:2}
}

/* ---------- Histórico (escuro) ---------- */
.oc-trail{overflow:hidden}
.oc-trail-head{flex-wrap:wrap}
.oc-trail-filter{font-size:12px;color:var(--paper-2);display:inline-flex;align-items:center;height:28px;padding:0 10px;border-radius:8px;background:rgba(245,245,247,.06)}
.oc-trail{--tc:96px 90px minmax(0,1.15fr) minmax(0,1.35fr) minmax(0,.95fr)}
.oc-trail-cols,.oc-trail-list li{display:grid;grid-template-columns:var(--tc);gap:16px;padding:13px 18px;align-items:baseline}
.oc-trail-cols{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--paper-3);border-bottom:1px solid var(--line-d);padding-block:9px}
.oc-trail-list{list-style:none;margin:0;padding:0}
.oc-trail-list li{border-bottom:1px solid var(--line-d);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.oc-trail-list li:last-child{border-bottom:0}
.oc-t-when{font-size:12px;color:var(--paper-2)}
.oc-t-who{font-weight:500}
.oc-t-ctx{font-size:12.5px;color:var(--paper-2)}
.oc-t-chg{font-size:12.5px}
.oc-t-chg s{color:var(--paper-3)}
.is-armed .oc-trail-list li:not(.in){opacity:0;transform:translateY(6px)}
@media (max-width:860px){
  .oc-trail-cols{display:none}
  .oc-trail-list li{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"what when" "who who" "ctx ctx" "chg chg";gap:3px 12px;padding:14px 16px}
  .oc-t-what{grid-area:what;font-weight:500}.oc-t-when{grid-area:when;justify-self:end}.oc-t-who{grid-area:who;font-weight:400;font-size:12.5px;color:var(--paper-2)}.oc-t-ctx{grid-area:ctx}.oc-t-chg{grid-area:chg}
  .oc-t-who::before{content:"Por "}
  .oc-t-chg:empty,.oc-t-chg.none{display:none}
}

/* ---------- Fechamento ---------- */
.oc-close .wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);gap:48px clamp(40px,7vw,120px);align-items:end}
.oc-close-main{display:flex;flex-direction:column;gap:28px;align-items:flex-start}
.oc-close-main .lead{max-width:48ch}
.oc-next{display:flex;flex-direction:column}
.oc-next-k{font-size:var(--fs-label);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);font-weight:500;margin-bottom:10px}
.oc-next a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;border-top:1px solid var(--line-2);text-decoration:none;font-size:1.05rem;letter-spacing:-.01em;transition:color .2s}
.oc-next a:last-child{border-bottom:1px solid var(--line-2)}
.oc-next a:hover{color:var(--blue-text)}
@media (max-width:900px){.oc-close .wrap{grid-template-columns:minmax(0,1fr)}}

/* =====================================================================
   MOBILE (≤ 720px) · refinamento editorial — desktop/tablet intocados.
   Fila operacional contínua: produto logo após a primeira ideia, complemento depois do visual,
   UI sem metadado terciário e controles de toque ≥ 44px.
   ===================================================================== */
@media (max-width:720px){
  /* Hero: lead → CTAs → sinais (visual) → frase de apoio. Sem duplicar conteúdo (display:contents + order). */
  .oc-h1{font-size:min(2.2rem,var(--fs-display))}
  .oc-hero .wrap{display:flex;flex-direction:column}
  .oc-hero-row,.oc-hero-side{display:contents}
  .oc-hero-lead{order:1;margin-top:24px}
  .oc-hero .btn-row{order:2;margin-top:24px}
  .oc-stage{order:3;margin-top:36px}
  .oc-hero-em{order:4;margin-top:24px}
  .oc-bar{margin-bottom:14px}
  .oc-core{padding:20px}

  /* Cliente 360: faixa de abas rolável, ativo sempre visível; lentes compactas */
  .oc-dos-tabs{scroll-padding-inline:12px;scrollbar-width:none}
  .oc-dos-tabs::-webkit-scrollbar{display:none}
  .oc-dos-tabs .tab{height:44px}
  .oc-dos-panel{min-height:0}
  .oc-lens li{padding:10px 0 10px 16px}
  .oc-lens li::before{top:16px}

  /* Minha Fila: filtros em faixa rolável (≥44px), cards enxutos com prazo · cliente · estado · próximo passo */
  .oc-rail{scroll-padding-inline:4px;scrollbar-width:none}
  .oc-rail::-webkit-scrollbar{display:none}
  .oc-rail button{min-height:44px}
  .oc-fila-board{gap:22px}
  .oc-cards{gap:10px}
  .oc-card{padding:14px 16px;gap:7px}
  .oc-card .oc-card-due{font-size:12.5px;color:var(--ink)}
  .oc-card .oc-card-due.today{color:var(--alert-text)}

  /* Obrigações: etapas nomeadas (3 × 2) em vez de barra muda — estado legível sem tabela estreita */
  .oc-mx-row{padding:18px 0}
  .oc-mx-bar{display:grid;grid-column:1 / -1;grid-row:2;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:0;padding:0}
  .oc-mx-bar li{grid-row:auto;height:auto;min-height:28px;display:flex;align-items:center;padding:4px 8px;border-radius:7px;font-size:11.5px;line-height:1.2;color:var(--ink-2);transition:background .45s var(--ease),color .45s var(--ease);transition-delay:calc(var(--i,0) * 80ms)}
  .oc-mx-bar li.done{color:var(--paper)}
  .oc-mx-bar li.now{color:#fff;font-weight:600}
  .oc-mx-bar li.block{color:#fff;font-weight:600}
  .is-armed .oc-mx-row:not(.in) .oc-mx-bar li{color:var(--ink-2)}

  /* Pedido mudando de forma: faixa de etapas legível até 360 */
  .oc-forms{gap:3px}
  .oc-forms-n{font-size:11px}

  /* Certificados: produto antes do cofre; validade e responsável em destaque */
  .oc-cert{display:flex;flex-direction:column;gap:0}
  .oc-cert-copy{display:contents}
  .oc-cert-copy > .stack-m{order:1}
  .oc-cert-copy > .body{order:2;margin-top:20px}
  .oc-cert-ui{order:3;margin-top:28px}
  .oc-vault{order:4;margin-top:16px}
  .oc-h2-s{font-size:var(--fs-h2)}
  .oc-cert-ui .ui-head .ui-meta{display:none}
  .oc-c-val{color:var(--ink)!important;font-weight:500}
  .oc-c-resp{color:var(--ink)}

  /* Agenda: poucos eventos focados (o dia com um só compromisso sai no telefone) */
  .oc-week-legend{flex-direction:column;gap:8px;margin-bottom:16px}
  .oc-days > li:nth-child(2){display:none}

  /* Histórico: sem o filtro decorativo do cabeçalho */
  .oc-trail-filter{display:none}

  .oc-note{margin-top:12px}
}
