/* ============================================
   Tools — Shared layout primitives across /outils/*
   Mobile-first: base = mobile, @media = desktop.
   Navbar offset comes from --navbar-height (variables.css).
   ============================================ */

/* Shared footer for all tool pages. */
.tools-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-md);
  flex-wrap: wrap;
  padding: var(--space-xl) var(--container-padding);
  font-size: 0.75rem;
  color: var(--color-text-muted);
  border-top: 1px solid var(--color-border);
}
.tools-footer a {
  color: var(--color-text-muted);
  text-decoration: none;
}
.tools-footer a:hover {
  color: var(--color-accent);
}

/* Primary CTA button used in every tool's result/cta card. */
.btn-cta {
  display: inline-block;
  padding: 0.75rem 2rem;
  background: var(--color-accent);
  color: var(--color-bg-primary);
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  font-weight: 600;
  border-radius: var(--radius-lg);
  text-decoration: none;
  transition: all 200ms;
}
.btn-cta:hover {
  background: var(--color-accent-hover, #33DDFF);
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(0, 212, 255, 0.25);
}
.cta-sub {
  display: block;
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: var(--color-text-muted);
}