.app-screenshots{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:48px;padding:32px 0;margin-top:24px}.phone-mockup{display:flex;flex-direction:column;align-items:center;gap:20px;animation:fadeInUp .8s cubic-bezier(.16,1,.3,1) forwards;opacity:0}.phone-mockup[data-index="0"]{animation-delay:.15s}.phone-mockup[data-index="1"]{animation-delay:.3s}.phone-mockup[data-index="2"]{animation-delay:.45s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.phone-frame{position:relative;width:100%;max-width:300px;aspect-ratio:10 / 19.5;background:linear-gradient(145deg,#1a1530,#2a2048);border-radius:12px;padding:6px;box-shadow:0 24px 64px #1a15303d,0 12px 32px #1a153029,0 4px 12px #1a15301f,inset 0 0 0 .5px #8b7bf714;transition:all .5s cubic-bezier(.16,1,.3,1)}.phone-frame:hover{transform:translateY(-12px) scale(1.03);box-shadow:0 32px 80px #1a153052,0 16px 40px #1a15303d,0 8px 16px #1a153029,inset 0 0 0 .5px #8b7bf729,0 0 0 .5px #8b7bf70a,0 0 40px #8b7bf71f}.phone-screen{position:relative;width:100%;height:100%;background:#000;border-radius:10px;overflow:hidden;box-shadow:inset 0 0 0 .5px #8b7bf70a,inset 0 2px 8px #0006}.phone-screen img{width:100%;height:100%;object-fit:cover;display:block}.screenshot-label{font-family:var(--f-mono, "Geist Mono", monospace);font-size:12px;font-weight:500;color:var(--cream-3);text-align:center;letter-spacing:.02em;text-transform:uppercase;opacity:.8;transition:opacity .3s ease,color .3s ease}.phone-mockup:hover .screenshot-label{opacity:1;color:var(--accent)}@media (max-width: 768px){.app-screenshots{grid-template-columns:1fr;gap:56px;padding:24px 0}.phone-frame{max-width:260px}}.app-screenshots.single{grid-template-columns:1fr;justify-items:center;max-width:400px;margin:0 auto}.app-screenshots.single .phone-frame{max-width:340px}.app-screenshots.two-col{grid-template-columns:repeat(2,1fr);max-width:720px;margin:0 auto;gap:56px}@media (max-width: 768px){.app-screenshots.two-col{grid-template-columns:1fr}}.app-screenshots.three-col{grid-template-columns:repeat(3,1fr);max-width:1080px;margin:0 auto;gap:48px}@media (max-width: 1024px){.app-screenshots.three-col{grid-template-columns:repeat(2,1fr);gap:48px}}@media (max-width: 640px){.app-screenshots.three-col{grid-template-columns:1fr;gap:56px}}@media (prefers-reduced-motion: reduce){.phone-mockup{animation:none;opacity:1}.phone-frame{transition:none}.phone-frame:hover{transform:none}}