/* Animación swing-in-bottom-bck */
.swing-in-bottom-bck {
    -webkit-animation: swing-in-bottom-bck 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
    animation: swing-in-bottom-bck 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

@-webkit-keyframes swing-in-bottom-bck {
    0% {
        -webkit-transform: rotateX(-70deg);
        transform: rotateX(-70deg);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        opacity: 0;
    }

    100% {
        -webkit-transform: rotateX(0);
        transform: rotateX(0);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        opacity: 1;
    }
}

@keyframes swing-in-bottom-bck {
    0% {
        -webkit-transform: rotateX(-70deg);
        transform: rotateX(-70deg);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        opacity: 0;
    }

    100% {
        -webkit-transform: rotateX(0);
        transform: rotateX(0);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
        opacity: 1;
    }
}

.cf:before,
.cf:after {
    content: "";
    display: table;
    border-collapse: collapse;
}

.cf:after {
    clear: both;
}

.cf {
    min-height: 0;
}

.blog-principal__banner {
    margin-top: 68px;
    background: linear-gradient(to right,
            #FFFFFF 0%,
            #FFFFFF 50%,
            #E6EBF2 50%,
            #E6EBF2 100%);
}

.blog-principal__banner__contenedor {
    position: relative;
    max-width: 1200px;
    height: 340px;
    overflow: hidden;
    border-radius: 0 0 32px 32px;
    margin: 0 auto;
}

.blog-principal__banner__imagen {
    width: 100%;
    height: 100%;
}

.blog-principal__banner__imagen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-principal__banner__titulos {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 320px;
}

.blog-principal__banner__titulos h1 {
    color: var(--Neutral-White, #FFF) !important;
    font-size: 32px;
    font-weight: 700;
    line-height: 34px;
    margin: 0 !important;
}

.blog-principal__banner__titulos p:first-of-type {
    color: var(--Primary-Blue-blue-50, #E6EBF2) !important;
    font-size: 20px;
    line-height: 24px;
    margin: 0 !important;
    margin-bottom: 5px !important;
}

.blog-principal__banner__titulos p {
    color: var(--Neutral-White, #FFF) !important;
    font-size: 14px;
    line-height: 20px;
    margin: 0 !important;
}

.blog-principal__articulos-destacados {
    background: linear-gradient(to right,
            #FFFFFF 0%,
            #FFFFFF 50%,
            #E6EBF2 50%,
            #E6EBF2 100%);
}



.blog-principal__articulos-destacados__contenedor {
    max-width: 1200px;
    margin: 0 auto !important;
    padding: 32px 16px;
    padding-bottom: 100px;
}

.blog-principal__articulos-destacados__slider {
    overflow: visible !important;
    position: relative;
}

.blog-principal__articulos-destacados h2 {
    color: var(--Primary-Blue-blue-900, #001535) !important;
    font-size: 28px !important;
    font-weight: 400 !important;
    line-height: 32px !important;
    margin: 0 !important;
    margin-bottom: 24px !important;
}

.articulo-destacado {
    margin: 0 auto;
    border-radius: var(--Border-Radius-2X-Large, 16px);
    border: 1px solid var(--Primary-Blue-blue-100, #B0BFD7);
    background: var(--Neutral-White, #FFF);
    overflow: hidden;
}

.articulo-destacado__imagen-principal {
    height: 218px;
    overflow: hidden;
}

.articulo-destacado__imagen-principal img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.articulo-destacado:hover .articulo-destacado__imagen-principal img {
    transform: scale(1.1);
}

.articulo-destacado__contenido {
    padding: 12px;
    height: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.articulo-destacado__contenido h3 {
    color: var(--Primary-Blue-blue-900, #001535) !important;
    font-size: 24px;
    font-weight: 700 !important;
    line-height: normal;
    margin: 0 !important;
}

.articulo-destacado__contenido>p {
    color: var(--Neutral-Succes-succes-500, #737373) !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin: 0 !important;
    margin-top: 12px !important;
    margin-bottom: 32px !important;
}

.articulo-destacado__contenido__hashtags {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.articulo-destacado__contenido__hashtags p {
    color: var(--Primary-Blue-blue-500, #00327E);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    margin: 0 !important;
}

.articulo-destacado__contenido a {
    display: flex;
    align-items: center;
    margin: 0 !important;
    margin-top: 8px !important;
    color: var(--Primary-Blue-blue-500, #00327E) !important;
    font-size: var(--type-size-sm, 14px);
    font-weight: 700;
    line-height: var(--type-lineHeight-2, 20px);
    letter-spacing: 0.056px;
    gap: 8px;
    text-decoration: none;
}

.articulo-destacado__contenido h3,
.articulo-destacado__contenido>p,
.articulo-destacado__contenido a,
.articulo-destacado__contenido .hashtag {
    transition: color 0.3s ease;
}

.articulo-destacado__contenido a svg path {
    transition: stroke 0.3s ease;
}

.articulo-destacado:hover .articulo-destacado__contenido {
    background-color: #00327E;
}

.articulo-destacado:hover .articulo-destacado__contenido h3,
.articulo-destacado:hover .articulo-destacado__contenido>p,
.articulo-destacado:hover .articulo-destacado__contenido a,
.articulo-destacado:hover .articulo-destacado__contenido .hashtag {
    color: #FFFFFF !important;
}

.articulo-destacado:hover .articulo-destacado__contenido a svg path {
    stroke: #FFFFFF !important;
}

.swiper-button-next,
.swiper-button-prev {
    top: 110% !important;
}

.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48" fill="none"><rect x="0.5" y="0.5" width="47" height="47" rx="23.5" stroke="%2300327E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M12.8284 20.4646L9.64645 23.6465C9.45119 23.8418 9.45119 24.1584 9.64645 24.3536L12.8284 27.5356C13.0237 27.7309 13.3403 27.7309 13.5355 27.5356C13.7308 27.3404 13.7308 27.0238 13.5355 26.8285L11.2071 24.5001H38V23.5001H11.2071L13.5355 21.1717C13.7308 20.9764 13.7308 20.6598 13.5355 20.4646C13.3403 20.2693 13.0237 20.2693 12.8284 20.4646Z" fill="%2300327E"/></svg>') !important;

}

.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48" fill="none"><rect x="-0.5" y="0.5" width="47" height="47" rx="23.5" transform="matrix(-1 0 0 1 47 0)" stroke="%2300327E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M35.1716 20.4646L38.3536 23.6465C38.5488 23.8418 38.5488 24.1584 38.3536 24.3536L35.1716 27.5356C34.9763 27.7309 34.6597 27.7309 34.4645 27.5356C34.2692 27.3404 34.2692 27.0238 34.4645 26.8285L36.7929 24.5001H10V23.5001H36.7929L34.4645 21.1717C34.2692 20.9764 34.2692 20.6598 34.4645 20.4646C34.6597 20.2693 34.9763 20.2693 35.1716 20.4646Z" fill="%2300327E"/></svg>') !important;
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
    right: 50% !important;
    transform: translateX(-200%);
}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: initial !important;
    left: initial !important;
    top: 110% !important;
    right: 0% !important;
    transform: translate(-50%, -50%) !important;

}

.swiper-pagination {
    position: absolute;
    width: fit-content !important;
    height: fit-content !important;
    color: var(--Neutral-Succes-succes-600, #696969) !important;
    font-family: "Futura Lt BT";
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    display: flex;
    gap: 2px;
    align-items: center;
}

.swiper-pagination span {
    display: block;
}

.swiper-pagination span:first-of-type {
    margin-bottom: 24px;
}

.swiper-pagination span:last-of-type {
    margin-top: 24px;
}

.blog-principal__articulos {
    background-color: #f8f8f9;
}

.blog-principal__articulos__contenedor {
    max-width: 1200px;
    margin: 0 auto !important;
    padding: 44px 16px;
}

.blog-principal__articulos__tab-categorias {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 32px !important;
}

.blog-principal__articulos__tab-categorias button {
    cursor: pointer;
    border-radius: var(--Border-Radius-3X-Large, 24px);
    border: 1px solid var(--Primary-Sky-blue-Sky-blue-400, #ADC4ED);
    background: var(--Primary-Sky-blue-Sky-blue-50, #F5F8FD);
    padding: var(--Spacing-03, 6px) var(--Spacing-06, 14px);
    color: var(--Primary-Blue-blue-300, #5476A9);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.tab-categoria svg {
    display: none;
}

.tab-categoria.active {
    border: 1px solid var(--Primary-Sky-blue-Sky-blue-600, #8AA5D3);
    background: var(--Primary-Sky-blue-Sky-blue-300, #BACDF0);
    color: var(--Primary-Blue-blue-500, #00327E);
    font-weight: 700;
    line-height: 20px;
}

.tab-categoria.active svg {
    display: block;
}

.blog-principal__articulos__tab-categorias button:hover {
    border: 1px solid var(--Primary-Sky-blue-Sky-blue-600, #8AA5D3);
    background: var(--Primary-Sky-blue-Sky-blue-300, #BACDF0);
    color: var(--Primary-Blue-blue-500, #00327E);
    font-weight: 700;
    line-height: 20px;
}

.blog-principal__articulos__listado-articulos {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.blog-principal__articulos__item {
    max-width: 340px;
    opacity: 0;
}

.blog-principal__articulos__item.animate {
    opacity: 1;
}

.blog-principal__articulos__item-imagen {
    height: 210px;
    border-radius: var(--Border-Radius-3X-Large, 24px);
    overflow: hidden;
}

.blog-principal__articulos__item-imagen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.blog-principal__articulos__item:hover .blog-principal__articulos__item-imagen img {
    transform: scale(1.2);
}

.blog-principal__articulos__item-info {
    padding: var(--Spacing-07, 16px) var(--Spacing-07, 16px) var(--Spacing-04, 8px) var(--Spacing-07, 16px);

}

.blog-principal__articulos__item-detalles {
    display: flex;
    gap: 24px;
}

.blog-principal__articulos__item-detalles span {
    color: var(--Neutral-Succes-succes-500, #737373);
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}



.blog-principal__articulos__item-categoria {
    margin-top: 12px;
    color: var(--Primary-Blue-blue-500, #00327E);
    width: fit-content;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    padding: var(--Spacing-03, 6px) var(--Spacing-06, 14px);
    border-radius: var(--Border-Radius-3X-Large, 24px);
    border: 1px solid var(--Primary-Sky-blue-Sky-blue-600, #8AA5D3);
    background: var(--Primary-Sky-blue-Sky-blue-100, #DFE8F8);
}


.blog-principal__articulos__item-titulo h2 {
    color: var(--Primary-Blue-blue-500, #00327E) !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    margin: 6px 0 !important;

}

.blog-principal__articulos__item-texto p {
    color: var(--Neutral-Succes-succes-400, #8F8F8F) !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.blog-principal__articulos__item-link {
    color: var(--Primary-Blue-blue-500, #00327E);
    font-size: var(--type-size-sm, 14px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--type-lineHeight-2, 20px);
    letter-spacing: 0.056px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

.blog-principal__articulos__paginacion-contenedor {
    display: flex;
    justify-content: center;
    margin-top: 36px;
    gap: 32px;

}

.blog-principal__articulos__paginacion-numeros {
    display: flex;
    gap: 20px;
}

.blog-principal__articulos__paginacion-contenedor button {
    background: transparent;
    border: none;
    color: var(--Neutral-Black, #000);
    text-align: center;
    font-size: var(--type-size-base, 16px);
    font-weight: 500;
    line-height: var(--type-lineHeight-3, 24px);
    letter-spacing: 0.064px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.blog-principal__articulos__paginacion-contenedor button p {
    color: var(--Neutral-Black, #000) !important;
    text-align: center;
    font-size: var(--type-size-base, 16px);
    font-weight: 500;
    line-height: var(--type-lineHeight-3, 24px);
    letter-spacing: 0.064px;
    margin: 0 !important;
    margin-bottom: 2px !important;
    display: none;
}

.blog-principal__articulos__paginacion-btn--next:disabled,
.blog-principal__articulos__paginacion-btn--prev:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.blog-principal__articulos__paginacion-numero--active {
    border-radius: 40px;
    background: var(--Primary-Blue-blue-500, #00327E) !important;
    color: #FFFFFF !important;
    /* padding: 12px !important;
     */
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog-principal__form-inscripcion {
    background: #DFE8F8;
    scroll-margin-top: 80px;
}

.blog-principal__form-inscripcion__contenedor {
    max-width: 1200px;
    margin: 0 auto !important;
    padding: 40px 16px;
}

.blog-principal__form-inscripcion__imagen {
    display: none;
}

.blog-principal__form-inscripcion__contenido h2 {
    color: var(--Primary-Blue-blue-900, #001535) !important;
    font-size: 24px;
    font-weight: 400 !important;
    margin: 0 !important;
    margin-bottom: 12px !important;
}

.blog-principal__form-inscripcion__contenido p {
    color: var(--Neutral-Succes-succes-500, #737373) !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin: 0 !important;
    margin-bottom: 24px !important;
}

.blog-principal__form-inscripcion__contenido strong {
    font-weight: 700 !important;
}

.formulario-inscripcion input {
    border-radius: var(--borderRadius-3xl, 24px);
    border: 1px solid var(--Neutral-400, #8F8F8F);
    background: var(--Neutral-White, #FFF);
}

.formulario-inscripcion input::placeholder {
    color: var(--Neutral-Succes-succes-400, #8F8F8F) !important;
}

.formulario-inscripcion__checkboxes {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
}

.checkbox-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.checkbox-wrapper input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    min-width: 20px;
    border: 1px solid #00327E;
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    margin-top: 2px;
    background-color: white;
}

.checkbox-wrapper input[type="checkbox"]:checked {
    background-color: #00327E;
}

.checkbox-wrapper input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 6px;
    top: 3px;
    width: 6px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.checkbox-wrapper label {
    cursor: pointer;
    font-size: 14px;
    line-height: 1.4;
    color: #333;
}

.checkbox-wrapper label a {
    color: #00327E;
    text-decoration: underline;
    font-weight: 600;
}

.checkbox-wrapper label a:hover {
    text-decoration: none;
}

.formulario-inscripcion button {
    border-radius: var(--Border-Radius-Medium, 4px);
    background: var(--Primary-Blue-blue-500, #00327E);
    color: var(--Neutral-White, #FFF);
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    width: 100%;
    padding: var(--Spacing-05, 12px) var(--Spacing-07, 16px);
    border: none;
    cursor: pointer;

}

.formulario-inscripcion button:disabled {
    background: var(--Neutral-Succes-succes-300, #A1A1A1);
    cursor: not-allowed;
}

.formulario-inscripcion__input--error,
.formulario-inscripcion__checkbox--error {
    border-color: #FF0000;
}

.formulario-inscripcion__error {
    color: #FF0000;
    font-size: 12px;
    margin-top: -10px;
    margin-bottom: 12px;
    display: block;
    min-height: 18px;
}

.formulario-inscripcion__error {
    display: none;
}

.blog-principal__form-inscripcion__contenedor__agradecimiento {
    display: none;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 24px;
    max-width: 570px;
    margin: 226px auto;
}

.blog-principal__form-inscripcion__contenedor__agradecimiento h3 {
    color: var(--Primary-Blue-blue-500, #00327E) !important;
    text-align: center;
    font-size: 34px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px;
    margin: 0 !important;
    margin-bottom: 8px !important;
}

.blog-principal__form-inscripcion__contenedor__agradecimiento p {
    color: var(--Neutral-Succes-succes-700, #525252) !important;
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
}

.blog-principal__form-inscripcion__contenedor__agradecimiento button {
    border-radius: var(--Border-Radius-Medium, 4px);
    background: var(--Primary-Blue-blue-500, #00327E);
    padding: var(--Spacing-05, 12px) var(--Spacing-07, 16px);
    color: var(--Neutral-White, #FFF);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    border: none;
    cursor: pointer;
    width: 200px;
}

.btn-fixed-suscribirse {
    position: fixed;
    top: 40%;
    right: -58px;
    transform: translateY(-50%) rotate(-90deg);
    z-index: 1000;
}

.btn-fixed-suscribirse a {
    display: block;
    color: #ffffff;
    margin: 0 !important;
    width: 163px;
    padding: var(--Spacing-05, 12px) var(--Spacing-07, 16px);
    border-radius: 12px 12px 0 0;
    background: var(--Primary-Blue-blue-500, #00327E);
    text-decoration: none;
    text-align: center;
}


.blog-principal__galeria-videos__contenedor {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 16px 64px 16px;

}

.blog-principal__galeria-videos {
    margin-top: 36px;
    background: linear-gradient(to right,
            #E6EBF2 0%,
            #E6EBF2 55%,
            #FFFFFF 55%,
            #FFFFFF 100%);
}

.blog-principal__galeria-videos__header {
    margin-bottom: 32px;
}

.blog-principal__galeria-videos__header h2,
.blog-principal__galeria-fotos__header h2 {
    margin: 0 !important;
    color: #001535 !important;
    font-size: 32px;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 4px !important;
}

.blog-principal__galeria-videos__header p,
.blog-principal__galeria-fotos__header p {
    margin: 0 !important;
    color: #696969 !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.boton-galeria {
    padding: 12px 16px;
    color: #ffffff !important;
    display: block;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    border-radius: var(--Border-Radius-Medium, 4px);
    background: var(--Primary-Blue-blue-500, #00327E);
    text-decoration: none;
}

.boton-galeria-desktop {
    display: none;
    width: 236px;
}

.blog-principal__galeria-videos__principal-link {
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 24px;
}

.blog-principal__galeria-videos__principal-media {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    height: 200px;
}

.blog-principal__galeria-videos__principal-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-principal__galeria-videos__play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.blog-principal__galeria-videos__date {
    display: flex;
    gap: 4px;
    align-items: center;
    color: #737373 !important;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.blog-principal__galeria-videos__principal-title,
.blog-principal__galeria-videos__principal-body h4 {
    margin: 0 !important;
    color: #001535 !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: normal !important;
}

.blog-principal__galeria-videos__videos__cards {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 32px;
}

.blog-principal__galeria-videos__card-btn {
    border: none;
    background: #fff;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.blog-principal__galeria-videos__card-media {
    width: 156px;
    height: 90px;
    overflow: hidden;
    border-radius: 12px;
}

.blog-principal__galeria-videos__card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-principal__galeria-videos__card-body h4,
.blog-principal__galeria-videos__card-body h3 {
    margin: 0 !important;
    color: #001535 !important;
    overflow: hidden;
    color: var(--Primary-Blue-blue-900, #001535) !important;
    text-overflow: ellipsis !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: normal !important;
    text-align: left !important;
    margin-top: 8px !important;
    max-width: 156px;
    max-height: 28px;
}

.blog-principal__galeria-videos__card-btn:hover,
.blog-principal__galeria-videos__card-btn:focus {
    border: 1px solid var(--Primary-Blue-blue-100, #B0BFD7);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.14), 0 0 2px 0 rgba(0, 0, 0, 0.12);
    border-radius: 12px;
}

.blog-principal__galeria-fotos__contenedor {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 16px 56px 16px;
}

.blog-principal__galeria-fotos__header {
    text-align: center;
}

/* ================================
   GALERÍA FOTOS - SOLO SLIDER
================================ */

/* Swiper wrapper */
.blog-principal__galeria-fotos__swiper {
    position: relative;
    overflow: visible;
    /* para que se vean los lados */
}

/* Cada slide */
.blog-principal__galeria-fotos__slide {
    width: 200px !important;
}

.blog-principal__galeria-fotos__slide.swiper-slide-active {
    width: 200px !important;
}

/* Si quieres un poquito más de “protagonismo” sin cambiar height: */
/* .blog-principal__galeria-fotos__slide.swiper-slide-active { transform: scale(1.03); } */

/* Contenedor de la imagen */
.blog-principal__galeria-fotos__media {
    height: 360px;
    /* ✅ requerido */
    border-radius: 16px;
    overflow: hidden;
}

/* Imagen dentro */
.blog-principal__galeria-fotos__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Espacio entre slides */
.blog-principal__galeria-fotos__swiper .swiper-wrapper {
    align-items: center;
}

/* Swiper spaceBetween ya lo manejas por JS,
   pero esto ayuda a que “respire” en mobile si tu spaceBetween es bajo */
.blog-principal__galeria-fotos__swiper .swiper-slide {
    margin-right: 16px;
}

/* ================================
   Flechas
================================ */

.blog-principal__galeria-fotos__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #E1E6ED;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
}

/* (Opcional) sombra suave como en tu referencia */
.blog-principal__galeria-fotos__nav {
    box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
}

/* Prev */
.blog-principal__galeria-fotos__nav--prev {
    left: 10px;
}

.blog-principal__galeria-fotos__nav--prev::before {
    content: "";
    width: 16px;
    height: 16px;
    display: block;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M10 12L6 8L10 4' stroke='%2300327E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
}

/* Next */
.blog-principal__galeria-fotos__nav--next {
    right: 10px;
}

.blog-principal__galeria-fotos__nav--next::before {
    content: "";
    width: 16px;
    height: 16px;
    display: block;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M6 12L10 8L6 4' stroke='%2300327E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
}

@media screen and (min-width:768px) {
    .blog-principal__articulos__listado-articulos {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;
    }

    .blog-principal__banner {
        margin-top: 58px;
        background: linear-gradient(to right,
                #FFFFFF 0%,
                #FFFFFF 40%,
                #E6EBF2 40%,
                #E6EBF2 100%);
    }

    .blog-principal__banner__titulos {
        transform: translate(-80%, -50%);
    }

    .blog-principal__articulos-destacados {
        background: linear-gradient(to right,
                #FFFFFF 0%,
                #FFFFFF 40%,
                #E6EBF2 40%,
                #E6EBF2 100%);
    }

    .blog-principal__articulos-destacados__slider article {
        display: flex;
        align-items: center;
    }

    .articulo-destacado__imagen-principal {
        flex: 0 0 45%;
        flex-basis: 45%;
        flex-shrink: 0;
        height: 300px;
    }

    .articulo-destacado__contenido {
        flex: 1;
        padding: 0 40px;
    }

    .blog-principal__articulos-destacados__contenedor {
        padding-bottom: 0px;
        padding: 60px 30px;
    }

    .swiper-button-next,
    .swiper-button-prev {
        top: -13% !important;
    }

    .swiper-button-prev,
    .swiper-rtl .swiper-button-next {
        left: 70% !important;
    }

    .swiper-button-next,
    .swiper-rtl .swiper-button-prev {
        right: 8% !important;
    }

    .swiper-horizontal>.swiper-pagination-bullets,
    .swiper-pagination-bullets.swiper-pagination-horizontal,
    .swiper-pagination-custom,
    .swiper-pagination-fraction {
        top: -13% !important;

    }

    .articulo-destacado__contenido a {
        margin-top: 15px !important;
    }

    .blog-principal__articulos__contenedor {
        padding: 44px 30px;
    }

    .blog-principal__articulos__paginacion-contenedor button p {
        display: block !important;
    }

    .blog-principal__form-inscripcion__contenedor {
        padding: 40px 30px;
    }

    .formulario-inscripcion__row {
        display: flex;
        gap: 16px;
    }

    .blog-principal__galeria-videos__contenedor {
        padding: 40px 30px 64px 30px;
    }

    .blog-principal__galeria-videos__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .boton-galeria {
        display: none;
    }

    .boton-galeria-desktop {
        display: block;
    }

    .blog-principal__galeria-videos__videos {
        display: flex;
        gap: 24px;
    }

    .blog-principal__galeria-videos__videos__principal {
        flex: 1;
    }

    .blog-principal__galeria-videos__principal-media {
        height: 370px;
    }

    .blog-principal__galeria-videos__videos__cards {
        flex: 0 0 336px;
        max-width: 336px;
        margin-bottom: 0 !important;
        max-height: 440px;
        overflow: auto;
        scrollbar-width: 8px;
        scrollbar-color: #00327E #E9E9E9;
    }

    .blog-principal__galeria-videos__card-btn {
        width: 100%;
    }

    .blog-principal__galeria-videos__principal-link {
        margin-bottom: none !important;
    }

    .blog-principal__galeria-fotos__slide {
        width: auto !important;
        max-width: 300px !important;
    }

    .blog-principal__galeria-fotos__contenedor {
        padding: 0;
    }

    .blog-principal__galeria-fotos__slide.swiper-slide-active {
        width: auto !important;
        max-width: 300px !important;
    }

    .blog-principal__galeria-fotos {
        display: flex;
        padding: 40px 0;
        align-items: center;
        padding-left: 30px;
    }

    .blog-principal__galeria-fotos__header {
        flex: 0 0 294px;
        max-width: 294px;
        min-width: 294px;
        text-align: left;
        margin-right: 24px !important;
    }

    .blog-principal__galeria-fotos__slider {
        flex: 1;
        min-width: 0;
    }

    .btn-galeria-fotos {
        margin-top: 64px;
    }

}

@media screen and (min-width:1024px) {
    .blog-principal__banner__titulos h1 {
        font-size: 62px;
        line-height: normal;
    }

    .blog-principal__banner__titulos p:first-of-type {
        font-size: 20px;
        line-height: 24px;
    }

    .blog-principal__banner__titulos p {
        font-size: 14px;
        line-height: 20px;
    }

    .articulo-destacado__imagen-principal {
        flex: 0 0 518px;
        flex-basis: 518px;
        height: 340px;
    }

    .swiper-button-prev,
    .swiper-rtl .swiper-button-next {
        left: 75% !important;
    }

    .articulo-destacado__contenido a {
        margin-top: 40px !important;
    }

    .blog-principal__form-inscripcion__contenedor__formulario {
        display: flex;
        align-items: center;
        gap: 40px;
    }

    .blog-principal__form-inscripcion__imagen {
        display: block;
        width: 50%;
        position: relative;
    }

    .blog-principal__form-inscripcion__imagen img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: var(--Border-Radius-X-Large, 12px);
        position: relative;
        z-index: 10;
    }

    .blog-principal__form-inscripcion__imagen::after {
        content: "";
        position: absolute;
        top: -10px;
        right: -10px;
        width: 451px;
        height: 418px;
        border-radius: var(--Border-Radius-Medium, 4px);
        background: var(--Primary-Sky-blue-Sky-blue-400, #ADC4ED);
        z-index: 1;
    }

    .blog-principal__form-inscripcion__contenido {
        width: 50%;
    }
}

@media screen and (min-width:1280px) {

    .swiper-button-prev,
    .swiper-rtl .swiper-button-next {
        left: 80% !important;
    }

    .swiper-button-next,
    .swiper-rtl .swiper-button-prev {
        right: 5% !important;
    }

    .blog-principal__articulos-destacados__contenedor {
        padding: 60px 72px;
        overflow: hidden;
    }

    .blog-principal__articulos__contenedor {
        padding: 48px 50px;
    }

    .blog-principal__form-inscripcion__contenedor {
        padding: 40px 72px;
    }

    .blog-principal__galeria-videos__contenedor {
        padding: 80px 72px;
    }

    .blog-principal__galeria-fotos__media {
        height: 540px;
        border-radius: 16px;
        overflow: hidden;
    }

    .blog-principal__galeria-fotos__slide {
        width: auto !important;
        max-width: none !important;
    }

    .blog-principal__galeria-fotos__slide.swiper-slide-active {
        width: auto !important;
        max-width: none !important;
    }

    .blog-principal__galeria-fotos {
        padding-left: 8%;
    }
}

@media screen and (min-width:1440px) {
    .blog-principal__galeria-fotos {
        padding-left: 20%;
    }
}