/* Legal pages (offer, privacy policy, consent, contacts): a calm, readable document in the site's colours. */
@import url('/fonts/fonts.css');
:root{color-scheme:dark;--ease:cubic-bezier(.22,1,.36,1);--bg:#09070c;--text:#f4f1f5;--muted:#a9a0b4;--accent:#ddf3a0;--line:#ffffff17}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse 70% 40% at 50% 0,#a77bff1a,transparent 70%),var(--bg);color:var(--text);font-family:Manrope,Arial,sans-serif;line-height:1.65}
a{color:var(--accent);text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
header{height:84px;margin:0 5.4%;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-size:19px;font-weight:800;letter-spacing:-.6px}
.brand svg{width:24px;height:24px;color:var(--accent)}
/* «Вернуться»: a pill with an arrow that slides left on hover. */
.back{display:inline-flex;align-items:center;gap:8px;padding:9px 18px 9px 14px;border-radius:30px;border:1px solid var(--line);
  color:var(--muted);text-decoration:none;font-size:14px;font-weight:600;background:#ffffff06;
  transition:color .35s var(--ease),border-color .35s var(--ease),background-color .35s var(--ease),box-shadow .35s var(--ease)}
.back svg{width:17px;height:17px;transition:translate .45s var(--ease)}
.back:hover{color:var(--text);border-color:#ddf3a080;background:#ddf3a00d;box-shadow:0 0 0 3px #ddf3a014}
.back:hover svg{translate:-4px 0}
.back:active{scale:.97}
/* Links between the documents. */
.docs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:820px;margin:28px auto 0;padding:0 20px}
.docs a{padding:8px 15px;border-radius:30px;border:1px solid var(--line);color:var(--muted);text-decoration:none;font-size:13px;
  transition:color .35s var(--ease),border-color .35s var(--ease),background-color .35s var(--ease)}
.docs a:hover{color:var(--text);border-color:#ffffff33}
.docs a[aria-current="page"]{color:var(--text);background:#ffffff10;border-color:#ffffff2b}
main{max-width:820px;margin:0 auto;padding:30px 20px 80px}
h1{font-family:Prata,Georgia,serif;font-weight:400;font-size:clamp(30px,5vw,44px);line-height:1.15;margin:12px 0 6px}
.edition{margin:0 0 30px;color:var(--muted);font-size:14px}
h2{font-size:19px;margin:36px 0 10px;padding-top:4px}
h3{font-size:16px;margin:22px 0 6px}
p,li{color:#ddd6e5;font-size:15.5px}
ol,ul{padding-left:22px}
li{margin:5px 0}
.lead{font-size:16.5px;color:#ece7f1}
.box{margin:22px 0;padding:18px 20px;border-radius:14px;background:#ffffff07;border:1px solid var(--line)}
.box p:first-child{margin-top:0}.box p:last-child{margin-bottom:0}
table{width:100%;border-collapse:collapse;margin:14px 0;font-size:15px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--muted);font-weight:600;font-size:13px}
.details{display:grid;grid-template-columns:max-content 1fr;gap:10px 22px;margin:0}
.details dt{color:var(--muted)}.details dd{margin:0}
/* A detail that is not filled in yet (legal.js): clearly marked so it is not published by accident. */
.missing{background:#ffd76633;color:#ffe29a;border-radius:4px;padding:0 4px}
/* Switching documents: the header and the document links stay put, the text crossfades with a small lift.
   Browsers without cross-document view transitions (and arrivals from the site) get a plain fade-in. */
@view-transition{navigation:auto}
header{view-transition-name:legal-header}
.docs{view-transition-name:legal-docs}
::view-transition-old(root){animation:legal-out .22s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:legal-in .5s var(--ease) both}
::view-transition-group(legal-docs){animation-duration:.4s;animation-timing-function:var(--ease)}
@keyframes legal-out{to{opacity:0;translate:0 -6px}}
@keyframes legal-in{from{opacity:0;translate:0 12px}}
.enter main{animation:legal-in .55s var(--ease) both}
@media(prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .enter main{animation:none}.back svg{transition:none}
}
footer{margin:0 5.4%;padding:24px 0 36px;border-top:1px solid var(--line);font-size:13px;color:#7d7488;text-align:center}
@media(max-width:600px){
  header{height:68px;margin:0 6%}
  main{padding:22px 18px 60px}
  .details{grid-template-columns:1fr;gap:2px}.details dd{margin-bottom:10px}
  table,thead,tbody,tr,th,td{display:block}thead{display:none}
  tr{padding:10px 0;border-bottom:1px solid var(--line)}td{border:0;padding:3px 0}
}
@media print{body{background:#fff;color:#000}p,li,td{color:#000}header,.docs,footer{display:none}a{color:#000}}
