:root {
    --dodger-blue: #005A9C;
    --dodger-red: #EF3E42;
    --dodger-white: #FFF;
}

/* Reusable button-style links */
.button-link {
    display: inline-block;
    padding: 1% 2%;
    border-radius: 1%;
    background-color: var(--dodger-blue);
    color: #fff;
    font-weight: bold;
    text-decoration: underline;
    margin: 0 0.5em 0.5em 0;
    transition: transform 0.1s ease, box-shadow 0.1s ease;
}

.button-link:visited {
    color: #fff;
}

.button-link:hover {
    outline: 2px solid var(--dodger-blue);
    background-color: var(--dodger-white);
    color: var(--dodger-red);
    transform: translateY(-5%) scale(1.1);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
}

.button-link:focus-visible {
    outline: 3px solid var(--dodger-blue);
    outline-offset: 2px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
}

.button-link:active {
    background-color: var(--dodger-blue);
    color: #fff;
    transform: translateY(0) scale(1);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
}

.mail-button {
    display: inline-block;
    padding: 8px 12px;
    border-radius: 6px;
    border: 2px solid var(--dodger-blue);
    background-color: var(--dodger-white);
    color: #000;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    transition: transform 0.12s ease, box-shadow 0.12s ease, color 0.12s ease;
}

.mail-button:visited {
    color: #000;
    text-decoration: none;
}

.mail-button:hover,
.mail-button:focus {
    color: var(--dodger-red);
    text-decoration: none;
    transform: translateY(-2%) scale(1.03);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}

.mail-button:focus-visible {
    outline: 2px solid var(--dodger-blue);
    outline-offset: 2px;
}

.mail-button--full {
    display: block;
    width: 100%;
    box-sizing: border-box;
}

/* Social profile / icon links */
.social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 36px;
    color: var(--dodger-blue);
    text-decoration: none;
    transition: transform 0.15s ease, color 0.15s ease;
}

.social-link:visited {
    color: var(--dodger-blue);
    text-decoration: none;
}

.social-link:hover {
    color: var(--dodger-blue);
    transform: scale(1.2);
    text-decoration: none;
}

.social-link:focus-visible {
    color: var(--dodger-blue);
    transform: scale(1.5);
    outline: 3px solid rgba(21, 88, 176, 0.4);
    outline-offset: 4px;
    text-decoration: none;
}

#about p {
    font-size: 14pt;
}

a,
a:visited {
    color: var(--dodger-blue);
}

a:hover,
a:focus {
    color: var(--dodger-red);
}