/* Galería en espiral 3D (arrastra o deja que gire): ocupa el hueco de "Ubicación" en el home */
.sp { position: relative; width: 100%; max-width: 340px; height: clamp(380px, 52vh, 520px); touch-action: pan-x; cursor: grab; user-select: none; -webkit-user-select: none; margin-bottom: 14px; }
.sp.is-drag { cursor: grabbing; }
.sp__stage { position: absolute; inset: 0; overflow: visible; }
.sp__card { position: absolute; left: 50%; top: 50%; width: 190px; aspect-ratio: 16 / 10; margin: 0; border-radius: 14px; overflow: hidden; background: var(--indigo-ink); box-shadow: 0 18px 30px -12px rgba(53,23,118,.45), 0 0 0 1px rgba(255,255,255,.4) inset; will-change: transform, opacity; }
.sp__card img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; -webkit-user-drag: none; }
.sp__card span { position: absolute; left: 8px; bottom: 6px; padding: 3px 9px; border-radius: 99px; background: rgba(255,255,255,.9); color: var(--indigo-ink); font-family: var(--font-display); font-weight: 600; font-size: 10px; letter-spacing: .04em; }
.sp__hint { margin: 0 0 14px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: color-mix(in srgb, var(--fg) 55%, transparent); }
@media (max-width: 800px) { .sp { max-width: 360px; margin-inline: auto; height: 400px; } .sp__hint { text-align: center; } }
.about__aside { display: grid; align-content: start; justify-items: start; }
