
:root{
  --ca634-frame:768px;
  --ca634-inner:744px;
  --ca634-line:#dbe4f0;
  --ca634-text:#18253b;
  --ca634-muted:#5f6f86;
  --ca634-surface:#ffffff;
  --ca634-blue:#1769e0;
  --ca634-blue-dark:#0d4ea4;
  --ca634-shadow:0 16px 38px rgba(13,39,80,.12);
}
body.jc-conecta-aprende-clean-v634{background:#f4f7fb;color:var(--ca634-text)}
.jc-ca634{padding:0 0 18px}

/* V634 · Encabezado: geometría óptica idéntica al estándar CCJ V624. */
.jc-ca634-head{padding:10px 0 8px}
.jc-ca634-frame,.jc-ca634-grid-frame{width:min(var(--ca634-frame),calc(100% - 16px));margin:0 auto}
.jc-ca634-head .jc-ca634-frame{
  position:relative;
  display:grid;
  grid-template-columns:40px minmax(0,1fr) 40px;
  align-items:center;
  gap:8px;
  min-height:102px;
  padding:8px 10px;
  border:1px solid var(--ca634-line);
  border-radius:18px;
  background:#fff;
  box-shadow:0 12px 32px rgba(12,47,98,.08);
  box-sizing:border-box;
}
.jc-ca634-head .jc-ca634-frame::after{content:"";width:40px;height:40px;display:block;grid-column:3}
.jc-ca634-back{
  grid-column:1;
  width:40px;height:40px;
  border-radius:12px;
  background:#fff;
  border:1px solid #e2eaf0;
  display:flex;align-items:center;justify-content:center;
  color:#234d75;text-decoration:none;
  box-shadow:0 3px 12px rgba(18,58,95,.12);
  z-index:2;
}
.jc-ca634-brand{grid-column:2;min-width:0;display:flex;align-items:center;justify-content:center;padding:0}
.jc-ca634-brand img{display:block;width:auto;max-width:100%;max-height:106px;height:auto;object-fit:contain}

.jc-ca634-grid-wrap{padding:10px 0 24px}
.jc-ca634-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.jc-ca634-card{min-width:0}
.jc-ca634-card__button{width:100%;background:linear-gradient(180deg,#fff,#f7faff);border:1px solid var(--ca634-line);border-radius:22px;box-shadow:var(--ca634-shadow);padding:12px 8px 10px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;min-height:168px;cursor:pointer;position:relative;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.jc-ca634-card__button:hover,.jc-ca634-card__button:focus-visible{transform:translateY(-2px);border-color:#b8d0f6;box-shadow:0 18px 34px rgba(23,105,224,.18)}
.jc-ca634-card__button:focus-visible{outline:2px solid #8cbcff;outline-offset:2px}
.jc-ca634-chip{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:5px 10px;background:linear-gradient(180deg,#1ccf6b,#13a557);color:#fff;font-size:11px;font-weight:900;letter-spacing:.4px;line-height:1;text-transform:uppercase;box-shadow:0 8px 18px rgba(16,148,79,.24)}
.jc-ca634-card__logo{display:block;width:100%;max-width:150px;height:auto;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(12,37,80,.10))}

/* V634 · Portal global: por encima de Header/Footer, fuera de cualquier stacking context del micrositio. */
.jc-ca634-modal[hidden]{display:none!important}
.jc-ca634-modal{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  min-height:100vh!important;
  height:100dvh!important;
  z-index:2147483500!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important;
  margin:0!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.jc-ca634-modal__backdrop{position:absolute;inset:0;background:rgba(7,19,40,.72);backdrop-filter:blur(3px);z-index:0}
.jc-ca634-modal__dialog{position:relative;z-index:1;width:min(680px,100%);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:#fff;border-radius:26px;box-shadow:0 30px 80px rgba(0,0,0,.34);border:1px solid rgba(233,239,247,.95)}
.jc-ca634-modal__close{position:sticky;float:right;top:10px;margin:10px 10px -48px 0;width:38px;height:38px;border:none;border-radius:999px;background:#eff4fb;color:#294d80;font-size:28px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:5;box-shadow:0 4px 12px rgba(15,42,80,.12)}
.jc-ca634-modal__body{display:grid;grid-template-columns:240px minmax(0,1fr);gap:18px;padding:18px;padding-top:20px;clear:both}
.jc-ca634-modal__media{display:flex;align-items:flex-start;justify-content:center;padding:6px}
.jc-ca634-modal__media img{display:block;width:100%;max-width:220px;height:auto;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(12,37,80,.12))}
.jc-ca634-modal__eyebrow{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;background:#eef5ff;color:#1769e0;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.4px}
.jc-ca634-modal__copy h2{margin:10px 0 8px;font-size:30px;line-height:1.06;color:#122747}
.jc-ca634-modal__excerpt{margin:0 0 14px;color:var(--ca634-muted);line-height:1.45}
.jc-ca634-modal__meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.jc-ca634-modal__meta span{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:7px 11px;background:#f5f8fd;border:1px solid #e3ebf6;color:#23406c;font-size:13px;font-weight:700}
.jc-ca634-progress{height:9px;background:#e7eef8;border-radius:999px;overflow:hidden;margin:8px 0 4px}
.jc-ca634-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#16c15e,#1b85ff)}
.jc-ca634-progress__label{display:block;color:#3f5b86;font-weight:700;margin-bottom:10px}
.jc-ca634-lessons{margin-top:10px;padding:14px;background:#f8fbff;border:1px solid #e6eef8;border-radius:18px}
.jc-ca634-lessons h3{margin:0 0 8px;font-size:16px;color:#173a69}
.jc-ca634-lessons ol{margin:0;padding-left:18px;display:grid;gap:7px}
.jc-ca634-lessons a{color:#163f7a;text-decoration:none;font-weight:700;line-height:1.35}
.jc-ca634-lessons a:hover{text-decoration:underline}
.jc-ca634-modal__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.jc-ca634-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:14px;text-decoration:none;font-weight:900;font-size:14px}
.jc-ca634-btn--primary{background:linear-gradient(180deg,var(--ca634-blue),var(--ca634-blue-dark));color:#fff;box-shadow:0 12px 22px rgba(23,105,224,.24)}
.jc-ca634-btn--ghost{background:#f3f7fe;color:#173a69;border:1px solid #dbe6f5}
html.jc-ca634-modal-open,body.jc-ca634-modal-open{overflow:hidden!important;overscroll-behavior:none!important}

@media(max-width:900px){
  .jc-ca634-modal__body{grid-template-columns:1fr;gap:12px}
  .jc-ca634-modal__media img{max-width:200px}
}
@media(max-width:760px){
  .jc-ca634-frame,.jc-ca634-grid-frame{width:min(100%,calc(100% - 12px))}
  .jc-ca634-head{padding:8px 0 5px}
  .jc-ca634-head .jc-ca634-frame{grid-template-columns:36px minmax(0,1fr) 36px;gap:6px;min-height:92px;padding:6px 8px;border-radius:16px}
  .jc-ca634-head .jc-ca634-frame::after{width:36px;height:36px}
  .jc-ca634-back{width:36px;height:36px;border-radius:11px}
  .jc-ca634-brand img{max-height:82px}
  .jc-ca634-grid{gap:9px}
  .jc-ca634-card__button{min-height:144px;padding:10px 6px 8px;border-radius:18px}
  .jc-ca634-card__logo{max-width:118px}
  .jc-ca634-chip{font-size:10px;padding:5px 8px}
  .jc-ca634-modal{padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important}
  .jc-ca634-modal__dialog{width:100%;max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);border-radius:22px}
  .jc-ca634-modal__body{padding:15px;padding-top:18px}
  .jc-ca634-modal__copy h2{font-size:24px}
}
@media(max-width:390px){
  .jc-ca634-head .jc-ca634-frame{grid-template-columns:34px minmax(0,1fr) 34px;min-height:86px;padding:5px 6px}
  .jc-ca634-head .jc-ca634-frame::after{width:34px;height:34px}
  .jc-ca634-back{width:34px;height:34px}
  .jc-ca634-brand img{max-height:76px}
  .jc-ca634-card__button{min-height:132px}
  .jc-ca634-card__logo{max-width:102px}
  .jc-ca634-modal__copy h2{font-size:22px}
  .jc-ca634-modal__meta span{font-size:12px;padding:7px 9px}
}
@media(min-width:901px){
  .jc-ca634-head .jc-ca634-frame{min-height:108px}
  .jc-ca634-brand img{max-height:108px}
}


/* V634 · Curso -> lección dentro del mismo cuadro flotante */
.jc-ca634-view[hidden]{display:none!important}.jc-ca634-view.is-active{display:block}
.jc-ca634-lessons ol{list-style:none;padding:0;margin:0;gap:6px}
.jc-ca634-lessons li{margin:0}
.jc-ca634-lessons button{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) 24px;gap:8px;align-items:center;text-align:left;border:1px solid #e2eaf4;border-radius:12px;background:#fff;color:#163f7a;padding:9px 10px;cursor:pointer}
.jc-ca634-lessons button span{width:28px;height:28px;border-radius:9px;background:#eef5ff;display:grid;place-items:center;font-weight:900;font-size:11px}.jc-ca634-lessons button b{font-size:12.5px;line-height:1.25}.jc-ca634-lessons button i{font-style:normal;color:#16854b;font-weight:950}
.jc-ca634-lesson-toolbar{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center;padding:15px 58px 12px 16px;border-bottom:1px solid #e7edf5;background:#f8fbff}.jc-ca634-lesson-toolbar button{border:1px solid #dbe6f5;border-radius:11px;background:#fff;color:#173a69;min-height:38px;padding:0 11px;font-weight:850;cursor:pointer}.jc-ca634-lesson-toolbar div{min-width:0}.jc-ca634-lesson-toolbar small,.jc-ca634-lesson-toolbar strong{display:block}.jc-ca634-lesson-toolbar small{color:#6b7a8e;font-size:10px;text-transform:uppercase;font-weight:800}.jc-ca634-lesson-toolbar strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#173a69;font-size:13px}
.jc-ca634-lesson-content{padding:20px}.jc-ca634-lesson-content h2{margin:0 0 14px;color:#122747;font-size:27px;line-height:1.1}.jc-ca634-lesson-prose{color:#33455d;font-size:15px;line-height:1.65}.jc-ca634-lesson-prose img,.jc-ca634-lesson-prose video,.jc-ca634-lesson-prose iframe{max-width:100%;height:auto}.jc-ca634-lesson-prose iframe{aspect-ratio:16/9}.jc-ca634-lesson-prose h2,.jc-ca634-lesson-prose h3{color:#173a69}.jc-ca634-lesson-prose pre{max-width:100%;overflow:auto}.jc-ca634-lesson-actions{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin-top:20px;padding-top:14px;border-top:1px solid #e5edf6}.jc-ca634-lesson-actions button,.jc-ca634-lesson-actions a{min-height:40px;border:1px solid #dbe6f5;border-radius:12px;background:#f4f8fe;color:#173a69;padding:8px 11px;text-decoration:none;font-weight:850;font-size:12px;cursor:pointer;text-align:center}.jc-ca634-lesson-actions>*:last-child{justify-self:end}.jc-ca634-complete{background:#eef9f2!important;color:#177341!important;border-color:#cdebd8!important}.jc-ca634-complete.is-complete{background:#16854b!important;color:#fff!important;border-color:#16854b!important}.jc-ca634-status{min-height:18px;margin:8px 0 0;text-align:center;color:#52657c;font-size:11px;font-weight:700}
@media(max-width:760px){.jc-ca634-lesson-toolbar{padding:12px 50px 10px 12px;gap:8px}.jc-ca634-lesson-toolbar button{min-height:34px;padding:0 8px;font-size:11px}.jc-ca634-lesson-content{padding:15px}.jc-ca634-lesson-content h2{font-size:22px}.jc-ca634-lesson-prose{font-size:14px;line-height:1.58}.jc-ca634-lesson-actions{grid-template-columns:1fr 1fr}.jc-ca634-lesson-actions .jc-ca634-complete{grid-column:1/-1;grid-row:1}.jc-ca634-lesson-actions>*:last-child{justify-self:stretch}}
