/* ============ Base ============ */
*, *::before, *::after { box-sizing: border-box; }
:root {
  --acento: #2563eb;
  --tinta: #111827;
  --tinta-2: #374151;
  --gris: #6b7280;
  --linea: #e5e7eb;
  --fondo: #ffffff;
  --gris-fondo: #f7f8fa;
  --radio: 14px;
  --sombra: 0 10px 30px rgba(17,24,39,.08);
}
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  color: var(--tinta);
  background: var(--fondo);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { font-family: "Sora", "Inter", sans-serif; line-height: 1.15; margin: 0 0 .4em; }
p { margin: 0 0 1em; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; }
.contenedor { max-width: 1120px; margin: 0 auto; padding: 0 22px; }
.contenedor-angosto { max-width: 720px; }
.centrado { text-align: center; }
.micro { font-size: 13px; color: var(--gris); }
.oculto { display: none !important; }

/* ============ Botones ============ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid transparent; border-radius: 10px; font-weight: 600;
  padding: 11px 18px; font-size: 15px; transition: .18s; cursor: pointer;
}
.btn-primario { background: var(--acento); color: #fff; }
.btn-primario:hover { filter: brightness(.94); transform: translateY(-1px); }
.btn-ghost { background: #fff; border-color: var(--linea); color: var(--tinta); }
.btn-ghost:hover { border-color: #cbd5e1; background: #fafafa; }
.btn-sm { padding: 8px 14px; font-size: 14px; }
.btn-lg { padding: 14px 26px; font-size: 16px; }
.btn-bloque { width: 100%; }

/* ============ Nav publica ============ */
.site-nav { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.85); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linea); }
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 66px; }
.logo { font-family: "Sora"; font-weight: 800; font-size: 20px; letter-spacing: -.02em; }
.logo span { color: var(--acento); }
.nav-links { display: flex; align-items: center; gap: 24px; }
.nav-links a { font-size: 14.5px; color: var(--tinta-2); font-weight: 500; }
.nav-links a:hover { color: var(--acento); }

/* ============ Hero ============ */
.hero { padding: 70px 0 60px; background: radial-gradient(1200px 500px at 80% -10%, #eef2ff, transparent), var(--fondo); }
.hero-inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: 50px; align-items: center; }
.badge { display: inline-block; background: #eef2ff; color: var(--acento); font-weight: 600; font-size: 13px; padding: 6px 12px; border-radius: 999px; margin-bottom: 18px; }
.hero h1 { font-size: 54px; font-weight: 800; letter-spacing: -.03em; }
.grad { background: linear-gradient(100deg, var(--acento), #7c3aed); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lead { font-size: 19px; color: var(--tinta-2); max-width: 520px; }
.hero-acciones { display: flex; gap: 14px; margin: 26px 0 14px; flex-wrap: wrap; }
.hero-mock { display: flex; justify-content: center; }
.mock-card { width: 320px; background: #fff; border: 1px solid var(--linea); border-radius: 20px; box-shadow: var(--sombra); padding: 28px; text-align: center; }
.mock-foto { width: 76px; height: 76px; border-radius: 50%; background: var(--acento); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 26px; margin: 0 auto 14px; }
.mock-nombre { font-weight: 700; font-size: 19px; }
.mock-cargo { font-size: 13.5px; color: var(--gris); margin-bottom: 18px; }
.mock-linea { height: 9px; background: #eef0f4; border-radius: 6px; margin: 9px 0; }
.mock-linea.corta { width: 65%; margin-left: auto; margin-right: auto; }
.mock-chips { display: flex; gap: 7px; justify-content: center; margin: 16px 0; }
.mock-chips span { width: 34px; height: 9px; background: #eef0f4; border-radius: 6px; }
.mock-link { font-size: 12.5px; color: var(--acento); background: #eef2ff; padding: 7px; border-radius: 8px; }

/* ============ Secciones ============ */
.seccion { padding: 70px 0; }
.seccion-gris { background: var(--gris-fondo); }
.seccion h2 { font-size: 34px; font-weight: 800; letter-spacing: -.02em; }
.sub { color: var(--gris); font-size: 17px; margin-bottom: 40px; }

.pasos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.paso { background: #fff; border: 1px solid var(--linea); border-radius: var(--radio); padding: 28px; }
.paso .num { display: inline-flex; width: 38px; height: 38px; border-radius: 10px; background: var(--acento); color: #fff; align-items: center; justify-content: center; font-weight: 700; margin-bottom: 14px; }
.paso h3 { font-size: 19px; }

.features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.feature { background: #fff; border: 1px solid var(--linea); border-radius: var(--radio); padding: 26px; }
.feature .ico { font-size: 26px; margin-bottom: 10px; }
.feature h3 { font-size: 17px; }
.feature p { color: var(--tinta-2); font-size: 14.5px; margin: 0; }

.precio-card { max-width: 420px; margin: 0 auto; background: #fff; border: 1px solid var(--linea); border-radius: 20px; padding: 34px; box-shadow: var(--sombra); }
.precio { font-family: "Sora"; font-size: 58px; font-weight: 800; letter-spacing: -.03em; }
.precio span { font-size: 18px; color: var(--gris); font-weight: 500; margin-left: 6px; }
.precio-sub { color: var(--gris); margin-top: -8px; }
.precio-lista { list-style: none; padding: 0; margin: 22px 0; text-align: left; }
.precio-lista li { padding: 9px 0 9px 30px; position: relative; border-bottom: 1px solid #f1f3f6; }
.precio-lista li::before { content: "✓"; position: absolute; left: 0; color: var(--acento); font-weight: 700; }

.faq { background: #fff; border: 1px solid var(--linea); border-radius: 12px; padding: 16px 20px; margin-bottom: 12px; }
.faq summary { font-weight: 600; cursor: pointer; }
.faq p { margin: 10px 0 0; color: var(--tinta-2); }

.site-footer { padding: 50px 0; border-top: 1px solid var(--linea); text-align: center; }
.site-footer .logo { margin-bottom: 8px; }

/* ============ Formularios ============ */
.tarjeta-form { background: #fff; border: 1px solid var(--linea); border-radius: 16px; padding: 30px; box-shadow: var(--sombra); }
.tarjeta-form label, .foto-label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 16px; }
.tarjeta-form input, .tarjeta-form textarea, .tarjeta-form select {
  width: 100%; margin-top: 7px; padding: 12px 14px; border: 1px solid var(--linea);
  border-radius: 10px; font-family: inherit; font-size: 15px; background: #fcfcfd; color: var(--tinta);
}
.tarjeta-form input:focus, .tarjeta-form textarea:focus { outline: 2px solid color-mix(in srgb, var(--acento) 35%, transparent); border-color: var(--acento); }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.tabs { display: flex; gap: 8px; margin-bottom: 18px; }
.tab { border: 1px solid var(--linea); background: #fff; padding: 10px 18px; border-radius: 10px; font-weight: 600; color: var(--gris); }
.tab.activo { background: var(--acento); color: #fff; border-color: var(--acento); }
.dropzone { display: flex !important; flex-direction: column; align-items: center; gap: 8px; border: 2px dashed #cbd5e1; border-radius: 14px; padding: 40px; text-align: center; background: #fafbff; }
.dropzone input { display: none; }
.dz-ico { font-size: 34px; }
.dz-titulo { color: var(--tinta-2); font-weight: 500; }

.exito { width: 80px; height: 80px; border-radius: 50%; background: #ecfdf5; color: #059669; font-size: 40px; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; }
.exito.espera { background: #fffbeb; color: #d97706; }
.exito.error { background: #fef2f2; color: #dc2626; }
.link-box { display: flex; gap: 10px; background: #fff; border: 1px solid var(--linea); padding: 8px; border-radius: 12px; margin: 20px auto; max-width: 560px; }
.link-box input { flex: 1; border: none; background: transparent; padding: 10px; font-size: 15px; color: var(--acento); }
.acciones-listo { display: flex; gap: 12px; justify-content: center; margin-bottom: 26px; }
.aviso-privado { background: #fffbeb; border: 1px solid #fde68a; border-radius: 12px; padding: 16px; font-size: 14px; color: #92400e; word-break: break-all; }

/* ============ CV base ============ */
.pagina-cv { background: #eef0f4; }
.cv {
  --acento: #2563eb;
  min-height: 100vh; background: #fff; color: var(--tinta);
  padding-bottom: 0;
}
.cv a { color: inherit; }
.cv-nav { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linea); }
.cv-nav-inner { max-width: 900px; margin: 0 auto; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.cv-nav-marca { font-family: "Sora"; font-weight: 800; color: var(--acento); }
.cv-nav-links { display: flex; gap: 18px; flex-wrap: wrap; }
.cv-nav-links a { font-size: 14px; color: var(--tinta-2); font-weight: 500; padding-bottom: 2px; border-bottom: 2px solid transparent; }
.cv-nav-links a:hover, .cv-nav-links a.activo { color: var(--acento); border-color: var(--acento); }
.cv-main { max-width: 900px; margin: 0 auto; padding: 10px 24px 0; }
.cv-sec { padding: 34px 0; border-bottom: 1px solid #f1f3f6; }
.cv-sec-titulo { font-size: 15px; letter-spacing: .12em; text-transform: uppercase; color: var(--acento); font-weight: 700; margin-bottom: 20px; display: flex; align-items: center; gap: 10px; }
.cv-hero { padding: 56px 24px 20px; }
.cv-hero-inner { max-width: 900px; margin: 0 auto; display: flex; gap: 28px; align-items: center; }
.cv-foto { flex: 0 0 auto; width: 128px; height: 128px; border-radius: 50%; overflow: hidden; background: color-mix(in srgb, var(--acento) 12%, #fff); display: flex; align-items: center; justify-content: center; border: 3px solid var(--acento); }
.cv-foto img { width: 100%; height: 100%; object-fit: cover; }
.cv-iniciales { font-family: "Sora"; font-weight: 800; font-size: 44px; color: var(--acento); }
.cv-nombre { font-size: 42px; font-weight: 800; letter-spacing: -.02em; margin-bottom: 4px; }
.cv-titulo { color: var(--acento); font-weight: 600; font-size: 18px; margin-bottom: 16px; }
.cv-contacto-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cv-chip { display: inline-flex; align-items: center; gap: 7px; background: var(--gris-fondo); border: 1px solid var(--linea); padding: 6px 12px; border-radius: 999px; font-size: 13.5px; color: var(--tinta-2); }
.cv-chip-ico { font-size: 13px; }
.cv-resumen { font-size: 17px; color: var(--tinta-2); }
.item { position: relative; padding: 0 0 22px 26px; border-left: 2px solid var(--linea); }
.item:last-child { padding-bottom: 4px; border-left-color: transparent; }
.item::before { content: ""; position: absolute; left: -8px; top: 4px; width: 14px; height: 14px; border-radius: 50%; background: var(--acento); border: 3px solid #fff; }
.item-cab { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; align-items: baseline; }
.item-cab h3 { font-size: 17px; margin: 0; }
.item-fechas { color: var(--gris); font-size: 13.5px; white-space: nowrap; }
.item-sub { color: var(--acento); font-weight: 600; font-size: 14.5px; margin-top: 2px; }
.item-sub .punto { color: var(--gris); margin: 0 6px; }
.item p { margin: 8px 0 0; color: var(--tinta-2); font-size: 15px; }
.skill { margin-bottom: 16px; }
.skill-top { display: flex; justify-content: space-between; font-weight: 600; font-size: 15px; margin-bottom: 6px; }
.skill-bar { height: 9px; background: #eef0f4; border-radius: 6px; overflow: hidden; }
.skill-bar span { display: block; height: 100%; background: var(--acento); border-radius: 6px; }
.cv-skills { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 30px; }
.cv-proyectos { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.proyecto { border: 1px solid var(--linea); border-radius: 12px; padding: 18px; }
.proyecto p { font-size: 14px; }
.proyecto-url { color: var(--acento); font-size: 13px; word-break: break-all; }
.cv-extra-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.idioma { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid #f1f3f6; }
.idioma-nivel { color: var(--gris); font-size: 14px; }
.curso { padding: 7px 0; font-size: 14.5px; }
.curso-anio { color: var(--gris); margin-left: 6px; }
.punto { color: var(--gris); }
.cv-contacto { text-align: center; border-bottom: none; }
.cv-contacto .cv-sec-titulo { justify-content: center; }
.cv-contacto-botones { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.cv-btn { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--linea); padding: 12px 20px; border-radius: 10px; font-weight: 600; }
.cv-btn.wa { background: #25d366; color: #fff; border-color: #25d366; }
.cv-footer { background: var(--gris-fondo); padding: 26px 24px; margin-top: 30px; }
.cv-footer-inner { max-width: 900px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.cv-footer-txt { margin: 0; font-size: 14px; }
.cv-footer-micro { margin: 2px 0 0; font-size: 12px; color: var(--gris); }
.cv-footer-acciones { display: flex; align-items: center; gap: 12px; }
.cv-qr { width: 62px; height: 62px; border: 1px solid var(--linea); border-radius: 8px; background: #fff; }
.cv-mini { border: 1px solid var(--linea); background: #fff; padding: 8px 14px; border-radius: 8px; font-size: 13px; font-weight: 600; }

/* ============ Editor ============ */
.ed-toolbar { position: sticky; top: 0; z-index: 60; background: #0f172a; color: #fff; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; padding: 12px 20px; }
.ed-grupo { display: flex; align-items: center; gap: 8px; }
.ed-grupo.derecha { margin-left: auto; }
.ed-titulo { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: #94a3b8; }
.ed-btn { background: #1e293b; border: 1px solid #334155; color: #e2e8f0; padding: 8px 13px; border-radius: 8px; font-size: 13px; font-weight: 600; }
.ed-btn:hover { background: #334155; }
.ed-btn.primario { background: var(--acento); border-color: var(--acento); color: #fff; }
.ed-toolbar select, .ed-toolbar input[type=color] { background: #1e293b; color: #fff; border: 1px solid #334155; border-radius: 8px; padding: 7px; }
.ed-toolbar input[type=color] { width: 40px; height: 36px; padding: 2px; }
.ed-estado { font-size: 12.5px; color: #4ade80; }
.ed-estado.guardando { color: #facc15; }
.ed-ayuda { background: #1d4ed8; color: #dbeafe; font-size: 13px; text-align: center; margin: 0; padding: 8px 16px; }
.en-edicion [contenteditable] { outline: none; border-radius: 4px; transition: background .15s; }
.en-edicion [contenteditable]:hover { background: color-mix(in srgb, var(--acento) 8%, transparent); }
.en-edicion [contenteditable]:focus { background: color-mix(in srgb, var(--acento) 12%, transparent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--acento) 40%, transparent); }
.add-btn { border: none; background: var(--acento); color: #fff; width: 26px; height: 26px; border-radius: 8px; font-size: 17px; line-height: 1; }
.del-btn { position: absolute; top: -6px; right: 0; border: none; background: #fee2e2; color: #dc2626; width: 24px; height: 24px; border-radius: 7px; font-size: 12px; }
.item-mover { position: absolute; top: -6px; right: 30px; display: flex; gap: 3px; }
.item-mover button { border: none; background: #eef0f4; color: var(--tinta-2); width: 24px; height: 24px; border-radius: 7px; }
.skill-range { width: 100%; margin-top: 8px; }
.skill, .idioma, .curso, .proyecto { position: relative; }

/* ============ Temas ============ */
/* Minimalista (default base ya es sobrio) */
.tema-minimalista .cv-sec-titulo { color: var(--tinta-2); border-bottom: 1px solid var(--linea); padding-bottom: 10px; letter-spacing: .16em; }
.tema-minimalista .cv-hero { text-align: left; }
.tema-minimalista .cv-nav-marca { color: var(--tinta); }

/* Corporativo */
.tema-corporativo { --radio: 4px; }
.tema-corporativo .cv-hero { background: linear-gradient(120deg, #0f172a, #1e3a8a); color: #fff; padding: 60px 24px 40px; }
.tema-corporativo .cv-hero .cv-titulo { color: #93c5fd; }
.tema-corporativo .cv-hero .cv-chip { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.2); color: #e2e8f0; }
.tema-corporativo .cv-foto { border-color: #93c5fd; background: rgba(255,255,255,.08); }
.tema-corporativo .cv-iniciales { color: #fff; }
.tema-corporativo .cv-sec-titulo { color: #1e3a8a; border-bottom: 2px solid #1e3a8a; padding-bottom: 8px; }
.tema-corporativo .item::before { border-radius: 3px; }
.tema-corporativo .cv-nav { border-bottom: 3px solid var(--acento); }

/* Visual */
.tema-visual { background: #faf9ff; }
.tema-visual .cv-hero { background: linear-gradient(135deg, color-mix(in srgb, var(--acento) 92%, #000), color-mix(in srgb, var(--acento) 45%, #7c3aed)); color: #fff; padding: 70px 24px 46px; border-radius: 0 0 36px 36px; }
.tema-visual .cv-hero .cv-titulo { color: rgba(255,255,255,.9); }
.tema-visual .cv-hero .cv-chip { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.25); color: #fff; }
.tema-visual .cv-foto { border-color: #fff; background: rgba(255,255,255,.15); }
.tema-visual .cv-iniciales { color: #fff; }
.tema-visual .cv-sec-titulo { color: var(--acento); }
.tema-visual .proyecto { box-shadow: 0 8px 24px rgba(76,29,149,.08); border-color: transparent; background: #fff; }
.tema-visual .cv-nav { background: rgba(250,249,255,.9); }
.tema-visual .skill-bar span { background: linear-gradient(90deg, var(--acento), #7c3aed); }

/* Colorido */
.tema-colorido { background: #fffdf7; }
.tema-colorido .cv-hero { background: linear-gradient(135deg, #fef3c7, #dbeafe); padding: 56px 24px 30px; }
.tema-colorido .cv-foto { border-color: var(--acento); background: #fff; }
.tema-colorido .cv-sec-titulo { background: var(--acento); color: #fff; padding: 7px 14px; border-radius: 999px; display: inline-flex; }
.tema-colorido .item::before { background: #f59e0b; }
.tema-colorido .cv-btn.wa { background: #16a34a; border-color: #16a34a; }
.tema-colorido .cv-footer { background: #fff7ed; }

/* ============ Modo oscuro ============ */
.modo-oscuro { --tinta: #f1f5f9; --tinta-2: #cbd5e1; --gris: #94a3b8; --linea: #334155; --gris-fondo: #1e293b; background: #0f172a; color: #f1f5f9; }
.modo-oscuro .cv-nav { background: rgba(15,23,42,.9); border-color: #1e293b; }
.modo-oscuro .cv-sec { border-color: #1e293b; }
.modo-oscuro .item::before { border-color: #0f172a; }
.modo-oscuro .skill-bar { background: #334155; }
.modo-oscuro .proyecto, .modo-oscuro .cv-chip { background: #1e293b; border-color: #334155; }
.modo-oscuro .cv-hero { background: #0b1120; }
.modo-oscuro.tema-visual .cv-hero, .modo-oscuro.tema-corporativo .cv-hero { background: linear-gradient(120deg, #0b1120, #1e3a8a); }
.modo-oscuro.tema-colorido .cv-hero { background: linear-gradient(135deg, #3b0764, #1e3a8a); }
.modo-oscuro .cv-footer { background: #0b1120; }

/* ============ Responsive ============ */
@media (max-width: 820px) {
  .hero-inner { grid-template-columns: 1fr; }
  .hero h1 { font-size: 40px; }
  .hero-mock { order: -1; }
  .pasos, .features { grid-template-columns: 1fr; }
  .cv-skills, .cv-proyectos, .cv-extra-grid, .grid-2 { grid-template-columns: 1fr; }
  .cv-hero-inner { flex-direction: column; text-align: center; }
  .cv-contacto-chips { justify-content: center; }
  .cv-nombre { font-size: 32px; }
  .ed-grupo.derecha { margin-left: 0; }
}

/* ============ Impresión ============ */


/* ============ Admin ============ */
.pagina-admin { background: var(--gris-fondo); }
.admin-nav { background: #0f172a; color: #fff; }
.admin-nav .nav-inner { height: 64px; }
.admin-nav .logo, .admin-nav a { color: #fff; }
.admin-nav .logo small { color: #94a3b8; font-size: 12px; font-weight: 500; margin-left: 6px; }
.admin-buscar { display: flex; gap: 8px; }
.admin-buscar input { border-radius: 8px; border: 1px solid #334155; background: #1e293b; color: #fff; padding: 8px 12px; min-width: 260px; }
.admin-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 34px; }
.stat { background: #fff; border: 1px solid var(--linea); border-radius: 12px; padding: 18px; font-size: 13px; color: var(--gris); }
.stat span { display: block; font-family: "Sora"; font-size: 30px; font-weight: 800; color: var(--tinta); }
.tabla-wrap { overflow-x: auto; background: #fff; border: 1px solid var(--linea); border-radius: 12px; }
.tabla { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabla th, .tabla td { text-align: left; padding: 12px 14px; border-bottom: 1px solid #f1f3f6; vertical-align: middle; }
.tabla th { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--gris); }
.tabla tr:last-child td { border-bottom: none; }
.tabla a { color: var(--acento); font-weight: 600; }
.pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #eef0f4; color: var(--tinta-2); }
.pill.pagado, .pill.publicado { background: #dcfce7; color: #166534; }
.pill.pendiente, .pill.borrador { background: #fef3c7; color: #92400e; }
.pill.manual_revision { background: #dbeafe; color: #1e40af; }
.pill.rechazado { background: #fee2e2; color: #991b1b; }
.acciones { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.acciones form { display: inline; }
@media (max-width: 820px) { .admin-stats { grid-template-columns: 1fr 1fr; } }

/* ============ Nivel IA ============ */
.nivel-ia { margin: 0 0 22px; }
.nivel-titulo { font-weight: 700; font-size: 15px; margin-bottom: 12px; }
.nivel-opciones { display: grid; gap: 10px; }
.nivel-op { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--linea);
  border-radius: 12px; padding: 14px 16px; cursor: pointer; background: #fcfcfd; margin: 0; }
.nivel-op:hover { border-color: var(--acento); }
.nivel-op input { margin-top: 4px; accent-color: var(--acento); }
.nivel-op b { display: block; font-size: 15px; }
.nivel-op small { display: block; color: var(--gris); font-size: 13px; line-height: 1.4; }
.nivel-op:has(input:checked) { border-color: var(--acento); background: color-mix(in srgb, var(--acento) 5%, #fff); box-shadow: 0 0 0 2px color-mix(in srgb, var(--acento) 22%, transparent); }

/* ============ Efectos dinamicos (web feel) ============ */
.reveal { opacity: 0; transform: translateY(26px);
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.visible { opacity: 1; transform: none; }
.reveal.d1 { transition-delay: .07s; }
.reveal.d2 { transition-delay: .14s; }
.reveal.d3 { transition-delay: .21s; }

.cv-hero-inner { animation: cvFade .9s cubic-bezier(.2,.7,.2,1) both; }
@keyframes cvFade { from { opacity:0; transform: translateY(18px); } to { opacity:1; transform:none; } }
.cv-foto { transition: transform .4s cubic-bezier(.2,.7,.2,1); }
.cv-foto:hover { transform: scale(1.05) rotate(-1.5deg); }
.cv-nombre { background-size: 200% auto; }
.tema-visual .cv-nombre { background-image: linear-gradient(100deg,#fff,rgba(255,255,255,.75)); -webkit-background-clip: text; background-clip: text; color: transparent; }

.cv-chip { transition: transform .2s, border-color .2s, background .2s, box-shadow .2s; }
.cv-chip:hover { transform: translateY(-2px); border-color: var(--acento); box-shadow: 0 8px 18px rgba(2,6,23,.08); }
.tema-visual .cv-hero .cv-chip { backdrop-filter: blur(6px); }
.tema-visual .cv-hero .cv-chip:hover { background: rgba(255,255,255,.3); border-color: #fff; }

.cv .item { transition: background .25s, transform .25s, padding-left .25s; border-radius: 10px; }
.cv .item:hover { background: color-mix(in srgb, var(--acento) 6%, transparent); transform: translateX(3px); }
.cv .item::before { transition: box-shadow .3s, transform .3s; }
.cv .item:hover::before { transform: scale(1.25); box-shadow: 0 0 0 6px color-mix(in srgb, var(--acento) 18%, transparent); }

.proyecto { transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s, border-color .3s; }
.proyecto:hover { transform: translateY(-6px); box-shadow: 0 20px 44px rgba(2,6,23,.13); border-color: color-mix(in srgb, var(--acento) 45%, transparent); }

.cv-btn { transition: transform .2s, box-shadow .2s, background .2s; }
.cv-btn:hover { transform: translateY(-3px); box-shadow: 0 14px 30px color-mix(in srgb, var(--acento) 28%, transparent); }
.cv-mini { transition: transform .2s, background .2s, border-color .2s; }
.cv-mini:hover { transform: translateY(-2px); border-color: var(--acento); color: var(--acento); }

.cv-nav-links a { position: relative; transition: color .2s; }
.cv-nav-links a::after { content:""; position:absolute; left:0; bottom:-3px; width:0; height:2px;
  background: var(--acento); transition: width .25s cubic-bezier(.2,.7,.2,1); }
.cv-nav-links a:hover::after, .cv-nav-links a.activo::after { width: 100%; }
.cv-nav { position: sticky; }
.cv-progress { position:absolute; left:0; bottom:-1px; height:3px; width:0;
  background: linear-gradient(90deg, var(--acento), #7c3aed); transition: width .08s linear; }

.skill-bar span { transition: width .9s cubic-bezier(.2,.7,.2,1); }
.skill:hover .skill-bar span { filter: brightness(1.12); }

.cv-sec-titulo { position: relative; }
.tema-visual .cv-nombre, .tema-corporativo .cv-nombre { letter-spacing: -.03em; }

/* Hero decorativo (visual) */
.tema-visual .cv-hero { position: relative; overflow: hidden; }
.tema-visual .cv-hero::before {
  content:""; position:absolute; width:320px; height:320px; right:-80px; top:-120px; border-radius:50%;
  background: radial-gradient(circle, rgba(255,255,255,.45), transparent 70%);
  filter: blur(10px); animation: orbFloat 11s ease-in-out infinite;
}
.tema-visual .cv-hero::after {
  content:""; position:absolute; width:240px; height:240px; left:-60px; bottom:-120px; border-radius:50%;
  background: radial-gradient(circle, rgba(124,58,237,.55), transparent 70%);
  filter: blur(20px); animation: orbFloat 14s ease-in-out infinite reverse;
}
@keyframes orbFloat { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(24px,26px) scale(1.12); } }
.tema-visual .cv-hero-inner { position: relative; z-index: 2; }

/* Foto con borde animado (visual) */
.tema-visual .cv-foto { position: relative; }
.tema-visual .cv-foto::before {
  content:""; position:absolute; inset:-4px; border-radius:50%; z-index:-1;
  background: conic-gradient(from 0deg, var(--acento), #7c3aed, #06b6d4, var(--acento));
  animation: spinBorder 6s linear infinite; opacity:.9;
}
@keyframes spinBorder { to { transform: rotate(360deg); } }

/* Boton con brillo */
.cv-btn.wa, .cv-contacto-botones .cv-btn { overflow: hidden; }
.cv-btn::after { content:""; position:absolute; top:0; left:-120%; width:60%; height:100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.35), transparent);
  transform: skewX(-20deg); transition: left .6s; }
.cv-btn { position: relative; }
.cv-btn:hover::after { left: 130%; }



/* Textura de fondo tipo web moderna */
.tema-visual { background-image: radial-gradient(circle at 1px 1px, rgba(109,40,217,.10) 1px, transparent 0); background-size: 22px 22px; }
.modo-oscuro.tema-visual { background-image: radial-gradient(circle at 1px 1px, rgba(148,163,184,.18) 1px, transparent 0); }

/* Iconos de habilidades */
.skill-top { align-items: center; gap: 9px; }
.skill-ico { width: 30px; height: 30px; flex: 0 0 auto; display: inline-flex; align-items: center;
  justify-content: center; border-radius: 9px; font-size: 16px;
  background: color-mix(in srgb, var(--acento) 13%, transparent);
  transition: transform .25s, background .25s; }
.skill:hover .skill-ico { transform: scale(1.12) rotate(-4deg); background: color-mix(in srgb, var(--acento) 22%, transparent); }
.skill-nombre { flex: 1; }
.skill-pct { color: var(--gris); font-size: 12.5px; font-weight: 700; }
.modo-oscuro .skill-ico { background: color-mix(in srgb, var(--acento) 26%, #0f172a); }

/* Acciones admin CV */
.admin-acciones-cv { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 6px; }

/* ============================================================
   PLANTILLAS v2 — 4 diagramaciones distintas
   ============================================================ */

/* ---- comun ---- */
.cv .cv-sec-titulo { display: flex; align-items: center; gap: 10px; }
.cv .cv-sec-titulo .add-btn { margin-left: auto; }
.cv .sec-perfil .cv-resumen { font-size: 16.5px; line-height: 1.75; }
.cv .item-cab h3 { font-size: 17px; }

/* ===================== 1) MINIMALISTA ===================== */
.tema-minimalista { background: #fbfbfd; }
.tpl-single { max-width: 820px; margin: 0 auto; padding: 0 24px 10px; }
.tpl-single .cv-main { max-width: none; padding: 0; }
.hero-single { text-align: center; padding: 60px 0 26px; }
.hero-single .cv-hero-inner { flex-direction: column; gap: 20px; }
.hero-single .cv-foto { width: 132px; height: 132px; border-width: 4px; }
.hero-single .cv-nombre { font-size: 46px; }
.hero-single .cv-contacto-chips { justify-content: center; }
.hero-filete { width: 56px; height: 4px; border-radius: 4px; background: var(--acento); margin: 18px auto 16px; }
.tema-minimalista .cv-sec { border-bottom: 1px solid var(--linea); padding: 34px 0; }
.tema-minimalista .cv-sec-titulo { justify-content: flex-start; color: var(--tinta); font-size: 13px; letter-spacing: .18em; }
.tema-minimalista .cv-sec-titulo::before { content: ""; width: 26px; height: 2px; background: var(--acento); display: inline-block; }
.min-dos-col { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
.min-dos-col .cv-sec { border-bottom: 1px solid var(--linea); }

/* ===================== 2) CORPORATIVO ===================== */
.tema-corporativo { background: #eef1f5; }
.corp-top { background: linear-gradient(120deg, #0b1220, #1e293b); color: #fff; padding: 46px 24px; }
.corp-top-inner { max-width: 1080px; margin: 0 auto; }
.corp-top .cv-nombre { color: #fff; font-size: 40px; margin-bottom: 4px; }
.corp-top .cv-titulo { color: color-mix(in srgb, var(--acento) 55%, #bfdbfe); font-size: 18px; margin: 0; }
.corp-grid { max-width: 1080px; margin: 0 auto; display: grid; grid-template-columns: 330px 1fr; background: #fff; box-shadow: 0 18px 50px rgba(15,23,42,.14); }
.corp-aside { background: #f1f5f9; padding: 30px 26px; border-right: 1px solid var(--linea); }
.corp-aside .cv-foto { width: 150px; height: 150px; margin: 0 auto 18px; border-width: 4px; }
.corp-aside .cv-contacto-chips { flex-direction: column; align-items: stretch; gap: 6px; }
.corp-aside .cv-chip { border-radius: 8px; justify-content: flex-start; }
.corp-lbl { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--gris); margin: 0 0 10px; }
.corp-cont { padding-bottom: 20px; border-bottom: 1px solid var(--linea); margin-bottom: 22px; }
.corp-aside .cv-sec { padding: 0 0 20px; border: none; }
.corp-aside .cv-sec-titulo { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--acento); margin-bottom: 14px; }
.corp-aside .cv-skills { grid-template-columns: 1fr; }
.corp-aside .item { padding-left: 0; border-left: none; }
.corp-aside .item::before { display: none; }
.corp-aside .idioma { border-color: #e2e8f0; }
.corp-main { padding: 36px 42px; }
.corp-main .cv-sec { padding: 0 0 30px; border-bottom: 1px solid var(--linea); margin-bottom: 28px; }
.corp-main .cv-sec:last-child { border-bottom: none; }
.corp-main .cv-sec-titulo { font-size: 15px; text-transform: uppercase; letter-spacing: .12em; color: var(--tinta); border-bottom: 2px solid var(--acento); padding-bottom: 10px; margin-bottom: 20px; }
.corp-main .cv-sec-titulo::before { content: ""; width: 8px; height: 8px; background: var(--acento); display: inline-block; transform: rotate(45deg); }

/* ===================== 3) VISUAL ===================== */
.tema-visual { background: radial-gradient(circle at 1px 1px, rgba(109,40,217,.10) 1px, transparent 0) , #f6f5fb; background-size: 22px 22px; }
.vis-hero { position: relative; overflow: hidden; color: #fff; border-radius: 0 0 44px 44px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--acento) 92%, #000), color-mix(in srgb, var(--acento) 40%, #7c3aed));
  padding: 76px 24px 64px; }
.vis-hero::before { content: ""; position: absolute; width: 360px; height: 360px; right: -90px; top: -140px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.45), transparent 70%); animation: orbFloat 11s ease-in-out infinite; }
.vis-hero::after { content: ""; position: absolute; width: 280px; height: 280px; left: -80px; bottom: -140px; border-radius: 50%;
  background: radial-gradient(circle, rgba(124,58,237,.55), transparent 70%); filter: blur(16px); animation: orbFloat 14s ease-in-out infinite reverse; }
.vis-hero-inner { position: relative; z-index: 2; max-width: 1080px; margin: 0 auto; display: flex; align-items: center; gap: 34px; }
.vis-hero .cv-foto { width: 168px; height: 168px; }
.vis-hero .cv-nombre { font-size: 50px; }
.vis-hero .cv-titulo { color: rgba(255,255,255,.92); font-size: 20px; }
.vis-hero .cv-chip { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.28); color: #fff; backdrop-filter: blur(6px); }
.vis-hero .cv-chip:hover { background: rgba(255,255,255,.32); border-color: #fff; }
.vis-grid { max-width: 1080px; margin: 0 auto; padding: 40px 24px 10px; display: grid; grid-template-columns: 1.7fr 1fr; gap: 26px; align-items: start; }
.vis-grid .cv-sec { background: #fff; border-radius: 18px; padding: 30px 32px; border: none; box-shadow: 0 16px 40px rgba(2,6,23,.07); margin-bottom: 24px; }
.vis-grid .cv-sec-titulo { color: var(--acento); font-size: 14px; letter-spacing: .1em; text-transform: uppercase; }
.vis-grid .cv-sec-titulo::before { content: ""; width: 22px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--acento), #7c3aed); }
.vis-aside .cv-skills { grid-template-columns: 1fr; }
.vis-main .cv-proyectos { grid-template-columns: 1fr; }

/* ===================== 4) COLORIDO ===================== */
.tema-colorido { background: #fffdf8; }
.col-hero { color: #fff; padding: 58px 24px; background: linear-gradient(120deg, var(--acento), color-mix(in srgb, var(--acento) 45%, #f59e0b)); border-radius: 0 0 34px 34px; }
.col-hero-inner { max-width: 1080px; margin: 0 auto; display: flex; align-items: center; gap: 28px; }
.col-hero .cv-foto { width: 150px; height: 150px; border-color: #fff; background: rgba(255,255,255,.18); }
.col-hero .cv-iniciales { color: #fff; }
.col-hero .cv-nombre { color: #fff; font-size: 42px; }
.col-hero .cv-titulo { color: rgba(255,255,255,.92); font-size: 19px; }
.col-hero .cv-chip { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.3); color: #fff; }
.col-bento { max-width: 1080px; margin: 0 auto; padding: 30px 24px 10px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; }
.col-bento .cv-sec { border-radius: 18px; padding: 24px 26px; border: 1px solid #eceae3; background: #fff; box-shadow: 0 10px 26px rgba(120,90,20,.06); margin: 0; }
.col-bento .cv-sec-titulo { display: inline-flex; background: var(--acento); color: #fff; font-size: 12.5px; letter-spacing: .06em; padding: 6px 14px; border-radius: 999px; margin-bottom: 16px; }
.col-bento #perfil.sec-perfil { grid-column: span 6; }
.col-bento #experiencia.sec-experiencia { grid-column: span 4; }
.col-bento #habilidades.sec-habilidades { grid-column: span 2; }
.col-bento #educacion.sec-educacion { grid-column: span 3; }
.col-bento #proyectos.sec-proyectos { grid-column: span 3; }
.col-bento #idiomas.sec-idiomas { grid-column: span 2; }
.col-bento #cursos.sec-cursos { grid-column: span 2; }
.col-bento #voluntariado.sec-voluntariado { grid-column: span 2; }
.col-bento #contacto.cv-contacto { grid-column: span 6; }
.col-bento #experiencia { background: color-mix(in srgb, var(--acento) 5%, #fff); }
.col-bento #habilidades { background: #fff7ed; border-color: #fed7aa; }
.col-bento #educacion { background: #eff6ff; border-color: #bfdbfe; }
.col-bento #proyectos { background: #f0fdf4; border-color: #bbf7d0; }
.col-bento #idiomas { background: #fdf4ff; border-color: #f5d0fe; }
.col-bento #cursos { background: #ecfeff; border-color: #a5f3fc; }
.col-bento #voluntariado { background: #fef2f2; border-color: #fecaca; }
.col-bento .cv-skills { grid-template-columns: 1fr; }
.col-bento .cv-proyectos { grid-template-columns: 1fr; }

/* ---- modo oscuro por plantilla ---- */
.modo-oscuro.tema-minimalista { background: #0b1120; }
.modo-oscuro.tema-corporativo { background: #0b1120; }
.modo-oscuro.tema-corporativo .corp-grid { background: #0f172a; }
.modo-oscuro.tema-corporativo .corp-aside { background: #111c30; border-color: #1e293b; }
.modo-oscuro.tema-visual { background: radial-gradient(circle at 1px 1px, rgba(148,163,184,.16) 1px, transparent 0), #0b1120; background-size: 22px 22px; }
.modo-oscuro .vis-grid .cv-sec { background: #0f172a; box-shadow: none; border: 1px solid #1e293b; }
.modo-oscuro.tema-colorido { background: #0b1120; }
.modo-oscuro .col-bento .cv-sec { background: #0f172a; border-color: #1e293b; }
.modo-oscuro .col-bento #experiencia,
.modo-oscuro .col-bento #habilidades,
.modo-oscuro .col-bento #educacion,
.modo-oscuro .col-bento #proyectos,
.modo-oscuro .col-bento #idiomas,
.modo-oscuro .col-bento #cursos,
.modo-oscuro .col-bento #voluntariado { background: #0f172a; }
.modo-oscuro .corp-top, .modo-oscuro .vis-hero, .modo-oscuro .col-hero { /* se mantienen con color */ }

/* ---- responsive ---- */
@media (max-width: 900px) {
  .corp-grid { grid-template-columns: 1fr; }
  .corp-aside { border-right: none; border-bottom: 1px solid var(--linea); }
  .corp-main { padding: 28px 24px; }
  .vis-grid { grid-template-columns: 1fr; }
  .col-bento { grid-template-columns: repeat(2, 1fr); }
  .col-bento #perfil.sec-perfil, .col-bento #experiencia.sec-experiencia, .col-bento #habilidades.sec-habilidades,
  .col-bento #educacion.sec-educacion, .col-bento #proyectos.sec-proyectos, .col-bento #idiomas.sec-idiomas,
  .col-bento #cursos.sec-cursos, .col-bento #voluntariado.sec-voluntariado, .col-bento #contacto.cv-contacto { grid-column: span 2; }
}
@media (max-width: 620px) {
  .min-dos-col { grid-template-columns: 1fr; }
  .vis-hero-inner, .col-hero-inner { flex-direction: column; text-align: center; }
  .vis-hero .cv-nombre, .col-hero .cv-nombre { font-size: 34px; }
  .vis-hero .cv-contacto-chips, .col-hero .cv-contacto-chips { justify-content: center; }
  .col-bento { grid-template-columns: 1fr; }
  .col-bento #perfil.sec-perfil, .col-bento #experiencia.sec-experiencia, .col-bento #habilidades.sec-habilidades,
  .col-bento #educacion.sec-educacion, .col-bento #proyectos.sec-proyectos, .col-bento #idiomas.sec-idiomas,
  .col-bento #cursos.sec-cursos, .col-bento #voluntariado.sec-voluntariado, .col-bento #contacto.cv-contacto { grid-column: span 1; }
}

/* Mock de la home con foto real */
.mock-card { color: inherit; transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
.mock-card:hover { transform: translateY(-6px) rotate(-1deg); box-shadow: 0 22px 50px rgba(2,6,23,.16); }
.mock-foto { overflow: hidden; }
.mock-foto img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }

/* Nav de la home en movil: ocultar links de texto, dejar logo + CTA */
@media (max-width: 760px) {
  .nav-links { gap: 10px; }
  .nav-links a:not(.btn) { display: none; }
}

/* Garantias del hero */
.hero-garantias { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 18px; font-size: 14.5px; color: var(--tinta-2); }
.hero-garantias span { display: inline-flex; align-items: center; gap: 6px; }
.hero-garantias b { color: var(--tinta); }

/* ============ Impresión (PDF) — versión limpia y compacta ============ */


/* Impresión: compactar tipografía y espaciados para evitar huecos */


/* Impresión: sin contador de visitas y crédito centrado */


/* Ejemplos de la home */
.ejemplos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ejemplo { background: #fff; border: 1px solid var(--linea); border-radius: 18px; padding: 26px; text-align: center;
  transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
.ejemplo:hover { transform: translateY(-6px); box-shadow: 0 20px 44px rgba(2,6,23,.12); }
.ejemplo-foto { width: 88px; height: 88px; border-radius: 50%; margin: 0 auto 14px; background: var(--acento);
  color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 28px; overflow: hidden; }
.ejemplo-foto img { width: 100%; height: 100%; object-fit: cover; }
.ejemplo h3 { font-size: 19px; margin-bottom: 2px; }
.ejemplo-cargo { color: var(--acento); font-weight: 600; font-size: 14px; margin: 0 0 4px; }
.ejemplo-lugar { color: var(--gris); font-size: 13.5px; margin: 0 0 16px; }
.ejemplo-acciones { display: flex; gap: 8px; justify-content: center; margin-bottom: 12px; flex-wrap: wrap; }
.ejemplo-link { font-size: 12.5px; color: var(--acento); }
.ejemplo-link:hover { text-decoration: underline; }
@media (max-width: 820px) { .ejemplos { grid-template-columns: 1fr; } }

/* Dashboard de estadisticas */
.chart { display: flex; align-items: flex-end; gap: 3px; height: 170px; background: #fff;
  border: 1px solid var(--linea); border-radius: 12px; padding: 16px 14px 30px; overflow-x: auto; }
.chart-col { flex: 1 0 12px; min-width: 12px; display: flex; flex-direction: column;
  align-items: center; justify-content: flex-end; height: 100%; position: relative; }
.chart-bar { width: 100%; max-width: 16px; min-height: 3px; border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, var(--acento), color-mix(in srgb, var(--acento) 55%, #7c3aed)); }
.chart-lbl { position: absolute; bottom: -24px; font-size: 10px; color: var(--gris); white-space: nowrap; }
.rank { list-style: none; padding: 0; margin: 0; max-width: 620px; }
.rank li { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid #f1f3f6; }
.rank-name { width: 150px; font-weight: 600; font-size: 14px; }
.rank-bar { flex: 1; height: 10px; background: #eef0f4; border-radius: 6px; overflow: hidden; }
.rank-bar i { display: block; height: 100%; border-radius: 6px; background: var(--acento); }
.rank b { width: 34px; text-align: right; font-size: 13px; }
.pagina-admin .acciones { display: flex; gap: 8px; }

/* Mock del hero: experiencia */
.mock-exp { text-align: left; margin: 14px 0; display: grid; gap: 8px; }
.mock-item { background: #f7f8fa; border: 1px solid var(--linea); border-radius: 10px; padding: 8px 11px; }
.mock-item b { display: block; font-size: 13px; color: var(--tinta); }
.mock-item span { font-size: 11.5px; color: var(--gris); }

/* Mock hero: cuerpo recortado con difuminado inferior */
.mock-body { position: relative; max-height: 122px; overflow: hidden; margin: 14px 0; }
.mock-body .mock-exp { margin: 0; }
.mock-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 62px; pointer-events: none;
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,.85) 55%, #fff 100%);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 80%);
  mask-image: linear-gradient(to bottom, transparent, #000 80%); }

/* Mock hero: mas contenido, recortado y difuminado */
.mock-body { max-height: 212px; }
.mock-mini-titulo { font-size: 10.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--gris); margin: 12px 0 6px; text-align: left; }
.mock-chips { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-start; margin: 0; }
.mock-chips span { width: auto; height: auto; background: color-mix(in srgb, var(--acento) 10%, #fff);
  color: var(--acento); font-size: 11px; font-weight: 600; padding: 4px 9px; border-radius: 999px; }

/* Mock hero: texto difuminado (vista previa bloqueada) */
.mock-body { position: relative; max-height: 190px; overflow: hidden; margin: 14px 0; }
.mock-blur { text-align: left; font-size: 12px; line-height: 1.5; color: #4b5563; filter: blur(3.6px); }
.mock-blur p { margin: 0 0 10px; }
.mock-blur b { color: #111827; }
.mock-lock { position: absolute; left: 50%; top: 44%; transform: translate(-50%, -50%);
  background: rgba(17,24,39,.82); color: #fff; font-size: 11.5px; font-weight: 700; letter-spacing: .03em;
  padding: 6px 13px; border-radius: 999px; pointer-events: none; white-space: nowrap; }

.mock-acciones { display: flex; gap: 8px; justify-content: center; margin: 4px 0 10px; flex-wrap: wrap; }

/* Tour guiado del demo */
.tour-spot { position: fixed; z-index: 9998; border-radius: 12px; pointer-events: none;
  box-shadow: 0 0 0 9999px rgba(15,23,42,.62), 0 0 0 3px var(--acento) inset;
  transition: top .25s ease, left .25s ease, width .25s ease, height .25s ease; }
.tour-card { position: fixed; z-index: 9999; width: 316px; background: #fff; color: #111827;
  border-radius: 14px; padding: 18px 20px 20px; box-shadow: 0 24px 60px rgba(2,6,23,.35);
  position: fixed; }
.tour-card h4 { margin: 0 0 6px; font-size: 16px; padding-right: 40px; }
.tour-card p { margin: 0 0 14px; font-size: 14px; color: #374151; line-height: 1.5; }
.tour-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.tour-progress { position: absolute; top: 16px; right: 16px; font-size: 11px; color: #9ca3af; }

/* Tour: barra de progreso */
.tour-bar { height: 5px; background: #eef0f4; border-radius: 999px; overflow: hidden; margin: 2px 0 14px; }
.tour-bar span { display: block; height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, var(--acento), #7c3aed); transition: width .3s ease; }

/* ============================================================
   MÁS MOVIMIENTO (home + CV) — estilo web moderna
   ============================================================ */
.reveal { opacity: 0; transform: translateY(28px);
  transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.visible { opacity: 1; transform: none; }
.reveal-titulo { transform: translateY(18px) scale(.98); }

/* Hero con brillo giratorio */
.hero { position: relative; overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: -30%; z-index: 0;
  background: conic-gradient(from 0deg, transparent, color-mix(in srgb, var(--acento) 12%, transparent), transparent 45%);
  animation: spinSlow 26s linear infinite; }
.hero > .contenedor, .hero .hero-inner { position: relative; z-index: 1; }
@keyframes spinSlow { to { transform: rotate(360deg); } }

/* Titulo con degradado animado */
.grad { background: linear-gradient(100deg, var(--acento), #7c3aed, #06b6d4, var(--acento));
  background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: gradMove 7s linear infinite; }
@keyframes gradMove { to { background-position: 300% 50%; } }

/* Subrayado animado en titulos de seccion de la home */
.seccion h2 { position: relative; }
.seccion h2::after { content: ""; display: block; width: 68px; height: 4px; border-radius: 4px;
  margin: 12px auto 0; background: linear-gradient(90deg, var(--acento), #7c3aed);
  transform: scaleX(0); transform-origin: center; transition: transform .6s cubic-bezier(.2,.7,.2,1) .15s; }
.seccion h2.visible::after { transform: scaleX(1); }

/* Tarjetas con reaccion */
.feature, .paso, .precio-card { transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s, border-color .3s; }
.feature:hover, .paso:hover { transform: translateY(-7px); box-shadow: 0 20px 46px rgba(2,6,23,.1);
  border-color: color-mix(in srgb, var(--acento) 40%, transparent); }
.precio-card:hover { transform: translateY(-7px); box-shadow: 0 28px 64px rgba(2,6,23,.16); }
.feature .ico { transition: transform .3s; display: inline-block; }
.feature:hover .ico { transform: scale(1.18) rotate(-6deg); }
.paso .num { transition: transform .3s; }
.paso:hover .num { transform: translateY(-3px) scale(1.08); }

/* Botones con brillo */
.btn-primario { position: relative; overflow: hidden; }
.btn-primario::after { content: ""; position: absolute; top: 0; left: -120%; width: 60%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.4), transparent);
  transform: skewX(-20deg); transition: left .6s; }
.btn-primario:hover::after { left: 130%; }

/* Links de la nav con subrayado */
.nav-links a:not(.btn) { position: relative; }
.nav-links a:not(.btn)::after { content: ""; position: absolute; left: 0; bottom: -4px; width: 0; height: 2px;
  background: var(--acento); transition: width .25s cubic-bezier(.2,.7,.2,1); }
.nav-links a:not(.btn):hover::after { width: 100%; }

/* Badge y mock flotando */
.badge { animation: floatY 4.5s ease-in-out infinite; }
.hero-mock { animation: floatY 7s ease-in-out infinite; }
@keyframes floatY { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* ===== CV: mas vida ===== */
.vis-hero, .col-hero, .corp-top { background-size: 220% 220% !important; animation: gradPan 14s ease infinite; }
@keyframes gradPan { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.tema-colorido .cv-nombre, .tema-corporativo .cv-nombre { background: linear-gradient(100deg, #fff, rgba(255,255,255,.72));
  -webkit-background-clip: text; background-clip: text; color: transparent; }
.cv-foto { box-shadow: 0 10px 30px color-mix(in srgb, var(--acento) 28%, transparent); }
.cv-proyectos .proyecto, .col-bento .cv-sec, .vis-grid .cv-sec { transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s, border-color .3s; }

@media (prefers-reduced-motion: reduce) {
  .hero::before, .grad, .badge, .hero-mock, .vis-hero, .col-hero, .corp-top { animation: none !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}

/* QR descargable */
.cv-qr-link { display: inline-flex; }
.cv-qr-link:hover .cv-qr { transform: scale(1.06); box-shadow: 0 8px 20px rgba(2,6,23,.15); }
.cv-qr { transition: transform .25s, box-shadow .25s; }

/* CV móvil: barra superior compacta (una sola línea, links deslizables) */
@media (max-width: 640px) {
  .cv-nav-inner { padding: 5px 12px; gap: 10px; }
  .cv-nav-marca { font-size: 12.5px; }
  .cv-nav-links { flex: 1; min-width: 0; justify-content: flex-end; gap: 13px;
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
  .cv-nav-links::-webkit-scrollbar { display: none; }
  .cv-nav-links a { font-size: 11.5px; white-space: nowrap; padding-bottom: 0; }
  .cv-nav-links a::after { display: none; }
  .cv-progress { height: 2px; }
}

/* ============================================================
   Movimiento distinto en cada plantilla
   ============================================================ */

/* 1) Minimalista: aurora que se desplaza suavemente */
.tema-minimalista .hero-single { position: relative; overflow: hidden; }
.tema-minimalista .hero-single::before { content: ""; position: absolute; inset: -40%; z-index: 0; pointer-events: none;
  background: radial-gradient(circle at 30% 30%, color-mix(in srgb, var(--acento) 16%, transparent), transparent 55%),
              radial-gradient(circle at 75% 65%, color-mix(in srgb, #7c3aed 13%, transparent), transparent 55%);
  animation: driftAurora 20s ease-in-out infinite; }
.tema-minimalista .hero-single .cv-hero-inner { position: relative; z-index: 1; }
@keyframes driftAurora { 0%, 100% { transform: translate(-3%, -2%) scale(1); } 50% { transform: translate(4%, 3%) scale(1.12); } }

/* 2) Corporativo: barrido de luz diagonal */
.tema-corporativo .corp-top { position: relative; overflow: hidden; }
.tema-corporativo .corp-top::before { content: ""; position: absolute; top: -20%; bottom: -20%; width: 45%; left: -50%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.10), transparent);
  transform: skewX(-18deg); animation: lightSweep 7s ease-in-out infinite; pointer-events: none; }
.tema-corporativo .corp-top-inner { position: relative; z-index: 1; }
@keyframes lightSweep { 0% { left: -50%; } 55%, 100% { left: 130%; } }

/* 3) Visual: resplandor giratorio (como la home) */
.vis-hero .vis-spin { position: absolute; inset: -30%; z-index: 0; pointer-events: none; opacity: .7;
  background: conic-gradient(from 0deg, transparent, color-mix(in srgb, #fff 22%, transparent), transparent 40%);
  animation: spinSlow 22s linear infinite; }
.tema-visual .cv-hero-inner, .vis-hero-inner { position: relative; z-index: 2; }

/* 4) Colorido: burbujas flotantes */
.tema-colorido .col-hero { position: relative; overflow: hidden; }
.tema-colorido .col-hero::before, .tema-colorido .col-hero::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; filter: blur(6px); }
.tema-colorido .col-hero::before { width: 240px; height: 240px; right: -60px; top: -80px;
  background: radial-gradient(circle, rgba(255,255,255,.35), transparent 70%); animation: floatY 9s ease-in-out infinite; }
.tema-colorido .col-hero::after { width: 200px; height: 200px; left: -50px; bottom: -90px;
  background: radial-gradient(circle, rgba(253,224,71,.5), transparent 70%); animation: floatY 12s ease-in-out infinite reverse; }
.col-hero-inner { position: relative; z-index: 1; }

@media (prefers-reduced-motion: reduce) {
  .tema-minimalista .hero-single::before, .tema-corporativo .corp-top::before,
  .vis-hero .vis-spin, .tema-colorido .col-hero::before, .tema-colorido .col-hero::after { animation: none !important; }
}

/* ============================================================
   Tipografía formal para los currículums (Helvetica + nombre serif)
   ============================================================ */
.cv, .cv button, .cv input, .cv select, .cv textarea {
  font-family: "Helvetica Neue", Helvetica, Arial, "Segoe UI", Roboto, sans-serif;
}
.cv h1, .cv h2, .cv h3,
.cv .cv-sec-titulo, .cv .cv-nav-marca, .cv .cv-iniciales, .cv .cv-titulo {
  font-family: "Helvetica Neue", Helvetica, Arial, "Segoe UI", Roboto, sans-serif;
}
.cv .cv-nombre {
  font-family: "Libre Baskerville", Georgia, "Times New Roman", serif;
  font-weight: 700;
  letter-spacing: -.01em;
}
.cv .item-cab h3 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }

/* CV móvil: sin desvanecido en los bordes y sin el nombre (solo secciones) */
@media (max-width: 640px) {
  .cv-nav-marca { display: none !important; }
  .cv-nav-links { justify-content: center; mask-image: none !important; -webkit-mask-image: none !important;
    overflow-x: auto; padding: 0 2px; }
}

@media (max-width: 640px) {
  .cv-nav-links { justify-content: flex-start !important; }
}

/* Pie del CV en móvil: que no se desborde */
.cv-footer-acciones { flex-wrap: wrap; }
@media (max-width: 640px) {
  .cv-footer-inner { flex-direction: column; align-items: center; gap: 12px; text-align: center; }
  .cv-footer-acciones { justify-content: center; gap: 8px; }
  .cv-mini { font-size: 12px; padding: 7px 11px; }
  .cv-qr { width: 54px; height: 54px; }
}

/* ============================================================
   Tipografías seleccionables
   ============================================================ */
.cv { --ft-titulo: "Helvetica Neue", Helvetica, Arial, sans-serif;
      --ft-texto: "Helvetica Neue", Helvetica, Arial, sans-serif; }
.fuente-helvetica { --ft-titulo: "Helvetica Neue", Helvetica, Arial, sans-serif;
                    --ft-texto: "Helvetica Neue", Helvetica, Arial, sans-serif; }
.fuente-clasica { --ft-titulo: "Libre Baskerville", Georgia, "Times New Roman", serif;
                  --ft-texto: "Source Serif 4", Georgia, serif; }
.fuente-moderna { --ft-titulo: "Sora", "Inter", sans-serif;
                  --ft-texto: "Inter", system-ui, sans-serif; }
.fuente-elegante { --ft-titulo: "Playfair Display", Georgia, serif;
                   --ft-texto: "Inter", system-ui, sans-serif; }

.cv, .cv button, .cv input, .cv select, .cv textarea { font-family: var(--ft-texto); }
.cv h1, .cv h2, .cv h3, .cv .cv-sec-titulo, .cv .cv-nav-marca, .cv .cv-iniciales,
.cv .cv-titulo, .cv .cv-nombre { font-family: var(--ft-titulo); }
.cv .item-cab h3 { font-family: var(--ft-texto); }

/* Contacto: en pantalla botones, en PDF los datos reales */
.cv-contacto-print { display: none; }


@media (max-width: 640px) {
  .cv-footer { padding: 20px 14px; }
  .cv-footer-acciones { width: 100%; }
}

/* Contacto en móvil: botones flexibles para que no desborden */
@media (max-width: 640px) {
  .cv-contacto-botones { gap: 8px; }
  .cv-btn { padding: 10px 13px; font-size: 13px; max-width: 100%;
    overflow-wrap: anywhere; word-break: break-word; }
}
.cv-btn { max-width: 100%; }

/* CV móvil: barra en varios renglones + resaltar sección activa */
@media (max-width: 640px) {
  .cv-nav-inner { flex-wrap: nowrap; }
  .cv-nav-links { flex-wrap: wrap !important; overflow: visible !important; justify-content: center !important;
    gap: 5px 14px !important; row-gap: 5px !important; padding: 3px 2px; }
  .cv-nav-links a { font-size: 11.5px; }
  .cv-nav-links a::after { display: block !important; bottom: -3px; }
  .cv-nav-links a.activo { color: var(--acento) !important; font-weight: 700; }
  .cv-nav-links a.activo::after { width: 100% !important; }
}

/* Minimalista: sin movimiento en el hero (sin aurora), pero con hovers/reveals */
.tema-minimalista .hero-single::before { display: none !important; animation: none !important; }

/* Barra del editor en móvil: que no desborde */
@media (max-width: 700px) {
  .ed-toolbar { gap: 8px; padding: 10px 12px; }
  .ed-grupo { flex-wrap: wrap; }
  .ed-grupo.derecha { margin-left: 0 !important; }
  .ed-toolbar select { max-width: 150px; font-size: 12px; }
  .ed-btn { font-size: 12px; padding: 7px 10px; }
  .ed-colores { flex-wrap: wrap; }
  .color-swatch { width: 22px; height: 22px; }
}

/* ============================================================
   Plantillas formales nuevas
   ============================================================ */

/* ---- Clásico: centrado, reglas, tradicional ---- */
.tema-clasico { background: #fff; }
.tpl-clasico { max-width: 800px; margin: 0 auto; padding: 0 24px 10px; }
.cla-head { text-align: center; padding: 54px 0 22px; border-bottom: 3px double #cbd5e1; }
.cla-head .cv-nombre { font-size: 40px; letter-spacing: .01em; }
.cla-head .cv-titulo { color: var(--acento); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: 13.5px; margin: 8px 0 14px; }
.cla-head .cv-contacto-chips { justify-content: center; }
.cla-head .cv-chip { background: transparent; border: none; padding: 0 8px; }
.cla-main .cv-sec { padding: 22px 0; border-bottom: 1px solid #e5e7eb; }
.cla-main .cv-sec-titulo { justify-content: center; font-size: 13px; text-transform: uppercase; letter-spacing: .2em; color: var(--tinta); }
.cla-main .cv-sec-titulo::before, .cla-main .cv-sec-titulo::after { content: ""; width: 28px; height: 1px; background: #cbd5e1; }
.cla-main .item { border-left: none; padding-left: 0; }
.cla-main .item::before { display: none; }
.cla-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
.cla-dos .cv-sec { border-bottom: 1px solid #e5e7eb; }

/* ---- Ejecutivo: header con foto a la derecha + aside ---- */
.tema-ejecutivo { background: #fff; }
.eje-head { border-bottom: 4px solid var(--acento); }
.eje-head-inner { max-width: 1040px; margin: 0 auto; padding: 40px 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.eje-head .cv-nombre { font-size: 38px; margin: 0; }
.eje-head .cv-titulo { color: var(--acento); font-weight: 600; font-size: 17px; margin: 6px 0 0; }
.eje-head .cv-foto { width: 120px; height: 120px; border-width: 3px; }
.eje-grid { max-width: 1040px; margin: 0 auto; display: grid; grid-template-columns: 1fr 300px; }
.eje-main { padding: 30px 34px 10px 24px; }
.eje-aside { border-left: 1px solid var(--linea); padding: 30px 24px; background: #fafafa; }
.eje-lbl { font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: var(--gris); margin: 0 0 10px; }
.eje-cont { padding-bottom: 18px; border-bottom: 1px solid var(--linea); margin-bottom: 20px; }
.eje-aside .cv-chip { border-radius: 8px; justify-content: flex-start; }
.eje-aside .cv-sec { padding: 0 0 18px; border: none; }
.eje-aside .cv-sec-titulo { font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: var(--acento); }
.eje-aside .cv-skills { grid-template-columns: 1fr; }
.eje-main .cv-sec { padding-bottom: 26px; border-bottom: 1px solid var(--linea); margin-bottom: 24px; }
.eje-main .cv-sec:last-child { border-bottom: none; }
.eje-main .cv-sec-titulo { color: var(--tinta); border-bottom: 2px solid var(--acento); padding-bottom: 8px; }

/* ---- Editorial: masthead grande + dos columnas ---- */
.tema-editorial { background: #fff; }
.tpl-editorial { max-width: 1040px; margin: 0 auto; padding: 0 24px 10px; }
.edi-masthead { padding: 52px 0 20px; border-bottom: 3px solid var(--tinta); }
.edi-kicker { display: block; font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: var(--acento); margin-bottom: 10px; }
.edi-masthead .cv-nombre { font-size: 52px; line-height: 1; margin: 0; letter-spacing: -.02em; }
.edi-masthead .cv-titulo { font-size: 18px; color: var(--gris); margin: 12px 0 0; }
.edi-grid { display: grid; grid-template-columns: 300px 1fr; gap: 40px; padding-top: 28px; }
.edi-izq .cv-foto { width: 150px; height: 150px; margin-bottom: 16px; }
.edi-izq .cv-contacto-chips { flex-direction: column; align-items: flex-start; gap: 6px; }
.edi-izq .cv-chip { background: transparent; border: none; padding: 0; }
.edi-izq .cv-sec { padding: 16px 0; border-top: 1px solid var(--linea); border-bottom: none; }
.edi-izq .cv-skills { grid-template-columns: 1fr; }
.edi-der .cv-sec { padding: 0 0 26px; border-bottom: 1px solid var(--linea); margin-bottom: 24px; }
.edi-der .cv-sec:last-child { border-bottom: none; }
.edi-der .cv-sec-titulo { color: var(--acento); }

/* ---- Compacto: dos columnas densas ---- */
.tema-compacto { background: #fff; }
.tpl-compacto { max-width: 1000px; margin: 0 auto; padding: 0 22px 10px; }
.cmp-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; padding: 36px 0 16px; border-bottom: 2px solid var(--tinta); }
.cmp-head .cv-nombre { font-size: 34px; margin: 0; }
.cmp-head .cv-titulo { color: var(--acento); font-weight: 600; margin: 0; }
.cmp-head .cv-contacto-chips { width: 100%; }
.cmp-grid { column-count: 2; column-gap: 42px; padding-top: 20px; }
.cmp-grid .cv-sec { break-inside: avoid; padding: 0 0 18px; border: none; }
.cmp-grid .cv-sec-titulo { font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--acento); border-bottom: 1px solid var(--linea); padding-bottom: 6px; }
.cmp-grid .cv-skills { grid-template-columns: 1fr; }
.cmp-grid .item { padding: 0 0 12px 16px; }

/* ---- Académico: encabezado centrado, filas ---- */
.tema-academico { background: #fff; }
.tpl-academico { max-width: 820px; margin: 0 auto; padding: 0 24px 10px; }
.aca-head { text-align: center; padding: 50px 0 18px; }
.aca-head .cv-nombre { font-size: 38px; }
.aca-head .cv-titulo { color: var(--tinta-2); margin: 4px 0 12px; }
.aca-head .cv-contacto-chips { justify-content: center; }
.aca-main .cv-sec { padding: 20px 0; border-top: 1px solid #e2e8f0; }
.aca-main .cv-sec-titulo { font-size: 13px; text-transform: uppercase; letter-spacing: .14em; color: var(--tinta); border-left: 4px solid var(--acento); padding-left: 10px; }
.aca-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; }
.aca-main .item { border-left: none; padding-left: 0; }
.aca-main .item::before { display: none; }

/* ---- Responsive de las nuevas ---- */
@media (max-width: 820px) {
  .eje-grid { grid-template-columns: 1fr; }
  .eje-aside { border-left: none; border-top: 1px solid var(--linea); }
  .eje-head-inner { padding: 28px 20px; }
  .eje-head .cv-nombre, .edi-masthead .cv-nombre { font-size: 34px; }
  .edi-grid { grid-template-columns: 1fr; gap: 20px; }
  .cla-dos, .aca-dos { grid-template-columns: 1fr; }
  .cmp-grid { column-count: 1; }
}

/* ============================================================
   Impresión FIEL al diseño de cada plantilla
   ============================================================ */
@media print {
  @page { margin: 10mm 10mm; }
  html, body { background: #fff !important; }
  .cv, .cv * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

  /* Ocultar controles/interfaz */
  .site-nav, .cv-nav, .ed-toolbar, .ed-ayuda, .cv-footer-acciones, .cv-progress,
  .add-btn, .del-btn, .item-mover, .skill-range, .tour-spot, .tour-card, .tour-bar,
  .no-imprimir { display: none !important; }

  /* Mostrar todo lo que se revela al hacer scroll */
  .reveal { opacity: 1 !important; transform: none !important; }

  /* Evitar cortes feos */
  .item, .proyecto, .skill, .idioma, .curso, .cv-sec-titulo { break-inside: avoid; }

  /* Contacto: datos reales en vez de botones */
  .cv-contacto-botones { display: none !important; }
  .cv-contacto-print { display: block !important; margin: 6px 0 0; padding: 0; list-style: none; text-align: left; }
  .cv-contacto-print li { font-size: 12px; margin: 0 0 5px; color: #111827; }
  .cv-contacto-print b { color: var(--acento); }

  /* Pie: crédito centrado, sin visitas */
  .cv-footer { text-align: center !important; }
  .cv-footer-inner { display: block !important; text-align: center !important; }

  /* Ajustes finos para caber mejor sin cambiar el diseño */
  .cv-hero, .vis-hero, .corp-top, .cla-head, .eje-head-inner, .edi-masthead, .cmp-head, .aca-head, .hero-single {
    padding-top: 16px !important; padding-bottom: 12px !important; }
  .cv-sec { padding-top: 10px !important; padding-bottom: 10px !important; }
  .cv-foto { width: 92px !important; height: 92px !important; }
  .edi-izq .cv-foto, .eje-head .cv-foto { width: 108px !important; height: 108px !important; }
  .edi-masthead .cv-nombre { font-size: 38px !important; }
  .cv-nombre { font-size: 30px !important; }
}

/* Impresión: forzar el diseño en columnas (las reglas responsive de móvil se activaban en papel) */
@media print {
  .corp-grid { grid-template-columns: 300px 1fr !important; }
  .corp-aside { border-right: 1px solid var(--linea) !important; border-bottom: none !important; }
  .eje-grid { grid-template-columns: 1fr 280px !important; }
  .eje-aside { border-left: 1px solid var(--linea) !important; border-top: none !important; }
  .edi-grid { grid-template-columns: 280px 1fr !important; gap: 34px !important; }
  .vis-grid { grid-template-columns: 1.7fr 1fr !important; }
  .cla-dos, .aca-dos, .min-dos-col { grid-template-columns: 1fr 1fr !important; }
  .cmp-grid { column-count: 2 !important; }
  .vis-hero-inner, .col-hero-inner, .hero-single .cv-hero-inner { flex-direction: row !important; text-align: left !important; }
  .tpl-single, .tpl-editorial, .tpl-compacto, .tpl-academico { max-width: none !important; }
}

/* Impresión: no cortar secciones a la mitad; si no caben, pasan a la siguiente hoja */
@media print {
  .cv-sec { break-inside: avoid; }
  /* Experiencia puede fluir entre puestos si es muy larga, pero sin partir un puesto */
  .sec-experiencia { break-inside: auto; }
  .cv-sec-titulo { break-after: avoid; }
  .item, .proyecto, .skill, .idioma, .curso, .col-bento .cv-sec { break-inside: avoid; }
  h1, h2, h3 { break-after: avoid; }
  p { orphans: 2; widows: 2; }
}

@media print {
  .cv-footer { padding: 4px 0 0 !important; margin: 0 !important; box-shadow: none !important; }
}

@media print {
  .cv-footer { break-before: avoid; break-inside: avoid; }
}

@media print {
  .cv-sec { padding-top: 7px !important; padding-bottom: 7px !important; }
  .cv-footer { padding: 0 !important; background: transparent !important; }
}

/* Impresión: quitar la sección de Contacto de abajo (ya está arriba) */
@media print {
  .cv-contacto { display: none !important; }
}

/* Impresión: fotos de perfil más grandes */
@media print {
  .cv-foto { width: 132px !important; height: 132px !important; }
  .edi-izq .cv-foto, .eje-head .cv-foto { width: 148px !important; height: 148px !important; }
  .corp-aside .cv-foto { width: 132px !important; height: 132px !important; }
  .cv-iniciales { font-size: 40px !important; }
}

/* Interruptor de crédito en el editor */
.ed-check { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #cbd5e1; cursor: pointer; }
.ed-check input { accent-color: var(--acento); }

/* Impresión: sin crédito "Creado con MiCV.digital" */
@media print {
  .cv-footer { display: none !important; }
}

/* Selector de icono de habilidad (editor) */
.skill-ico-select { display: inline-block; width: 42px; height: 30px; padding: 0 2px;
  border: 1px solid var(--linea); border-radius: 9px; background: color-mix(in srgb, var(--acento) 12%, transparent);
  font-size: 15px; text-align: center; cursor: pointer; }

/* Paleta visual de iconos (editor) */
.skill-ico-pick { cursor: pointer; }
.skill-ico-pick:hover { background: color-mix(in srgb, var(--acento) 26%, transparent); transform: scale(1.12); }
.emoji-picker { position: fixed; z-index: 100000; width: 256px; max-height: 224px; overflow-y: auto;
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; padding: 8px;
  background: #fff; border: 1px solid var(--linea); border-radius: 12px; box-shadow: 0 18px 44px rgba(2,6,23,.28); }
.emoji-picker button { font-size: 19px; line-height: 1; padding: 6px; border: none; background: transparent;
  border-radius: 8px; cursor: pointer; }
.emoji-picker button:hover { background: #eef2ff; transform: scale(1.15); }

/* Impresión: foto de perfil más grande también en minimalista */
@media print {
  .hero-single .cv-foto, .tpl-single .cv-foto { width: 150px !important; height: 150px !important; }
  .corp-aside .cv-foto { width: 146px !important; height: 146px !important; }
}

@media print {
  .vis-hero .cv-foto { width: 150px !important; height: 150px !important; }
}

/* Home en MÓVIL: texto (speech) arriba y ejemplo abajo, centrados */
@media (max-width: 820px) {
  .hero-inner { display: block; text-align: center; }
  .hero-texto { max-width: 800px; margin: 0 auto; }
  .hero-texto .lead { margin-left: auto; margin-right: auto; }
  .hero-acciones { justify-content: center; }
  .hero-garantias { justify-content: center; }
  .hero-mock { order: 0; margin-top: 40px; }
}

/* Móvil: hero más compacto para que el ejemplo entre en la primera pantalla */
@media (max-width: 820px) {
  .hero { padding: 26px 0 26px; }
  .hero h1 { font-size: 31px; }
  .badge { font-size: 12px; padding: 5px 10px; margin-bottom: 12px; }
  .hero-texto .lead { font-size: 15.5px; margin-bottom: 14px; }
  .hero-acciones { gap: 10px; margin: 16px 0 8px; }
  .hero-acciones .btn-lg { padding: 11px 18px; font-size: 15px; }
  .hero-garantias { gap: 6px 14px; font-size: 13px; margin-top: 12px; }
  .hero-mock { margin-top: 20px; }
  .mock-card { padding: 20px; max-width: 300px; }
  .mock-body { max-height: 116px; }
  .mock-nombre { font-size: 17px; }
}

/* Palabra que alterna CV / currículum */
.rota { display: inline-block; transition: opacity .26s ease, transform .26s ease; }
.rota.cambiando { opacity: 0; transform: translateY(-6px); }

/* Versión móvil de la intro */
.lead-movil { display: none; }
@media (max-width: 820px) {
  .lead-full { display: none; }
  .lead-movil { display: block; }
  .hero-texto .micro { display: none; }
}

/* Home: resaltar el link personalizado */
.hero-link { display: inline-flex; align-items: center; gap: 8px; margin: 16px 0 2px;
  padding: 9px 18px; border-radius: 999px; font-size: 15px; font-weight: 600;
  background: color-mix(in srgb, var(--acento) 12%, #fff); color: var(--acento);
  border: 1px solid color-mix(in srgb, var(--acento) 30%, transparent); }
.hero-link b { color: var(--tinta); font-weight: 700; }
@media (max-width: 820px) {
  .hero-link { font-size: 13.5px; padding: 7px 14px; margin: 12px 0 2px; }
}

/* Móvil: quitar el botón "Ver cómo funciona" del hero */
@media (max-width: 820px) {
  .hero-como { display: none !important; }
}

/* ============ Blog ============ */
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.blog-card { display: block; background: #fff; border: 1px solid var(--linea); border-radius: 16px; padding: 24px;
  transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
.blog-card:hover { transform: translateY(-6px); box-shadow: 0 20px 44px rgba(2,6,23,.12); }
.blog-card h2 { font-size: 19px; margin-bottom: 8px; }
.blog-card p { color: var(--tinta-2); font-size: 14.5px; }
.blog-leer { color: var(--acento); font-weight: 600; font-size: 14px; }
.blog-articulo { padding-top: 34px; padding-bottom: 60px; }
.blog-articulo h1 { font-size: 40px; letter-spacing: -.02em; }
.blog-contenido { font-size: 17.5px; line-height: 1.8; color: var(--tinta-2); margin-top: 24px; }
.blog-contenido h2 { font-size: 25px; margin-top: 34px; color: var(--tinta); }
.blog-contenido a { color: var(--acento); font-weight: 600; }
.blog-contenido ul { padding-left: 22px; }
.blog-contenido li { margin-bottom: 8px; }
.blog-cta { margin-top: 46px; background: var(--gris-fondo); border-radius: 18px; padding: 30px; text-align: center; }
@media (max-width: 820px) { .blog-grid { grid-template-columns: 1fr; } .blog-articulo h1 { font-size: 30px; } }

/* Home móvil: texto del hero más ligero */
.lead-movil { display: none; }
@media (max-width: 820px) {
  .lead-full { display: none; }
  .lead-movil { display: block; margin-bottom: 8px; font-size: 15px; }
  .hero-texto .lead-movil:last-of-type { margin-bottom: 14px; }
  .hero-garantias .g-ext { display: none; }
}

/* Blog: imágenes */
.blog-thumb { width: 100%; height: 160px; object-fit: cover; border-radius: 12px; margin-bottom: 14px; }
.blog-hero { width: 100%; border-radius: 14px; margin: 18px 0 6px; }
.blog-credito { font-size: 12px; color: var(--gris); margin-bottom: 18px; }