@font-face {
  font-family:'Plus Jakarta Sans';
  src:url('../assets/fonts/PlusJakartaSans-Regular.ttf') format('truetype');
  font-style:normal;
  font-weight:400;
  font-display:swap
}
@font-face {
  font-family:'Plus Jakarta Sans';
  src:url('../assets/fonts/PlusJakartaSans-Bold.ttf') format('truetype');
  font-style:normal;
  font-weight:700;
  font-display:swap
}
:root {
  --ink:#17191d;
  --porcelain:#f6f3ec;
  --periwinkle:#7776ff;
  --citron:#d9f564;
  --paper:#fffdf8;
  --muted:#585a5d;
  --line:#d7d4ce;
  --font:'Plus Jakarta Sans',Arial,Helvetica,sans-serif;
  --mono:'Courier New',monospace;
  --radius:24px;
  --gutter:clamp(24px,5vw,88px);
  --content:1440px;
  --ease:cubic-bezier(.2,.8,.2,1)
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:100px
}
body {
  margin:0;
  background:var(--porcelain);
  color:var(--ink);
  font-family:var(--font);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased
}
button,input,textarea,select {
  font:inherit
}
button,a,input,textarea,select {
  -webkit-tap-highlight-color:transparent
}
button,a {
  touch-action:manipulation
}
button {
  cursor:pointer
}
a {
  color:inherit
}
img,svg {
  display:block;
  max-width:100%
}
button:disabled {
  cursor:wait;
  opacity:.6
}
::selection {
  background:var(--citron);
  color:var(--ink)
}
:focus-visible {
  outline:3px solid var(--periwinkle);
  outline-offset:5px
}
h1,h2,h3,p {
  margin:0
}
h1,h2,h3 {
  font-weight:700;
  line-height:1.02;
  letter-spacing:-.055em
}
h1 {
  font-size:clamp(52px,7.5vw,116px)
}
h2 {
  font-size:clamp(40px,5.3vw,82px)
}
h3 {
  font-size:clamp(25px,2.8vw,42px)
}
p {
  max-width:65ch
}
a {
  text-underline-offset:5px
}
.container {
  max-width:var(--content);
  margin:auto;
  padding-inline:var(--gutter)
}
.eyebrow {
  font-family:var(--mono);
  font-size:12px;
  line-height:1.5;
  text-transform:uppercase;
  letter-spacing:.12em
}
.muted {
  color:var(--muted)
}
.button {
  border:1px solid var(--ink);
  background:var(--ink);
  color:var(--porcelain);
  border-radius:99px;
  min-height:48px;
  padding:13px 23px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  font-size:15px;
  font-weight:700;
  line-height:1.2;
  text-decoration:none;
  transition:background .2s,transform .2s;
  white-space:normal
}
.button:hover {
  background:#303238;
  transform:translateY(-2px)
}
.button.light {
  background:var(--porcelain);
  color:var(--ink)
}
.button.accent {
  background:var(--citron);
  color:var(--ink);
  border-color:var(--citron)
}
.button.outline {
  background:transparent;
  color:var(--ink);
  border-color:var(--line)
}
.button.outline:hover {
  background:var(--paper)
}
.button.small {
  padding:10px 18px;
  min-height:44px
}
.arrow {
  font-size:20px;
  font-weight:400
}
.skip-link {
  position:fixed;
  left:20px;
  top:-100px;
  background:var(--citron);
  color:var(--ink);
  z-index:100;
  padding:14px 24px;
  border-radius:10px
}
.skip-link:focus {
  top:16px
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
[hidden] {
  display:none!important
}
input,textarea,select {
  max-width:100%;
  color:var(--ink);
  background:var(--paper);
  border:1px solid #92918d;
  border-radius:10px;
  padding:13px 14px
}
textarea {
  resize:vertical
}
label {
  display:block;
  font-weight:700;
  margin-bottom:8px
}
small {
  font-size:13px
}
hr {
  border:0;
  border-top:1px solid var(--line)
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
}