/* =========================================================
   MARCA CL QUERCUS no portfólio (2026-11-13)
   - folha antes do "E.C." na navbar e no rodapé (todas as páginas)
   - folha que cai e pousa na tela de carregamento (index.html, .loader-folha)
   - selo "Parte do CL Quercus" no rodapé (index.html, .rod-quercus)
   Imagens: img/quercus/ (recortadas da folha de marca "Nova direção 2 · Folha").
   ========================================================= */

/* logo: a folha num quadrado arredondado, antes do monograma */
.nav-logo::before {
  content: ""; flex: none; width: 1.55em; height: 1.55em; margin-right: .45em; border-radius: .42em;
  background: #1e3a2b url("../img/quercus/quercus-icone.png") center / cover no-repeat;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
  transition: transform .5s cubic-bezier(0.23, 1, 0.32, 1);
}
@media (hover: hover) and (pointer: fine) {
  .nav-logo:hover::before { transform: rotate(-8deg) scale(1.06); }
}

/* carregamento: a folha desce balançando e pousa acima do monograma */
.loader-folha { display: block; width: clamp(34px, 7vw, 44px); height: auto; margin: 0 auto 14px; transform-origin: 50% 85%;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .35)); animation: loader-folha 1s cubic-bezier(0.23, 1, 0.32, 1) both; }
@keyframes loader-folha {
  0% { opacity: 0; transform: translateY(-34px) rotate(-22deg); }
  45% { opacity: 1; transform: translateY(-6px) rotate(10deg); }
  75% { transform: translateY(2px) rotate(-4deg); }
  100% { opacity: 1; transform: none; }
}
.loader.is-fast .loader-folha { animation: none; }

/* rodapé: selo da marca, sempre no fundo verde da Quercus (o logotipo é claro) */
.rod-quercus {
  display: flex; flex-direction: column; align-items: flex-start; width: fit-content; max-width: 100%; gap: .45rem; margin-top: 1rem; padding: .65rem .85rem .6rem; border-radius: 14px;
  background: #0f1f17; border: 1px solid rgba(234, 242, 236, .12); text-decoration: none; color: rgba(234, 242, 236, .7);
  font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; transition: transform .16s cubic-bezier(0.23, 1, 0.32, 1), border-color .2s ease;
}
.rod-quercus img { display: block; height: 22px; width: auto; }
.rod-quercus span { font-size: .62rem; white-space: nowrap; }
.rod-quercus:hover { border-color: rgba(212, 167, 90, .55); }
.rod-quercus:active { transform: scale(.97); }

@media (prefers-reduced-motion: reduce) {
  .loader-folha { animation: none; }
  .nav-logo::before { transition: none; }
  .rod-quercus:active { transform: none; }
}