/* Real iPhone captures, 4 October 2026. Preserve their complete framed composition. */
.screenshot-gallery .wrap { max-width: 1160px; }
.screenshot-gallery .shots { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: none; gap: 18px; }
.screenshot-gallery figure { padding: 18px 14px 22px; border-radius: 24px; background: #efe8f8; text-align: left; }
.screenshot-gallery figure:nth-child(2) { background: #fce5dd; }
.screenshot-gallery figure:nth-child(3) { background: #e2f0ed; }
.screenshot-gallery figure:nth-child(4) { background: #e9eafe; }
.shot-step { display: block; margin: 0 0 14px 4px; font-size: .8rem; font-weight: 700; color: #655d69; }
.screenshot-gallery .shots a { display: block; border-radius: 20px; }
.screenshot-gallery .shots img { display: block; width: 100%; height: auto; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.screenshot-gallery figcaption { color: var(--ink); margin-top: 24px; }
.screenshot-gallery figcaption strong, .screenshot-gallery figcaption span { display: block; }
.screenshot-gallery figcaption strong { font-size: 1rem; line-height: 1.35; }
.screenshot-gallery figcaption span { margin-top: 8px; color: #59525e; font-size: .9rem; line-height: 1.5; }
a:focus-visible { outline: 3px solid #934139; outline-offset: 5px; }
@media (max-width: 900px) { .screenshot-gallery .shots { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 680px; } }
@media (max-width: 560px) { .screenshot-gallery .shots { grid-template-columns: minmax(0, 1fr); max-width: 340px; gap: 24px; } .screenshot-gallery figure { padding: 20px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
