body {
  display: flex;
  flex-direction: column;
  justify-content: start;
  height: 100%;
}

/* Aquí había un a:visited { color: #ffffff } sin acotar que pintaba de blanco
   TODOS los enlaces visitados del sitio; sobre fondo blanco —el menú de FP,
   entre otros— el enlace desaparecía. No se sustituye por nada: en global.css
   el selector es `a` a secas, sin `:visited`, así que cada enlace conserva su
   color, visitado o no, y el `a:visited { color: #800080 }` de la base de _s en
   style.css también está fuera. El menú de FP lo pone `nav ul li a { color: #000 }`
   y los botones blancos sobre rojo, su propia clase (.cta, .header-cta,
   .cta-matriculacion). No vuelvas a añadir un `a:visited` sin acotar: le gana
   por especificidad a todas esas reglas de clase y las apaga. */
/** HEADER */

header.landing {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  font-size: var(--font-size-lg);
  width: 100%;  
}

/** Header top */
.header-top {
  width: 100%;
  background-color: var(--color-red-100);
  height: 80px;
  display: grid;
  align-items: center;
  font-family: var(--font-poppins);
  padding: 0 20px;
}


.header-top > .left {
  grid-column-start: 1;
  grid-row-start: 1;
  justify-self:left;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: start;
  margin-right: auto;
  column-gap: 20px;

}

.header-top > .left .inicio {
  font-size: 15px;
  color: var(--color-white);
  text-decoration: none;
}

.header-top > .left .back {
  font-size: 15px;
  color: var(--color-white);
  text-decoration: none;
  border: 2px solid #fff;
  border-radius: 19px;
  padding: 7px 15px;
}

.header-top > .left .back::before {
  content: " ";
  background-image: url(../public/left-arrow.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% auto;
  margin-right: 5px;
  width: 15px;
  height: 10px;  
  display: inline-block;
}

.header-top .header-cta {
  font-size: var(--font-size-9xl);
  color: var(--color-white);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  text-decoration: none;
  grid-column-start: 1;
  grid-row-start: 1;
  justify-self:center;
}

.phone {
  max-height: 100%;
  width: 45px;
}

.te-llamamos {
  line-height: 34px;
  font-weight: 600;
  border-radius: 22px;
  border: 2px solid var(--color-white);
  box-sizing: border-box;
  padding: 4px 31px;
}

/** fin Header top */
/** Menu*/

.menu {
  flex: 1;
  min-height: 59.2px;
  font-size: var(--font-size-mini);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 30px 69px 40px;
  width: 100%;
}

.menu_mobile {
    display: none;
}

.navigation-mobile {
    display: none;
}

.menu-burguer {
    display: none;
}

nav {

}

nav ul {
  list-style: none;
  display: flex;
  flex-direction: row;
  column-gap: 4rem;
  align-items: center;
}


nav ul li {
  font-family: var(--font-poppins);
  font-size: 15px;
  text-align: center;
}

nav ul li a {
  text-decoration: none;
  color: #000000;
  text-transform: uppercase;
}

nav ul li.contacto a {
  border: 1px solid #DC0000;
  border-radius: 10px;
  padding: 5px 10px;
}

.logo {
  width: 345px;
  font-size: var(--font-size-4xl);
  color: var(--color-dimgray-200);
}

/** Fin Menu */

/** Header bottom */

.header-bottom {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: start;
  width: 1558px;  
  max-width: 100%;
  column-gap: 20px;
  margin-bottom: 40px;
}

.header-bottom h1 {
  font-family: var(--font-poppins)!important;
  font-size: 70px;
  line-height: 79px;
  color: var(--color-red-100)!important;
  margin: 0 0 20px!important;
  font-weight: 800!important;
}

.header-bottom h2 {
  font-family: var(--font-poppins)!important;;
  font-size: 34px;
  line-height: 45px;
  display: inline-block!important;;
  font-weight: 600!important;;
  margin: 0 0 30px!important;

}

.header-bottom h2 > span {
  margin: 0;
  font-weight: 500;
  display: block;
  color: var(--color-dimgray-200);
}

.transporte {
  display: flex;
  flex-direction: column;
  align-items: start;
  width: 100%;
}

.transporte .transporte-title{
  font-family: var(--font-raleway);
  font-size: 34px;
  font-weight: 600;
  color: #DC0001;
  margin-bottom: 10px;
}

.transporte .transporte-subtitle{
  font-weight: 600;
  font-family: var(--font-raleway);
  font-size: 28px;
  margin-bottom: 20px; 
  margin-top: 60px;
  color:#333;
}

.transporte .lines {
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: center;
    column-gap: 8px;
}

.transporte .line{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: start;
  font-weight: 600;
  font-family: var(--font-raleway);
  margin-bottom: 7px;
}

.transporte .line .line-image {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.transporte .line .line-image img{ 
  max-width: 100%;
}




.header-bottom-left {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  flex: 1;
}

.header-bottom-right {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
}

.formulario {
  background-color: var(--color-gainsboro);
  width: 557px;
  min-height: 576px;
  font-size: var(--font-size-mini);
  color: var(--color-darkgray);  
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  padding: 15px;
  position: relative;
}

 .formulario.formulario-mobile{
    display: none;   
 }

.formulario .blocked {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: transparent;
}

.formulario h3 {
  margin: 0;
  font-family: var(--font-poppins);
  font-weight: 600;
  font-size: var(--font-size-6xl);
  line-height: 34px;
  color: var(--color-dimgray-200);
  text-align: center;
  padding-bottom: 10px;
}

.formulario h3 span {
  display: block;
}

/* Formulario escamoteable: arranca plegado —solo el título y el botón de
   desplegar— y el JS le pone .formulario--abierto al pulsarlo. Se pliega con
   CSS y no con el atributo hidden para que al cargar no se vea el formulario
   entero un instante antes de que el JS lo cierre. */
.formulario--plegable {
  min-height: 0;
  justify-content: center;
  padding-bottom: 35px;
}

/* Doble clase a propósito: `.formulario form` (más abajo) le pone display:flex
   con la misma especificidad, y al ir después ganaría por orden. */
.formulario.formulario--plegable form {
  display: none;
}

.formulario--plegable.formulario--abierto {
  min-height: 576px;
  justify-content: start;
  padding-bottom: 15px;
}

.formulario.formulario--plegable.formulario--abierto form {
  display: flex;
}

.formulario-desplegar {
  /* Por encima de .blocked, la capa que cubre el formulario entero y lleva a
     la página de contacto: sin este z-index se quedaría ella con el clic. */
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 12px;
  margin: 0;
  padding: 5px 0 0;
  border: 0;
  background: none;
  cursor: pointer;
  font-family: var(--font-poppins);
  font-weight: 600;
  font-size: var(--font-size-mini);
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--color-red-100);
}

.formulario--abierto .formulario-desplegar {
  display: none;
}

.formulario-flecha {
  width: 0;
  height: 0;
  border-top: 15px solid var(--color-red-100);
  border-right: 13px solid transparent;
  border-left: 13px solid transparent;
}

.formulario form {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 18px;
}

.formulario form .form-row{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 22px;
  column-gap: 3rem;
}

.formulario form .form-row input[type=text]{ 
  flex: 1;
  border:none;
  height: 60px;
  font-size: 15px;
  line-height: 23px;
  font-weight: 300;
  font-family: var(--font-poppins);
  color: #A1ADB5;
  padding: 0px 30px;
  border-bottom: 1px solid #54595d;
  min-width: 0;
}

.formulario form .form-row input[type=checkbox]{ 
  margin: 0;
  width: 20px;
  height: 20px;
}

.formulario form .form-row label{ 
  display: flex;
  flex-direction: row;
  align-items: start;
  justify-content: center;
  font-size: 11px;
  line-height: 17px;
  font-weight: 300;
  font-family: var(--font-poppins);
  color: #000;
  column-gap: 8px;
}

.formulario form .form-row label a{ 
  text-decoration: underline;
  color: #034ffa;
}

.formulario form .form-row input[type=button],.formulario form .form-row button{ 
  border: 0;
  flex: 1;
  min-height: 58px;
  text-wrap: wrap;
  color: #fff;
  font-size: 25px;
  line-height: 24px;
  font-weight: 600;
  font-family: var(--font-poppins);
  cursor: pointer;
}

.formulario form .form-row button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.formulario form .form-row button img{
  width: 37px;
  margin-right: 8px;
}


.formulario form .form-row input[type=button].btn-1{ 
  background-color: #516270;
}

.formulario form .form-row input[type=button].btn-2,
.formulario form .form-row button.btn-2{ 
  background-color: #DC0001;
}
/** Fin Header bottom */

/** FIN HEADER */

/** MAIN */
main {
  width: 100%;
  color: var(--color-black);
  font-family: var(--font-poppins);
  background-color: var(--color-white);
  font-size: var(--font-size-xl);
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: center;
}


/** Slider principal*/

.slider { 
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: start;
  justify-content: center;
  height: 501px;
}

.slide {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: center;
}

.slide-left {
    font-family: var(--font-poppins);
    background-color: var(--color-gainsboro);
    color: var(--color-dimgray-200);
    font-size: 55px;
    line-height: 65px;
    font-weight: 800;
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
    padding-left: 4rem;
    padding-right: 2rem;
}

.slide2 .slide-left {
    background-color: #516270;
    color: #fff;
}

.slide3 .slide-left {
    background-color: #A1ADB5;
    color: #fff;
}

.slide4 .slide-left {
    background-color: #DC0001;
    color: #fff;
}



.slide-left span {
  padding: 0 60px 20px 0;
  border-bottom: 1px solid #516270;
  width: 100%;
}

.slide2 .slide-left span,
.slide3 .slide-left span,
.slide4 .slide-left span
 {
  border-bottom: 1px solid #fff!important;
}

.slide-right {
  flex: 1;
  max-height: 100%;
  height: 501px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.slide-right img{
  width: 100%;
  max-height: 100%;
}

.slide-full {
  flex: 1;
  max-height: 100%;
  height: 501px;  
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;  
  display: flex;
  align-items: center;
  justify-content: center;
}

.slide-full .slider-content{
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: center;
  align-self: flex-end;
  width: 100%;
  background-color: rgba(255,255,255,0.7);
}

.slide-full span{
  color: #fff;
  font-size: 40px;
  font-family: var(--font-poppins);  
  font-weight: 600;
}

.slide-full .slider-content span{
  color:#000;
  width: 1558px;  
  max-width: 100%;
  font-size: 40px;
  font-family: var(--font-poppins);  
  font-weight: 600;
  text-align: center;
  padding: 25px 0 0;
}

.slide-full .slider-content  p{
  width: 1558px;  
  max-width: 100%;
  color:#000;
  font-size: 28px;
  font-family: var(--font-raleway);
  font-weight: 400;
  line-height: 30px;
  text-align: center;
  margin: 0;
  padding: 15px 0 25px;
}

.slide-full.inverted span{
  color: #516270;
}


/** Fin Slider principal*/

/** Seccion Razones*/
.razones {
  width: 1558px;
  max-width: 100%;
  text-align: center;
  font-size: var(--font-size-5xl);
  color: var(--color-red-100);
  font-family: var(--font-poppins);
  padding: 40px 0 0;
}

.razones.razones2 {
  padding:0 0 80px;
}

.razones h3 {
  font-size: var(--font-size-26xl);
  line-height: 45px;
  font-weight: 600;
  color: var(--color-black);
  margin-bottom: 60px;
}

.razones > p {
  font-size: 24px;
  line-height: 32px;
  font-weight: 400;
  color: var(--color-black);
  font-family: var(--font-raleway);
  margin-bottom: 0px;
  margin-top: 0px;
  padding-bottom: 0px;
}

.razones-list {
  display: flex;
  flex-direction: row;
  align-items: start;
  justify-content: center;
  column-gap: 3rem;
  margin-bottom: 100px;
}

.razon {
  flex: 1;
}

.razon .razon-image {
  min-height: 110px;
}

.razon .razon-title {
  color: var(--color-red-100);
  font-weight: 600;
  font-family: var(--font-poppins);
  font-size: 24px;
  /* El alto lo iguala la rejilla al final del fichero, no una reserva fija. */
}

.razon .razon-desc {
  color: #516270;  
  font-weight: 400;
  font-family: var(--font-raleway);
  font-size: 18px;
  line-height: 24px;
}

/* El campo es un WYSIWYG: en unas secciones devuelve el texto suelto y en otras
   envuelto en <p>. Con el margen por defecto del navegador, esas segundas
   —secundaria hoy— sumaban un espacio extra sobre la descripción que las demás
   no tenían. */
.razon .razon-desc p {
  margin: 0;
}

.razon .razon-desc p + p {
  margin-top: 1em;
}
/** Fin sección razones*/

/** Seccion toda la fp*/
.toda-la-fp {  
  width: 100%;
  padding-top: 60px;
  background-color: #bdbdbd;
  font-size: var(--font-size-10xl);
  color: var(--color-dimgray-100);
  font-family: var(--font-poppins);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.toda-la-fp h3 {
  margin: 0;
  font-size: var(--font-size-26xl);
  line-height: 45px;
  font-weight: 600;
  color: var(--color-black);
  text-align: center;
}

.grados {
  width: 1558px;
  max-width: 100%;  
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: start;
  column-gap: 4rem;
  margin: 60px 0 100px;

}

.grado {
  padding: 30px 0 0px;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  cursor: pointer;
  flex:1;
}

.grado .grado-title {
  font-size: 29px;
  line-height: 43px;
  font-weight: 800;
  font-family: var(--font-poppins);
}

.grado .grado-subtitle {
  font-size: 19px;
  line-height: 29px;
  font-weight: 400;
  font-family: var(--font-poppins);
  color: #DC0001;
  margin-bottom: 30px;
}

.grado > img {
  width: 100%;
  max-width: 100%;
}

.grado .ciclos-list {
  width: 100%;
  background-color: var(--color-gainsboro);
  padding-top: 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.grado .ciclos-list ul{
  list-style: none;
  background-color: #fff;
  margin: 0;
  padding: 0;
  width: 100%;
  padding: 40px 25px;
  display: none;
  animation: aparecer 0.5s ease forwards; /* Define la animación */  
}

@keyframes aparecer {
  from {
      opacity: 0; /* Inicia con opacidad 0 */
  }
  to {
      opacity: 1; /* Termina con opacidad 1 */
  }
}

.grado .ciclos-list ul.visible{
  display: block;
}


.grado .ciclos-list ul li{
  text-align: center;
  border-bottom: 1px solid #DC0000;
  padding: 20px 5px;
}

.grado .ciclos-list ul li:last-child{
  border-bottom: none
}

.grado .ciclos-list ul li a{
  font-size: 20px;
  line-height: 29px;
  font-weight: 500;
  font-family: var(--font-poppins);
  color: #000;
  text-decoration: none;
}


.grado .ciclos-list .ciclos-button{
  width: 100%;
  color: #fff;
  background-color: #A1ADB5;
  text-align: center;
  padding: 25px 4px;
  font-family: var(--font-poppins);
  font-size: 24px;
  line-height: 35px;
  font-weight: 400;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.grado .ciclos-list .ciclos-button.medio{
  background-color: #516270;
}

.grado .ciclos-list .ciclos-button.superior{
  background-color: #000000;
}

.grado .ciclos-list .ciclos-button img{
  margin-top: 14px;
}


/** Fin Seccion toda la fp*/

/** Sección Empresas*/

.empresas {
  background-color: #fff;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
}

.empresas .empresas-fondo {
    background: url(../public/imagen-y-sonido-practicas-empresa@2x.jpg) no-repeat left top;
    height: 793px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    margin-bottom: 35px;
}

.empresas .empresas-content {
  width: 1558px;
  max-width: 100%;
}

.empresas .empresas-content p{
  text-align: center;
  line-height: 29px;
  font-size: 22px;
  font-weight: 400;
  font-family: var(--font-raleway);
  color: #516270;
}

.empresas img {
  width: 100%;
  max-width: 100%;  
}

.empresas > img.bkg-empresas {
  height: 793px;
  width: 100%;
  max-width: 100%;  
  margin-bottom: 35px;
}

.empresas h3 {
  margin: 0;
  line-height: 45px;
  font-weight: 600;
  font-size: var(--font-size-26xl);
  color: var(--color-red-100);
  font-family: var(--font-poppins);
  text-align: center;
  margin-bottom: 20px;
}

.empresas p {
  line-height: 45px;
  font-weight: 600;
  font-size: var(--font-size-3xl);
  font-family: var(--font-raleway);
  color: var(--color-dimgray-200);
}

.cta-matriculacion {
  padding: 1.5rem 4rem;
  background-color: var(--color-red-100);
  box-sizing: border-box;
  color: #fff;
  text-decoration: none;
  display: flex;
  flex-direction: row;
  justify-content: center;
  font-size: 45px;
  line-height: 45px;
  align-items: center;
  column-gap: 10px;
  margin: 0 0 80px;
  font-weight: 500;
  min-height: 142px;
  width: 1558px;
  max-width: 100%;
}

.slide-empresas {
    width: 100%;
}



.slide-empresas .responsive {
    display: none;
}
/** Fin Sección Empresas*/

/** Sección Becas y Ayudas */

.becas-y-ayudas {
  width: 100%;
  display: flex;
  flex-direction: row;
  font-size: var(--font-size-26xl);
  color: var(--color-black);
  font-family: var(--font-poppins);
  align-items: stretch;
  background:var(--color-gainsboro);;
  justify-content: center;
  align-items: center;
  position: relative;
}

.becas-y-ayudas:before {
  width: 50%;
  position: absolute;
  top: 0;
  left: 0;
  content:" ";
  background:var(--color-gainsboro) url(../public/becas-y-ayudas@2x.jpg) no-repeat left top;
  background-size: cover;
  width: 50%;
  height: 100%;
}


.becas-y-ayudas:before[data-img]::before {
  background-image: attr(data-img);
}

.becas-y-ayudas-content {
  width: 1558px;
  max-width: 100%;
  display: flex;
  flex-direction: row;
}
.becas-y-ayudas-left {
  flex: 0.5;
}
.becas-y-ayudas-right {
  flex: 0.5;
  font-size: var(--font-size-3xl);
  line-height: 29px;
  text-align: right;
  font-family: var(--font-raleway);
  display: flex;
  flex-direction: column; 
  padding-right: 10px;
  padding-top: 50px;
  padding-bottom: 140px;
  align-items: end;
}

.becas-y-ayudas-right h3{
  font-family: var(--font-poppins);
  font-size: 45px;
  line-height: 45px;
  font-weight: 600;
  margin: 0 0 20px;
}

.becas-y-ayudas-right p{
  font-family: var(--font-raleway);
  font-size: 22px;
  line-height: 29px;
  font-weight: 400;
  color:#516270;
  width: 71%;
  margin: 0 0 30px;
}

.becas-y-ayudas-right p:last-of-type{
  margin-bottom: 10px;
}

.becas-logos {
    display:flex;
    position:absolute;
    bottom:25px;
    right:0;
    width:50%;
    flex-direction:row;
    background: #fff;
    justify-content: center;
    column-gap: 30px;
    align-items: center;
    padding: 20px 0;
}

/** Fin Sección Becas y Ayudas */

/** Seccion CTA */
.cta-pie {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 100%;
  align-items: center;
  font-size: 38px;
  color: var(--color-white);
  padding: 60px 20px;
}

.cta-pie h3 {
  font-size: 58px;
  line-height: 58px;
  color: #d8001d;
  margin: 0;
  font-family: var(--font-poppins);
  font-weight: 600;
}

.cta {
  padding: 1.5rem 4rem;
  background-color: var(--color-red-100);
  box-sizing: border-box;
  color: #fff;
  text-decoration: none;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: 10px;
  margin: 40px 0;
  font-family: var(--font-poppins);  
  font-weight: 600!important;
}

.cta-address {
  color: #000;
  display: flex;
  flex-direction: row;
  column-gap: 20px;
  align-items: center;
  justify-content: center;
}

.cta-address div{
  display: flex;
  flex-direction: column;
  font-family: var(--font-raleway);
  font-size: 28px;
  line-height: 33px;
  font-weight: 800;
}

/** Fin Seccion CTA */

/** FIN MAIN */

/** FOOTER */
.footer {
  width: 100%;
  background-color: var(--color-red-100);
  text-align: left;
  font-size: var(--font-size-xl);
  color: var(--color-white);
  font-family: var(--font-raleway);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 50px 20px;
}

.footer-content {
  width: 1558px;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  align-items: stretch;
}

.footer-content > div{
  flex: 1;
}

.footer-content > .footer-left {
  display: flex;
  flex-direction: column;
  row-gap: 13px;
}

.footer-content > .footer-left ul{
  display: flex;
  flex-direction: column;
  row-gap: 13px;
  list-style: none;
  align-items: start;
  justify-content: start;
  margin: 0;
  padding: 0;
}

.footer-content > .footer-left .social{
  margin-top: auto;
}

.footer-content > .footer-left a{
  text-decoration: none;
  color: #fff;
  font-family: var(--font-raleway);
  font-size: 20px;
  line-height: 24px;
  font-weight: 400;
}

.footer-content > .footer-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 10px;
}

.footer-content > .footer-right {
  display: flex;
  flex-direction: column;
  align-items: end;
}


.footer-content > .footer-right ul{
  display: flex;
  flex-direction: column;
  row-gap: 13px;
  list-style: none;
  align-items: start;
  justify-content: start;
  margin: 0;
  padding: 0;
}

.footer-content > .footer-right a{
  text-decoration: none;
  color: #fff;
  font-family: var(--font-raleway);
  font-size: 20px;
  line-height: 24px;
  font-weight: 400;
}

.footer-content > .footer-right > div{
  display: flex;
  flex-direction: column;
  row-gap: 13px;
}

.logos-footer {
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 0 2rem;
  column-gap: 30px;
  row-gap: 30px;
  padding: 20px 0 50px;
}

.logos-footer img{
  max-height: 90px;
  max-width: 100%;
}

.logos-footer .logo1{
    width: 150px;
}

.logos-footer .logo2,
.logos-footer .logo3 {
    width: 180px;
}

.logos-footer .logo4{
    width: 133px;
}

/* Este hueco lo ocupa ahora la insignia del SEPIE, bastante más apaisada que
   el logo de OAPEE al que sustituye. Fijando el ancho quedaría mucho más baja
   que sus vecinas, así que se fija el alto: son los 49px que daba el logo
   anterior a 180 de ancho, de modo que la fila mantiene su ritmo sea cual sea
   la proporción de la imagen. */
.logos-footer .logo5{
    width: auto;
    height: 49px;
}

.logos-footer .logo6{
    width: 180px;
}

.logos-footer .logo7{
    width: 181px;
}

/** FIN FOOTER */

.mobile {
  display: none;
}

@media screen and (max-width: 1600px) {
  .menu {
    padding: 30px 30px 40px;
  }
  
  nav ul {
    column-gap: 2rem;
  }
  
  .menu .logo,
  .menu_mobile .logo {
    max-width: 200px;
  }


  .menu .logo img,
  .menu_mobile .logo img {
    width: 100%;
  }

  .header-bottom {
    padding: 0 20px;
  }

  .slide-left {
    font-size: 45px;
    line-height: 55px;
  }

  .razones {
    padding-left: 20px;
    padding-right: 20px;
  }

  .razones-list {
    column-gap: 3rem;
  }

  .toda-la-fp {
    padding-left: 20px;
    padding-right: 20px;
  }

  .grados {
    flex-wrap: wrap;
    align-items: start;
    row-gap: 30px;
  }

  .grado {
    max-width: 400px;
    flex: unset;
  }

  .empresas h3 {
    padding-left: 20px;
    padding-right: 20px; 
  }

  .empresas-content {
    padding-left: 20px;
    padding-right: 20px;
  }

  .becas-y-ayudas-content {
    padding-left: 20px;
    padding-right: 20px;
  }

  .becas-y-ayudas-right p {
    padding-left: 10px;
    padding-right: 10px;
  }

  .becas-y-ayudas-right p {
    width: 100%;
  }

  .logos-footer {
    padding-left: 20px;
    padding-right: 20px;    
  }


.slide-empresas .responsive {
    display: none;
}

    .cta-matriculacion {
        font-size: 32px;
        line-height: 34px;
        padding: 1rem;
    }

}

@media screen and (max-width: 1240px) {
  .menu {
    padding: 30px 15px 40px;
  }
  
  nav ul {
    column-gap: 1.2rem;
  }

  .menu .logo,
  .menu_mobile .logo {
    max-width: 140px;
  }

  .slide-left {
    width: 45%;
    font-size: 42px;
    line-height: 52px;
  }

  .header-bottom {
    flex-direction: column;
    row-gap: 30px;
  }


  .header-bottom-left {
    width: 100%;
  }
  
  .header-bottom-right {
    width: 100%;
    justify-content: center;
    align-items: center;
  }  

  .razones-list {
   flex-wrap: wrap;
   row-gap: 30px;
  }

  .razon {
    min-width: 300px;
    max-width: 300px;
  }



.slide-empresas .responsive {
    display: none;
}

}

@media screen and (max-width: 1024px) {
  .header-bottom h1 {
    font-size: 40px;
    line-height: 50px;
    text-align: center;
  }

  .menu {
    padding: 30px 30px 40px;
    flex-direction: column;
    align-items: start;
    justify-content: start;
    row-gap: 30px;
  }

  .menu .logo {

  }
  nav ul {
    margin: 0;
    padding: 0;
  }

  .slider {
      height: unset;
  }

  .slide {
      flex-direction: column;
      justify-content: center;
      align-items: start;
  }

  .slide-left {
    width: 100%;
    flex: 1;
    min-height: 200px;    
  }

  .slide-right {
    width: 100%;
    flex: 1;
    min-height: 300px;
  }


  .becas-y-ayudas-content {
    flex-direction: column;
  }

  .becas-y-ayudas:before {
    width: 100%;
    height: 300px;
    content:" ";
  }

  .becas-y-ayudas-left{
    width: 100%;
    height: 300px;
    flex: unset;
  }

  .becas-y-ayudas-right {
    width: 100%;
    min-height: 300px;
    flex: unset;
  }

    .becas-logos {
        width:100%;
        padding:20px;
    }  

    .becas-logos img{
        max-width: 33%;
    }

  .formulario form .form-row{
    flex-direction: column;
    row-gap: 22px;
  }

  .formulario form .form-row input[type=text]{ 
    height: 60px;
    width: 100%;
    flex: unset;
  }

  .formulario form .form-row input[type="button"].btn-1 {
    flex: unset;
  }

  .formulario form .form-row input[type=button].btn-2,
  .formulario form .form-row button.btn-2{ 
    flex: unset;
    width: 100%;
  }

  .formulario form .form-row input[type=button],.formulario form .form-row button{ 
    font-size: 20px;
    line-height: 24px;
    width: 100%;
  }

  .footer-content {
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
    row-gap: 30px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .footer-content > div {
    flex: unset;
    width: 100%;
  }

  .footer-content > .footer-right {
    align-items: start;
  }



.slide-empresas .responsive {
    display: none;
}

    .cta-matriculacion {
        flex-direction: column; 
    }

    .cta-matriculacion span {
        margin-top: 15px;
    }

}

@media screen and (max-width: 768px) {
   header.landing{
       padding-bottom: 0px;
   }

  .menu {
    align-items: center;
    justify-content: center;
    row-gap: 20px;
  }

  .menu_mobile {
    padding: 17px 0;
    display: block;
  }

  .menu {
      display: none;
  }

  .menu-burguer {
    display: block;
    justify-self: right;
    grid-row-start: 2;
  }

  .menu .logo,
  .menu_mobile .logo {
    max-width: 200px;
  }

  .navigation-mobile {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    background:#DC0001;
    padding: 18px 50px;
    z-index: 2;
  }

  .navigation-mobile.opened {
      display: block;
  }

  .navigation-mobile nav ul  {
      row-gap: 0px;
  }

  .navigation-mobile > img  {
        width: 20px;    
        position: absolute;
        right: 23px;
        top: 21px;
  }

  .navigation-mobile nav ul li {
      border-bottom: 1px solid #fff;
      width: 100%;
      padding: 10px 22.5px;
  }

  .navigation-mobile nav ul li:last-child {
      border-bottom: none;
  }  

  .navigation-mobile nav ul li a{
    color: #fff;
    font-family: var(--font-poppins);
    font-weight: 300;
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
    flex-direction: column;
  }

  nav ul {
    flex-direction: column;
    row-gap: 15px;
  }

  .formulario {
    width: 100%;
    display: none;
  }

  .formulario.formulario-mobile{
    display: flex;
    height: unset;
    min-height: unset;
    margin-bottom: 10px;
  }

  .formulario.formulario-mobile h3{
      font-size: 14px;
      line-height: 16px;
  }

  .formulario.formulario-mobile form{ 
      padding-bottom: 0px;
      padding-top: 0px;
  }

  .formulario.formulario-mobile form .form-row input[type=button].btn-1{ 
    font-size: 12px;
    min-height: 38px;
    max-width: 200px;
  }

  .formulario.formulario-mobile form .form-row{ 
      margin-bottom: 0px;
  }

  .cta {
    padding: 1.5rem 2rem;
    font-size: 24px;
    text-align: center;
  }

  .cta-address {
    flex-direction: column;
  }
  
  .cta-address div{

  }

  .slide-left {
    padding-left: 2rem; 
    padding-right: 2rem;
    font-size: 25px;
    line-height: 35px;
    width: 100%;
    flex: 1;
    min-height: 200px;    
  }
    .header-top {
        height: unset;
        padding: 10px 20px
    }

    .header-top .inicio {
        grid-row-start: 1;
        margin: 10px 0;
        font-size: 11px;
        display: none;   
    }  

    .header-top .header-cta {
        grid-row-start: 2;
        margin: 10px 0; 
        justify-self: left;    
    }

    .header-top .header-cta img{
        width: 20px;
    }       

    .header-top .header-cta .te-llamamos {
        font-size: 11px;
        line-height: 14px;
        padding: 4px 15px;        
    }

  .header-bottom h1 {
    padding-top: 20px;
    font-size: 36px;
    line-height: 38px;
    text-align: center;
  }


  .header-bottom h2 {
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    margin-bottom:10px!important;
  }

  .transporte .transporte-title {
    font-size: 17px;
    line-height: 18px;
    text-align: center;
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 20px;
  }

  .transporte .transporte-subtitle {
      margin-top: 15px;
      font-size: 14px;
      text-align: center;
      width: 100%;
  }

    .transporte .transporte-title > span.separator {
        display: none;
    }

  .transporte .lines {
      width: 100%;
      align-items: center;
  }

  .transporte .line {
    font-size: 8px;
    line-height: 10px; 
  }

  .slide-empresas .desktop {
    display: none;
}

.slide-empresas .responsive {
    display: block;
}

    .slide-left {
        min-height: 50px;
    }

    .slide-left span {
        border-bottom: none!important;
        font-size: 16px;
        line-height: 17px;
        padding-bottom: 0px;
    }

    .slide2 .slide-left span,
    .slide3 .slide-left span,
    .slide4 .slide-left span
    {
        border-bottom: none!important;

    }    

    .slide-right {
        min-height: 157px;
    }

    .slide1 .slide-right {
        background-image: url(../public/slide/mobile/slide1.jpg);
    }

    .slide2 .slide-right {
        background-image: url(../public/slide/mobile/slide2.jpg);
    }

    .slide3 .slide-right {
        background-image: url(../public/slide/mobile/slide3.jpg);
    }

    .slide4 .slide-right {
        background-image: url(../public/slide/mobile/slide4.jpg);
    }

    .slide5 .slide-right {
        background-image: url(../public/slide/mobile/slide5.jpg);
    }

    .slide6 .slide-right {
        background-image: url(../public/slide/mobile/slide6.jpg);
    }

    .slide7 .slide-right {
        background-image: url(../public/slide/mobile/slide7.jpg);
    }

    .slide8 .slide-right {
        background-image: url(../public/slide/mobile/slide8.jpg);
    }

    .razones h3 {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 10px;
    }

    .razon .razon-title {
        font-size: 18px;
        line-height: 22px;
        min-height: unset;
        margin-bottom: 8px;
    }

    .razones.razones2 {
        padding:20px 40px;
        background: #DADCDE;
    }
    .razones.razones2 > p {
        font-size: 14px;
        line-height: 22px;
        padding: 0;
    }

    .toda-la-fp {
        padding: 14px 0px;
    }

    .toda-la-fp h3 {
        font-size: 20px;
        line-height: 24px;
        padding: 0 20px;
        margin-bottom: 14px;
    }

    .grados {
        margin-top: 0px;
        margin-bottom: 20px;
    }

    .grado .ciclos-list {
        padding-top: 0px;
    }

    .empresas {
        padding-top: 0px;
    }  

    .empresas .empresas-fondo {
        background-image: url(../public/imagen-y-sonido-practicas-empresa-mobile.jpg);
        height: 155px;
        margin-bottom: 15px;
    }   

    .empresas h3 {
        font-size: 20px;
        line-height: 24px; 
    } 

    .empresas .empresas-content p {
        line-height: 22px;
        font-size: 14px;
    }  

    .becas-y-ayudas:before {
        height: 195px;
    }     

    .becas-y-ayudas-left {
        height: 220px;
    }

    .becas-y-ayudas-right{
        padding-top: 0px;
    }

    .becas-y-ayudas-right h3 {
        font-size: 20px;
        line-height: 24px; 
        text-align: center;
        width: 100%;
        margin-bottom: 0px;
    }

    .becas-y-ayudas-right p {
        font-size: 14px;
        line-height: 22px;   
        text-align: center;
        margin-bottom: 0px;
    }

    .cta-pie {
        padding: 20px;
    }

    .cta-pie h3 {
        font-size: 22px;
        line-height: 22px;
    }    

    .cta {
        font-size: 13px;
        width: 100%;
        padding: 0.8rem 1rem;
        margin-top: 10px;
        margin-bottom: 20px;
    }

    .cta img {
        width: 8px;
        margin-left: 20px;
    }   

    .cta-address img{
        width: 20px;
    }    

    .cta-address span {
        text-align: center;
        font-size: 20px;
        line-height: 24px;
    }

    .logos-footer img{
        max-height: 90px;
        max-width: 100%;
    }

    .logos-footer .logo1{
        width: 56px;
    }

    .logos-footer .logo2,
    .logos-footer .logo3 {
        width: 67px;
    }

    .logos-footer .logo4{
        width: 48px;
    }

    .logos-footer .logo5{
        width: auto;
        height: 18px;
    }

    .logos-footer .logo6{
        width: 66px;
    }

    .logos-footer .logo7{
        width: 64px;
    }    

    .grado .ciclos-list ul {
        padding: 20px 25px;
    }

    .cta-matriculacion {
        font-size: 21px;
        line-height: 24px;
        align-items: center;
        justify-content: center;
        margin: 0 0 10px;
        width: 300px;
        max-width: 100%;
        flex-direction: column;
        min-height: unset;
        text-align: center;
        padding: 19px 38px;
    }

    .cta-matriculacion span {
        margin-top: 16px;
    }


    .mobile {
      display: block;
    } 

    .desktop {
      display: none;
    }
}

.et_boxed_layout #page-container {
    box-shadow: none!important;
    width: 100%!important;
    max-width: unset!important;    
}

.et_fixed_nav.et_show_nav.et_secondary_nav_enabled #page-container {
    padding-top: 0px!important;
}

.et_fixed_nav.et_boxed_layout #page-container #top-header {
    width: 100%!important;
    max-width: unset!important;
    display: none;
}

.et_fixed_nav.et_boxed_layout #page-container #main-header {
    width: 100%!important;
    max-width: unset!important;
    display: none;
}

.et_boxed_layout #page-container .container {
    width: 100%!important;
    max-width: unset!important;
}

.swiper-pagination-bullet {
    width: 22px;
    height: 22px;
    background: #fff;
    opacity: 1;
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--color-red-100);
}

#et-footer-nav {
    display: none;
}


/** CICLOS */
.single-ciclo .encabezado-ciclo {
  flex-direction: row;
  justify-content: space-between;
  align-items: start;
  max-width: 100%;
  padding-left: 20px;
  padding-right: 20px;  
}

.single-ciclo h2 {
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-a1adb5);
  text-align: center;
  font: normal normal bold 60px/62px var(--font-poppins);
  letter-spacing: 0px;
  color: #A1ADB5;
  margin: 58px 0 15px;
}

.single-ciclo .subtitle{
  margin: 0 0 10px;
}

.single-ciclo .subtitle p{
  letter-spacing: var(--unnamed-character-spacing-0);
  text-align: center;
  font-size: 28px;
  line-height: 32px;
  font-family: var(--font-poppins);
  letter-spacing: 0px;
  color: #000000;
  margin: 0;
}

.single-ciclo .subtitle2 {
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-dc0001);
  text-align: center;
  font: normal normal 600 34px/45px var(--font-poppins);
  letter-spacing: 0px;
  color: #DC0001;
  margin: 0;
}

/** BLOQUE DESCRIPCIÓN */

.single-ciclo .description-block {
  background-color: #fff;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  margin-top: 10px;
}

.single-ciclo .description-block .empresas-fondo {
    height: 600px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
}

.single-ciclo .description-block .empresas-content {
  width: 1558px;
  max-width: 100%;
  padding: 75px 20px 77px;
}

.single-ciclo .description-block .empresas-content p{
  text-align: center;
  line-height: 29px;
  font-size: 22px;
  font-weight: 400;
  font-family: var(--font-raleway);
  color: #516270;
  margin-bottom: 30px;
}

.single-ciclo .description-block .empresas-content p:last-of-type{
  margin-bottom: 0px;
}

.single-ciclo .description-block img {
  width: 100%;
  max-width: 100%;  
}

.single-ciclo .description-block > img.bkg-empresas {
  height: 793px;
  width: 100%;
  max-width: 100%;  
  margin-bottom: 35px;
}

.single-ciclo .description-block p {
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-000000);
  text-align: center;
  font: normal normal medium 24px/36px var(--font-raleway);
  letter-spacing: 0px;
  color: #000000;
  margin: 5px 0px;
}

/** BLOQUE REQUISITOS */

.single-ciclo .requirements-block {
  background-color: rgba(218, 220, 222, 0.2);
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  padding-top: 45px;
  padding-left: 20px;
  padding-right: 20px;
}

.single-ciclo .requirements-block h3{
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-000000);
  text-align: center;
  font: normal normal 600 36px/39px var(--font-poppins);
  letter-spacing: 0px;
  color: #000000;
  max-width: 1230px;
  margin: 0 0 0;
}

.single-ciclo .requirements-block .requirements-content{
  letter-spacing: var(--unnamed-character-spacing-0);
  text-align: center;
  font: normal normal medium 18px/24px var(--font-raleway);
  letter-spacing: 0px;
  color: #516270;  
  margin-bottom: 53px;
}

.single-ciclo .requirements-block .requirements-content p{
  margin-bottom: 0px;
}

.single-ciclo .requirements-block .requirements{
  width: 1558px;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  column-gap: 26px;
  row-gap: 86px;
  margin: 0px 0 100px;
  flex-wrap: wrap;
}

.single-ciclo .requirements-block .requirements:has(+ .requirements-content) {
  margin-bottom: 57px;
}

.single-ciclo .requirements-block .requirements + .requirements-content p{
  margin-top: 0;
}

.single-ciclo .requirements-block .requirements .requirement{
  min-width: 370px;
  max-width: 417px;
  flex: 1;
  min-height: 165px;
  border: 0.5px solid #DC0000;
  letter-spacing: var(--unnamed-character-spacing-0);
  text-align: center;
  font: normal normal medium 20px/32px var(--font-raleway);
  letter-spacing: 0px;
  color: #000000;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 31px 35px;
}


/** BLOQUE EQUIPAMIENTOS */
.single-ciclo .equipments-block {
  background-color: #ffffff;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  padding: 47px 20px 100px;
  padding-left: 20px;
  padding-right: 20px;   
}

.single-ciclo .equipments-block h3 {
  font: normal normal 600 36px/32px var(--font-poppins);
  letter-spacing: 0px;
  color: #000000;
  margin: 0;
  text-align: center;
}

.single-ciclo .equipments-block .equipments-content{
  width: 1558px;
  max-width: 100%;
  text-align: center;
  font: normal normal medium 20px/24px Raleway;
  letter-spacing: 0px;
  color: #516270;
}

.single-ciclo .equipments-block .equipments-content p strong{
  letter-spacing: var(--unnamed-character-spacing-0);
  font: normal normal 600 20px/28px var(--font-raleway);
}

.single-ciclo .equipments-block .equipments{
  width: 887px;
  max-width: 100%;
  margin: 0px 0 40px;
  gap: 10px;
  margin: 20px 0 0;
  display: grid;
  grid-template-columns: 1fr;
  grid-auto-rows: auto; /* Cada fila se ajusta al contenido */
  column-gap: auto; /* Espaciado entre columnas */
}

.single-ciclo .equipments-block .equipments .equipment{
  text-align: left;
  font: normal normal medium 20px/40px var(--font-raleway);
  letter-spacing: 0px;
  color: #000000;
  display: flex;
  flex-direction: row;
  align-items: start;
}

.single-ciclo .equipments-block .equipments .equipment span{
  flex: 1;
}

.single-ciclo .equipments-block .equipments .equipment::before{
  background-color: #DC0000;
  width: 16px;
  height: 16px;
  content:" ";
  border-radius: 8px;
  margin-right: 18px;
  display: block;
  margin-top: 7px;  
}


.single-ciclo .equipments-block .equipments .equipment:nth-child(odd) {
  grid-column: 1; /* Primera columna */
}

.single-ciclo .equipments-block .equipments .equipment:nth-child(even) {
  grid-column: 1;
}


/** BLOQUE MODULOS */
.single-ciclo .modules-block {
  background-color: #ffffff;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  padding-bottom: 35px;   
}


.single-ciclo .modules-block .modules-fondo {
  height: 482px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: 100%;
  margin-bottom: 57px;
}

.single-ciclo .modules-block h3 {
  max-width: 1453px;
  letter-spacing: var(--unnamed-character-spacing-0);
  text-align: center;
  font: normal normal 600 36px/44px var(--font-poppins);
  letter-spacing: 0px;
  color: #000000;
  margin: 0;
  padding-left: 20px;
  padding-right: 20px;  
}

.single-ciclo .modules-block .modules-content{
  width: 1558px;
  max-width: 100%;
  letter-spacing: var(--unnamed-character-spacing-0);  
  text-align: center;
  font-size: 20px;
  line-height:28px;
  font-family: var(--font-raleway);
  letter-spacing: 0px;
  color: #000000;
  padding-left: 20px;
  padding-right: 20px;  
}

.single-ciclo .modules-block .modules-content p strong{
  font-size: 20px;
  line-height:28px;
  font-family: var(--font-raleway);
  font-weight: 600;
}

.single-ciclo .modules-block .modules{
  width: 1678px;
  max-width: 100%;
  margin: 0px 0 40px;
  gap: 10px;
  margin: 20px 0 0;
  display: grid;
  grid-template-columns: auto max-content; /* Primera columna se adapta, segunda ocupa el resto */
  grid-auto-rows: auto; /* Cada fila se ajusta al contenido */
  column-gap: auto; /* Espaciado entre columnas */
  margin-bottom: 37px;
  padding-left: 20px;
  padding-right: 20px;  
}

.single-ciclo .modules-block .modules .module{
  text-align: left;
  font-size: 20px;
  font-family: var(--font-raleway);
  letter-spacing: 0px;
  color: #000000;
  display: flex;
  flex-direction: row;
  align-items: start;
}

.single-ciclo .modules-block .modules .module span{
  flex: 1;
}

.single-ciclo .modules-block .modules .module::before{
  background-color: #A1ADB5;
  width: 16px;
  height: 16px;
  content:" ";
  border-radius: 8px;
  margin-right: 18px;
  display: block;
  margin-top: 7px;  
}


.single-ciclo .modules-block .modules .module:nth-child(odd) {
  grid-column: 1; /* Primera columna */
}

.single-ciclo .modules-block .modules .module:nth-child(even) {
  grid-column: 2; /* Primera columna */
  text-align: left;
}




.single-ciclo .modules-block .modules-cta {
  padding: 1.5rem 4rem;
  box-sizing: border-box;
  color: #fff;
  text-decoration: none;
  display: flex;
  flex-direction: row;
  justify-content: center;
  line-height: 45px;
  align-items: center;
  column-gap: 10px;
  margin: 0;
  min-height: 134px;
  width: 619px;
  max-width: 100%;
  padding: 0 47px 0 121px;
  letter-spacing: var(--unnamed-character-spacing-0);
  text-align: center;
  font: normal normal 600 24px/36px var(--font-poppins);
  letter-spacing: 0px;
  color: #FFFFFF;
  background:  var(--color-red-100) url(../public/document.png) no-repeat 34px center;
  background-size: 53px auto;
}

/** Bloque salidas*/

.single-ciclo .salidas-block {
  background-color: rgba(218, 220, 222, 0.2);
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  padding-top: 74px;
  padding-bottom: 72px;
  padding-left: 20px;
  padding-right: 20px;
}

.single-ciclo .salidas-block  h3{
  width: 1558px;
  max-width: 100%;  
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-000000);
  text-align: center;
  font: normal normal 600 37px/32px var(--font-poppins);
  letter-spacing: 0px;
  color: #000000;
  margin-bottom: 27px;
  margin-top: 0;
}

.single-ciclo .salidas-block  .salidas-content{
  width: 1558px;
  max-width: 100%;
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-516270);
  text-align: center;
  font-size:20px;
  line-height: 24px;
  font-family: var(--font-raleway);
  letter-spacing: 0px;
  color: #516270;
}

.single-ciclo .salidas-block  .salidas-content-2{
  width: 1558px;
  max-width: 100%;
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-000000);
  text-align: center;
  font-weight: 200;
  font-size: 20px;
  line-height: 40px;
  font-family: var(--font-raleway);
  letter-spacing: 0px;
  color: #000000;
  margin: 43px 0 0px;
}

.single-ciclo .salidas-block  .salidas-content-2 p{
  margin: 0;
}

.single-ciclo .salidas-block  .salidas-content-2 p strong{
  font-weight: 600;
}

.single-ciclo .salidas-block .salidas{
  width: 1558px;
  max-width: 100%;
  gap: 10px;
  margin: 20px 0 0;
  display: grid;
  grid-template-columns: auto max-content; /* Primera columna se adapta, segunda ocupa el resto */
  grid-auto-rows: auto; /* Cada fila se ajusta al contenido */
  column-gap: auto; /* Espaciado entre columnas */
}

.single-ciclo .salidas-block .salidas.column-1 {
  grid-template-columns: 1fr;
  width: auto;
}


.single-ciclo .salidas-block .salidas .salida{
  letter-spacing: var(--unnamed-character-spacing-0);  
  text-align: left;
  font-family: var(--font-raleway);
  font-size: 20px;
  letter-spacing: 0px;
  color: #000000;
  display: flex;
  flex-direction: row;
  align-items: start;
}

.single-ciclo .salidas-block .salidas .salida:nth-child(odd) {
  grid-column: 1; /* Primera columna */
}

.single-ciclo .salidas-block .salidas .salida:nth-child(even) {
  grid-column: 2; /* Primera columna */
  text-align: left;
}

.single-ciclo .salidas-block .salidas.column-1 .salida:nth-child(odd){
  grid-column: 1;
}

.single-ciclo .salidas-block .salidas.column-1 .salida:nth-child(even){
  grid-column: 1;
}

.single-ciclo .salidas-block .salidas .salida span{
  flex: 1;
}

.single-ciclo .salidas-block .salidas .salida::before{
  width: 16px;
  height: 16px;
  content:" ";
  border-radius: 8px;
  background-color: #DC0001;
  margin-right: 18px;
  display: block;
  margin-top: 7px;
}

.single-ciclo .salidas-block .relacionados{
  border: 0.5px solid #DC0000;
  width: 1558px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  padding: 36px 41px;  
  margin-top: 50px;
}

.single-ciclo .salidas-block .relacionados > p{
  text-align: center;
  font-family: var(--font-raleway);
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  letter-spacing: 0px;
  color: #000000;
  margin: 0;
}

.single-ciclo .salidas-block .relacionados .relacionados-content p{
  text-align: center;
  font-family: var(--font-raleway);
  font-size: 20px;
  line-height: 30px;  
  letter-spacing: 0px;
  color: #516270;
  font-weight: 200;
  margin: 0;
}




.single-ciclo .salidas-block .relacionados .relacionados-list {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: start;
  row-gap: 16px;
  margin: 20px 0 0;
  flex-wrap: wrap;
  width: 100%;
}

.single-ciclo .salidas-block .relacionados .relacionados-list .related{
  width: 651px;
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-000000);
  text-align: left;
  font: normal normal medium 18px/24px var(--font-raleway);
  letter-spacing: 0px;
  color: #000000;
  opacity: 1;
  display: flex;
  flex-direction: row;
  align-items: start;
}

.single-ciclo .salidas-block .relacionados .relacionados-list .related span{
  flex: 1;
}

.single-ciclo .salidas-block .relacionados .relacionados-list .related::before{
  width: 16px;
  height: 16px;
  content:" ";
  border-radius: 8px;
  background-color: #A1ADB5;
  margin-right: 18px;
  display: block;
  margin-top: 7px;
}

/** BLOQUE OPINIONES */
.opiniones-block {
  background-color: #ffffff;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
}


.opiniones-block .opiniones-fondo {
  height: 482px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: 100%;
  margin-bottom: 85px;
}

.opiniones-block h3 {
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-000000);
  text-align: center;
  font: normal normal 600 35px/32px var(--font-poppins);
  letter-spacing: 0px;
  color: #000000;
  width: 1558px;
  max-width: 100%;
  margin: 0;
  padding-left: 20px;
  padding-right: 20px;
}

.opiniones-block .opiniones-content{
  width: 1558px;
  max-width: 100%;
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-516270);
  text-align: center;
  font: normal normal medium 20px/24px var(--font-raleway);
  letter-spacing: 0px;
  color: #516270;
  padding-left: 20px;
  padding-right: 20px;  
}

.opiniones-block .opiniones-content p strong{
  font: normal normal 600 20px/28px var(--font-raleway);
}

.opiniones-block .opiniones{
  width: 1598px;
  max-width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
  column-gap: 31px;
  row-gap: 16px;
  margin: 60px 0 40px;
  flex-wrap: wrap;
  padding-left: 20px;
  padding-right: 20px;  
}

.opiniones-block .opiniones .opinion{
  width: 366px;
  display: flex;
  flex-direction: column;
  background-color: rgba(218, 220, 222, 0.2);
  padding: 40px 34px 10px;
  align-items: center;
}

.opiniones-block .opiniones .opinion .name{
  letter-spacing: var(--unnamed-character-spacing-0);
  color: var(--unnamed-color-000000);
  text-align: center;
  font: normal normal 600 16px/24px var(--font-raleway);
  letter-spacing: 0px;
  color: #000000;
}

.opiniones-block .opiniones .opinion .cargo{
  text-align: center;
  font-family: var(--font-raleway);
  font-size: 12px;
  line-height: 14px;
  letter-spacing: 0px;
  color: #516270;
}

.opiniones-block .opiniones .opinion img{
  width: 110px;
  height: 110px;
  max-width: 100%;
  margin-bottom: 20px;
}

.opiniones-block .opiniones .opinion .opinion-content{
  text-align: center;
  font-family: var(--font-raleway);
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0px;
  color: #516270;
}

/*404*/
.error-404.not-found{
  padding: 20px;
}

.error-404.not-found .page-header h1{
	margin: 0;
	text-align: center;
	font-family: var(--font-poppins);;
	font-size: 60px;
	line-height: 62px;
	font-weight: 800;
	letter-spacing: 0px;
	color: #A1ADB5;
}

.error-404.not-found .page-content p{
  text-align: center;
  font-family: var(--font-poppins);;
	font-size: 23px;
	line-height: 45px;
  letter-spacing: 0px;
  color: #000000;
  margin: 0;
}

.error-404.not-found .page-content p a{
  text-decoration: underline;
  color: #DC0001;
}

.error-404.not-found .page-content p:last-of-type{
  margin-top: 50px;
}

.error-404.not-found .page-content img {
  margin: 80px auto 80px;
  display: block;
}

.page {
  max-width: 100%;
}


.page .entry-header {
  width: 1558px;
  max-width: 100%;
  padding: 20px;  
}

.page .entry-header h1 {
  font-family:  var(--font-poppins);
  font-size: 60px;
  line-height: 62px;  
  color: #A1ADB5;
  margin-bottom: 0;
}

.page .entry-content {
  width: 1558px;
  max-width: 100%;
  padding: 20px;  
}


.page .entry-content h2 {
  font-family:  var(--font-poppins);
  font-size: 34px;
  line-height: 45px;    
  font-weight: 600;
  color: #DC0001;
  margin: 41px 0 12px;
}

.page .entry-content p {
  font-family: var(--font-raleway);
  font-size: 24px;
  line-height: 34px;    
  color: #000000;
  margin: 15px 0;
}

.page .entry-content a {
  color: #DC0001;
}


@media screen and (max-width: 768px) {

  .single-ciclo h2 {
    font-family:  var(--font-poppins);
    font-size: 23px;
    line-height: 27px;
    margin-top: 15px;
  }
  
  .single-ciclo .subtitle p{
    font-size: 12px;
    line-height: 16px;
  }
  
  .single-ciclo .subtitle2 {
    font-size: 16px;
    line-height: 20px;
  }

  /** BLOQUE DESCRIPCIÓN */

  .single-ciclo .description-block .empresas-fondo {
      height: 160px;
  }

  .single-ciclo .description-block .empresas-content {
    padding: 33px 20px 11px;
  }

  .single-ciclo .description-block .empresas-content p{
    font-size:12px;
    line-height:16px;
  }

  .single-ciclo .description-block > img.bkg-empresas {
    height: 160px;
  }

  .single-ciclo .description-block p {
    font-size:12px;
    line-height:16px;
  }  

  /** BLOQUE REQUISITOS */

  .single-ciclo .requirements-block h3{
    font-size:18px;
    line-height:21px;
  }

  .single-ciclo .requirements-block .requirements-content{
    font-size:14px;
    line-height:18px;
    margin-bottom: 30px;
  }

  .single-ciclo .requirements-block .requirements{
    row-gap: 25px;
    margin-bottom: 40px;
  }    

  .single-ciclo .requirements-block .requirements .requirement{
    font-size:16px;
    line-height:20px;
    min-width: 100%;
    max-width: 100%;
  }  

  /** BLOQUE MODULOS */
  .single-ciclo .modules-block {

  }


  .single-ciclo .modules-block .modules-fondo {
    height: 160px;
    margin-bottom: 12px;
  }

  .single-ciclo .modules-block h3 {
    font-size:18px;
    line-height:21px; 
  }

  .single-ciclo .modules-block .modules-content{
    font-size:14px;
    line-height:18px;   
  }

  .single-ciclo .modules-block .modules-content p strong{
    font-size:14px;
    line-height:18px; 
  }

  .single-ciclo .modules-block .modules{
    grid-template-columns: 1fr;
    gap: 0px;
    margin-top: 0;
  }

  .single-ciclo .modules-block .modules .module{
    font-size:11px;
    line-height:24px;
    text-align: left; 
    grid-column: 1;
  }

  .single-ciclo .modules-block .modules .module span{
    flex: 1;
  }

  .single-ciclo .modules-block .modules .module::before{
    width: unset;
    height: unset;
    content:"-";
    border-radius: unset;
    margin-right: 5px;
    background-color: unset;
    margin-top: unset;
  }


  .single-ciclo .modules-block .modules .module:nth-child(odd) {
    grid-column: 1; /* Primera columna */
    text-align: left;

  }

  .single-ciclo .modules-block .modules .module:nth-child(even) {
    grid-column: 1; /* Primera columna */
    text-align: left;
  }

  .single-ciclo .modules-block .modules-cta {
    width: 300px;
    font-size:14px;
    line-height:18px;
    padding: 9px 20px 9px 83px;
    height: unset;
    min-height: unset;
    background-size: 33px auto;
  }  

  /** Bloque salidas*/

  .single-ciclo .salidas-block {
    padding-top: 22px;
    padding-bottom: 44px;
  }

  .single-ciclo .salidas-block  h3{
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 0px;
  }

  .single-ciclo .salidas-block  .salidas-content{
    font-size: 14px;
    line-height: 20px;
  }

  .single-ciclo .salidas-block  .salidas-content-2{
    font-size: 14px;
    line-height: 20px;
    margin-top: 16px;
  }


  .single-ciclo .salidas-block .salidas{
    gap: 0px;
    display: grid;
    grid-template-columns: 1fr; /* Primera columna se adapta, segunda ocupa el resto */
    margin-top: 0px;
  }

  .single-ciclo .salidas-block .salidas .salida{
    font-size: 11px;
    line-height: 24px;
    text-align: left;
  }

  .single-ciclo .salidas-block .salidas .salida:nth-child(odd) {
    grid-column: 1; /* Primera columna */
  }

  .single-ciclo .salidas-block .salidas .salida:nth-child(even) {
    grid-column: 1; /* Primera columna */
  }

  .single-ciclo .salidas-block .salidas .salida::before{
    width: unset;
    height: unset;
    content:"-";
    border-radius: unset;
    background-color: unset;
    margin-right: 5px;
    margin-top: unset;
  }

  .single-ciclo .salidas-block .relacionados{  
    margin-top: 20px;
    padding: 15px 20px;
  }

  .single-ciclo .salidas-block .relacionados > p{
    font-size: 16px;
    line-height: 20px;
  }

  .single-ciclo .salidas-block .relacionados .relacionados-content p{
    font-size: 12px;
    line-height: 20px;
  }

  .single-ciclo .salidas-block .relacionados .relacionados-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 20px;
  }

  .single-ciclo .salidas-block .relacionados .relacionados-list .related{
    font-size: 12px;
    line-height: 20px;
    width: unset;
    max-width: 100%;
  }

  .single-ciclo .salidas-block .relacionados .relacionados-list .related span{
    flex: 1;
  }

  .single-ciclo .salidas-block .relacionados .relacionados-list .related::before{
    width: unset;
    height: unset;
    content:"-";
    border-radius: unset;
    background-color: unset;
    margin-right: 5px;
    margin-top: unset;
  }  

  /** BLOQUE OPINIONES */
  .single-ciclo .opiniones-block {
    padding-left: 0px;
    padding-right: 0px;
  }


  .single-ciclo .opiniones-block .opiniones-fondo {
    height: 160px;
    margin-bottom: 18px;
  }

  .single-ciclo .opiniones-block h3 {
    font-size: 20px;
    line-height: 24px;
  }

  .single-ciclo .opiniones-block .opiniones-content{
    font-size: 14px;
    line-height: 20px; 
  }

  .single-ciclo .opiniones-block .opiniones-content p strong{
    font-size: 14px;
    line-height: 20px; 
  }

  .single-ciclo .opiniones-block .opiniones{
    margin-top: 0px;
    padding: 0;
  }

  .single-ciclo .opiniones-block .opiniones .opinion{
    width: unset;
    max-width: 100%;
  }

  .single-ciclo .opiniones-block .opiniones .opinion .name{
    font-size: 16px;
    line-height: 24px; 
  }

  .single-ciclo .opiniones-block .opiniones .opinion .cargo{
    font-size: 12px;
    line-height: 24px; 
  }

  .single-ciclo .opiniones-block .opiniones .opinion img{

  }

  .single-ciclo .opiniones-block .opiniones .opinion .opinion-content{
    font-size: 14px;
    line-height: 20px;
  }  

  /** BLOQUE EQUIPAMIENTOS */
  .single-ciclo .equipments-block {
    padding: 23px 20px;
  }

  .single-ciclo .equipments-block h3 {
    font-size: 18px;
    line-height: 21px;
  }

  .single-ciclo .equipments-block .equipments-content{
    font-size: 14px;
    line-height: 18px;
    color:#000000;    
  }

  .single-ciclo .equipments-block .equipments-content p{
    margin-bottom: 0;
  }


  .single-ciclo .equipments-block .equipments-content p strong{
    font-size: 14px;
    line-height: 18px;
    color:#000000;
  }

  .single-ciclo .equipments-block .equipments{
    margin-top: 10px;
  }

  .single-ciclo .equipments-block .equipments .equipment{
    font-size: 14px;
    line-height: 18px;
    text-align: center;
  }

  .single-ciclo .equipments-block .equipments .equipment span{
    flex: 1;
  }

  .single-ciclo .equipments-block .equipments .equipment::before{
    background-color: unset;
    width: unset;
    height: unset;
    content:"";
    border-radius: unset;
    margin-right: unset;
  }


  .single-ciclo .equipments-block .equipments .equipment:nth-child(odd) {
    grid-column: 1; /* Primera columna */
  }

  .single-ciclo .equipments-block .equipments .equipment:nth-child(even) {
    grid-column: 1;
  }

  .error-404.not-found .page-header h1{
    font-size: 36px;
    line-height: 38px;
  }
  
  .error-404.not-found .page-content p{
    font-size: 18px;
    line-height: 24px;
  }  

  .page .entry-header h1 {
    font-size: 36px;
    line-height: 38px;
  }  

  .page .entry-content h2 {
    font-size: 18px;
    line-height: 24px;
  }
  
  .page .entry-content p {
    font-size: 18px;
    line-height: 24px;
  }  

  .page .entry-content ul {
    padding: 0 0 0 20px;
    margin: 10px 0;
    font-size: 18px;
    line-height: 24px;
  }
  
  .page .entry-content ul li{
    padding: 0;
    margin: 0;
    font-size: 18px;
    line-height: 24px;
  }  
}

/* ==========================================================================
   Razones — alineado de las tarjetas
   ==========================================================================
   Las tres partes de cada tarjeta —imagen, título y descripción— tienen que
   caer a la misma altura en todas, pero cada título ocupa las líneas que ocupa.
   Antes se resolvía reservando 140px de alto en el título, lo que alineaba a
   costa de dejar hueco muerto bajo los cortos.

   Con subgrid cada tarjeta hereda las filas de la lista, así que cada banda mide
   lo que el contenido más alto que haya de verdad: no hay número que mantener ni
   supuesto sobre cuántas líneas ocupa el título más largo.

   grid-auto-flow: column con grid-auto-columns: 1fr crea una columna por
   tarjeta, sean las que sean, sin fijar el número.

   Cada parte se ancla a su fila con grid-row en lugar de dejar que caigan por
   orden: en secundaria el icono es condicional, y una tarjeta sin él correría su
   título a la banda de la imagen.

   Va aquí y no en bachillerato.css porque esa hoja no carga en la portada de FP,
   que es donde nació este componente. Colegio queda fuera: su rejilla 3+2 es un
   flex con reparto propio. Y solo en escritorio: apiladas en una columna no hay
   nada que alinear.
   ========================================================================== */

@media (min-width: 769px) {
  .site-main:not(.colegio) .razones-list {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    grid-template-rows: auto auto auto;
    /* .razones-list trae align-items: start, que impediría a la tarjeta ocupar
       sus tres filas y dejaría el subgrid sin efecto. */
    align-items: stretch;
  }

  .site-main:not(.colegio) .razon {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 3;
  }

  .site-main:not(.colegio) .razon .razon-image {
    grid-row: 1;
  }

  .site-main:not(.colegio) .razon .razon-title {
    grid-row: 2;
    margin-bottom: 10px;
  }

  .site-main:not(.colegio) .razon .razon-desc {
    grid-row: 3;
  }
}