/* =========================
   BASE / RESET
========================= */
*{ box-sizing: border-box; }

html{
  scroll-behavior: smooth;
  color-scheme: light; /* фикс: iOS/Safari системные контролы в light */
}

body{
  margin:0;
  font-family: var(--font-sans);
  color: var(--text);
  line-height: 1.55;

  /* fallback, чтобы не “просвечивал” темный фон */
  background-color: var(--bg);

  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(94,234,212,0.22), transparent 55%),
    radial-gradient(900px 500px at 90% 10%, rgba(59,130,246,0.18), transparent 55%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}

a{ color: inherit; text-decoration: none; }
a:hover{ opacity: 0.92; }
img{ max-width:100%; display:block; }

.container{
  width: min(var(--container), calc(100% - 32px));
  margin: 0 auto;
}

.skip-link{
  position:absolute; left:-9999px; top:auto;
  width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  left:16px; top:16px; width:auto; height:auto;
  background: var(--bg2);
  border: 1px solid var(--border);
  padding:10px 12px;
  border-radius: 10px;
  z-index: 9999;
}

/* =========================
   TYPOGRAPHY / UTILITIES
========================= */
h1, h2{ font-family: var(--font-display); }
h1{ font-weight: 800; letter-spacing: -0.035em; }
h2{ font-weight: 700; letter-spacing: -0.02em; }
h3{ margin: 0 0 6px; font-size: 16px; letter-spacing: -0.01em; }

p{ margin: 0 0 10px; }
.muted{ color: var(--muted); }
.fineprint{
  font-size: 12px;
  color: var(--muted2);
  margin: 10px 0 0;
}