.how-intro{padding-bottom:clamp(3rem,7vw,6rem)}.how-hero-duo{isolation:isolate;min-height:clamp(31rem,58vw,40rem);position:relative}.how-hero-phone{margin:0;position:absolute}.how-hero-phone picture,.how-hero-phone img{width:100%}.how-hero-phone figcaption{z-index:3;border:1px solid var(--color-border-onChrome);border-radius:var(--radius-pill);background:var(--color-surface-chrome);color:var(--color-text-onChromeMuted);font-family:var(--font-family-mono);font-size:.62rem;font-weight:var(--font-weight-semibold);letter-spacing:.08em;text-transform:uppercase;padding:.45rem .65rem;position:absolute}.how-hero-phone-nearby{z-index:3;width:min(51%,18rem);top:2%;left:5%;transform:rotate(-4deg)}.how-hero-phone-nearby figcaption{top:15%;left:-.5rem}.how-hero-phone-events{z-index:2;width:min(44%,16rem);bottom:0;right:2%;transform:rotate(5deg)}.how-hero-phone-events figcaption{bottom:19%;right:-.5rem}.how-hero-link{z-index:1;aspect-ratio:1;border:1px solid var(--color-accent-figStroke);border-radius:50%;width:76%;position:absolute;top:51%;left:50%;transform:translate(-50%,-50%)}.how-hero-link:before,.how-hero-link:after,.how-hero-link i,.how-hero-link b{content:"";border-radius:50%;position:absolute}.how-hero-link:before{border:1px solid var(--color-border-strong);inset:18%}.how-hero-link:after{background:var(--color-brand-primary);width:.7rem;height:.7rem;top:29%;left:18%}.how-hero-link b{background:var(--color-brand-primaryHover);width:.7rem;height:.7rem;bottom:27%;right:15%}.connection-path-grid{gap:1rem;display:grid}.connection-path{border:1px solid var(--color-border);border-radius:var(--radius-panel);background:var(--color-surface-card);min-height:0;box-shadow:var(--panel-shadow);grid-template-rows:auto auto;align-content:space-between;padding:clamp(1.5rem,4vw,2.5rem);display:grid;position:relative;overflow:hidden}.connection-path-copy{z-index:3;max-width:33rem;position:relative}.connection-path-label{color:var(--color-text-brand);font-family:var(--font-family-mono);font-size:var(--type-caption2-size);font-weight:var(--font-weight-semibold);letter-spacing:.1em;text-transform:uppercase}.connection-path h3{letter-spacing:-.045em;max-width:9ch;margin-top:1.6rem;font-size:clamp(2.2rem,5vw,4rem);line-height:.95}.connection-path p{max-width:31rem;color:var(--color-text-secondary);margin-top:1rem;line-height:1.75}.connection-facts{color:var(--color-text-secondary);gap:.65rem;margin:1.4rem 0 0;padding:0;font-size:.9rem;list-style:none;display:grid}.connection-facts li{align-items:center;gap:.65rem;display:flex}.connection-facts li:before{content:"";background:var(--color-brand-primary);border-radius:50%;flex:none;width:.42rem;height:.42rem}.connection-path-visual{z-index:1;justify-self:end;width:min(72%,20rem);margin-top:clamp(2rem,5vw,3.5rem);position:relative;bottom:auto;right:auto}.bluetooth-path-visual{aspect-ratio:1}.bluetooth-path-visual .proximity-ring{aspect-ratio:1;border:1px solid var(--color-border-strong);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.proximity-ring-1{width:34%}.proximity-ring-2{width:63%;border-color:var(--color-accent-figStroke)!important}.proximity-ring-3{width:94%}.proximity-person{width:2.7rem;height:2.7rem;font-family:var(--font-family-display);border-radius:50%;place-items:center;font-size:.9rem;display:grid;position:absolute}.proximity-person-a{background:var(--color-brand-primary);color:var(--color-brand-onPrimary);top:42%;left:24%}.proximity-person-b{background:var(--color-accent-figWash);color:var(--color-text-brand);top:27%;right:18%}.event-path-visual{width:min(100%,21rem);min-height:24rem}.event-screenshot{width:min(58%,11rem);margin:0;position:absolute}.event-screenshot picture,.event-screenshot img{width:100%;height:auto;display:block}.event-screenshot-past{z-index:1;bottom:0;left:1%;transform:rotate(-5deg)}.event-screenshot-upload{z-index:2;bottom:5%;right:1%;transform:rotate(5deg)}.how-interest-layout{align-items:start}.match-replay{align-items:start;gap:clamp(2rem,6vw,5rem);display:grid}.match-replay-copy{max-width:34rem;color:var(--color-text-secondary);line-height:1.75}.replay-controls{margin-top:1.5rem}.replay-controls p{min-height:1.5rem;color:var(--color-text-tertiary);font-family:var(--font-family-mono);font-size:var(--type-caption2-size);margin-top:.75rem;line-height:1.5}.replay-timeline{gap:.6rem;margin:0;padding:0;list-style:none;display:grid}.replay-step{border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-card);opacity:.45;transition:opacity var(--motion-base) var(--ease-standard), transform var(--motion-base) var(--ease-standard), border-color var(--motion-base) var(--ease-standard);grid-template-columns:2.5rem 1fr;align-items:start;gap:.9rem;padding:1rem;display:grid}.replay-step.is-current,.replay-step.is-complete{opacity:1}.replay-step.is-current{border-color:var(--color-brand-primary);transform:translate(.25rem)}.replay-step>span{background:var(--color-accent-wash);width:2.25rem;height:2.25rem;color:var(--color-text-brand);font-family:var(--font-family-mono);font-size:var(--type-caption2-size);font-weight:var(--font-weight-semibold);border-radius:50%;place-items:center;display:grid}.replay-step.is-current>span,.replay-step.is-complete>span{background:var(--color-brand-primary);color:var(--color-brand-onPrimary)}.replay-step strong{display:block}.replay-step p{color:var(--color-text-secondary);margin-top:.22rem;font-size:.88rem;line-height:1.55}.wink-layout{align-items:start}.wink-layout .app-shot-card{justify-self:center;width:min(100%,20rem)}.how-privacy-handoff{padding:1rem 0 var(--section-block)}.how-privacy-handoff .quote-panel{border-radius:var(--radius-panel)}.how-privacy-handoff a{color:var(--color-brand-primary);font-weight:var(--font-weight-bold);margin-top:1.5rem;display:inline-flex}@media (width>=52rem){.connection-path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.match-replay{grid-template-columns:minmax(0,.8fr) minmax(20rem,1.2fr)}}@media (prefers-reduced-motion:reduce){.replay-step{transition:none}}
