/* ═══════════════════════════════════════════════════════════════════════
   CRM CONFIANÇA — orcamento/orcamento.css: o pedido de orçamento (público)
   Vem depois de tokens.css e base.css; só a camada semântica dos tokens.
   Papel claro, laranja como única cor saturada, títulos Fraunces, texto
   Archivo ≥ 14px, nada de rótulo em mono maiúsculo (contrato §16).
   ═══════════════════════════════════════════════════════════════════════ */

body.orc{min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; background:var(--fundo)}
.orc > main{flex:1 0 auto; width:100%}

/* ── topo ─────────────────────────────────────────────────────────────── */
.orc-topo{position:relative; z-index:2; box-shadow:0 1px 0 var(--borda); background:var(--banda-header)}
.orc-topo-dentro{max-width:1180px; margin:0 auto; min-height:68px; padding:10px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:16px}
.orc-marca{display:inline-flex; align-items:center; gap:10px; font-family:var(--serif); font-size:20px; line-height:1;
  color:var(--marca-nome); white-space:nowrap}
.orc-marca .prumo{height:36px}
.orc-marca b{font-weight:600; font-variation-settings:var(--serif-titulo)}
.orc-traco{display:inline-block; width:18px; height:2px; background:var(--marca-fio); margin:0 2px}
.orc-marca-sub{font-family:var(--sans); font-size:15px; color:var(--texto-2)}
.orc-topo-link{font-size:15px; font-weight:500; color:var(--acento-texto); text-decoration:none; white-space:nowrap;
  min-height:44px; display:inline-flex; align-items:center}
.orc-topo-link:hover{color:var(--texto); text-decoration:underline}

/* ── página: apresentação + folha do pedido ──────────────────────────── */
.orc-pagina{max-width:1180px; margin:0 auto; padding:44px 24px 64px;
  display:grid; grid-template-columns:minmax(0,1fr); gap:28px; align-items:start}
@media (min-width:1000px){
  .orc-pagina{grid-template-columns:minmax(0,380px) minmax(0,1fr); gap:56px}
  .orc-intro{position:sticky; top:28px}
}

.orc-intro .rotulo{margin:0 0 8px}
.orc-intro h1{font-size:clamp(32px,4vw,46px); line-height:1.08}
.orc-intro-sub{margin-top:14px; font-size:17px; line-height:1.6; color:var(--texto-2); max-width:44ch}
.orc-intro-pe{margin-top:22px; font-size:15px; color:var(--texto-2)}
.orc-intro-pe a{color:var(--acento-texto); font-weight:500}

/* as três etapas: régua vertical com marco numerado */
.orc-etapas{list-style:none; padding:0; margin:26px 0 0; counter-reset:etapa}
.orc-etapas li{position:relative; counter-increment:etapa; padding:0 0 18px 44px; min-height:30px}
.orc-etapas li::before{content:counter(etapa); position:absolute; left:0; top:0; width:28px; height:28px; border-radius:50%;
  display:grid; place-items:center; border:1.5px solid var(--borda-forte); background:var(--cartao);
  font-size:14px; font-weight:600; color:var(--texto-2); font-variant-numeric:tabular-nums}
.orc-etapas li::after{content:""; position:absolute; left:13px; top:30px; bottom:2px; width:2px; background:var(--borda)}
.orc-etapas li:last-child::after{display:none}
.orc-etapas li:first-child::before{border-color:var(--acento); color:var(--acento-texto)}
.orc-etapas b{display:block; font-size:16px; font-weight:600; line-height:28px; color:var(--texto)}
.orc-etapas span{display:block; font-size:15px; line-height:1.5; color:var(--texto-2)}
.orc-etapas-pronto li:first-child::before{content:""; background:var(--ouro-texto); border-color:var(--ouro-texto)}
.orc-etapas-pronto li.feito::before{background:var(--ouro-texto) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%23FCFCFA' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.orc-etapas-pronto li:nth-child(2)::before{border-color:var(--acento); color:var(--acento-texto)}

/* ── a folha (cartão-documento) ──────────────────────────────────────── */
.orc-folha{--cor:var(--acento); min-width:0}
.orc-folha .doc-cab h2{font-size:22px}
.orc-cab-nota{font-size:14px; color:var(--texto-3)}
.orc-form{display:flex; flex-direction:column; gap:30px; padding:26px 28px 30px}
.orc-erro{font-size:15px}

.orc-grupo{border:0; padding:0; margin:0; min-width:0; display:flex; flex-direction:column; gap:16px}
.orc-grupo + .orc-grupo{padding-top:26px;
  background-image:radial-gradient(circle at 2px 1.5px, var(--borda-forte) 1.2px, transparent 1.4px);
  background-size:7px 3px; background-repeat:repeat-x; background-position:left top}
/* legend com float: deixa de ser a "legenda renderizada" do fieldset e vira um item comum do flex
   (senão ela monta em cima da borda e o pontilhado passa pelo meio do título) */
.orc-grupo > legend{float:left; width:100%; display:flex; align-items:center; gap:12px; padding:0; margin:0 0 2px;
  font-family:var(--serif); font-variation-settings:var(--serif-h3); font-size:21px; line-height:1.25; color:var(--texto)}
.orc-n{display:inline-grid; place-items:center; width:28px; height:28px; flex:none; border-radius:50%;
  border:1.5px solid var(--acento); color:var(--acento-texto); font-family:var(--sans); font-size:14px; font-weight:600;
  font-variant-numeric:tabular-nums}
.orc-grupo-sub{margin-top:-6px; font-size:15px; line-height:1.55; color:var(--texto-2)}
.orc-form .campo > .campo-rotulo{font-size:15px}
.orc-form .campo input:not([type=checkbox]):not([type=radio]):not([type=file]), .orc-form .campo select, .orc-form .campo textarea{
  min-height:48px; font-size:16px}
.orc-form .campo-ajuda{font-size:14px}
.orc-curto{max-width:320px}
.orc-soueu{font-size:16px; min-height:44px; align-items:center}

/* matrícula: área de soltar + lista */
.orc-soltar{position:relative; min-height:88px; padding:16px 18px; gap:16px}
.orc-soltar-ico{width:26px; height:26px; color:var(--acento)}
.orc-soltar-txt{display:flex; flex-direction:column; gap:2px; font-size:15px; line-height:1.4}
.orc-soltar-txt b{font-size:16px}
.campo.com-erro .orc-soltar{border-color:var(--acento)}
.orc-arquivos{list-style:none; padding:0; margin:4px 0 0; display:flex; flex-direction:column; gap:8px}
.orc-arquivos:empty{display:none}
.orc-arq{position:relative; display:grid; grid-template-columns:22px minmax(0,1fr) auto auto; align-items:center; gap:4px 12px;
  padding:10px 8px 10px 14px; border:1px solid var(--borda); border-radius:var(--raio); background:var(--cartao); overflow:hidden}
.orc-arq > .ico{color:var(--texto-3)}
.orc-arq-txt{display:flex; flex-direction:column; min-width:0}
.orc-arq-nome{font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.orc-arq-info{font-size:14px; color:var(--texto-3); font-variant-numeric:tabular-nums}
.orc-arq-estado{display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:500; color:var(--texto-2); white-space:nowrap}
.orc-arq-estado .ico{width:16px; height:16px}
.orc-arq-estado.ok{color:var(--ouro-texto)}
.orc-arq-estado.erro{color:var(--acento-texto); white-space:normal; max-width:28ch}
.orc-arq-acoes{display:inline-flex; align-items:center; gap:4px}
.orc-arq .progresso{position:absolute; left:0; right:0; bottom:0; border-radius:0}
.orc-arq .progresso > i{transition:transform var(--gesto) var(--ease)}
.orc-arq.e-erro{border-color:var(--acento); background:var(--erro-fundo)}

/* opções (tipo, finalidade): rádio de verdade com cara de chip */
.orc-opcoes{display:flex; flex-wrap:wrap; gap:8px}
.orc-opcao{position:relative; display:inline-flex}
.orc-opcao input{position:absolute; opacity:0; width:1px; height:1px; pointer-events:none}
.orc-opcao span{display:inline-flex; align-items:center; min-height:44px; padding:8px 16px; border:1px solid var(--borda-forte);
  border-radius:var(--raio); background:var(--cartao); color:var(--texto); font-size:15px; font-weight:500; line-height:1.2;
  cursor:pointer; user-select:none; transition:border-color var(--tique) ease, background-color var(--tique) ease, color var(--tique) ease}
.orc-opcao:hover span{border-color:var(--acento)}
.orc-opcao input:checked + span{background:var(--acento); border-color:var(--acento); color:var(--sobre-acento)}
.orc-opcao input:focus-visible + span{outline:2px solid var(--acento); outline-offset:2px}
.campo.com-erro .orc-opcao span{border-color:var(--acento)}

/* isca: fora da tela (leitor de tela também não chega: aria-hidden + tabindex -1) */
.orc-isca{position:absolute !important; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden}

.orc-enviar{display:flex; flex-direction:column; gap:12px; padding-top:6px}
.orc-enviar .bt{min-height:58px; font-size:17px}
.orc-progresso{max-width:none}
.orc-progresso > i{transition:transform var(--cena) var(--ease)}
.orc-enviar-nota{font-size:14px; line-height:1.55; color:var(--texto-3); text-align:center; max-width:56ch; margin:0 auto}

/* ── pronto ───────────────────────────────────────────────────────────── */
.orc-pronto{--cor:var(--st-concluido)}
.orc-pronto .doc-corpo{padding:28px 28px 30px}
#tituloPronto:focus{outline:none}   /* recebe o foco por script (leitor de tela); o clique não deve acender anel */
.orc-pronto-rot{font-size:15px; font-weight:500; color:var(--texto-2)}
.orc-pronto-codigo{margin-top:4px; font-family:var(--serif); font-variation-settings:var(--serif-numero);
  font-size:clamp(36px,5vw,50px); line-height:1.05; letter-spacing:-.01em; color:var(--texto)}
.orc-pronto-txt{margin-top:14px; font-size:17px; line-height:1.6; color:var(--texto-2); max-width:56ch}
.orc-pronto-txt b{color:var(--texto); font-weight:600}
.orc-pronto .orc-etapas{margin-top:26px}
.orc-pronto-acoes{margin-top:8px}
.orc-pronto-nota{margin-top:18px; font-size:14px; color:var(--texto-3); line-height:1.55}
body.orc-enviado .orc-intro{display:none}
body.orc-enviado .orc-pagina{grid-template-columns:minmax(0,760px); justify-content:center}

/* ── rodapé-régua (o mesmo do portal) ────────────────────────────────── */
.orc-rodape{flex:none; width:100%}
.orc-rodape-dentro{--gut:24px; position:relative; max-width:1180px; margin:0 auto;
  padding:34px var(--gut) 40px; font-size:14px; line-height:1.7; color:var(--texto-3);
  background-image:
    repeating-linear-gradient(90deg, var(--borda-forte) 0 1px, transparent 1px 9px),
    repeating-linear-gradient(90deg, var(--borda-forte) 0 1px, transparent 1px 45px);
  background-position:var(--gut) 0, var(--gut) 0;
  background-size:calc(100% - var(--gut)*2) 8px, calc(100% - var(--gut)*2) 17px;
  background-repeat:no-repeat, no-repeat}
.orc-rodape-dentro::before{content:""; position:absolute; left:var(--gut); top:0; width:2px; height:23px; background:var(--acento)}
.orc-noscript{padding:16px 24px; text-align:center; color:var(--texto-2)}

/* ── celular ──────────────────────────────────────────────────────────── */
@media (max-width:600px){
  .orc-topo-dentro{padding:8px 16px; min-height:60px}
  .orc-marca .prumo{height:32px}
  .orc-traco, .orc-marca-sub{display:none}
  .orc-pagina{padding:24px 16px 44px; gap:24px}
  .orc-intro h1{font-size:31px}
  .orc-intro-sub{font-size:16px}
  .orc-etapas{margin-top:20px}
  .orc-etapas li{padding-bottom:14px}
  .orc-folha .doc-cab{padding:12px 18px 10px}
  .orc-cab-nota{display:none}
  .orc-form{padding:22px 18px 24px; gap:26px}
  .orc-grupo > legend{font-size:20px}
  .orc-curto{max-width:none}
  .orc-arq{grid-template-columns:22px minmax(0,1fr) auto; padding-right:6px}
  .orc-arq-estado{grid-column:2; grid-row:2}
  .orc-arq-acoes{grid-column:3; grid-row:1 / span 2}
  .orc-pronto .doc-corpo{padding:22px 18px 24px}
  .orc-pronto-acoes .bt{width:100%}
  .orc-rodape-dentro{--gut:16px}
}
@media (prefers-reduced-motion: reduce){
  .orc-arq .progresso > i, .orc-progresso > i, .orc-opcao span{transition:none}
}