/* ------------------------------------------------------------------ *
 * custom.css — G. Lane Building Services
 * Loaded AFTER style.css. Additive tweaks only; vendor CSS untouched.
 * Everything here is easy to tune — adjust the values and re-upload.
 * ------------------------------------------------------------------ */

/* 1. Full-height panels ------------------------------------------------
 * The theme's JS already sets each panel to the window height. This adds
 * a CSS floor so panels are always a full screen tall even before JS runs
 * (or if it's slow), and uses dynamic viewport height (dvh) so the mobile
 * URL bar appearing/disappearing doesn't clip the content.               */
.g-lane-building-services .block,
.g-lane-building-services .full-height-block {
  min-height: 100vh;
  min-height: 100dvh;
}

/* 2. Mobile breathing room -------------------------------------------- *
 * On phones the two-column rows stack, so give each panel comfortable
 * top/bottom space (the top value also clears the fixed header) and a
 * little side gutter so text isn't jammed against the screen edge.       */
@media (max-width: 767px) {
  .g-lane-building-services .cell-view.page-height {
    padding-top: 90px;
    padding-bottom: 60px;
    padding-left: 6px;
    padding-right: 6px;
  }

  /* Stacked image halves keep a real presence instead of collapsing. */
  .g-lane-building-services .clip {
    position: relative;
    min-height: 60vh;
    min-height: 60dvh;
  }

  /* A touch more air between the CTA buttons when they wrap. */
  .g-lane-building-services .home-cta { margin-bottom: 12px; }
}

/* 3. Small-height desktop windows ------------------------------------- *
 * If someone's browser window is short, let tall sections (long
 * testimonials) grow rather than clip.                                   */
@media (min-width: 768px) {
  .g-lane-building-services .cell-view.page-height { padding: 40px 0; }
}