: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: -3.5rem; position: absolute; left: 50%; transform: translateX(-50%); opacity:.5;}
.frame-bottom:before, .frame-bottom-top:before {top: auto; bottom: -3.5rem; transform: translateX(-50%) scale(-1);}
.bg-primary [class*='frame-']:before {background-color: var(--light);}
[class*='frame-']:is(.border-light, .frame-light):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%);}

.hero {}
.hero > .block-section-container {min-height: inherit; 100%; display: flex; flex-direction: column; justify-content: space-between;}
.hero + .block-section > .block-section-container {}
.hero .hero-icon {filter:saturate(0) brightness(20) invert(1); width: 40vw; position: absolute; overflow: unset; left: 50%; transform: translateX(-50%); top: 30%; z-index: -1;}
.hero [class*='frame-']:before {margin-left: 4rem;}
.hero .text-left.block-header.date {justify-content: flex-start;}
.hero .text-right.block-header.date {justify-content: flex-end;}
.hero .block-header.date label {text-align: center;}

.hero .block-header.bg {font-size: 50vh; font-family: sans-serif; font-weight: 900; letter-spacing: 0; line-height: .8; -webkit-text-stroke:thin; filter: opacity(0.1); text-align: center; left: 0; width: 0 !important; position: absolute;}
.hero .block-header.bg + .block-header * {font-size: 10rem;}

:is(html, html.ss) :is([class*='block-'].aos-init,*) .hero .countdown {position: absolute; left:50%; top:50%; transform: translate(-50%, -50%) !important; z-index: 5;}

@media (max-width:767px) {
  .hero > .block-section-container {min-height: 100%;}
  .hero .hero-icon {top:40%; width: 60vw;}
  .hero .block-header.date {transform: scale(.7); transform-origin: top;}
  .hero [class*='frame-']:before {width: 30vw;}


  .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%);}

  main .block-column .__col {padding-inline:0;}
}
