:root {
  --color--121212: #121212;
  --color--ffffff: #fff;
  --font-size--12pt: 12px;
  --font-size--16px: 16px;
  --font-size--14px: 14px;
  --color--666: #666;
  --color--efef1e: #efef1e;
  --white\<deleted\|variable-e139747e\>: white;
  --color--1010e1: #1010e1;
  --color--333: #333;
  --font-size--22pt: 22px;
  --font-size--32pt: 32px;
  --color--146ef5: #146ef5;
  --font--red-rose: "Red Rose", sans-serif;
}

body {
  background-color: var(--color--121212);
  color: var(--color--ffffff);
  font-family: Red Rose, sans-serif;
  font-size: var(--font-size--12pt);
  font-weight: 300;
  line-height: 20px;
}

h1 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 9.4vw;
  font-weight: 700;
  line-height: 7.2vw;
}

h3 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 4vw;
  font-weight: 700;
  line-height: 4vw;
}

h4 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 48px;
  font-weight: 700;
  line-height: 46px;
}

h5 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 36px;
  font-weight: 700;
  line-height: 46px;
}

h6 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 32px;
  font-weight: 700;
  line-height: 32px;
}

p {
  margin-bottom: 0;
}

a {
  color: var(--color--ffffff);
  text-decoration: none;
}

img {
  max-width: 100%;
  display: inline-block;
}

.main-top-section {
  background-image: url('../images/bg.svg'), url('../images/img_01.jpg');
  background-position: 50% 0, 50% 14vw;
  background-repeat: repeat-y, no-repeat;
  background-size: 100vw, auto;
  background-attachment: scroll, fixed;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.main_top_left_wrapper {
  flex-flow: column;
  align-items: flex-end;
  width: 50%;
  padding-top: 32vw;
  padding-left: 16.6667vw;
  position: relative;
  overflow: hidden;
}

.main_top_right_wrapper {
  width: 50%;
  padding-top: 42vw;
  padding-bottom: 28vw;
  padding-right: 16.6667vw;
  position: relative;
  overflow: hidden;
}

.hero-text {
  text-transform: uppercase;
  mix-blend-mode: difference;
}

.main_top_left_bg {
  opacity: 0;
  mix-blend-mode: difference;
  background-image: linear-gradient(#f09, #db6e00 40%, #ecde21);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.main_top_right_bg {
  opacity: 0;
  mix-blend-mode: difference;
  background-image: linear-gradient(#3400ff, #1877cb 40%, #0ece74);
  position: absolute;
  top: 0%;
  bottom: -12%;
  left: 0%;
  right: 0%;
}

.hnh-line-logo {
  width: 24vw;
  position: absolute;
  top: -40px;
  bottom: auto;
  left: auto;
  right: 3.2vw;
}

.navi-section {
  z-index: 100;
  mix-blend-mode: difference;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  width: 0;
  padding-top: 2.4vw;
  padding-bottom: 3.2vw;
  padding-left: 3.2vw;
  display: flex;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.navi-section.menu-pop {
  position: absolute;
}

.text-16 {
  font-size: var(--font-size--16px);
}

.text-16.grey {
  color: var(--color--666);
}

.text-16.footer-menu {
  align-self: flex-start;
}

.text-16.opacity60 {
  opacity: .6;
}

.text-16.bold {
  font-weight: 700;
}

.text-16.bold-yellow {
  color: var(--color--efef1e);
  font-weight: 700;
}

.text-16.normal-yellow {
  color: var(--color--efef1e);
  font-weight: 400;
}

.menu-wrapper {
  grid-column-gap: 14px;
  grid-row-gap: 14px;
  align-items: center;
  display: flex;
}

.menu-wrapper:hover {
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

.hambuger-line {
  background-color: var(--white\<deleted\|variable-e139747e\>);
  width: 36px;
  height: 2px;
}

.hambuger-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: flex;
}

.sm-link-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  align-self: flex-start;
  align-items: center;
  width: 24px;
  font-weight: 400;
  display: flex;
  overflow: hidden;
}

.menu-sm-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  width: 100px;
  display: flex;
}

.featured-wrapper {
  z-index: 1;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  padding: 18vw 16.6667vw 22vw;
  position: relative;
  overflow: hidden;
}

.featured-title-wrapper {
  text-align: center;
  padding-bottom: 4vw;
  position: relative;
}

.featuered-title {
  text-transform: uppercase;
  font-weight: 300;
}

.featured-row-wrapper {
  grid-column-gap: 4vw;
  grid-row-gap: 4vw;
  border-bottom: 1px solid #fff;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-content: center;
  justify-content: space-between;
  align-items: center;
  padding-top: 2.4vw;
  padding-bottom: 2.4vw;
  display: grid;
}

.project-wrapper {
  justify-content: space-between;
  display: flex;
  position: relative;
}

.project-logo-wrapper {
  text-align: center;
  width: 16%;
}

.project-title {
  margin-bottom: 10px;
}

.project-title.cap {
  text-transform: uppercase;
}

.project-description-wrapper.left {
  text-align: right;
}

.hnh-text-logo {
  min-width: 160px;
}

.sm-logo {
  min-width: 24px;
}

.featured-bg-wrapper {
  z-index: -1;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  align-content: end;
  align-items: end;
  display: grid;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.main-mid-bg {
  background-color: #f63200;
}

.main-mid-bg._1 {
  height: 28vw;
}

.main-mid-bg._2 {
  height: 12vw;
}

.main-mid-bg._3 {
  height: 20vw;
}

.main-mid-bg._4 {
  height: 10vw;
}

.main-mid-bg._5 {
  height: 16vw;
}

.main-mid-bg._6 {
  height: 38vw;
}

.our-webflow-section {
  z-index: 1;
  background-color: #f63200;
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  margin-top: -1px;
  padding: 8vw 16.6667vw 6vw;
  position: relative;
}

.our-webflow-title {
  text-transform: uppercase;
  mix-blend-mode: difference;
  margin-bottom: 30px;
  font-weight: 400;
}

.text-12 {
  color: var(--color--ffffff);
}

.text-12.footer {
  color: var(--color--666);
  font-weight: 500;
}

.text-12.medium {
  margin-top: 6px;
}

.text-12.medium-yellow {
  color: var(--color--efef1e);
  font-weight: 500;
}

.recent-webflow-link-wrapper {
  z-index: 101;
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  mix-blend-mode: difference;
  flex-flow: column;
  align-items: flex-start;
  margin-bottom: 3.2vw;
  margin-right: 3.2vw;
  position: fixed;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
  overflow: hidden;
}

.our-webflow-paragraph {
  font-size: var(--font-size--16px);
  width: 28vw;
  line-height: 26px;
}

.medium {
  font-weight: 500;
}

.medium-yellow {
  color: var(--color--efef1e);
  font-weight: 500;
}

.webflow-link-wrapper {
  z-index: 2;
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  mix-blend-mode: difference;
  flex-flow: column;
  align-items: flex-start;
}

.webflow-link-text-wrapper {
  display: flex;
}

.recent-webflow-bg-wrapper {
  z-index: -1;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.recent-webflow-bg-left {
  background-color: var(--color--1010e1);
  margin-top: 4vw;
  margin-bottom: -5vw;
  position: relative;
}

.recent-webflow-bg-right {
  text-align: center;
  background-color: #f63200;
}

.ring-image {
  z-index: -1;
  mix-blend-mode: difference;
  width: 34vw;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 3.2vw;
}

.our-webflow-text-wrapper {
  grid-column-gap: 10vw;
  grid-row-gap: 10vw;
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  margin-top: 6vw;
  display: flex;
}

.webflow-project-wrapper {
  background-image: url('../images/bg.svg'), url('../images/img_12.jpg');
  background-position: 50% 0, 50%;
  background-repeat: repeat-y, no-repeat;
  background-size: 100vw, cover;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  align-items: flex-end;
  height: 36vw;
  padding-left: 16.6667vw;
  padding-right: 16.6667vw;
  display: flex;
  position: relative;
}

.webflow-project-wrapper._2 {
  background-image: url('../images/bg.svg'), url('../images/img_13.jpg');
  background-position: 50% 0, 50%;
  background-repeat: repeat-y, no-repeat;
  background-size: 100vw, cover;
  justify-content: center;
  align-items: flex-end;
}

.webflow-project-wrapper._3 {
  background-image: url('../images/bg.svg'), url('../images/img_15.jpg');
  background-position: 50% 0, 50%;
  background-repeat: repeat-y, no-repeat;
  background-size: 100vw, cover;
}

.webflow-project-wrapper._4 {
  background-image: url('../images/bg.svg'), url('../images/img_14.jpg');
  background-position: 50% 0, 50%;
  background-repeat: repeat-y, no-repeat;
  background-size: 100vw, cover;
}

.webflow-project {
  z-index: 1;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-self: flex-end;
  width: 66.6667vw;
  display: grid;
  position: relative;
}

.webflow-image-wrapper {
  grid-column-gap: 1.8vw;
  grid-row-gap: 1.8vw;
  align-items: flex-end;
  display: flex;
}

.webflow-description-wrapper {
  padding-bottom: 6vw;
}

.webflow-description {
  margin-right: 3.2vw;
}

.webflow-description.right {
  text-align: right;
  margin-left: 3.2vw;
  margin-right: 0;
}

.webflow-line-logo {
  width: 32vw;
  position: absolute;
  top: auto;
  bottom: -6vw;
  left: 1.6vw;
  right: auto;
}

.webflow-section {
  position: relative;
}

.buy-now-wrapper {
  padding-bottom: 2px;
  display: flex;
}

.webflow-project-button-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  align-items: center;
  margin-top: 4.6vw;
  display: flex;
}

.webflow-project-button-wrapper.right {
  justify-content: flex-end;
  align-items: center;
}

.new-win-arrow {
  width: 14px;
  margin-left: 10px;
}

.thumbnail {
  width: 12vw;
}

.footer-section {
  z-index: 100;
  background-image: url('../images/bg.svg'), url('../images/img_11.png');
  background-position: 50% 0, 50% 46%;
  background-repeat: repeat-y, no-repeat;
  background-size: 100vw, auto;
  background-attachment: scroll, fixed;
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-bottom: 0;
  padding: 18vw 16.6667vw 10vw;
  position: relative;
  overflow: hidden;
}

.footer-section.contact {
  background-image: none;
  background-position: 0 0;
  background-repeat: repeat;
  background-size: auto;
  background-attachment: scroll;
  width: 100vw;
}

.footer-text-wrapper {
  text-align: left;
  flex-flow: column;
  grid-template-rows: auto auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-content: start;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 4vw;
  display: flex;
}

.text-alpha {
  text-transform: lowercase;
}

.footer-paragraph {
  color: var(--color--666);
  width: 46%;
  margin-top: 3.4vw;
  font-weight: 400;
}

.founder-wrapper {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  align-items: flex-start;
  margin-top: 8vw;
  display: flex;
  position: relative;
}

.founder-line {
  background-color: var(--color--efef1e);
  width: 2vw;
  height: 1px;
  margin-top: 9px;
}

.footer-menu-wrapper {
  grid-column-gap: .8vw;
  grid-row-gap: .8vw;
  flex-flow: column;
  align-items: flex-start;
  width: 25%;
  display: flex;
}

.copyright-wrapper {
  grid-column-gap: 60px;
  grid-row-gap: 60px;
  border-top: 1px solid var(--color--333);
  background-color: var(--color--121212);
  justify-content: flex-start;
  align-items: center;
  padding-top: 2vw;
  padding-bottom: 2vw;
  padding-left: 16.6667vw;
}

.link-underline {
  background-color: var(--color--ffffff);
  height: 2px;
}

.link-underline.yellow {
  background-color: var(--color--efef1e);
}

.medium-white {
  color: var(--color--ffffff);
  font-weight: 500;
}

.contact-top-section {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  background-image: url('../images/bg.svg');
  background-position: 50% 0;
  background-repeat: repeat-y;
  background-size: 100vw;
  background-attachment: scroll;
  flex-flow: column;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: flex;
  position: relative;
  overflow: hidden;
}

.contact_top_left_wrapper {
  width: 50vw;
  padding-top: 14vw;
  padding-left: 16.6667vw;
  position: relative;
}

.text-22 {
  font-size: var(--font-size--22pt);
  line-height: 28px;
}

.text-22.footer-title {
  text-transform: uppercase;
  margin-bottom: .8vw;
  font-weight: 500;
}

.text-22.contact-question {
  z-index: 1;
  margin-top: 2.4vw;
  margin-right: 2.4vw;
  position: relative;
}

.contact_top_right_wrapper {
  width: 50vw;
  padding-top: 31vw;
  padding-left: 2.4vw;
  padding-right: 16.6667vw;
  position: relative;
}

.form-block {
  z-index: 1;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  position: relative;
}

.text-field {
  border-style: solid;
  border-width: 0 0 1px;
  border-color: black black var(--color--333);
  color: var(--color--ffffff);
  font-size: var(--font-size--16px);
  background-color: rgba(255, 255, 255, 0);
  padding-bottom: 20px;
  padding-left: 0;
  padding-right: 0;
  font-weight: 400;
  line-height: 22px;
  transition: border-color .3s;
}

.text-field:hover {
  border-bottom-color: var(--color--ffffff);
}

.text-field::placeholder {
  color: var(--color--666);
  font-weight: 400;
}

.text-field.message {
  margin-top: 2.4vw;
  padding-bottom: 4vw;
}

.form {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.submit-button {
  border-bottom: 3px solid var(--color--ffffff);
  font-size: var(--font-size--32pt);
  text-transform: uppercase;
  background-color: rgba(0, 0, 0, 0);
  margin-top: 2vw;
  padding: 10px 0;
  font-weight: 700;
  transition: border-width .6s;
}

.submit-button:hover {
  border-bottom-width: 18px;
}

.webflow-pop-section {
  z-index: 200;
  background-color: rgba(0, 0, 0, .9);
  display: none;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  overflow: auto;
}

.webflow-pop-top-wrapper {
  mix-blend-mode: difference;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  align-content: start;
  max-width: 1920px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 2.4vw;
  padding-left: 2.6vw;
  padding-right: 3.4vw;
  display: grid;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.close-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  align-items: center;
  display: flex;
}

.webflow-paragraph {
  width: 18vw;
  margin-top: 3.4vw;
  font-weight: 400;
}

.buy-button {
  border: 1px solid var(--color--146ef5);
  background-color: var(--color--146ef5);
  border-radius: 3px;
  align-items: center;
  padding: 12px 22px 12px 24px;
  display: flex;
}

.buy-button.preview {
  background-color: rgba(20, 110, 245, 0);
  border: 1px solid rgba(255, 255, 255, .4);
}

.webflow-pop-btn-wrapper {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  align-items: center;
  margin-top: 2vw;
  display: flex;
}

.webflow-pop-text-wrapper {
  text-align: left;
}

.menu-pop-section {
  z-index: 102;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: rgba(0, 0, 0, .9);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 0;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  overflow: hidden;
}

.menu-pop-section.temp {
  width: 100vw;
}

.menu-text {
  text-transform: uppercase;
}

.menu-text-wrapper {
  text-align: center;
  position: relative;
}

.menu-on-line {
  background-color: var(--color--efef1e);
  width: 0%;
  height: 2px;
  position: absolute;
  top: 50%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.menu-pop-wrapper {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.footer-text-link-wrapper {
  color: var(--color--666);
  font-weight: 400;
  transition: color .3s;
  position: relative;
}

.footer-text-link-wrapper:hover {
  color: var(--color--ffffff);
}

.webflow-pop-wrapper {
  max-width: 1920px;
  margin-left: auto;
  margin-right: auto;
  position: -webkit-sticky;
  position: sticky;
}

.x-icon {
  min-width: 27px;
}

.footer-menu-section {
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-end;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.optimism-logo {
  width: 147px;
}

.webflow-logo {
  width: 112px;
}

.contact-top-wrapper {
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: flex;
  position: relative;
  overflow: hidden;
}

.main-top-wrapper {
  justify-content: space-between;
  display: flex;
}

.error-message {
  color: var(--color--efef1e);
  background-color: rgba(255, 255, 255, 0);
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
  font-weight: 400;
}

.success-message {
  font-size: var(--font-size--16px);
  text-align: left;
  background-color: rgba(0, 0, 0, 0);
  padding: 2px 0 0;
}

.black-mask-80 {
  color: rgba(0, 0, 0, .6);
  background-color: rgba(0, 0, 0, .8);
  background-image: url('../images/bg.svg');
  background-position: 50% 0;
  background-repeat: repeat-y;
  background-size: 100vw;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.black-mask-80.featured {
  z-index: -1;
}

.contact-bg {
  mix-blend-mode: lighten;
  background-image: url('../images/contact_bg.jpg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.blur-block {
  z-index: 1;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background-color: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .1);
  width: 16.6667%;
  height: 30px;
  position: absolute;
  top: 42vw;
  left: 50%;
}

.blur-block._2 {
  z-index: 0;
  width: 50%;
  height: 200px;
  top: 0;
  left: auto;
  right: 16.6667%;
}

.blur-block._3 {
  width: 33.3333%;
  height: 30px;
  top: 21vw;
}

.blur-block._5 {
  width: 33.5%;
  height: 200px;
  top: 44vw;
  left: 16.4vw;
}

.blur-block._4 {
  width: 33.3333%;
  height: 30px;
  top: 16.6vw;
  left: 33.3333%;
}

.blur-block._6 {
  width: 66.6667%;
  height: 30px;
  top: auto;
  bottom: 14%;
  left: 0%;
  right: auto;
}

._404-top-wrapper {
  justify-content: space-between;
  padding-top: 14vw;
  display: flex;
}

._404_top_left_wrapper {
  width: 50vw;
  padding-left: 16.6667vw;
  position: relative;
}

._404_top_right_wrapper {
  width: 50vw;
  padding-top: 7.4vw;
  padding-right: 16.6667vw;
  position: relative;
}

._404-top-section {
  background-image: url('../images/bg.svg'), url('../images/img_11.png');
  background-position: 0 0, 50%;
  background-repeat: repeat-y, no-repeat;
  background-size: 100vw, auto;
  background-attachment: fixed, scroll;
  flex-flow: column;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-items: center;
  height: 100vh;
  display: flex;
  position: relative;
  overflow: hidden;
}

._404-text-wrapper {
  text-align: center;
  margin-top: 2vw;
  position: relative;
}

._404-text-wrapper.w--current {
  mix-blend-mode: difference;
  margin-top: 10vw;
}

.featured-bg-mask {
  z-index: -1;
  background-color: rgba(0, 0, 0, .6);
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

@media screen and (max-width: 991px) {
  body {
    line-height: 18px;
  }

  h1 {
    font-size: 12.4vw;
    line-height: 9.6vw;
  }

  h3 {
    font-size: 6vw;
    line-height: 5vw;
  }

  h4 {
    font-size: 38px;
    line-height: 42px;
  }

  h5 {
    font-size: 26px;
    line-height: 28px;
  }

  h6 {
    font-size: 24px;
    line-height: 30px;
  }

  .main-top-section {
    background-size: 100vw, 60%;
  }

  .main_top_left_wrapper {
    padding-left: 6vw;
  }

  .main_top_right_wrapper {
    padding-bottom: 32vw;
    padding-right: 6vw;
  }

  .hnh-line-logo {
    width: 36vw;
  }

  .text-16 {
    font-size: var(--font-size--14px);
    line-height: 18px;
  }

  .menu-wrapper {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }

  .hambuger-line {
    width: 32px;
  }

  .featured-wrapper {
    padding-bottom: 28vw;
    padding-left: 6vw;
    padding-right: 6vw;
  }

  .main-mid-bg._1 {
    height: 50vw;
  }

  .main-mid-bg._2 {
    height: 32vw;
  }

  .main-mid-bg._3 {
    height: 42vw;
  }

  .main-mid-bg._4 {
    height: 30vw;
  }

  .main-mid-bg._5 {
    height: 38vw;
  }

  .main-mid-bg._6 {
    height: 56vw;
  }

  .our-webflow-section {
    padding-bottom: 12vw;
    padding-left: 6vw;
    padding-right: 6vw;
  }

  .our-webflow-paragraph {
    font-size: var(--font-size--14px);
    width: 42vw;
    line-height: 22px;
  }

  .ring-image {
    width: 38vw;
  }

  .our-webflow-text-wrapper {
    margin-top: 12vw;
  }

  .webflow-project-wrapper {
    height: 52vw;
    padding-left: 6vw;
    padding-right: 6vw;
  }

  .webflow-project {
    width: 88vw;
  }

  .webflow-line-logo {
    width: 46vw;
  }

  .new-win-arrow {
    width: 10px;
    margin-left: 8px;
  }

  .thumbnail {
    width: 18vw;
  }

  .footer-section {
    background-position: 50% 0, 50% 72%;
    background-size: 100vw, 50%;
    grid-template-rows: auto auto auto;
    grid-template-columns: 6vw 1fr 1fr 1fr 1fr 6vw;
    padding: 22vw 6vw 14vw;
  }

  .footer-text-wrapper {
    padding-bottom: 20vw;
  }

  .footer-paragraph {
    width: 46vw;
  }

  .founder-line {
    width: 4vw;
  }

  .footer-menu-wrapper {
    width: 33.3333%;
  }

  .copyright-wrapper {
    text-align: center;
    padding-left: 0;
  }

  .contact-top-section {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .contact_top_left_wrapper {
    width: 100vw;
    padding-top: 32vw;
    padding-left: 6vw;
  }

  .text-22 {
    font-size: var(--font-size--16px);
    line-height: 20px;
  }

  .text-22.contact-question {
    margin-top: 3.2vw;
  }

  .contact_top_right_wrapper {
    width: 100vw;
    padding-top: 14vw;
    padding-left: 6vw;
    padding-right: 6vw;
  }

  .text-field::placeholder {
    font-size: var(--font-size--14px);
  }

  .submit-button {
    font-size: var(--font-size--22pt);
  }

  .webflow-pop-top-wrapper {
    grid-template-columns: 1fr 1fr;
    padding-top: 4vw;
    padding-left: 4vw;
    padding-right: 6vw;
  }

  .close-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
  }

  .webflow-paragraph {
    display: none;
  }

  .buy-button {
    padding: 8px 14px 8px 16px;
  }

  .webflow-pop-btn-wrapper {
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    margin-top: 4vw;
  }

  .x-icon {
    min-width: 24px;
  }

  .webflow-pop-logo {
    display: none;
  }

  .optimism-logo {
    width: 132px;
  }

  .contact-top-wrapper {
    flex-flow: column;
  }

  .blur-block._3 {
    top: 25vw;
  }

  .blur-block._5 {
    top: 90vw;
  }

  ._404_top_left_wrapper {
    padding-left: 6vw;
  }

  ._404_top_right_wrapper {
    padding-top: 9.6vw;
    padding-right: 6vw;
  }

  ._404-top-section {
    background-size: 100vw, 60%;
  }
}

@media screen and (max-width: 767px) {
  .contact-bg {
    background-size: cover;
  }
}

@media screen and (max-width: 479px) {
  h1 {
    font-size: 24vw;
    line-height: 18vw;
  }

  h3 {
    line-height: 7vw;
  }

  h4 {
    font-size: 32px;
    line-height: 34px;
  }

  h5 {
    font-size: 22px;
    line-height: 22px;
  }

  h6 {
    font-size: 20px;
    line-height: 20px;
  }

  .main-top-section {
    background-image: url('../images/img_01.jpg');
    background-position: 50% 42vw;
    background-repeat: no-repeat;
    background-size: 80%;
    background-attachment: fixed;
    flex-flow: column;
  }

  .main_top_left_wrapper {
    width: 100vw;
    padding-top: 86vw;
  }

  .main_top_right_wrapper {
    text-align: right;
    width: 100vw;
    padding-top: 0;
    padding-bottom: 86vw;
    padding-left: 6vw;
  }

  .main_top_left_bg {
    opacity: 1;
  }

  .main_top_right_bg {
    opacity: 1;
    bottom: 0%;
  }

  .hnh-line-logo {
    display: none;
  }

  .navi-section {
    padding-top: 4vw;
    padding-bottom: 8vw;
    padding-left: 4vw;
  }

  .text-16 {
    font-size: var(--font-size--12pt);
    line-height: 16px;
  }

  .menu-wrapper {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }

  .hambuger-line {
    width: 26px;
  }

  .hambuger-wrapper, .sm-link-block {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }

  .menu-sm-wrapper {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }

  .featured-title-wrapper {
    text-align: left;
    padding-top: 3.4vw;
    padding-bottom: 6vw;
  }

  .featured-row-wrapper {
    grid-column-gap: 0vw;
    grid-row-gap: 0vw;
    border-bottom-width: 0;
    grid-template-columns: 1fr;
    padding-top: 0;
    padding-bottom: 0;
  }

  .project-wrapper {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    padding-top: 5.2vw;
    padding-bottom: 5.2vw;
  }

  .project-logo-wrapper {
    order: 1;
    width: 12%;
  }

  .project-title {
    margin-bottom: 6px;
  }

  .project-description-wrapper.left {
    text-align: left;
  }

  .hnh-text-logo {
    min-width: 140px;
  }

  .featured-bg-wrapper {
    grid-template-columns: 1fr 1fr;
  }

  .main-mid-bg._1 {
    height: 88vw;
  }

  .main-mid-bg._2 {
    height: 38vw;
  }

  .main-mid-bg._3 {
    height: 96vw;
    display: none;
  }

  .main-mid-bg._4 {
    height: 74vw;
    display: none;
  }

  .main-mid-bg._5, .main-mid-bg._6 {
    display: none;
  }

  .our-webflow-section {
    padding-top: 30vw;
    padding-bottom: 28vw;
  }

  .text-12 {
    line-height: 18px;
  }

  .text-12.footer {
    font-size: 10px;
    line-height: 16px;
  }

  .text-12.medium {
    margin-top: 0;
  }

  .recent-webflow-link-wrapper {
    margin-bottom: 8vw;
    margin-right: 4vw;
  }

  .our-webflow-paragraph {
    font-size: var(--font-size--12pt);
    width: 88vw;
    line-height: 18px;
  }

  .recent-webflow-bg-left {
    margin-top: 12vw;
    margin-bottom: -12vw;
  }

  .ring-image {
    width: 56vw;
  }

  .webflow-project-wrapper {
    background-image: url('../images/img_12.jpg');
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    height: 80vw;
  }

  .webflow-project-wrapper._2 {
    background-image: url('../images/img_13.jpg');
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .webflow-project-wrapper._3 {
    background-image: url('../images/img_15.jpg');
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .webflow-project-wrapper._4 {
    background-image: url('../images/img_14.jpg');
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .webflow-project {
    grid-template-columns: 1fr;
    align-self: center;
  }

  .webflow-image-wrapper {
    display: none;
  }

  .webflow-description-wrapper {
    padding-bottom: 0;
  }

  .webflow-description.right {
    text-align: left;
  }

  .webflow-project-button-wrapper.right {
    justify-content: flex-start;
  }

  .new-win-arrow {
    margin-left: 6px;
  }

  .footer-section {
    background-position: 50% 0, 50% 108%;
    background-size: 100vw, 80%;
  }

  .footer-section.contact {
    padding-top: 34vw;
  }

  .footer-paragraph {
    width: 100%;
    margin-top: 8vw;
    line-height: 18px;
  }

  .founder-wrapper {
    margin-top: 14vw;
  }

  .footer-menu-wrapper {
    width: 100%;
  }

  .copyright-wrapper {
    padding-top: 4vw;
    padding-bottom: 4vw;
  }

  .contact_top_left_wrapper {
    padding-top: 56vw;
  }

  .text-22 {
    font-size: var(--font-size--14px);
    line-height: 18px;
  }

  .text-field {
    padding-bottom: 10px;
  }

  .text-field::placeholder {
    font-size: var(--font-size--12pt);
  }

  .submit-button {
    font-size: var(--font-size--16px);
    margin-top: 1vw;
    padding-bottom: 4px;
  }

  .close-wrapper {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
  }

  .close-wrapper.menu {
    justify-content: flex-start;
  }

  .buy-button {
    padding: 4px 10px 4px 12px;
  }

  .x-icon {
    width: 16px;
    min-width: 16px;
  }

  .footer-menu-section {
    justify-content: flex-start;
    display: none;
  }

  .optimism-logo {
    width: 100px;
  }

  .webflow-logo {
    width: 84px;
  }

  .main-top-wrapper {
    flex-flow: column;
  }

  .black-mask-80 {
    background-image: none;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto;
  }

  .blur-block {
    width: 33.3333%;
    height: 20px;
    display: none;
  }

  ._404-top-wrapper {
    flex-flow: column;
  }

  ._404_top_left_wrapper {
    width: 100vw;
    padding-top: 56vw;
  }

  ._404_top_right_wrapper {
    width: 100vw;
    padding-top: 0;
    padding-left: 6vw;
  }

  ._404-top-section {
    background-size: 100vw, 140%;
    flex-flow: column;
  }
}

#featured.w-node-_1d26662a-d6d2-8a96-c1a2-1e002ee5bf49-b66e7c4f {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_03742b1c-b090-508a-7078-2abedc541b12-b66e7c4f {
  grid-area: span 1 / span 76 / span 1 / span 76;
  justify-self: stretch;
}

#w-node-_52f89a7f-682b-2fa2-098d-ec9b6372969c-b66e7c4f, #w-node-_9be1d4e5-4111-a359-9ef5-d6605d189cf6-b66e7c4f, #w-node-_31057bd3-1610-1781-1b1b-654e058729c2-b66e7c4f, #w-node-_31057bd3-1610-1781-1b1b-654e058729c5-b66e7c4f, #w-node-_2ecfb0e5-11e7-7ed0-1c1c-219c836858fa-b66e7c4f, #w-node-_2ecfb0e5-11e7-7ed0-1c1c-219c836858fd-b66e7c4f, #w-node-c8cee474-fb8d-fda9-5794-bb390ee2a921-b66e7c4f, #w-node-c8cee474-fb8d-fda9-5794-bb390ee2a924-b66e7c4f {
  align-self: center;
  justify-self: center;
}

#w-node-_708006a9-152a-e0bc-8846-0e7d6e130a64-b66e7c4f {
  justify-self: center;
}

#enable_scroll.w-node-_5ff211c5-d0b1-8235-1974-42b483c746e7-b66e7c4f {
  align-self: start;
  justify-self: end;
}

#w-node-_4dcd0d77-58b0-fd3a-d16c-73c99b0c66da-b66e7c4f {
  align-self: end;
}

#w-node-_352aa42a-1d21-2475-8afa-0c59b64f0d5b-b66e7c4f {
  justify-self: center;
}

#enable_scroll.w-node-_8f8840d0-be4f-6018-bd85-6fac6f7cdeef-b66e7c4f {
  align-self: start;
  justify-self: end;
}

#w-node-_8461406f-708e-c9ee-f9c6-9d953a744332-b66e7c4f {
  align-self: end;
}

#w-node-c2b01fe2-21aa-5f94-4e23-f97fc1098423-b66e7c4f {
  justify-self: center;
}

#enable_scroll.w-node-_25ba3fc6-4be1-5265-4875-3cbd3927bebe-b66e7c4f {
  align-self: start;
  justify-self: end;
}

#w-node-f6f38bad-7db3-3f77-0f80-5009137652ab-b66e7c4f, #w-node-f6f38bad-7db3-3f77-0f80-5009137652bc-b66e7c4f {
  align-self: end;
}

#w-node-ac15bf24-f444-efc7-aa11-42852a47e762-b66e7c4f {
  justify-self: center;
}

#enable_scroll.w-node-_4ec8d562-828f-9010-6b5e-17268de93e3d-b66e7c4f {
  align-self: start;
  justify-self: end;
}

#w-node-_9d01a892-0c24-2049-77d0-5e8f01d68a7d-b66e7c4f {
  align-self: end;
}

#w-node-_6b80dd83-6945-ea5b-d06e-d9220ef09266-b66e7c4f {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-_6b80dd83-6945-ea5b-d06e-d9220ef09267-b66e7c4f, #w-node-_6b80dd83-6945-ea5b-d06e-d9220ef0926e-b66e7c4f, #message.w-node-_0b5ebac6-6bbc-c9d0-247d-bbf3361cb63d-da343024 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-_3355d63f-8949-b26c-352b-27c29b65def9-da343024 {
  justify-self: start;
}

#w-node-_42277fb3-b4dd-f063-71d4-0434b658cbcf-da343024 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

#w-node-f5ae1f0c-9923-e24c-9414-3d89d81b0876-da343024 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-f5ae1f0c-9923-e24c-9414-3d89d81b0877-da343024, #w-node-f5ae1f0c-9923-e24c-9414-3d89d81b087e-da343024 {
  grid-area: span 1 / span 2 / span 1 / span 2;
}

@media screen and (max-width: 991px) {
  #w-node-_6b80dd83-6945-ea5b-d06e-d9220ef09267-b66e7c4f {
    grid-column: span 2 / span 2;
  }

  #w-node-_6b80dd83-6945-ea5b-d06e-d9220ef09273-b66e7c4f {
    grid-column: span 5 / span 5;
  }

  #w-node-f5ae1f0c-9923-e24c-9414-3d89d81b0877-da343024 {
    grid-column: span 2 / span 2;
  }

  #w-node-f5ae1f0c-9923-e24c-9414-3d89d81b0883-da343024 {
    grid-column: span 5 / span 5;
  }
}