/* Rarog (site-local minimal bundle) — Core */
:root { color-scheme: dark; }
*,*::before,*::after { box-sizing: border-box; }
html,body { height: 100%; }
body {
  margin: 0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
:focus-visible { outline: 2px solid var(--rg-ring); outline-offset: 3px; border-radius: 10px; }

.rg-container-lg { width: min(1120px, calc(100% - 2rem)); margin-inline: auto; }
.rg-section { padding: 4.5rem 0; }
.rg-section--alt { background: var(--rg-surface-2); }
.rg-section__head { margin-bottom: 1.5rem; }
.rg-divider { height: 1px; background: var(--rg-border); width: 100%; }

.rg-h1 { font-size: clamp(2.2rem, 3.4vw, 3.25rem); line-height: 1.06; margin: 0; letter-spacing: -0.02em; }
.rg-h2 { font-size: clamp(1.6rem, 2.2vw, 2.05rem); line-height: 1.15; margin: 0; letter-spacing: -0.01em; }
.rg-h3 { font-size: 1.2rem; margin: 0 0 .35rem; letter-spacing: -0.01em; }
.rg-lead { font-size: 1.05rem; color: var(--rg-text-2); margin: .9rem 0 0; max-width: 62ch; }
.rg-kicker { font-size: .9rem; color: var(--rg-text-2); letter-spacing: .14em; text-transform: uppercase; }

.rg-muted { color: var(--rg-text-2); }
.rg-text-sm { font-size: .92rem; }
.rg-mb-0 { margin-bottom: 0 !important; }
.rg-mt-2 { margin-top: .5rem !important; }
.rg-mt-3 { margin-top: .9rem !important; }
.rg-mt-4 { margin-top: 1.1rem !important; }
.rg-mt-5 { margin-top: 1.35rem !important; }
.rg-mt-6 { margin-top: 1.8rem !important; }

.rg-row { display: flex; align-items: center; }
.rg-row--wrap { flex-wrap: wrap; }
.rg-row--between { justify-content: space-between; }
.rg-row--center { align-items: center; }
.rg-center { display: grid; place-items: center; text-align: center; }

.rg-grid { display: grid; }
.rg-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rg-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 900px) {
  .rg-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .rg-grid--2, .rg-grid--3 { grid-template-columns: 1fr; }
  .rg-section { padding: 3.6rem 0; }
}
