.elementor-4449 .elementor-element.elementor-element-35858be{--display:flex;}.elementor-4449 .elementor-element.elementor-element-b94917a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-4449 .elementor-element.elementor-element-16eb931{--spacer-size:104px;}/* Start custom CSS for shortcode, class: .elementor-element-610903fb */<style>
/* 1. IMPORTACIÓN DE FUENTE */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;800&display=swap');

/* 2. CONTENEDOR MAESTRO (Evita que se estire en WordPress) */
.editorial-wrapper-fixed {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    background-color: #fff !important;
}

.editorial-container { 
    max-width: 1200px !important; /* Límite estricto */
    width: 100% !important;
    margin: 0 auto !important; 
    padding: 40px 20px !important; 
    font-family: 'Lato', sans-serif !important; 
    background: #fff !important; 
    box-sizing: border-box !important;
}

.editorial-header { 
    text-align: center; 
    border-bottom: 1px solid #eee; 
    padding-bottom: 40px; 
    margin-bottom: 60px; 
}

.header-top { 
    display: flex; 
    justify-content: space-between; 
    font-size: 11px; 
    letter-spacing: 2px; 
    color: #767676; 
    margin-bottom: 40px; 
}

.main-title { 
    font-family: 'Montserrat', sans-serif !important; 
    font-size: 64px; 
    font-weight: 800; 
    margin: 0; 
    line-height: 1.2;
}

/* 3. GRID (Ajustado para no desbordar) */
.editorial-grid { 
    display: grid; 
    grid-template-columns: 1.5fr 1fr; 
    gap: 60px; 
}

/* AJUSTE AQUÍ: Añadido margen inferior a las fotos */
.main-article img, .side-article img { 
    width: 100%; 
    filter: grayscale(100%); 
    transition: 0.5s; 
    object-fit: cover;
    margin-bottom: 25px !important; /* Espacio después de la foto */
}

.main-article img:hover, .side-article img:hover { 
    filter: grayscale(0%); 
}

/* 4. TÍTULOS (SIN CAMBIO DE COLOR AL PASAR EL MOUSE) */
.article-title { 
    font-family: 'Montserrat', sans-serif !important; 
    font-size: 36px; 
    line-height: 1.3; 
    margin-bottom: 20px; 
    font-weight: 700;
}

.article-title a, .side-title a { 
    text-decoration: none !important; 
    color: #1a1a1a !important; 
    cursor: default !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* BLOQUEO DE COLOR: Forzamos a que NO cambie a verde ni a nada */
.article-title a:hover, 
.side-title a:hover {
    color: #1a1a1a !important; 
    text-decoration: none !important;
}

.side-column { 
    border-left: 1px solid #eee; 
    padding-left: 40px; 
}

.side-title { 
    font-family: 'Montserrat', sans-serif !important; 
    font-size: 20px; 
    line-height: 1.4;
    margin: 15px 0; 
}

.side-article img { height: 200px; }
.separator { border: 0; border-top: 1px solid #eee; margin: 30px 0; }

/* 5. RESPONSIVE */
@media (max-width: 900px) { 
    .editorial-grid { grid-template-columns: 1fr; } 
    .side-column { border-left: none; padding-left: 0; } 
    .main-title { font-size: 48px; }
    .article-title { font-size: 28px; }
}
</style>

<div class="editorial-wrapper-fixed">
    <div class="editorial-container">
        <header class="editorial-header">
            <div class="header-top">
                <span>VOL. 01 / NO. 42</span>
                <span>FEBRERO 2026</span>
                <span>EDICIÓN ESPECIAL</span>
            </div>
            <h1 class="main-title">THE EDITORIAL</h1>
        </header>

        <div class="editorial-grid">
            <div class="main-article">
                <img src="https://via.placeholder.com/800x500" alt="Imagen">
                <h2 class="article-title">
                    <a href="#">Servicios generales: el pilar oculto que impulsa la eficiencia en empresas</a>
                </h2>
                <p>Análisis sobre gestión de propiedades...</p>
            </div>

            <div class="side-column">
                <div class="side-article">
                    <h3 class="side-title">
                        <a href="#">Tendencias en sostenibilidad corporativa</a>
                    </h3>
                </div>
                <hr class="separator">
                <div class="side-article">
                    <h3 class="side-title">
                        <a href="#">Cómo elegir un proveedor confiable</a>
                    </h3>
                </div>
            </div>
        </div>
    </div>
</div>/* End custom CSS */