/* YukoDSP — Terms, Privacy, Refunds: one readable column, the site's type */
.legal{max-width:760px;margin:0 auto;padding:136px max(16px,2.2vw) 120px;box-sizing:border-box}
.legal h1{margin:0;font-size:clamp(48px,5.6vw,80px);font-weight:700;line-height:1;letter-spacing:-0.088em}
.legal .upd{margin:16px 0 0;font-size:15px;font-weight:500;color:rgba(0,0,0,.45)}
.legal .lead{margin:28px 0 0;font-size:clamp(20px,1.8vw,24px);font-weight:700;line-height:1.25;letter-spacing:-0.064em;color:#000}
.legal h2{margin:48px 0 0;font-size:24px;font-weight:700;line-height:1.15;letter-spacing:-0.064em}
.legal p,.legal li{font-size:17px;font-weight:500;line-height:1.5;letter-spacing:-0.064em;color:rgba(0,0,0,.62)}
.legal p{margin:14px 0 0}
.legal ul{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.legal li{position:relative;padding-left:20px}
.legal li::before{content:"";position:absolute;left:3px;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--yuko-1)}
.legal b{font-weight:700;color:#000}
.legal a{color:#000;text-decoration:none}
/* links in the text: the footer's email pill, copied as it is (site.css .foot a.mbl.mail). Under the pointer the
   link turns into a black pill and the arrow pops in on a pink circle at its end; the padding is taken back by
   negative margins, so the text around never moves */
.legal a.lk{position:relative;display:inline-block;padding:3px 9px;margin:-3px -9px;line-height:18px;border-radius:12px;transition:background .15s,color .15s,padding .3s var(--ease),margin .3s var(--ease)}
.legal a.lk:hover,.legal a.lk:focus-visible{background:#000;color:#fff;padding-right:27px;margin-right:-27px;outline:none}
.legal a.lk .ext{position:absolute;right:3px;top:3px;width:18px;height:18px;display:grid;place-items:center;color:#000}
.legal a.lk .ext::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--yuko-1);transform:scale(0);transition:transform .2s ease-in}
.legal a.lk .ext svg{position:relative;display:block;opacity:0;transform:scale(.3);transition:opacity .12s,transform .12s ease-in}
.legal a.lk:hover .ext::before,.legal a.lk:focus-visible .ext::before{transform:scale(1);transition:transform .38s cubic-bezier(.3,1.5,.5,1) .12s}
.legal a.lk:hover .ext svg,.legal a.lk:focus-visible .ext svg{opacity:1;transform:scale(1);transition:opacity .2s .3s,transform .32s cubic-bezier(.3,1.5,.5,1) .3s}
.legal .others{display:flex;flex-wrap:wrap;gap:8px;margin:56px 0 0;padding-top:24px;border-top:1px solid var(--line)}
.legal .others a{height:36px;display:inline-flex;align-items:center;padding:0 calc(16px + .032em) 0 calc(16px - .032em);border-radius:36px;background:rgba(0,0,0,.05);font-size:15px;font-weight:700;text-decoration:none;transition:background .15s}
.legal .others a:hover{background:var(--yuko-1)}
.legal .others a[aria-current]{background:#000;color:#fff}
@media (max-width:900px){.legal{padding-top:96px}}
