.hero{background-attachment:fixed;background-position:50%;background-size:cover;background:url(../imgs/dots.webp) var(--background-color);background-repeat:repeat;background-size:1rem 1rem;overflow-x:hidden;overflow-y:visible;padding-bottom:7rem;padding-top:14rem;position:relative}@media screen and (max-width:1024px){.hero{padding-bottom:3rem;padding-top:10rem}}@media screen and (max-width:768px){.hero{padding-bottom:3rem;padding-top:10rem}}.hero .container{display:flex;flex-direction:column-reverse;gap:2rem;height:100%}.hero .hero-content{align-items:flex-start;display:flex;flex-direction:column;height:100%;justify-content:center;text-align:left}@media screen and (min-width:1920px){.hero .hero-content{align-items:center}.hero .hero-content .hero-heading{font-size:5rem;max-width:100ch;text-align:center}.hero .hero-content .hero-subtitle{font-size:1.5rem;max-width:60ch;text-align:center}}@media screen and (max-width:1024px){.hero .hero-content{align-items:flex-start}.hero .hero-content .hero-heading{font-size:2.5rem;max-width:40ch;text-align:left}.hero .hero-content .hero-subtitle{font-size:1.125rem;max-width:40ch;text-align:left}}.hero .hero-heading{color:var(--foreground-color);font-size:4rem;font-weight:700;line-height:1.2;max-width:700px;z-index:2}@media screen and (max-width:768px){.hero .hero-heading{font-size:2.5rem}}.hero .hero-subtitle{color:var(--foreground-color);font-size:1.25rem;line-height:1.6;margin-top:1.125rem;max-width:400px;z-index:2}@media screen and (max-width:768px){.hero .hero-subtitle{font-size:1.125rem}}.hero .hero-button{align-items:center;background-color:var(--primary-color);border-radius:5rem;color:var(--on-primary-color);display:inline-flex;font-size:1.125rem;font-weight:500;margin-top:2.5rem;padding:.75rem 1.25rem;text-decoration:none;transition:background-color .3s ease,border-radius .3s ease;z-index:2}.hero .hero-button svg{margin-left:.5rem;vertical-align:middle}.hero .hero-button:hover{background-color:rgba(var(--primary-color-rgb),.9);border-radius:1.25rem}.hero .floating-image{bottom:0;height:100%;pointer-events:none;position:absolute;right:-260px;top:0;transform:scaleX(-1)}@media screen and (min-width:1920px){.hero .floating-image{display:none}}@media screen and (max-width:1500px){.hero .floating-image{right:-380px}}@media screen and (max-width:1300px){.hero .floating-image{right:-480px}}@media screen and (max-width:1200px){.hero .floating-image{right:-630px}}@media screen and (max-width:1024px){.hero .floating-image{display:none}}@media screen and (max-width:768px){.hero .floating-image{display:none}}
