.oferta{
        width:100%;
        display:flex;
        padding:106px 20px;
        justify-content:center;
        /*background-color:brown;*/
        background:linear-gradient(to bottom, #E3E3E3, #BEBEBE, #E3E3E3);
      }
      
      .oferta .contenedor{
        display:flex;
        width:100%;
        /*background-color:green;*/
        align-items:center;
        flex-direction:column;
        gap:70px;
        max-width:1249px;
      }

      .oferta .ofertaHead{
        width:100%;
        display:flex;
        align-items:center;
        gap:20px;
        text-align: center;
        justify-content: center;
      }

      .oferta .ofertaCategorias{
        width:100%;
        display:flex;
        flex-direction:column;
        gap:30px;
      }

      .oferta .categoryRow{
        width:100%;
        display:flex;
        flex-direction: column;
        gap:20px;
        justify-content:space-between;
        align-items:flex-start;
        max-width: 1100px;
      }

      .oferta .compilado{
        display:flex;
        width:100%;
        /*background-color:grey;*/
        align-items:center;
        flex-direction:column;
        overflow:visible;
        gap: 15px;
        position: relative;
      }
      
      .oferta .top{
        display:flex;
        width:100%;
        padding:34px 30px 34px 53px;
        gap:15px;
        justify-content:space-between;
        border-radius:42px;
        background-color:rgb(255, 255, 255);
      }
      
      .oferta .titular{
        font-size:43px;
        line-height:45px;
        max-width:330px;
        width:100%;
        /*background-color:pink;*/
      }
      
      .oferta .generalidades{
        width:100%;
        display:flex;
        max-width:656px;
        /*background-color:lightblue;*/
        gap:20px;
      }
      
      .oferta .modales{
        width:100%;
        display:flex;
        flex-direction:column;
        gap:19px;
      }
      
      .oferta .plecas{
        width:100%;
        display:flex;
        gap:20px;
        /*background-color:brown;*/
      }
      
      .oferta .pleca{
        width:100%;
        padding:13px;
        display:flex;
        background:linear-gradient(to right, #5E655B, #323231);
        gap:15px;
        border-radius:9px;
        color:white;
        align-items:center;
      }
      
      .oferta .plecaGris{
        background:linear-gradient(to right, #8F948D, #717170);
      }
      
      .oferta .vineta{
        width:14.08px;
        height:15.03px;
      }
      
      .oferta .flecha{
        width:40px;
        height:40px;
        flex-shrink:0;
      }

      .oferta button.flecha{
        appearance:none;
        -webkit-appearance:none;
        border:none;
        background:none;
        padding:0;
        cursor:pointer;
        display:flex;
        align-items:center;
        justify-content:center;
        transition:transform .35s ease, opacity .35s ease;
      }

      .oferta button.flecha img{
        transform:rotate(0deg);
        transition:transform .35s ease;
      }

      .oferta .compilado.is-open .top .flecha img{
        transform:rotate(180deg);
      }

      .oferta .bottom{
        width:100%;
        display:flex;
        height: fit-content;
        /*background-color:darkblue;*/
        gap:20px;
        justify-content:space-between;
        max-width: 1100px;
        align-items:flex-start;
        overflow:visible;
        align-items:stretch;
      }

      .oferta .compilado .bottom{
        overflow:hidden;
        max-height:0;
        opacity:0;
        transform:translateY(-12px);
        pointer-events:none;
        transition:max-height .5s ease, opacity .35s ease, transform .35s ease;
      }

      .oferta .compilado.is-open .bottom{
        opacity:1;
        transform:translateY(0);
        pointer-events:auto;
      }

      .oferta .programas{
        width:100%;
        max-width:477px;
        display:flex;
        flex-direction:column;
        /*background-color:pink;*/
        gap:40px;
        padding-top: 40px;
      }
      
      .oferta .programa{
        width:100%;
        display:flex;
        flex-direction:column;
        /*background-color:darkgreen;*/
      }
      
      .oferta .portada{
        width:477px;
        flex-shrink:0;
        height:268px;
        background-color:black;
        border-radius:16px;
      }
      
      .oferta .name{
        padding-top:36px;
        padding-bottom:7px;
      }
      
      .oferta .formularioSpace{
        display: flex;
        width:fit-content;
        max-width:574px;
        /*background-color:olive;*/
        z-index:2;
        align-items:stretch;
        position: relative;
      }
      
      
      
      
      
      
      
      
      
       
      
      
      
.formularioReal{
    padding:36px 15px;
    background:#fff;
    border-radius:45px;
    display:flex;
    justify-content:center;
    max-width: 500px;
    height: fit-content;
    position: sticky;
     top: 90px;
}
      
   .formularioReal .container{
            display:flex;
            flex-direction:column;
            gap:20px;
            /*background-color:pink;*/
            max-width:500px;
     align-items:center;
      }

.formularioReal form{

    display:flex;
    flex-direction:column;
    gap:24px;

}

.formularioReal h2{

    text-align:center;
    font-size:29px;
    line-height:33px;
    font-weight:700;

}

.formularioReal h2 span{

    color:#B5324A;

}

.formularioReal .descripcion{

    text-align:center;

    font-size:18px;
    line-height:20px;
    font-weight:600;
    color:#444;
  max-width:400px;

}

.formularioReal .campo{

    display:flex;
    flex-direction:column;
    gap:10px;
    flex:1;

}

.formularioReal .campo label{

    font-size:16px;
    line-height:18px;
    font-weight:700;

    color:#3c3c3c;

}

.formularioReal .campo input,
.formularioReal .campo textarea{

    width:100%;

    padding:14px 20px;

    border-radius:18px;

    border:1px solid #bdbdbd;

    outline:none;

    font-size:15px;
    line-height:18px;
  font-family:"roboto";

}

.formularioReal .campo textarea{

    resize:none;

}

.formularioReal .fila{

    display:flex;

    gap:18px;

}

.formularioReal .ancho{

    width:100%;

}

.formularioReal .privacidad{

    display:flex;

    gap:18px;

    align-items:flex-start;

}

.formularioReal .checkbox{

    margin-top:5px;

}

.formularioReal .checkbox input{
    font-size:13.5px;
    line-height:17px;
    width:24px;
    height:24px;

}

.formularioReal .texto{

    display:flex;
    flex-direction:column;
    gap:12px;

}

.formularioReal .texto p{
    font-size:13.5px;
    line-height:17px;
    color:#8b8b8b;
    line-height:1.5;

}

.formularioReal .texto a{
    font-size:13.5px;
    line-height:17px;
    font-weight:700;
    color:#444;
    text-decoration:none;

}

.formularioReal button{
    align-self:center;
    padding:15px;
    width:100%;
    max-width:207px;
    border-radius:50px;
    border:1px solid #C52D4B;
    background:white;
    font-size:16px;
    line-height:19px;
    cursor:pointer;
    transition:.3s;
    font-weight:600;
}

.formularioReal button:hover{

    background:#C52D4B;
    color:white;

}
      
      
      .oferta .titularTitle{
        font-size:44px;
        line-height:46px;
      }
      
      .oferta .programasTitle{
        font-size:38px;
        line-height:42px;
        max-width:330px;
        min-width:270px;
      }
      
      .oferta .modalidadesTitle{
        font-size:22px;
        line-height:22px;
      }
      
      .oferta .plecaTitle{
        font-size:19px;
        line-height:22px;
      }

      .oferta .nameTitle{
        font-size:25px;
        line-height:28px;
      }
      
      .oferta .texto{
        font-size:16px;
        line-height:28px;
      }
      
      .oferta img{
        object-position:center;
        object-fit:cover;
        width:100%;
        height:100%;
      }
      
      .oferta .portada img{
        border-radius:16px;
      }
      
      
      
.oferta .generalidadesDos{
    width:100%;
    max-width:656px;
    display:flex;
    gap:20px;
    align-items:flex-start;
}

.oferta .datoGeneral{
    width:100%;

    display:flex;
    flex-direction:column;
    gap:19px;
}
      
.oferta .brillo{
        color:#AC344D;
      }

@media (max-width: 1100px){
  .oferta .ofertaHead{
    align-items:flex-start;
  }

  .oferta .categoryRow{
    flex-direction:column;
  }

  .oferta .bottom{
    flex-direction:column;
  }

  .oferta .programas{
    max-width:none;
  }

  .oferta .formularioSpace{
    position:static;
    width:100%;
    max-width:none;
    height:auto;
  }

  .formularioReal{
    max-width:none;
    width:100%;
  }
}