/* Section photos fill their grid column. Column width is set by layout, not a generic image cap. */

.psi {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border-radius: 1.15rem;
  border: 1px solid #e2e8f0;
  background: #0f172a;
  box-shadow:
    0 18px 40px -28px rgba(15, 23, 42, 0.4),
    0 0 0 1px rgba(51, 132, 252, 0.04);
}

.psi img {
  display: block;
  width: 100%;
  flex: 1 1 auto;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center;
}

.psi figcaption {
  flex: 0 0 auto;
  margin: 0;
  padding: 0.65rem 0.9rem 0.8rem;
  font-size: 0.75rem;
  line-height: 1.45;
  color: #64748b;
  background: #fff;
  border-top: 1px solid #f1f5f9;
}

.psi--beside,
.psi--on-dark,
.lite-about-photo {
  width: 100%;
  max-width: none;
  justify-self: stretch;
  align-self: stretch;
}

.psi--on-dark {
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 18px 40px -24px rgba(0, 0, 0, 0.45);
}

.psi--on-dark figcaption {
  background: rgba(15, 23, 42, 0.72);
  color: #cbd5e1;
  border-top-color: rgba(255, 255, 255, 0.08);
}

.psi-split {
  display: grid;
  gap: 1.5rem;
  align-items: stretch;
}

@media (min-width: 900px) {
  .psi-split {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: 1.75rem 2rem;
  }

  .psi-split--reverse {
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  }

  .psi-split--reverse .psi-split-copy {
    order: 2;
  }

  .psi-split--reverse .psi {
    order: 1;
  }
}

.psi-split-copy {
  min-width: 0;
}

.csd-intro-visual {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
}

.csd-intro-visual .psi {
  width: 100%;
  height: 100%;
}

.csd-intro-visual .psi img {
  aspect-ratio: 16 / 11;
  min-height: 12rem;
}

@media (min-width: 768px) {
  .csd-intro-visual .psi img {
    height: 100%;
    min-height: 14rem;
    aspect-ratio: auto;
    object-fit: cover;
  }

  .csd-intro-media-row .csd-stack-panel {
    height: 100%;
  }
}

.csd-process-intro {
  margin-bottom: 1.75rem;
}

.csd-process-photo figcaption,
.csd-promise-photo figcaption {
  font-size: 0.6875rem;
  line-height: 1.45;
}

/* Home - why / pillars */
@media (min-width: 1024px) {
  .lite-pillars-head {
    align-items: stretch !important;
  }

  .lite-pillars-head .psi img {
    aspect-ratio: 16 / 11;
    min-height: 14rem;
  }
}

/* Home - about: image + panel on top, text + cards bottom row */
.lite-about-body {
  align-items: stretch;
}

.lite-about-photo {
  width: 100%;
  max-width: none;
  justify-self: stretch;
  align-self: stretch;
}

.lite-about-photo img {
  aspect-ratio: 16 / 10;
  min-height: 12rem;
  object-position: center;
}

@media (min-width: 1024px) {
  .lite-about-photo img {
    height: 100%;
    min-height: 16rem;
    aspect-ratio: auto;
    object-fit: cover;
  }
}

/* Home - services */
.lite-services-head.psi-split .psi img {
  aspect-ratio: 16 / 11;
  min-height: 12.5rem;
}

.lite-services-head .lite-services-lead--detail {
  margin-top: 0.85rem;
  max-width: 62ch;
  text-align: left;
}

@media (min-width: 900px) {
  .lite-services-head.psi-split {
    align-items: stretch;
  }

  .lite-services-head .psi-split-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100%;
  }
}

/* Home - CTA */
.lite-cta-pro-media {
  position: relative;
  z-index: 1;
  min-width: 0;
}

@media (min-width: 1024px) {
  .lite-cta-pro-card:has(.lite-cta-pro-media) {
    display: grid !important;
    grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
    gap: 0;
    padding: 0.75rem !important;
    align-items: stretch;
  }

  .lite-cta-pro-media,
  .lite-cta-pro-media .psi {
    height: 100%;
  }

  .lite-cta-pro-media img {
    height: 100%;
    min-height: 17rem;
    aspect-ratio: auto;
    object-fit: cover;
  }

  .lite-cta-pro-card:has(.lite-cta-pro-media) .lite-cta-pro-inner {
    padding: 1.5rem 1.75rem 1.5rem 1.5rem;
  }
}

.contact-hero .psi figcaption,
.lite-cta-pro-media .psi figcaption {
  background: rgba(15, 23, 42, 0.78);
  color: #cbd5e1;
  border-top-color: rgba(255, 255, 255, 0.08);
}

.sp-hero-split,
.faq-toolbar-split {
  display: grid;
  gap: 1.5rem;
  align-items: stretch;
}

.faq-split-note {
  margin: 0;
  font-size: 1rem;
  line-height: 1.7;
  color: #475569;
}

@media (min-width: 900px) {
  .pj-hero-inner,
  .cr-hero-inner,
  .ap-narrative {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    gap: 1.75rem 2rem;
    align-items: stretch;
    max-width: none;
    text-align: left;
    margin-inline: 0;
  }

  .sp-hero-split,
  .faq-toolbar-split {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: 2rem;
  }

  .sp-category-head.psi-split,
  .ap-services-head.psi-split {
    margin-bottom: 2rem;
  }

  .sp-category-head.psi-split .psi img {
    max-height: 14rem;
    aspect-ratio: auto;
    object-fit: cover;
  }
}

.lite-pillars-intro .lite-pillars-lead {
  margin-top: 1rem;
  text-align: left;
}

.lite-pillars-intro .lite-pillars-lead--strength {
  max-width: 62ch;
}

.lite-pillars-intro .lite-pillars-lead--motto {
  margin-top: 0.85rem;
  font-weight: 600;
  color: #0f172a;
}

@media (min-width: 1024px) {
  .lite-pillars-intro {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100%;
  }
}

.le-intro-grid {
  display: grid;
  gap: 1.75rem;
  align-items: stretch;
}

@media (min-width: 900px) {
  .le-intro-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  }
}
