/*
 * New Relic theme.
 *
 * Use it:
 *   JOB_BOARD_PROVIDER=greenhouse
 *   NEXT_PUBLIC_TENANT_ID=newrelic
 *   TENANT_ID=newrelic
 *   GREENHOUSE_BOARD_TOKEN=newrelic
 *   NEXT_PUBLIC_COMPANY_NAME=New Relic
 *   NEXT_PUBLIC_THEME_CSS=/themes/newrelic.css
 *   NEXT_PUBLIC_LOGO_URL=https://newrelic.com/themes/custom/erno/logo.svg
 */

:root {
  --brand-navy: #080f11;
  --brand-blue: #1ce783;
  --brand-mist: #f1f0e4;
  --brand-ink: #080f11;
  --brand-font: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    Helvetica, Arial, sans-serif;
  --nr-black: #080f11;
  --nr-charcoal: #151b20;
  --nr-midnight: #1d252c;
  --nr-green: #1ce783;
  --nr-green-dark: #00ac69;
  --nr-pearl: #fdfcf0;
  --nr-sand: #e5e4d8;
  --nr-ivory: #f1f0e4;
  --nr-gray: #6a6f74;
  --nr-line: #e4e5e6;
  --nr-purple: #853275;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--nr-pearl);
  color: var(--nr-black);
  font-family: var(--brand-font);
}

body > div > header {
  border-bottom: 1px solid rgba(241, 240, 228, 0.14) !important;
  background: var(--nr-black) !important;
  color: var(--nr-ivory) !important;
}

body > div > header > div {
  height: 76px !important;
  max-width: 1280px !important;
  padding-right: 24px !important;
  padding-left: 24px !important;
}

body > div > header img {
  width: 171px;
  max-width: 171px;
  height: auto !important;
  object-fit: contain;
}

body > div > header > div > a:first-child > span {
  display: none !important;
}

body > div > header nav a,
body > div > header > div > div a {
  color: var(--nr-ivory) !important;
  text-decoration: none;
}

body > div > header nav a {
  opacity: 0.84;
  transition: color 0.2s ease, opacity 0.2s ease;
}

body > div > header nav a:hover {
  color: var(--nr-green) !important;
  opacity: 1;
}

body > div > header > div > div a:last-child {
  color: var(--nr-black) !important;
}

body > div > header > div > div a:last-child:hover {
  background: var(--nr-sand) !important;
}

main > section:first-child {
  position: relative;
  overflow: hidden;
  min-height: 560px;
  border-bottom: 0 !important;
  background:
    linear-gradient(
      280.81deg,
      rgba(133, 50, 117, 0.86) -7.92%,
      rgba(67, 39, 59, 0.94) 25.65%,
      rgba(44, 38, 50, 0.97) 62.09%,
      #1d252c 107.56%
    ),
    var(--nr-black) !important;
  color: var(--nr-ivory) !important;
}

main > section:first-child::after {
  content: '';
  position: absolute;
  inset: 0 0 0 auto;
  width: 48%;
  background:
    linear-gradient(90deg, rgba(29, 37, 44, 0.62), rgba(29, 37, 44, 0.06)),
    url('https://newrelic.com/sites/default/files/styles/1920w/public/2024-12/hero.webp?itok=w3IjTgjS')
      center center / cover no-repeat;
}

main > section:first-child::before {
  content: '';
  position: absolute;
  right: 46%;
  bottom: 68px;
  width: 138px;
  height: 138px;
  border: 1px solid rgba(241, 240, 228, 0.18);
  background:
    linear-gradient(120deg, rgba(28, 231, 131, 0.26), transparent),
    rgba(241, 240, 228, 0.045);
  transform: rotate(30deg);
}

main > section:first-child > div {
  position: relative;
  z-index: 1;
  max-width: 1280px !important;
  padding-top: 118px !important;
  padding-bottom: 118px !important;
}

main > section:first-child p:first-child {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border: 1px solid rgba(241, 240, 228, 0.2);
  border-radius: 999px;
  background: rgba(241, 240, 228, 0.08);
  padding: 8px 12px;
  color: var(--nr-green) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

main > section:first-child h1 {
  max-width: 620px !important;
  color: var(--nr-ivory) !important;
  font-size: clamp(2.75rem, 2.1rem + 3.2vw, 5.4rem) !important;
  font-weight: 650 !important;
  line-height: 0.98 !important;
  letter-spacing: 0 !important;
}

main > section:first-child p:last-of-type {
  max-width: 570px !important;
  color: rgba(241, 240, 228, 0.86) !important;
  font-size: 1.125rem !important;
  line-height: 1.6 !important;
}

main > section:first-child a[href='#open-positions'] {
  margin-top: 28px !important;
  border: 0 !important;
  border-radius: 36px !important;
  background: var(--nr-green) !important;
  padding: 18px 30px !important;
  color: var(--nr-black) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

main > section:first-child a[href='#open-positions']:hover {
  background: var(--nr-ivory) !important;
  transform: translateY(-1px);
}

body > div > main > div:first-of-type {
  max-width: 1280px !important;
  padding-top: 76px !important;
  padding-bottom: 84px !important;
}

main > div > p:first-child {
  margin-bottom: 32px !important;
  color: var(--nr-gray) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
}

main > div > div[class*='space-y-'] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 34px 42px;
}

main > div > div[class*='space-y-'] > div {
  min-width: 0;
}

main > div > div[class*='space-y-'] h2 {
  margin-bottom: 0 !important;
  border-bottom: 1px solid var(--nr-line);
  padding: 0 0 16px !important;
  color: var(--nr-gray) !important;
  font-size: 0.77rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
}

main > div > div[class*='space-y-'] ul {
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent;
}

main > div > div[class*='space-y-'] li {
  border-bottom: 1px solid var(--nr-line);
}

main > div > div[class*='space-y-'] li + li {
  border-top: 0 !important;
}

main > div > div[class*='space-y-'] li a {
  min-height: 108px;
  padding: 22px 0 !important;
  color: var(--nr-black);
}

main > div > div[class*='space-y-'] li a:hover {
  background: transparent !important;
}

main > div > div[class*='space-y-'] li p:first-child {
  color: var(--nr-black) !important;
  font-size: clamp(1.18rem, 1rem + 0.65vw, 1.6rem);
  font-weight: 500 !important;
  line-height: 1.2;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

main > div > div[class*='space-y-'] li a:hover p:first-child {
  text-decoration: underline;
}

main > div > div[class*='space-y-'] li p:last-child {
  color: var(--nr-gray) !important;
  font-size: 0.92rem !important;
  line-height: 1.45;
}

main > div > div[class*='space-y-'] li span {
  border-radius: 999px;
  background: rgba(28, 231, 131, 0.16);
  padding: 8px 12px;
  color: var(--nr-black) !important;
  font-size: 0.87rem;
  font-weight: 700;
  white-space: nowrap;
}

body > div > main > div[class*='max-w-3xl'],
body > div > main main[class*='max-w-3xl'] {
  max-width: 960px !important;
  padding-top: 56px !important;
  padding-bottom: 86px !important;
}

main > div[class*='max-w-3xl'] > a,
main main[class*='max-w-3xl'] a[href='/'] {
  color: var(--nr-gray) !important;
  font-weight: 700;
  text-decoration: none;
}

main > div[class*='max-w-3xl'] > a:hover,
main main[class*='max-w-3xl'] a[href='/']:hover {
  color: var(--nr-black) !important;
}

main > div[class*='max-w-3xl'] > header {
  border-bottom: 1px solid var(--nr-line) !important;
}

main > div[class*='max-w-3xl'] > header p:first-child {
  color: var(--nr-gray) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
}

main > div[class*='max-w-3xl'] > header h1 {
  max-width: 850px;
  color: var(--nr-black) !important;
  font-size: clamp(2rem, 1.5rem + 2vw, 3.75rem) !important;
  font-weight: 620 !important;
  line-height: 1.06 !important;
  letter-spacing: 0 !important;
}

main > div[class*='max-w-3xl'] > header p {
  color: var(--nr-gray) !important;
}

main > div[class*='max-w-3xl'] > header div {
  border-color: rgba(28, 231, 131, 0.28) !important;
  background: rgba(28, 231, 131, 0.12) !important;
  color: var(--nr-black) !important;
}

main > div[class*='max-w-3xl'] > header span {
  background: var(--nr-green) !important;
}

.gh-content {
  color: var(--nr-midnight) !important;
  font-size: 1rem !important;
  line-height: 1.72 !important;
}

.gh-content h1,
.gh-content h2,
.gh-content h3,
.gh-content h4,
.gh-content h5,
.gh-content h6 {
  color: var(--nr-black) !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

.gh-content strong {
  color: var(--nr-black);
  font-weight: 700;
}

.gh-content a {
  color: var(--nr-green-dark) !important;
  overflow-wrap: anywhere;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.content-pay-transparency,
.pay-input {
  border-radius: 4px;
  background: var(--nr-ivory);
  padding: 20px;
}

.pay-input .title {
  margin-top: 18px;
  color: var(--nr-gray);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.pay-input .pay-range {
  margin-top: 6px;
  color: var(--nr-black);
  font-size: 1.35rem;
  font-weight: 650;
}

main > div[class*='max-w-3xl'] > section#apply {
  scroll-margin-top: 96px;
  border: 1px solid var(--nr-line) !important;
  border-radius: 8px;
  background: #ffffff;
  padding: 34px !important;
}

main > div[class*='max-w-3xl'] > section#apply h2 {
  color: var(--nr-black) !important;
  font-size: 1.7rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

main > div[class*='max-w-3xl'] > section#apply > p {
  color: var(--nr-gray) !important;
  font-size: 0.95rem !important;
  line-height: 1.6 !important;
}

label {
  color: var(--nr-black) !important;
  font-weight: 650 !important;
}

input,
textarea,
select {
  border-color: #d4d7d9 !important;
  border-radius: 4px !important;
  color: var(--nr-black) !important;
  font-family: var(--brand-font);
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--nr-green-dark) !important;
  box-shadow: 0 0 0 3px rgba(28, 231, 131, 0.18) !important;
}

button[type='submit'] {
  border-radius: 36px !important;
  background: var(--nr-black) !important;
  padding: 16px 28px !important;
  color: var(--nr-ivory) !important;
  font-weight: 700 !important;
}

button[type='submit']:hover {
  background: var(--nr-green) !important;
  color: var(--nr-black) !important;
}

details summary {
  color: var(--nr-black) !important;
}

body > div > footer {
  margin-top: 0 !important;
  border-top: 0 !important;
  background: var(--nr-black) !important;
}

body > div > footer p,
body > div > footer a {
  color: var(--nr-ivory) !important;
}

body > div > footer svg {
  color: var(--nr-green) !important;
}

@media (max-width: 1024px) {
  main > section:first-child::after {
    opacity: 0.38;
    width: 54%;
  }

  main > section:first-child > div {
    padding-top: 92px !important;
    padding-bottom: 96px !important;
  }

  main > div > div[class*='space-y-'] {
    grid-template-columns: 1fr;
    gap: 34px;
  }
}

@media (max-width: 720px) {
  body > div > header > div {
    height: 68px !important;
  }

  body > div > header img {
    width: 146px;
    max-width: 146px;
  }

  main > section:first-child {
    min-height: auto;
  }

  main > section:first-child::before {
    display: none;
  }

  main > section:first-child::after {
    inset: auto 0 0 0;
    width: 100%;
    height: 180px;
    opacity: 0.46;
  }

  main > section:first-child > div {
    padding: 70px 24px 220px !important;
  }

  main > section:first-child h1 {
    max-width: 100% !important;
    font-size: 2.65rem !important;
    line-height: 1.04 !important;
  }

  main > section:first-child p:last-of-type {
    max-width: 100% !important;
    font-size: 1rem !important;
  }

  main > section:first-child a[href='#open-positions'] {
    width: 100%;
    justify-content: center;
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  body > div > main > div:first-of-type,
  body > div > main > div[class*='max-w-3xl'],
  body > div > main main[class*='max-w-3xl'] {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }

  main > div > div[class*='space-y-'] li a {
    align-items: flex-start;
    flex-direction: column;
  }

  main > div > div[class*='space-y-'] li span {
    align-self: flex-start;
  }

  main > div[class*='max-w-3xl'] > section#apply {
    padding: 24px !important;
  }
}
