/* Mi CV - look & feel "liquid glass", mobile-first.
   Principios: vidrio solo en contenedores y navegacion; campos y texto sobre superficies
   casi opacas para que se lean bien; contraste AA; objetivos tactiles de 48px. */

:root {
    --acento: #1d4ed8;
    --acento-2: #0ea5a4;
    --acento-tinte: rgba(37, 99, 235, .12);
    --tinta: #0f1d33;
    --tinta-suave: #435575;
    --error: #b42318;
    --ok: #0f7a4d;
    --fondo-a: #dce9ff;
    --fondo-b: #e9f6f4;
    --vidrio-1: rgba(255, 255, 255, .66);
    --vidrio-2: rgba(255, 255, 255, .34);
    --vidrio-borde: rgba(255, 255, 255, .78);
    --vidrio-sombra: rgba(28, 58, 120, .16);
    --campo-bg: rgba(255, 255, 255, .82);
    --campo-borde: rgba(67, 85, 117, .6);
    --blob-1: #7aa7ff; --blob-2: #5fe0cf; --blob-3: #c7a8ff;
    --radio: 24px;
    --nav-h: 76px;
    color-scheme: light;
}

@media (prefers-color-scheme: dark) {
    :root {
        --acento: #6ea0ff;
        --acento-tinte: rgba(110, 160, 255, .18);
        --tinta: #eef3ff;
        --tinta-suave: #b5c3de;
        --error: #ff9b8f;
        --ok: #6ee7b0;
        --fondo-a: #0b1222; --fondo-b: #0e1c24;
        --vidrio-1: rgba(32, 44, 76, .62);
        --vidrio-2: rgba(22, 32, 58, .38);
        --vidrio-borde: rgba(255, 255, 255, .16);
        --vidrio-sombra: rgba(0, 0, 0, .45);
        --campo-bg: rgba(14, 22, 42, .72);
        --campo-borde: rgba(181, 195, 222, .55);
        --blob-1: #2f55c9; --blob-2: #148a85; --blob-3: #6b43c4;
        color-scheme: dark;
    }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    overflow-x: clip;
    min-height: 100vh;
    min-height: 100dvh;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: var(--tinta);
    background: linear-gradient(160deg, var(--fondo-a), var(--fondo-b));
    background-attachment: fixed;
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, p { margin: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--acento); outline-offset: 2px; }
[hidden] { display: none !important; }

/* ---------- fondo liquido ---------- */
.fondo { position: fixed; inset: 0; overflow: hidden; z-index: -1; pointer-events: none; }
.blob { position: absolute; border-radius: 50%; filter: blur(60px); opacity: .62; animation: flotar 22s ease-in-out infinite alternate; }
.blob.b1 { width: 62vmax; height: 62vmax; background: var(--blob-1); top: -22vmax; left: -18vmax; }
.blob.b2 { width: 54vmax; height: 54vmax; background: var(--blob-2); bottom: -20vmax; right: -16vmax; animation-delay: -7s; }
.blob.b3 { width: 38vmax; height: 38vmax; background: var(--blob-3); top: 38%; left: 52%; opacity: .45; animation-delay: -13s; }
@keyframes flotar { to { transform: translate3d(5vmax, 4vmax, 0) scale(1.08); } }

/* ---------- vidrio ---------- */
.glass, .glass-suave {
    position: relative;
    background: linear-gradient(145deg, var(--vidrio-1), var(--vidrio-2));
    border: 1px solid var(--vidrio-borde);
    box-shadow: 0 10px 34px var(--vidrio-sombra), inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -1px 0 rgba(255, 255, 255, .12);
    -webkit-backdrop-filter: blur(26px) saturate(1.8);
    backdrop-filter: blur(26px) saturate(1.8);
    border-radius: var(--radio);
}
/* brillo especular superior, como un borde de vidrio curvo */
.glass::before {
    content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0) 38%);
    opacity: .55;
    -webkit-mask: linear-gradient(#000, transparent 70%); mask: linear-gradient(#000, transparent 70%);
}
@media (prefers-color-scheme: dark) { .glass::before { opacity: .12; } }
.glass-suave { border-radius: 18px; box-shadow: 0 4px 16px var(--vidrio-sombra), inset 0 1px 0 rgba(255, 255, 255, .5); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .glass, .glass-suave { background: rgba(255, 255, 255, .92); }
    @media (prefers-color-scheme: dark) { .glass, .glass-suave { background: rgba(24, 34, 60, .96); } }
}
@media (prefers-reduced-transparency: reduce) {
    .glass, .glass-suave { background: rgba(255, 255, 255, .96); -webkit-backdrop-filter: none; backdrop-filter: none; }
    .glass::before { display: none; }
    @media (prefers-color-scheme: dark) { .glass, .glass-suave { background: rgba(24, 34, 60, .98); } }
}
@media (prefers-reduced-motion: reduce) { .blob { animation: none; } * { scroll-behavior: auto !important; transition: none !important; } }

/* ---------- botones ---------- */
.btn {
    position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 48px; padding: 0 20px; border-radius: 999px; cursor: pointer; text-decoration: none;
    font-weight: 600; font-size: 16px; color: var(--tinta);
    background: linear-gradient(180deg, rgba(255, 255, 255, .85), rgba(255, 255, 255, .5));
    border: 1px solid var(--vidrio-borde);
    box-shadow: 0 2px 10px var(--vidrio-sombra), inset 0 1px 0 rgba(255, 255, 255, .9);
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
    -webkit-tap-highlight-color: transparent;
}
@media (prefers-color-scheme: dark) { .btn { background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .06)); box-shadow: 0 2px 10px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .25); } }
.btn:hover { filter: brightness(1.03); }
.btn:active { transform: scale(.97); }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.btn.primario {
    color: #fff; border-color: rgba(255, 255, 255, .45);
    background: linear-gradient(180deg, color-mix(in srgb, var(--acento) 94%, #fff), var(--acento));
    box-shadow: 0 6px 18px color-mix(in srgb, var(--acento) 45%, transparent), inset 0 1px 0 rgba(255, 255, 255, .55), inset 0 -2px 6px rgba(0, 0, 0, .12);
}
body[data-pais] .btn.primario { background-color: var(--acento); }
@media (prefers-color-scheme: dark) { .btn.primario { color: #08111f; } }
.btn.peligro { color: #fff; background: #b42318; border-color: transparent; }
.btn.fantasma { background: transparent; box-shadow: none; border-color: transparent; }
.btn.grande { min-height: 56px; padding: 0 28px; font-size: 17px; width: 100%; }
.btn.chico { min-height: 44px; padding: 0 16px; font-size: 15px; }
.btn.icono { padding: 0; width: 44px; }
.ico { width: 20px; height: 20px; flex: none; }

.spinner { display: none; width: 20px; height: 20px; border: 3px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: gira .7s linear infinite; }
.cargando .spinner { display: inline-block; }
.cargando .txt { display: none; }
.spinner-lg { width: 32px; height: 32px; border: 4px solid var(--acento); border-right-color: transparent; border-radius: 50%; animation: gira .8s linear infinite; margin: 0 auto 8px; }
@keyframes gira { to { transform: rotate(360deg); } }

/* ---------- barra superior ---------- */
.barra {
    position: sticky; top: 8px; z-index: 20; margin: 8px 12px 0; padding: 8px 8px 8px 14px;
    display: flex; align-items: center; justify-content: space-between; border-radius: 22px;
    max-width: 640px; margin-inline: auto; width: calc(100% - 24px);
}
.marca { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--tinta); font-weight: 700; letter-spacing: -.01em; }
.marca img { border-radius: 22%; }

/* en el asistente, la barra de marca cede espacio al progreso */
body:has(.vista-wizard) .barra { display: none; }

/* ---------- contenedor ---------- */
.app { max-width: 640px; margin: 0 auto; padding: 16px 12px calc(var(--nav-h) + 70px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 14px; }
.app.vista-inicio { padding-bottom: 40px; }
.aviso { padding: 18px; }

/* ---------- acceso (login / bloqueo / terminos) ---------- */
.acceso { min-height: 100dvh; display: grid; place-items: center; padding: 20px 16px; }
.acceso.ancho .tarjeta-acceso { max-width: 560px; text-align: left; }
.tarjeta-acceso { width: 100%; max-width: 420px; padding: 32px 24px 24px; text-align: center; display: flex; flex-direction: column; gap: 14px; }
.tarjeta-acceso .logo { margin: 0 auto; box-shadow: 0 10px 24px rgba(37, 99, 235, .3); border-radius: 22%; }
.tarjeta-acceso h1 { font-size: 26px; line-height: 1.2; letter-spacing: -.02em; }
.lema { color: var(--tinta-suave); }
.tarjeta-acceso form { display: flex; flex-direction: column; gap: 10px; text-align: left; margin-top: 6px; }
.tarjeta-acceso label { font-weight: 600; font-size: 15px; }
.campo-tel { display: flex; align-items: stretch; background: var(--campo-bg); border: 1.5px solid var(--campo-borde); border-radius: 16px; overflow: hidden; }
.campo-tel:focus-within { border-color: var(--acento); box-shadow: 0 0 0 4px var(--acento-tinte); }
.campo-tel .prefijo { display: grid; place-items: center; padding: 0 14px; font-weight: 700; color: var(--tinta-suave); border-right: 1px solid var(--campo-borde); }
.campo-tel input[type="tel"] { flex: 1; min-width: 0; border: 0; border-radius: 0; background: transparent; min-height: 54px; padding: 0 14px; font-size: 20px; letter-spacing: .04em; outline: 0; box-shadow: none; }
.enlace { background: none; border: 0; padding: 0; color: var(--acento); font-weight: 700; text-decoration: underline; cursor: pointer; }
.pie-mini { font-size: 13px; color: var(--tinta-suave); }
.pie-mini a, .volver { color: var(--tinta-suave); }
.sms-caja { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; align-items: baseline; padding: 14px 16px; border-radius: 16px; background: var(--acento-tinte); text-align: left; }
.sms-caja strong { font-size: 20px; letter-spacing: .04em; }
.texto-legal h2 { font-size: 17px; margin-top: 8px; }
.texto-legal p { color: var(--tinta-suave); }
.volver { text-decoration: none; font-weight: 600; }

/* ---------- campos ---------- */
.campo { display: flex; flex-direction: column; gap: 6px; }
.campo label, .etq { font-weight: 600; font-size: 15px; }
.req { color: var(--error); }
.opc { font-weight: 400; color: var(--tinta-suave); font-size: 13px; }
input[type="text"], input[type="tel"], input[type="email"], input[type="url"], input[type="month"], input[type="number"], select, textarea {
    width: 100%; min-height: 52px; padding: 12px 14px; font-size: 16px;
    background: var(--campo-bg); color: var(--tinta);
    border: 1.5px solid var(--campo-borde); border-radius: 14px; outline: 0;
    transition: border-color .15s, box-shadow .15s;
    -webkit-appearance: none; appearance: none;
}
select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 18px; padding-right: 40px; }
textarea { resize: vertical; line-height: 1.45; }
input:focus, select:focus, textarea:focus { border-color: var(--acento); box-shadow: 0 0 0 4px var(--acento-tinte); }
input:disabled { opacity: .5; }
input::placeholder, textarea::placeholder { color: var(--tinta-suave); opacity: .9; }
.con-error input, .con-error select, .con-error textarea { border-color: var(--error); }
.error { color: var(--error); font-size: 14px; font-weight: 600; }
.ayuda, .contador { font-size: 13px; color: var(--tinta-suave); }
.nota { font-size: 14px; color: var(--tinta-suave); padding: 12px 14px; border-radius: 14px; background: var(--acento-tinte); }
.intro { color: var(--tinta-suave); }
.dos-col { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 380px) { .dos-col { grid-template-columns: 1fr; } }
.check { display: flex; align-items: center; gap: 12px; min-height: 44px; cursor: pointer; font-weight: 500; }
.check input { width: 22px; height: 22px; accent-color: var(--acento); flex: none; }
.oculto-file { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.fila-input { display: flex; gap: 8px; }
.fila-input input { flex: 1; }
.fila-botones { display: flex; flex-wrap: wrap; gap: 8px; }
.fila-botones.centro { justify-content: center; }

.foto-campo { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.foto-mini { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; border: 2px solid var(--vidrio-borde); box-shadow: 0 4px 12px var(--vidrio-sombra); }
.foto-mini.vacia { display: grid; place-items: center; background: var(--campo-bg); color: var(--tinta-suave); }

/* chips y segmentos */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
    display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 999px; cursor: pointer; font-weight: 500; font-size: 15px;
    background: var(--campo-bg); border: 1.5px solid var(--campo-borde); color: var(--tinta);
    transition: background .15s, border-color .15s, transform .12s;
}
.chip .ico { width: 16px; height: 16px; }
.chip.on { background: var(--acento); border-color: var(--acento); color: #fff; font-weight: 600; }
@media (prefers-color-scheme: dark) { .chip.on { color: #08111f; } }
.chip:active { transform: scale(.96); }
.segmento { display: grid; grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)); padding: 4px; gap: 4px; border-radius: 16px; background: var(--acento-tinte); }
.seg { flex: 1; min-width: 0; min-height: 44px; padding: 0 6px; border: 0; border-radius: 12px; background: transparent; cursor: pointer; font-weight: 600; font-size: 15px; color: var(--tinta-suave); transition: background .15s, color .15s, box-shadow .15s; }
.seg.on { background: var(--campo-bg); color: var(--tinta); box-shadow: 0 2px 8px var(--vidrio-sombra), inset 0 1px 0 rgba(255, 255, 255, .7); }

.sugerencias { display: flex; flex-direction: column; gap: 8px; }
.sugerencias .etq { display: flex; align-items: center; gap: 6px; }
.sugerencia { text-align: left; padding: 14px 16px; cursor: pointer; font-size: 15px; line-height: 1.45; border: 1px solid var(--vidrio-borde); color: var(--tinta); }
.sugerencia:hover { border-color: var(--acento); }

.item-card { padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.item-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.item-cab strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- inicio ---------- */
.hero { padding: 28px 22px 24px; display: flex; flex-direction: column; gap: 14px; }
.hero h1 { font-size: 30px; line-height: 1.12; letter-spacing: -.025em; }
.hero p { color: var(--tinta-suave); }
.insignia { align-self: flex-start; font-size: 13px; font-weight: 700; padding: 4px 12px; border-radius: 999px; background: var(--acento-tinte); color: var(--acento); }
.borrador { padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.borrador strong, .borrador span { display: block; }
.borrador span { font-size: 14px; color: var(--tinta-suave); }
.titulo-lista { font-size: 18px; margin-top: 6px; padding-inline: 4px; }
.vacio { padding: 28px 20px; text-align: center; color: var(--tinta-suave); display: flex; flex-direction: column; gap: 6px; align-items: center; }
.vacio .ico { width: 40px; height: 40px; color: var(--acento); }
.lista-cv { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.tarjeta-cv { padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.cv-info { display: flex; gap: 12px; align-items: center; }
.cv-info strong, .cv-info span, .cv-info small { display: block; }
.cv-info span { color: var(--tinta-suave); font-size: 15px; }
.cv-info small { color: var(--tinta-suave); font-size: 13px; }
.cv-ico { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: var(--acento-tinte); color: var(--acento); flex: none; }
.acciones-cv { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.acciones-cv .btn { width: 100%; }
.acciones-cv .btn.icono { width: 100%; padding: 0 16px; }

/* ---------- wizard ---------- */
.wiz-cab { display: flex; align-items: center; gap: 8px; padding: 8px 14px 8px 8px; }
.wiz-tit small { display: block; color: var(--tinta-suave); font-size: 13px; line-height: 1.2; }
.wiz-tit h1 { margin: 0; font-weight: 700; font-size: 19px; letter-spacing: -.01em; outline: 0; }
.progreso { display: grid; grid-template-columns: repeat(10, 1fr); gap: 4px; padding: 0 6px; }
.progreso i { height: 6px; border-radius: 3px; background: var(--campo-borde); opacity: .55; }
.progreso i.hecho { background: var(--acento); opacity: 1; }
.progreso i.actual { background: var(--acento); opacity: 1; box-shadow: 0 0 10px var(--acento); }
.paso { padding: 20px 18px 22px; display: flex; flex-direction: column; gap: 16px; }
.wiz-nav {
    position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 30;
    max-width: 616px; margin: 0 auto; padding: 10px; display: flex; justify-content: space-between; gap: 10px; border-radius: 28px;
}
.wiz-nav .btn { flex: 1; }
.wiz-nav .btn.primario { flex: 1.6; }

/* plantillas */
.plantillas { display: grid; gap: 14px; }
.plantilla { position: relative; display: grid; grid-template-columns: 112px 1fr; grid-template-rows: auto auto; column-gap: 14px; text-align: left; padding: 12px; cursor: pointer; border: 2px solid var(--vidrio-borde); color: var(--tinta); }
.plantilla .mini { grid-row: 1 / 3; }
.plantilla strong { align-self: end; font-size: 18px; }
.plantilla span { align-self: start; color: var(--tinta-suave); font-size: 14px; }
.plantilla.on { border-color: var(--acento); box-shadow: 0 0 0 4px var(--acento-tinte), 0 8px 24px var(--vidrio-sombra); }
.marca-sel { position: absolute; top: 10px; right: 10px; width: 28px; height: 28px; border-radius: 50%; background: var(--acento); color: #fff; display: grid; place-items: center; }
.marca-sel .ico { width: 16px; height: 16px; }
@media (prefers-color-scheme: dark) { .marca-sel { color: #08111f; } }
.mini, .visor { position: relative; overflow: hidden; background: #fff; border-radius: 8px; box-shadow: 0 3px 12px rgba(0, 0, 0, .18); }
.mini { width: 112px; }
.visor { width: 100%; border-radius: 10px; margin-top: 4px; }
.escala { width: 794px; transform-origin: top left; }

/* final */
.final { text-align: center; display: flex; flex-direction: column; gap: 14px; align-items: center; padding: 8px 0; }
.final h2 { font-size: 24px; letter-spacing: -.02em; }
.final p { color: var(--tinta-suave); overflow-wrap: anywhere; }
.final-ico { width: 76px; height: 76px; border-radius: 24px; display: grid; place-items: center; background: var(--acento-tinte); color: var(--acento); }
.final-ico .ico { width: 36px; height: 36px; }
.final-ico.exito { background: var(--ok); color: #fff; animation: pop .45s cubic-bezier(.2, 1.4, .4, 1); }
@media (prefers-color-scheme: dark) { .final-ico.exito { color: #08111f; } }
@keyframes pop { from { transform: scale(.4); opacity: 0; } }
.acciones-final { display: flex; flex-direction: column; gap: 10px; width: 100%; }

/* modal y toast */
.modal-fondo { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; background: rgba(10, 20, 40, .4); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.modal { width: 100%; max-width: 380px; padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.modal h2 { font-size: 20px; }
.modal p { color: var(--tinta-suave); }
.modal-botones { display: flex; gap: 10px; margin-top: 8px; }
.modal-botones .btn { flex: 1; }
.toast { position: fixed; left: 50%; top: calc(14px + env(safe-area-inset-top)); transform: translate(-50%, -14px); opacity: 0; z-index: 90; padding: 12px 18px; border-radius: 16px; width: max-content; max-width: min(92vw, 460px); text-align: center; font-weight: 600; font-size: 15px; transition: opacity .25s, transform .25s; pointer-events: none; }
.toast.on { opacity: 1; transform: translate(-50%, 0); }

@media (min-width: 700px) {
    .app, .barra { max-width: 680px; }
    .acciones-final { flex-direction: row; }
}

/* ======================================================================
   HOJA DEL CV (vista previa): 794 px = A4 a 96 dpi. Debe leerse igual que el PDF.
   No usa variables del tema: el CV siempre es papel blanco.
   ====================================================================== */
.cv { background: #fff; color: #1e222a; font-family: Helvetica, Arial, sans-serif; font-size: 14px; line-height: 1.32; min-height: 1123px; width: 794px; text-align: left; }
.cv h1 { margin: 0; font-size: 33px; line-height: 1.12; font-weight: 700; }
.cv h2 { margin: 0 0 8px; font-size: 14.5px; letter-spacing: .04em; text-transform: uppercase; font-weight: 700; }
.cv p { margin: 0; }
.cv ul { margin: 0; padding: 0; list-style: none; }
.cv-puesto { color: #646c78; font-size: 17px; margin-top: 4px; }
.cv-sec { margin-top: 18px; }
.cv-item { margin-bottom: 10px; }
.cv-fila { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.cv-fecha { color: #646c78; font-size: 13px; white-space: nowrap; }
.cv-sub { color: #646c78; font-style: italic; font-size: 13.5px; }
.cv-item ul { margin-top: 3px; }
.cv-item li { position: relative; padding-left: 16px; margin-bottom: 2px; }
.cv-item li::before { content: ""; position: absolute; left: 2px; top: .6em; width: 5px; height: 5px; border-radius: 50%; background: var(--cv-acento); }
.cv-par { margin-bottom: 3px; }
.cv-foto { width: 106px; height: 106px; object-fit: cover; }
.cv-chips { display: block; }
.cv-chips li { display: inline; }
.cv-chips li + li::before { content: "  •  "; white-space: pre; }
.cv-idiomas li { margin-bottom: 2px; }

/* Profesional */
.cv-profesional { --cv-acento: #1f3864; padding: 46px 48px; }
.cv-profesional > header { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: flex-start; gap: 16px; }
.cv-profesional h1 { color: #1f3864; }
.cv-profesional .cv-contacto { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 2px 0; color: #646c78; font-size: 13.5px; }
.cv-profesional .cv-contacto li + li::before { content: "|"; margin: 0 12px; color: #646c78; }
.cv-profesional .cv-contacto span { display: none; }
.cv-profesional h2 { color: #1f3864; padding-bottom: 4px; border-bottom: 1px solid #bec6d2; }
.cv-profesional .cv-foto { border-radius: 4px; }

/* Moderno */
.cv-moderno { --cv-acento: #2563eb; display: grid; grid-template-columns: 253px 1fr; }
.cv-moderno aside { background: #143460; color: #fff; padding: 40px 26px; }
.cv-moderno aside h1 { font-size: 24px; color: #fff; margin-top: 4px; }
.cv-moderno aside .cv-puesto { color: #bed0eb; font-size: 14px; margin-bottom: 8px; }
.cv-moderno aside h2 { color: #96c3ff; font-size: 12.5px; border-bottom: 1px solid #466eaa; padding-bottom: 5px; }
.cv-moderno aside .cv-foto { width: 173px; height: 173px; border-radius: 50%; display: block; margin: 0 auto 18px; }
.cv-moderno aside .cv-contacto li { margin-bottom: 6px; font-size: 12.5px; word-break: break-word; }
.cv-moderno aside .cv-contacto span { display: none; }
.cv-moderno aside .cv-chips li { display: block; margin-bottom: 3px; }
.cv-moderno aside .cv-chips li + li::before { content: none; }
.cv-moderno .cv-main { padding: 46px 38px 40px 34px; }
.cv-moderno .cv-main h2 { color: #2563eb; }
.cv-moderno .cv-main .cv-sec:first-child { margin-top: 0; }

/* Compacto */
.cv-compacto { --cv-acento: #0f766e; font-size: 13.2px; padding-bottom: 36px; }
.cv-compacto > header { background: #0f766e; color: #fff; display: flex; justify-content: space-between; align-items: center; padding: 22px 40px 6px; min-height: 76px; }
.cv-compacto h1 { font-size: 27px; color: #fff; }
.cv-compacto .cv-puesto { color: #e1f5f2; font-size: 14.5px; }
.cv-compacto .cv-foto { width: 86px; height: 86px; border-radius: 6px; }
.cv-compacto .cv-contacto { background: #0f766e; color: #fff; padding: 0 40px 14px; display: flex; flex-wrap: wrap; font-size: 11.5px; }
.cv-compacto .cv-contacto li + li::before { content: "|"; margin: 0 9px; }
.cv-compacto .cv-contacto span { display: none; }
.cv-compacto .cv-sec { margin: 12px 40px 0; }
.cv-compacto h2 { color: #0f766e; font-size: 13px; padding-bottom: 3px; border-bottom: 1px solid #c8d0d7; margin-bottom: 6px; }
.cv-compacto .cv-item { margin-bottom: 7px; }

.wiz-nav .btn:disabled { visibility: hidden; }
.item-card, .sugerencia { -webkit-backdrop-filter: none; backdrop-filter: none; }
.btn[data-a="eliminar"] { color: var(--error); }
.barra .btn { min-height: 44px; padding: 0 18px; }
.modal-cv { position: fixed; inset: 0; z-index: 100; background: rgba(10, 20, 40, .72); display: flex; flex-direction: column; }
.modal-cv-cab { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; color: #fff; font-weight: 600; }
.modal-cv-cuerpo { flex: 1; overflow: auto; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y pinch-zoom; padding: 0 12px 24px; }
.modal-cv-cuerpo .cv { margin: 0 auto; box-shadow: 0 8px 30px rgba(0, 0, 0, .4); }
@media (max-height: 500px) { .wiz-nav { position: static; margin-top: 12px; } }
@media (prefers-contrast: more) { :root { --vidrio-1: rgba(255, 255, 255, .94); --vidrio-2: rgba(255, 255, 255, .9); --campo-borde: #435575; } }
@media (forced-colors: active) { .glass, .glass-suave, .chip, .btn, .seg.on { border: 1px solid CanvasText; } }