/* =====================================================================
   Rodapé: faixa baixa no fim da página, depois das Redes Sociais.
   Marca (monograma + nome) à esquerda, direitos no centro e "Voltar ao
   topo" à direita; no celular e no tablet em pé, tudo empilhado no meio.
   Filete dourado em cima, igual ao divisor entre seções.
   Classes .rdp__, variáveis --rdp-*. Ler rodape/README.md.
   ===================================================================== */

.rdp {
  --rdp-bg: #070605;
  --rdp-muted: rgba(244, 239, 230, 0.6);
  --rdp-faint: rgba(244, 239, 230, 0.36);
  position: relative;
  border-top: 1px solid var(--gold);
  background:
    radial-gradient(48% 150% at 50% 0%, rgba(212, 171, 94, 0.075), transparent 72%),
    var(--rdp-bg);
  color: var(--bone);
  font-family: var(--body);
}
.rdp *, .rdp *::before, .rdp *::after { box-sizing: border-box; }

/* Mesmas margens laterais da navbar: o monograma do rodapé fica na mesma coluna do de cima. */
.rdp__in {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 32px;
  padding: 28px max(16px, calc(56 * var(--nav-s, 1px)));
  padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px));
}

/* ---------- Marca ---------- */
.rdp__marca { justify-self: start; display: flex; align-items: center; gap: 16px; }
.rdp__marca img { display: block; width: 34px; height: auto; }
/* traço na inclinação da marca (−8°), entre o monograma e o nome */
.rdp__marca i { width: 1px; height: 30px; background: rgba(212, 171, 94, 0.55); transform: skewX(-8deg); }
.rdp__nome {
  display: flex; flex-direction: column; gap: 6px; margin: 0;
  font-size: 13px; font-weight: 800; font-style: italic; font-stretch: 125%;
  letter-spacing: 0.14em; line-height: 1; text-transform: uppercase; color: var(--silver-mid);
}
.rdp__nome small {
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.34em; color: var(--gold-hi);
}

/* ---------- Direitos ---------- */
.rdp__direitos {
  margin: 0; text-align: center;
  font-size: 12px; line-height: 1.5; letter-spacing: 0.03em; color: var(--rdp-muted);
}
.rdp__direitos b { font-weight: 600; color: rgba(244, 239, 230, 0.86); }
.rdp__direitos small { display: block; margin-top: 3px; font-size: 11px; color: var(--rdp-faint); }

/* ---------- Voltar ao topo ---------- */
.rdp__topo {
  justify-self: end; display: inline-flex; align-items: center; gap: 14px; min-height: 44px;
  font-size: 11px; font-weight: 500; letter-spacing: 0.24em; text-transform: uppercase; text-decoration: none;
  color: rgba(244, 239, 230, 0.72); transition: color 0.25s ease;
}
.rdp__topo span {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid rgba(212, 171, 94, 0.5); color: var(--gold);
  transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
.rdp__topo svg { width: 12px; height: 12px; transition: transform 0.3s ease; }
.rdp__topo:hover, .rdp__topo:focus-visible { color: var(--gold-hi); }
.rdp__topo:hover span, .rdp__topo:focus-visible span { background: var(--gold); border-color: var(--gold); color: var(--ink); }
.rdp__topo:hover svg, .rdp__topo:focus-visible svg { transform: translateY(-2px); }

/* ---------- Celular e tablet em pé: empilhado no meio ---------- */
@media (max-width: 900px) {
  .rdp__in {
    grid-template-columns: 1fr; justify-items: center; gap: 20px;
    padding: 36px 24px calc(24px + env(safe-area-inset-bottom, 0px));
  }
  .rdp__marca, .rdp__topo { justify-self: center; }
  /* "© 2026 Roberta Bruing." / "Todos os direitos reservados.": quebra no ponto, nunca no meio da frase */
  .rdp__linha { display: block; }
  .rdp__direitos small { margin-top: 6px; text-wrap: balance; }
}

/* Fica no fim de propósito: com a mesma especificidade, a última regra vence. */
@media (prefers-reduced-motion: reduce) {
  .rdp__topo, .rdp__topo span, .rdp__topo svg { transition: none; }
  .rdp__topo:hover svg, .rdp__topo:focus-visible svg { transform: none; }
}