* {
  font-family: 'Rubik', Helvetica, Arial, sans-serif;
}
html {
  --color-spike: #c01b05;
  --color-black: #000;
  --color-white: #fff;
}
body {
  margin: 0.8in 0.65in;
  --z: 1;
}
/*
main {
  max-width: 800px;
}
*/
@media print {
  body {
    margin: 0;
  }
  @page {
    size: letter;
    margin: 0.8in 0.65in;
  }
}
h1 {
  font-size: calc(var(--z) * 24pt);
  font-weight: 500;
  margin: 0;
}
h2 {
  font-size: calc(var(--z) * 13pt);
  margin: calc(var(--z) * 36pt) 0 calc(var(--z) * 6pt);
}
h2 em {
  text-transform: uppercase;
  font-weight: 100;
  border-bottom: 1px solid #ddd;
  font-style: normal;
}
h3,
strong {
  font-weight: 500;
}
a {
  color: var(--color-hbg);
  font-weight: 500;
  text-decoration: underline;
  text-decoration-style: dotted;
}
p {
  margin: 0;
  font-size: calc(var(--z) * 11pt);
}
ul {
  margin: calc(var(--z) * 9pt) 0;
  padding-left: calc(var(--z) * 32pt);
}
li {
  font-size: calc(var(--z) * 10pt);
  margin: calc(var(--z) * 9pt) 0;
  font-weight: 300;
}
#header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-bottom: calc(var(--z) * 6pt);
  border-bottom: 1px solid #d8d8d8;
}
#address,
#email p {
  font-size: calc(var(--z) * 8pt);
  text-align: right;
}
#headline {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: calc(var(--z) * 6pt);
}
#headline p:nth-of-type(1) {
  font-size: calc(var(--z) * 16pt);
  flex: 2;
}
#headline p:nth-of-type(2) {
  font-size: calc(var(--z) * 10pt);
  font-style: italic;
  flex: 3;
  text-align: right;
}
#education h3 {
  font-weight: normal;
}
#education,
.experience-block {
  break-inside: avoid-page;
  margin-bottom: calc(var(--z) * 36pt);
}
.experience {
  display: grid;
  margin: calc(var(--z) * 9pt) 0;
  column-gap: calc(var(--z) * 8pt);
}
.experience h3 {
  grid-column: 1;
  grid-row: 1;
  font-size: calc(var(--z) * 11pt);
  margin: 0;
}
.experience p:nth-of-type(1) {
  grid-column: 1;
  grid-row: 2;
}
.experience p:nth-of-type(2) {
  grid-column: 2;
  grid-row: 1;
  text-align: right;
}
.technologies {
  font-style: italic;
  font-size: calc(var(--z) * 10pt);
  padding-left: calc(var(--z) * 16pt);
  font-weight: 300;
  display: block;
}
.technologies em {
  font-weight: 400;
}
.links {
  display: none;
}
@media screen {
  html {
    background-color: var(--color-black);
  }
  body {
    --z: 1.1;
    margin: 0;
  }
  section {
    display: flex;
    justify-content: center;
    padding: 0.4in 0.65in;
    color: var(--color-text);
  }
  section:first-child {
    background-color: var(--color-black);
    --color-text: var(--color-white);
    --color-hbg: var(--color-spike);
    padding-top: 0.8in;
  }
  section:nth-child(2) {
    background-color: var(--color-white);
    --color-text: var(--color-black);
    --color-hbg: var(--color-spike);
  }
  section:last-child {
    background-color: var(--color-spike);
    --color-text: var(--color-white);
    --color-hbg: var(--color-black);
    padding-bottom: 0.8in;
  }
  section > div {
    width: 100%;
    max-width: calc(1200px - 2 * 0.65in);
  }
  #header {
    border-bottom: 0 none;
  }
  h1 {
    background-color: var(--color-hbg);
    box-shadow: 0 0 0 calc(var(--z) * 6pt) var(--color-hbg);
  }
  h2 {
    font-size: calc(var(--z) * 16pt);
    margin: calc(var(--z) * 36pt) 0 calc(var(--z) * 24pt);
  }
  h2 em {
    background-color: var(--color-hbg);
    box-shadow: 0 0 0 calc(var(--z) * 4pt) var(--color-hbg);
    border-bottom: 0 none;
    text-transform: none;
    font-weight: 600;
  }
  #education {
    background: none;
    position: static;
  }
  #education,
  .experience-block {
    break-inside: avoid-page;
    margin-bottom: calc(var(--z) * 48pt);
  }
  .experience {
    margin: 0 calc(var(--z) * -12pt);
    padding: calc(var(--z) * 6pt) calc(var(--z) * 12pt);
    position: sticky;
    top: 0;
    background-color: white;
  }
  .experience + p {
    margin-top: calc(var(--z) * 15pt);
  }
  ul {
    margin: calc(var(--z) * 15pt) 0;
  }
  .links {
    display: flex;
    margin: calc(var(--z)* 48pt) 0;
    flex-direction: column;
    gap: calc(var(--z)* 8pt);
  }
  .links > a {
    font-size: calc(var(--z) * 11pt);
    color: var(--color-text);
  }
  .links > a::after {
    content: '>';
    display: inline-block;
    font-weight: 500;
    margin-left: calc(var(--z) * 4pt);
  }
}
@media screen and (max-width: 575.98px) {
  body {
    --z: 1.2;
  }
  section {
    padding: 16px 26px;
  }
  section:first-child {
    padding-top: 32px;
  }
  section:last-child {
    padding-bottom: 32px;
  }
  #headline {
    flex-direction: column;
    gap: 24pt;
  }
  #headline p:nth-of-type(2) {
    text-align: unset;
  }
  #education h3 strong {
    display: block;
  }
  #education h3 .comma {
    display: none;
  }
  .experience p:nth-of-type(2) {
    grid-column: 1;
    grid-row: 3;
    font-weight: 100;
    opacity: 0.8;
    text-align: unset;
  }
  ul {
    padding-left: 12pt;
  }
  li {
    font-weight: 100;
  }
  .technologies {
    padding-left: 0;
  }
}
@media screen and (min-width: 800px) {
  body {
    --z: 1.2;
  }
}
@media screen and (min-width: 992px) {
  body {
    --z: 1.4;
  }
}