/**

 * Mobile + tablet — layout mobile hasta 1024px (Figma base 430px)

 */



@media (max-width: 1024px) {

  :root {

    --layout-gutter: 20px;

    --layout-max: 100%;

    --content-width: min(390px, 100%);

    --top-bar-height: 48px;

    --hero-image-height: auto;

    --hero-bg-size-mobile: 100% auto;

    --hero-bg-position-mobile: center top;

    --field-height: 40px;

    --hero-field-height: 36px;

    --career-card-width: 271px;

  }



  .br-mobile {
    display: inline;
  }

  /* Tipografía Figma mobile — escala 32/25/20/15 (no reducir a 16px/15px salvo descripciones) */
  .section-title {
    font-size: var(--font-size-section);
    line-height: 1;
  }

  .section-subtitle {
    font-size: var(--font-size-panel);
    line-height: 1;
  }

  .form-field input,
  .form-field select {
    font-size: var(--font-size-panel);
  }



  .top-bar {

    height: var(--top-bar-height);

  }



  .top-bar__social {

    display: none !important;

  }



  .top-bar .container {

    padding-left: var(--layout-gutter);

    padding-right: var(--layout-gutter);

  }



  .top-bar__contact {

    width: 100%;

    justify-content: space-between;

    align-items: center;

    font-size: var(--font-size-sm);

    font-weight: var(--font-weight-medium);

    gap: var(--space-8);

    flex-wrap: nowrap;

  }



  .top-bar__contact > span:first-child {

    flex-shrink: 0;

  }



  .top-bar__phone {

    display: inline-flex;

    align-items: center;

    gap: 4px;

    flex-shrink: 1;

    min-width: 0;

    justify-content: flex-end;

  }



  .top-bar__phone a {

    font-size: inherit;

    line-height: 1.1;

    white-space: nowrap;

  }



  .top-bar__contact svg {

    width: 16px;

    height: 16px;

    flex-shrink: 0;

  }



  /* Hero mobile — imagen arriba + formulario abajo (2 bloques, ref. Figma) */
  .hero {
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 0;
    overflow: visible;
    background: var(--color-white);
  }

  .hero__bg {
    position: relative;
    inset: unset;
    width: 100%;
    height: var(--hero-image-height);
    flex-shrink: 0;
    background-position: var(--hero-bg-position-mobile, center top);
    background-size: var(--hero-bg-size-mobile, cover);
  }

  /* Córdoba: <img> a ancho completo — sin bandas negras */
  .hero--cordoba .hero__bg {
    height: auto;
    background: none;
    background-image: none;
  }

  .hero--cordoba .hero__photo {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: top;
  }

  .hero__overlay {
    display: none;
  }

  .hero__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 0;
    margin-top: 0;
    display: block;
    padding: var(--space-12) var(--layout-gutter) var(--space-16);
    background: var(--color-white);
    box-sizing: border-box;
  }

  .hero-form-box {
    max-width: 100%;
    margin: 0 auto;
    padding: var(--space-12) var(--space-16) var(--space-16);
    background: var(--color-bg-light);
    border: none;
    border-radius: var(--radius-hero-box);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .hero__headline {
    color: var(--color-primary);
    filter: none;
    white-space: normal;
    font-size: var(--font-size-section);
    font-weight: var(--font-weight-bold);
    line-height: 1;
    text-align: center;
    margin-bottom: var(--space-12);
  }

  .hero-form .form-field input,
  .hero-form .form-field select {
    height: var(--hero-field-height);
    min-height: var(--hero-field-height);
    padding: 0 var(--space-12);
    border: 1px solid var(--color-accent-light);
    box-shadow: none;
  }

  .hero-form .form-grid--hero {
    grid-template-columns: 1fr;
    gap: var(--space-10);
  }

  .hero-form .form-actions--hero {
    margin-top: var(--space-10);
  }

  .hero-form .btn--hero {
    width: 100%;
    max-width: none;
    min-height: var(--hero-field-height);
    padding: 0 var(--space-24);
  }

  .form-grid,
  .form-grid--3col {
    grid-template-columns: 1fr !important;
    gap: var(--space-20) !important;
  }

  .form-field input,
  .form-field select {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .form-actions {
    justify-content: center;
  }

  /* Ventajas: sin imagen, stats 2×2 */

  .ventajas {

    padding: var(--space-20) 0;

    min-height: 0;

    background: var(--color-bg-section);

  }



  .ventajas .container {

    grid-template-columns: 1fr;

    padding-left: var(--layout-gutter);

    padding-right: var(--layout-gutter);

  }



  .ventajas__image {

    display: none;

  }



  .ventajas__intro {

    max-width: 100%;

  }



  /* Centrado de títulos en móvil — aplica a TODAS las secciones */
  .section-title,
  .section-subtitle {
    text-align: center !important;
  }

  .carreras .container > .section-title,
  .carreras .container > .section-subtitle,
  .calendario .section-title,
  .calendario .section-subtitle,
  .reunion .section-title,
  .reunion .section-subtitle,
  .ventajas .section-title,
  .ventajas .section-subtitle,
  .ventajas__subtitle {
    text-align: center !important;
  }

  .ventajas__subtitle {
    white-space: normal;
  }

  .ventajas .section-title {

    font-size: var(--font-size-section);

    line-height: 1;

    margin-bottom: var(--space-16);

    text-align: center;

  }



  .ventajas .section-subtitle,
  .ventajas__subtitle {

    font-size: 18px;

    font-weight: var(--font-weight-regular);

    line-height: 1.2;

    max-width: 100%;

    margin-left: auto;

    margin-right: auto;

    margin-bottom: var(--space-30);

    text-align: center;

  }



  .ventajas__stats {

    grid-template-columns: repeat(2, minmax(0, 1fr));

    justify-items: center;

    gap: var(--space-20) var(--space-10);

    margin-top: var(--space-20);

    width: 100%;

  }



  .stat-item {

    max-width: 170px;

    width: 100%;

  }



  .stat-item__visual {

    width: 130px;

    height: 130px;

    background: transparent;

    box-shadow: none;

  }

  .stat-item__visual img {

    width: 130px;

    height: 130px;

  }



  .stat-item__label {

    max-width: 130px;

    font-size: var(--font-size-panel);

    line-height: 1;

  }



  /* Carreras: dropdowns + carrusel */

  .carreras {

    padding-bottom: var(--space-20);

    overflow: hidden;

  }



  .carreras .container {

    padding-left: var(--layout-gutter);

    padding-right: var(--layout-gutter);

    overflow: hidden;

  }



  .carreras .section-title {

    font-size: var(--font-size-section);

    line-height: 1;

    max-width: 390px;

    text-align: center;

    margin-left: auto;

    margin-right: auto;

  }



  .carreras__layout {

    display: block;

  }



  .carreras__sidebar-row,
  .carreras__grid-row {
    display: none;
  }



  .carreras__mobile-filters {

    display: flex;

    flex-direction: column;

    gap: var(--space-20);

    margin-bottom: var(--space-20);

    max-width: 390px;

  }



  .carreras__mobile-filters .form-field select {

    height: var(--field-height);

    width: 100%;

    padding: 0 var(--space-20);

    border: 1px solid #ccc;

    border-radius: var(--radius-md);

    background: var(--color-white);

    appearance: none;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='11' viewBox='0 0 17 11'%3E%3Cpath fill='%235c5c5c' d='M8.5 11L0 0h17z'/%3E%3C/svg%3E");

    background-repeat: no-repeat;

    background-position: right 12px center;

    color: var(--color-text-muted);

    font-size: var(--font-size-panel);

  }



  .carreras__grid.carreras__grid--mobile {

    display: flex;

    flex-wrap: nowrap;

    gap: var(--space-20);

    overflow-x: auto;

    scroll-snap-type: x mandatory;

    scroll-padding-inline: var(--layout-gutter);

    padding: var(--space-20) var(--layout-gutter) var(--space-10);

    margin: 0;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;

    grid-column: auto;

  }



  .carreras__grid.carreras__grid--mobile::-webkit-scrollbar {

    display: none;

  }



  .carreras__grid.carreras__grid--mobile .career-card {

    flex: 0 0 var(--career-card-width);

    scroll-snap-align: start;

    min-height: 423px;

  }



  .pagination--desktop {

    display: none;

  }



  .pagination--mobile {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: var(--space-16);

    margin-top: var(--space-20);

    font-size: var(--font-size-panel);

    color: var(--color-text);

  }



  .pagination--mobile button {

    background: none;

    border: none;

    padding: var(--space-4);

    cursor: pointer;

    color: inherit;

    font-size: inherit;

  }



  .pagination--mobile button.active {

    color: var(--color-primary);

    font-weight: var(--font-weight-bold);

  }



  .pagination--mobile .pagination__ellipsis {

    pointer-events: none;

  }



  /* Reunión */

  .reunion {

    padding: var(--space-40) var(--layout-gutter);

    background: var(--color-bg-section);

    text-align: center;

  }



  .reunion .section-title {

    font-size: var(--font-size-section);

    line-height: 1;

    text-align: center !important;

    max-width: none;

  }



  .reunion .section-subtitle {

    text-align: center !important;

    font-size: var(--font-size-panel);

    font-weight: var(--font-weight-regular);

    line-height: 1;

    white-space: normal;

    max-width: 350px;

    margin-left: auto;

    margin-right: auto;

  }



  .reunion .form-card {

    margin: 0 auto;

  }



  .reunion .form-grid--3col {

    grid-template-columns: 1fr;

    gap: var(--space-20);

  }



  .reunion .form-actions {

    display: flex;

    justify-content: center;

  }



  .reunion .btn--md {

    min-width: 280px;

    width: fit-content;

    max-width: calc(100% - var(--layout-gutter));

    padding: 0 var(--space-30);

  }



  /* Calendario apilado */

  .calendario {

    padding-bottom: var(--space-40);

  }



  .calendario .section-title {

    font-size: var(--font-size-section);

    line-height: 1;

    text-align: center;

  }



  .calendario .section-subtitle {

    font-size: var(--font-size-panel);

    line-height: 1;

    text-align: center;

  }

  .calendario__actions {

    justify-content: stretch;

    width: 100%;

    box-sizing: border-box;

  }

  .calendario__table--desktop {

    display: none;

  }



  .calendario__blocks--mobile {

    display: flex;

    flex-direction: column;

    gap: var(--space-30);

  }



  .calendario__block {

    display: flex;

    flex-direction: column;

    gap: var(--space-10);

  }



  .calendario__block .calendario__semestre {

    width: 100%;

    text-align: center !important;

    font-size: var(--font-size-section);

    font-weight: var(--font-weight-bold);

    line-height: 1;

    padding: var(--space-10);

  }



  .calendario__pair-row {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: var(--space-10);

  }



  .calendario__bimestre-head {

    min-height: 66px;

    font-size: var(--font-size-panel);

    font-weight: var(--font-weight-medium);

    color: var(--color-text-muted);

    padding: var(--space-10);

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    line-height: 1;

  }



  .calendario__bimestre-body {

    min-height: 0;

    padding: var(--space-16) var(--space-10);

    font-size: var(--font-size-panel);

    font-weight: var(--font-weight-regular);

    line-height: 1;

    text-align: center;

    color: var(--color-text-muted);

  }

  .calendario__bimestre-lead {

    display: block;

    font-size: inherit;

    font-weight: var(--font-weight-bold);

    color: var(--color-text-body);

    margin-bottom: var(--space-12);

  }



  .calendario .btn--wide {

    width: 100%;

    min-width: 0;

    max-width: none;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 0 var(--space-16);

    box-sizing: border-box;

  }



  /* Testimonios mobile — 1 tarjeta alternando arriba / abajo izquierda */
  .testimonios {
    display: block;
  }

  .testimonios__header {
    padding: var(--space-30) 0 var(--space-20);
  }

  .testimonios__header .container {
    text-align: center;
  }

  .testimonios__title {
    text-align: center;
    font-size: var(--font-size-section);
    line-height: 1;
    margin-bottom: var(--space-12);
  }

  .testimonios__intro {
    text-align: center;
    font-size: var(--font-size-panel);
    line-height: 1.25;
    max-width: min(390px, 100%);
    margin: 0 auto;
  }

  .testimonios__stage {
    min-height: 0;
    height: 380px;
    aspect-ratio: auto;
    background-size: cover;
    background-position: center top;
  }

  .testimonios__carousel,
  .testimonios__dots {
    display: none !important;
  }

  .testimonial-float {
    width: min(200px, 86%);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
  }

  .testimonial-float__body {
    padding: 10px 10px 8px;
  }

  .testimonial-float__avatar {
    width: 28px;
    height: 28px;
    font-size: 10px;
  }

  .testimonial-float__user {
    font-size: 11px;
    font-weight: 600;
  }

  .testimonial-float__rating {
    margin-bottom: 6px;
    gap: 6px;
  }

  .testimonial-float__time {
    font-size: 9px;
  }

  .testimonial-float__quote {
    font-size: 11px;
    line-height: 1.4;
    max-height: none;
    overflow: visible;
    font-weight: 400;
    color: var(--color-text-body);
  }

  .testimonial-float__footer {
    padding: 6px 10px;
    font-size: 9px;
  }

  .testimonial-float__footer .testimonial-stars svg {
    width: 9px;
    height: 9px;
  }

  .testimonial-float__footer .testimonial-stars {
    display: none;
  }

  /* Centrado abajo — tapa camisa/apuntes, no la cara */
  .testimonial-float--mpos-center {
    bottom: 4%;
    left: 50%;
    right: auto;
    top: auto;
    transform: translateX(-50%) translateY(70px);
    z-index: 4;
  }

  .testimonial-float--mpos-center.testimonial-float--visible {
    transform: translateX(-50%) translateY(0);
  }

  .testimonial-float--mpos-center.testimonial-float--hiding {
    transform: translateX(-50%) translateY(45px);
  }

  /* Tarjetas de carrera mobile — título fijo 4 líneas */
  .carreras__grid.carreras__grid--mobile .career-card__title {
    height: 130px;
    font-size: var(--font-size-section);
    font-weight: var(--font-weight-medium);
    line-height: 1;
  }

  .carreras__grid.carreras__grid--mobile .career-card__meta {
    font-size: var(--font-size-panel);
    line-height: 1;
  }

  /* Contacto — ref. Figma mobile */

  .contacto {
    background: var(--color-bg-section);
    padding-top: var(--space-40);
    padding-bottom: var(--space-40);
  }

  .contacto__title {
    text-align: center;
    font-size: var(--font-size-section);
    margin-bottom: var(--space-30);
  }

  .contacto__grid {

    grid-template-columns: 1fr;

    gap: 28px;

    max-width: min(390px, 100%);

    width: 100%;

    padding: 0;

    margin-left: auto;

    margin-right: auto;

    box-sizing: border-box;

  }



  .contacto__item--email { order: 1; }

  .contacto__item--phone { order: 2; }

  .contacto__item--visit { order: 3; }

  .contacto__item--alumnos { order: 4; }



  .contacto__item {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: var(--space-12);

    width: 100%;

    text-align: center;

    text-decoration: none;

    color: inherit;

  }



  .contacto__icon {

    width: 89px;

    height: 89px;

    background: transparent;

    box-shadow: none;

    border-radius: 0;

    flex-shrink: 0;

  }



  .contacto__icon img {

    width: 89px;

    height: 89px;

    display: block;

    object-fit: contain;

  }



  .contacto__text {

    width: 100%;

    min-width: 0;

    text-align: center;

  }



  .contacto__item h4 {

    display: none;

  }



  .contacto__text p {

    margin: 0;

    font-size: var(--font-size-panel);

    font-weight: var(--font-weight-light);

    line-height: 1.25;

    letter-spacing: 0;

    color: var(--color-black);

    text-align: center;

  }



  .contacto__social-mobile {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 48px;

    margin: var(--space-40) 0 var(--space-30);

  }



  .contacto__social-mobile a {

    width: 44px;

    height: 44px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

  }



  .contacto__social-mobile img {

    width: auto;

    height: auto;

    max-width: 44px;

    max-height: 44px;

    display: block;

    object-fit: contain;

  }



  .contacto__map {

    height: 540px;

    max-width: 350px;

    margin: 0 auto;

  }



  .contacto__map-play {

    width: 69px;

    height: 69px;

  }



  /* Footer mobile — logos arriba, contacto centrado abajo, copy pequeño */
  .footer__marcas {
    min-height: 0;
    padding: 0;
  }

  .footer__marcas .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "logo punto"
      "contact contact";
    gap: var(--space-12) var(--space-8);
    padding: var(--space-16) var(--space-16) var(--space-12);
    min-height: 0;
    align-items: center;
  }

  .footer__logo {
    grid-area: logo;
    justify-self: center;
  }

  .footer__logo img {
    width: 110px;
    max-width: 100%;
    margin: 0 auto;
    display: block;
  }

  .footer__punto {
    grid-area: punto;
    justify-self: center;
    justify-content: center;
    align-items: center;
  }

  .footer__punto-img {
    width: 105px;
    max-width: 100%;
  }

  .footer__contact-list {
    grid-area: contact;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-8);
    position: static;
    transform: none;
    width: 100%;
    margin: var(--space-4) 0 0;
    padding: 0;
    list-style: none;
    text-align: center;
  }

  .footer__contact-list li {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
  }

  .footer__contact-list a {
    justify-content: center;
    font-size: var(--font-size-sm);
    gap: var(--space-8);
  }

  .footer__contact-list svg {
    width: 16px;
    height: 16px;
  }

  .footer__social {
    justify-content: center;
    margin-top: var(--space-4);
    gap: var(--space-24);
  }

  .footer__social a {
    width: 20px;
    height: 20px;
  }

  .footer__social svg {
    width: 20px;
    height: 20px;
  }

  .footer__copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-8) var(--space-16);
    min-height: 0;
    font-size: 11px;
    line-height: 1.2;
  }

  .footer__copy > span:first-of-type {
    justify-self: auto;
    text-align: center;
  }

  .footer__ingenio {
    justify-self: auto;
  }

  .footer__ingenio-img {
    height: 14px;
    width: auto;
  }

  .footer__copy-divider {
    display: none;
  }



  /* Mostrar bloques solo mobile */

  .carreras__mobile-filters,

  .calendario__blocks--mobile,

  .contacto__social-mobile,

  .pagination--mobile {

    display: flex;

  }



  .calendario__blocks--mobile {

    display: flex;

  }

}



/* Ocultar elementos solo-mobile en desktop */
@media (min-width: 1025px) {
  .carreras__mobile-filters,
  .calendario__blocks--mobile,
  .contacto__social-mobile,
  .pagination--mobile {
    display: none !important;
  }
}


