/* Local pose-guide composition: isolated from all other mockups. */
#iphone-guide {
  --guide-phone-shift: 0px;
  --guide-copy-shift: 0px;
  --guide-wash-shift: 0px;
  position: relative;
  isolation: isolate;
  padding: 64px 0 !important;
  gap: clamp(40px, 6vw, 80px) !important;
  align-items: center !important;
}
#iphone-guide > .iphone-scene {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 44px 24px !important;
  border-radius: 32px;
  background: #e7f1ed;
}
#iphone-guide > .iphone-scene::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -65px;
  pointer-events: none;
  background: radial-gradient(ellipse at 8% 12%, #d4efe5 0%, transparent 62%),
    radial-gradient(ellipse at 94% 45%, #f5d7d9 0%, transparent 63%),
    radial-gradient(ellipse at 40% 100%, #f9e6d7 0%, transparent 62%), #e4f4ee;
  transform: translate3d(0, var(--guide-wash-shift), 0);
}
#iphone-guide .iphone-shell {
  width: min(100%, 340px) !important;
  transform: translate3d(0, var(--guide-phone-shift), 0);
  filter: drop-shadow(0 25px 24px #33473f27);
}
#iphone-guide > .ypd-copy {
  max-width: 425px;
  transform: translate3d(0, var(--guide-copy-shift), 0);
}
/* Compact photo and title header preserves the familiar pose-guide composition. */
#iphone-guide .ypd-intro {
  grid-template-columns: 29cqw minmax(0, 1fr);
  gap: 3cqw;
}
#iphone-guide .ypd-intro img {
  width: 29cqw;
  height: 34cqw;
  object-fit: contain;
  border-radius: 3cqw;
}
#iphone-guide .ypd-intro h3 { font-size: 6cqw; margin: 0 0 2cqw; }
#iphone-guide .ypd-intro-card { padding: 3cqw; }
#iphone-guide .ypd-summary { margin-top: 3cqw !important; }
#iphone-guide .pose-guide-shortcuts {
  display: grid;
  gap: 0;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}
#iphone-guide .pose-guide-shortcuts li + li { border-top: 1px solid #e5edea; }
#iphone-guide .pose-guide-shortcut {
  display: block;
  width: 100%;
  padding: 18px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #2d4039;
  text-align: left;
  font: inherit;
}
#iphone-guide .pose-guide-shortcut > svg { display: none; }
#iphone-guide .pose-guide-shortcut strong { display: block; font-size: 17px; line-height: 1.35; font-weight: 500; }
#iphone-guide .pose-guide-shortcut small { display: block; margin-top: 4px; color: #716976; font-size: 13px; line-height: 1.5; }
@media (min-width: 750px) and (max-width: 1040px) {
  #iphone-guide { gap: 32px !important; }
  #iphone-guide > .iphone-scene { padding: 48px 18px !important; }
}
@media (max-width: 749px) {
  #iphone-guide { padding: 36px 0 !important; gap: 28px !important; }
  #iphone-guide > .ypd-copy { max-width: none; transform: none; }
  #iphone-guide > .iphone-scene { padding: 30px 12px !important; border-radius: 25px; }
  #iphone-guide .iphone-shell { width: min(100%, 310px) !important; transform: none; }
  #iphone-guide > .iphone-scene::before { transform: none; }
  #iphone-guide .pose-guide-shortcuts { margin-top: 20px; }
  #iphone-guide .pose-guide-shortcut { padding: 14px 0; }
  #iphone-guide .pose-guide-shortcut strong { font-size: 16px; }
  #iphone-guide .pose-guide-shortcut small { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  #iphone-guide .iphone-shell, #iphone-guide > .ypd-copy,
  #iphone-guide > .iphone-scene::before { transform: none !important; }
  }