@layer components{.introduction{--margin:40px;--padding:20px;width:min(calc(100% - var(--padding)),var(--layout-width));height:calc(100vh - (var(--navigation-height) + var(--margin)*2));border-top:var(--layout-border-dashed);border-bottom:var(--layout-border-dashed);min-height:500px;margin:0 auto 40px;position:relative}@media (width>=520px) and (width<=920px){.introduction{--padding:50px}}.introduction__inner{width:100%;height:100%;padding:20px;display:flex;position:relative;overflow:clip}.introduction__left{pointer-events:none;z-index:1;flex-direction:column;flex:0 0 100%;justify-content:center;gap:8px;padding:4px 12px 12px;display:flex}@media (width>=560px){.introduction__left{padding:4px 44px 44px}}@media (width>=860px){.introduction__left{flex:0 0 70%}}.introduction__tagline{font-family:var(--serif-font);font-size:var(--h2);text-wrap:balance;font-weight:500}@media (width>=560px){.introduction__tagline{font-size:calc(var(--h1)*1.4)}}.introduction__name{font-size:var(--h2);color:var(--primary);font-weight:700}@media (width>=560px){.introduction__name{font-size:var(--h1)}}.introduction__title{font-family:var(--monospace-font);font-size:var(--h4);color:var(--secondary);font-weight:500}.introduction__right{width:50%;height:100%;position:absolute;top:0;right:0}}