﻿/* ===== Background da página (robusto) ===== */
/* Cor de fallback caso a imagem não carregue */
body {
    background-color: #f1f1f1;
}

    /* Habilitado via ViewBag.BodyClass = "page-has-bg" */
    body.page-has-bg {
        position: relative;
        isolation: isolate; /* garante um contexto de empilhamento próprio */
    }

        /* Camada fixa + overlay para legibilidade */
        body.page-has-bg::before {
            content: "";
            position: fixed;
            inset: 0;
            z-index: -1; /* fica atrás de todo conteúdo */
            pointer-events: none;
            /* Overlay escuro + imagem (adicione WebP/AVIF quando tiver) */
            background-image: linear-gradient(rgba(5,23,48,.60), rgba(5,23,48,.60)), image-set(
            /* url("../img/sgi-bg.avif") type("image/avif"), */
            /* url("../img/sgi-bg.webp") type("image/webp"), */
            url("../img/sgi-bg.png") type("image/png") );
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
        }

/* Em mobile, evita jank de fixed em alguns browsers */
@media (max-width: 991.98px) {
    body.page-has-bg::before {
        position: absolute;
    }
}

/* ===== Utilitários e tipografia ===== */
.py-6 {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
}

.tracking-wide {
    letter-spacing: .08em;
}

/* ===== Aside “título lateral” (agora sticky para robustez) ===== */
.mvv-aside,
.sgi-aside {
    position: sticky;
    top: 2rem;
}

/* ===== MVV ===== */
.mvv-block {
    border-color: var(--bs-primary) !important;
}

    .mvv-block .lead {
        font-size: 1.05rem;
    }

/* Lista de valores com marcador sutil */
.mvv-list li {
    display: flex;
    align-items: baseline;
    font-size: 1.05rem;
    margin-bottom: .5rem;
}

.mvv-dot {
    display: inline-block;
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    background: var(--bs-primary);
    margin-right: .5rem;
    transform: translateY(.15rem);
}

/* ===== SGI ===== */
.sgi-item {
    border-color: var(--bs-primary) !important;
    position: relative;
}

.sgi-list {
    margin-left: 0;
}

    .sgi-list li {
        display: flex;
        gap: .75rem;
        align-items: baseline;
    }

.sgi-bullet {
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    background: var(--bs-primary);
    margin-left: -1.25rem; /* alinha a bolinha à borda */
    flex: 0 0 .5rem;
    transform: translateY(.15rem);
}

/* ===== Acessibilidade: respeita redução de movimento ===== */
@media (prefers-reduced-motion: no-preference) {
    .mvv-block {
        transition: border-color .3s ease, color .3s ease;
    }

        .mvv-block:hover {
            border-color: var(--bs-primary);
        }

    .sgi-item {
        transition: border-color .25s ease;
    }

        .sgi-item:hover {
            border-color: var(--bs-primary);
        }
}

/* ===== Ajustes responsivos de grid ===== */
@media (min-width: 992px) {
    .col-lg-8.offset-lg-4 {
        padding-left: 2rem;
    }
}
