/* Premium interaction layer: cross-page transitions, hover states,
   image fade-in, and the sticky slim navigation. */

/* Soft crossfade between same-site page navigations (modern browsers only). */
@view-transition {
  navigation: auto;
}

/* Cards lift gently under the cursor. */
.pp-card {
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}
.pp-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(15, 20, 25, 0.10);
}

/* Buttons acknowledge hover and press. */
.pp-btn {
  transition: transform 0.15s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.pp-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(15, 20, 25, 0.16);
}
.pp-btn:active {
  transform: translateY(1px);
  box-shadow: none;
}

/* Below-the-fold images fade in as they finish loading (class added by JS). */
.pp-imgfade { opacity: 0; transition: opacity 0.45s ease; }
.pp-imgfade.pp-imgloaded { opacity: 1; }

/* Case-study accordion headers read as clickable. */
.pp-acc-head { cursor: pointer; }

/* Sticky slim nav: slides in once the reader scrolls past the hero. */
.pp-sticky {
  position: fixed; top: 0; left: 0; right: 0; z-index: 60;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; padding: 10px 32px;
  background: rgba(15, 20, 25, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transform: translateY(-100%);
  transition: transform 0.3s ease;
}
.pp-sticky.pp-show { transform: translateY(0); }
.pp-sticky .pp-logo img { height: 20px; width: auto; display: block; }
.pp-sticky nav { display: flex; gap: 24px; align-items: center; }
.pp-sticky nav a {
  color: #fff; opacity: 0.85; text-decoration: none;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 13.5px; font-weight: 500; letter-spacing: 0.01em;
  transition: color 0.18s ease, opacity 0.18s ease;
}
.pp-sticky nav a:hover { opacity: 1; color: #8fa3ff; }
.pp-sticky nav a.pp-cur { opacity: 1; color: #8fa3ff; }
.pp-sticky .pp-book {
  background: #5271FF; color: #fff; text-decoration: none;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 13.5px; font-weight: 600; letter-spacing: 0.01em;
  padding: 10px 18px; border-radius: 4px; white-space: nowrap;
}

@media (max-width: 767px) {
  .pp-sticky { padding: 8px 16px; }
  .pp-sticky nav { display: none; }
  .pp-sticky .pp-logo img { height: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .pp-card, .pp-btn, .pp-imgfade, .pp-sticky { transition: none; }
  .pp-imgfade { opacity: 1; }
}