
.page-pfwn h1 {
    font-weight: 700;
    font-size: var(--size-titulo);
    line-height: var(--size-titulo);
    text-transform: uppercase;
}

.page-pfwn {
    overflow: hidden;
}

.page-pfwn p {
    color: var(--azul);
    font-family: var(--header-family);
}

.page-pfwn .row .col_1_2:last-child {
    padding-left: var(--margin-elementos-int);
}

.page-pfwn .row .col_1_2:first-child {
    padding-right: var(--margin-elementos-int);
}

.page-pfwn .introduccion .texto {
    font-weight: 400;
    font-size: var(--size-36);
    text-transform: uppercase;
    color: var(--azul);
}

.page-pfwn .introduccion .row {
    align-items: flex-end;
}

.page-pfwn .imagen_fondo {
    position: relative;
}

.page-pfwn .imagen_fondo .container.imagen {
    position: absolute;
    pointer-events: none;
    height: 100%;
    left: 50%;
    transform: translateX(-50%);
}

.page-pfwn .imagen_fondo .container.imagen::before {
    content: '';
    width: 200%;
    height: 100%;
    background-image: url(../images/fondo_pfwn_2.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    right:20%;
    top: -160px;
}


.fondo_crema {
    background-color: var(--crema);
    padding: calc( 2 * var(--padding-interior)) 0;
   
}

.fondo_crema .imagen, .fondo_crema .numero {
    max-height: 100%;
    width: auto;
}

.fondo_crema .animacion {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--margin-elementos-int); 
    flex: 1;
}

.fondo_crema .animacion img {
    max-height:100%;  
    width: auto;
    height: 140px;
}

.fondo_crema .animacion .numero{
  position:relative;       
  overflow:hidden;
  display:flex;
  align-items:center;
}

.fondo_crema .animacion .numero__inner{
  display:inline-block;
  will-change: transform;
  animation: numero-slide 3s ease-in-out infinite;
  transform: translateX(-110%);  /* arranca fuera por la izquierda */
}

@keyframes numero-slide{
  0%   { transform: translateX(-110%); }   /* oculto */
  20%  { transform: translateX(-110%); }   /* sigue oculto (pausa inicial) */
  40%  { transform: translateX(0%); }      /* entra y se coloca */
  60%  { transform: translateX(0%); }      /* se mantiene visible */
  80%  { transform: translateX(-110%); }   /* vuelve a esconderse a la izq. */
  100% { transform: translateX(-110%); }   /* pausa final oculto */
}

.fondo_crema .animacion .imagen img {
    object-fit: contain;
    object-position: right;
}

.fondo_crema .animacion .imagen img {
    object-fit: contain;
    object-position: left;
}

.fondo_crema .titulo{
    font-weight: 400;
    font-size: var(--size-36);
    text-transform: uppercase;
    color: var(--azul);
}

.fondo_crema .texto {
    font-weight: 600;
    font-size: var(--size-28);
}

.fondo_azul {
    background-color: var(--turquesa);
    padding: var(--padding-interior) 0;
    position: relative;
}

.fondo_azul .container {
    position: relative;
    padding: var(--padding-interior) 0;
}

.fondo_azul .container::before {
    content: '';
    width: 60%;
    height: 140%;
    background-image: url(../images/fondo_pfwn_1.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    right:-25%;
    top: 50%;
    transform: translateY(-50%);
}

.fondo_azul .col_1_1 {
    padding-right: calc(100% / 12);
}

.fondo_azul .titulo, .fondo_azul .titulo p {
    color: var(--second-color);
    font-weight: 400;
    font-size: var(--size-60);
	line-height: var(--size-60);
}

.fondo_azul .titulo strong {
    font-weight: 500; 
}

.fondo_azul .texto, .fondo_azul .texto p {
    font-weight: 600;
    font-size: var(--size-28);
    color: var(--second-color);
}  

.texto_final {
    font-weight: 500;
    font-size: var(--size-40);
    text-align: center;
}

.texto_final strong {
    font-weight: 700;
}

.banner_next_mindset .titulo, .banner_next_mindset .titulo p {
    text-transform: initial;
    font-size: var(--size-40);
}

.banner_next_mindset .texto p {
    font-size: var(--size-28);
    font-weight: 400;
    text-transform: initial;
}


@media (min-width: 1024px) and (max-width: 1100px) {
    .fondo_azul .container::before {
        width: 50%;
    } 
}


 @media (max-width: 1024px) {
    .page-pfwn .introduccion .row, .fondo_crema .row {
        flex-direction: column;
    }

    .page-pfwn .introduccion .row .col_1_2, .fondo_crema .row .col_1_2{
        padding-right: 0 !important;
        padding-left: 0 !important;
       
        width: 100% !important;
    } 
    
    .page-pfwn .introduccion .row .col_1_2:first-child, .fondo_crema .row .col_1_2:first-child {
        margin-bottom: var(--margin-bloques);
    }
    
    
    .fondo_azul .container::before {
        right: -45%;
    }

    .fondo_crema .animacion {
            align-items: center;
            justify-content: center;
    }

    .fondo_crema .animacion img {
        max-height:100%;  
        width: auto;
        height: 100px;
    }

    .page-pfwn .imagen_fondo .container.imagen::before {
        top: 0;
    }
    

 }

@media (min-width: 769px) and (max-width: 1024px) {
  .fondo_crema .row .col_1_2:first-of-type {
    display: flex;
    align-items: flex-end;
  }

  .fondo_crema .row .col_1_2:first-of-type > div {
    width: 50%;
  }

  .fondo_crema .row .col_1_2:first-of-type .titulo {
    padding-right: var(--margin-elementos-int);
    margin-bottom: 0;
  }

  .fondo_crema .row .col_1_2:first-of-type .textos {
    padding-right: var(--margin-elementos-int);
  }
}

 @media (max-width: 768px) {

    .page-pfwn .row .col_1_2{
        padding-right: 0 !important;
        padding-left: 0 !important;
        margin-bottom: var(--margin-bloques);
    }

    .page-pfwn .row .col_1_2:first-child {
        margin-bottom: var(--margin-bloques);
    }


     .fondo_azul .container::before {
        right: -55%;
        top: -80%;
        transform: translateY(0);
    }

    

}