/* Fecha a emenda subpixel entre os dois fundos brancos sem alterar o layout. */
#expedienteSection + #integracoesSection::before {
    content: '';
    position: absolute;
    top: -2px;
    right: 0;
    left: 0;
    height: 3px;
    background: #fff;
    pointer-events: none;
}

/* Integrações: a mesma transição suave dos cards, em tons de cinza. */
#integracoesSection .intg-grade {
    top: -92px;
    background: linear-gradient(165deg, #f5f5f7 0%, #f9f9fa 50%, #fcfcfd 100%);
    border: 1px solid #e3e4e8;
}

/* Acabamento comum das cinco ilustrações do expediente. */
#expedienteSection {
    --exp-cartao: linear-gradient(165deg, #f5f5f7 0%, #f9f9fa 50%, #fcfcfd 100%);
    --exp-contorno: #e3e4e8;
    --exp-contorno-ilustracao: #e0e2e7;
    --exp-tinta: #24262b;
    --exp-tinta-2: #5f636b;
    --exp-branco: #fff;
    --exp-superficie-suave: #f0f1f4;
    --exp-superficie-hover: #e8eaee;
    --exp-fio: #d1d4da;
    --exp-fio-forte: #70757d;
    --exp-divisor-interno: #e1e3e7;
    --exp-ilustracao: clamp(350px, 30vw, 432px);
}

#expedienteSection .exp-grade { grid-template-rows: none; gap: 20px; }
#expedienteSection .exp-linha {
    grid-template-rows: var(--exp-ilustracao) auto auto;
    column-gap: 20px;
    row-gap: 0;
}
#expedienteSection .exp-linha--topo { grid-template-rows: auto auto auto; }
#expedienteSection .exp-card {
    grid-row: span 3;
    display: grid;
    grid-template-rows: subgrid;
    min-height: 0;
    padding: 28px;
    border: 1px solid var(--exp-contorno);
    border-radius: 24px;
    background: var(--exp-cartao);
}
#expedienteSection .exp-card > .exp-vao {
    grid-row: 1;
    min-width: 0;
    min-height: 0;
    height: auto;
    margin: 16px 0 28px;
    align-self: stretch;
}
#expedienteSection .exp-text { display: contents; }
#expedienteSection .exp-title {
    grid-row: 2;
    margin: 0 0 10px;
    color: var(--exp-tinta);
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -.025em;
    text-wrap: pretty;
}
#expedienteSection .exp-desc {
    grid-row: 3;
    margin: 0;
    color: var(--exp-tinta-2);
    font-size: .88rem;
    font-weight: 400;
    line-height: 1.65;
    letter-spacing: -.01em;
    text-wrap: pretty;
}

/* Títulos de alturas diferentes mantêm a mesma distância até a descrição. */
@media (min-width: 961px) {
    #expedienteSection .exp-title { align-self: end; }
}

/* Mesmo espaço visual; as proporções internas de cada interface são mantidas. */
#expedienteSection .exp-vao--painel {
    container-type: inline-size;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}
#expedienteSection .pn-app {
    width: 94%;
    max-width: 100%;
    margin: 0;
    font-size: calc(94cqw / 86);
    background: transparent;
}
#expedienteSection .conta-composicao {
    font-size: min(calc(100cqw / 30.2), calc(100cqh / 32));
}
#expedienteSection .conta-painel { padding: 0 .8em; }
#expedienteSection .conta-cabecalho { padding-top: 0; }
#expedienteSection .conta-cabecalho,
#expedienteSection .conta-convite,
#expedienteSection .conta-pessoa + .conta-pessoa::before,
#expedienteSection .recado-wa-cabecalho { border-color: var(--exp-fio); }

/* Limpa as molduras antigas antes de aplicar os contornos discretos abaixo. */
#expedienteSection .conta-convidar,
#expedienteSection .recado-wa-dia,
#expedienteSection .recado-wa-balao,
#expedienteSection .recado-wa-campo,
#expedienteSection .luna-busca,
#expedienteSection .luna-arquivo,
#expedienteSection .luna-arquivo-folha,
#expedienteSection .luna-arquivo-download,
#expedienteSection .luna-notificacao,
#expedienteSection .luna-notificacao > img,
#expedienteSection .drive-janela,
#expedienteSection .drive-pasta,
#expedienteSection .drive-pasta:hover,
#expedienteSection .drive-janela .dv-fila,
#expedienteSection .drive-janela .dv-arq,
#expedienteSection .drive-janela .dv-log,
#expedienteSection .drive-janela .dv-glifo,
#expedienteSection .drive-janela .dv-bt,
#expedienteSection .pn-balao,
#expedienteSection .pn-seta {
    border: 0;
    box-shadow: none;
}
#expedienteSection .drive-janela .dv-fila[data-ir]:hover,
#expedienteSection .drive-janela .dv-arq[data-ir]:hover { box-shadow: none; transform: none; background: var(--exp-superficie-hover); }

/* Traço interno de 1px, sem desfoque ou mudança no tamanho das superfícies. */
#expedienteSection .conta-convidar,
#expedienteSection .recado-wa-campo,
#expedienteSection .luna-busca,
#expedienteSection .luna-arquivo,
#expedienteSection .luna-notificacao,
#expedienteSection .drive-janela,
#expedienteSection .pn-balao {
    outline: 1px solid var(--exp-contorno-ilustracao);
    outline-offset: -1px;
}
#expedienteSection .luna-arquivo-folha,
#expedienteSection .drive-pasta,
#expedienteSection .drive-janela .dv-fila,
#expedienteSection .drive-janela .dv-arq,
#expedienteSection .drive-janela .dv-log {
    outline: 1px solid var(--exp-divisor-interno);
    outline-offset: -1px;
}
#expedienteSection .pn-rotulo i,
#expedienteSection .drive-janela .dv-rot::after { background: transparent; }
#expedienteSection .luna-arquivo-previa { background: #dde0e5; border-color: var(--exp-divisor-interno); }
#expedienteSection .luna-arquivo-linhas i { background: #d9dde3; }
#expedienteSection .drive-recebido { background: #f5f6f8; border-color: var(--exp-divisor-interno); }
#expedienteSection .drive-cabecalho { border-color: var(--exp-divisor-interno); }
#expedienteSection .drive-pasta { background: var(--exp-superficie-suave); }
#expedienteSection .drive-pasta:hover { background: var(--exp-superficie-hover); }

/* Superfícies brancas e neutros frios, sem perder a identidade de cada função. */
#expedienteSection .conta-composicao,
#expedienteSection .luna-composicao,
#expedienteSection .drive-janela,
#expedienteSection .luna-arquivo-titulo,
#expedienteSection .luna-arquivo-dados strong,
#expedienteSection .luna-notificacao-cabecalho strong,
#expedienteSection .luna-notificacao-conteudo p { color: var(--exp-tinta); }
#expedienteSection .conta-total { background: var(--exp-branco); }
#expedienteSection .conta-avatar { color: var(--exp-tinta-2); }

/* Metadados com contraste consistente sobre cinza, branco e verde do WhatsApp. */
#expedienteSection .conta-cabecalho p,
#expedienteSection .conta-lista-titulo,
#expedienteSection .conta-papel,
#expedienteSection .conta-nome > span,
#expedienteSection .conta-numero,
#expedienteSection .luna-arquivo-meta,
#expedienteSection .luna-arquivo-dados > span,
#expedienteSection .luna-notificacao-cabecalho > span,
#expedienteSection .drive-arquivo small,
#expedienteSection .drive-confirmacao,
#expedienteSection .drive-confirmacao > strong,
#expedienteSection .recado-wa-dia,
#expedienteSection .recado-wa-assessora > span,
#expedienteSection .recado-wa-hora,
#expedienteSection .recado-wa-campo > span { color: var(--exp-tinta-2); }

#expedienteSection .conta-opcoes,
#expedienteSection .conta-convite-seta,
#expedienteSection .luna-busca > svg,
#expedienteSection .luna-arquivo-download,
#expedienteSection .drive-historico,
#expedienteSection .drive-pasta > svg,
#expedienteSection .drive-arquivo-seta,
#expedienteSection .drive-confirmacao > svg,
#expedienteSection .recado-wa-compositor,
#expedienteSection .recado-wa-campo > svg { color: var(--exp-fio-forte); }

/* Pastas, arquivos e histórico usam a mesma paleta em todos os estados do Drive. */
#expedienteSection .drive-janela .dv-fila,
#expedienteSection .drive-janela .dv-arq,
#expedienteSection .drive-janela .dv-log { background: var(--exp-superficie-suave); }
#expedienteSection .drive-janela .dv-bt.is-tocado,
#expedienteSection .drive-janela .dv-fila.is-tocado,
#expedienteSection .drive-janela .dv-arq.is-tocado { background: var(--exp-superficie-hover); }
#expedienteSection .drive-janela .dv-carimbo {
    color: #934369;
    border-color: #e4cbd9;
    background: #fbf6f9;
}

@media (max-width: 960px) {
    #expedienteSection .exp-grade { gap: 16px; }
    #expedienteSection .exp-linha { grid-template-rows: none; gap: 16px; }
    #expedienteSection .exp-card {
        grid-row: auto;
        display: flex;
        flex-direction: column;
        padding: 24px 20px;
        border-radius: 22px;
    }
    #expedienteSection .exp-card > .exp-vao {
        flex: none;
        height: clamp(310px, 90vw, 370px);
        margin: 12px 0 24px;
    }
    #expedienteSection .exp-card > .exp-vao--painel {
        container-type: inline-size;
        height: auto;
        min-height: 300px;
    }
    #expedienteSection .pn-app { width: 100%; font-size: calc(100cqw / 86); }
    #expedienteSection .exp-text { display: block; }
    #expedienteSection .exp-title { font-size: 1rem; }
    #expedienteSection .exp-desc { font-size: .875rem; }
}
@media (max-width: 600px) {
    #expedienteSection .pn-app { font-size: min(calc(100cqw / 36), 10.5px); }
}
