@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

    /* Reset exprés */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
      font-family: "Lato", sans-serif;
    }

    html{
      scroll-behavior: smooth;
    }

/* ===== Variables ===== */
:root {
    --bs-gutter-x: 1.5rem; /* espacio horizontal entre columnas */
  }
  
  /* ===== CONTENEDORES ===== */
  /* Fluido al 100% */
  .container-fluid {
    display: block;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left:  calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left:  auto;
  }
  
  /* Fijo según breakpoints */
  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl {
    display: block;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left:  calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left:  auto;
  }
  /* Desde sm (≥576px) */
  @media (min-width: 576px)  { .container, .container-sm  { max-width: 540px; } }
  
  /* Desde md (≥768px) */
  @media (min-width: 768px)  { .container, .container-md  { max-width: 720px; } }
  
  /* Desde lg (≥992px) */
  @media (min-width: 992px)  { .container, .container-lg  { max-width: 960px; } }
  
  /* Desde xl (≥1200px) */
  @media (min-width: 1440px) { .container, .container-xl  { max-width:1248px; } }
  
  
  /* ===== FILAS ===== */
  .row {
    display: flex;
    flex-wrap: wrap;
    margin-right: calc(var(--bs-gutter-x) / -2);
    margin-left:  calc(var(--bs-gutter-x) / -2);
  }
  .row > * {
    padding-right: calc(var(--bs-gutter-x) / 2);
    padding-left:  calc(var(--bs-gutter-x) / 2);
  }
  
  
  /* ===== COLUMNAS BASE ===== */
  /* Ocupa todo el ancho disponible */
  .col {
    display: block;
    flex: 1 0 0%;
    max-width: 100%;
  }
  /* Auto-ajuste al contenido */
  .col-auto {
    display: block;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  
  /* 12 columnas: 1 = 8.3333%, …, 12 = 100% */
  .col-1  { flex: 0 0  8.333333%; max-width:  8.333333%; }
  .col-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
  .col-3  { flex: 0 0 25.000000%; max-width: 25.000000%; }
  .col-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
  .col-6  { flex: 0 0 50.000000%; max-width: 50.000000%; }
  .col-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
  .col-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
  .col-9  { flex: 0 0 75.000000%; max-width: 75.000000%; }
  .col-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
  .col-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
  .col-12 { flex: 0 0 100.000000%; max-width:100.000000%; }
  
  
  /* ===== RESPONSIVO: SM — MD — LG — XL ===== */
  
  /* SM ≥576px (igual que .col) */
  @media (min-width: 576px) {
    .col-sm    { flex: 1 0 0%; max-width: 100%; }
    .col-sm-1  { flex: 0 0  8.333333%; max-width:  8.333333%; }
    .col-sm-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-sm-3  { flex: 0 0 25.000000%; max-width: 25.000000%; }
    .col-sm-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-sm-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-sm-6  { flex: 0 0 50.000000%; max-width: 50.000000%; }
    .col-sm-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-sm-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-sm-9  { flex: 0 0 75.000000%; max-width: 75.000000%; }
    .col-sm-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-sm-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-sm-12 { flex: 0 0 100.000000%; max-width:100.000000%; }
  }
  
  /* MD ≥768px */
  @media (min-width: 768px) {
    .col-md    { flex: 1 0 0%; max-width: 100%; }
    .col-md-1  { flex: 0 0  8.333333%; max-width:  8.333333%; }
    .col-md-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-md-3  { flex: 0 0 25.000000%; max-width: 25.000000%; }
    .col-md-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-md-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-md-6  { flex: 0 0 50.000000%; max-width: 50.000000%; }
    .col-md-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-md-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-md-9  { flex: 0 0 75.000000%; max-width: 75.000000%; }
    .col-md-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-md-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-md-12 { flex: 0 0 100.000000%; max-width:100.000000%; }
  }
  
  /* LG ≥992px */
  @media (min-width: 992px) {
    .col-lg    { flex: 1 0 0%; max-width: 100%; }
    .col-lg-1  { flex: 0 0  8.333333%; max-width:  8.333333%; }
    .col-lg-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-lg-3  { flex: 0 0 25.000000%; max-width: 25.000000%; }
    .col-lg-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-lg-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-lg-6  { flex: 0 0 50.000000%; max-width: 50.000000%; }
    .col-lg-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-lg-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-lg-9  { flex: 0 0 75.000000%; max-width: 75.000000%; }
    .col-lg-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-lg-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-lg-12 { flex: 0 0 100.000000%; max-width:100.000000%; }
  }
  
  /* XL ≥1200px */
  @media (min-width: 1248px) {
    .col-xl    { flex: 1 0 0%; max-width: 100%; }
    .col-xl-1  { flex: 0 0  8.333333%; max-width:  8.333333%; }
    .col-xl-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
    .col-xl-3  { flex: 0 0 25.000000%; max-width: 25.000000%; }
    .col-xl-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
    .col-xl-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
    .col-xl-6  { flex: 0 0 50.000000%; max-width: 50.000000%; }
    .col-xl-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
    .col-xl-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
    .col-xl-9  { flex: 0 0 75.000000%; max-width: 75.000000%; }
    .col-xl-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
    .col-xl-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
    .col-xl-12 { flex: 0 0 100.000000%; max-width:100.000000%; }
  }
  



  .mb-16{
    margin-bottom: 16px;
  }
/*general*/
.prelative{
  position: relative;
  z-index: -1;
}

.p-0{
  padding: 0!important;
}

/**/



/*todos*/

    .line-uc{
      width: 100%;
      height: 4px;
      background: linear-gradient(90deg, #707070 0%, #707070 11%, #BFDDF7 11.1%, #BFDDF7 27%, #FFC60C 27.1%, #FFC60C 54%, #2A7DE1 54.1%, #2A7DE1 100%);
    }

    /* =========================================================
   1.  SKELETON GLOBAL
   ---------------------------------------------------------*/
   .hero-skeleton{
    position:absolute; inset:0;
    background:#a9a9a9;                                         /* color UC oscuro */
    background-image:linear-gradient(120deg,                    /* shimmer opcional */
        rgba(255,255,255,.3) 0%,
        rgba(255,255,255,.05) 40%,
        rgba(255,255,255,.3) 100%);
    background-size:200% 100%;
    animation:sheen 1.8s linear infinite;
    z-index:2;                                                  /* debajo de curvas, encima de degradado */
    transition:opacity .35s ease;
  }
  @keyframes sheen{
    0%  {background-position:-200% 0;}
    100%{background-position: 200% 0;}
  }


    /* ===== Media layer (img + video) ===== */
    .hero-media{position:absolute; inset:0; overflow:hidden;}

    .hero-img {                        /* foto → capa inferior */
      position:absolute; inset:0;
      width:100%; height:100%;
      object-fit:cover;
      z-index:-1;  
      transition:opacity .3s ease;     /* sin delay por defecto */
    }
    
    .hero video{                       /* video → capa superior */
      position:absolute; inset:0;
      width:100%; height:100%;
      object-fit:cover;
      z-index:0;  
      opacity:0;                       /* arranca invisible */
      transition:opacity .4s ease;     /* fade-in */
    }


    .hero.hero-ready  .hero-skeleton{opacity:0; pointer-events:none;} /* foto + PNG OK */
.hero.video-ready video         {opacity:1;}                      /* video OK       */
.hero.hide-img    .hero-img     {opacity:0; pointer-events:none;} /* quitar foto    */

/* Arrancamos con: foto visible, video invisible */
.hero video{opacity:0;}

/* Cuando el video esté listo… */
.hero.video-ready video{opacity:1;}
.hero.hide-img .hero-img{opacity:0;}

    .hero {
      position: relative;
      width: 100%;
      height: 720px;
      /* ocupa el 80 % del alto de la ventana */
      min-height: 700px;
      /* pero nunca menos de 600 px */
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
    }

    .hero .curva {
      position: absolute;
      bottom: -2px;
      left: 50%;
      transform: translateX(-50%);
      min-width: 1200px;
      width: 100vw;
      height: auto;
      z-index: 3;
      user-select: none;
      -webkit-user-select: none;
      pointer-events: none;
    }

    .hero .line {
      position: absolute;
      bottom: 20px;
      left: 50%;
      transform: translateX(-50%);
      min-width: 1200px;
      width: 100vw;
      height: auto;
      z-index: 3;
      opacity: .4;
      user-select: none;
      -webkit-user-select: none;
      pointer-events: none;
    }



    .hero .degradado {
      position: absolute;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100%;
      background: linear-gradient(270deg, rgba(3, 18, 46, 0.00) 0%, rgba(3, 18, 46, 0.64) 100%);
      z-index: 1;

    }

    .hero video {
      width: 100%;
      height: 80vh;
      min-height: 700px;
      object-fit: cover;
      position: relative;
      z-index: -1;
    }

    .hero::before{
      content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(https://ingenieriaindustrial.ing.uc.cl/wp-content/uploads/2025/05/pattern-banner.png) repeat top left;
    pointer-events: none;
    z-index: 1;
    mix-blend-mode: multiply;
    opacity: .5;

    }


    .hero .content-hero {
      position: absolute;
      top: 132px;
      text-align: center;
      z-index: 3;
      width: 100%;
      height: 540px;
    }

    .hero .content-hero .content-text {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      z-index: 4;

    }

    .hero .content-hero h1 {
      color: #FFF;
      font-size: 36px;
      font-style: normal;
      font-weight: 400;
      line-height: 40px;
      margin: 0 16px;
    }

    .hero .content-hero h1::after {
      content: "";
      display: block;
      width: 132px;
      height: 4px;
      background-color: #FFC60C;
      margin: 16px auto 0px;
    }

    .hero .content-hero h3 {
      color: #FFF;
      text-align: center;
      font-size: 20px;
      font-weight: 300;
      margin: 16px;
      margin-bottom: 20px;
    }


.content-cta{
  position: absolute;
  bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.cta-wsp{
  border-radius: 8px;
    background: #fff;
    padding: 18px 30px;
    text-decoration: none;
    color: #0176DE;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 8px;
    transition: .2s ease;
    margin: 0;
    align-items: center;
    justify-content: center;
    display: flex;
    gap: 4px;

}

.cta-wsp:hover{
    background: #EEF5FD;
}
    .hero .content-hero h2 {
      color: #FFF;
      font-size: 20px;
      font-weight: 300;
      display: inline-block;
      border-radius: 8px;
      border: 1px solid #FFF;
      background: rgba(42, 125, 225, 0.70);
      backdrop-filter: blur(40px);
      -webkit-backdrop-filter: blur(40px);
      padding: 16px 24px;
      margin-bottom: 16px;
    }

    .hero .content-hero h2 strong {
      font-weight: 400;
    }

    .hero .content-hero .cta-principal {
      border-radius: 8px;
      background: #FFC60C;
      padding: 18px 30px;
      text-decoration: none;
      color: #08275C;
      text-align: center;
      font-size: 16px;
      font-weight: 400;
      margin-bottom: 8px;
      transition: .2s ease;
      margin: 0;
    }

    .cta-principal {
      border-radius: 8px;
      background: #FFC60C;
      padding: 18px 30px;
      text-decoration: none;
      color: #08275C;
      text-align: center;
      font-size: 16px;
      font-weight: 400;
      margin-bottom: 8px;
      transition: .2s ease;
      border: none;
       align-items: center;
    justify-content: center;
    display: flex;
    gap: 4px;
    }


    .btn-form {
      border-radius: 8px!important;
      background: #FFC60C!important;
      padding: 18px 30px!important;
      text-decoration: none!important;
      color: #08275C!important;
      text-align: center!important;
      font-size: 16px!important;
      font-weight: 400!important;
      margin-bottom: 8px!important;
      transition: .2s ease!important;
      border: none!important;
    }

    .btn-form:hover {
      background-color: #e3ae00!important;
      box-shadow:inherit!important;

    }

    .hero .content-hero p {
      color: #FFF;

      text-align: center;
      font-size: 14px;
      font-weight: 300;

    }

    :root{--gap:1.25rem;--anim:.35s}
    .visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0)}
/* ---------- Barra ---------- */
.logo-uc-nav{
  width: 200px;

}
.contact-nav{z-index:1000;position: absolute;margin-top: 24px; width: 100%; padding: 0 16px;}
.content-nav{display:flex;align-items:center;justify-content:space-between;gap:var(--gap);}
.brand-logo{height:40px;width:auto}
.more-desktop{display: none;}

/* ---------- Wrapper para reservar alto ---------- */
.toggle-wrapper{display:flex;flex-direction:column;align-items:center;min-height:40px;gap: 8px;}

/* Texto mobile sobre el botón */
.more-mobile{color: #FFF;

  text-align: center;
  font-family: Lato;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;}
@media (min-width:48rem){.more-mobile{display:none}}     /* ocúltalo en desktop */

/* ---------- Botón toggle ---------- */
.nav-toggle{
    background:transparent;border:1px solid rgba(255,255,255,.9);
  border-radius:100%;width:40px;height:40px;
  display:inline-flex;justify-content:center;align-items:center;
  font-size:16px;color:#fff;cursor:pointer;
  transition:transform .3s ease;
  z-index: 1000;
}
.contact-nav.is-open .nav-toggle{transform:rotate(90deg)}

/* ---------- Overlay (móvil) ---------- */
.content-info{
  position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;
  background:rgba(3,18,46,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:900;
  opacity:0;pointer-events:none;transition:opacity var(--anim) ease;
}
.contact-nav.is-open .content-info{opacity:1;pointer-events:auto}

#nav-links{list-style:none;display:flex;flex-direction:column;gap:2rem; }
#nav-links li{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;
  opacity:0;transform:translateX(20px)}
#nav-links a{color: #FFF;

  font-family: Lato;
  font-size: 20px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;display:flex;gap:16px;align-items:flex-start;text-decoration:none}
#nav-links img{width:24px;height:24px;object-fit:contain}

/* Animación escalonada */
@keyframes fadeSlide{to{opacity:1;transform:translateX(0)}}
.contact-nav.is-open #nav-links li{animation:fadeSlide .45s cubic-bezier(.4,0,.2,1) forwards}
.contact-nav.is-open #nav-links li:nth-child(1){animation-delay:.05s}
.contact-nav.is-open #nav-links li:nth-child(2){animation-delay:.10s}
.contact-nav.is-open #nav-links li:nth-child(3){animation-delay:.15s}
.contact-nav.is-open #nav-links li:nth-child(4){animation-delay:.20s}
.contact-nav.is-open #nav-links li:nth-child(5){animation-delay:.25s}

/* ---------- Desktop ≥48 rem ---------- */
@media (min-width:48rem){
  .nav-toggle{display:none}                             /* botón sólo móvil */
  .content-info{position:static;opacity:1;pointer-events:auto;
                background:inherit;backdrop-filter:inherit;-webkit-backdrop-filter:inherit; display:flex;align-items:center;gap: 8px;}
  .more-desktop{color: #FFF;

    text-align: center;
    font-family: Lato;
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    ;display: block;}
  #nav-links{flex-direction:row;gap:.75rem}
  #nav-links li{flex-direction:row;gap:.5rem;opacity:1;transform:none;animation:none}
  #nav-links span{display:none}
  #nav-links img{width:20px;height:20px}
}

  

    .line-separator::after {
      content: "";
      display: block;
      width: 100px;
      height: 4px;
      background-color: #FFC60C;
      margin: 16px auto 32px auto;
    }

 
  




   

       




        @media (min-width: 576px) {

          .contact-nav {
            z-index: 1000;
            margin-top: 40px;
        }

        .logo-uc-nav{
          width: 320px;
        
        }

        }

    @media (min-width: 768px) {

      .hero .content-hero h1 {
       font-size: 36px;
      line-height: 40px;
    }
    .hero .content-hero {
      top: inherit;
      height: auto;
  

    }
    .hero .content-hero h3 {
    font-size: 20px;
    font-weight: 300;
    margin-bottom: 32px;
}

.hero .content-hero h2 {
      font-size: 24px;
      padding: 20px 32px;
    }

    .hero .mujer-liderazgo {
      top: -24px;
      width: 390px;
    }
    .content-cta{
  position: relative;
}

.hero .content-hero .cta-principal:hover {
  background-color: #e3ae00;
    }

    .cta-principal:hover {
      background-color: #e3ae00;
        }

             .hero {
      height: 80vh;

    }

    
  }


  @media (min-width: 992px) {



    .hero .content-hero h1 {
      font-size: 40px;
      line-height: 48px;
    }

    .hero .content-hero h3 {
      font-size: 24px;
      margin-bottom: 32px;
  }


  }



.mt-40{
  margin-top: 40px!important;
}



/* ───────────────────────────
   Display helpers: base (xs)
   ─────────────────────────── */
   .d-none  { display: none  !important; }
   .d-block { display: block !important; }
   
   /* ≥ SM (≥ 576 px) */
   @media (min-width:576px) {
     .d-sm-none  { display: none  !important; }
     .d-sm-block { display: block !important; }
   }
   
   /* ≥ MD (≥ 768 px) */
   @media (min-width:768px) {
     .d-md-none  { display: none  !important; }
     .d-md-block { display: block !important; }
   }
   
   /* ≥ LG (≥ 992 px) */
   @media (min-width:992px) {
     .d-lg-none  { display: none  !important; }
     .d-lg-block { display: block !important; }
   }
   
   /* ≥ XL (≥ 1200 px) */
   @media (min-width:1200px) {
     .d-xl-none  { display: none  !important; }
     .d-xl-block { display: block !important; }
   }
   
   /* ≥ XXL (≥ 1400 px) */
   @media (min-width:1400px) {
     .d-xxl-none  { display: none  !important; }
     .d-xxl-block { display: block !important; }
   }



  footer{
    background: #03122E;
    padding: 80px 0;
  }

  footer .content-footer{
    display: flex;
    flex-direction: column;
    color: #fff;
    gap: 16px;
    align-items: center;
  }

  footer .logo-uc-footer{
    width: 180px;

  }

  footer .content-footer .name-site-uc h4{
    color: #FFF;
font-family: Lato;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: 24px;
margin-bottom: 4px;
text-align: center;

  }

  footer .content-footer .name-site-uc h6{
    color: #FFF;

font-family: Lato;
font-size: 14px;
font-style: normal;
font-weight: 300;
line-height: 24px;
margin-bottom: 4px;

  }

  footer .content-footer .name-site-uc p{
    color: #FFF;

font-family: Lato;
font-size: 14px;
font-style: normal;
font-weight: 300;
line-height: 24px;

padding: 2px 8px;
border-radius: 4px;
background: rgba(255, 255, 255, 0.09);
display: inline-block;
margin-bottom: 16px;

  }

  footer .content-footer .content-rrss{
    display: flex;
    flex-direction: row;
    gap: 8px;
    justify-content: center;
  }


  footer .content-footer .canales-link ul {
    display: flex;
    flex-direction: column;
    gap: 16px;
   }

   

  footer .content-footer .canales-link li {
   display: flex;
  }

  footer .content-footer .canales-link li a{
    text-decoration: none;
    display: flex;
   gap: 8px;
   color: #FFF;

text-align: center;
font-family: Lato;
font-size: 16px;
font-style: normal;
font-weight: 300;
line-height: 24px;
  }

  footer .content-footer .name-site-uc::after{
    content: "";
    display: block;
    width: 100%;
    height: .5px;
    background-color: #ffffff;
    margin: 32px auto ;
    opacity: .5;

  }

  footer .content-footer .name-site-uc::before{
    content: "";
    display: block;
    width: 100%;
    height: .5px;
    background-color: #ffffff;
    margin: 32px auto ;
    opacity: .5;

  }

  footer .content-footer .name-site-uc{
    text-align: center;
  }
 



  @media (min-width: 768px) {
    footer .content-footer{
      flex-direction: row;
    }

    footer .content-footer .name-site-uc{
      text-align: left!important;
    }

  footer .content-footer .content-rrss{
    justify-content:flex-start;
  }

  footer .content-footer .name-site-uc::after{
    content: "";
    display: none;
    width: 100%;
    height: .5px;
    background-color: #ffffff;
    margin: 32px auto ;
    opacity: .5;

  }

  footer .content-footer .name-site-uc::before{
    content: "";
    display: none;
    width: 100%;
    height: .5px;
    background-color: #ffffff;
    margin: 32px auto ;
    opacity: .5;

  }
  footer .content-footer{
    gap: 56px;
  }



  }



  @media (min-width: 992px) {

    footer .content-footer .name-site-uc h4{
      font-size: 32px;
      margin-bottom: 8px;
    }

    footer .content-footer{
      gap: 74px;

    }

    footer .content-footer .name-site-uc h6{
      font-size: 16px;
      margin-bottom: 8px;

    }


  }





#form{
  padding: 80px 0;
    background: linear-gradient(180deg, rgba(42, 125, 225, 0.00) 0%, rgba(42, 125, 225, 0.08) 100%);
}


#form .title-section h2{
  color: #08275C;
    text-align: center;
    font-size: 24px;
    font-weight: 400;

}

.container-formulario{
	display:flex;
	align-items:center;
	justify-content:center;
}

#form .container-formulario .formulario-consulta{
  border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 4px 16px 0px rgba(42, 125, 225, 0.16);
    padding: 32px 24px;
	max-width:800px;

}



/*Forminator*/

.uc-card.card-bg--gray {
    background-color: #f6f6f6!important;
}

.forminator-response-message{
border-radius: 4px!important;
font-size: .875em!important;

}

.forminator-success::before{
content: "";
    display: inline-block;
    width: 20px; /* Ancho del icono */
    height: 16px; /* Alto del icono */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' fill='none'%3e%3cpath fill='%2301AB01' fill-rule='evenodd' d='M8.75 16.625a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm-1.792-3.487 7.307-7.016-1.3-1.353-5.938 5.702-2.457-2.62-1.368 1.284 3.756 4.003Z' clip-rule='evenodd'/%3e%3c/svg%3e");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 8px; /* Espacio entre el icono y el texto */
    vertical-align: text-top;

}

.forminator-success{
border: 1px solid #0a0!important;
    background-color: rgba(0, 170, 0, .1)!important;
padding: 16px!important;
border-radius: 4px!important;
}



.box-chekbox .forminator-field{
    border-radius: 4px;
    padding: 24px!important;
	border: 1px solid rgb(234, 234, 234)!important;

}



.text-box-form .forminator-has_error .forminator-checkbox .forminator-checkbox-box {

 border: 1px solid #e3ae00 !important;

}



.text-box-form #consent-1  .forminator-has_error .forminator-checkbox__wrapper  .forminator-checkbox .forminator-checkbox-box{

 border: 1px solid #e3ae00 !important;

}

.forminator-ui.forminator-custom-form-4612.forminator-design--flat .forminator-has_error .forminator-input {
 
    border: 1px solid #e3ae00 !important;
  
}

.forminator-ui.forminator-custom-form-4612.forminator-design--flat .forminator-has_error .forminator-textarea {
 
    border: 1px solid #e3ae00 !important;
  
}



 
/*
.forminator-error-message::before {
    content: "";
    display: inline-block;
    width: 20px; 
    height: 16px; 
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='25' height='21' fill='none'%3e%3cpath fill='%23E3AE00' fill-rule='evenodd' d='M.75 21h24L12.812.187.75 21ZM11.656 8.594h2.188V13h-2.188V8.594Zm0 6.594h2.188v2.156h-2.188v-2.157Z' clip-rule='evenodd'/%3e%3c/svg%3e");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 8px; 
    vertical-align: text-top;
}

*/

.forminator-error-message{

    background-color: #ffffff!important;
    color: #ce9e00!important;
  font-size: 14px !important;
  line-height: 24px !important;
font-weight: 400!important;
padding: 2px 0px!important;


}

    .forminator-field-textarea::after {
    content: "";
    display: block;
    border: 0;
    height: 1px;
margin-top: 40px;
    width: 100%;
    overflow: hidden;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4IiBoZWlnaHQ9IjEiIHZpZXdCb3g9IjAgMCA4IDEiPiAgPHBvbHlnb24gZmlsbD0iZ3JheSIgZmlsbC1ydWxlPSJldmVub2RkIiBwb2ludHM9IjAgMSAwIDAgMyAwIDMgMSIvPjwvc3ZnPg==) center center repeat;
}

.text-box-form #consent-1 .forminator-field .forminator-label {
  color: #707070 !important;
  margin-bottom: 16px !important;
  font-size: 14px !important;
  line-height: 18px !important;
font-weight: 300!important;
}

.text-box-form #consent-1 .forminator-field .forminator-checkbox .forminator-checkbox-box{
      border-radius: 5px!important;
width: 18px!important;
  
background-color: #ffffff!important;
   border: 1px solid #c6c6c6!important;

}

.uc-form-group .forminator-field .forminator-label {

margin-bottom: .5rem!important;


}


.forminator-ui.forminator-custom-form[data-design=flat] 
.forminator-checkbox .forminator-checkbox-box:before {
    content: ""!important;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    background: #0176de;
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 1; /* Asegura que sea visible */
    transform: translate(-50%, -50%);
    transition: 0.2s ease;
box-shadow: 0px 0px 6px 0px #0176DE;
border-radius: 5px;

}

.forminator-ui#forminator-module-4612.forminator-design--flat .forminator-checkbox__label{
font-style: normal!important;
font-weight: 400!important;
color: rgb(33, 37, 41)!important;
font-size: 16px!important;
line-height: 22px!important;

}
    

.font-family{
  font-family: "Lato", sans-serif!important;
}

input, textarea{
  font-family: "Lato", sans-serif!important;
  font-size: 16px;
  font-weight: 300!important;

}


/*GENERAL*/
.mt-80{
  margin-top: 80px;
}

.hero .degradado {
    z-index: inherit!important;
}

.px-sm-24{
  padding: 0 24px;

}

.hero .person {
      position: absolute;
        bottom: -50px;
        left: 50%;
        transform: translateX(-50%);
        width: 360px;
        z-index: 2;
    }



.circle-blue{
  position: absolute;
  top:0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  height: 70%;
  background: linear-gradient(270deg, rgba(1, 118, 222, 0.80) 88.76%, rgba(1, 118, 222, 0.48) 119.76%);
  border-radius: 0 0 500px 500px;
  z-index: 1;
}

.circle-blue-line{
  position: absolute;
  top:0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 24px);
   height: calc(70% + 4px);
  border-radius: 0 0 500px 500px;
border-right: 1px solid rgba(255, 255, 255, .5);
border-bottom: 1px solid rgba(255, 255, 255, .5);
border-left: 1px solid rgba(255, 255, 255, .5);
z-index: 1;
}

.circle-yellow{
  position: absolute;
  bottom:0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  height: 40%;
  background: rgba(255, 198, 12, 0.50);
  border-radius: 500px 500px  0 0;
  z-index: 1;
}

.circle-yellow-line{
  position: absolute;
  bottom:0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 24px);
   height: calc(40% + 4px);
  border-radius: 500px 500px  0 0;
  border-top: 1px solid rgba(255, 255, 255, .5);
border-left: 1px solid rgba(255, 255, 255, .5);
border-right: 1px solid rgba(255, 255, 255, .5);
z-index: 1;
}

/* FIN GENERAL*/
.title-section h2 {
    color: #08275C;
    text-align: center;
    font-size: 24px;
    font-weight: 400;
}

.title-section p {
    color: #000;
    font-size: 16px;
    font-weight: 300;
    margin-bottom: 24px;
    text-align: center;
}

/*-------------- TARJETA --------------*/
.card-area{
  position:relative;
  height:220px;
  padding:16px;
  border:2px solid #FFF;
  border-radius:8px;
  box-shadow:0 16px 16px rgba(42,125,225,.16);
  overflow:hidden;
  background-size:cover;
  background-position:center;
}

.card-area .mas-info{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
background: #E0ECFB;
padding: 4px 10px;
position: absolute;
top: 8px;
right: 8px;
color: #2A7DE1;
font-family: lato;
font-size: 12px;
font-style: normal;
font-weight: 300;
line-height: 10px; /* 100% */
gap: 4px;
transition: all .3s ease;

}

/* degradado */
.card-area::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(8, 39, 92, 0.00) 54.48%, rgba(8, 39, 92, 0.80) 100%);
}
.card-area::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(8, 39, 92, 0.80) 54.48%, rgba(8, 39, 92, 0.80) 100%);
  opacity:0;                    /* oculto por defecto */
  transition:opacity .5s ease; /* misma duración que el resto */
  pointer-events:none;
  z-index: 1;
}

/*-------------- CONTENEDOR TEXTO --------------*/
.card-area-info{
  position:absolute;
  inset:0;
  padding:16px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;   /* título abajo */
  align-items:center;
  gap:12px;
  z-index:2;
  transition:transform .5s ease;
}

/*-------------- TÍTULO --------------*/
.title-area{
  color:#FFF;
  text-align:center;
  font-family:Lato;
  font-size:20px;
  font-weight:500;
  line-height:24px;
}

.title-area::after{
  content:"";
  display:block;
  width:40px;
  height:2px;
  margin:8px auto 0;
  background:#FFD800;
}

/*-------------- DESCRIPCIÓN --------------*/
.card-area-info p{
  margin:0;
  color:#FFF;
  text-align:center;
  font-family:Lato;
  font-size:16px;
  font-weight:300;
  line-height:normal;
  max-height:0;              /* oculto */
  opacity:0;                 /* oculto */
  overflow:hidden;
  transition:
     max-height .5s ease,
     opacity   .3s ease .1s;
}

/*-------------- ESTADOS --------------*/
/* Desktop: hover */
@media (hover:hover){
  .card-area:hover  .card-area-info{ 
    transform:translateY(-20px); 
  }
  .card-area:hover  .card-area-info p{
     max-height:200px;       /* lo suficiente para texto largo */
     opacity:1;
  }
  .card-area:hover::before{ opacity:1; }
}

.card-area.is-open::before{ opacity:1; }

/* Móvil: clase puesta por JS */
.card-area.is-open .card-area-info{ transform:translateY(-20px); }
.card-area.is-open .card-area-info p{
  max-height:200px;
  opacity:1;
}

@media (min-width: 576px) {
  .card-area{

  height:265px;

}



}

@media (min-width: 768px) {

  .px-sm-24{
  padding: inherit;

}
.circle-blue {
    position: absolute;
    top: inherit;
    left: 0;
    width: 60%;
    height: 55%;
    background: linear-gradient(270deg, rgba(1, 118, 222, 0.80) 88.76%, rgba(1, 118, 222, 0.48) 119.76%);
    border-radius: 0 500px 500px 0;
    z-index: 1;
    transform: inherit;
}
.circle-blue-line {
    position: absolute;
    left: 0;
    width: calc(60% + 8px);
    height: calc(55% + 14px);
    border-radius: 0 500px 500px 0;
    border-top: 1px solid rgba(255, 255, 255, .5);
    border-right: 1px solid rgba(255, 255, 255, .5);
    border-bottom: 1px solid rgba(255, 255, 255, .5);
    border-left: inherit;
     transform: inherit;
      top: inherit;
}
.circle-yellow {
    position: absolute;
     transform: inherit;
    bottom: inherit;
    left: inherit;
    right: 0;
    width: 45%;
    height: 55%;
    background: rgba(255, 198, 12, 0.50);
    border-radius: 500px 0 0 500px;
    z-index: 1;
}
.circle-yellow-line {
    position: absolute;
     transform: inherit;
    bottom: inherit;
    left: inherit;
    right: 0;
    width: calc(45% + 8px);
    height: calc(55% + 14px);
    border-radius: 500px 0 0 500px;
    border-top: 1px solid rgba(255, 255, 255, .5);
    border-left: 1px solid rgba(255, 255, 255, .5);
    border-bottom: 1px solid rgba(255, 255, 255, .5);
    border-right: inherit;
}

 .hero .person {
      position: absolute;
        bottom: 0;
        left: 50%;
        transform: inherit;
        width: 520px;
        z-index: 2;
    }




}

#forminator-module-5766.forminator-design--flat .forminator-select2-selections > li {
    background-color: #0176DE!important;
    color: #FFFFFF;
    padding: 10px!important;
    border-radius: 4px!important;
}

.forminator-ui.forminator-custom-form[data-design=flat] select.forminator-select2+.forminator-select .selection span[role=combobox].select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove span {
    line-height: 16px!important;
    height: 14px;
    display: block;
}

.forminator-select-dropdown-container--open .forminator-custom-form-5766.forminator-dropdown--flat .select2-results .select2-results__options .select2-results__option.select2-results__option--selected, .forminator-select-dropdown-container--open .forminator-custom-form-5766.forminator-dropdown--flat .select2-results .select2-results__options .select2-results__option.select2-results__option--selected span:not(.forminator-checkbox-box) {
    background-color: #0176DE!important;
    color: #FFFFFF;
}




.forminator-ui#forminator-module-5766.forminator-design--flat .forminator-select2 + .forminator-select .selection .select2-selection--multiple[role="combobox"] {
    width: 100% !important;
    border: 1px solid #c6c6c6 !important;
    padding: 4px 10px !important;
    line-height: 1 !important;
    transition: .2sease !important;
    position: relative !important;
    background-color: #fff !important;
    min-width: 250px !important;
    border-radius: 4px !important;
	margin-top:8px;
}

.forminator-select-dropdown-container--open .forminator-custom-form-5766.forminator-dropdown--flat {
    background-color: #e3efff!important;
}

.forminator-select-dropdown-container--open .forminator-custom-form-5766.forminator-dropdown--flat .select2-results .select2-results__options .select2-results__option:not(.select2-results__option--selected).select2-results__option--highlighted, .forminator-select-dropdown-container--open .forminator-custom-form-5766.forminator-dropdown--flat .select2-results .select2-results__options .select2-results__option:not(.select2-results__option--selected).select2-results__option--highlighted span:not(.forminator-checkbox-box) {
    background-color: #ADD2F7!important;
    color: #000000;
}

.forminator-select.forminator-select-dropdown-container--open .forminator-select-dropdown.forminator-dropdown--flat .select2-results .select2-results__options .select2-results__option {
    padding: 5px 16px!important;
}


.forminator-ui#forminator-module-5766.forminator-design--flat .forminator-select2 + .forminator-select .selection .select2-selection--single[role="combobox"] {
    width: 100% !important;
    border: 1px solid #c6c6c6 !important;
    padding: 4px 10px !important;
    line-height: 1 !important;
    transition: .2sease !important;
    position: relative !important;
    background-color: #fff !important;
    min-width: 250px !important;
    border-radius: 4px !important;
	margin-top:8px;
}





.forminator-ui.forminator-custom-form-5766.forminator-design--flat
  .forminator-has_error .forminator-input {
    border-color: #e3ae00 !important; 
    box-shadow: none !important;      
}

.forminator-ui#forminator-module-5766.forminator-design--flat .forminator-has_error  .forminator-select2 + .forminator-select .selection .select2-selection--single {
    border: 1px solid #e3ae00 !important;

}

.forminator-ui#forminator-module-5766.forminator-design--flat .forminator-field.forminator-has_error .forminator-select2 + .forminator-select .selection .select2-selection--multiple[role="combobox"] {
    border: 1px solid #e3ae00 !important;
}



.forminator-ui#forminator-module-5766.forminator-design--flat .forminator-field.forminator-has_error .forminator-select2 + .forminator-select .selection .select2-selection--single[role="combobox"] {
    box-shadow: inherit!important;
    -moz-box-shadow:  inherit!important;
    -webkit-box-shadow:  inherit!important;
}

@media (min-width: 783px) {
    .forminator-ui.forminator-custom-form:not(.forminator-size--small)[data-grid=open] .forminator-row-inside:not(:last-child), .forminator-ui.forminator-custom-form:not(.forminator-size--small)[data-grid=open] .forminator-row:not(:last-child) {
        margin-bottom: 24px!important;
    }
}




/*reconocimientos*/
#reconocimientos {
  padding: 100px 0;
  background-color: #2A7DE1;
  position: relative;
  overflow: hidden;
  margin-top: 56px;
}

#reconocimientos::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 40%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0.00) 100%);
  user-select: none;
  -webkit-user-select: none;
pointer-events: none;

}

#reconocimientos::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 40%;
  background: linear-gradient(180deg, rgba(8, 39, 92, 0.00) 0%, rgba(8, 39, 92, 0.20) 100%);
  user-select: none;
  -webkit-user-select: none;
pointer-events: none;

}

.bg-uc-cc {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  mix-blend-mode: soft-light;
  opacity: .2;
  user-select: none;
  -webkit-user-select: none;

pointer-events: none;
}

.bg-uc-cc img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.distinciones {
  width: 148px;
  height: 148px;
  flex-shrink: 0;
  border-radius: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  background: rgba(217, 217, 217, 0.20);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter:blur(2px);
  z-index: 1;
}

.distinciones img{
  width: 60%;
}
.distinciones h5::before{
  content: "";
display: block;
width: 80px;
height: 4px;
background-color: #FFC60C;
margin: 10px auto 8px auto;
}

.distinciones h5 {
  color: #FFF;

  text-align: center;
  font-family: Lato;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;

}

.distinciones h6 {
  color: #FFF;

  text-align: center;
  font-family: Lato;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  margin-top: 4px;
  width: 80%;

}

.distinciones::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  flex-shrink: 0;
  border-radius: 100%;
  width: 110%;
  height: 110%;
  border: 1px solid #fff;
  opacity: .4;
}

.content-reconocimientos {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.content-reconocimientos .responsive-box {
  display: flex;
  gap: 8px;
}

@media (min-width: 576px) {
  .distinciones {
  width: 180px;
  height: 180px;
}
.distinciones h5 {
  font-size: 16px;


}

.fecha-clase ul li{
  display: flex;
  flex-direction: row;

  
  }

  .fecha-clase ul li{
    padding: 8px 8px 8px 16px;
  }


  .fecha-clase ul li h5{
    text-align: left;
    background: inherit;
    width: 100%;
    padding: 0;
    }

  .fecha-clase ul li .cta-principal{
    width: auto;
}

.section-aprendisaje{
padding: 40px 40px;
}



}

@media (min-width: 768px) {
  .content-reconocimientos {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      gap: 8px;
  }

  .content-reconocimientos .responsive-box {
      display: flex;
  }
  .distinciones {
  width: 180px;
  height: 180px;
}




}

@media (min-width: 992px) {
  .content-reconocimientos {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
  }

  .content-reconocimientos .responsive-box {
      display: flex;
  }
  .distinciones {
  width: 200px;
  height: 200px;
}

.fecha-clase ul li{
  padding: 8px;
}

}

/*FIN reconocimientos*/

.textarea-uc textarea{
  min-height: 88px!important;
	margin-top:8px!important;
}