/* Seccion "Estamos listos para clases virtuales" (partials/_clases_virtuales.html): inicio y pagina del SIGE.
   Sin animaciones en reposo: solo transiciones cortas al pasar el mouse. */
.cv{ --cv-s:var(--c-secondary,#2B76F7); --cv-p:#1A4B99; --cv-verde:#2BB673; --cv-naranja:#F7931E;
  --ink:#0f172a; --mut:#5b6b7f; --bd:#e3e9f1; position:relative; overflow:hidden; padding:5rem 0;
  background:linear-gradient(160deg,#eef4ff 0%,#f7f9fd 46%,#eefaf4 100%); }
.cv *{ box-sizing:border-box; }
.cv-dots{ position:absolute; inset:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Ccircle cx='2' cy='2' r='1.5' fill='%23cdd7e6'/%3E%3C/svg%3E"); background-size:26px 26px;
  -webkit-mask:radial-gradient(ellipse 80% 70% at 50% 40%,#000 0%,transparent 80%); mask:radial-gradient(ellipse 80% 70% at 50% 40%,#000 0%,transparent 80%); }
.cv-wrap{ position:relative; z-index:1; max-width:1180px; margin:0 auto; padding:0 1.25rem; }
.cv-grid{ display:grid; gap:2.5rem; align-items:center; }
@media(min-width:1024px){ .cv-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:3.25rem; } }
.cv-chip{ display:inline-flex; align-items:center; gap:.5rem; padding:.32rem .9rem .32rem .38rem; border-radius:999px; background:#fff;
  border:1px solid var(--bd); font-size:.76rem; font-weight:700; color:var(--ink); box-shadow:0 8px 20px -12px rgba(15,23,42,.2); }
.cv-chip .n{ background:var(--cv-verde); color:#fff; font-size:.62rem; font-weight:800; padding:.16rem .55rem; border-radius:999px; letter-spacing:.04em; }
.cv-h2{ margin:1.2rem 0 0; font-family:var(--c-font-display); font-weight:800; color:var(--ink); line-height:1.08; letter-spacing:-.02em; font-size:clamp(2.1rem,4.6vw,3.3rem); }
.cv-h2 span{ background:linear-gradient(100deg,var(--cv-p) 0%,var(--cv-s) 60%,#40CFFF 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.cv-lead{ margin:1.15rem 0 0; color:var(--mut); font-size:1.08rem; line-height:1.65; max-width:36rem; }
.cv-aviso{ display:inline-flex; align-items:center; gap:.55rem; margin:1.25rem 0 0; padding:.55rem .9rem; border-radius:12px;
  background:rgba(247,147,30,.12); color:#8a4f0c; font-size:.86rem; font-weight:700; }
.cv-plat{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; margin-top:1.6rem; }
.cv-plat__t{ font-size:.74rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--mut); margin-right:.2rem; }
.cv-logo{ display:inline-flex; align-items:center; gap:.5rem; padding:.42rem .8rem .42rem .5rem; border-radius:999px; background:#fff;
  border:1px solid var(--bd); font-size:.84rem; font-weight:700; color:var(--ink); transition:transform .15s, box-shadow .15s; }
.cv-logo:hover{ transform:translateY(-2px); box-shadow:0 12px 24px -16px rgba(15,23,42,.35); }
.cv-logo img{ width:24px; height:24px; object-fit:contain; flex-shrink:0; }
.cv-logo--mas{ color:var(--mut); font-weight:600; }
.cv-btns{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.cv-btn{ display:inline-flex; align-items:center; gap:.55rem; font-weight:700; padding:.85rem 1.5rem; border-radius:999px; font-size:.95rem;
  border:2px solid transparent; text-decoration:none; transition:transform .15s, border-color .15s, color .15s; }
.cv-btn:hover{ transform:translateY(-2px); }
.cv-btn--p{ background:var(--cv-s); color:#fff; box-shadow:0 12px 26px -12px rgba(41,112,235,.6); }
.cv-btn--line{ background:#fff; color:var(--ink); border-color:var(--bd); }
.cv-btn--line:hover{ border-color:var(--cv-s); color:var(--cv-s); }

/* Video (Drive) o su espacio mientras no hay enlace */
.cv-video{ position:relative; border-radius:22px; overflow:hidden; background:#0f172a; border:1px solid var(--bd);
  box-shadow:0 40px 80px -40px rgba(15,23,42,.55); aspect-ratio:16/9; }
.cv-video iframe{ display:block; width:100%; height:100%; border:0; }
.cv-video--espera{ background:linear-gradient(180deg,#f3f8ff,#fff); }
.cv-espera{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:1rem; }
.cv-espera img{ width:auto; height:100%; max-width:100%; object-fit:contain; }
.cv-pronto{ position:absolute; left:50%; bottom:1rem; transform:translateX(-50%); display:inline-flex; align-items:center; gap:.45rem; white-space:nowrap;
  padding:.45rem .95rem; border-radius:999px; background:#fff; border:1px solid var(--bd); box-shadow:0 12px 26px -14px rgba(15,23,42,.35);
  font-size:.82rem; font-weight:800; color:var(--ink); }
.cv-pronto i{ color:var(--cv-s); }
@media(max-width:640px){ .cv-video--espera{ aspect-ratio:auto; } .cv-video--espera .cv-espera{ position:relative; inset:auto; padding:1rem 1rem 3.5rem; }
  .cv-espera img{ height:auto; width:100%; } }

/* Asi lo vive cada uno: docente y estudiante */
.cv-roles{ display:grid; gap:1.25rem; margin-top:3rem; }
@media(min-width:768px){ .cv-roles{ grid-template-columns:repeat(2,1fr); gap:1.4rem; } }
.cv-rol{ display:grid; grid-template-columns:1fr; border-radius:22px; background:#fff; border:1px solid var(--bd); overflow:hidden; transition:transform .2s, box-shadow .2s; }
@media(min-width:1024px){ .cv-rol{ grid-template-columns:minmax(0,.95fr) minmax(0,1fr); align-items:center; } }
.cv-rol:hover{ transform:translateY(-3px); box-shadow:0 24px 46px -30px rgba(45,62,80,.4); }
.cv-rol__img{ background:linear-gradient(180deg,#f3f8ff,#fff); display:flex; justify-content:center; padding:.75rem .75rem 0; }
.cv-rol__img img{ width:min(300px,100%); height:auto; }
.cv-rol__b{ padding:1.1rem 1.4rem 1.4rem; }
.cv-rol__eye{ display:inline-flex; align-items:center; gap:.45rem; font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--cv-s); }
.cv-rol h3{ margin:.45rem 0 0; font-size:1.12rem; font-weight:800; color:var(--ink); line-height:1.3; }
.cv-rol p{ margin:.4rem 0 0; font-size:.88rem; color:var(--mut); line-height:1.55; }

/* Lo que hace el SIGE en clases virtuales */
.cv-feats{ display:grid; grid-template-columns:1fr; gap:1rem; margin-top:1.5rem; }
@media(min-width:640px){ .cv-feats{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px){ .cv-feats{ grid-template-columns:repeat(3,1fr); gap:1.25rem; } }
.cv-feat{ display:flex; gap:.9rem; align-items:flex-start; padding:1.15rem 1.2rem; border-radius:18px; background:#fff; border:1px solid var(--bd);
  transition:transform .2s, box-shadow .2s, border-color .2s; }
.cv-feat:hover{ transform:translateY(-3px); border-color:rgba(43,118,247,.35); box-shadow:0 22px 44px -28px rgba(45,62,80,.4); }
.cv-feat__ic{ width:44px; height:44px; border-radius:13px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:1.15rem;
  color:var(--c,var(--cv-s)); background:color-mix(in srgb,var(--c,var(--cv-s)) 12%,#fff); }
.cv-feat h3{ margin:0; font-size:.98rem; font-weight:800; color:var(--ink); }
.cv-feat p{ margin:.3rem 0 0; font-size:.85rem; color:var(--mut); line-height:1.5; }