#home__main {
    font-family: var(--outfit);
}


#home__hero {
    height: 85vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

#home__hero-container {
    width: 100%;
    display: flex; flex-direction: row;
    gap: 1rem;
    justify-content: center;
    gap: 5rem;
    flex-wrap: wrap;
    padding: 2rem;
}

#home__hero-text-section {
    display: flex; flex-direction: column;
    width: 30%;
    min-width: 30rem;
    gap: 1.25rem;
}

#home__hero-logo {
}

#home__hero-background {
    position: absolute;
    top: 0; left: 0;
    right: 0; bottom: 0;
    z-index: -1;
    /* background-color: var(--d1); */
    overflow: hidden;
}

.home__hero-background-element {
    border-radius: 100%;
    position: absolute;
    width: 10rem; height: 10rem;
    animation: grow 10s infinite alternate;
    opacity: .5;
}

#home__hero-background-blur-layer {
    backdrop-filter: blur(5rem);
    width: 100%; height: 100%;
}

.home__hero-background-element:nth-child(1) {animation-delay: -5.5s;background-color: var(--p1); top: 0%; top: 0%;}
.home__hero-background-element:nth-child(2) {animation-delay: 0s;background-color: var(--s1); top: 0%; left: 0%;}
.home__hero-background-element:nth-child(3) {animation-delay: 5.5s;background-color: var(--p1); top: 0%; left: 0%;}
.home__hero-background-element:nth-child(4) {animation-delay: -5s;background-color: var(--s1); top: 100%; left: 0%;}
.home__hero-background-element:nth-child(5) {animation-delay: 0s;background-color: var(--p1); top: 100%; left: 0%;}
.home__hero-background-element:nth-child(6) {animation-delay: 7.5s;background-color: var(--s1); top: 100%; left: 0%;}
.home__hero-background-element:nth-child(7) {animation-delay: -5s;background-color: var(--p1); top: 0%; left: 100%;}
.home__hero-background-element:nth-child(8) {animation-delay: 0s;background-color: var(--s1); top: 0%; left: 100%;}
.home__hero-background-element:nth-child(9) {animation-delay: 6s;background-color: var(--p1); top: 0%; left: 100%;}
.home__hero-background-element:nth-child(10) {animation-delay: -3.5s;background-color: var(--s1); top: 100%; left: 100%;}
.home__hero-background-element:nth-child(11) {animation-delay: 0s;background-color: var(--p1); top: 100%; left: 100%;}
.home__hero-background-element:nth-child(12) {animation-delay: 4.5s;background-color: var(--s1); top: 100%; left: 100%;}



@keyframes grow {
    0% {transform: scale(1);}
    25% {transform: scale(7.5); opacity: .5;}
    100% {transform: scale(15); opacity: .25;}
}



@media (max-width: 100ch) {
  #home__hero-container img {
    display: none;
  }

}

@media (max-width: 100ch) {
    #home__hero-container {align-items: center; flex-direction: column; width: 100%;}
    #home__hero-logo {width: 90%;}
    #home__hero-text-section {width: 100%; min-width: 0; max-width: 40rem;}
    #home__hero-text-section h5 {font-size: 3rem;}
    #home__hero-text-section p {font-size: 2rem;}
}