:root{
  --accent:#ED3B4D; --ink:#2E2E33; --soft:#55555C; --muted:#8A8A93;
  --line:#E6E6EB; --surface:#F5F5F7; --white:#fff; --amber:#8A6A12; --amber-bg:#FEF6E4;
  --font:'Nunito','Noto Sans Georgian',-apple-system,BlinkMacSystemFont,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font);color:var(--ink);background:var(--white);line-height:1.62;
     -webkit-font-smoothing:antialiased}
.wrap{max-width:760px;margin:0 auto;padding:0 24px}
a{color:var(--accent)}

nav{border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(255,255,255,.94);
    backdrop-filter:blur(10px);z-index:20}
.nav{display:flex;align-items:center;height:68px;max-width:1120px;margin:0 auto;padding:0 24px}
.nav img{height:28px}
.nav .back{margin-left:auto;font-size:14.5px;font-weight:700;color:var(--soft);
           text-decoration:none}
.nav .back:hover{color:var(--ink)}

header.doc{padding:56px 0 8px}
header.doc h1{font-size:clamp(30px,4.4vw,42px);font-weight:900;letter-spacing:-.8px;
              line-height:1.12}
header.doc .meta{color:var(--muted);font-size:14px;font-weight:700;margin-top:14px}

.draft{background:var(--amber-bg);border-radius:14px;padding:16px 18px;margin:26px 0 0;
       font-size:14.5px;font-weight:600;color:var(--amber);line-height:1.5}

main{padding:20px 0 90px}
h2{font-size:22px;font-weight:800;letter-spacing:-.3px;margin:40px 0 12px}
h3{font-size:17px;font-weight:800;margin:26px 0 8px}
p{margin:12px 0;color:var(--soft);font-size:16px}
ul,ol{margin:12px 0 12px 22px;color:var(--soft);font-size:16px}
li{margin:7px 0}
strong{color:var(--ink)}
.toc{background:var(--surface);border-radius:16px;padding:22px 26px;margin:30px 0}
.toc h4{font-size:12.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);
        margin-bottom:12px;font-weight:900}
.toc a{display:block;font-size:15px;font-weight:700;color:var(--soft);text-decoration:none;
       margin:7px 0}
.toc a:hover{color:var(--accent)}
table{width:100%;border-collapse:collapse;margin:18px 0;font-size:15px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);
      vertical-align:top;color:var(--soft)}
th{font-size:12.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);
   font-weight:900}
td strong{color:var(--ink)}
.fill{background:#FFF3F4;border-radius:6px;padding:1px 7px;font-weight:800;color:var(--accent);
      font-size:14.5px;white-space:nowrap}

footer{border-top:1px solid var(--line);padding:34px 0;font-size:14px;color:var(--muted);
       font-weight:600}
footer .wrap{display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between}
footer a{color:var(--soft);text-decoration:none;font-weight:700}
footer a:hover{color:var(--ink)}
@media (max-width:600px){
  header.doc{padding-top:36px}
  /* Georgian compounds do not break: "კონფიდენციალურობის" is one 18-character
     token that renders 386px at the 30px clamp floor, in a 342px content box.
     Nothing can wrap it, so the floor comes down until the longest title on
     these pages fits. break-word is the backstop for anything else that is one
     long token — an email address, a URL in the processors table. */
  header.doc h1{font-size:clamp(25px,4.4vw,42px)}
  header.doc h1, .wrap p, .wrap li, table td{overflow-wrap:break-word}
}

/* ---- language toggle, shared by every legal page ---- */
.langbar{display:flex;gap:2px;background:var(--surface);border-radius:10px;padding:3px}
.langbar button{font-family:var(--font);font-size:13px;font-weight:800;padding:5px 11px;
  border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.langbar button[aria-pressed="true"]{background:var(--white);color:var(--ink);
  box-shadow:0 1px 3px rgba(0,0,0,.12)}
.nav .back{margin-left:auto;margin-right:14px}

[data-ka],[data-en]{display:none}
html[lang="ka"] [data-ka]{display:revert}
html[lang="en"] [data-en]{display:revert}

/* ---------------------------------------------------------------------------
   Tables on a phone.

   The Impressum and the three privacy tables are the only things on these
   pages that do not fit 390px — they were forcing 81-109px of horizontal
   overflow, so the right-hand column of every row was cut off. A legal page
   that a phone cannot show in full is not doing its job.

   Rows become blocks: the first cell is the key and stays bold, the rest read
   underneath it. The processors table is three columns wide and its 2nd and
   3rd cells carry data-label, so "what for" and "where" keep their meaning
   once the header row is gone — that table says where personal data leaves
   the country, which is exactly the part that must survive.
   --------------------------------------------------------------------------- */
@media (max-width:600px){
  table{display:block;width:100%}
  table tbody{display:block;width:100%}
  table tr{display:block;width:100%;padding:14px 0;border-bottom:1px solid var(--line)}
  table tr:last-child{border-bottom:0}
  /* The header row carries no information once each cell is labelled.
     The second selector is not redundant: privacy.html puts its Georgian and
     English headers in separate <tr data-ka>/<tr data-en> rows, and the page's
     own "html[lang='ka'] [data-ka]{display:revert}" scores (0,2,1) — it beats a
     plain "table tr:has(th)" at (0,0,3) and reverts the row to table-row. This
     one carries the attribute too, so it outranks the language rule. */
  table tr:has(th){display:none}
  html[lang] table tr[data-ka]:has(th),
  html[lang] table tr[data-en]:has(th){display:none}
  table td{display:block;width:100%;padding:2px 0;border:0}
  table td:first-child{font-weight:800;color:var(--ink);margin-bottom:4px}
  table td[data-label]::before{
    content:attr(data-label);
    display:block;font-size:12px;font-weight:800;letter-spacing:.04em;
    text-transform:uppercase;color:var(--muted);margin-top:6px}
}
