/* Exceptional Valuations — spacing system
   Intent: remove arbitrary vertical rhythm while preserving the existing visual identity.
   Scale: 8 / 12 / 16 / 24 / 32 / 48 / 64 / 96 / 128px
*/

:root {
  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;
  --space-8: 96px;
  --space-9: 128px;
}

main > section:not(.hero):not(.svc-dark-section):not(.cta-band) {
  padding-block: var(--space-6) !important;
}
main > section.sm { padding-block: var(--space-5) !important; }
.svc-dark-section,
main > section[aria-labelledby="gal-h2"] { padding-block: var(--space-7) !important; }
.hero-l { padding-block: var(--space-6) !important; }

@media (min-width: 960px) {
  .hero {
    grid-template-columns: minmax(0, 58fr) minmax(0, 42fr) !important;
    align-items: stretch !important;
  }
  .hero-l {
    padding: 12px 4% 12px 6% !important;
    justify-content: center !important;
    min-width: 0 !important;
  }
  .hero-badge { margin-bottom: var(--space-2) !important; }
  .hero-reg { margin-bottom: var(--space-1) !important; }
  .hero-title {
    margin-bottom: var(--space-2) !important;
    max-width: 760px !important;
  }
  .hero-sub {
    line-height: 1.6 !important;
    max-width: 680px !important;
  }
  .hero-l > .cta-row { margin-top: var(--space-3) !important; }
  .hero-stats {
    margin-top: var(--space-3) !important;
    padding-top: var(--space-3) !important;
    margin-bottom: 0 !important;
  }
  .hero-r {
    min-height: 420px !important;
    height: auto !important;
    overflow: hidden !important;
  }
  .hero-r img:nth-child(1) {
    width: 100% !important;
    height: 100% !important;
    min-height: 420px !important;
    object-fit: cover !important;
    object-position: center center !important;
  }
}

.hero-badge { margin-bottom: var(--space-3) !important; }
.hero-reg { margin-bottom: var(--space-2) !important; }
.hero-title { margin-bottom: var(--space-3) !important; }
.hero-stats {
  margin-top: var(--space-4) !important;
  padding-top: var(--space-4) !important;
}
.cta-row { margin-top: var(--space-4) !important; }

@media (min-width: 960px) {
  .hero-l { padding-top: 12px !important; padding-bottom: 12px !important; }
  .hero-badge { margin-bottom: var(--space-2) !important; }
  .hero-reg { margin-bottom: var(--space-1) !important; }
  .hero-title { margin-bottom: var(--space-2) !important; }
  .hero-l > .cta-row { margin-top: var(--space-3) !important; }
  .hero-stats {
    margin-top: var(--space-3) !important;
    padding-top: var(--space-3) !important;
    margin-bottom: 0 !important;
  }
}

.trust-item {
  padding: var(--space-3) var(--space-4) !important;
  gap: var(--space-2) !important;
}

/* Homepage About/Why Choose Us portrait.
   Uses the manually uploaded, verified JPEG assets. */
.about-img-wrap {
  position: relative !important;
  aspect-ratio: 3 / 4 !important;
  background-image: url("../images/pc-jain-office-production-900x1200.jpg?v=7") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-color: transparent !important;
  border-radius: var(--r1, 4px) !important;
  box-shadow: var(--s4, 0 20px 60px rgba(11,25,41,.18)) !important;
  overflow: visible !important;
}
.about-img-wrap > .about-img {
  display: none !important;
}

section[aria-labelledby="why-h2"] .container > .reveal:first-child,
section[aria-labelledby="all-svc-h2"] .container > .reveal:first-child,
section[aria-labelledby="testi-h2"] .container > .reveal:first-child,
section[aria-labelledby="cities-h2"] .container > .reveal:first-child {
  margin-bottom: var(--space-5) !important;
}
section[aria-labelledby="svc-h2"] .container > div:first-child,
section[aria-labelledby="gal-h2"] .container > div:first-child {
  margin-bottom: var(--space-5) !important;
}

.eyebrow { margin-bottom: var(--space-2) !important; }
.divider { margin-bottom: var(--space-4) !important; }
.about-grid { gap: var(--space-5) !important; }
@media (min-width: 900px) { .about-grid { gap: var(--space-6) !important; } }
.about-checklist {
  gap: var(--space-2) !important;
  margin-block: var(--space-3) !important;
}
.founder-card { margin-top: var(--space-4) !important; }
.grid-2,
.grid-3 { gap: var(--space-4) !important; }
.grid-4,
.why-grid { gap: var(--space-3) !important; }
.svc-dark-grid { gap: var(--space-4) !important; }
.why-card,
article.svc-card,
.cert-card,
article.testi,
.contact-card { padding: var(--space-4) !important; }
.cert-grid {
  margin-top: var(--space-5) !important;
  gap: var(--space-3) !important;
}
.gallery-grid { gap: var(--space-2) !important; }
.cta-band { padding-block: var(--space-6) !important; }
.lead-strip { padding-block: var(--space-5) !important; }
.ls-inner { gap: var(--space-4) !important; }
.city-strip { padding-block: var(--space-4) !important; }

@media (max-width: 767px) {
  main > section:not(.hero):not(.svc-dark-section):not(.cta-band) {
    padding-block: var(--space-6) !important;
  }
  main > section.sm { padding-block: var(--space-5) !important; }
  .svc-dark-section,
  main > section[aria-labelledby="gal-h2"] { padding-block: var(--space-6) !important; }
  .hero-l {
    padding-top: var(--space-5) !important;
    padding-bottom: var(--space-5) !important;
  }
  .trust-item {
    padding: var(--space-2) var(--space-3) !important;
    gap: var(--space-1) !important;
  }
  .about-img-wrap {
    aspect-ratio: 3 / 4 !important;
    background-image: url("../images/pc-jain-office-mobile-600x800.jpg?v=7") !important;
    background-size: 100% 100% !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
  }
  .about-img-wrap > .about-img {
    display: none !important;
  }
  section[aria-labelledby="why-h2"] .container > .reveal:first-child,
  section[aria-labelledby="all-svc-h2"] .container > .reveal:first-child,
  section[aria-labelledby="testi-h2"] .container > .reveal:first-child,
  section[aria-labelledby="cities-h2"] .container > .reveal:first-child,
  section[aria-labelledby="svc-h2"] .container > div:first-child,
  section[aria-labelledby="gal-h2"] .container > div:first-child {
    margin-bottom: var(--space-4) !important;
  }
}
