/*
 * Clay theme.
 *
 * Use it:
 *   JOB_BOARD_PROVIDER=ashby
 *   NEXT_PUBLIC_TENANT_ID=clay
 *   TENANT_ID=clay
 *   ASHBY_BOARD_ID=claylabs
 *   ASHBY_APPLY_DEMO_MODE=1
 *   NEXT_PUBLIC_COMPANY_NAME=Clay
 *   NEXT_PUBLIC_THEME_CSS=/themes/clay.css
 *   NEXT_PUBLIC_LOGO_URL=https://cdn.prod.website-files.com/61477f2c24a826836f969afe/6778506d788ebf16fef48551_Clay%20primary%20logo.avif
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

:root {
  --brand-navy: #1d1d1b;
  --brand-blue: #4055f6;
  --brand-mist: #f8f4ec;
  --brand-ink: #1d1d1b;
  --brand-font: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    Helvetica, Arial, sans-serif;
  --clay-paper: #f8f4ec;
  --clay-cream: #fffaf0;
  --clay-line: #1d1d1b;
  --clay-red: #d65a31;
  --clay-blue: #4055f6;
  --clay-mint: #c8f1d0;
  --clay-lilac: #d9d4ff;
  --clay-yellow: #ffd66b;
}

body {
  background:
    linear-gradient(rgba(29, 29, 27, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(29, 29, 27, 0.055) 1px, transparent 1px),
    var(--clay-paper);
  background-size: 32px 32px;
}

header {
  border-bottom: 2px solid var(--clay-line) !important;
  background: rgba(255, 250, 240, 0.96) !important;
  color: var(--clay-line) !important;
  backdrop-filter: blur(14px);
}

header img {
  height: 38px !important;
}

header span {
  color: var(--clay-line) !important;
  letter-spacing: 0 !important;
}

header > div > a > span {
  border-left: 2px solid var(--clay-line);
  padding-left: 12px;
  font-family: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas,
    monospace;
  font-weight: 700 !important;
}

header > div > div:last-child {
  border: 2px solid var(--clay-line);
  border-radius: 999px;
  background: var(--clay-mint);
  box-shadow: 3px 3px 0 var(--clay-line);
  padding: 8px 12px;
  color: var(--clay-line) !important;
  font-weight: 700;
}

header svg {
  color: var(--clay-line) !important;
}

main > section:first-child {
  position: relative;
  overflow: clip;
  min-height: 590px;
  border-bottom: 2px solid var(--clay-line) !important;
  background:
    linear-gradient(90deg, rgba(248, 244, 236, 0.98) 0%, rgba(248, 244, 236, 0.92) 52%, rgba(248, 244, 236, 0.2) 100%),
    url('https://cdn.prod.website-files.com/61477f2c24a826836f969afe/687aaeec4172a46127930b66_clay1x1.avif')
      right center / contain no-repeat,
    var(--clay-paper) !important;
  color: var(--clay-line) !important;
}

main > section:first-child::before {
  content: '';
  position: absolute;
  right: 36px;
  bottom: 36px;
  width: 190px;
  height: 118px;
  border: 2px solid var(--clay-line);
  background:
    linear-gradient(90deg, transparent 23px, rgba(29, 29, 27, 0.16) 24px, transparent 25px),
    linear-gradient(transparent 23px, rgba(29, 29, 27, 0.16) 24px, transparent 25px),
    var(--clay-yellow);
  background-size: 24px 24px;
  box-shadow: 6px 6px 0 var(--clay-line);
}

main > section:first-child::after {
  content: '';
  position: absolute;
  right: 250px;
  top: 108px;
  width: 126px;
  height: 126px;
  border: 2px solid var(--clay-line);
  border-radius: 8px;
  background: var(--clay-lilac);
  box-shadow: 6px 6px 0 var(--clay-line);
  transform: rotate(-6deg);
}

main > section:first-child > div {
  position: relative;
  z-index: 1;
  padding-top: 112px !important;
  padding-bottom: 128px !important;
}

main > section:first-child p:first-child {
  display: inline-flex;
  align-items: center;
  border: 2px solid var(--clay-line);
  border-radius: 999px;
  background: var(--clay-mint);
  box-shadow: 3px 3px 0 var(--clay-line);
  padding: 8px 14px;
  color: var(--clay-line) !important;
  font-family: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas,
    monospace;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

main > section:first-child h1 {
  max-width: 730px !important;
  color: var(--clay-line) !important;
  font-family: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas,
    monospace;
  font-size: 56px !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
}

main > section:first-child p:last-child {
  max-width: 610px !important;
  color: #34342f !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
}

main > div {
  background: var(--clay-cream);
}

body > div > main > div:first-of-type {
  margin-top: 0;
  border-left: 2px solid var(--clay-line);
  border-right: 2px solid var(--clay-line);
}

main > div > p:first-child {
  display: inline-flex;
  border: 2px solid var(--clay-line);
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 3px 3px 0 var(--clay-line);
  padding: 8px 12px;
  color: var(--clay-line) !important;
  font-family: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas,
    monospace;
  font-weight: 700;
}

main > div > div[class*='space-y-'] h2 {
  color: var(--clay-red) !important;
  font-family: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas,
    monospace;
  letter-spacing: 0 !important;
}

main > div > div[class*='space-y-'] ul {
  border: 2px solid var(--clay-line) !important;
  border-radius: 8px !important;
  background: #ffffff;
  box-shadow: 6px 6px 0 var(--clay-line);
}

main > div > div[class*='space-y-'] li + li {
  border-color: var(--clay-line) !important;
}

main > div > div[class*='space-y-'] li a {
  background: #ffffff;
}

main > div > div[class*='space-y-'] li a:hover {
  background: var(--clay-mint) !important;
}

main > div > div[class*='space-y-'] li p:first-child {
  color: var(--clay-line) !important;
  font-weight: 800 !important;
}

main > div > div[class*='space-y-'] li p:last-child {
  color: #53534e !important;
}

main > div > div[class*='space-y-'] li span {
  border: 2px solid var(--clay-line);
  border-radius: 999px;
  background: var(--clay-blue);
  box-shadow: 3px 3px 0 var(--clay-line);
  padding: 7px 10px;
  color: #ffffff !important;
  white-space: nowrap;
}

.gh-content {
  color: #30302c !important;
}

.gh-content h1,
.gh-content h2,
.gh-content h3 {
  color: var(--clay-line) !important;
  font-family: 'Space Mono', ui-monospace, SFMono-Regular, Menlo, Consolas,
    monospace;
  letter-spacing: 0 !important;
}

.gh-content a,
main a[href='/'] {
  color: var(--clay-blue) !important;
}

button[type='submit'] {
  border: 2px solid var(--clay-line) !important;
  border-radius: 8px !important;
  background: var(--clay-blue) !important;
  box-shadow: 4px 4px 0 var(--clay-line);
  color: #ffffff !important;
  font-weight: 800 !important;
}

button[type='submit']:hover {
  opacity: 1 !important;
  transform: translate(1px, 1px);
  box-shadow: 3px 3px 0 var(--clay-line);
}

input,
textarea,
select {
  border-color: rgba(29, 29, 27, 0.32) !important;
}

footer {
  margin-top: 0 !important;
  border-top: 2px solid var(--clay-line) !important;
  background: var(--clay-line) !important;
}

footer p,
footer a {
  color: var(--clay-cream) !important;
}

footer svg {
  color: var(--clay-yellow) !important;
}

@media (max-width: 860px) {
  main > section:first-child {
    min-height: auto;
    background:
      linear-gradient(180deg, rgba(248, 244, 236, 0.98) 0%, rgba(248, 244, 236, 0.92) 60%, rgba(248, 244, 236, 0.84) 100%),
      url('https://cdn.prod.website-files.com/61477f2c24a826836f969afe/687aaeec4172a46127930b66_clay1x1.avif')
        right bottom / 260px auto no-repeat,
      var(--clay-paper) !important;
  }

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

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

  main > section:first-child h1 {
    max-width: 100% !important;
    font-size: 38px !important;
    line-height: 1.12 !important;
  }

  main > section:first-child p:last-child {
    max-width: 100% !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
  }

  body > div > main > div:first-of-type {
    border-left: 0;
    border-right: 0;
  }
}

@media (max-width: 560px) {
  header > div {
    height: 72px !important;
  }

  header img {
    max-width: 132px;
    height: 30px !important;
    object-fit: contain;
  }

  header > div > div:last-child {
    padding: 7px 9px;
    box-shadow: 2px 2px 0 var(--clay-line);
  }

  main > section:first-child {
    background:
      linear-gradient(180deg, rgba(248, 244, 236, 0.99) 0%, rgba(248, 244, 236, 0.95) 62%, rgba(248, 244, 236, 0.9) 100%),
      url('https://cdn.prod.website-files.com/61477f2c24a826836f969afe/687aaeec4172a46127930b66_clay1x1.avif')
        right bottom / 210px auto no-repeat,
      var(--clay-paper) !important;
  }

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

  main > section:first-child h1 {
    font-size: 34px !important;
  }

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

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