@import url('../variables.css');
@import url('../global.css');
@import url('../typography.css');
@import url('../layout/header.css');
@import url('../layout/footer.css');
@import url('../components/hero.css');

body {
    background-color: var(--bg-off-white);
}

.about-info {
    max-width: 960px;
    margin: 5rem auto;
    padding: 4rem clamp(1.5rem, 5vw, 5rem);
    background-color: var(--white);
    border: 1px solid var(--border-light);
    border-radius: var(--border-radius-card);
    box-shadow: var(--shadow-card);
    line-height: 1.8;
}

.about-info p {
    margin-bottom: 1.5rem;
}

.about-info p:last-child {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .about-info {
        margin: 3rem 1rem;
        padding: 2rem 1.5rem;
    }
}