/* =====================================================================
   Юридические страницы (/privacy, /terms, /consent) — тот же
   необрутализм, что и на основном сайте: кремовая бумага, жёсткие
   рамки, offset-тени, Archivo + Space Mono. Раньше эти страницы жили
   на своих inline-стилях от старого фиолетового дизайна и выпадали
   из общего вида.
   ===================================================================== */
:root{
    --ink:#11100c;
    --paper:#f3eedd;
    --paper2:#fffdf5;
    --lime:#c6ff3a;
    --blue:#2b2bff;
    --yellow:#ffd000;
    --t2:#3a382f;
    --t3:#6f6c5e;
    --bd:3px solid var(--ink);
    --bd2:2px solid var(--ink);
    --sh:6px 6px 0 var(--ink);
    --sh-sm:4px 4px 0 var(--ink);
    --font:'Archivo',-apple-system,sans-serif;
    --mono:'Space Mono','Cascadia Code',ui-monospace,monospace;
}
*,*::before,*::after{ margin:0; padding:0; box-sizing:border-box; }
body{
    font-family:var(--font); font-size:16px; line-height:1.65; color:var(--ink);
    background-color:var(--paper);
    background-image:radial-gradient(rgba(17,16,12,.16) 1.2px, transparent 1.2px);
    background-size:22px 22px; background-position:-11px -11px;
    overflow-x:hidden;
}
a{ color:var(--blue); font-weight:700; }
ul,ol{ margin:10px 0 18px 22px; }
li{ margin-bottom:8px; color:var(--t2); }

.nav-top{ position:sticky; top:0; z-index:10; background:var(--paper); border-bottom:var(--bd); }
.nav-inner{
    max-width:920px; margin:0 auto; padding:14px 24px;
    display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.nav-inner .back{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font); font-weight:800; font-size:14px; text-transform:uppercase; color:var(--ink); text-decoration:none; border:var(--bd2); box-shadow:3px 3px 0 var(--ink); background:var(--lime); padding:8px 14px; }
.nav-inner .back:hover{ transform:translate(-1px,-1px); box-shadow:var(--sh-sm); }
.nav-inner .brand{ margin-left:auto; font-family:var(--font); font-weight:900; font-size:18px; text-transform:uppercase; color:var(--ink); }
.nav-inner .brand span{ color:var(--blue); }

.container{ max-width:920px; margin:0 auto; padding:36px 24px 20px; }
.doc{ background:var(--paper2); border:var(--bd); box-shadow:var(--sh); padding:32px 30px; }

h1{ font-family:var(--font); font-size:clamp(26px,4.4vw,38px); font-weight:900; line-height:1.05; text-transform:uppercase; letter-spacing:-.02em; margin-bottom:14px; }
.doc-meta{ font-family:var(--mono); font-size:12.5px; font-weight:700; text-transform:uppercase; color:var(--t3); margin-bottom:26px; }
h2{ font-family:var(--font); font-size:19px; font-weight:900; text-transform:uppercase; line-height:1.1; margin:30px 0 12px; }
h2::before{ content:''; display:inline-block; width:14px; height:14px; margin-right:10px; background:var(--lime); border:var(--bd2); vertical-align:baseline; }
h3{ font-family:var(--font); font-size:16px; font-weight:900; margin:20px 0 8px; }
p{ margin-bottom:12px; color:var(--t2); font-size:15.5px; }
strong{ color:var(--ink); font-weight:800; }

/* плашка-предупреждение и реквизиты */
.callout{ background:var(--yellow); border:var(--bd); box-shadow:var(--sh-sm); padding:16px 18px; margin:22px 0; font-size:15px; font-weight:600; color:var(--ink); }
.callout p:last-child{ margin-bottom:0; color:var(--ink); }
.req{ background:var(--paper); border:var(--bd); box-shadow:var(--sh-sm); padding:16px 18px; margin:22px 0; font-family:var(--mono); font-size:13.5px; line-height:1.7; color:var(--ink); }
.req b{ display:inline-block; min-width:0; }
.todo{ background:var(--lime); border:var(--bd2); padding:0 5px; font-weight:700; }

.doc-nav{ display:flex; gap:10px; flex-wrap:wrap; margin-top:28px; }
.doc-nav a{ font-family:var(--font); font-weight:800; font-size:13px; text-transform:uppercase; color:var(--ink); text-decoration:none; background:var(--paper2); border:var(--bd2); box-shadow:3px 3px 0 var(--ink); padding:9px 14px; }
.doc-nav a:hover{ transform:translate(-1px,-1px); box-shadow:var(--sh-sm); }

.footer-bar{ max-width:920px; margin:0 auto; padding:22px 24px 40px; font-family:var(--mono); font-size:12.5px; color:var(--t3); text-align:center; }

@media (max-width:640px){
    .container{ padding:22px 16px 16px; }
    .doc{ padding:22px 18px; }
    .nav-inner{ padding:12px 16px; }
    .footer-bar{ padding:18px 16px 32px; }
    .req{ font-size:12.5px; }
}
:where(a,button):focus-visible{ outline:3px solid var(--ink); outline-offset:3px; }
