:root {--boradius:0;}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {font-weight: 300;}
h1 {line-height:1;}
h2 {line-height:1.2;}
h3 {line-height:1.3;}
h4 {line-height: 1.4;}
h5 {line-height: 1.5; font-size: 1.2rem;}
h6 {line-height: 1.5;}

.cover .top:before {background-image: url("cover-seal.png");}

.border {border-color:var(--primary) !important; border-radius: var(--boradius);}
[class*='frame-'] {position: relative; overflow: unset;}
[class*='frame-']:before, .frame-top-bottom:before {-webkit-mask-image: url('png-frame.png'); mask-image: url('png-frame.png'); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; background-color: var(--primary); content:""; display: block; width:10rem; height: 4rem; top: -3rem; position: absolute; left: 50%; transform: translateX(-50%);}
.frame-bottom:before, .frame-bottom-top:before {top: auto; bottom: -3rem; transform: translateX(-50%) scale(-1);}
.bg-primary [class*='frame-']:before {background-color: var(--light);}

.spring {position: relative; overflow: unset; margin-top:2rem;}
.spring:before {background: url('png-spring.png') 50% 50% / contain no-repeat scroll transparent; content:""; display: block; width:calc(100% - 30px); height: 40px; top: -20px; position: absolute; left: 50%; transform: translateX(-50%);}

:root {--divh:10rem;}
.divider-top, .divider-bottom {-webkit-mask-size: cover; -webkit-mask-repeat: repeat-y;}
.divider-top {z-index: 1; margin-top: calc(-1 * var(--divh)); padding-top:calc(0rem + var(--divh)) !important; -webkit-mask-image: url('divider-top.svg'); -webkit-mask-position: center top !important;}
.divider-bottom {z-index: 2; padding-bottom:calc(0rem + var(--divh)) !important; -webkit-mask-image: url('divider-bottom.svg'); -webkit-mask-position: center bottom !important;}
.divider-bottom + div {margin-top: calc(-1 * var(--divh)); z-index: 1; padding-top: calc(var(--divh) / 2);}


:root {}
.hero {height: 120vh; background-position:50% 20%;}
.hero .nums {position: relative;}
.hero .back {font-size: 30vw; font-weight: 900; letter-spacing: -2rem; position: relative; opacity: .2; z-index: -1; left:-5rem; line-height: 20vw; margin-bottom: -3rem;}
.hero .front {position: absolute; bottom: 0; font-size: 15vw; opacity: .7;}
.hero > .block-section-container {overflow: unset !important;}
.hero + .block-section > .block-section-container {}

.countdown [class*='c-'] label {font-family: var(--font1);}


@media (max-width:767px) {
  .frame-top {margin-top: 4rem;}
  .frame-top-bottom:before {top: auto; bottom: -3rem; transform: translateX(-50%) scale(-1);}
  .frame-bottom-top:before {top: -3rem; bottom: auto; transform: translateX(-50%);}
} @media (max-width:558px) {
  .hero .nums {margin-bottom: 3rem;}
  .hero .back {font-size: 60vw;}
  .hero .front {font-size: 30vw;}

  .divider-bottom + div {padding-block: calc(var(--divh) / 1) calc(var(--divh) / 1.5);}
  .divider-top {padding-block:calc(var(--divh) / 1.5) !important;}
}
