/* ============================================
       MAESTRÍAS FADU-UBA - Sistema de Diseño
       Versión: 2.0 - Enero 2026
       ROR: https://ror.org/0081fs513
       ============================================ */
    
    :root {
        /* Azules UBA - Principal */
        --azul-uba: #1d2554;
        --azul-hover: #2e3a6e;
        --azul-claro: #3d4a7a;
        
        /* Celestes institucionales */
        --celeste-medio: #91bde1;
        --celeste-claro: #bdd7ed;
        --celeste-uba: #4a90b8;
        --celeste-bg: #e8f4f8;
        
        /* Dorado/Arena - Acento */
        --dorado-oscuro: #8b6914;
        --dorado: #a67c00;
        --dorado-claro: #d4af37;
        --dorado-bg: #fdf8e8;
        --arena: #f5f0e6;
        
        /* Violeta FADU */
        --morado-fadu: #6861ac;
        --morado-claro: #9d95d4;
        
        /* Colores por Área Temática */
        /* ═══ Colores por Área Temática - Paleta FADU unificada ═══ */
        --color-sustentabilidad: #6bbf3a;
        --color-sustentabilidad-bg: #e6f7e0;
        --color-patrimonio: #952B6C;
        --color-patrimonio-bg: #f5e8f0;
        --color-urbanismo: #00b8db;
        --color-urbanismo-bg: #e0f7fb;
        --color-diseno: #6861ac;
        --color-diseno-bg: #e8e6f5;
        --color-proyecto: #ff7621;
        --color-proyecto-bg: #fff3e8;
        --color-gestion: #2eb39a;
        --color-gestion-bg: #e0f7f1;
        
        /* Neutros */
        --blanco: #ffffff;
        --gris-50: #fafafa;
        --gris-100: #f5f5f5;
        --gris-200: #eeeeee;
        --gris-300: #e0e0e0;
        --gris-400: #bdbdbd;
        --gris-600: #757575;
        --gris-700: #616161;
        --gris-800: #424242;
        --gris-900: #212121;
        
        /* Texto */
        --texto-principal: #1a1a1a;
        --texto-secundario: #4a4a4a;
        
        /* Estados */
        --verde-exito: #2e7d32;
        --verde-exito-bg: #e8f5e9;
        --verde-inscripcion: #8dc63f;
        --verde-inscripcion-hover: #7ab82f;
        --verde-inscripcion-bg: #f0f8e6;
        --rojo-alerta: #ef4230;
        --rojo-alerta-bg: #fdecea;
        --gris-suspendido: #78909c;
        --gris-suspendido-bg: #eceff1;
    }

    * { margin: 0; padding: 0; box-sizing: border-box; }
    
    /* Accesibilidad - Ocultar visualmente pero mantener para lectores de pantalla */
    .visually-hidden {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
    
    body { 
        font-family: 'Bitter', Georgia, serif; 
        color: var(--texto-principal); 
        line-height: 1.7; 
        background: var(--blanco);
    }
    
    a { 
        color: var(--azul-uba); 
        text-decoration: none; 
        transition: color 0.3s ease; 
    }
    a:hover { color: var(--dorado); }
    a:focus { outline: 2px solid var(--dorado); outline-offset: 2px; }
/* Skip Link - Accesibilidad */
    
    

    /* ============================================
       HEADER INSTITUCIONAL
       ============================================ */
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    /* Dropdown navegación */
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    /* Menú móvil */
    
    
    

    /* ============================================
       BREADCRUMB
       ============================================ */
    
    
    
    
    
    

    /* ============================================
       HERO
       ============================================ */
    .hero { 
        background: linear-gradient(135deg, var(--azul-uba) 0%, #2a3668 40%, var(--morado-fadu) 100%);
        color: var(--blanco); 
        padding: 70px 40px 90px;
        position: relative; 
        overflow: hidden; 
    }
    .hero::before { 
        content: ''; 
        position: absolute; 
        top: 0;
        left: -100%;
        width: 60%;
        height: 100%;
        background: linear-gradient(
            90deg,
            transparent 0%,
            rgba(255, 255, 255, 0.03) 20%,
            rgba(255, 255, 255, 0.08) 50%,
            rgba(255, 255, 255, 0.03) 80%,
            transparent 100%
        );
        transform: skewX(-20deg);
        animation: shimmer 8s ease-in-out infinite;
    }
    @keyframes shimmer {
        0% { left: -100%; }
        40%, 100% { left: 150%; }
    }
    .hero-content { 
        max-width: 1200px; 
        margin: 0 auto; 
        position: relative; 
        z-index: 1; 
    }
    
    /* Hero Badges Row */
    .hero-badges-row {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        margin-bottom: 24px;
    }
    
    .hero-badge { 
        display: inline-flex; 
        align-items: center;
        gap: 8px;
        padding: 10px 20px; 
        border-radius: 2px; 
        font-size: 0.8rem; 
        font-weight: 700; 
        text-transform: uppercase; 
        letter-spacing: 0.5px;
    }
    
    .hero-badge--inscripcion {
        background: var(--verde-inscripcion);
        color: var(--blanco);
    }
    
    .hero-badge--inscripcion .badge-dot {
        width: 8px;
        height: 8px;
        background: var(--blanco);
        border-radius: 50%;
        animation: pulse-dot 2s ease-in-out infinite;
    }
    
    .hero-badge--federal {
        background: transparent;
        color: var(--celeste-uba);
        border: 2px solid var(--celeste-uba);
    }
    
    .hero-badge--federal svg {
        flex-shrink: 0;
    }
    
    @keyframes gradientShift {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }
    
    .hero-title { 
        font-size: 2.8rem; 
        font-weight: 900; 
        margin-bottom: 20px; 
        line-height: 1.2; 
    }
    .hero-title-highlight {
        color: var(--celeste-medio);
        display: block;
        font-size: 3.2rem;
        letter-spacing: -1px;
        text-shadow: 0 2px 10px rgba(145, 189, 225, 0.3);
    }
    .hero-description { 
        font-size: 1.15rem; 
        font-weight: 400; 
        max-width: 720px; 
        margin-bottom: 45px; 
        opacity: 0.95; 
        line-height: 1.7;
    }
    .hero-stats { 
        display: flex; 
        gap: 50px; 
        flex-wrap: wrap; 
    }
    .stat-item { text-align: center; }
    .stat-number { 
        display: block; 
        font-size: 2.8rem; 
        font-weight: 900; 
        line-height: 1; 
        margin-bottom: 6px; 
    }
    .stat-label { 
        font-size: 0.95rem; 
        font-weight: 400; 
        opacity: 0.9; 
    }

    /* ============================================
       INFO MAESTRÍA
       ============================================ */
    .info-maestria { 
        background: var(--blanco); 
        padding: 60px 0; 
        border-bottom: 1px solid var(--gris-300); 
    }
    .info-maestria__content { 
        display: grid; 
        grid-template-columns: 1fr 1fr; 
        gap: 60px; 
        align-items: center; 
    }
    .info-maestria h2 { 
        font-size: 1.6rem; 
        font-weight: 700; 
        color: var(--azul-uba); 
        margin-bottom: 16px; 
    }
    .info-maestria > div > p { 
        color: var(--texto-secundario); 
        margin-bottom: 24px; 
        font-size: 1.05rem;
    }
    .info-maestria__checks { 
        list-style: none; 
        display: flex; 
        flex-direction: column; 
        gap: 14px; 
    }
    .info-maestria__checks li { 
        display: flex; 
        align-items: center; 
        gap: 12px; 
        font-size: 1rem; 
        color: var(--texto-principal);
    }
    .info-maestria__checks svg {
        color: var(--verde-exito);
        flex-shrink: 0;
    }
    .info-maestria__checks--spaced {
        margin-top: 24px;
    }

    .federal-badge { 
        background: var(--celeste-bg); 
        border: 2px solid var(--celeste-uba);
        border-radius: 2px; 
        padding: 28px; 
        display: flex; 
        align-items: flex-start; 
        gap: 16px; 
    }
    .federal-icon { 
        font-size: 2.2rem; 
        line-height: 1; 
    }
    .federal-text strong { 
        display: block; 
        color: var(--azul-uba); 
        font-size: 1.05rem; 
        margin-bottom: 6px; 
    }
    .federal-text span { 
        color: var(--texto-secundario); 
        font-size: 0.95rem; 
        line-height: 1.6; 
    }

    /* ============================================
       MAPA CONSTELACIÓN - ALCANCE FEDERAL
       ============================================ */
    .mapa-federal {
        background: linear-gradient(135deg, #4a6fa5 0%, #5a7fb5 50%, #6a8fc5 100%);
        border-radius: 2px;
        padding: 32px;
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 24px;
        align-items: center;
        position: relative;
        overflow: hidden;
    }
    
    .mapa-federal::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: radial-gradient(ellipse at 70% 50%, rgba(255,255,255,0.08) 0%, transparent 60%);
        pointer-events: none;
    }
    
    .mapa-federal__texto {
        position: relative;
        z-index: 1;
    }
    
    .mapa-federal__texto strong {
        display: block;
        color: var(--blanco);
        font-size: 1.15rem;
        font-weight: 700;
        margin-bottom: 10px;
    }
    
    .mapa-federal__texto span {
        color: rgba(255,255,255,0.9);
        font-size: 0.95rem;
        line-height: 1.7;
        display: block;
    }
    
    .mapa-federal__visual {
        position: relative;
        z-index: 1;
    }
    
    .mapa-constelacion {
        width: 140px;
        height: auto;
        filter: drop-shadow(0 0 8px rgba(255,255,255,0.1));
    }
    
    /* Animaciones sutiles para los puntos */
    .punto-ciudad {
        animation: twinkle 3s ease-in-out infinite;
    }
    
    .punto-ciudad:nth-child(odd) {
        animation-delay: 0s;
    }
    
    .punto-ciudad:nth-child(even) {
        animation-delay: 1.5s;
    }
    
    .punto-grande {
        animation: pulse-grande 4s ease-in-out infinite;
    }
    
    .punto-bsas {
        animation: pulse-bsas 2.5s ease-in-out infinite;
    }
    
    .punto-bsas-halo {
        animation: halo-pulse 3s ease-in-out infinite;
    }
    
    @keyframes twinkle {
        0%, 100% { opacity: 0.7; }
        50% { opacity: 1; }
    }
    
    @keyframes pulse-grande {
        0%, 100% { 
            opacity: 0.85;
            transform: scale(1);
        }
        50% { 
            opacity: 1;
            transform: scale(1.1);
        }
    }
    
    @keyframes pulse-bsas {
        0%, 100% { 
            opacity: 1;
            transform: scale(1);
        }
        50% { 
            opacity: 1;
            transform: scale(1.15);
        }
    }
    
    @keyframes halo-pulse {
        0%, 100% { 
            opacity: 0.4;
            transform: scale(1);
        }
        50% { 
            opacity: 0.6;
            transform: scale(1.2);
        }
    }
    
    .lineas-conexion line {
        stroke-dasharray: 4 2;
        animation: dash 20s linear infinite;
    }
    
    @keyframes dash {
        to {
            stroke-dashoffset: -100;
        }
    }
    
    @media (max-width: 768px) {

        .mapa-federal {
            grid-template-columns: 1fr;
            text-align: center;
        }
        
        .mapa-federal__visual {
            order: -1;
        }
        
        .mapa-constelacion {
            width: 100px;
        }
    }


    /* ============================================
       FILTROS
       ============================================ */
    .filtros { 
        background: var(--blanco); 
        padding: 28px 0; 
        border-bottom: 1px solid var(--gris-300);
        position: sticky; 
        top: 60px; 
        z-index: 50; 
    }
    .filtros-label { 
        font-size: 0.9rem; 
        font-weight: 600; 
        color: var(--texto-secundario); 
        margin-bottom: 14px; 
    }
    .filtros-grid { 
        display: flex; 
        gap: 10px; 
        flex-wrap: wrap; 
    }
    .filtro-btn { 
        background: var(--gris-100); 
        border: 2px solid var(--gris-300);
        padding: 10px 20px; 
        border-radius: 2px; 
        font-family: 'Bitter', serif;
        font-size: 0.9rem; 
        font-weight: 500; 
        color: var(--texto-secundario); 
        cursor: pointer; 
        transition: all 0.3s ease; 
    }
    .filtro-btn:hover { 
        border-color: var(--azul-uba); 
        background: var(--blanco);
        color: var(--azul-uba);
    }
    .filtro-btn:focus { 
        outline: 2px solid var(--dorado); 
        outline-offset: 2px; 
    }
    .filtro-btn--active { 
        background: var(--azul-uba); 
        border-color: var(--azul-uba); 
        color: var(--blanco); 
        font-weight: 700; 
    }
    .filtro-btn--especial {
        border-color: var(--dorado);
        background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(255, 215, 0, 0.05) 100%);
        color: var(--azul-uba);
    }
    .filtro-btn--especial:hover {
        background: linear-gradient(135deg, rgba(212, 175, 55, 0.2) 0%, rgba(255, 215, 0, 0.1) 100%);
        border-color: var(--dorado);
    }
    .filtro-btn--especial.filtro-btn--active {
        background: linear-gradient(135deg, var(--dorado) 0%, #c9a227 100%);
        border-color: var(--dorado);
        color: var(--azul-uba);
    }
    
    /* Grupos de filtros */
    .filtros-grupo {
        margin-bottom: 16px;
    }
    .filtros-grupo-label {
        display: block;
        font-size: 0.85rem;
        font-weight: 600;
        color: var(--texto-secundario);
        margin-bottom: 10px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    
    /* Toggle título intermedio */
    .filtros-toggle {
        margin: 20px 0 16px;
        padding: 16px 20px;
        background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(255, 215, 0, 0.03) 100%);
        border: 2px solid var(--dorado);
        border-radius: 4px;
        display: inline-block;
    }
    .toggle-container {
        display: flex;
        align-items: center;
        gap: 12px;
        cursor: pointer;
        font-family: 'Bitter', serif;
    }
    .toggle-input {
        position: absolute;
        opacity: 0;
        width: 0;
        height: 0;
    }
    .toggle-switch {
        position: relative;
        width: 48px;
        height: 26px;
        background: var(--gris-300);
        border-radius: 13px;
        transition: all 0.3s ease;
        flex-shrink: 0;
    }
    .toggle-switch::after {
        content: '';
        position: absolute;
        top: 3px;
        left: 3px;
        width: 20px;
        height: 20px;
        background: white;
        border-radius: 50%;
        transition: all 0.3s ease;
        box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    .toggle-input:checked + .toggle-switch {
        background: linear-gradient(135deg, var(--dorado) 0%, #c9a227 100%);
    }
    .toggle-input:checked + .toggle-switch::after {
        transform: translateX(22px);
    }
    .toggle-input:focus + .toggle-switch {
        outline: 2px solid var(--dorado);
        outline-offset: 2px;
    }
    .toggle-label {
        font-size: 0.95rem;
        font-weight: 600;
        color: var(--azul-uba);
    }
    .toggle-count {
        font-size: 0.85rem;
        color: var(--texto-secundario);
        font-weight: 500;
    }
    
    /* Animación de atención para el toggle */
    .filtros-toggle.highlight-attention {
        animation: pulseAttention 0.6s ease-in-out 3;
        box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.4);
    }
    @keyframes pulseAttention {
        0%, 100% { transform: scale(1); box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.4); }
        50% { transform: scale(1.03); box-shadow: 0 0 0 8px rgba(212, 175, 55, 0.2); }
    }
    
    .filtros-resultado {
        margin-top: 14px;
        font-size: 0.9rem;
        color: var(--texto-secundario);
    }
    .filtros-resultado strong {
        color: var(--azul-uba);
    }

    /* ============================================
       LISTADO
       ============================================ */
    .listado-maestrias { 
        background: var(--gris-100); 
        padding: 60px 0 80px; 
    }
    .maestrias-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    /* ============================================
       CARD MAESTRÍA
       ============================================ */
    .card-maestria { 
        background: var(--blanco); 
        border: 1px solid var(--gris-300);
        border-radius: 2px; 
        display: flex; 
        flex-direction: column;
        overflow: hidden; 
        transition: all 0.3s ease; 
    }
    .card-maestria:hover { 
        border-color: var(--azul-uba); 
        box-shadow: 0 8px 32px rgba(29,37,84,0.12); 
        transform: translateY(-3px); 
    }
    .card-maestria[data-inscripcion="cerrada"] { opacity: 0.75; }
    .card-maestria[data-inscripcion="cerrada"] { opacity: 0.7; }
    
    .card-top-line { height: 4px; width: 100%; }
    .card-top-line--sustentabilidad { background: var(--color-sustentabilidad); }
    .card-top-line--patrimonio { background: var(--color-patrimonio); }
    .card-top-line--urbanismo { background: var(--color-urbanismo); }
    .card-top-line--diseno { background: var(--color-diseno); }
    .card-top-line--proyecto { background: var(--color-proyecto); }
    .card-top-line--gestion { background: var(--color-gestion); }

    .card-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        padding: 14px 18px 0;
        flex-wrap: wrap;
        gap: 8px;
    }
    .card-badges { 
        display: flex; 
        gap: 8px; 
        flex-wrap: wrap; 
    }
    
    .card-area { 
        font-size: 0.7rem; 
        font-weight: 700; 
        text-transform: uppercase; 
        letter-spacing: 0.5px;
        padding: 5px 10px; 
        border-radius: 2px; 
    }
    .card-area--sustentabilidad { background: var(--color-sustentabilidad-bg); color: var(--color-sustentabilidad); }
    .card-area--patrimonio { background: var(--color-patrimonio-bg); color: var(--color-patrimonio); }
    .card-area--urbanismo { background: var(--color-urbanismo-bg); color: var(--color-urbanismo); }
    .card-area--diseno { background: var(--color-diseno-bg); color: var(--color-diseno); }
    .card-area--proyecto { background: var(--color-proyecto-bg); color: var(--color-proyecto); }
    .card-area--gestion { background: var(--color-gestion-bg); color: var(--color-gestion); }

    .card-inscripcion { 
        font-size: 0.7rem; 
        font-weight: 700; 
        text-transform: uppercase; 
        letter-spacing: 0.3px;
        padding: 5px 10px; 
        border-radius: 2px; 
    }
    .card-inscripcion--abierta { 
        background: var(--verde-inscripcion-bg); 
        color: var(--verde-inscripcion); 
        border: 1px solid var(--verde-inscripcion);
        display: inline-flex;
        align-items: center;
        gap: 6px;
    }
    .card-inscripcion--abierta::before {
        content: '';
        width: 6px;
        height: 6px;
        background: var(--verde-inscripcion);
        border-radius: 50%;
        animation: pulse-dot 2s ease-in-out infinite;
    }
    @keyframes pulse-dot {
        0%, 100% { opacity: 1; transform: scale(1); }
        50% { opacity: 0.6; transform: scale(1.2); }
    }
    .card-inscripcion--cerrada { background: var(--rojo-alerta-bg); color: var(--rojo-alerta); }
    .card-inscripcion--cerrada { background: var(--gris-suspendido-bg); color: var(--gris-suspendido); }
    .card-inscripcion--admitidos { 
        background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%); 
        color: #6a1b9a; 
        font-weight: 600;
        border: 1px solid #ce93d8;
    }
    
    /* Badge NUEVO */
    .card-badge-nuevo {
        background: linear-gradient(135deg, #43a047 0%, #66bb6a 100%);
        color: white;
        font-size: 0.7rem;
        font-weight: 800;
        padding: 4px 10px;
        border-radius: 2px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        animation: pulse-nuevo 2s ease-in-out infinite;
    }
    @keyframes pulse-nuevo {
        0%, 100% { box-shadow: 0 0 0 0 rgba(67, 160, 71, 0.4); }
        50% { box-shadow: 0 0 0 6px rgba(67, 160, 71, 0); }
    }
    
    /* Nota de contacto para admisión */
    .card-nota-contacto {
        font-size: 0.85rem;
        color: #7b1fa2;
        padding: 8px 24px;
        margin: 0;
        font-style: italic;
    }
    
    /* Nota de requisito previo */
    .card-nota-requisito {
        font-size: 0.8rem;
        color: #5d4037;
        background: linear-gradient(135deg, #f5e8f0 0%, #d7ccc8 100%);
        padding: 10px 16px;
        margin: 12px 24px 0;
        border-radius: 4px;
        border-left: 3px solid var(--color-patrimonio);
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .card-nota-requisito svg {
        flex-shrink: 0;
    }

    /* Badge Título de Magíster UBA */
    .card-titulo-badge {
        display: block;
        background: var(--gris-50);
        color: var(--azul-uba);
        font-size: 0.8rem;
        font-weight: 600;
        padding: 12px 16px;
        margin: 16px 0;
        border-left: 4px solid var(--dorado);
    }

    .card-titulo {
        font-size: 1.05rem;
        font-weight: 700;
        line-height: 1.3;
        padding: 10px 18px 0;
    }
    .card-titulo a { color: var(--azul-uba); }
    .card-titulo a:hover { color: var(--dorado); }

    .card-sigla {
        font-size: 0.8rem;
        color: var(--texto-secundario);
        font-style: italic;
        padding: 4px 18px 0;
    }
    .card-descripcion {
        font-size: 0.88rem;
        color: var(--texto-secundario);
        padding: 10px 18px;
        flex-grow: 1;
        line-height: 1.5;
    }

    .card-aviso {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 18px;
        background: var(--gris-suspendido-bg);
        font-size: 0.8rem;
        color: var(--gris-suspendido);
        font-weight: 500;
    }
    .card-aviso svg { flex-shrink: 0; }

    .card-intermedio {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 0 18px 10px;
        font-size: 0.8rem;
        color: var(--verde-exito);
        font-weight: 600;
    }
    .card-intermedio svg { flex-shrink: 0; }

    .card-datos {
        display: flex;
        gap: 6px;
        padding: 8px 18px;
        border-top: 1px solid var(--gris-200);
        font-size: 0.8rem;
        color: var(--texto-secundario);
        flex-wrap: wrap;
    }
    .card-datos strong { color: var(--texto-principal); }

    .card-footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px 18px 14px;
        border-top: 1px solid var(--gris-200);
        flex-wrap: wrap;
        gap: 10px;
    }
    .card-link {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 0.88rem;
        font-weight: 600;
        color: var(--azul-uba);
    }
    .card-link:hover { color: var(--dorado); }
    .card-link svg { transition: transform 0.3s ease; }
    .card-link:hover svg { transform: translateX(4px); }
    .card-link--disabled {
        color: var(--gris-texto);
        opacity: 0.6;
        cursor: not-allowed;
        font-style: italic;
    }
    .card-link--disabled:hover { color: var(--gris-texto); }

    /* ── CTAs cards cerradas (panel-cerrada.js) ── */
    .card-cerrada-cta {
        display: flex;
        gap: 8px;
        width: 100%;
    }
    .card-cta-btn {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        padding: 9px 6px;
        border-radius: 2px;
        font-size: .72rem;
        font-weight: 600;
        text-decoration: none;
        cursor: pointer;
        border: 1.5px solid;
        transition: all .15s;
        font-family: inherit;
    }
    .card-cta-avisame {
        background: var(--dorado-bg, #fdf8e8);
        border-color: var(--dorado-medio, #c9a227);
        color: var(--azul-uba);
    }
    .card-cta-avisame:hover {
        background: var(--dorado-suave, #e8d08a);
    }
    .card-cta-info {
        background: #fff;
        border-color: var(--azul-uba);
        color: var(--azul-uba);
    }
    .card-cta-info:hover {
        background: #f5f7ff;
    }
    .card-cta-ficha {
        background: var(--azul-uba);
        border-color: var(--azul-uba);
        color: #fff;
    }
    .card-cta-ficha:hover {
        background: var(--azul-hover, #2e3a6e);
    }
    @media (max-width: 480px) {
        .card-cerrada-cta { flex-direction: column; }
    }

    /* ============================================
       CTA FEDERAL
       ============================================ */
    .cta-federal { 
        background: var(--azul-uba); 
        padding: 80px 0; 
    }
    .cta-content { 
        text-align: center; 
        max-width: 700px; 
        margin: 0 auto; 
    }
    .cta-content h2 { 
        font-size: 2rem; 
        font-weight: 900; 
        color: var(--blanco); 
        margin-bottom: 20px; 
    }
    .cta-content p { 
        font-size: 1.1rem; 
        color: rgba(255,255,255,0.92); 
        margin-bottom: 35px; 
        font-weight: 400; 
        line-height: 1.7;
    }
    .cta-buttons { 
        display: flex; 
        gap: 16px; 
        justify-content: center; 
        flex-wrap: wrap; 
    }
    
    /* CTA Beneficios */
    .cta-beneficios {
        background: linear-gradient(135deg, var(--gris-50) 0%, var(--celeste-claro) 100%);
        padding: 60px 0;
        border-top: 4px solid var(--dorado);
        border-bottom: 4px solid var(--dorado);
    }
    .cta-beneficios-titulo {
        font-size: 2rem;
        font-weight: 700;
        color: var(--azul-uba);
        text-align: center;
        margin-bottom: 40px;
    }
    .cta-beneficios-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 40px;
        max-width: 1000px;
        margin: 0 auto;
    }
    .cta-beneficio-item {
        display: flex;
        gap: 20px;
        align-items: flex-start;
        background: var(--blanco);
        padding: 32px;
        border-radius: 4px;
        box-shadow: 0 4px 20px rgba(0,0,0,0.08);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    .cta-beneficio-item:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    }
    .cta-beneficio-icon {
        flex-shrink: 0;
        width: 56px;
        height: 56px;
        background: linear-gradient(135deg, var(--dorado) 0%, var(--dorado-oscuro) 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .cta-beneficio-icon svg {
        stroke: var(--blanco);
    }
    .cta-beneficio-content h3 {
        font-size: 1.25rem;
        font-weight: 700;
        color: var(--azul-uba);
        margin-bottom: 10px;
    }
    .cta-beneficio-content p {
        font-size: 0.95rem;
        color: var(--gris-600);
        line-height: 1.6;
        margin-bottom: 16px;
    }
    .cta-beneficio-link {
        font-size: 0.9rem;
        font-weight: 600;
        color: var(--dorado-oscuro);
        text-decoration: none;
        transition: color 0.2s ease;
    }
    .cta-beneficio-link:hover {
        color: var(--azul-uba);
    }
    @media (max-width: 768px) {

        .cta-beneficios-grid {
            grid-template-columns: 1fr;
            gap: 24px;
        }
        .cta-beneficio-item {
            padding: 24px;
        }
    }

    
    .btn-primary { 
        background: linear-gradient(135deg, var(--dorado) 0%, var(--dorado-oscuro) 50%, var(--dorado) 100%);
        background-size: 200% 200%;
        animation: gradientShift 3s ease infinite;
        color: var(--blanco); 
        padding: 16px 36px; 
        border-radius: 2px; 
        font-weight: 700; 
        font-size: 1rem;
        transition: all 0.3s ease; 
        border: none;
    }
    .btn-primary:hover { 
        animation-play-state: paused;
        background: var(--dorado-claro);
        background-size: 100% 100%;
        color: var(--blanco); 
        transform: translateY(-2px); 
    }
    .btn-secondary { 
        background: transparent; 
        color: var(--blanco); 
        padding: 16px 36px; 
        border-radius: 2px; 
        border: 2px solid rgba(255,255,255,0.5);
        font-weight: 600; 
        font-size: 1rem;
        transition: all 0.3s ease; 
    }
    .btn-secondary:hover { 
        border-color: var(--blanco); 
        background: rgba(255,255,255,0.1); 
        color: var(--blanco); 
    }

    /* ============================================
       FAQ
       ============================================ */
    .faq-section { 
        background: var(--blanco); 
        padding: 80px 0; 
    }
    .faq-title { 
        font-size: 1.75rem; 
        font-weight: 900; 
        color: var(--azul-uba); 
        text-align: center; 
        margin-bottom: 40px; 
    }
    .faq-list { 
        max-width: 800px; 
        margin: 0 auto; 
        display: flex; 
        flex-direction: column; 
        gap: 14px; 
    }
    .faq-item { 
        border: 1px solid var(--gris-300); 
        border-radius: 2px; 
        overflow: hidden; 
    }
    .faq-item summary { 
        padding: 20px 24px; 
        font-weight: 600; 
        color: var(--azul-uba); 
        cursor: pointer; 
        list-style: none; 
        display: flex; 
        justify-content: space-between; 
        align-items: center;
        transition: background 0.3s ease;
    }
    .faq-item summary::-webkit-details-marker { display: none; }
    .faq-item summary::after { 
        content: '+'; 
        font-size: 1.4rem; 
        color: var(--dorado); 
        font-weight: 400; 
    }
    .faq-item[open] summary::after { content: '−'; }
    .faq-item summary:hover { background: var(--gris-100); }
    .faq-item summary:focus { outline: 2px solid var(--dorado); outline-offset: -2px; }
    .faq-item p { 
        padding: 0 24px 20px; 
        color: var(--texto-secundario); 
        line-height: 1.7; 
    }
    .faq-more { 
        display: block; 
        text-align: center; 
        margin-top: 35px; 
        font-weight: 600; 
    }

    /* ============================================
       FOOTER
       ============================================ */
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    

    /* Sin resultados */
    .sin-resultados {
        grid-column: 1 / -1;
        text-align: center;
        padding: 60px 40px;
        background: var(--blanco);
        border: 1px solid var(--gris-300);
        border-radius: 2px;
        display: none;
    }
    .sin-resultados h3 {
        font-size: 1.2rem;
        color: var(--azul-uba);
        margin-bottom: 12px;
    }
    .sin-resultados p {
        color: var(--texto-secundario);
    }

    /* Utilidades accesibilidad */
    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    /* ============================================
       RESPONSIVE
       ============================================ */
    @media (max-width: 1024px) {

        .info-maestria__content { grid-template-columns: 1fr; gap: 40px; }
        
        
    }

    
    
    
    @media (max-width: 768px) {

        .hero { padding: 50px 20px 70px; }
        .hero-title { font-size: 2rem; }
        .hero-title-highlight { font-size: 2.3rem; }
        .hero-stats { gap: 30px; justify-content: center; }
        .filtros { position: relative; top: 0; }
        .maestrias-grid { grid-template-columns: 1fr; }
.cta-buttons { flex-direction: column; align-items: center; }
    }

    @media (min-width: 601px) and (max-width: 960px) {
        .maestrias-grid { grid-template-columns: repeat(2, 1fr); }
    }


/* Comparador en dropdown - separado visualmente */


/* ═══ HERRAMIENTAS PARA DECIDIR ═══ */
.herramientas-section {
    background: var(--gris-50);
    padding: 48px 0;
    text-align: center;
}
.herramientas-section h2 {
    font-size: 1.5rem;
    color: var(--azul-uba);
    margin-bottom: 8px;
}
.herramientas-section p {
    color: var(--texto-secundario);
    margin-bottom: 32px;
}
.herramientas-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}
.herramientas-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    border-radius: 2px;
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    transition: all 0.3s ease;
}
.herramientas-btn--primary {
    background: var(--azul-uba);
    color: var(--blanco);
}
.herramientas-btn--primary:hover {
    background: var(--azul-hover);
    color: var(--blanco);
}
.herramientas-btn--dorado {
    background: var(--dorado-medio);
    color: var(--azul-uba);
}
.herramientas-btn--dorado:hover {
    background: var(--dorado-claro);
    color: var(--azul-uba);
}
.herramientas-btn--outline {
    border: 2px solid var(--azul-uba);
    color: var(--azul-uba);
    background: transparent;
}
.herramientas-btn--outline:hover {
    background: var(--azul-uba);
    color: var(--blanco);
}

/* ═══ BREADCRUMB-LIST (formato estructurado) ═══ */