section{& h2{color:var(--text-color-primary-lc)}& p{color:var(--text-color-secondary-lc)}}main>section:first-of-type{background-color:var(--background-color-special-lc);background-image:radial-gradient(#fefefe,#efefef);position:relative;min-height:calc(100vh - 68px);display:flex;& h1{max-width:48ch}& h1,& h2{color:var(--text-color-primary-hc);color:#333}& p{color:var(--text-color-secondary-hc);color:#999;font-size:1.5rem;max-width:32ch}& picture{position:relative}& picture img{border-radius:1rem;border:1px solid transparent;display:flex;z-index:1}& picture:after{content:"";position:absolute;inset:1rem;z-index:0;box-shadow:-8px -8px 64px #00ffff80,16px 16px 64px #ff000080;animation:color-wheel infinite 10s}&>div{align-self:center}&>div>.button{margin:1rem 0}}.hero-container{display:flex;gap:2rem;align-items:center;position:relative;flex-wrap:wrap-reverse;&>div,&>picture{flex:1 1 500px}&>picture{min-height:30vh;position:relative;z-index:1;filter:drop-shadow(2px 4px 24px rgb(0 0 0 / .25))}&>picture>img{object-fit:cover}}@media (max-height: 700px){.hero-container picture{display:none}}@media (min-width: 1024px){main>.hero-container{& h1,& p{max-width:initial}}}@media (min-width: 1280px){.workshop-card>p:last-of-type>span{display:inline}.hero-container>picture{min-height:60vh}}