/* InternshipFormSection.css — Encabezado ("Para estudiantes · Programa de Becarios") y zona del
   formulario debajo. Nodos 4031:90900 (PC, 1280), 4031:91077 (tablet, 768) y 4031:91254 (mobile,
   375). Tipografía base: site.css. El formulario trae su propio estilo (es otro widget).

   SIN DESBORDES: eyebrow (60), título (100) y descripción (400) bajan de renglón; nada usa nowrap. */

/* --- Sección. --- */
.InternshipFormSection {
    width: 100%; /* Ocupa el ancho de la ventana. */
    background-color: #ffffff; /* Fondo. */
    font-family: var(--font-brand); /* Pila de marca. */
}

    .InternshipFormSection *,
    .InternshipFormSection *::before,
    .InternshipFormSection *::after {
        box-sizing: border-box; /* Medidas predecibles. */
    }

    .InternshipFormSection :where(h2, p) {
        margin: 0; /* El espaciado lo pone el contenedor. */
    }

.InternshipFormSection-inner {
    display: flex; /* Encabezado y formulario apilados. */
    flex-direction: column; /* Ídem. */
    gap: 28px; /* Separación del nodo. */
    width: 100%; /* Ancho disponible. */
    max-width: 1280px; /* Ancho del nodo de PC. */
    margin-inline: auto; /* Centrado. */
    padding: 24px 80px 80px; /* Relleno del nodo. */
}

/* --- Encabezado. --- */
.InternshipFormSection-header {
    display: flex; /* Piezas apiladas. */
    flex-direction: column; /* Ídem. */
    gap: 16px; /* Separación del nodo. */
    min-width: 0; /* No desborda. */
}

.InternshipFormSection-eyebrow {
    display: flex; /* Cuadrito y texto en línea. */
    align-items: center; /* Centrados. */
    gap: 10px; /* Separación del nodo. */
    max-width: 100%; /* No desborda. */
    font-size: 14px; /* Tamaño del nodo. */
    font-weight: 700; /* Bold del nodo. */
    line-height: 1.35; /* Interlineado del nodo. */
    letter-spacing: 0.5px; /* Apertura del nodo. */
    text-transform: uppercase; /* "PARA ESTUDIANTES". */
    color: #243746; /* Azul noche del nodo. */
}

.InternshipFormSection-eyebrow-dot {
    flex: none; /* No se comprime. */
    width: 7px; /* Tamaño del nodo. */
    height: 7px; /* Ídem. */
    background-color: #243746; /* Mismo color del texto. */
}

.InternshipFormSection-eyebrow-text {
    min-width: 0; /* Puede encogerse por debajo de su ancho natural. */
    overflow-wrap: anywhere; /* Una palabra larga no desborda. */
}

.InternshipFormSection-title {
    font-size: 28px; /* Tamaño del nodo. */
    font-weight: 700; /* Bold del nodo. */
    line-height: 36px; /* Interlineado del nodo. */
    color: #1b2d3a; /* Azul noche del nodo. */
    overflow-wrap: anywhere; /* Una palabra larga no desborda. */
}

.InternshipFormSection-description {
    max-width: min(760px, 100%); /* Ancho del nodo de PC. */
    font-size: 16px; /* Tamaño del nodo. */
    line-height: 26px; /* Interlineado del nodo. */
    color: rgba(34, 42, 48, 0.75); /* Gris del nodo. */
    white-space: pre-line; /* Respeta los saltos de línea del editor. */
    overflow-wrap: anywhere; /* Una palabra larga no desborda. */
}

/* Zona del formulario: a todo el ancho. */
.InternshipFormSection-form {
    min-width: 0; /* No desborda. */
}

/* --- Tablet: hasta 1024px (nodo 4031:91077). --- */
@media (max-width: 1024px) {

    .InternshipFormSection-inner {
        gap: 24px; /* Separación del nodo. */
        padding: 24px 32px 64px; /* Relleno del nodo. */
    }

    .InternshipFormSection-description {
        max-width: 100%; /* Todo el ancho en tablet. */
    }
}

/* --- Mobile: hasta 767px (nodo 4031:91254). --- */
@media (max-width: 767px) {

    .InternshipFormSection-inner {
        gap: 20px; /* Separación del nodo. */
        padding: 24px 20px 48px; /* Relleno del nodo. */
    }

    .InternshipFormSection-eyebrow {
        font-size: 12px; /* Tamaño del nodo. */
    }

    .InternshipFormSection-title {
        font-size: 24px; /* Tamaño del nodo. */
        line-height: 1.3; /* Interlineado. */
    }

    .InternshipFormSection-description {
        font-size: 15px; /* Tamaño del nodo. */
    }
}