/* Anímate con el Color del Año Pintuco 2025, Miel Mostaza */

.c-animate__group{
    max-width: 90%;
    margin: auto !important;
    @media(min-width:600px){
        max-width: 50%;
        
    }
    
}

.c-animate__group{
    border-top-right-radius: 50px !important;
    border-bottom-left-radius: 50px !important;
}

.c-animate__group{
    margin-top: -150px !important;
    background: white;
    padding: 40px 10px;
    @media(min-width:600px){
        margin-top: -150px !important;
    }
}

.c-animate__column-1-separador {
    width: 100% !important;
}


/* ============================================================================= */
/* Bloque 2 */
.c-animate__group h2.c-animate__title,
.c-animate__columns-2 .c-animate__column-2 h2.c-animate__title {
    font-size: 32px !important;
    @media(min-width:600px){
        font-size: 41px !important;
    }
}

.c-animate__columns-2 {
    justify-content: center;
}

.c-animate__columns-2 .c-animate__column-2 {
    padding-top: 30px !important;
    padding-bottom: 50px !important;
}

.c-animate__columns-2 .c-animate__column-2 {
    max-width: 90% !important;
    @media(min-width:600px){
        max-width: 70% !important;
    }
}

.c-animate__columns-2 .c-animate__column-2 .c-animate__title {
    justify-content: center;
 }
.c-animate__columns-2 .c-animate__column-2 .c-animate__paragraph-1 {
    width: 100% !important;
    @media(min-width:600px){
        width: 90% !important;
        margin-right: auto !important;
        margin-left: auto !important;

    }
 }

 .c-animate__columns-2 .c-animate__column-2 .c-animate__space-2 {
    height: 40px !important;
    @media(min-width:600px){
        height: 50px !important;
    }
}

/* ============================================================================= */
/* Bloque 3 */

.c-animate__columns-3 .c-animate__column-3 {
    gap: 30px !important;
    display: flex;
    flex-direction: column;
    @media(min-width:600px){
        gap: 50px !important;
        display: flex;
        flex-direction: column;
    }
}
.c-animate__columns-3 .c-animate__column-3 .c-animate__paragraph-2{
    width: 100% !important;
    margin-right: auto !important;
    margin-left: auto !important;
    @media(min-width:600px){
        width: 90% !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }
}
.c-animate__columns-3 .c-animate__column-3 .c-animate__columns-3-col {
    justify-content: center !important;
    gap: 10px !important;
}
.c-animate__columns-3 .c-animate__column-3-col {
    max-width: 100% !important;
    height: 35vw !important;
    
    @media(min-width:600px){
        max-width: 250px !important;
        height: 141px !important;
    }
}

.c-animate__columns-3 .c-animate__column-3-col {
    justify-content: flex-end !important;
    display: flex;
    flex-direction: column;
}

.c-animate__columns-3 .c-animate__column-3-col p.c-animate__paragraph-1,
.c-animate__columns-3 .c-animate__column-3-col p.c-animate__paragraph-2 {
    
    width: 80% !important;
    margin-right: auto !important;
    margin-left: auto !important;
    @media(min-width:600px){
        width: 80% !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }
}
.c-animate__columns-3 .c-animate__column-3-col p.c-animate__paragraph-2 {
    font-weight: 700 !important;
}

.c-animate__columns-3 .c-animate__column-3-col p.c-animate__paragraph-2 {
    margin-bottom: 20px;
}

.c-animate__columns-3 {
    justify-content: center;
    padding-bottom: 50px;
}

.c-animate__columns-3 .c-animate__column-3 .c-animate__image img {
    width: 100%;
    height: 87vw !important;
    object-fit: cover;
    @media(min-width:600px){
        height: 40vw !important;
    }
}
.c-animate__columns-3 .c-animate__column-3 {
    max-width: 90% !important;
    @media(min-width:600px){
        max-width: 70% !important;
    }
}


/* ============================================================================= */
/* Noticias */


.c-color-del-ano-2025_fondo-post .heading-tambien-te {
    
    font-size: 26px !important;
}


.c-color-del-ano-2025_fondo-post figure.c-color-del-ano_imagen-post {
    padding-bottom: 0 !important;
    height: 15vw;
    width: 100%;
  }

  .c-color-del-ano-2025_fondo-post .wp-block-group.c-color-del-ano_contenido-post {
    padding: 15px !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    margin-top: 0 !important;
  }


.c-color-del-ano-2025_fondo-post .wp-block-group.c-color-del-ano_contenido-post {
    padding: 15px !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    margin-top: 0 !important;
  }
  
  .c-color-del-ano-2025_fondo-post .c-color-del-ano_contenido-post {
    align-items: flex-end;
    /* justify-content: canter; */
    justify-content: end;
  }
  
  .c-color-del-ano-2025_fondo-post .c-color-del-ano_fecha-post.wp-block-post-date {
    align-self: flex-start;
  }
  
  .c-color-del-ano-2025_fondo-post .c-color-del-ano_contenido-post::before {
    content: "";
    position: absolute;
    width: 44px;
    height: 44px;
    background: #F8F8F8;
    transform: translate(15px, 15px);
  }

  .c-columns__apps-color-ano li:hover .c-color-del-ano_contenido-post::before {
    background: #39c38e !important;
  }
  
  .c-columns__apps-color-ano li:hover .c-color-del-ano_contenido-post::after {
    filter: brightness(0) saturate(100%) invert(1) !important;
  }
  
  .c-color-del-ano-2025_fondo-post .c-color-del-ano_contenido-post::after {
    content: "";
      background: url(/wp-content/uploads/2023/03/fi-rr-arrow-right.webp);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      position: absolute;
      width: 24px;
      height: 24px;
      transform: translate(7px, 5px);
  }
  
  .c-color-del-ano-2025_fondo-post figure.c-color-del-ano_imagen-post img {
    border-radius: 0;
  }
  .c-color-del-ano-2025_fondo-post figure.c-color-del-ano_imagen-post {
      
      height: 44vw;
      @media(min-width:600px){
          padding-bottom: 0 !important;
          height: 15vw;
          width: 100%;
    }
  }
  
  
  .c-color-del-ano-2025_fondo-post .wp-block-cover__inner-container.has-global-padding.is-layout-constrained.wp-block-cover-is-layout-constrained {
    max-width: 90%;
  }
  
  .c-color-del-ano-2025_fondo-post h2.has-link-color.c-color-del-ano_titulo-post {
    min-height: 90px;
    display: flex;
    align-items: center;
    width: 100%;
  }
  
  .c-color-del-ano-2025_fondo-post h2.has-link-color.c-color-del-ano_titulo-post a {
    font-weight: 700;
    width: 90%;
    line-height: 1.5;
  }
  
  .c-color-del-ano_post-meta {
    display: none;
  }
  
  .c-color-del-ano-2025_fondo-post .wp-block-spacer {
    display: none;
  }

  .c-color-del-ano-2025_fondo-post .paginacion-post {
    display: none;
  }



  /* ==================================================================================== */

  /* Combinar colores en una sala usando el Color del Año Pintuco 2025 */
  
  .c-animate__columns-3 .c-animate__column-3 .c-cambiar__columns-3-col {
    justify-content: center !important;
}

.c-animate__columns-3 .c-cambiar__fila-3 {
    flex-direction: column;
    @media(min-width:600px){
        flex-direction: row;
    }
}
.c-animate__columns-3  .c-cambiar__fila-3 .c-cambiar__image-2  img {
    width: 100%;
    height: 54vw !important;
    @media(min-width:600px){
        height: 40vw !important;
    }
}
.c-animate__columns-3  .c-cambiar__fila-3 .c-cambiar__image-1  img {
    width: 100%;
    height: 88vw !important; 
    @media(min-width:600px){
        height: 40vw !important; 
    }
    
}
    
/* ==================================================================================== */

/* Combinar colores en una sala usando el Color del Año Pintuco 2025 */


.c-animate__columns-3 .c-como__lista-iconos>li::before {
    content: url(/wp-content/uploads/2019/12/estrella-1.webp);
    position: relative;
    top: 5px;
    margin-right: 10px;
}

.c-animate__columns-3 .c-como__lista-iconos>li::marker {
    content: "";
}
.c-animate__columns-3 .c-como__lista-iconos .c-como__lista-iconos-item {
    padding: 1px 0;
}

.c-animate__columns-3 .c-animate__column-3 .c-como__lista-iconos {
    width: 100% !important;
    margin-right: auto !important;
    margin-left: auto !important;
    @media(min-width:600px){
        width: 90% !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }
}