/* Comfort Dental (Healthcare) page — mobile responsiveness.
   Scoped to .cd-page so sibling client pages that share clients.css are unaffected. */

/* Computer image overlap (was inline !important). Desktop look unchanged. */
.cd-page .cd-computer-img { margin-top: -10em; margin-bottom: -10px; }

@media (max-width: 768px) {
  /* Column stacking now lives in clients.css (shared by all client pages). */

  /* Hero: replace the 200%-tall, contained, translated bg (inline -> needs !important)
     with a sane centered cover image. */
  .cd-page .parallax-container { height: 60vh !important; }
  .cd-page .parallax-container > div {
    height: 100% !important;
    top: 0 !important;
    bottom: auto !important;
    transform: none !important;
    background-size: cover !important;
  }

  /* Reduce the computer image's negative overlap on narrow screens. */
  .cd-page .cd-computer-img { margin-top: -2em; }

  /* Neutralize the phone/magazine split's inline negative outer margins. */
  .cd-page .scroll-reveal.grid { margin-top: 0 !important; margin-bottom: 1rem !important; }
}