.wr{display:grid;gap:14px}
.wr-stack{display:grid;grid-template-columns:minmax(0, 1fr)}
.wr-i{grid-area:1 / 1;position:relative;padding-right:14%}
.wr-i .wr-ph{position:absolute;right:0;bottom:56px;z-index:1;width:min(26%, 170px)}
.wr-ph .dv-link{box-shadow:var(--dv-shadow), 0 0 0 1.5px var(--device-edge) inset, 0 30px 60px -30px var(--ink-a55)}
.wr-ph .dv-cap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wr-i .dv--browser-tall .dv-cap{min-height:88px}
.wr-i:not(.is-on):not(.is-out),.wk-hero:not(.is-live) .wr-i:not(.is-on){visibility:hidden}
.wr-i.is-on{z-index:1}
.wk-hero.is-live .wr-i.is-on{opacity:var(--v, 1)}
.wk-hero.is-live .wr-i.is-out .dv-cap{visibility:hidden}
.wr-dots{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.wr-dots i{width:6px;height:6px;border-radius:50%;background:var(--line-2);transition:background-color .3s var(--ease)}
.wr-dots i.is-on{background:var(--teal)}
.wk-jump{list-style:none;margin:0 0 32px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.wk-jump a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:99px;background:var(--white);
  box-shadow:0 0 0 1px var(--line-2);font-weight:600;text-decoration:none}
.js .wk-jump{display:none}
.wk-filter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 32px}
.wk-f{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border:0;border-radius:99px;background:var(--white);
  box-shadow:0 0 0 1px var(--line-2);color:var(--ink);font:inherit;font-size:.9375rem;font-weight:600;cursor:pointer;
  transition:background-color .3s var(--ease), color .3s var(--ease), box-shadow .3s var(--ease)}
.wk-f:hover{box-shadow:0 0 0 1px var(--accent)}
.wk-f[aria-pressed="true"]{background:var(--accent);color:var(--cta-fg);box-shadow:none}
.wk-grid .fr-cell.is-off{display:none}
@media (prefers-reduced-motion:no-preference){
  .wk-grid .fr-cell.is-in{animation:wk-in .3s var(--ease-out) both}
}
@keyframes wk-in{from{opacity:0;transform:translateY(8px)}}
.fr-case{margin:6px 0 0;font-size:.875rem;font-weight:650}
.cs-list{list-style:none;margin:40px 0 0;padding:0;display:grid;gap:28px;grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr))}
.cs{position:relative;display:grid;gap:10px;align-content:start}
.cs-pic img{display:block;width:100%;height:auto;border-radius:14px;box-shadow:var(--win-shadow), 0 0 0 1px var(--line)}
.cs-h{margin:6px 0 0;font-size:1.15rem;line-height:1.3;font-weight:700}
.cs-h a{color:var(--ink);text-decoration:none}
.cs-h a::after{content:"";position:absolute;inset:0;border-radius:14px}
.cs-h a:hover,.cs-h a:focus-visible{color:var(--accent);text-decoration:underline}
.cs-d{margin:0;color:var(--ink-2);font-size:.9375rem;line-height:1.5}
@media (max-width:699px){
  .wr-i{padding-right:0}
  .wr-i .wr-ph{width:34%;bottom:64px;right:-4px}
  .wr-i .dv--browser-tall .dv-cap{min-height:104px;padding-right:38%}
}