/* clean.css — fuente única (limpio) */

:root{
  --rojo:#e1062c;
  --gris:#f4f5f7;
  --texto:#666666;      /* texto general */
  --azul:#0b5d6e;
  --borde:#e6e6e6;

  /* Logos */
  --logo-jct-h:56px;
  --logo-seed-h:40px;
  --logo-gigante-scale:1.35;

  /* UI */
  --radius:18px;
}

/* Base */
html,body{margin:0;padding:0;background:var(--gris);color:var(--texto);}
body{font-family:"Century Gothic","Segoe UI",system-ui,Arial,sans-serif;}
.wrap{max-width:1100px;margin:0 auto;padding:0 16px;}
.page{padding:20px 0;}

/* Links */
a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:none; }

/* Header */
.site-header{background:#fff;border-bottom:1px solid var(--borde);position:relative;z-index:9999;}
.site-header .brand-row{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:nowrap;padding:10px 0;
}
.site-header .brand-right{display:flex;align-items:center;gap:14px;margin-left:auto;}
.site-header .brand-sep{width:1px;height:32px;background:var(--borde);}
.site-header img{width:auto !important;max-width:none !important;display:block;object-fit:contain;}

.site-header #logo-jct{ height:var(--logo-jct-h) !important; }
.site-header #logo-seed{ height:var(--logo-seed-h) !important; }
.site-header #logo-gigante{
  transform: scale(var(--logo-gigante-scale)) !important;
  transform-origin: center center;
}

/* Menú */
.main-nav{background:#55585d;padding-bottom:2px;overflow-x:hidden !important;overflow-y:visible !important;}
.nav-row{display:flex;align-items:center;gap:2px;flex-wrap:wrap !important;overflow-x:hidden !important;}
.nav-link{
  color:#fff;font-weight:700;
  padding:10px 12px;
  font-size:14px;
  text-decoration:none;
  white-space:nowrap;
  line-height:1.1;
}
.nav-link:hover{background:rgba(255,255,255,.08);}
.nav-link--right{margin-left:auto;}


/* ===== Links: evitar azul/subrayado por defecto ===== */
a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:none; }


/* =========================
   AJUSTES UI (2026-02-10)
   ========================= */

/* 6) Texto negro -> #666666 (manteniendo el header/menú en blanco) */
body{ color:#666666; }

/* 2) Tamaños logos (ajusta aquí) */
:root{
  --logo-jct-h: 56px;
  --logo-seed-h: 40px;
  --logo-gigante-h: 72px; /* <-- cambia aquí hasta que te convenza (54/56/58/60) */
}
.site-header #logo-jct{ height: var(--logo-jct-h) !important; }
.site-header #logo-seed{ height: var(--logo-seed-h) !important; }
.site-header #logo-gigante{ height: var(--logo-gigante-h) !important; }

/* 1 + 7) Menú responsive SIN scroll horizontal + texto 2pt más pequeño */
.nav-row{
  flex-wrap: wrap !important;
  overflow-x: hidden !important;
  justify-content: flex-start;
}
.nav-link{
  font-size: 14px;       /* ~2pt menos que 16px */
  padding: 10px 12px;    /* un poco más compacto */
  line-height: 1.1;
}

/* Evita que el fondo gris “se corte” si el menú hace varias líneas */
.main-nav{ padding-bottom: 2px; }

/* 3) Eliminar franja de 3 logos debajo del menú (ocultar) */
.logos-bar{ display:none !important; }

/* 4) “Ver Universidades / Programas / Empresas” estilo botón gris redondeado
   (sin tocar otros links del sitio) */
a[href="/universidades/"],
a[href="/programas/"],
a[href="/empresas/"],
a[href="/universidades"],
a[href="/programas"],
a[href="/empresas"]{
  display:inline-block;
  background:#e7e7ea;
  border:1px solid #d8d8de;
  border-radius:12px;
  padding:10px 14px;
  font-weight:700;
  color:#555555;
  text-decoration:none;
}
a[href="/universidades/"]:hover,
a[href="/programas/"]:hover,
a[href="/empresas/"]:hover,
a[href="/universidades"]:hover,
a[href="/programas"]:hover,
a[href="/empresas"]:hover{
  filter: brightness(.98);
}

/* 5) Cards “Deseo registrarme…” con degradado + links blancos en negritas
   (usa :has() para seleccionar la card que contiene ese link) */
.card:has(a[href^="/registro/empresa"]),
.card:has(a[href^="/registro/alumno"]){
  background: linear-gradient(180deg, #c6293e 0%, #6f1c52 100%) !important;
  color: #ffffff !important;
}
.card:has(a[href^="/registro/empresa"]) *,
.card:has(a[href^="/registro/alumno"]) *{
  color:#ffffff !important;
}
.card:has(a[href^="/registro/empresa"]) a,
.card:has(a[href^="/registro/alumno"]) a{
  font-family:"Century Gothic","Segoe UI",system-ui,Arial,sans-serif;
  font-weight:700;
  color:#ffffff !important;
  text-decoration:none;
}

/* Para que los botones/links dentro de esas cards resalten un poco */
.card:has(a[href^="/registro/empresa"]) a,
.card:has(a[href^="/registro/alumno"]) a{
  display:inline-block;
  margin-top:10px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:12px;
  background: rgba(255,255,255,.10);
}
.card:has(a[href^="/registro/empresa"]) a:hover,
.card:has(a[href^="/registro/alumno"]) a:hover{
  background: rgba(255,255,255,.16);
}


/* ===== Menú: todos iguales (sin pastillas en 3 links) ===== */
.main-nav a[href="/universidades/"],
.main-nav a[href="/programas/"],
.main-nav a[href="/empresas/"],
.main-nav a[href="/universidades"],
.main-nav a[href="/programas"],
.main-nav a[href="/empresas"]{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 10px 12px !important;
  color: #fff !important;
  font-weight: 700 !important;
  display: inline-block !important;
}

/* ===== Home: cards de registro en 2 columnas ===== */

/* Contenedor que tenga exactamente esas 2 cards */
.page > .grid:has(.card:has(a[href^="/registro/empresa"])):has(.card:has(a[href^="/registro/alumno"])){
  display:grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 18px !important;
}

/* En pantallas pequeñas: una columna */
@media (max-width: 800px){
  .page > .grid:has(.card:has(a[href^="/registro/empresa"])):has(.card:has(a[href^="/registro/alumno"])){
    grid-template-columns: 1fr !important;
  }
}

/* ===== Logo Gigante: agrandar visualmente (PNG con aire) ===== */
.site-header #logo-gigante{
  transform: scale(1.40) !important;   /* sube/baja: 1.25 / 1.35 / 1.45 */
  transform-origin: center center;
}
.site-header .brand-logo:has(#logo-gigante){
  display:flex;
  align-items:center;
}

/* ===== Home: cards registro en 2 columnas (robusto) ===== */
main.page :is(.grid, .cards, .section, .container, .wrap):has(a[href^="/registro/empresa"]):has(a[href^="/registro/alumno"]){
  display:grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 18px !important;
  align-items: stretch;
}

@media (max-width: 900px){
  main.page :is(.grid, .cards, .section, .container, .wrap):has(a[href^="/registro/empresa"]):has(a[href^="/registro/alumno"]){
    grid-template-columns: 1fr !important;
  }
}

/* Que cada card llene su columna bonito */
main.page :is(.grid, .cards, .section, .container, .wrap):has(a[href^="/registro/empresa"]):has(a[href^="/registro/alumno"]) > .card{
  height: 100%;
}

/* ===== Espaciado vertical cards registro (móvil) ===== */
@media (max-width: 900px){
  main.page :is(.grid, .cards, .section, .container, .wrap)
  :has(a[href^="/registro/empresa"])
  :has(a[href^="/registro/alumno"]){
    gap: 28px !important;   /* separación entre cards */
  }
}

/* ===== Fix móvil: espacio entre las 2 cards de registro ===== */
@media (max-width: 900px){
  main.page :is(.grid, .cards, .section, .container, .wrap)
  :has(a[href^="/registro/empresa"]):has(a[href^="/registro/alumno"]){
    grid-template-columns: 1fr !important;
    gap: 28px !important;      /* separación vertical */
    row-gap: 28px !important;  /* por si el navegador ignora gap en grid */
  }

  /* Extra: por si las cards traen márgenes raros o negativos */
  main.page :is(.grid, .cards, .section, .container, .wrap)
  :has(a[href^="/registro/empresa"]):has(a[href^="/registro/alumno"]) > .card{
    margin: 0 !important;
  }
}

/* ===== FIX DEFINITIVO: cards registro en móvil sin encimarse ===== */
@media (max-width: 900px){

  /* El contenedor que tiene ambos links */
  main.page :is(.grid, .cards, .section, .container, .wrap)
  :has(a[href^="/registro/empresa"]):has(a[href^="/registro/alumno"]){
    display:flex !important;
    flex-direction:column !important;
    gap: 28px !important;
  }

  /* Las 2 cards: apagar transform/posicionamientos heredados que provocan encime */
  main.page :is(.grid, .cards, .section, .container, .wrap)
  :has(a[href^="/registro/empresa"]):has(a[href^="/registro/alumno"]) > .card{
    position: relative !important;
    transform: none !important;
    margin: 0 !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
  }
}

/* ===== Home: cards de registro (layout limpio) ===== */
.register-grid{
  display:grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 18px !important;
  align-items: stretch;
}

@media (max-width: 900px){
  .register-grid{
    grid-template-columns: 1fr !important;
    gap: 28px !important;      /* separación vertical */
  }
  .register-grid .card{
    transform:none !important;  /* por si legacy las mueve */
    margin:0 !important;
  }
}

/* ===== Home: cards de registro (layout limpio) ===== */
.register-grid{
  display:grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 18px !important;
  align-items: stretch;
}

@media (max-width: 900px){
  .register-grid{
    grid-template-columns: 1fr !important;
    gap: 28px !important;      /* separación vertical */
  }
  .register-grid .card{
    transform:none !important;  /* por si legacy las mueve */
    margin:0 !important;
  }
}

/* ===== Home: cards de registro (layout definitivo) ===== */
.register-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: stretch;
}

/* Móvil */
@media (max-width: 900px){
  .register-grid{
    grid-template-columns: 1fr;
    gap: 32px; /* separación vertical clara */
  }

  .register-grid .card{
    transform: none !important;
    margin: 0 !important;
    position: relative;
  }
}


/* ===== FIX NUCLEAR: register-grid en móvil sin encimes ===== */
@media (max-width: 900px){

  /* Contenedor: flex vertical */
  .register-grid{
    display:flex !important;
    flex-direction:column !important;
  }

  /* Cards: apagar TODO lo que pueda provocar encime */
  .register-grid > .card{
    position: static !important;   /* mata absolute/fixed */
    transform: none !important;    /* mata translateY */
    animation: none !important;    /* mata fadeUp */
    opacity: 1 !important;         /* por si venían ocultas */
    margin: 0 !important;
    width: 100% !important;
  }

  /* Separación entre card 1 y card 2 */
  .register-grid > .card + .card{
    margin-top: 32px !important;
  }
}

/* ===== Móvil: evitar que el contenido se corte (tablas/listados) ===== */
html, body{
  overflow-x: hidden;
}

/* Cualquier tabla dentro del contenido: que no rompa layout en móvil */
main.page table{
  width: 100%;
  border-collapse: collapse;
}

/* En pantallas pequeñas: tablas scrolleables dentro de su contenedor */
@media (max-width: 900px){
  main.page table{
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
  }

  /* Evita que celdas gigantes empujen el layout */
  main.page th, main.page td{
    white-space: nowrap;
    vertical-align: top;
  }
}

/* ===== Formularios: alineados en web y móvil ===== */
main.page form{
  max-width: 100%;
}

main.page label{
  display:block;
  font-weight: 600;
  margin: 10px 0 6px;
}

main.page input[type="text"],
main.page input[type="email"],
main.page input[type="tel"],
main.page input[type="number"],
main.page input[type="password"],
main.page select,
main.page textarea{
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid #d8d8de;
  border-radius: 10px;
  font-family: "Century Gothic","Segoe UI",system-ui,Arial,sans-serif;
  color: #666666;
  background: #fff;
}

/* Textarea más agradable */
main.page textarea{
  min-height: 110px;
  resize: vertical;
}

/* Botones */
main.page button,
main.page input[type="submit"],
main.page .btn{
  font-family: "Century Gothic","Segoe UI",system-ui,Arial,sans-serif;
  font-weight: 700;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: #e7e7ea;
  color: #555;
  cursor: pointer;
}
main.page button:hover,
main.page input[type="submit"]:hover,
main.page .btn:hover{
  filter: brightness(.98);
}

/* Evitar que algún input “se salga” del card */
.card{ overflow: hidden; }


/* ===== Tablas en móvil: compactas, sin huecos enormes ===== */
@media (max-width: 900px){
  main.page table{
    white-space: normal !important; /* permite envolver texto */
  }

  main.page th, main.page td{
    padding: 8px 10px !important;   /* menos espacio interno */
    font-size: 13px;                /* compacto */
    line-height: 1.2;
    white-space: normal !important; /* evita columnas con huecos por nowrap */
    word-break: break-word;
  }

  /* Si algún CSS heredado pone min-width en columnas, lo anulamos */
  main.page th, main.page td{
    min-width: 0 !important;
  }
}

/* =====================================================
   TABLAS RESPONSIVAS – HEADER FIJO (WEB + MÓVIL)
   ===================================================== */

main.page table{
  width: 100%;
  border-collapse: collapse;
}

/* Header fijo vertical */
main.page thead th{
  position: sticky;
  top: 0;
  z-index: 5;
  background: #f9f9f9;
  color: #555;
  font-weight: 700;
  text-align: left;
  border-bottom: 2px solid #ddd;
}

/* Celdas */
main.page th,
main.page td{
  padding: 12px 14px;
  font-size: 14px;
  color: #666;
  vertical-align: top;
  white-space: normal;
}

/* ================= MÓVIL ================= */
@media (max-width: 900px){

  main.page table{
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
  }

  main.page th,
  main.page td{
    padding: 10px 12px;
    font-size: 13px;
    line-height: 1.25;
  }

  /* Primera columna fija */
  main.page th:first-child,
  main.page td:first-child{
    position: sticky;
    left: 0;
    z-index: 6;
    background: #fff;
    min-width: 180px;
    border-right: 1px solid #eee;
  }

  main.page thead th:first-child{
    z-index: 7;
    background: #f3f3f3;
  }
}



/* =====================================================
   TABLAS: header fijo + solo filas scrolleables (UX pro)
   ===================================================== */
main.page .table-scroll{
  max-height: 62vh;                /* ajusta: 55-70vh */
  overflow: auto;                  /* vertical + horizontal si hace falta */
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(0,0,0,.06);
}

/* Si no hay wrapper .table-scroll, aplica directo a las tablas del contenido */
main.page table{
  width: 100%;
  border-collapse: separate;       /* mejor con sticky */
  border-spacing: 0;
}

/* Cabecera fija */
main.page thead th{
  position: sticky;
  top: 0;
  z-index: 10;
  background: #f3f3f3;
  border-bottom: 2px solid #ddd;
}

/* Celdas */
main.page th, main.page td{
  padding: 10px 12px;
  font-size: 13px;
  color: #666;
  vertical-align: top;
  border-bottom: 1px solid #eee;
}

/* Congelar primera columna (Programa) */
main.page th:first-child,
main.page td:first-child{
  position: sticky;
  left: 0;
  z-index: 11;
  background: #fff;
  border-right: 1px solid #eee;
}

/* Intersección: header + primera columna */
main.page thead th:first-child{
  z-index: 12;
  background: #eaeaea;
}

/* ===== Ajuste específico: evitar “letras en columna” en Área/Subnivel ===== */
main.page th:nth-child(3),
main.page td:nth-child(3),
main.page th:nth-child(5),
main.page td:nth-child(5){
  white-space: nowrap;             /* NO romper palabras */
  min-width: 130px;                /* asegura lectura */
  text-align: left;
}

/* Programa e Institución un poco más angostas para reducir ancho total */
main.page th:nth-child(1),
main.page td:nth-child(1){
  min-width: 220px;
}
main.page th:nth-child(2),
main.page td:nth-child(2){
  min-width: 220px;
}

/* Columnas cortas centradas */
main.page th:nth-child(4),
main.page td:nth-child(4){
  min-width: 60px;
  text-align: center;
  white-space: nowrap;
}

/* Móvil: permitir un poco de scroll horizontal (mejor que texto ilegible) */
@media (max-width: 900px){
  main.page table{
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  main.page th, main.page td{
    font-size: 12px;
    padding: 8px 10px;
  }
}


/* ===== Contenedor scrolleable para tablas (header fijo) ===== */
main.page .table-scroll{
  max-height: 62vh;
  overflow: auto;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(0,0,0,.06);
}


/* ===== Header fijo en tablas dentro de .table-scroll ===== */
main.page .table-scroll table{
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
}

main.page .table-scroll thead th{
  position: sticky;
  top: 0;
  z-index: 50;
  background: #f3f3f3;
  color: #555;
  font-weight: 700;
  border-bottom: 2px solid #ddd;
}

/* para que no se transparente cuando hay scroll */
main.page .table-scroll tbody td{
  background: #fff;
}


/* ===== FOOTER INSTITUCIONAL ===== 
.site-footer {
  background: #5a5d61;
  color: #ffffff;
  padding: 48px 24px;
  margin-top: 64px;
}

.footer-wrap {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 48px;
}

.footer-logo {
  max-height: 64px;
  margin-bottom: 12px;
}

.footer-title {
  font-weight: 700;
  font-size: 14px;
  margin-bottom: 6px;
  text-transform: uppercase;
}

.footer-link {
  opacity: 0.8;
  margin-bottom: 18px;
}

.footer-social {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
}

.footer-social a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none;
}

.footer-block {
  margin-bottom: 12px;
  font-size: 14px;
  line-height: 1.4;
}

.footer-actions {
  display: flex;
  gap: 12px;
  margin-top: 18px;
}

.footer-actions button {
  background: #3f4246;
  color: #fff;
  border: none;
  border-radius: 20px;
  padding: 10px 16px;
  cursor: pointer;
}

.footer-right h3 {
  font-size: 20px;
  margin-bottom: 18px;
}

.footer-emergency {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-emergency li {
  margin-bottom: 12px;
  font-size: 15px;
}

/* =====================================================
   FIX: Dropdown Oferta Académica (solo este menú)
   ===================================================== */
#menu-oferta-academica > .dropdown-menu{
  display: none !important;
}
#menu-oferta-academica.is-open > .dropdown-menu{
  display: block !important;
}
#menu-oferta-academica{
  position: relative !important;
  display: inline-block !important;
}
#menu-oferta-academica > .dropdown-menu{
  position: absolute !important;
  z-index: 9999 !important;
  list-style: none !important;
  margin: 6px 0 0 0 !important;
  padding: 8px 0 !important;
}

/* =====================================================
   NAV: evitar scrollbar dentro del menú superior
   ===================================================== */
.main-nav,
.main-nav .nav-row{
  overflow: visible !important;
}

.main-nav{
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

/* =====================================================
   Dropdown Oferta Académica: cajita visible y legible
   ===================================================== */
#menu-oferta-academica{
  position: relative !important;
}

/* La caja del dropdown */
#menu-oferta-academica > .dropdown-menu{
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: auto !important;

  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,.15) !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.18) !important;

  padding: 8px 0 !important;
  min-width: 240px !important;

  /* importantísimo: que NO genere scroll interno */
  max-height: none !important;
  overflow: visible !important;
}

/* Texto de las opciones */
#menu-oferta-academica > .dropdown-menu .dropdown-item{
  display: block !important;
  padding: 10px 14px !important;
  color: #222 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

/* Hover bonito */
#menu-oferta-academica > .dropdown-menu .dropdown-item:hover{
  background: rgba(0,0,0,.06) !important;
}



/* =====================================================
   Dropdown Oferta Académica estilo SEED (solo este menú)
   ===================================================== */

/* El contenedor del menú NO debe generar scroll */
.main-nav,
.main-nav .nav-row{
  overflow: visible !important;
}

/* El LI será el ancla del dropdown */
#menu-oferta-academica{
  position: relative !important;
  display: inline-block !important;
}

/* La cajita blanca colgante */
#menu-oferta-academica > .dropdown-menu{
  /* oculto por defecto, se muestra con .is-open (JS) */
  display: none !important;

  position: absolute !important;
  top: 100% !important;          /* justo debajo */
  left: 0 !important;            /* alineado al inicio del botón */
  right: auto !important;

  min-width: 320px !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.18) !important;

  padding: 10px 0 !important;
  margin-top: 8px !important;

  /* evita scroll interno */
  max-height: none !important;
  overflow: visible !important;
  z-index: 99999 !important;
}

/* Mostrar cuando el JS abre */
#menu-oferta-academica.is-open > .dropdown-menu{
  display: block !important;
}

/* Items tipo lista */
#menu-oferta-academica > .dropdown-menu .dropdown-item{
  display: block !important;
  padding: 12px 16px !important;
  color: #333 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

/* Hover suave */
#menu-oferta-academica > .dropdown-menu .dropdown-item:hover{
  background: rgba(0,0,0,.06) !important;
}

/* IMPORTANTE: el UL no debe comportarse como parte del navbar */
#menu-oferta-academica > .dropdown-menu,
#menu-oferta-academica > .dropdown-menu li{
  float: none !important;
  height: auto !important;
}

/* Evitar scrollbar vertical en la barra del menú */
.main-nav{
  overflow-y: hidden !important;
}
/* Permitir que el dropdown se vea fuera del header/nav */
.site-header,
.main-nav,
.main-nav .nav-row{
  overflow: visible !important;
}

/* Asegurar que el header quede por encima del contenido */
.site-header{
  position: relative !important;
  z-index: 9999 !important;
}


#menu-oferta-academica > .dropdown-menu{
  z-index: 999999 !important;
}


/* =========================
   CLEAN FINAL (presentación)
   ========================= */

:root{
  --gris:#f4f5f7;
  --borde:#e6e6e6;
  --text:#666666;

  --logo-jct-h:56px;
  --logo-seed-h:40px;
  --logo-gigante-scale:1.35;

  --radius:18px;
}

/* Links */
a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:none; }

/* Body text */
body{ color: var(--text); }

/* Header logos (una sola fuente de verdad) */
.site-header img{ object-fit:contain; display:block; }
.site-header #logo-jct{ height:var(--logo-jct-h) !important; width:auto !important; }
.site-header #logo-seed{ height:var(--logo-seed-h) !important; width:auto !important; }
.site-header #logo-gigante{
  transform: scale(var(--logo-gigante-scale)) !important;
  transform-origin:center center;
  width:auto !important;
}

/* Menú responsive */
.nav-row{ flex-wrap:wrap !important; overflow-x:hidden !important; }
.nav-link{ font-size:14px; padding:10px 12px; line-height:1.1; }
.main-nav{ padding-bottom:2px; overflow-x:hidden !important; overflow-y:visible !important; }
.main-nav, .main-nav .nav-row{ overflow:visible !important; }

/* Home hero buttons (ya tienes .btn-center + .btn) */
.btn-center{
  display:flex;
  justify-content:center;
  gap:20px;
  flex-wrap:wrap;
  margin-top:25px;
}
.btn-center .btn{
  display:inline-block;
  background:#e7e7ea;
  border:1px solid #d8d8de;
  border-radius:12px;
  padding:10px 14px;
  font-weight:700;
  color:#555;
}
.btn-center .btn:hover{ filter:brightness(.98); }

/* Cards CTA (usa class="card cta-card") */
.cta-card{
  background: linear-gradient(180deg, #c6293e 0%, #6f1c52 100%) !important;
  color:#fff !important;
  border-radius: var(--radius);
}
.cta-card *{ color:#fff !important; }
.cta-card a{
  display:inline-block;
  margin-top:10px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:12px;
  background: rgba(255,255,255,.10);
  font-weight:700;
}
.cta-card a:hover{ background: rgba(255,255,255,.16); }

/* Layout cards registro (usa class="register-grid" en el wrapper) */
.register-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  align-items: stretch;
}
.register-grid .card{ border-radius: var(--radius); overflow:hidden; }

@media (max-width: 900px){
  .register-grid{ grid-template-columns:1fr; gap:32px; }
  .register-grid .card{
    position: static !important;
    transform: none !important;
    margin: 0 !important;
    width: 100% !important;
  }
}

/* Formularios */
main.page label{ display:block; font-weight:600; margin:10px 0 6px; }
main.page input[type="text"],
main.page input[type="email"],
main.page input[type="tel"],
main.page input[type="number"],
main.page input[type="password"],
main.page select,
main.page textarea{
  width:100%;
  box-sizing:border-box;
  padding:10px 12px;
  border:1px solid #d8d8de;
  border-radius:10px;
  font-family:"Century Gothic","Segoe UI",system-ui,Arial,sans-serif;
  color:#666;
  background:#fff;
}
main.page textarea{ min-height:110px; resize:vertical; }
main.page button,
main.page input[type="submit"],
main.page .btn{
  font-family:"Century Gothic","Segoe UI",system-ui,Arial,sans-serif;
  font-weight:700;
  padding:10px 14px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.12);
  background:#e7e7ea;
  color:#555;
  cursor:pointer;
}
main.page button:hover,
main.page input[type="submit"]:hover,
main.page .btn:hover{ filter:brightness(.98); }

/* Tablas */
main.page table{ width:100%; border-collapse:collapse; }
main.page thead th{
  position: sticky;
  top: 0;
  z-index: 5;
  background:#f3f3f3;
  border-bottom:2px solid #ddd;
}
main.page th, main.page td{
  padding:10px 12px;
  font-size:13px;
  color:#666;
  vertical-align:top;
  border-bottom:1px solid #eee;
}
@media (max-width: 900px){
  html, body{ overflow-x:hidden; }
  main.page table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  main.page th, main.page td{ white-space:normal !important; word-break:break-word; min-width:0 !important; }
}

/* Dropdown Oferta Académica (solo este menú) */
#menu-oferta-academica{ position:relative !important; display:inline-block !important; }
#menu-oferta-academica > .dropdown-menu{
  display:none !important;
  position:absolute !important;
  top:100% !important;
  left:0 !important;
  min-width:320px !important;
  background:#fff !important;
  border:1px solid rgba(0,0,0,.12) !important;
  border-radius:8px !important;
  box-shadow:0 12px 30px rgba(0,0,0,.18) !important;
  padding:10px 0 !important;
  margin-top:8px !important;
  z-index:999999 !important;
  max-height:none !important;
  overflow:visible !important;
}
#menu-oferta-academica.is-open > .dropdown-menu{ display:block !important; }
#menu-oferta-academica > .dropdown-menu .dropdown-item{
  display:block !important;
  padding:12px 16px !important;
  color:#333 !important;
  font-weight:500 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}
#menu-oferta-academica > .dropdown-menu .dropdown-item:hover{ background: rgba(0,0,0,.06) !important; }
.site-header{ position:relative !important; z-index:9999 !important; }



/* ===== FIX FOOTER LAYOUT GLOBAL ===== */

html, body{
  min-height: 100%;
}

body{
  display: flex;
  flex-direction: column;
}

main.page{
  flex: 1 0 auto;
}

footer{
  
  margin-top: -100px;
}