/* ============================================================
   Careers page — page-scoped additions on top of main.css.
   Loaded globally (after main.css) but only targets classes
   used on the /careers route.
   ============================================================ */

.careers-role-row {
    transition: background-color 0.25s ease, padding-left 0.25s ease;
}

.careers-role-row:hover {
    background-color: var(--at-neutral-50);
    padding-left: 16px;
    padding-right: 16px;
    margin-left: -16px;
    margin-right: -16px;
}

.careers-role-row__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.25s ease;
}

.careers-role-row:hover .careers-role-row__icon {
    transform: translate(4px, -4px);
}