/* Service landing pages: /psychological-testing and /esa-evaluations
   Separate file so the long-cached styles.css does not need a cache bust. */

/* Hero: existing live photos, CSS-framed with cover (no blur bands / letterboxing) */
.page-hero.hero-service {
  min-height: 380px;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #3a4a52;
}
.page-hero.hero-service::after {
  background: linear-gradient(90deg, rgba(0,40,60,0.72) 0%, rgba(0,40,60,0.45) 45%, rgba(0,40,60,0.08) 100%);
}
.hero-service--testing {
  background-image: url("../assets/photos/live/child-bg.jpg");
  background-position: 84% 30%;
}
.hero-service--esa {
  background-image: url("../assets/photos/live/DSC_0060.jpg");
  background-position: 50% 32%;
}
.hero-service h1 { max-width: 34rem; }
.hero-eyebrow-service {
  color: #e6f4f8;
  font-size: 0.9rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
  white-space: nowrap;
}
.hero-actions { margin-top: 1.25rem; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.hero-actions .btn-outline { color: #fff; border-color: #fff; }

@media (max-width: 1024px) {
  .page-hero.hero-service { min-height: 340px; }
  .hero-service--testing { background-position: 86% 28%; }
  .hero-service--esa { background-position: 50% 30%; }
}
@media (max-width: 720px) {
  .page-hero.hero-service { min-height: 360px; }
  .page-hero.hero-service::after {
    background: linear-gradient(180deg, rgba(0,40,60,0.70) 0%, rgba(0,40,60,0.55) 100%);
  }
  .hero-service--testing { background-position: 88% 30%; }
  .hero-service--esa { background-position: 46% 30%; }
  .hero-eyebrow-service { font-size: 0.78rem; white-space: normal; }
}

/* Body */
.service-page-body > p { max-width: 44rem; }
.service-page-body .area-subhead { margin-top: 2rem; }
.service-split { margin-top: 1rem; grid-template-columns: 1fr 1fr !important; }
.service-split .area-subhead { margin-top: 0.5rem; }

/* Checklists: every item stays on one line, with breathing room between rows (all breakpoints) */
.checklist.checklist--nowrap { column-count: 1 !important; }
.checklist.checklist--nowrap li,
.two-col > * > .checklist.checklist--nowrap li {
  white-space: nowrap !important;
  padding: 0.35rem 0 !important;
  margin: 0 0 0.55rem !important;
  min-height: 1.6rem;
}
.checklist.checklist--nowrap li:last-child { margin-bottom: 0 !important; }
.checklist.checklist--muted li::before { content: "\00d7"; background: #6b7b83; font-size: 0.8rem; }

.service-steps { max-width: 44rem; padding-left: 1.25rem; margin: 0.5rem 0 1.25rem; }
.service-steps li { margin-bottom: 0.75rem; padding-left: 0.25rem; }

@media (max-width: 900px) {
  .service-split { grid-template-columns: 1fr !important; gap: 1.5rem; }
  .checklist.checklist--nowrap li { white-space: nowrap !important; padding: 0.35rem 0 !important; }
}

/* Form safety (no forms on these pages today; matches site rule): never below 16px on mobile */
@media (max-width: 1024px) {
  input, select, textarea { font-size: 16px !important; }
}

/* No mid-word hyphenation in the hero lines */
.hero-service h1, .hero-service .hero-sub { -webkit-hyphens: manual; hyphens: manual; }
