/* =====================================================================
   CRIMINAL DEFENSE — CTA/FOOTER replacement (v293).
   Replaces ONLY the closing CTA/footer of criminal-defense.html with
   the supplied desktop + mobile CTA assets, baked dual-breakpoint.
   Everything above the CTA (hero, principle, allegations, procedural,
   case studies) is unchanged and keeps its existing 641/640 behaviour.

   Per the supplied brief, the CTA switches at 1025/1024 (tablet uses the
   mobile asset) — note this differs from the rest of the CD page, which
   still switches at 641/640.

   Both supplied CTA assets are portrait (desktop 1290x1525, mobile
   1290x1812); each is capped at its native width and centred on black
   so neither is upscaled. Scoped to .page-cd #footer so no other page
   or section is affected.
   ===================================================================== */

.page-cd #footer.cdcta {
  display: block;
  background: #000;
  padding: 0;
  margin: 0;
}

.page-cd #footer.cdcta .sr-only {
  position: absolute !important; width: 1px !important; height: 1px !important;
  overflow: hidden !important; clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important; white-space: nowrap !important;
  margin: -1px !important; padding: 0 !important; border: 0 !important;
}

.page-cd #footer .cdcta-dt { display: none; }
.page-cd #footer .cdcta-m  { display: none; }

/* ---------- MOBILE + TABLET (<=1024) ---------- */
@media (max-width: 1024px) {
  .page-cd #footer .cdcta-m {
    display: block;
    position: relative;
    line-height: 0;
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
  }
  .page-cd #footer .cdcta-m > img { display: block; width: 100%; height: auto; }
  .page-cd #footer .cdcta-m__hot {
    position: absolute;
    display: block;
    z-index: 3;
    border-radius: 4px;
    -webkit-tap-highlight-color: transparent;
  }
  .page-cd #footer .cdcta-m__hot:focus-visible { outline: 2px solid #8b6e3b; outline-offset: 2px; }
}

/* ---------- DESKTOP (>=1025) ---------- */
@media (min-width: 1025px) {
  .page-cd #footer .cdcta-dt {
    display: block;
    position: relative;
    line-height: 0;
    width: 100%;
    max-width: 1290px;
    margin: 0 auto;
  }
  .page-cd #footer .cdcta-dt > img { display: block; width: 100%; height: auto; }
  .page-cd #footer .cdcta-dt__hot {
    position: absolute;
    display: block;
    z-index: 3;
    border-radius: 4px;
  }
  .page-cd #footer .cdcta-dt__hot:focus-visible { outline: 2px solid #8b6e3b; outline-offset: 2px; }
}