/* SAC Uranyx: SAC de Produto (/sac), chamado de atacado (/minha-conta/chamado), a tela do
   protocolo (também no "Fale com a gente") e o "Seus chamados" da conta. Mesma gramática do
   site: moldura com chanfro e fio laranja como o formulário de contato, índice em
   monoespaçada como os princípios da página Sobre, barra laranja com as pontas chanfradas.
   Nada fixo nem sticky dentro do conteúdo (a rolagem suave West transforma o container). */

/* ---------- Cabeçalho e etapas ---------- */
.sac .sac-cabecalho{max-width:1120px;padding-bottom:8px}
.sac .sac-topline{margin-bottom:34px}
.sac .sac-topline .eyebrow{color:#5d6656}
.sac-cabecalho h1{max-width:13em;font-size:clamp(44px,5.6vw,88px);line-height:1.02;letter-spacing:-.05em}
.sac-cabecalho h1 em{color:#986040}
.sac-cabecalho-texto{margin-top:26px;max-width:62ch;font-size:15px;line-height:1.75;color:#5d6656}
.sac-cabecalho-texto a,.sac-secao-texto a,.sac-faixa a,.sac-final a{color:var(--ink);font-weight:700;text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:4px}
.sac-cabecalho-texto a:hover,.sac-secao-texto a:hover,.sac-final a:hover{color:#b95425}

.sac-etapas{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:40px 0 34px;padding:0;list-style:none;counter-reset:etapa}
.sac-etapas a{display:flex;align-items:center;gap:12px;min-height:48px;padding:12px 16px;background:#e5e8df;font:600 13px/1.3 var(--display);color:#2e352c;transition:background .35s,color .35s}
.sac-etapas li:last-child a{clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%)}
.sac-etapas a span{font:10px/1 monospace;letter-spacing:.12em;color:#b55c30;transition:color .35s}
.sac-etapas a:hover{background:var(--ink);color:var(--paper)}
.sac-etapas a:hover span{color:var(--orange)}

/* ---------- Grade: formulário e coluna lateral ---------- */
.sac-layout{display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,26vw,380px);gap:clamp(28px,4vw,64px);align-items:start}
.sac-principal{display:flex;flex-direction:column;gap:22px;min-width:0}
.sac-faixa{margin:0}
.sac-lateral ul{margin-top:2px}
.sac-lateral .conta-vantagens li{font-size:13px;line-height:1.55;color:#dfe3d6}
.sac-lateral-etapas li{border-color:#1417151f}
.sac-lateral-etapas p{margin-top:4px}

/* ---------- Moldura do formulário (a do "Vamos conversar") ---------- */
.sac-moldura{position:relative;padding:30px clamp(20px,3.4vw,46px) clamp(30px,3.6vw,48px);background:#f8f8f3;border-bottom:3px solid var(--orange);clip-path:polygon(0 0,calc(100% - 30px) 0,100% 30px,100% 100%,0 100%);--btn-line-fill:#f8f8f3}
.sac-moldura-topo{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:20px;margin-bottom:28px;border-bottom:1px solid #c5ceba;font:9px/1.5 monospace;letter-spacing:.15em}
.sac-moldura-topo span span{color:#c86635}
.sac-moldura-topo>i{font-size:22px;color:#c86635}
.sac-moldura-legenda{color:#5d6656;white-space:nowrap}
.sac-form-titulo{margin:0 0 6px;font:600 clamp(18px,1.6vw,22px)/1.3 var(--display);letter-spacing:-.01em}
.sac-form{gap:34px}

/* Seções numeradas: índice em monoespaçada ("01 / COMPRADOR") e o título do Marco. */
.sac-grupo-secao>legend{font:600 clamp(20px,1.8vw,25px)/1.25 var(--display);letter-spacing:-.02em;text-transform:none;color:var(--ink);margin-bottom:20px}
.sac-indice{display:block;margin-bottom:10px;font:10px/1.5 monospace;letter-spacing:.16em;color:#b55c30}
.sac-grupo-secao+.sac-grupo-secao{padding-top:30px}
.sac-secao-texto{clear:both;margin:-6px 0 18px;font-size:14px;line-height:1.7;color:#4f5949}

/* ---------- Campos ---------- */
.conta-campos>.is-inteira{grid-column:1/-1}
.sac-asterisco{margin-left:3px;color:#c2410c;font-weight:700}
.sac-campo textarea{width:100%;min-height:132px;padding:12px 2px;border:0;border-bottom:1px solid #939e86;border-radius:0;background:transparent;color:var(--ink);font:500 16px/1.6 Manrope,system-ui,sans-serif;resize:vertical;transition:border-color .3s}
.sac-campo textarea:hover{border-bottom-color:var(--ink)}
.sac-campo textarea:focus{border-bottom-color:var(--orange)}
.sac-campo textarea:focus-visible{outline:2px solid var(--orange);outline-offset:4px}
.sac-campo input[type=date]{min-width:0;-webkit-appearance:none;appearance:none}
.sac-erro{display:block;margin-top:4px;font-size:12px;font-weight:600;line-height:1.5;color:#b42318}
.sac-erro[hidden]{display:none}
.sac-erro-geral{clear:both;margin:0 0 16px;padding:12px 14px;border-left:3px solid #c2410c;background:#f6e3d8;color:#6f2a10;font-size:13px}
.sac-campo.is-invalido input,.sac-campo.is-invalido select,.sac-campo.is-invalido textarea{border-bottom-color:#c2410c}
.sac-campo.is-invalido label,.sac-campo.is-invalido>legend{color:#9a3412}

/* Opções em rádio (sim/não, voltagem, tomada): caixas clicáveis com o canto chanfrado. */
.sac-opcoes{min-width:0;margin:0;padding:0;border:0}
.sac-opcoes>legend{float:left;width:100%;margin:0 0 10px;padding:0;font-size:12px;font-weight:600;line-height:1.5;color:#2e352c}
.sac-opcoes>.conta-dica{clear:both;display:block;margin:-6px 0 10px}
.sac-opcoes-lista{clear:both;display:flex;flex-wrap:wrap;gap:8px}
.sac-opcao{display:flex;align-items:center;gap:10px;min-height:46px;padding:10px 16px 10px 13px;border:1px solid #b9c2ad;background:var(--paper);font-size:14px;line-height:1.3;color:#2e352c;cursor:pointer;clip-path:polygon(0 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%);transition:border-color .3s,background .3s,color .3s}
.sac-opcao input{flex:0 0 auto;width:18px;height:18px;margin:0;accent-color:var(--orange);cursor:pointer}
.sac-opcao:hover{border-color:var(--ink)}
.sac-opcao:has(input:checked){border-color:var(--ink);background:var(--ink);color:var(--paper)}
.sac-opcao:has(input:focus-visible){outline:2px solid var(--orange);outline-offset:3px}
.sac-opcoes.is-invalido .sac-opcao{border-color:#c2410c}
.sac-condicional[hidden]{display:none}

/* ---------- Arquivos: um cartão por arquivo, em grade ---------- */
.sac-arquivos{clear:both;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.sac-grupo{display:contents}
.sac-arquivo{position:relative;min-width:0;min-height:216px;display:flex;flex-direction:column;background:var(--paper);border:1px dashed #9ea890;clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);transition:border-color .3s,background .3s}
.sac-arquivo.tem-arquivo{border-style:solid;border-color:#c3cbb7;background:#fff}
.sac-arquivo-escolher{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:18px 16px 16px;cursor:pointer}
.sac-arquivo-escolher[hidden]{display:none}
.sac-arquivo:hover{border-color:var(--ink)}
.sac-arquivo-input{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;opacity:0}
.sac-arquivo:has(.sac-arquivo-input:focus-visible){outline:2px solid var(--orange);outline-offset:3px}
.sac-arquivo-icone{width:44px;height:44px;display:grid;place-items:center;background:var(--ink);color:var(--orange);font-size:21px;clip-path:polygon(0 0,100% 0,100% 72%,72% 100%,0 100%);transition:background .3s,color .3s}
.sac-arquivo:hover .sac-arquivo-icone{background:var(--orange);color:var(--ink)}
.sac-arquivo-rotulo{font:600 14px/1.35 var(--display);letter-spacing:-.01em;color:var(--ink);overflow-wrap:anywhere}
.sac-arquivo-dica{margin-top:auto;font:9px/1.5 monospace;letter-spacing:.1em;text-transform:uppercase;color:#5d6656}
.sac-grupo.is-invalido .sac-arquivo:not(.tem-arquivo){border-color:#c2410c;background:#fbf1ea}
.sac-arquivo-estado[hidden]{display:none}
.sac-arquivo-estado{flex:1;display:flex;min-height:0}
.sac-erro-grupo{grid-column:1/-1;margin-top:-4px}
.sac-arquivo-mais{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;min-height:216px;padding:18px 16px;border:1px dashed #b9c2ad;background:transparent;color:#3a4237;font:600 13px/1.35 var(--display);text-align:left;cursor:pointer;transition:border-color .3s,color .3s,background .3s}
.sac-arquivo-mais>i{font-size:22px;color:#b55c30}
.sac-arquivo-mais small{display:block;margin-top:4px;font:9px/1.5 monospace;letter-spacing:.1em;text-transform:uppercase;color:#5d6656}
.sac-arquivo-mais:hover{border-color:var(--ink);background:#f8f8f3;color:var(--ink)}
.sac-arquivo-mais[hidden]{display:none}

/* Prévia: miniatura (ou ícone), nome, barra de envio e o remover. Altura reservada pelo cartão: sem salto. */
.sac-previa{flex:1;min-width:0;display:grid;grid-template-rows:minmax(96px,1fr) auto;animation:sac-entra .45s var(--ease-reveal,ease) both}
.sac-previa-midia{position:relative;overflow:hidden;background:#e5e8df;display:grid;place-items:center}
.sac-previa-midia img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sac-previa-icone{font-size:34px;color:#4f5949}
.sac-previa-info{min-width:0;display:flex;flex-direction:column;gap:6px;padding:10px 12px 12px}
.sac-previa-nome{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 12px/1.35 var(--display)}
.sac-previa-detalhe{font:9px/1.5 monospace;letter-spacing:.06em;color:#5d6656}
.sac-progresso{position:relative;height:6px;overflow:hidden;background:#dfe3d6;clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%)}
.sac-progresso span{position:absolute;inset:0;background:var(--orange);transform-origin:left;transform:scaleX(var(--progresso,0));transition:transform .25s linear}
.is-preparando .sac-progresso span{transform:scaleX(.08);animation:sac-preparando 1.1s ease-in-out infinite alternate}
.is-pronto .sac-progresso span{background:#4d7a3a;transform:scaleX(1)}
.is-erro .sac-progresso span{background:#c2410c}
.sac-previa-acoes{position:absolute;top:0;right:0;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.sac-previa-remover{width:44px;height:44px;display:grid;place-items:center;background:var(--ink);color:var(--paper);font-size:16px;clip-path:polygon(0 0,100% 0,100% 100%,22% 100%,0 78%);transition:background .3s,color .3s}
.sac-previa-remover:hover{background:#c2410c}
.sac-previa-tentar{margin:0 8px;padding:8px 10px;min-height:36px;background:var(--orange);color:var(--ink);font:700 11px/1 Manrope,system-ui,sans-serif}
.sac-previa-tentar[hidden]{display:none}
.sac-previa-erro{font-size:11px;line-height:1.45;color:#9a3412}
.sac-previa-erro a{color:var(--ink);font-weight:700;text-decoration:underline}
.sac-previa-erro[hidden]{display:none}
.sac-arquivo.is-erro{border-color:#c2410c}
@keyframes sac-entra{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@keyframes sac-preparando{from{transform:scaleX(.08)}to{transform:scaleX(.42)}}

/* ---------- Final: autorização, envio ---------- */
.sac-final{display:flex;flex-direction:column;gap:16px;padding-top:28px;border-top:1px solid #c9d0bd}
.sac-final .is-invalido .conta-check{border-color:#c2410c}
.sac-retencao{max-width:72ch;font-size:11px;line-height:1.6;color:#5d6656}
.sac-acoes{margin-top:6px}
.sac-acoes-texto{font-size:12px;line-height:1.6;color:#5d6656;max-width:36ch}
.sac-form.is-enviando [data-sac-enviar]{opacity:.7;cursor:progress}
.sac-envio-status{display:flex;align-items:center;gap:12px;font:600 13px/1.4 var(--display);color:#2e352c}
.sac-envio-status::before{content:'';flex:0 0 46px;height:6px;background:linear-gradient(90deg,var(--orange) 0 40%,#dfe3d6 40%);background-size:200% 100%;clip-path:polygon(4px 0,100% 0,calc(100% - 4px) 100%,0 100%);animation:sac-corre 1s linear infinite}
.sac-envio-status[hidden]{display:none}
@keyframes sac-corre{from{background-position:100% 0}to{background-position:-100% 0}}

/* ---------- Chamado de atacado ---------- */
.sac-conta-dados{clear:both;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin:0 0 12px}
.sac-conta-dados>div{min-width:0;padding:12px 0;border-top:1px solid #c9d0bd}
.sac-conta-dados dt{font:9px/1.5 monospace;letter-spacing:.14em;text-transform:uppercase;color:#5d6656}
.sac-conta-dados dd{margin:5px 0 0;font:500 15px/1.4 var(--display);overflow-wrap:anywhere}
.sac-itens{clear:both;display:flex;flex-direction:column;gap:12px}
.sac-itens-lista{display:flex;flex-direction:column;gap:10px}
.sac-item{position:relative;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) 120px 44px;gap:10px 18px;align-items:end;padding:14px 16px 16px;background:var(--paper);border:1px solid #c9d0bd}
.sac-item.is-invalido{border-color:#c2410c}
.sac-item-remover{width:44px;height:44px;display:grid;place-items:center;border:1px solid #b9c2ad;color:#4f5949;font-size:17px;transition:background .3s,color .3s,border-color .3s}
.sac-item-remover:hover{background:#c2410c;border-color:#c2410c;color:#fff}
.sac-item-remover[hidden]{visibility:hidden;display:grid}
.sac-item-erro{grid-column:1/-1;margin-top:0}
.sac-item-mais{min-height:0;flex-direction:row;align-items:center;justify-content:flex-start;padding:14px 16px}
.sac-item-mais span{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.sac-item-mais small{margin:0}

/* ---------- Tela do protocolo ---------- */
.sac-sucesso{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.sac-sucesso-topo{display:flex;align-items:center;gap:14px}
.sac-sucesso-icone svg{display:block;width:52px;height:52px;fill:none;stroke-linecap:square}
.sac-sucesso-moldura{fill:var(--ink);stroke:none}
.sac-sucesso-check{stroke:var(--orange);stroke-width:4;stroke-dasharray:40;stroke-dashoffset:40;animation:sac-check .7s var(--ease-reveal,ease) .2s forwards}
.sac-sucesso-rotulo{font:10px/1.5 monospace;letter-spacing:.18em;color:#5d6656}
.sac-sucesso-rotulo span{color:#c86635}
.sac-sucesso-titulo{font-size:clamp(30px,3vw,44px);line-height:1.05;letter-spacing:-.045em}
.sac-protocolo{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;width:100%;padding:18px 0;border-top:1px solid #c5ceba;border-bottom:1px solid #c5ceba}
.sac-protocolo-numero{font:600 clamp(40px,6.2vw,78px)/1 var(--display);letter-spacing:-.04em;color:var(--ink);overflow-wrap:anywhere;animation:sac-sobe .8s var(--ease-reveal,ease) .15s both}
.sac-copiar{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:10px 16px;border:1px solid #9ea890;font:600 13px/1 var(--display);color:var(--ink);clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);transition:background .3s,color .3s,border-color .3s}
.sac-copiar i{font-size:17px}
.sac-copiar:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.sac-copiar.is-copiado{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.sac-sucesso-texto{max-width:60ch;font-size:15px;line-height:1.7;color:#4f5949}
.sac-sucesso-texto strong{color:var(--ink);overflow-wrap:anywhere}
.sac-sucesso-acoes{display:flex;flex-wrap:wrap;align-items:center;gap:14px 30px;margin-top:4px}
.sac-sucesso-acoes .text-link{gap:22px;padding:10px 0;font-size:12px}
.sac-moldura-sucesso{max-width:960px;margin-top:40px}
@keyframes sac-check{to{stroke-dashoffset:0}}
@keyframes sac-sobe{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
/* No "Fale com a gente" da página Sobre, dentro da moldura que já existe. */
.contact-form-frame .sac-sucesso{gap:14px}
.contact-form-frame .sac-protocolo-numero{font-size:clamp(34px,4.2vw,56px)}
.contact-grid .contact-form-frame .sac-sucesso-titulo{font-size:clamp(28px,2.6vw,38px);line-height:1.08}
.contact-channels .contato-sac{display:flex;width:fit-content;margin-top:10px}
.contato-alerta{margin-bottom:20px}
.contato-protocolo-nota{font-size:11px;line-height:1.6;color:#627151}

/* ---------- Minha conta: Pós-venda ---------- */
.conta-chamados .conta-painel-cabecalho .btn{padding:14px 18px;gap:22px;font-size:12px}
.conta-chamados-subtitulo{margin:22px 0 4px;font:9px/1.5 monospace;letter-spacing:.16em;text-transform:uppercase;color:#5d6656}
.conta-chamados-vazio{font-size:14px;color:#4f5949}
.conta-chamados-lista{margin:0;padding:0;list-style:none}
.conta-chamados-lista li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:13px 0;border-top:1px solid #c9d0bd}
.conta-chamado-protocolo{font:600 15px/1.2 var(--display);letter-spacing:-.01em}
.conta-chamado-assunto{min-width:0;font-size:13px;line-height:1.4;color:#2e352c}
.conta-chamado-assunto small{display:block;font:9px/1.5 monospace;letter-spacing:.1em;color:#5d6656}
.conta-chamado-status{padding:6px 9px;border:1px solid #9ea890;font:9px/1 monospace;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.conta-chamado-status.is-novo{border-color:#d9a071;background:#f6e9dc;color:#7c3f15}
.conta-chamado-status.is-resolvido{border-color:#4d7a3a;color:#2f5422}

/* ---------- Telas menores ---------- */
@media(max-width:1100px){
 .sac-layout{grid-template-columns:minmax(0,1fr)}
 .sac-lateral{order:-1}
 .sac-lateral h2{font-size:28px}
 .sac-lateral .conta-vantagens{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
}
@media(max-width:767px){
 .sac-cabecalho h1{font-size:clamp(38px,10.6vw,54px)}
 .sac-cabecalho-texto{margin-top:18px;font-size:14px}
 .sac .sac-topline{margin-bottom:24px}
 .sac-etapas{grid-template-columns:repeat(6,minmax(0,1fr));margin:28px 0 24px}
 .sac-etapas li{grid-column:span 2}
 .sac-etapas li:nth-child(4),.sac-etapas li:nth-child(5){grid-column:span 3}
 .sac-etapas a{min-height:44px;padding:10px 12px;font-size:12px;gap:8px}
 .sac-lateral .conta-vantagens{grid-template-columns:minmax(0,1fr)}
 .sac-lateral{gap:16px}
 .sac-lateral>p{display:none}
 .sac-moldura{padding:24px 18px 28px;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}
 .sac-moldura-topo{font-size:8px;margin-bottom:22px}
 .sac-arquivos{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .sac-arquivo,.sac-arquivo-mais{min-height:190px}
 .sac-arquivo-escolher{padding:14px 12px}
 .sac-arquivo-icone{width:40px;height:40px;font-size:19px}
 .sac-arquivo-rotulo{font-size:12.5px}
 .sac-opcao{flex:1 1 calc(50% - 8px)}
 .sac-item{grid-template-columns:minmax(0,1fr) 96px;padding:12px 12px 14px}
 .sac-item>.conta-campo:first-child{grid-column:1/-1;padding-right:50px}
 .sac-item-remover{position:absolute;top:10px;right:10px}
 .sac-conta-dados{grid-template-columns:minmax(0,1fr)}
 .sac-acoes>.btn{width:100%;justify-content:space-between}
 .sac-sucesso-acoes .btn{width:100%;justify-content:space-between}
 .conta-chamados-lista li{grid-template-columns:minmax(0,1fr) auto}
 .conta-chamado-assunto{grid-column:1/-1;grid-row:2}
}
@media(prefers-reduced-motion:reduce){
 .sac-previa,.sac-protocolo-numero{animation:none}
 .sac-sucesso-check{animation:none;stroke-dashoffset:0}
 .is-preparando .sac-progresso span,.sac-envio-status::before{animation:none}
 .sac-progresso span{transition:none}
}