/* 7MATIC — typographic layout for the legal pages. */

.legal { max-width: 68ch; padding: clamp(20px, 4vw, 40px) 0 0; }

.legal h1 {
    margin: 0 0 clamp(28px, 4vw, 44px);
    font-family: var(--font-display);
    font-size: clamp(2rem, 5.4vw, 3.4rem);
    font-weight: 500;
    line-height: 1;
    letter-spacing: -.04em;
}

.legal h2 {
    margin: clamp(34px, 5vw, 52px) 0 12px;
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 400;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--lime);
}

.legal p, .legal li { color: #cfcfc9; }

.legal p { margin: 0 0 14px; }

.legal ul { margin: 0 0 14px; padding-left: 20px; }

.legal li { margin-bottom: 6px; }

.legal strong { font-weight: 500; color: var(--white); }

.legal a {
    color: var(--white);
    text-decoration: none;
    border-bottom: 1px solid rgba(232, 255, 69, .35);
    transition: color .25s ease, border-color .25s ease;
}

.legal a:hover { color: var(--lime); border-bottom-color: var(--lime); }

.legal address { font-style: normal; }

.back {
    display: inline-block;
    margin-top: clamp(30px, 4vw, 46px);
    text-decoration: none;
    border-bottom: 1px solid var(--line);
    padding-bottom: 3px;
    transition: color .25s ease, border-color .25s ease;
}

.back:hover { color: var(--lime); border-bottom-color: var(--lime); }