/* ---------------------------------
 * Navigation Bar
 * --------------------------------- */

.home nav {
    background-color: transparent;
    box-shadow: none;
    padding: 1rem 0;
}

/* ---------------------------------
 * Hero Section
 * --------------------------------- */

.home #hero {
    padding-block: 5rem;
}

.home #hero .tag-line {
    line-height: 0.9;
    color: transparent;
    background-clip: text;
    background-size: 300% 300%;
    background-image: linear-gradient(#191728, #201a4f, #19243f, #fff, #fff);
}

[lang='ar'] .home #hero .tag-line {
    line-height: 1.5;
}

.home header #hero .btn {
    font-size: 1rem;
    padding: 0.75rem 1.5rem;
}

@media screen and (max-width: 768px) {
    .home header #hero .btn {
        font-size: 0.875rem;
        padding: 0.5rem 1rem;
    }
}

.home header #hero .hero-image {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
}

/* ---------------------------------
 * Features Section
 * --------------------------------- */

.home #features .icon-box {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background-color: var(--tblr-body-color);
    color: var(--tblr-body-bg);
    border-radius: 50%;
}

/* ---------------------------------
 * Audience Section
 * --------------------------------- */

.home #audience .icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background-color: var(--tblr-gray-100);
    color: var(--tblr-gray-900);
    border-radius: var(--tblr-border-radius);
}

/* ---------------------------------
 * Footer Section
 * --------------------------------- */

.home footer {
    background-color: transparent;
    border: none;
}