@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Playfair+Display&family=Roboto&display=swap');
    @font-face {
        font-family: 'Antonio-PI';
        src: url('https://maquetas.prensaiberica.es/mktpi360/hubdigital/codigos/premios-beauty/antonio.ttf') format('truetype');
        font-family: 'Perandory Condensed';
        src: url('https://maquetas.prensaiberica.es/mktpi360/hubdigital/codigos/premios-beauty/perandory1.otf') format('opentype');
    }
    
    header.scrollytelling,
    header.scrollytelling .main-menu,
    header.scrollytelling .main-menu nav:after,
    header.scrollytelling .main-menu nav:before,
    footer.scrollytelling,
    .scrollytelling {
        background: #d1270d;
    }
    
    body,
    html {
        margin: 0;
        padding: 0;
        font-family: 'Perandory Condensed', sans-serif;
    }
    
    a {
        text-decoration: none;
    }
    
    .
    /* Galeria bonita */
    
    .prueba-tarjeta {
        margin: 0;
        font-family: Arial, sans-serif;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 95vh;
    }
    
    .container-galeria {
        display: flex;
        flex: 1;
        max-width: 1600px;
        padding: 0 0rem;
        margin: 0 auto;
        overflow: auto;
        align-items: flex-start;
        justify-content: center;
    }
    
    .card-galeria {
        flex: 1 1 1%;
        position: relative;
        opacity: 0.2;
        transition: flex 600ms cubic-bezier(0.25, 1, 0.5, 1), opacity 250ms ease;
    }
    
    .card-galeria:hover {
        flex-basis: 50%;
    }
    
    .card-galeria__inner {
        margin: 0.25rem;
        background: #fff;
        border-radius: 8px;
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    
    .card-galeria picture {
        width: 100%;
        height: 0;
        padding-bottom: 500px;
        padding-top: 300px !important;
        overflow: hidden;
        position: relative;
    }
    
    .card-galeria picture img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
    
    .card-galeria picture video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
    
    .card-galeria.is-active,
    .card-galeria:hover {
        opacity: 1;
    }
    
    .card-galeria:nth-child(2),
    .card-galeria:nth-child(5),
    .card-galeria:nth-child(9) {
        margin-top: 0;
    }
    
    .card-galeria:nth-child(2),
    .card-galeria:nth-child(4),
    .card-galeria:nth-child(6),
    .card-galeria:nth-child(8),
    .card-galeria:nth-child(10) {
        margin-top: 2.5%;
    }
    
    .card-galeria:nth-child(3),
    .card-galeria:nth-child(7) {
        margin-top: 5%;
    }
    /* Galeria bonita */
    
    .scrollytelling .slide {
        width: 100vw;
        height: auto;
        position: unset;
        display: block;
    }
    
    .separator-container {
        width: 100%;
        text-align: center;
        margin-bottom: -30px;
        margin-left: -20px;
        padding: 20px;
    }
    
    .custom-separator {
        display: inline-block;
        width: 20%;
        height: 4px;
        background-color: #fdfeff;
        margin-bottom: 80px;
        border: none;
        margin-top: -30px;
    }
    
    .bloque-fondo-con-caja {
        position: relative;
        width: 100%;
        height: auto;
        overflow: hidden;
    }
    
    .bloque-fondo-con-caja-1 {
        position: relative;
        width: 100%;
        height: auto;
        overflow: hidden;
    }
    
    .imagen-fondo img {
        width: 100%;
        height: auto;
        display: block;
    }
    /* Capa oscura sobre la imagen */
    
    .capa-opacidad {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.2);
        z-index: 1;
    }
    /* Caja de texto flotante en la parte baja derecha */
    
    .caja-texto-flotante {
        position: absolute;
        top: 120px;
        right: 40px;
        background-color: #d1270d;
        color: white;
        padding: 30px;
        width: 660px;
        border-radius: 8px;
        z-index: 2;
        box-shadow: 0 8px 20px #d1270d;
    }
    
    .caja-texto-flotante h3 {
        font-size: 32px;
        font-weight: bold;
        margin-bottom: 15px;
        font-family: 'Perandory Condensed';
        text-align: center;
        color: #d1270d;
    }
    
    .caja-texto-flotante p {
        font-size: 40px;
        line-height: 1.5;
        margin-bottom: 20px;
        font-family: 'Perandory Condensed';
        font-weight: bold;
        text-align: center;
    }
    
    .caja-texto-flotante a {
        text-decoration: none;
        color: inherit;
    }
    
    .caja-texto-flotante a:hover {
        color: #d1270d;
    }
    
    .video-thumbnail {
        height: 250px;
        width: 100%;
        overflow: hidden;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .video-thumbnail img,
    .video-thumbnail video {
        height: 100% !important;
        width: 100%;
        object-fit: cover;
        display: block;
    }
    
    .video-preview {
        position: relative;
        width: 100%;
        height: 250px;
        /* ← valor clave */
        overflow: hidden;
        cursor: pointer;
        border-radius: 4px;
    }
    
    .video-preview img,
    .video-preview video {
        height: 100% !important;
        width: 100%;
        object-fit: cover;
        display: block;
    }
    
    .icono-play {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: rgba(255, 255, 255, 0.8);
        color: #d1270d;
        font-size: 32px;
        width: 60px;
        height: 60px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: bold;
        pointer-events: none;
    }
    
    .boton-articulo {
        display: inline-block;
        background-color: #ffffff;
        color: #d1270d;
        padding: 10px 20px;
        text-align: center;
        text-decoration: none;
        border-radius: 18px;
        font-weight: bold;
        transition: all 0.3s ease;
        margin-top: 20px;
        font-family: 'Bebas Neue', sans-serif;
        font-size: 24px;
    }
    
    .boton-articulo:hover {
        background-color: white;
        color: #d1270d;
    }
    
    .firma-2 {
        font-size: 35px;
        margin: 0 auto;
        text-align: center;
        width: 70%;
        font-family: 'Perandory Condensed';
        color: #d1270d;
    }
    
    .logos-medios {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        gap: 30px;
        width: 100%;
        margin-bottom: 50px;
        margin-top: 20px;
        margin-left: auto;
    }
    
    .logos-medios img {
        max-height: 250px;
        width: auto;
        object-fit: contain;
        opacity: 0.9;
    }
    
    .hero {
        position: relative;
        height: 100vh;
        background-size: cover;
        background-position: center;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-family: 'Perandory Condensed';
        overflow: hidden;
    }
    /* VIDEO dentro de picture (galería bonita) */
    
    .card-galeria picture video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
    }
    /* VIDEO dentro de la miniatura previa (rejilla de premios) */
    
    .video-preview video {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 4px;
        display: block;
    }
    /* Evitar salto visual al sustituir imagen por video */
    
    .video-preview {
        position: relative;
        overflow: hidden;
    }
    /* Ocultar miniaturas cuando el video empieza */
    
    .video-preview.reproduciendo img,
    .video-preview.reproduciendo .icono-play {
        opacity: 0;
        transition: opacity 0.3s ease;
    }
    /* Galeria bonita */
    
    .mod-parallax-container {
        background-image: url("https://maquetas.prensaiberica.es/mktpi360/hubdigital/codigos/foro-alia-ia/club.jpg");
        min-height: 300px;
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        margin: 50px 0px 0px 0px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .mod-parallax-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        /* Tramado negro con opacidad */
        z-index: 1;
    }
    
    .mod-parallax-text {
        position: relative;
        z-index: 2;
        color: white;
        font-family: Helvetica, Arial, sans-serif;
        font-size: 3em;
        text-align: center;
    }
    /* Oscurecimiento completo de fondo */
    
    .hero::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.30) !important;
        z-index: 1;
    }
    /* Degradado inferior (parte baja, extra) */
    
    .degradado-inferior {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 120px;
        background: linear-gradient(to bottom, rgba(4, 4, 117, 0) 0%, rgb(255, 255, 255) 80%);
        z-index: 2;
    }
    
    .degradado-superior {
        position: absolute;
        top: 0;
        width: 100%;
        height: 60px;
        background: linear-gradient(to top, rgba(4, 4, 117, 0) 0%, rgb(255, 255, 255) 80%);
        z-index: 2;
    }
    
    .hero-content {
        position: relative;
        z-index: 3;
        max-width: 80%;
        margin-top: -120px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 30px;
        /* espacio entre el logo y el texto */
        flex-wrap: wrap;
        /* para que se adapte en móvil */
    }
    
    .hero-content-1 {
        position: relative;
        z-index: 3;
        max-width: 80%;
        margin-top: 530px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 30px;
        /* espacio entre el logo y el texto */
        flex-wrap: wrap;
        /* para que se adapte en móvil */
    }
    
    .epigrafe {
        font-size: 30px;
        font-weight: bold;
        color: white;
        font-family: 'Perandory Condensed';
    }
    
    .titulo {
        font-size: 85px;
        margin-bottom: 1rem;
        color: #d1270d;
        font-family: 'Perandory Condensed';
    }
    
    .subtitulo {
        font-size: 20px;
        line-height: 1.6;
        color: whitesmoke;
        width: 90%;
        margin: 0 auto;
        font-family: 'Perandory Condensed';
        font-weight: bold;
    }
    
    .bloque-principal {
        width: 100%;
        background-color: rgb(255, 255, 255);
    }
    
    .bloque-texto {
        width: 100%;
        margin-top: 0px;
    }
    
    .bloque-texto .entradilla {
        font-size: 26px;
        text-align: center;
        font-weight: bold;
        width: 80%;
        margin: 0 auto;
        color: #d1270d;
    }
    
    .bloque-texto .firma {
        text-align: center;
        padding: 40px;
        font-family: 'Perandory Condensed';
        font-size: 30px;
        color: #d1270d;
    }
    
    .bloque-texto .contenido {
        font-family: 'Antonio-PI';
        font-size: 22px;
        line-height: 1.6;
        max-width: 900px;
        margin: 0 auto;
        text-align: justify;
        color: #000000;
    }
    
    .bloque-texto .contenido-1 {
        font-family: 'Perandory Condensed';
        font-size: 22px;
        line-height: 1.6;
        max-width: 900px;
        margin-top: -80px;
        margin-right: auto;
        margin-left: auto;
        text-align: justify;
        color: #d1270d;
    }
    /* Botón cabecera */
    
    .boton-container {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 137px;
        z-index: 9;
        position: absolute;
    }
    
    .boton-flecha {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 60px;
        background-color: #d1270d;
        color: #ffffff;
        border-radius: 50%;
        text-decoration: none;
        transition: all 0.3s ease;
        box-shadow: 0 0 24px rgba(255, 255, 255, 0.6);
        animation: glow 1s ease-in-out infinite alternate;
        margin-bottom: 10px;
    }
    
    .boton-flecha:hover {
        background-color: #f66953;
        color: white;
        box-shadow: 0 0 18px rgba(255, 255, 255, 0.6);
    }
    
    .flecha-icono {
        width: 30px;
        height: 30px;
    }
    
    .contenedor-cajas {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        width: 80%;
        margin: 20px auto;
        padding-top: 40px;
        padding-bottom: 40px;
    }
    
    .caja-destacada {
        background-color: #fff;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
        text-decoration: none;
        color: white;
        display: block;
        transition: transform 0.2s ease;
    }
    
    .caja-destacada-2 {
        background-color: #74acd7;
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
        text-decoration: none;
        color: white;
        display: block;
        transition: transform 0.2s ease;
    }
    
    .caja-destacada:hover {
        transform: scale(1.02);
    }
    
    .caja-destacada-2:hover {
        transform: scale(1.02);
    }
    
    .caja-destacada img {
        width: 100%;
        height: auto;
        display: block;
    }
    
    .caja-destacada .boton-articulo {
        display: inline-block;
        background-color: #74acd7;
        color: white;
        padding: 10px 30px;
        text-align: center;
        text-decoration: none;
        border-radius: 4px;
        font-weight: bold;
        transition: all 0.3s ease;
        margin-left: 200px;
        font-family: 'Perandory Condensed';
        font-size: 18px;
        margin-bottom: 20px;
        margin-top: 10px;
    }
    
    .caja-destacada .boton-articulo-1 {
        display: inline-block;
        background-color: #74acd7;
        color: white;
        padding: 10px 30px;
        text-align: center;
        text-decoration: none;
        border-radius: 4px;
        font-weight: bold;
        transition: all 0.3s ease;
        margin-left: 60px;
        font-family: 'Perandory Condensed';
        font-size: 18px;
        margin-bottom: 20px;
        margin-top: 10px;
    }
    
    .caja-destacada .titulo {
        font-family: 'Perandory Condensed';
        font-size: 30px;
        padding: 20px;
        text-align: center;
        color: white;
        margin: 0 auto;
    }
    
    .caja-destacada .titulo a {
        color: inherit;
        position: relative;
        text-decoration: none;
        pointer-events: auto;
    }
    
    .enlace-caja {
        text-decoration: none;
        color: inherit;
        display: block;
    }
    
    .enlace-caja:hover {
        background-color: rgba(255, 127, 80, 0.1);
    }
    
    .caja-destacada .titulo-1 {
        font-family: 'Antonio-PI';
        font-size: larger;
        font-weight: 600;
        padding: 20px;
        text-align: center;
        color: black;
        margin: 0 auto;
    }
    
    .epigrafe-caja {
        font-family: 'Antonio-PI';
        font-size: large;
        color: white;
        text-align: center;
        padding: 14px 14px;
        text-transform: uppercase;
        background-color: #d1270d;
        font-weight: 800;
    }
    
    .epigrafe-caja-1 {
        font-family: 'Antonio-PI';
        font-size: 18px;
        color: white;
        text-align: center;
        padding: 12px 12px;
        text-transform: uppercase;
        background-color: #d1270d;
    }
    
    .firma-caja {
        font-family: 'Antonio-PI';
        font-size: 18px;
        color: #d1270d;
        text-align: center;
        padding: 0px 12px 12px;
        font-weight: bold;
    }
    
    .contenedor-entrevistas {
        background-color: #d1270d;
        padding: 40px 20px;
        font-family: 'Antonio-PI';
        display: flex;
    }
    
    .titulo-entrevistas {
        display: flex;
        align-items: center;
        color: white;
        font-size: 30px;
        font-weight: bold;
        margin-bottom: 30px;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-family: 'Antonio-PI';
        padding: 40px;
    }
    
    .icono-entrevista {
        height: 40px;
        margin-right: 12px;
    }
    
    .grid-entrevistas {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 16px;
        width: 90%;
        margin: 0 auto;
    }
    
    .tarjeta-entrevista {
        background-color: white;
        border-radius: 6px;
        overflow: hidden;
        text-decoration: none;
        color: inherit;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
        transition: transform 0.3s ease;
        margin-right: 10px;
    }
    
    .tarjeta-entrevista:hover {
        transform: translateY(-4px);
    }
    
    .tarjeta-entrevista img {
        width: 100%;
        height: 220px;
        /* puedes ajustar este valor */
        object-fit: cover;
        display: block;
    }
    
    .categoria {
        font-family: 'Bebas Neue', sans-serif;
        color: white;
        font-size: 14px;
        text-align: center;
        padding: 5px;
        letter-spacing: 0.5px;
        background-color: coral;
    }
    
    .titulo-noticia {
        font-size: 22px;
        font-weight: bold;
        color: #001a66;
        text-align: center;
        padding: 10px 14px 6px;
    }
    
    .firma-noticia {
        font-size: 14px;
        color: darkblue;
        text-align: center;
        padding-bottom: 16px;
        font-weight: bold;
    }
    
    .firma-1 {
        font-size: 18px;
        margin: 0 auto;
        text-align: center;
        width: 70%;
        padding: 10px;
        color: white;
        font-family: PlayFair Display;
    }
    
    .imagen-galeria-contenedor {
        position: relative;
        max-width: 700px;
        margin: 40px auto;
    }
    
    .imagen-galeria-enlace {
        display: block;
        position: relative;
        width: 100%;
    }
    
    .imagen-galeria {
        width: 100%;
        height: auto;
        display: block;
        border-radius: 8px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    }
    /* Capa negra entre imagen y botón */
    
    .overlay-negro {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0);
        border-radius: 8px;
        z-index: 1;
    }
    /* Botón superpuesto */
    
    .icono-superpuesto {
        position: absolute;
        top: 70%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: #d1270d;
        color: white;
        padding: 18px 36px;
        font-size: 24px;
        font-family: 'Bebas Neue', sans-serif;
        border-radius: 50px;
        text-transform: uppercase;
        pointer-events: none;
        display: flex;
        align-items: center;
        box-shadow: 0 0 14px rgba(0, 0, 0, 0.5);
        z-index: 2;
    }
    
    .icono-superpuesto .icono-camara {
        width: 28px;
        height: 28px;
        stroke: white;
        fill: none;
    }
    
    .page-wrapper {
        margin: 0;
        padding: 0;
        overflow-x: hidden;
    }
    
    .parallax-container {
        position: relative;
        height: 200px;
        width: 100%;
        overflow: hidden;
    }
    
    .parallax-image {
        position: absolute;
        top: 0;
        left: 50%;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        transform: translateX(-50%);
    }
    
    .overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0.6;
        /* Opacidad al 60% */
    }
    
    .text-overlay-container {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
        color: white;
        width: 90%;
        /* Ancho ajustado para el contenedor del texto */
    }
    
    .epigraph img {
        height: 80px;
        margin-top: 10px;
        /* Ajusta el tamaño de la imagen del epígrafe */
    }
    
    .text-overlay {
        font-size: 80px;
        font-weight: bold;
        line-height: 1.2;
        font-family: 'Bebas Neue', sans-serif;
    }
    
    .caja-texto-cita {
        position: absolute;
        bottom: 5%;
        left: 50%;
        transform: translateX(-50%);
        width: 80%;
        max-width: 900px;
        background-color: #d1270d;
        color: white;
        padding: 40px 30px;
        border-radius: 10px;
        z-index: 2;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
        font-family: 'Antonio-PI';
        font-size: 18px;
        line-height: 1.4;
        text-align: center;
        font-weight: bold;
    }
    
    .caja-texto-cita h3 {
        font-size: larger;
        line-height: 1.5;
        margin-bottom: 20px;
        font-family: "PlayFair Display", serif;
        font-weight: bold;
        text-align: center;
        color: white;
    }
    
    .caja-texto-cita a h3 {
        color: white;
        text-decoration: none;
        position: relative;
        z-index: 10;
    }
    
    .caja-texto-cita a:hover h3 {
        color: #ffffff;
    }
    
    .caja-texto-cita-1 {
        position: absolute;
        bottom: 5%;
        left: 50%;
        transform: translateX(-50%);
        width: 80%;
        max-width: 900px;
        background-color: #d1270d;
        color: white;
        padding: 40px 30px;
        border-radius: 10px;
        z-index: 2;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
        font-family: 'Antonio-PI';
        font-size: 18px;
        line-height: 1.4;
        text-align: center;
        font-weight: bold;
    }
    
    .caja-texto-cita-1 h3 {
        font-size: large;
        line-height: 1.5;
        margin-bottom: 10px;
        margin-top: 10px;
        font-family: "Roboto", serif;
        font-weight: bold;
        text-align: center;
        color: white;
    }
    
    .caja-texto-cita-1 a h3 {
        color: white;
        text-decoration: none;
        position: relative;
        z-index: 10;
    }
    
    .caja-texto-cita-1 a:hover h3 {
        color: #ffffff;
    }
    
    .rejilla-cajas {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 20px;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: -90px;
        margin-right: auto;
        width: 90%;
        padding: 20px 0;
    }
    
    .rejilla-cajas-1 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        /* 4 columnas en escritorio */
        gap: 20px;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: auto;
        margin-right: auto;
        width: 90% !important;
        padding: 20px 0;
    }
    
    .rejilla-cajas-2 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 51px;
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: auto;
        margin-right: auto;
        width: 80% !important;
        padding: 20px 0;
    }
    
    .logo-mediterraneo {
        max-width: 50px;
        height: 20px;
        margin: 0 10px 0 0;
    }
    
    .video-thumbnail--alto {
        height: 400px;
    }
    
    .video-thumbnail--bajo {
        height: 180px;
    }
    
    @keyframes glow {
        from {
            box-shadow: 0 0 6px rgba(255, 255, 255, 0.2);
        }
        to {
            box-shadow: 0 0 12px rgba(255, 255, 255, 0.5);
        }
    }
    
    @media (max-width: 768px) {
        .hero {
            position: relative;
            height: 91vh !important;
            background-size: cover;
            background-position: center;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            font-family: 'Perandory Condensed';
            overflow: hidden;
        }
        .icono-superpuesto {
            position: absolute;
            top: 70%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: #d1270d;
            color: white;
            padding: 6px -4px !important;
            font-size: 14px !important;
            font-family: 'Bebas Neue', sans-serif;
            border-radius: 50px;
            text-transform: uppercase;
            pointer-events: none;
            display: flex;
            align-items: center;
            box-shadow: 0 0 14px rgba(0, 0, 0, 0.5);
            z-index: 2;
        }
        .bloque-texto .contenido {
            width: 85%;
            margin: 0 auto;
            font-size: 18px;
            font-family: 'Antonio-PI';
        }
        .bloque-texto .contenido-1 {
            width: 85%;
            margin-top: -20px;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 0;
            font-size: 18px;
        }
        .caja-texto-cita h3 {
            font-size: 28px;
        }
        .caja-texto-cita a h3 {
            text-decoration: none !important;
        }
        .caja-texto-cita a:hover h3 {
            text-decoration: none !important;
        }
        .caja-texto-cita-1 p {
            display: none;
        }
        .caja-texto-cita-1 h3 {
            font-size: 24px;
        }
        .boton-flecha {
            margin-bottom: 10px;
        }
        .contenedor-cajas {
            grid-template-columns: 1fr;
            padding: 20px;
        }
        .hero {
            height: 100vh;
        }
        .scrollytelling .slide-html>div {
            margin-bottom: -1px;
        }
        .titulo {
            font-size: 50px;
            width: 100%;
            margin: 0 auto;
        }
        .bloque-texto .firma {
            font-size: 22px;
        }
        .subtitulo {
            display: none;
        }
        .logo-noroeste-1 {
            max-width: 100px;
            height: auto;
            margin-right: 10px;
            margin-top: 80px;
            margin-bottom: 0px;
        }
        .titulo-seccion-noroeste {
            display: flex;
            align-items: center;
            text-align: center;
            margin: 0 auto;
            width: 90%;
            flex-direction: column;
        }
        .titulo-seccion-noroeste h2 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 72px;
            font-weight: 800;
            color: whitesmoke;
            text-transform: uppercase;
            letter-spacing: 1px;
            line-height: 1.2;
            width: 60%;
            margin: 0 auto;
        }
        .video-caratula {
            display: none;
        }
        .video-caratula .video-poster img {
            width: 100%;
            margin: 0 auto;
        }
        .contenedor-entrevistas {
            padding: 0px 30px;
            display: block;
        }
        .separator-container {
            padding: 0px;
            margin-top: 60px;
            margin-bottom: auto;
            margin-right: auto;
            margin-left: auto;
        }
        .custom-separator {
            margin-top: 0px;
            width: 40%;
        }
        .firma-2 {
            width: 100%;
            font-size: 28px;
            color: #d1270d;
        }
        .firma-1 {
            width: 90%;
            padding: 10px;
            font-size: 14px;
        }
        .categoria {
            font-size: 15px;
        }
        .titulo-entrevistas {
            margin-bottom: 0px;
            padding: 20px;
        }
        .logos-medios {
            margin-bottom: 40px;
            width: 90%;
            margin-left: auto;
            margin-right: auto;
        }
        .logos-medios img {
            max-height: 90px;
            width: auto;
            object-fit: contain;
            opacity: 0.9;
        }
        .hero-content {
            flex-direction: column;
            gap: 10px;
            margin-bottom: 50%;
        }
        .boton-container {
            margin-top: -10px;
        }
        .caja-texto-flotante {
            position: absolute;
            top: 40%;
            left: 50%;
            transform: translateX(-50%);
            width: 90%;
            padding: 20px;
            z-index: 2;
            background-color: #5d9eab;
            color: white;
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
        }
        .bloque-fondo-con-caja {
            display: flex;
            flex-direction: column;
            height: 60vh;
        }
        .bloque-fondo-con-caja-1 {
            display: flex;
            flex-direction: column;
            height: 70vh;
        }
        .imagen-fondo img {
            height: auto;
        }
        .parallax-container {
            height: 10vh;
        }
        .text-overlay-container {
            top: 50%;
            /* Mantener centrado en móviles */
            width: 100%;
            /* Ancho ajustado para el contenedor del texto en móviles */
            padding: 0 5%;
            /* Añadir un pequeño padding para evitar que el texto toque los bordes */
        }
        .epigraph img {
            height: 40px;
            /* Ajusta el tamaño de la imagen del epígrafe para móviles */
            margin-bottom: 10px;
            /* Ajuste de margen para móviles */
        }
        .text-overlay {
            font-size: 46px;
            /* Tamaño del título a 36px en móviles */
            font-weight: bold;
            /* Título en negrita */
            line-height: 1.2;
            /* Ajuste de la altura de línea */
            width: 100%;
            /* Asegura que el título ocupe el 100% del ancho del contenedor */
            max-width: none;
            /* Asegura que el título no tenga un ancho máximo limitado */
        }
        .icono-superpuesto {
            gap: 6px;
            font-size: 17px;
            padding: 16px;
        }
        caja-texto-flotante p {
            font-size: 26px;
        }
        .epigrafe-caja-1 {
            font-size: 20px;
            padding: 8px 8px;
        }
        .rejilla-cajas {
            grid-template-columns: 1fr;
            padding: 20px 0;
            margin-left: auto;
        }
        .rejilla-cajas-1 {
            grid-template-columns: repeat(1, 1fr);
            /* 2 columnas en móvil */
        }
        .rejilla-cajas-2 {
            grid-template-columns: repeat(1, 1fr);
            /* 2 columnas en móvil */
        }
        .caja-destacada .titulo {
            font-size: 30px;
            width: 90%;
            margin: 0 auto;
        }
        .caja-destacada .titulo-1 {
            font-size: 20px;
            padding: 15px 5px;
        }
        .caja-destacada .boton-articulo {
            margin-left: 110px;
            font-size: 16px;
            margin-top: 0px;
        }
        .caja-texto-flotante h3 {
            font-size: 22px;
        }
        .caja-texto-flotante p {
            font-size: 32px;
        }
        .degradado-superior {
            height: 10px;
        }
        .degradado-inferior {
            height: 30px;
        }
        .caja-texto-cita {
            font-size: 14px;
            width: 90%;
            padding: 15px 30px;
        }
        .boton-articulo {
            font-size: 16px;
            margin-top: 20px;
        }
        .logo-mediterraneo {
            height: 14px;
            margin: 0 5px 0 0;
        }
        .capa-opacidad {
            height: auto;
        }
        .video-thumbnail {
            height: 200px;
        }
        .epigrafe-caja {
            font-size: 16px;
            padding: 8px 8px;
        }
        h2 a,
        h3 a,
        h4 a,
        .bloque-cita a,
        .caja-texto-cita a {
            text-decoration: none !important;
        }
        .empresario-card {
            flex: 32 41 120px;
            width: 130px !important;
            height: 240px !important;
            text-align: center;
            min-width: 130px !important;
        }
        .empresario-card img {
            border-radius: 8px;
            width: 120px !important;
            height: 120px !important;
            object-fit: cover;
            margin-bottom: 4px;
        }
        .galeria-listado {
            gap: 0px
        }
        .galeria-empresarios {
            padding: 0px 0% 50px 0% !important;
            text-align: center;
        }
        .empresa {
            margin: 0;
            font-size: 9px;
            color: #555;
        }
        .nombre {
            margin: 0;
            color: #004d71;
            font-size: 12px;
            font-weight: bold;
        }
        .card:hover {
            flex-basis: 100%;
        }
        .card picture {
            width: 100%;
            height: 0;
            padding-bottom: 500px;
            overflow: hidden;
            position: relative;
        }
        .card-galeria picture {
            width: 100%;
            height: 0;
            padding-bottom: 150px;
            padding-top: 280px !important;
            overflow: hidden;
            position: relative;
        }
    }
    /*CARRUSEL*/
    
    .about-title {
        font-size: 7.5rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: -0.02em;
        position: absolute;
        top: 45px;
        left: 50%;
        transform: translateX(-50%);
        pointer-events: none;
        white-space: nowrap;
        font-family: "Arial Black", "Arial Bold", Arial, sans-serif;
        background: linear-gradient( to bottom, rgb(8 42 123 / 35%) 30%, rgb(255 255 255 / 0%) 76%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        justify-content: center;
    }
    
    .carousel-container {
        width: 100%;
        max-width: auto;
        height: 450px;
        position: relative;
        perspective: 1000px;
        margin-top: 80px;
        justify-content: center;
    }
    
    .carousel-track {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        transform-style: preserve-3d;
        transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
    
    .card {
        position: absolute;
        width: 280px;
        height: 380px;
        background: white;
        border-radius: 20px;
        overflow: hidden;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
        transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        cursor: pointer;
        justify-content: center;
    }
    
    .card img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        justify-content: center;
    }
    
    .card.center {
        z-index: 10;
        transform: scale(1.1) translateZ(0);
    }
    
    .card.center img {
        filter: none;
    }
    
    .card.left-2 {
        z-index: 1;
        transform: translateX(-400px) scale(0.8) translateZ(-300px);
        opacity: 0.7;
    }
    
    .card.left-2 img {
        filter: grayscale(100%);
    }
    
    .card.left-1 {
        z-index: 5;
        transform: translateX(-200px) scale(0.9) translateZ(-100px);
        opacity: 0.9;
    }
    
    .card.left-1 img {
        filter: grayscale(100%);
    }
    
    .card.right-1 {
        z-index: 5;
        transform: translateX(200px) scale(0.9) translateZ(-100px);
        opacity: 0.9;
    }
    
    .card.right-1 img {
        filter: grayscale(100%);
    }
    
    .card.right-2 {
        z-index: 1;
        transform: translateX(400px) scale(0.8) translateZ(-300px);
        opacity: 0.7;
    }
    
    .card.right-2 img {
        filter: grayscale(100%);
    }
    
    .card.hidden {
        opacity: 0;
        pointer-events: none;
    }
    
    .member-info {
        text-align: center;
        margin-top: 40px;
        transition: all 0.5s ease-out;
    }
    
    .member-name {
        color: rgb(8, 42, 123);
        font-size: 2.5rem;
        font-weight: 700;
        margin-bottom: 10px;
        position: relative;
        display: inline-block;
    }
    
    .member-name::before,
    .member-name::after {
        content: "";
        position: absolute;
        top: 100%;
        width: 100px;
        height: 2px;
        background: rgb(8, 42, 123);
    }
    
    .member-name::before {
        left: -120px;
    }
    
    .member-name::after {
        right: -120px;
    }
    
    .member-role {
        color: #ffffff;
        font-size: 1.5rem;
        font-weight: 500;
        opacity: 0.8;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        padding: 10px 0;
        margin-top: -15px;
        position: relative;
    }
    
    .dots {
        display: flex;
        justify-content: center;
        gap: 10px;
        margin-top: 60px;
    }
    
    .dot {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background: rgba(8, 42, 123, 0.2);
        cursor: pointer;
        transition: all 0.3s ease;
    }
    
    .dot.active {
        background: rgb(8, 42, 123);
        transform: scale(1.2);
    }
    
    .nav-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: rgba(8, 42, 123, 0.6);
        color: white;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        z-index: 20;
        transition: all 0.3s ease;
        font-size: 1.5rem;
        border: none;
        outline: none;
        padding-bottom: 4px;
    }
    
    .nav-arrow:hover {
        background: rgba(0, 0, 0, 0.8);
        transform: translateY(-50%) scale(1.1);
    }
    
    .nav-arrow.left {
        left: 20px;
        padding-right: 3px;
    }
    
    .nav-arrow.right {
        right: 20px;
        padding-left: 3px;
    }
    
    @media (max-width: 768px) {
        .about-title {
            font-size: 4.5rem;
        }
        .card {
            width: 200px;
            height: 280px;
        }
        .card.left-2 {
            transform: translateX(-250px) scale(0.8) translateZ(-300px);
        }
        .card.left-1 {
            transform: translateX(-120px) scale(0.9) translateZ(-100px);
        }
        .card.right-1 {
            transform: translateX(120px) scale(0.9) translateZ(-100px);
        }
        .card.right-2 {
            transform: translateX(250px) scale(0.8) translateZ(-300px);
        }
        .member-name {
            font-size: 2rem;
        }
        .member-role {
            font-size: 1.2rem;
        }
        .member-name::before,
        .member-name::after {
            width: 50px;
        }
        .member-name::before {
            left: -70px;
        }
        .member-name::after {
            right: -70px;
        }
        .video-container {
            position: relative;
            width: 100%;
            height: auto;
        }
        video {
            width: 100%;
            height: auto;
            display: block;
        }
    }