:root {
        /* COLORES EXTRAÍDOS DE LA PORTADA (Versión Sólida) */
        --portada-purple: #833081; /* Morado de la izquierda */
        --portada-orange: #f07e5e; /* Naranja de la derecha */
        --ivm-maroon: #691c32;    /* Guinda institucional original */
        --ivm-gold: #be965c;      /* Dorado institucional */
        --bg-canvas: #f4f4f9;     /* Fondo gris muy claro para contraste */
        --bg-footer: #929A9E;
        }
        body {
        font-family: 'Inter', sans-serif;
        background-color: var(--bg-canvas);
        color: #334155;
        }
        /* --- NAVBAR --- */
        .navbar-custom {
        background-color: white;
        border-bottom: 4px solid var(--portada-purple);
        box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        }
        .nav-link { color: #475569; font-weight: 600; }
        .nav-link:hover, .nav-link.active { color: var(--portada-purple) !important; }
        /* --- HEADER SÓLIDO (Basado en la portada sin degradados) --- */
        .header-flat {
        background-color: var(--portada-purple);
        color: white;
        padding: 80px 0;
        border-bottom: 8px solid var(--portada-orange);
        position: relative;
        }
        .header-flat h1 {
        font-family: 'Montserrat', sans-serif;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-bottom: 0;
        }
        .subtitulo-header {
        font-size: 1.1rem;
        text-transform: uppercase;
        letter-spacing: 2px;
        opacity: 0.9;
        font-weight: 400;
        }
        .badge-veracruz-flat {
        background-color: var(--portada-orange);
        color: white;
        font-family: 'Montserrat', sans-serif;
        padding: 10px 30px;
        border-radius: 4px; /* Estilo más cuadrado/sólido */
        display: inline-block;
        margin-top: 15px;
        font-weight: 700;
        }
        /* --- SECCIONES Y CARDS --- */
        .section-title {
        border-left: 5px solid var(--portada-orange);
        padding-left: 15px;
        margin-bottom: 30px;
        font-weight: 700;
        color: var(--portada-purple);
        }
        .card-portal {
        border: none;
        border-radius: 0; /* Bordes rectos para un look más serio/institucional */
        transition: 0.3s;
        background: white;
        border-top: 5px solid transparent;
        }
        .card-portal:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1);
        }
        /* Colores por categoría */
        .border-purple { border-top-color: var(--portada-purple) !important; }
        .border-orange { border-top-color: var(--portada-orange) !important; }
        .border-danger-solid { border-top-color: #dc3545 !important; }
        /* Iconos con fondo sólido */
        .icon-box-flat {
        width: 60px;
        height: 60px;
        background-color: var(--bg-canvas);
        color: var(--portada-purple);
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
        margin-bottom: 20px;
        }
        /* --- BOTONES --- */
        .btn-portada {
        background-color: var(--portada-purple);
        color: white;
        border: none;
        border-radius: 0;
        padding: 10px 20px;
        font-weight: 600;
        text-transform: uppercase;
        font-size: 0.8rem;
        }
        .btn-portada:hover {
        background-color: var(--ivm-dark);
        color: white;
        }
        /* --- TIMELINE --- */
        .timeline-item {
        border-left: 3px solid var(--portada-orange);
        position: relative;
        padding-left: 20px;
        margin-bottom: 20px;
        }
        .timeline-item::before {
        content: "";
        position: absolute;
        left: -10px;
        top: 0;
        width: 18px;
        height: 18px;
        background: var(--portada-purple);
        }
        /* --- FOOTER --- */
        .footer-social {
        background: var(--ivm-dark);
        color: white;
        padding: 60px 0;
        border-top: 10px solid var(--portada-purple);
        }
        .footer-compacto {
        background: var(--portada-purple);
        color: white;
        padding: 0; /* Relleno reducido */
        border-top: 5px solid var(--portada-purple); /* Franja de color más delgada */
        }
        .footer-compacto .logos-footer img {
        filter: brightness(0) invert(1); /* Hace los logos blancos para que resalten */
        opacity: 0.8;
        max-height: 40px;
        }
        .x-small-footer {
        font-size: 0.75rem;
        opacity: 0.7;
        }
        .header-flat {
        background-color: var(--portada-purple) !important; /* Color base sólido */
        color: white;
        padding: 150px 0;
        border-bottom: 8px solid var(--portada-orange) !important; /* Acento naranja */
        position: relative;
        overflow: hidden;
        }
        .header-bg-image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        /* REEMPLAZA ESTA RUTA POR TU IMAGEN 
        background-image: url('https://justatic.com/v/20260406105351/marketing/files/new/production/images/mexico/derecho-electoral/violencia-politica-contra-las-mujeres-en-razon-de-genero.jpg');*/
        background-size: cover;
        background-position: center;
        /* Opacidad baja para que no distraiga del texto */
        opacity: 0.15;
        z-index: 1;
        /* Efecto opcional: escala de grises para que combine con el morado */
        filter: grayscale(100%);
        }
        .header-flat h1 {
        font-family: 'Montserrat', sans-serif; /* Tipografía de la portada */
        font-weight: 800;
        text-transform: uppercase;
        text-shadow: 0 2px 10px rgba(0,0,0,0.3); /* Sombra para resaltar sobre el fondo */
}
/* --- TARJETAS DE INDICADORES --- */
        .card-indicador {
            border: none;
            border-radius: 0;
            background: white;
            border-top: 5px solid transparent;
            transition: 0.3s;
            box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        }
        .card-indicador:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
        .border-purple { border-top-color: var(--portada-purple) !important; }
        .border-orange { border-top-color: var(--portada-orange) !important; }
 .img-noticia{
    height: 250px;      /* alto fijo */
    width: 100%;
    object-fit: cover;  /* recorta sin deformar */
}
        /* --- BOTONES PERSONALIZADOS --- */
        .btn-ivm-purple {
            background-color: var(--portada-purple);
            color: white;
            border-radius: 0;
            font-weight: 700;
            text-transform: uppercase;
            font-size: 0.85rem;
            padding: 12px;
            transition: 0.3s;
        }
        .btn-ivm-purple:hover { background-color: var(--ivm-maroon); color: white; }

        .section-title-alt {
            font-family: 'Montserrat', sans-serif;
            font-weight: 700;
            color: var(--portada-purple);
            border-left: 5px solid var(--portada-orange);
            padding-left: 15px;
        }