/*
 * Compatibilidade visual do portal de infrações migrado.
 * Reproduz somente a grade utilizada nas páginas antigas, sempre limitada
 * ao elemento .trf para não interferir no cabeçalho, rodapé ou na home.
 */
.trf,
.trf *,
.trf *::before,
.trf *::after {
    box-sizing: border-box;
}

.trf {
    display: block;
    width: 100%;
}

.trf .container {
    width: 100%;
    max-width: 1140px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 20px;
    padding-left: 20px;
}

.trf .row {
    --trf-gutter-x: 24px;
    --trf-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--trf-gutter-y));
    margin-right: calc(-.5 * var(--trf-gutter-x));
    margin-left: calc(-.5 * var(--trf-gutter-x));
}

.trf .row > * {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    margin-top: var(--trf-gutter-y);
    padding-right: calc(.5 * var(--trf-gutter-x));
    padding-left: calc(.5 * var(--trf-gutter-x));
}

.trf .g-3 {
    --trf-gutter-x: 16px;
    --trf-gutter-y: 16px;
}

.trf .g-4 {
    --trf-gutter-x: 24px;
    --trf-gutter-y: 24px;
}

.trf .g-6 {
    --trf-gutter-x: 32px;
    --trf-gutter-y: 32px;
}

.trf .col-12 { flex: 0 0 auto; width: 100%; }
.trf .mt-1 { margin-top: 4px !important; }
.trf .mt-2 { margin-top: 8px !important; }
.trf .mt-3 { margin-top: 16px !important; }
.trf .mt-5 { margin-top: 48px !important; }
.trf .mb-0 { margin-bottom: 0 !important; }
.trf .mb-1 { margin-bottom: 4px !important; }
.trf .mb-2 { margin-bottom: 8px !important; }
.trf .mb-3 { margin-bottom: 16px !important; }
.trf .py-4 { padding-top: 24px !important; padding-bottom: 24px !important; }

@media (min-width: 576px) {
    .trf .col-sm-6 { flex: 0 0 auto; width: 50%; }
}

@media (min-width: 768px) {
    .trf .col-md-3 { flex: 0 0 auto; width: 25%; }
    .trf .col-md-4 { flex: 0 0 auto; width: 33.333333%; }
    .trf .col-md-6 { flex: 0 0 auto; width: 50%; }
    .trf .col-md-12 { flex: 0 0 auto; width: 100%; }
}

@media (min-width: 992px) {
    .trf .col-lg-3 { flex: 0 0 auto; width: 25%; }
    .trf .col-lg-4 { flex: 0 0 auto; width: 33.333333%; }
    .trf .col-lg-6 { flex: 0 0 auto; width: 50%; }
}

@media (max-width: 767px) {
    .trf section {
        padding-top: 28px;
        padding-bottom: 28px;
    }

    .trf .container {
        padding-right: 14px;
        padding-left: 14px;
    }
}
