/* style.css */
html, body {  height: 100%;  margin: 0; color: #4169E1;}
body {  background: #181818;  position: relative;}
.hero {  position: absolute;  left: 50%;  top: 50%;  transform: translate(-50%, -50%);  height: 70vh;  width: auto;  display: block;  opacity: 0.90; /* semi transparent (0=transparent, 1=opaque) */}
.num {  position: absolute;  left: 50%;  top: 60vh; /* 2/3 down */  transform: translateX(-50%);  height: 10vh;  line-height: 10vh;  font-size: 16vh;  color: #4169E1;  text-align: center;}

.rubik-distressed-regular {
  font-family: "Rubik Distressed", system-ui;
  font-weight: 400;
  font-style: normal;
}
.headline {  position: absolute;  z-index: 100; top: 3vh;  left: 50%;  transform: translateX(-50%);  margin: 0;
  text-align: center; text-transform:uppercase;
  font-size: clamp(3rem, 5vw, 5rem);  line-height: 1.2;  font-weight: 600;}
/* clamp(1.25rem, 3vw, 2.25rem);*/