/* Privacy and Terms: the landing page's tokens, nav and footer, with a reading column. */
:root{
  --bg:#f8f7fc; --bg-2:#ffffff; --line:rgba(30,24,37,.09); --line-2:rgba(30,24,37,.16);
  --ink:#1e1825; --mute:#706874; --dim:#9a919e; --hot:#7c3aed;
  --serif:"Inter Tight", -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, sans-serif;
  --sans:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, sans-serif;
  --pad:clamp(16px,4vw,48px); --max:1240px; --ease:cubic-bezier(.2,.7,.1,1);
  --grad:linear-gradient(100deg,#7c3aed 10%,#ec4899 90%);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip;scroll-padding-top:96px}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
em{font-style:normal}
::selection{background:var(--hot);color:#fff}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}

/* nav, as on the landing page */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(248,247,252,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:22px;letter-spacing:-.02em}
.brand img{width:40px;height:40px;border-radius:11px;box-shadow:0 6px 16px -8px rgba(124,58,237,.6)}
.navr{display:flex;align-items:center;gap:22px}
.navlink{font-size:14px;font-weight:500;color:var(--mute);transition:color .2s}.navlink:hover,.navlink.on{color:var(--ink)}
.pill{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 18px;border-radius:99px;border:1px solid var(--line-2);font-size:14px;font-weight:500;transition:background .25s,color .25s,border-color .25s}
.pill:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* head */
.lhead{position:relative;overflow:hidden;padding:clamp(130px,16vw,190px) 0 clamp(48px,7vw,84px)}
.lhead::before{content:"";position:absolute;width:900px;height:900px;right:-300px;top:-380px;border-radius:50%;
  background:radial-gradient(circle,rgba(124,58,237,.13),rgba(124,58,237,0) 62%);pointer-events:none}
.lhead::after{content:"";position:absolute;width:640px;height:640px;left:-300px;bottom:-420px;border-radius:50%;
  background:radial-gradient(circle,rgba(236,72,153,.13),rgba(236,72,153,0) 65%);pointer-events:none}
.lhead .wrap{position:relative;z-index:1}
.label{font-size:13.5px;font-weight:600;color:var(--hot);margin-bottom:22px}
h1{font-family:var(--serif);font-weight:600;font-size:clamp(52px,7.4vw,108px);line-height:.95;letter-spacing:-.055em;margin-bottom:28px}
h1 em,.lnext em{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em}
.lede{max-width:560px;color:var(--mute);font-size:clamp(17px,1.5vw,19px)}
.updated{display:inline-flex;align-items:center;gap:10px;margin-top:30px;height:34px;padding:0 14px;border-radius:99px;
  background:var(--bg-2);border:1px solid var(--line);font-size:13.5px;color:var(--mute)}
.updated i{width:6px;height:6px;border-radius:50%;background:var(--grad)}
.o-head{position:absolute;right:max(var(--pad),calc(50% - 600px));top:clamp(110px,13vw,150px);width:clamp(120px,17vw,250px);height:auto;pointer-events:none;animation:fa 9s ease-in-out infinite}
@keyframes fa{50%{transform:translate3d(0,-14px,0) rotate(3deg)}}

/* body: contents on the left, the text on the right */
.lbody{padding-bottom:clamp(70px,10vw,130px)}
.lgrid{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:clamp(32px,6vw,96px);align-items:start;border-top:1px solid var(--line);padding-top:clamp(36px,5vw,60px)}
.toc{position:sticky;top:100px}
.toc b{display:block;font-size:13px;font-weight:600;color:var(--dim);margin-bottom:14px}
.toc ol{list-style:none;counter-reset:t;display:flex;flex-direction:column}
.toc li{counter-increment:t}
.toc a{display:flex;gap:12px;padding:8px 0;font-size:15px;color:var(--mute);border-bottom:1px solid transparent;transition:color .2s}
.toc a::before{content:counter(t,decimal-leading-zero);font-variant-numeric:tabular-nums;color:var(--dim);font-size:13px;padding-top:2px;min-width:20px}
.toc a:hover,.toc a.on{color:var(--ink)}
.toc a.on::before{color:var(--hot)}

.legal{max-width:720px;color:#3d3542}
.legal > p:first-child{font-size:clamp(18px,1.6vw,20px);color:var(--ink);line-height:1.55}
.legal section{padding:clamp(28px,3.4vw,40px) 0;border-bottom:1px solid var(--line)}
.legal section:last-child{border-bottom:0}
.legal h2{display:flex;align-items:baseline;gap:14px;font-family:var(--serif);font-weight:600;font-size:clamp(26px,2.6vw,34px);line-height:1.1;letter-spacing:-.04em;color:var(--ink);margin-bottom:16px}
.legal h2 span{font-size:15px;letter-spacing:0;font-weight:600;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.legal p{margin-top:12px}
.legal p:first-child{margin-top:0}
.legal ul{list-style:none;margin-top:14px;display:flex;flex-direction:column;gap:10px}
.legal li{position:relative;padding-left:22px}
.legal li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--grad)}
.legal strong{color:var(--ink);font-weight:600}
.legal a{color:var(--hot);text-decoration:underline;text-decoration-color:rgba(124,58,237,.3);text-underline-offset:3px;transition:text-decoration-color .2s}
.legal a:hover{text-decoration-color:var(--hot)}

.plans{margin:18px 0 22px;padding:clamp(22px,3vw,30px);border-radius:24px;border:1px solid var(--line);
  background:radial-gradient(120% 120% at 100% 0%,rgba(236,72,153,.12),transparent 60%),radial-gradient(120% 120% at 0% 100%,rgba(124,58,237,.12),transparent 60%),var(--bg-2);
  box-shadow:0 40px 80px -50px rgba(30,24,37,.3)}
.plans h3{font-family:var(--serif);font-weight:600;font-size:20px;letter-spacing:-.03em;color:var(--ink);margin-bottom:6px}
.plans ul{margin-top:10px}

.contact{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:6px;padding:22px 24px;border-radius:20px;background:var(--bg-2);border:1px solid var(--line)}
.contact p{margin:0;color:var(--mute)}
.contact .pill{background:var(--ink);color:#fff;border-color:var(--ink)}
.contact .pill:hover{background:var(--hot);border-color:var(--hot)}
.legal .contact a.pill{text-decoration:none;color:#fff}

/* the other document */
.lnext{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;margin:0 var(--pad) var(--pad);padding:clamp(36px,6vw,70px) var(--pad);
  border-radius:clamp(24px,4vw,44px);border:1px solid var(--line);background:radial-gradient(120% 90% at 50% 0%,#efe6ff 0%,#f7f2fd 60%,#fff 100%)}
.lnext .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;width:100%;padding:0}
.lnext small{display:block;font-size:13.5px;font-weight:600;color:var(--mute);margin-bottom:8px}
.lnext strong{font-family:var(--serif);font-weight:600;font-size:clamp(32px,4.4vw,60px);line-height:1;letter-spacing:-.05em}
.lnext .arrow{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--ink);color:#fff;font-size:24px;transition:transform .35s var(--ease),background .35s}
.lnext:hover .arrow{transform:translateX(6px);background:var(--hot)}

footer{padding:34px 0 46px}
footer .wrap{display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between;align-items:center;font-size:14px;color:var(--dim)}
footer nav{display:flex;flex-wrap:wrap;gap:12px 24px}
footer a:hover{color:var(--ink)}
footer .brand{font-size:16px}
footer .brand img{width:24px;height:24px;border-radius:6px;box-shadow:none}
.disc{flex-basis:100%;font-size:12px;padding-right:max(0px,calc(100% - 620px))}

@media (max-width:900px){
  .lgrid{grid-template-columns:minmax(0,1fr)}
  .toc{position:static;padding-bottom:8px}
  .toc ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
  .toc a{font-size:14px;padding:6px 0}
  .o-head{width:84px;right:var(--pad);top:-6px}
  .brand img{width:34px;height:34px;border-radius:9px}.brand{font-size:20px}
  .navr{gap:16px}
}
@media (max-width:640px){.navr .navlink{display:none}.toc ol{grid-template-columns:minmax(0,1fr)}}
@media (max-width:480px){.o-head{display:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
