/*
 WALRIX TYPOGRAPHY PREMIUM R1
 2026-09-24
 Presentation only. No application logic.
*/

:root {
  --wrx-font-ui:
    "Segoe UI Variable Text",
    "Segoe UI",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    Arial,
    sans-serif;

  --wrx-font-display:
    "Segoe UI Variable Display",
    "Segoe UI Variable Text",
    "Segoe UI",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    Arial,
    sans-serif;

  font-family: var(--wrx-font-ui) !important;
  font-synthesis: none !important;
}

html,
body,
button,
input,
select,
textarea {
  font-family: var(--wrx-font-ui) !important;
}

body {
  font-weight: 400;
  letter-spacing: 0;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--wrx-font-display) !important;
  font-kerning: normal;
  font-synthesis: none !important;
}

.eyebrow,
.nav-label,
.news-card-top {
  font-family: var(--wrx-font-ui) !important;
  font-weight: 600 !important;
  letter-spacing: .105em !important;
}

.public-header nav,
.public-header .signin,
.public-header .language {
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

.btn {
  font-family: var(--wrx-font-ui) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

/* PUBLIC DESKTOP */
@media (min-width: 768px) {

  .hero h1 {
    max-width: 680px !important;
    font-size: clamp(2.85rem, 4vw, 4.25rem) !important;
    font-weight: 500 !important;
    line-height: 1.045 !important;
    letter-spacing: -.028em !important;
  }

  .hero p {
    max-width: 500px !important;
    font-size: 1rem !important;
    line-height: 1.68 !important;
  }

  .public-section h2 {
    max-width: 520px !important;
    font-size: clamp(1.75rem, 2.15vw, 2.2rem) !important;
    font-weight: 600 !important;
    line-height: 1.14 !important;
    letter-spacing: -.019em !important;
  }

  .steps h3 {
    font-size: .98rem !important;
    font-weight: 600 !important;
    line-height: 1.38 !important;
    letter-spacing: -.008em !important;
  }

  .steps p {
    line-height: 1.6 !important;
  }

  .news-card h3 {
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.42 !important;
    letter-spacing: -.008em !important;
  }

  .news-card p {
    font-weight: 400 !important;
    line-height: 1.62 !important;
  }

  .decision-words strong {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
  }

  .sport-link {
    font-weight: 500 !important;
  }

  .footer {
    font-size: .78rem !important;
    line-height: 1.55 !important;
  }
}

/* CABINET / ANALYTICS WORKSPACE */
.wrx-premium {
  font-family: var(--wrx-font-ui) !important;
  font-kerning: normal;
}

.wrx-premium h1,
.wrx-premium h2,
.wrx-premium h3,
.wrx-premium strong {
  font-family: var(--wrx-font-display) !important;
}

.wrx-premium .sidebar nav a,
.wrx-premium .topbar,
.wrx-premium .tabs > a,
.wrx-premium .tabs > button,
.wrx-premium .section-link,
.wrx-premium .row-action {
  letter-spacing: 0 !important;
}

.wrx-premium .section-top h2 {
  font-weight: 600 !important;
  letter-spacing: -.008em !important;
  line-height: 1.3 !important;
}

.wrx-premium .teams strong,
.wrx-premium .run-list strong,
.wrx-premium .account-lines strong {
  font-weight: 600 !important;
  letter-spacing: -.006em !important;
}

.wrx-premium .wrx-metric strong,
.wrx-premium .metrics strong,
.wrx-premium .kpi strong,
.wrx-premium .selected-odds strong {
  font-weight: 500 !important;
  letter-spacing: -.015em !important;
  font-variant-numeric: tabular-nums;
}

.wrx-premium p,
.wrx-premium .muted {
  line-height: 1.6;
}

@media (min-width: 768px) {

  .wrx-premium .pagehead h1 {
    font-size: clamp(1.7rem, 1.9vw, 1.95rem) !important;
    font-weight: 600 !important;
    line-height: 1.13 !important;
    letter-spacing: -.018em !important;
  }

  .wrx-premium .wrx-match-heading h1,
  .wrx-premium .match-heading h1 {
    font-size: clamp(1.6rem, 1.8vw, 1.85rem) !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: -.016em !important;
  }

  .wrx-premium .decision-title h2,
  .wrx-premium .wrx-verdict h2 {
    font-weight: 600 !important;
    letter-spacing: -.012em !important;
  }
}

/* Keep mobile sizing intact, only improve the font rendering. */
@media (max-width: 767px) {
  .hero h1 {
    letter-spacing: -.03em !important;
    font-weight: 500 !important;
  }

  .public-section h2,
  .wrx-premium .pagehead h1,
  .wrx-premium .wrx-match-heading h1 {
    letter-spacing: -.016em !important;
    font-weight: 600 !important;
  }
}