@layer components{.banner-block{--banner-height: 400px;--text-color: var(--white);--background-color: var(--main-color-1);position:relative;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;background-color:var(--background-color);height:var(--banner-height);overflow:hidden;grid-column:full-width;grid-template-rows:1fr}.banner-block>.banner-content{grid-row:1;grid-column:1}.banner-block>.banner-content{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;z-index:var(--z-index-2)}.banner-block>.banner-content>.body{max-width:var(--container-max-width);width:100%;margin-inline:auto;padding-inline:var(--container-padding-inline)}.banner-block>.banner-content>.body.full-width{max-width:100%}.read-mode .banner-block .wrap{max-width:800px}}@layer theme{.banner-block{--banner-height: 500px;--background-color: var(--main-color-3)}.banner-block>.banner-content{margin-top:4em}.banner-block>.banner-content .body .title{text-wrap:balance;text-align:center;color:var(--text-color);font-size:var(--heading-size);line-height:1}.banner-block>.banner-content .body .title .invert{--_color: var(--main-color-1);color:var(--_color)}.banner-block>.banner-content .body .richtext{margin-top:1.5em;color:var(--text-color);max-width:50ch;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.banner-block>.banner-content .body .btn-wrapper{margin-top:1.5em;align-items:flex-start}}