/* static/css/footer-guides.css — Footer PDF guides block (fg- prefix).
   Reference: referencia/footer.html — the block is transparent and sits on
   the footer's existing background. Mobile (≤760px): accordion columns,
   static menus, fullscreen viewer. */

.fg-host { width: 100%; }

.fg-link { transition: color .15s; }
.fg-link:hover .fg-ltxt { color: #22D3EE !important; }
.fg-pdf { transition: background .15s, border-color .15s; }
.fg-pdf:hover { background: rgba(34,211,238,0.12) !important; border-color: rgba(34,211,238,0.5) !important; }

.fg-pop { animation: fgIn .16s ease-out; }
@keyframes fgIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .fg-pop { animation: none; } }

@media (max-width: 760px) {
  .fg-hero { padding: 44px 0 28px !important; gap: 28px !important; }
  .fg-h { font-size: 28px !important; }
  .fg-cols { grid-template-columns: minmax(0,1fr) !important; gap: 0 !important; border-top: 1px solid rgba(255,255,255,0.08) !important; }
  .fg-group { border-bottom: 1px solid rgba(255,255,255,0.08) !important; }
  .fg-dlabel { display: none !important; }
  .fg-items { padding: 0 0 14px !important; gap: 4px !important; }
  .fg-items:not(.is-open) { display: none !important; }
  .fg-pop { position: static !important; width: auto !important; margin: 6px 0 4px !important; box-shadow: none !important; }
  .fg-link { min-height: 44px !important; }
  /* Fullscreen viewer must NOT sit under the status bar / notch (viewport-fit=cover).
     Shift it below the safe-area top inset and size it with the DYNAMIC viewport
     (dvh) so iOS browser chrome never covers the header buttons. */
  .fg-vov { padding-top: env(safe-area-inset-top, 0px) !important; }
  .fg-viewer { max-width: 100% !important; height: calc(100vh - env(safe-area-inset-top, 0px)) !important; max-height: none !important; border-radius: 0 !important; border: 0 !important; }
  @supports (height: 100dvh) {
    .fg-viewer { height: calc(100dvh - env(safe-area-inset-top, 0px)) !important; }
  }
  .fg-vhead { padding: 10px 10px 10px 14px !important; gap: 8px !important; }
  .fg-dl { width: 40px !important; padding: 0 !important; justify-content: center !important; }
  .fg-dltxt { display: none !important; }
  .fg-vbody { padding: 12px !important; padding-bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important; touch-action: pan-y pinch-zoom; }
}