/* brand animated banner */
.animated-bg {
    position: relative;
    width: 100%;
    height: 35vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background:
        radial-gradient(circle at 20% 20%, rgba(46, 230, 214, 0.25), transparent 55%),
        radial-gradient(circle at 80% 10%, rgba(246, 178, 74, 0.25), transparent 55%),
        #0b0f14;
}

.animated-bg .logo {
    font-family: "Unbounded", sans-serif;
    font-size: clamp(2.6rem, 6vw, 4.2rem);
    letter-spacing: 0.3rem;
    color: #f6f5ef;
}

.animated-bg .logo-sub {
    color: #c7cbd3;
    letter-spacing: 0.2rem;
    text-transform: uppercase;
    font-size: 0.85rem;
    margin-top: 0.6rem;
}

@-webkit-keyframes bg-scrolling-reverse {
    100% {
        background-position: 50px 50px;
    }
}

@-moz-keyframes bg-scrolling-reverse {
    100% {
        background-position: 50px 50px;
    }
}

@-o-keyframes bg-scrolling-reverse {
    100% {
        background-position: 50px 50px;
    }
}

@keyframes bg-scrolling-reverse {
    100% {
        background-position: 50px 50px;
    }
}

.content {
    max-width: 1000px;
    margin: 0 auto;
    padding: 4rem 2rem 5rem;
}

/* Our Story Section */
.about-story,
.about-mission,
.about-values,
.about-contact {
    margin-bottom: 2rem;
}

.about-story h2,
.about-mission h2,
.about-values h2,
.about-contact h2 {
    font-size: 2rem;
    margin-bottom: 1rem;
    color: #f6f5ef;
    border-bottom: 2px solid #2ee6d6;
    display: inline-block;
    padding-bottom: 0.25rem;
}

.about-story p,
.about-mission p,
.about-contact p {
    font-size: 1rem;
    line-height: 1.6;
    color: #c7cbd3;
}

/* Our Values Section */
.about-values ul {
    list-style-type: none;
    padding: 0;
}

.about-values li {
    font-size: 1rem;
    margin-bottom: 0.5rem;
    color: #c7cbd3;
}

/* Contact Section */
.about-contact address {
    font-style: normal;
    line-height: 1.6;
    margin-bottom: 1rem;
    color: #c7cbd3;
}

.about-contact a {
    color: #2ee6d6;
    text-decoration: none;
}

.about-contact a:hover {
    text-decoration: underline;
}