.proceso_pagina {
    --ci-primary: var(--ci-violet);
    --ci-primary-rgb: var(--ci-violet-rgb);
    --proceso_texto: var(--constantinnova_page_text);
    --proceso_suave: var(--constantinnova_page_text_soft);
    --proceso_linea: var(--constantinnova_page_line);
    --proceso_superficie: var(--constantinnova_page_surface);
    --proceso_superficie_fuerte: var(--constantinnova_page_surface_strong);
    --proceso_sombra: var(--constantinnova_page_shadow);
    min-height: 100vh;
    padding: 92px 0 70px;
    color: var(--proceso_texto);
}

.proceso_limite {
    width: min(1240px, calc(100% - 40px));
    margin-inline: auto;
}

.proceso_portada,
.proceso_resumen,
.proceso_etapas,
.proceso_ciclo,
.proceso_entregables,
.proceso_preguntas,
.proceso_cierre {
    background: transparent;
}

.proceso_portada {
    padding: 28px 0 72px;
    overflow: hidden;
}

.proceso_migas {
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--proceso_suave);
    font-size: 9px;
    font-weight: 800;
}

.proceso_migas a {
    color: var(--proceso_suave);
    text-decoration: none;
}

.proceso_migas a:hover,
.proceso_migas strong { color: var(--proceso_texto); }
.proceso_migas i { opacity: .45; font-size: 7px; }

.proceso_portada_cuadricula {
    display: grid;
    grid-template-columns: minmax(430px, .94fr) minmax(520px, 1.06fr);
    gap: clamp(40px, 5vw, 72px);
    align-items: center;
}

.proceso_portada_texto { position: relative; z-index: 2; }

.proceso_sobretitulo {
    width: fit-content;
    margin: 0;
    padding: 9px 13px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(var(--ci-primary-rgb), .22);
    border-radius: 999px;
    color: var(--ci-primary);
    background: var(--proceso_superficie);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.proceso_sobretitulo i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--ci-primary), var(--ci-cyan));
    box-shadow: 0 0 0 6px rgba(var(--ci-primary-rgb), .10);
}

.proceso_portada h1 {
    max-width: 670px;
    margin: 22px 0 20px;
    font-size: clamp(3.45rem, 4.8vw, 5.45rem);
    line-height: .93;
    letter-spacing: -.07em;
}

.proceso_portada h1 span {
    color: transparent;
    background: linear-gradient(105deg, var(--ci-primary), var(--ci-blue) 48%, var(--ci-cyan));
    -webkit-background-clip: text;
    background-clip: text;
}

.proceso_introduccion {
    max-width: 610px;
    margin: 0;
    color: var(--proceso_suave);
    font-size: 14px;
    line-height: 1.7;
}

.proceso_acciones {
    margin-top: 27px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.proceso_boton {
    min-height: 49px;
    padding: 0 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 1px solid var(--proceso_linea);
    border-radius: 999px;
    color: var(--proceso_texto);
    background: var(--proceso_superficie);
    font-size: 10px;
    font-weight: 900;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}

.proceso_boton:hover { transform: translateY(-2px); }

.proceso_boton_principal {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, var(--ci-primary), var(--ci-blue) 58%, var(--ci-cyan));
    box-shadow: 0 16px 38px rgba(var(--ci-primary-rgb), .24);
}

.proceso_confianza {
    margin: 31px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    list-style: none;
}

.proceso_confianza li {
    min-width: 0;
    padding: 11px;
    display: grid;
    grid-template-columns: 31px 1fr;
    gap: 8px;
    align-items: center;
    border: 1px solid var(--proceso_linea);
    border-radius: 16px;
    background: var(--proceso_superficie);
}

.proceso_confianza li > i {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    color: var(--ci-primary);
    background: rgba(var(--ci-primary-rgb), .10);
}

.proceso_confianza span,
.proceso_confianza strong,
.proceso_confianza small { display: block; }
.proceso_confianza strong { font-size: 9px; }
.proceso_confianza small { margin-top: 3px; color: var(--proceso_suave); font-size: 7px; line-height: 1.35; }

.proceso_portada_visual {
    position: relative;
    min-height: 520px;
    display: grid;
    place-items: center;
}

.proceso_portada_resplandor {
    position: absolute;
    inset: 7% 0 0;
    border-radius: 42%;
    background: linear-gradient(135deg, rgba(var(--ci-primary-rgb), .20), rgba(var(--ci-cyan-rgb), .18));
    filter: blur(48px);
}

.proceso_imagen_principal {
    position: relative;
    z-index: 1;
    width: min(670px, 94%);
    margin: 0;
    padding: 10px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 30px;
    background: var(--proceso_superficie_fuerte);
    box-shadow: 0 38px 110px rgba(31, 28, 64, .24);
    transform: perspective(1200px) rotateY(-2deg) rotateX(.5deg);
}

.proceso_imagen_principal img {
    width: 100%;
    max-height: 500px;
    object-fit: cover;
    border-radius: 22px;
}

.proceso_flotante {
    position: absolute;
    z-index: 2;
    min-width: 170px;
    padding: 13px;
    display: grid;
    gap: 4px;
    border: 1px solid var(--proceso_linea);
    border-radius: 16px;
    color: var(--proceso_texto);
    background: var(--proceso_superficie_fuerte);
    box-shadow: 0 18px 48px rgba(30, 34, 65, .17);
    backdrop-filter: blur(16px);
}

.proceso_flotante small { color: var(--proceso_suave); font-size: 7px; }
.proceso_flotante strong { font-size: 10px; }
.proceso_flotante strong i {
    width: 7px;
    height: 7px;
    margin-right: 5px;
    display: inline-block;
    border-radius: 50%;
    background: var(--ci-green);
    box-shadow: 0 0 0 5px rgba(var(--ci-green-rgb), .11);
}
.proceso_flotante_superior { top: 12%; right: -5px; }
.proceso_flotante_inferior { bottom: 11%; left: -7px; }

.proceso_resumen { padding: 0 0 70px; }

.proceso_resumen_cuadricula {
    padding: 14px;
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
    gap: 10px;
    align-items: center;
    border: 1px solid var(--proceso_linea);
    border-radius: 23px;
    background: var(--proceso_superficie);
    box-shadow: 0 16px 44px rgba(32, 42, 76, .06);
}

.proceso_resumen_cuadricula > i { color: var(--proceso_suave); opacity: .45; font-size: 9px; }
.proceso_resumen_cuadricula article { padding: 10px; display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; }
.proceso_resumen_cuadricula article > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: var(--ci-primary); background: rgba(var(--ci-primary-rgb), .10); font-size: 9px; font-weight: 900; }
.proceso_resumen_cuadricula strong { display: block; font-size: 10px; }
.proceso_resumen_cuadricula p { margin: 3px 0 0; color: var(--proceso_suave); font-size: 8px; }

.proceso_etapas,
.proceso_ciclo,
.proceso_entregables,
.proceso_preguntas { padding: 82px 0; }

.proceso_encabezado { max-width: 860px; margin-bottom: 34px; }

.proceso_encabezado_dividido {
    max-width: none;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 440px);
    gap: 48px;
    align-items: end;
}

.proceso_encabezado_centrado { margin-inline: auto; text-align: center; }

.proceso_etiqueta {
    margin: 0;
    color: var(--ci-primary);
    font-size: 9px;
    font-weight: 950;
    letter-spacing: .14em;
}

.proceso_encabezado h2,
.proceso_ciclo_texto h2,
.proceso_preguntas_cuadricula > div > h2,
.proceso_cierre_panel h2 {
    margin: 10px 0 0;
    font-size: clamp(2.4rem, 4.5vw, 4.7rem);
    line-height: .96;
    letter-spacing: -.065em;
}

.proceso_encabezado > p:last-child,
.proceso_encabezado_dividido > p,
.proceso_ciclo_texto > p,
.proceso_preguntas_cuadricula > div > p,
.proceso_cierre_panel p {
    margin: 15px 0 0;
    color: var(--proceso_suave);
    font-size: 13px;
    line-height: 1.7;
}

.proceso_etapas_lista { display: grid; gap: 13px; }

.proceso_etapa {
    padding: 20px;
    display: grid;
    grid-template-columns: 55px minmax(0, 1fr) minmax(250px, .72fr);
    gap: 22px;
    align-items: center;
    border: 1px solid var(--proceso_linea);
    border-radius: 25px;
    background: var(--proceso_superficie);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.proceso_etapa:hover {
    transform: translateY(-3px);
    border-color: rgba(var(--ci-primary-rgb), .26);
    box-shadow: var(--proceso_sombra);
}

.proceso_etapa_activa {
    background: linear-gradient(120deg, rgba(var(--ci-primary-rgb), .08), transparent 45%), var(--proceso_superficie);
}

.proceso_etapa_numero {
    width: 55px;
    height: 55px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(135deg, var(--ci-primary), var(--ci-blue));
    font-size: 12px;
    font-weight: 950;
    box-shadow: 0 14px 34px rgba(var(--ci-primary-rgb), .20);
}

.proceso_etapa_contenido > span { color: var(--ci-primary); font-size: 8px; font-weight: 950; letter-spacing: .13em; }
.proceso_etapa_contenido h3 { margin: 6px 0 0; font-size: 22px; letter-spacing: -.04em; }
.proceso_etapa_contenido > p { max-width: 650px; margin: 7px 0 0; color: var(--proceso_suave); font-size: 10px; line-height: 1.55; }
.proceso_etapa_contenido ul { margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; }
.proceso_etapa_contenido li { padding: 6px 9px; border-radius: 999px; color: var(--proceso_suave); background: rgba(var(--ci-primary-rgb), .07); font-size: 8px; font-weight: 800; }

.proceso_etapa_resultado {
    padding: 16px;
    border: 1px solid var(--proceso_linea);
    border-radius: 17px;
    background: var(--proceso_superficie_fuerte);
}

.proceso_etapa_resultado small { color: var(--ci-green); font-size: 7px; font-weight: 950; letter-spacing: .12em; }
.proceso_etapa_resultado strong { margin-top: 5px; display: block; font-size: 11px; }
.proceso_etapa_resultado p { margin: 5px 0 0; color: var(--proceso_suave); font-size: 8px; line-height: 1.5; }

.proceso_ciclo_cuadricula {
    display: grid;
    grid-template-columns: .78fr 1.22fr;
    gap: clamp(38px, 6vw, 82px);
    align-items: center;
}

.proceso_ciclo_texto h2 { max-width: 620px; }

.proceso_enlace {
    margin-top: 24px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--proceso_texto);
    font-size: 10px;
    font-weight: 900;
    text-decoration: none;
}

.proceso_enlace i { color: var(--ci-primary); }

.proceso_ciclo_panel {
    padding: 13px;
    overflow: hidden;
    border: 1px solid var(--proceso_linea);
    border-radius: 29px;
    background: var(--proceso_superficie);
    box-shadow: var(--proceso_sombra);
}

.proceso_ciclo_cabecera {
    min-height: 44px;
    padding: 0 9px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.proceso_ciclo_cabecera > span { display: flex; gap: 5px; }
.proceso_ciclo_cabecera > span i { width: 7px; height: 7px; border-radius: 50%; background: var(--ci-primary); opacity: .55; }
.proceso_ciclo_cabecera > span i:nth-child(2) { background: var(--ci-cyan); }
.proceso_ciclo_cabecera > span i:nth-child(3) { background: var(--ci-green); }
.proceso_ciclo_cabecera small { margin-left: 6px; color: var(--proceso_suave); font-size: 8px; font-weight: 800; }
.proceso_ciclo_cabecera strong { margin-left: auto; font-size: 8px; }

.proceso_ciclo_progreso {
    padding: 20px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 7px 16px;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(var(--ci-primary-rgb), .12), rgba(var(--ci-cyan-rgb), .08));
}

.proceso_ciclo_progreso > span { grid-column: 1 / -1; height: 6px; overflow: hidden; border-radius: 999px; background: var(--proceso_linea); }
.proceso_ciclo_progreso > span i { width: 74%; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--ci-primary), var(--ci-cyan)); }
.proceso_ciclo_progreso small { color: var(--proceso_suave); font-size: 8px; }
.proceso_ciclo_progreso strong { font-size: 9px; }

.proceso_ciclo_tarjetas { padding: 12px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.proceso_ciclo_tarjetas article { min-width: 0; padding: 16px; display: grid; gap: 14px; border: 1px solid var(--proceso_linea); border-radius: 18px; background: var(--proceso_superficie_fuerte); }
.proceso_ciclo_tarjetas article > i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: var(--ci-primary); background: rgba(var(--ci-primary-rgb), .10); }
.proceso_ciclo_tarjetas span,
.proceso_ciclo_tarjetas small,
.proceso_ciclo_tarjetas strong { display: block; }
.proceso_ciclo_tarjetas small { color: var(--ci-primary); font-size: 7px; font-weight: 950; letter-spacing: .12em; }
.proceso_ciclo_tarjetas strong { margin-top: 4px; font-size: 10px; }
.proceso_ciclo_tarjetas p { margin: 5px 0 0; color: var(--proceso_suave); font-size: 8px; line-height: 1.5; }

.proceso_entregables_cuadricula { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.proceso_entregables_cuadricula article { min-height: 360px; padding: 26px; display: flex; flex-direction: column; border: 1px solid var(--proceso_linea); border-radius: 26px; background: var(--proceso_superficie); box-shadow: 0 18px 48px rgba(34, 41, 75, .07); }
.proceso_entregables_cuadricula article > span { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; color: var(--ci-primary); background: rgba(var(--ci-primary-rgb), .10); font-size: 18px; }
.proceso_entregables_cuadricula small { margin-top: 25px; color: var(--ci-primary); font-size: 8px; font-weight: 950; letter-spacing: .13em; }
.proceso_entregables_cuadricula h3 { margin: 8px 0 0; font-size: 23px; letter-spacing: -.04em; }
.proceso_entregables_cuadricula p { margin: 9px 0 0; color: var(--proceso_suave); font-size: 10px; line-height: 1.6; }
.proceso_entregables_cuadricula ul { margin: auto 0 0; padding: 18px 0 0; display: grid; gap: 9px; border-top: 1px solid var(--proceso_linea); list-style: none; }
.proceso_entregables_cuadricula li { color: var(--proceso_suave); font-size: 9px; }
.proceso_entregables_cuadricula li::before { content: ""; width: 6px; height: 6px; margin-right: 8px; display: inline-block; border-radius: 50%; background: var(--ci-green); }

.proceso_preguntas_cuadricula { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(40px, 7vw, 90px); align-items: start; }
.proceso_preguntas_cuadricula > div > h2 { font-size: clamp(2.5rem, 4vw, 4rem); }
.proceso_acordeon { display: grid; gap: 9px; }
.proceso_acordeon details { padding: 18px 20px; border: 1px solid var(--proceso_linea); border-radius: 18px; background: var(--proceso_superficie); }
.proceso_acordeon summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--proceso_texto); cursor: pointer; font-size: 11px; font-weight: 900; list-style: none; }
.proceso_acordeon summary::-webkit-details-marker { display: none; }
.proceso_acordeon summary i { color: var(--ci-primary); transition: transform .2s ease; }
.proceso_acordeon details[open] summary i { transform: rotate(45deg); }
.proceso_acordeon details p { margin: 12px 0 0; padding-right: 35px; color: var(--proceso_suave); font-size: 10px; line-height: 1.65; }

.proceso_cierre { padding: 34px 0 20px; }
.proceso_cierre_panel { padding: 38px; display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center; overflow: hidden; border: 1px solid rgba(255, 255, 255, .13); border-radius: 30px; color: #fff; background: radial-gradient(circle at top right, rgba(var(--ci-cyan-rgb), .25), transparent 25rem), linear-gradient(135deg, #111325, #25205b 55%, #164251); box-shadow: 0 34px 100px rgba(25, 28, 64, .28); }
.proceso_cierre_panel .proceso_etiqueta { color: #7ee5ee; }
.proceso_cierre_panel h2 { max-width: 850px; color: #fff; }
.proceso_cierre_panel p { max-width: 780px; color: rgba(255, 255, 255, .70); }
.proceso_cierre_panel .proceso_boton { white-space: nowrap; }

.proceso_boton:focus-visible,
.proceso_migas a:focus-visible,
.proceso_enlace:focus-visible,
.proceso_acordeon summary:focus-visible { outline: 2px solid var(--ci-cyan); outline-offset: 3px; }

@media (max-width: 1080px) {
    .proceso_portada_cuadricula,
    .proceso_ciclo_cuadricula { grid-template-columns: 1fr; }
    .proceso_portada_texto { max-width: 850px; }
    .proceso_portada_visual { width: min(790px, 100%); margin-inline: auto; }
    .proceso_etapa { grid-template-columns: 55px 1fr; }
    .proceso_etapa_resultado { grid-column: 2; }
    .proceso_entregables_cuadricula { grid-template-columns: 1fr; }
    .proceso_entregables_cuadricula article { min-height: 290px; }
}

@media (max-width: 820px) {
    .proceso_pagina { padding-top: 68px; }
    .proceso_encabezado_dividido,
    .proceso_preguntas_cuadricula,
    .proceso_cierre_panel { grid-template-columns: 1fr; }
    .proceso_confianza { grid-template-columns: 1fr; }
    .proceso_resumen_cuadricula { grid-template-columns: repeat(2, 1fr); }
    .proceso_resumen_cuadricula > i { display: none; }
    .proceso_ciclo_tarjetas { grid-template-columns: 1fr; }
    .proceso_cierre_panel .proceso_boton { width: fit-content; }
}

@media (max-width: 620px) {
    .proceso_pagina { padding-top: 48px; }
    .proceso_limite { width: min(100% - 22px, 1240px); }
    .proceso_portada { padding-top: 26px; }
    .proceso_portada h1 { font-size: clamp(2.8rem, 13.5vw, 4.5rem); }
    .proceso_acciones { flex-direction: column; }
    .proceso_boton { width: 100%; }
    .proceso_portada_visual { min-height: 340px; }
    .proceso_imagen_principal { width: 100%; transform: none; }
    .proceso_flotante { display: none; }
    .proceso_resumen_cuadricula { grid-template-columns: 1fr; }
    .proceso_etapa { padding: 17px; grid-template-columns: 42px 1fr; gap: 14px; align-items: start; }
    .proceso_etapa_numero { width: 42px; height: 42px; border-radius: 13px; }
    .proceso_etapa_resultado { grid-column: 1 / -1; }
    .proceso_entregables_cuadricula article { min-height: 320px; padding: 22px; }
    .proceso_cierre_panel { padding: 26px; }
    .proceso_cierre_panel .proceso_boton { width: 100%; white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
    .proceso_boton,
    .proceso_etapa,
    .proceso_acordeon summary i { transition: none; }
    .proceso_boton:hover,
    .proceso_etapa:hover,
    .proceso_imagen_principal { transform: none; }
}