:root {
    --pine: #10185a;
    --pine-2: #080d3f;
    --mint: #dff3ff;
    --cream: #f1f6ff;
    --paper: #fcfdff;
    --coral: #0676ef;
    --gold: #00afe9;
    --ink: #11183f;
    --muted: #66718e;
    --line: #dce4f2;
    --shadow: 0 22px 60px rgba(16, 24, 90, .13);
}

.site-nav,
.site-nav .nav-cta {
    font-size: 15px;
}

.placeholder-art {
    background-image: url('../images/placeholder-grid.svg'), linear-gradient(135deg, #086dd7, #10185a);
}

.feature-image,
.card-placeholder {
    background: linear-gradient(145deg, #087cdd, #11185a);
}

.class-card.coral .card-placeholder {
    background: linear-gradient(145deg, #12b9ee, #0863d1);
}

.class-card.sage .card-placeholder {
    background: linear-gradient(145deg, #0879e2, #10185a);
}

.class-card.gold .card-placeholder {
    background: linear-gradient(145deg, #28c4ef, #173eaa);
}

.hero-content > p,
.feature-copy p,
.page-hero p,
.class-copy p,
.site-footer {
    color: #d8e7ff;
}

.footer-grid > div > a:not(.brand),
.footer-brand p {
    color: #9eadd5;
}

.footer-bottom {
    border-color: #263278;
    color: #8292c4;
}

.socials a {
    border-color: #33418a;
}

@media (max-width: 900px) {
    .site-nav a,
    .site-nav .nav-cta {
        font-size: 19px;
    }
}