/* Shared typography for the main website. The /modern package is independent. */
@font-face {
  font-family: "Viserion Jost";
  src: url("fonts/jost-latin-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

body.viserion-site {
  --viserion-font: "Viserion Jost", "Jost", Arial, sans-serif;
  font-family: var(--viserion-font);
}

/* Explicit text selectors preserve the separate font families used by icon glyphs. */
body.viserion-site :is(h1, h2, h3, h4, h5, h6, p, a, button, input, textarea, select, label, summary, blockquote, li, dt, dd, figcaption),
body.viserion-site :is(.vs, .vs-card-meta, .vs-card-tag, .vs-step-number, .vs-service-nav span, .vs-proofbar strong),
body.viserion-site :is(.gdlr-core-content-font, .gdlr-core-title-font, .gdlr-core-info-font, .gdlr-core-blog-info-font, .gdlr-core-quote-font, .gdlr-core-testimonial-content),
body.viserion-site :is(.corzo-title-font, .corzo-content-font, .corzo-navigation-font, .corzo-info-font, .corzo-blog-info-font, .jost-font),
body.viserion-site :is(.service-card-title, .services-process-title, .services-metric-value, .about-stat-value, .about-side-title, .about-value-title, .about-method-title, .about-method-number, .about-presence-city, .about-trust-title) {
  font-family: var(--viserion-font) !important;
}

body.viserion-site :is(.vs-card-meta, .vs-step-number, .vs-service-nav span, .vs-proofbar strong, .about-stat-value, .about-method-number) {
  font-variant-numeric: tabular-nums;
}

/* The old condensed headings need a little more breathing room in Jost. */
body.viserion-site :is(.corzo-page-title, .gdlr-core-title-item-title) {
  letter-spacing: -.035em !important;
  line-height: 1.15;
}
body.viserion-site .about-side-title { font-size: 29px; line-height: 1.18; }
body.viserion-site :is(.about-value-title, .about-method-title) { font-size: 24px; line-height: 1.25; }
body.viserion-site .about-presence-city { font-size: 27px; }
body.viserion-site .about-trust-title { font-size: 36px; line-height: 1.2; }

.v-about-team, .v-about-team * { box-sizing: border-box; }
.v-about-team { padding: 76px 0; background: #f6f5f2; color: #202023; }
.v-about-container { width: min(1240px, calc(100% - 80px)); margin: 0 auto; }
.v-about-heading { display: flex; align-items: end; justify-content: space-between; gap: 48px; margin-bottom: 36px; }
.v-about-eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 15px; color: #bf1625; font-size: 11px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; }
.v-about-eyebrow::before { content: ""; width: 22px; height: 2px; background: currentColor; }
.v-about-team h2 { margin: 0; font-size: clamp(31px, 3.1vw, 44px); font-weight: 600; line-height: 1.15; letter-spacing: -.035em; }
.v-about-intro { max-width: 445px; margin: 0; color: #646469; font-size: 16px; line-height: 1.75; }
.v-specialists { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.v-specialist { min-width: 0; padding: 26px 24px; background: #fff; border: 1px solid #deddda; border-radius: 6px; }
.v-specialist-icon { display: flex; width: 40px; height: 40px; align-items: center; justify-content: center; margin-bottom: 24px; color: #bf1625; background: #fbf0f0; border-radius: 4px; font-size: 18px; }
.v-specialist h3 { margin: 0 0 13px; color: #202023; font-size: 22px; line-height: 1.25; font-weight: 600; letter-spacing: -.025em; }
.v-specialist p { margin: 0 0 20px; color: #646469; font-size: 14px; line-height: 1.75; }
.v-specialist a { color: #a71120; font-size: 12px; font-weight: 600; text-decoration: none; }
.v-specialist a:hover { text-decoration: underline; text-underline-offset: 4px; }
.v-specialist a:focus-visible, .v-certification:focus-visible { outline: 3px solid #bf1625; outline-offset: 5px; }
.v-certifications { margin-top: 48px; padding-top: 38px; border-top: 1px solid #deddda; }
.v-certifications h2 { font-size: 28px; }
.v-certifications-intro { margin: 10px 0 25px; color: #646469; font-size: 15px; }
.v-certifications .v-certification-group-title { margin: 30px 0 15px; color: #646469; font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.v-certification-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; list-style: none; padding: 0; margin: 0; }
.v-certification-list > li { min-width: 0; margin: 0; }
.v-certification { display: flex; align-items: center; gap: 14px; min-height: 134px; height: 100%; padding: 18px; background: #fff; border: 1px solid #deddda; border-radius: 5px; color: #202023; text-decoration: none; }
a.v-certification:hover { border-color: #b6a3a6; }
.v-certification img { width: 80px; height: 80px; object-fit: contain; flex-shrink: 0; }
.v-certification > div { min-width: 0; }
.v-certification strong { display: block; color: #202023; font-size: 15px; font-weight: 600; line-height: 1.4; }
.v-certification span { display: block; margin-top: 4px; color: #646469; font-size: 11px; line-height: 1.45; }
.v-certification small { display: block; margin-top: 7px; color: #8a3540; font-size: 10px; line-height: 1.4; }
.v-certification-list-management { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.v-specialist-training { display: flex; align-items: center; gap: 20px; margin-top: 28px; padding: 24px; background: #eee9e6; border-left: 2px solid #bf1625; border-radius: 3px; }
.v-training-icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; color: #bf1625; font-size: 24px; }
.v-specialist-training .v-training-label { margin: 0 0 5px; color: #a71120; font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.v-specialist-training h3 { margin: 0; font-size: 19px; font-weight: 600; line-height: 1.3; }
.v-specialist-training p { margin: 5px 0 0; color: #646469; font-size: 14px; }
.v-specialist-training a { margin-left: auto; padding: 10px 0; color: #a71120; font-size: 12px; font-weight: 600; white-space: nowrap; }
.v-specialist-training a:hover { text-decoration: underline; text-underline-offset: 4px; }
.v-specialist-training a:focus-visible { outline: 3px solid #bf1625; outline-offset: 4px; }
@media (min-width: 1051px) and (max-width: 1250px) {
  .v-certification-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .v-certification-list-management { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1050px) {
  .v-specialists, .v-certification-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v-about-heading { gap: 30px; align-items: start; }
  .v-about-intro { max-width: 400px; }
}
@media (max-width: 767px) {
  .v-about-team { padding: 52px 0; }
  .v-about-container { width: calc(100% - 36px); }
  .v-about-heading { display: block; }
  .v-about-intro { margin-top: 20px; max-width: none; }
  .v-specialists { gap: 14px; }
  .v-specialist { padding: 23px; }
  .v-certifications { margin-top: 34px; padding-top: 30px; }
  .v-certification { padding: 15px; gap: 12px; }
  .v-specialist-training { flex-wrap: wrap; gap: 14px; padding: 20px; }
  .v-specialist-training a { margin-left: 58px; }
  body.viserion-site .about-trust-title { font-size: 30px; }
}
@media (max-width: 480px) {
  .v-specialists, .v-certification-list { grid-template-columns: 1fr; }
  .v-specialist-icon { margin-bottom: 18px; }
  .v-certification { min-height: 86px; }
}
