@font-face {
    font-family: "Ronzino";
    src:
        url('../../static/font/Ronzino-Regular.woff2') format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Heal the Web A";
    src:
        url('../../static/font/HealTheWebA-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

* {
    font-family: "Ronzino", Arial, Helvetica, sans-serif;
}

:root {
    --bg: #fbf8f7;
    --ink: #090808;
    --ink-secondary: #343333;
    --line: #d7d6d5;
    --muted: #8c8a89;
}

html {
  font-size: 1.2rem;
  color: var(--ink);
  background-color: var(--bg);
}

.vital-grid {
  display: flex;
  flex-direction: column;
  max-width: 100%;
  margin: auto;
}

.line {
  display: flex;
  gap: 3rem;
  align-items: center;
  justify-content: space-between;
}

.line:not(:nth-last-of-type(1)) {
    border-bottom: 1px solid var(--line);
}

.emergency-contact .part {
  display: flex;
  gap: 3rem;
  align-items: center;
}

.emergency-contact {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

[class$="label"] {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 1rem 1rem;
}

.name {
    font-size: 50px;
    font-family: 'Heal the Web A', 'Times New Roman', Times, serif;
}