/* Rodapé: aviso de obra no estilo do site + rodapé institucional (estúdio, serviços, contato, legal) + assinatura */
.rodape { background: #000; color: #fff; padding: 0 var(--gutter) 28px; }

/* faixa "em construção": barra de progresso de terminal que nunca termina */
.construcao { display: flex; align-items: center; justify-content: space-between; gap: 24px 48px; flex-wrap: wrap; padding: 26px 0; border-bottom: 1px solid rgba(255,255,255,.14); }
.mono-v { font-family: Menlo, monospace; font-size: 12px; color: #9a9a9a; display: flex; align-items: center; gap: 12px; margin: 0; }
.obra-barra { width: 140px; height: 10px; border: 1px solid rgba(213,255,39,.6); padding: 1px; display: inline-block; }
.obra-barra i { display: block; height: 100%; width: 72%; background: repeating-linear-gradient(90deg, var(--verde) 0 7px, transparent 7px 9px); animation: obra 3.2s ease-in-out infinite; }
@keyframes obra { 0% { width: 58%; } 60% { width: 86%; } 100% { width: 58%; } }
.pct { color: var(--verde); }
.pct::after { content: "_"; animation: pisca 1s steps(1) infinite; }
@keyframes pisca { 50% { opacity: 0; } }

.rodape-grade { display: grid; grid-template-columns: 1.5fr repeat(4, 1fr); gap: 40px; padding: 64px 0 56px; border-bottom: 1px solid rgba(255,255,255,.14); }
.rodape .assinatura img { height: 64px; display: block; }
.rodape .assinatura p { margin: 16px 0 22px; font-family: "Space Grotesk", sans-serif; font-size: 20px; letter-spacing: -0.01em; }
.cta-rodape { display: inline-flex; gap: 10px; align-items: center; font-family: "Space Grotesk", sans-serif; font-size: 14px; color: #000 !important; background: var(--verde);
  padding: 10px 16px; border-radius: 8px; text-decoration: none; opacity: 1 !important; transition: transform .15s; }
.cta-rodape:hover, .cta-rodape:focus-visible { transform: translateX(3px); }
.rodape h3 { font-family: Menlo, monospace; font-weight: 400; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #777; margin: 0 0 16px; }
.rodape ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.rodape a { color: #fff; text-decoration: none; font-size: 14px; opacity: .85; transition: color .2s, opacity .2s; }
.rodape a:hover, .rodape a:focus-visible { color: var(--verde); opacity: 1; }
.rodape .info { font-size: 14px; color: #8a8a8a; }
.rodape .info em { font-style: normal; font-family: Menlo, monospace; font-size: 10px; color: #e6e6e6; background: #3a3a3a; padding: 1px 5px; border-radius: 3px; margin-left: 6px; }

.rodape-base { display: flex; justify-content: space-between; align-items: center; gap: 12px 28px; padding-top: 22px; font-family: Menlo, monospace; font-size: 11.5px; color: #777; flex-wrap: wrap; }
.rodape-base .criado { color: #aaa; }
.topo { all: unset; cursor: pointer; color: #fff; }
.topo b { font-weight: 400; color: #000; background: var(--verde); padding: 1px 6px; border-radius: 3px; margin-left: 6px; }
.topo:hover, .topo:focus-visible { color: var(--verde); }

@media (max-width: 900px) { .rodape-grade { grid-template-columns: 1fr 1fr; } .rodape .assinatura { grid-column: 1 / -1; } }
@media (prefers-reduced-motion: reduce) { .obra-barra i, .pct::after { animation: none; } }
