/* ============ Touch interactions (mobile.js) ============ */
.rp-host { position: relative; overflow: hidden; }
.ripple {
  position: absolute; border-radius: 50%; pointer-events: none; z-index: 5;
  background: radial-gradient(circle, rgba(255,255,255,.35), rgba(255,255,255,0) 60%);
  transform: scale(0); animation: ripple .6s cubic-bezier(.16, 1, .3, 1) forwards;
}
@keyframes ripple { to { transform: scale(1); opacity: 0; } }
.is-touch .svc, .is-touch .proof-card, .is-touch .tool-card, .is-touch .android-feats li { transition: transform .35s cubic-bezier(.16, 1, .3, 1); will-change: transform; }

.tap-ring {
  position: fixed; z-index: 4; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; pointer-events: none;
  border: 2px solid var(--accent-2); animation: tapRing .7s cubic-bezier(.16, 1, .3, 1) forwards;
}
@keyframes tapRing { to { transform: scale(9); opacity: 0; } }
.hero .wrap, #particles { transition: translate .25s ease-out; }

/* swipe carousels (services, selected work) */
@media (max-width: 700px) {
  .swipe {
    display: flex !important; grid-template-columns: none !important; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory;
    margin-inline: -20px; padding: 6px 20px 10px; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain;
  }
  .swipe::-webkit-scrollbar { display: none; }
  .swipe > * { flex: 0 0 84%; scroll-snap-align: center; }
  .swipe > *:not(.is-center) { opacity: .6; scale: .94; }
  .swipe > * { transition: opacity .35s, scale .45s cubic-bezier(.16, 1, .3, 1), transform .35s cubic-bezier(.16, 1, .3, 1); }
  .swipe-dots { display: flex; justify-content: center; gap: 8px; margin-top: 10px; }
  .swipe-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 4px; background: rgba(255,255,255,.22); transition: width .35s cubic-bezier(.16, 1, .3, 1), background .3s; }
  .swipe-dots button.on { width: 26px; background: var(--accent-2); }
}
@media (prefers-reduced-motion: reduce) { .ripple, .tap-ring { display: none; } .swipe > * { transition: none; } }
