/* Peças reutilizadas em mais de uma página. Carregar depois do base.css. */

/* ===== Estrutura de seção ===== */
.secao { padding: 90px 0; }
.secao h2 { font-size: 42px; line-height: 1.05; letter-spacing: -2px; margin: 12px 0 20px; }
.cabecalho-secao { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 32px; }
.cabecalho-secao p { color: var(--cinza); line-height: 1.7; }
.duas-colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.pagina-conteudo-estreito { padding: 70px 0; max-width: 900px; }
.pagina-finalizar-compra h1, .pagina-conteudo-estreito h1, .pagina-admin h1 { font-size: 46px; letter-spacing: -2px; }

/* ===== Cartão e lista de contato (loja, rastreio, admin) ===== */
.cartao-contato { background: #fff; border: 1px solid var(--linha); padding: 30px; border-radius: 15px; box-shadow: 0 15px 40px #0b2a5210; }
.cartao-contato h3 { margin-top: 0; }
.lista-contato { display: grid; grid-template-columns: 150px 1fr; gap: 10px 20px; margin-top: 25px; font-size: 14px; }
.lista-contato span { color: var(--cinza); line-height: 1.55; }

/* ===== Resumo de itens e total ===== */
.item-resumo { padding: 11px 0; }
.item-resumo small { color: var(--cinza); }
.linha-total { display: flex; justify-content: space-between; padding: 20px 0; font-size: 18px; }

/* ===== Formulários ===== */
.formulario { display: flex; flex-direction: column; gap: 16px; }
.formulario-estreito { max-width: 420px; }
.formulario label { font-weight: 850; }
.formulario input, .formulario textarea { display: block; width: 100%; padding: 14px; margin-top: 7px; border: 1px solid var(--linha); border-radius: 9px; font-size: 16px; font-family: inherit; }

/* ===== Hover: cartão que sobe e foto que aproxima =====
   .cartao-elevavel no cartão clicável; .moldura-zoom em volta da foto (corta o excesso do zoom).
   Só em telas com mouse e para quem não pediu menos animação no sistema. */
.moldura-zoom { overflow: hidden; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .cartao-elevavel, .moldura-zoom img { transition: transform .35s ease, box-shadow .35s ease; }
  .cartao-elevavel:hover { transform: translateY(-6px); box-shadow: 0 22px 45px #0b2a5224; }
  .cartao-elevavel:hover .moldura-zoom img, .moldura-zoom:hover img { transform: scale(1.05); }
}

/* ===== Fundo escuro atrás de janelas ===== */
.fundo-escurecido { position: fixed; inset: 0; background: #0008; z-index: 90; display: none; }
.fundo-escurecido.aberto { display: block; }

/* ===== Status de pedido ===== */
.etiqueta-status { padding: 6px 9px; border-radius: 99px; font-size: 10px; font-weight: 950; text-transform: uppercase; }
.status-pago { background: #e9f8ef; color: #087443; }
.status-pendente { background: #fff4d6; color: #8a5a00; }
.status-negativo { background: #ffebe9; color: var(--vermelho); }

@media (max-width: 850px) {
  .duas-colunas { grid-template-columns: 1fr; }
  .cabecalho-secao { align-items: stretch; flex-direction: column; }
}
@media (max-width: 550px) {
  .lista-contato { grid-template-columns: 1fr; }
  .secao { padding: 65px 0; }
}