*,
*::before,
*::after {box-sizing: border-box;}

* {margin: 0;}

html {
font-size: 100%;
scroll-behavior: smooth;
}

body {
color: #111;
font-family: 'Inter Tight', sans-serif;
font-size: .9375rem;
line-height: 1.5;
min-height: 100vh;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
}

.uppercase {text-transform: uppercase;}

h1, .h1 {
font-size: 3rem;
font-weight: 700;
line-height: 1.15;
}

h2, .h2 {
font-size: 1.5rem;
font-weight: 600;
line-height: 1.15;
}

.hero {padding: 12rem 0;}

.hero-image {padding-top: 12rem;}

.item-container {
position: relative;
overflow: hidden;
}

.item-label {
color: #fff;
left: 0;
padding: 1rem;
position: absolute;
top: 0;
}

.item-label a:link,
.item-label a:visited,
.item-label a:hover,
.item-label a:active {color: #fff;}

.small {font-size: .9375rem; font-weight: 600;}

.mono {
font-family: 'Space Mono', monospace;
font-size: .9375rem;}

hr {border-color: #111;}

img, video {display: block; height: auto; width: 100%;}

table {
border-collapse: collapse;
width: 100%;
}

.bg-dark {background-color: #111;}
.bg-light {background-color: #f7f7f7;}

.bg-noise {
background-image: url('images/brand/bg-static-2.gif');
background-size: auto;
}

.grid, .grid-mobile {
display: grid;
grid-template-columns: repeat(12,1fr);
grid-template-rows: 1fr;
grid-column-gap: 1rem;
grid-row-gap: 0;
}

@media (max-width: 768px) {
.grid {display: block;}
h1, .h1 {font-size: 2rem;}
h2, .h2 {font-size: 1.125rem;}
.hero {padding: 10rem 0;}
.measure {width: 85%;}
}

.mw {max-width: 54rem;}


.mb-1 {margin-bottom: 1rem;}
.mb-2 {margin-bottom: 2rem;}
.mb-4 {margin-bottom: 4rem;}
.mb-8 {margin-bottom: 8rem;}



.p-2 {padding: 2rem;}
.p-4 {padding: 4rem;}

.center {margin-left: auto; margin-right: auto;}

.container {padding: 0 1rem;}

.rounded {
border-radius: 1rem;
overflow: hidden;
}

.text-center {text-align: center;}

nav, footer {
font-size: .9375rem;
font-weight: 600;
line-height: 1;
padding: 1.5rem 0;
}

.logo {
display: inline-block;
margin-left: 1rem;
}

.logo a:hover {
color: #666;
transition: .5s;
}

a:link,
a:visited,
a:hover,
a:active {
color: #111;
text-decoration: none;
}

p a:link {text-decoration: underline;}

.menu {
display: inline-block;
float: right;
}

.menu li {
display: inline;
margin-right: 1rem;
}

.menu-item a {
  position: relative;
}

.menu-item a::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: .125rem;
  bottom: -.125rem;
  left: 0;
  background-color: #111;
  transform: scaleX(0);
  transform-origin: top left;
  transition: transform .5s ease;
}

.menu-item a:hover::before {
  transform: scaleX(1);
}

footer {border-top: .125rem solid #111;}

.btn {
background-color: #fff;
border: .125rem solid #111;
border-radius: 3rem;
color: #111;
padding: .75rem 3rem;
}

.btn:hover {
background-color: #111;
color: #fff;
transition: background-color .75s ease;
}

.zoom {transition: transform .6s ease;}
.zoom:hover {transform: scale(1.1);}