body {
    color:#2E2E2C;
    background-color: #FAF7F2;
    overflow-x: hidden;
    font-family: 'DM Sans', sans-serif;
}

.header {
    height:6rem;
    padding:1rem;
    background-color:#7E8F7C;
    color:#FAF7F2;
    border:solid;
    border-width:0 0 1px 0;
    border-color: #FAF7F2;
    border-bottom-color: #D3A15F;
    font-size:2.5rem;
}

.header-link {
    color:#FAF7F2;
    text-decoration:none;  
}

.header-logo {
    margin-right:.5rem;
    max-width:3rem;
    height:auto;
}

.footer {
    background-color:#7E8F7C;
    color:#FAF7F2;
    border:solid;
    border-width:0 0 0 1px;
    border-color: #7E8F7C;
    border-bottom-color: #7E8F7C;
    padding:2rem;
    font-size:1rem;
}

.footer-link {
    color:#FAF7F2;
}

.footer-logo {
    margin-left:.5rem;
    margin-right:.5rem;
    max-width:30px;
    height:auto;
}

.logo {
    max-width:300px;
    max-height:300px;
    height:auto;
    margin-bottom:1rem;
    margin-left:.5rem;
    margin-top:1rem;
}

.gwilio-title {
    font-size:5rem;
    font-weight:600;
}

.hero {
    background-image: linear-gradient(135deg, #7E8F7C 0%, #C97A5D 100%); 
    color: #ffffff; 
    background-size: cover;
}

.logo-bottom {
    max-width:100px;
    height:auto;
}

/* Background / Base - Sand color */
.color-primary {
    background-color:#FAF7F2;
}

/* Secundary Background - olive green */
.color-secundary {
    background-color:#7E8F7C;
}

/* Primary UI - Sage */
.color-primary-ui {
    color: #7E8F7C;
}

/* Accent - Terracotta */
.color-accent {
    color:#C97A5D;
}

/* Secundary Accent - Ochre */
.color-secondary-accent {
    color:#D3A15F;
}

/* Background - olive green */
.color-tertiary-accent {
    color:#7E8F7C;
}

/* Text - Charcoal */
.color-text {
    color:#2E2E2C;
}

/* Soft Divider / Line */
/* .divider {
: #E7E2D9
} */

.main-title {
    font-size:4rem;
    font-weight:700;
    margin-bottom:2rem;
}

.cta-button {
    background-color: #C97A5D;
    color: #FAF7F2;
    margin-top:2rem;    
    border-radius: 50px;
    border-color: #D3A15F;
}

.cta-button:hover {
    background-color:#D3A15F;
    border-color: #C97A5D;
}

.what-gwilio-is, .closing, .waitlist-form {
    background-color:#f1f1f1;
}

.heading {
    margin-bottom:2.5rem;
    font-weight:500;
}

.sub-heading {
    margin-bottom:1.5rem;
    font-weight:700;
}

.sub-title {
    font-weight:700;
}

.list-item {
    margin-bottom:1.2rem;
}

.section-title {
    margin-bottom:1rem;
}

.section-message {
    margin-bottom:1rem;
}

.waitlist-input {
    margin-bottom:1rem;
}

.waitlist-control {
    margin-bottom:1rem;
}

.waitlist-control {
    margin-bottom:1rem;
}

.card {
    border-color:#7E8F7C;
    border-radius: 20px;
}

.card-header {
    background-color:inherit;
    border: none;
}

.scroll-to-top-btn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    border: none;
    background-color: #C97A5D;
    color: white;
    cursor: pointer;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    transition: all 0.3s ease;
}

.scroll-to-top-btn:hover {
    background-color:#D3A15F;
    border-color: #C97A5D;
}