/* tech-strip — "Built with" footer credit row.
 * Logos sourced from simpleicons.org CDN, color-locked to the slate-500
 * (#64748b) gray that matches the wireframe-mountain hero motif. Fades
 * subtly on the page; hover brings full opacity. */

/* Override Olivero's constrained .container width on the front page footer
 * so it matches the article block's full-width + 40px-padding behavior.
 * Without this, the footer centers to ~1216px while the carousel spans
 * full main-area width — they end up on different visual axes. */
.pp-front .site-footer__inner.container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.pp-tech-strip {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  padding: 1.5rem 40px 0.75rem;  /* match .main-content__container 40px L/R */
  flex-wrap: wrap;
  margin-top: 1rem;
}

/* Centered short divider line above the strip — replaces the full-width
 * border-top which read as off-center because of the left rail. */
.pp-tech-strip::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  max-width: 60%;
  height: 1px;
  background: rgba(100, 116, 139, 0.25);
}

.pp-tech-strip__label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #64748b;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0.8;
}

.pp-tech-strip__icons {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
  justify-content: center;
}

.pp-tech-strip__icons li {
  margin: 0;
  display: inline-flex;
  align-items: center;
}

.pp-tech-strip__icons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem;
  border-radius: 4px;
  transition: opacity 0.2s ease, transform 0.2s ease;
  text-decoration: none;
}

.pp-tech-strip__icons img {
  height: 22px;
  width: auto;
  opacity: 0.7;
  transition: opacity 0.2s ease;
  display: block;
  /* Icons are pre-colored via simpleicons URL color param (94a3b8 / slate-400)
   * so they read on dark navy footer. No filter needed. */
}

.pp-tech-strip__icons a:hover img,
.pp-tech-strip__icons a:focus-visible img {
  opacity: 1;
}

.pp-tech-strip__icons a:hover {
  transform: translateY(-1px);
}

@media (max-width: 640px) {
  .pp-tech-strip {
    gap: 0.75rem;
    padding: 1rem 0.5rem;
  }
  .pp-tech-strip__icons {
    gap: 1rem;
  }
  .pp-tech-strip__icons img {
    height: 18px;
  }
}

/* pp-standards-strip — compliance / standards row. Only includes claims
 * verified in the 5/7/2026 compliance audit: WCAG 2.2 AA accessibility
 * (96-100% on Lighthouse), Schema.org structured data, HTTPS/TLS with
 * security headers. NO over-claiming (GDPR/CCPA/HIPAA are not listed). */
.pp-standards-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 0.5rem 40px 1.25rem;  /* match .main-content__container 40px L/R */
  flex-wrap: wrap;
  font-size: 0.7rem;
}

.pp-standards-strip__label {
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #64748b;
  font-weight: 600;
  opacity: 0.7;
  white-space: nowrap;
}

.pp-standards-strip__items {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
  justify-content: center;
}

.pp-standards-strip__items li {
  margin: 0;
}

.pp-standards-strip__items a,
.pp-standards-strip__items span {
  display: inline-block;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  border: 1px solid rgba(100, 116, 139, 0.35);
  color: #64748b;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: all 0.2s ease;
}

.pp-standards-strip__items a:hover {
  background: rgba(100, 116, 139, 0.08);
  color: #475569;
  border-color: rgba(100, 116, 139, 0.55);
}
