/* ============================================================================
   Andromeda — оформление юридических страниц (privacy / data-deletion / terms).
   Палитра и типографика взяты из index.html, чтобы страницы не выглядели
   чужими. Отдельный файл, а не инлайн: один и тот же шелл на трёх страницах.
   ========================================================================== */

:root{
  --bg:#0a2522; --bg-deep:#07211e; --surface:#08302c; --card:#0f3b36;
  --teal:#5eead4; --teal-hi:#99f6e4; --teal-rgb:94 234 212;
  --gold:#e8b85a; --gold-pale:#fbefc4; --gold-rgb:232 184 90;
  --ink:#f3f6f4; --ink-soft:#bcd6d0; --muted:#a7c5bf; --muted-2:#7fa39d;
  --line:rgb(94 234 212 / .16);
  --radius:20px; --radius-sm:14px; --pill:999px;
  --maxw:820px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.7;
  background-image:
    radial-gradient(900px 500px at 12% -6%, rgb(var(--teal-rgb) / .10), transparent 60%),
    radial-gradient(700px 420px at 92% 4%, rgb(var(--gold-rgb) / .08), transparent 60%);
  background-repeat:no-repeat;
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.wrap{width:min(100% - 40px,var(--maxw));margin-inline:auto}

/* ------------------------------------------------------------------ header */
.lhead{position:sticky;top:0;z-index:20;padding-block:14px;
  background:rgb(7 33 30 / .82);backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--line)}
.lhead__row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand__mark{width:38px;height:38px;flex:none}
.brand__mark svg{width:100%;height:100%;display:block}
.brand__name{display:block;font-size:.95rem;letter-spacing:.22em;font-weight:600}
.brand__sub{display:block;font-size:.6rem;letter-spacing:.26em;color:var(--teal);margin-top:2px}
.lhead__back{display:inline-flex;align-items:center;gap:8px;text-decoration:none;
  color:var(--ink-soft);font-size:.9rem;padding:9px 16px;border-radius:var(--pill);
  border:1px solid var(--line);transition:color .25s,border-color .25s,background .25s}
.lhead__back svg{width:16px;height:16px}
@media (hover:hover){.lhead__back:hover{color:var(--ink);border-color:rgb(var(--teal-rgb) / .4);background:rgb(var(--teal-rgb) / .08)}}

/* --------------------------------------------------------------- page body */
.page{padding-block:52px 72px}
.page__eyebrow{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--teal);font-weight:600;margin:0 0 12px}
h1{font-size:clamp(1.9rem,5vw,2.75rem);line-height:1.15;margin:0 0 18px;font-weight:600;
  letter-spacing:-.01em}
.meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0 0 34px;padding-bottom:26px;
  border-bottom:1px solid var(--line);font-size:.88rem;color:var(--muted-2)}
.meta b{color:var(--ink-soft);font-weight:500}

.lead{font-size:1.06rem;color:var(--ink-soft);margin:0 0 30px}

.card{background:linear-gradient(180deg,rgb(15 59 54 / .7),rgb(8 48 44 / .55));
  border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px;margin:0 0 34px}
.card h2:first-child,.card h3:first-child{margin-top:0}
.card--note{border-color:rgb(var(--gold-rgb) / .3);
  background:linear-gradient(180deg,rgb(var(--gold-rgb) / .09),rgb(var(--gold-rgb) / .03))}

h2{font-size:1.28rem;line-height:1.3;margin:44px 0 14px;font-weight:600;scroll-margin-top:90px}
h2 .num{color:var(--teal);font-variant-numeric:tabular-nums;margin-right:8px;font-weight:500}
h3{font-size:1.02rem;margin:28px 0 10px;font-weight:600;color:var(--ink-2,var(--ink))}
p{margin:0 0 14px}
ul,ol{margin:0 0 16px;padding-left:22px}
li{margin-bottom:9px}
li::marker{color:rgb(var(--teal-rgb) / .75)}
strong{font-weight:600;color:var(--ink)}
a{color:var(--teal);text-decoration:none;border-bottom:1px solid rgb(var(--teal-rgb) / .35);
  transition:color .2s,border-color .2s}
@media (hover:hover){a:hover{color:var(--teal-hi);border-color:var(--teal-hi)}}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em;
  background:rgb(var(--teal-rgb) / .1);padding:2px 6px;border-radius:6px}

.toc{background:rgb(8 48 44 / .5);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 24px;margin:0 0 40px}
.toc h2{margin:0 0 12px;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
.toc ol{margin:0;padding-left:20px;columns:2;column-gap:32px}
.toc li{margin-bottom:6px;break-inside:avoid}
.toc a{border-bottom:none;color:var(--ink-soft);font-size:.94rem}
@media (hover:hover){.toc a:hover{color:var(--teal)}}
@media (max-width:640px){.toc ol{columns:1}}

/* ------------------------------------------------------------------ tables */
.tbl-scroll{overflow-x:auto;margin:0 0 24px;border:1px solid var(--line);border-radius:var(--radius-sm)}
table{width:100%;border-collapse:collapse;font-size:.94rem;min-width:520px}
th,td{text-align:left;padding:12px 16px;vertical-align:top;border-bottom:1px solid var(--line)}
th{background:rgb(var(--teal-rgb) / .07);color:var(--teal);font-weight:600;
  font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
tbody tr:last-child td{border-bottom:none}
td:first-child{color:var(--ink-soft);font-weight:500}

/* ------------------------------------------------------------------ footer */
.lfoot{border-top:1px solid var(--line);padding-block:30px 40px;
  background:linear-gradient(180deg,transparent,rgb(7 33 30 / .8))}
.lfoot__row{display:flex;flex-wrap:wrap;gap:14px 26px;justify-content:space-between;
  align-items:center;font-size:.87rem;color:var(--muted-2)}
.lfoot__links{display:flex;flex-wrap:wrap;gap:8px 20px}
.lfoot__links a,.lfoot__links button{color:var(--ink-soft);border-bottom:none;font-size:.87rem}
.lfoot__links button{background:none;border:none;padding:0;cursor:pointer;
  font-family:inherit;color:var(--ink-soft)}
@media (hover:hover){.lfoot__links a:hover,.lfoot__links button:hover{color:var(--teal)}}

:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:4px}