/* PivotPoint hero — stats strip pinned to the bottom of the first screen,
   copy vertically centred, with height-based compression so nothing spills
   below the fold on shorter laptop screens. Linked from each service page. */
.pp-hero-inner{ min-height:100vh; box-sizing:border-box; display:flex; flex-direction:column; padding:126px 32px 46px !important; }
.pp-hero-top{ margin-top:auto; margin-bottom:auto; }

@media (max-width:768px){ .pp-hero-inner{ padding:112px 24px 40px !important; } }
@media (max-width:560px){ .pp-hero-inner{ padding:104px 18px 34px !important; } }

/* Short laptop viewports — gated to >=768px so tall phones keep the full hero */
@media (min-width:768px) and (max-height:900px){
  .pp-hero-inner{ padding-top:104px !important; padding-bottom:38px !important; }
  .pp-hero-top h1{ font-size:clamp(30px,4.2vw,52px) !important; margin-top:18px !important; }
  .pp-hero-top > p:first-of-type{ margin-top:16px !important; font-size:16.5px !important; }
}
@media (min-width:768px) and (max-height:790px){
  .pp-hero-inner{ padding-top:94px !important; padding-bottom:32px !important; }
  .pp-hero-top h1{ font-size:clamp(26px,3.4vw,42px) !important; margin-top:14px !important; line-height:1.06 !important; }
  .pp-hero-top > p:first-of-type{ margin-top:12px !important; font-size:15px !important; line-height:1.5 !important; }
  .pp-hero-stats > div{ padding:20px 22px !important; }
  .pp-hero-stats > div > div:first-child{ font-size:30px !important; }
}
@media (min-width:768px) and (max-height:690px){
  .pp-hero-inner{ padding-top:86px !important; padding-bottom:24px !important; }
  .pp-hero-top h1{ font-size:clamp(24px,3vw,34px) !important; }
  .pp-hero-top > p:first-of-type{ display:none !important; }
  .pp-hero-stats{ grid-template-columns:repeat(4, 1fr) !important; }
  .pp-hero-stats > div{ padding:14px 16px !important; }
  .pp-hero-stats > div > div:first-child{ font-size:26px !important; }
  .pp-hero-stats > div > div:last-child{ font-size:12px !important; }
}