/* RITEKO design tokens — unified system, 2026-08-18. */
:root {
  --riteko-color-red: #e30613;
  --riteko-color-red-dark: #b40510;
  --riteko-color-navy: #1f4d6e;
  --riteko-color-catalog: #1f4d6e;
  --riteko-color-text: #333333;
  --riteko-color-muted: #6b7a85;
  --riteko-color-border: #e3e9ed;
  --riteko-color-surface: #ffffff;
  --riteko-color-soft: #f4f7f9;
  --riteko-color-hero: #1f4d6e;
  --riteko-color-focus: #e30613;

  --riteko-font-family: "Open Sans", Arial, sans-serif;
  --riteko-font-size-body: 16px;
  --riteko-line-height-body: 1.75;
  --riteko-font-size-h1: clamp(28px, 3.15vw, 40px);
  --riteko-font-size-h2: clamp(24px, 2.25vw, 28px);
  --riteko-font-size-h3: clamp(20px, 1.75vw, 24px);
  --riteko-font-size-h4: 18px;
  --riteko-line-height-heading: 1.2;

  --riteko-space-1: 4px;
  --riteko-space-2: 8px;
  --riteko-space-3: 12px;
  --riteko-space-4: 16px;
  --riteko-space-5: 20px;
  --riteko-space-6: 24px;
  --riteko-space-7: 32px;
  --riteko-space-8: 40px;
  --riteko-space-9: 48px;
  --riteko-space-10: 80px;

  --riteko-radius: 16px;
  --riteko-radius-small: 12px;
  --riteko-radius-pill: 999px;
  --riteko-shadow-card: 0 8px 24px rgba(31, 77, 110, 0.08);
  --riteko-shadow-hover: 0 12px 28px rgba(31, 77, 110, 0.14);
  --riteko-container: 1240px;
  --riteko-container-wide: 1600px;
}

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

.riteko-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 12px;
  color: var(--riteko-color-red);
  background: rgba(227, 6, 19, .08);
  border-radius: var(--riteko-radius-pill);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.riteko-button-primary,
.riteko-button-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 14px 28px;
  border-radius: 12px;
  font: 700 14px/1.2 var(--riteko-font-family);
  text-decoration: none;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.riteko-button-primary { color: #fff; background: var(--riteko-color-red); border: 1px solid var(--riteko-color-red); }
.riteko-button-primary:hover, .riteko-button-primary:focus-visible { color: #fff; background: var(--riteko-color-red-dark); border-color: var(--riteko-color-red-dark); }
.riteko-button-ghost { color: var(--riteko-color-navy); background: transparent; border: 1px solid currentColor; }
.riteko-button-ghost:hover, .riteko-button-ghost:focus-visible { color: var(--riteko-color-red); }

.riteko-card { background: var(--riteko-color-surface); border: 1px solid var(--riteko-color-border); border-radius: var(--riteko-radius); box-shadow: var(--riteko-shadow-card); }
.riteko-section-title { margin: 0 0 var(--riteko-space-5); color: var(--riteko-color-text); font: 700 var(--riteko-font-size-h2)/1.285 var(--riteko-font-family); }

.riteko-table { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border: 1px solid var(--riteko-color-border); border-radius: var(--riteko-radius); }
.riteko-table th, .riteko-table td { padding: 12px 14px; border-bottom: 1px solid var(--riteko-color-border); }
.riteko-table th { color: #fff; background: var(--riteko-color-navy); font-weight: 700; }
.riteko-table tr:last-child td { border-bottom: 0; }

.riteko-breadcrumbs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 var(--riteko-space-4); color: var(--riteko-color-muted); font-size: 13px; line-height: 20px; }
.riteko-breadcrumbs a { color: inherit; text-decoration: none; }
.riteko-breadcrumbs a:hover, .riteko-breadcrumbs a:focus-visible { color: var(--riteko-color-red); }

:where(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--riteko-color-focus); outline-offset: 2px; }

@media (max-width: 767px) {
  .riteko-container { width: min(calc(100% - 32px), var(--riteko-container)); }
  :root { --riteko-space-10: 48px; }
}
