/* Simio legal pages — shared stylesheet.
   Light only, on purpose: these pages are quoted, printed and screenshotted in
   support and compliance threads, so one fixed appearance beats two.
   Fonts are self-hosted rather than pulled from a CDN — a privacy policy that
   discloses a visitor's IP to a third party to render itself is a bad joke. */

/* Latin comes from Noto Sans, Georgian from Noto Sans Georgian. The
   unicode-ranges do not overlap, so a single font-family stack serves both
   languages and each page downloads only the subsets it actually paints. */
@font-face{font-family:'Noto Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/legal/assets/fonts/noto-sans-latin-400.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Noto Sans';font-style:normal;font-weight:600;font-display:swap;src:url('/legal/assets/fonts/noto-sans-latin-600.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Noto Sans';font-style:normal;font-weight:700;font-display:swap;src:url('/legal/assets/fonts/noto-sans-latin-700.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Noto Sans Georgian';font-style:normal;font-weight:400;font-display:swap;src:url('/legal/assets/fonts/noto-sans-georgian-georgian-400.woff2') format('woff2');unicode-range:U+0589,U+10A0-10FF,U+1C90-1CBA,U+1CBD-1CBF,U+205A,U+2D00-2D2F,U+2E31}
@font-face{font-family:'Noto Sans Georgian';font-style:normal;font-weight:600;font-display:swap;src:url('/legal/assets/fonts/noto-sans-georgian-georgian-600.woff2') format('woff2');unicode-range:U+0589,U+10A0-10FF,U+1C90-1CBA,U+1CBD-1CBF,U+205A,U+2D00-2D2F,U+2E31}
@font-face{font-family:'Noto Sans Georgian';font-style:normal;font-weight:700;font-display:swap;src:url('/legal/assets/fonts/noto-sans-georgian-georgian-700.woff2') format('woff2');unicode-range:U+0589,U+10A0-10FF,U+1C90-1CBA,U+1CBD-1CBF,U+205A,U+2D00-2D2F,U+2E31}

:root{
  color-scheme:light;

  --bg:#ffffff;
  --fg:#16191b;
  --muted:#6b7376;
  --rule:#e7e4e2;
  --panel:#f7f6f5;
  --bullet:#b6b2af;

  /* Brand orange. Reserved for navigation chrome — the language selector and
     the active document tab. The document text itself never takes brand
     colour: headings, clause numbers and bullets all stay neutral. */
  --brand:#ff5f2f;
  --brand-tint:#fff2ed;

  --font:'Noto Sans','Noto Sans Georgian',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --measure:720px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:var(--font);
  font-size:17px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Georgian sets denser than Latin at the same size and needs more air between
   lines to stay readable in long legal paragraphs. */
html[lang='ka'] body{line-height:1.8}

/* ---------------------------------------------------------------- masthead */

.masthead{
  position:sticky;
  top:0;
  z-index:10;
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(12px);
  -webkit-backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--rule);
}
.masthead-inner{
  max-width:var(--measure);
  margin:0 auto;
  padding:14px 22px;
  display:flex;
  align-items:center;
  gap:16px;
}

.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-mark{
  width:34px;height:34px;display:block;border-radius:9px;flex:none;
  box-shadow:0 1px 2px rgba(22,25,27,.12),0 3px 10px rgba(22,25,27,.08);
}
.brand-name{
  font-size:19px;font-weight:700;letter-spacing:-.015em;line-height:1;
  /* Latin wordmark, in both languages — "Simio" is not transliterated. */
}

/* ------------------------------------------------------- language selector */

.lang{
  margin-left:auto;
  display:flex;
  gap:2px;
  padding:3px;
  background:var(--panel);
  border:1px solid var(--rule);
  border-radius:999px;
  flex:none;
}
.lang a{
  display:block;
  padding:5px 14px;
  border-radius:999px;
  font-size:13px;
  font-weight:600;
  line-height:1.4;
  letter-spacing:.01em;
  color:var(--muted);
  text-decoration:none;
  white-space:nowrap;
  transition:background-color .15s ease,color .15s ease;
}
.lang a:hover{color:var(--brand);background:var(--brand-tint)}
.lang a[aria-current]{
  background:var(--brand);
  color:#fff;
  box-shadow:0 1px 2px rgba(255,95,47,.30);
}
.lang a[aria-current]:hover{background:var(--brand);color:#fff}

/* ------------------------------------------------------------------ layout */

.wrap{max-width:var(--measure);margin:0 auto;padding:40px 22px 88px}

/* Document switcher — Terms <-> Privacy, within the current language. */
.docs{
  display:flex;
  gap:24px;
  flex-wrap:wrap;
  padding-bottom:14px;
  border-bottom:1px solid var(--rule);
  margin-bottom:38px;
}
.docs a{
  font-size:14px;
  font-weight:600;
  color:var(--muted);
  text-decoration:none;
  padding-bottom:14px;
  margin-bottom:-15px;
  border-bottom:2px solid transparent;
}
.docs a:hover{color:var(--fg)}
.docs a[aria-current]{color:var(--fg);border-bottom-color:var(--brand)}

/* -------------------------------------------------------------- typography */

h1{
  margin:0 0 8px;
  font-size:34px;
  line-height:1.2;
  letter-spacing:-.022em;
  font-weight:700;
}
html[lang='ka'] h1{letter-spacing:-.005em;line-height:1.3}

.updated{margin:0 0 30px;color:var(--muted);font-size:14px}

h2{
  margin:44px 0 14px;
  font-size:21px;
  line-height:1.35;
  letter-spacing:-.012em;
  font-weight:700;
  scroll-margin-top:84px;
}
html[lang='ka'] h2{letter-spacing:0;line-height:1.45}

h3{
  margin:28px 0 10px;
  font-size:16px;
  font-weight:600;
  letter-spacing:-.005em;
  scroll-margin-top:84px;
}
html[lang='ka'] h3{letter-spacing:0}

p{margin:0 0 15px}
strong,b{font-weight:600}
em{font-style:italic}

a{
  color:var(--fg);
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-thickness:1px;
  text-decoration-color:var(--rule);
}
a:hover{color:var(--brand);text-decoration-color:var(--brand)}

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

ul,ol{margin:0 0 15px;padding-left:22px}
li{margin:8px 0}
li>ul,li>ol{margin:8px 0 4px}
ul{list-style:none;padding-left:0}
ul li{position:relative;padding-left:20px}
ul li::before{
  content:'';
  position:absolute;
  left:4px;
  top:.72em;
  width:5px;height:5px;
  border-radius:50%;
  background:var(--bullet);
}

hr{border:0;border-top:1px solid var(--rule);margin:44px 0}

/* Framed asides, privacy policy only — the payment-card note and the
   no-traffic-monitoring note. The frame carries the brand colour; the text
   inside it stays neutral, same as everywhere else on the page. */
.callout{
  margin:12px 0 4px;
  padding:14px 18px;
  background:var(--brand-tint);
  border:1px solid #ffd8c9;
  border-left:3px solid var(--brand);
  border-radius:0 8px 8px 0;
}
.callout p{margin:0}

/* Numbered clauses (3.10.1, 4.2, …). The numbers are written out rather than
   generated, because they are cited verbatim — in this document, in support
   replies and by the payment provider — and must survive copy-paste.
   A clause carries its own number, so it drops the bullet dot; a list can mix
   numbered and unnumbered items, exactly as the source text does. */
ul li:has(> .cl:first-child){padding-left:0}
ul li:has(> .cl:first-child)::before{display:none}
.cl{
  color:var(--fg);
  font-weight:600;
  font-variant-numeric:tabular-nums;
  margin-right:.25em;
}

/* ------------------------------------------------------------ small screens */

@media (max-width:600px){
  body{font-size:16px}
  .masthead-inner{padding:11px 18px}
  .brand-mark{width:30px;height:30px;border-radius:8px}
  .brand-name{font-size:17px}
  .wrap{padding:28px 18px 64px}
  h1{font-size:27px}
  h2{font-size:19px;margin-top:36px}
  .docs{gap:18px}
}

/* -------------------------------------------------------------------- print */

@media print{
  .masthead,.docs{display:none}
  body{font-size:11pt;line-height:1.5}
  .wrap{max-width:none;padding:0}
  a{text-decoration:none;color:inherit}
  h2,h3{page-break-after:avoid}
  li,p{page-break-inside:avoid}
}
