/* =====================================================================
   Identidad visual — verde UNAL con acentos cuánticos (violeta/teal)
   ===================================================================== */
:root {
  --qc-green:      #123d26;
  --qc-green-2:    #1c5a38;
  --qc-green-dark: #0c2a1a;
  --qc-violet:     #6d28d9;
  --qc-violet-2:   #7c3aed;
  --qc-teal:       #0d9488;
  --qc-cyan:       #06b6d4;
  --qc-gold:       #cfa94e;
}

/* ---- Paleta personalizada de Material ---- */
[data-md-color-primary="custom"] {
  --md-primary-fg-color:        var(--qc-green);
  --md-primary-fg-color--light: var(--qc-green-2);
  --md-primary-fg-color--dark:  var(--qc-green-dark);
  --md-primary-bg-color:        #ffffff;
  --md-primary-bg-color--light: rgba(255,255,255,.7);
}
[data-md-color-accent="custom"] {
  --md-accent-fg-color:             var(--qc-violet-2);
  --md-accent-fg-color--transparent: rgba(124,58,237,.1);
}
/* enlaces en tono violeta cuántico */
:root { --md-typeset-a-color: var(--qc-violet); }
[data-md-color-scheme="slate"] { --md-typeset-a-color: #b794f6; }

/* barra superior con degradado sutil */
.md-header, .md-tabs {
  background: linear-gradient(90deg, var(--qc-green-dark), var(--qc-green) 55%, var(--qc-green-2));
}

/* ---- Hero de la portada ---- */
.qc-hero {
  margin: .4rem 0 1.6rem;
  padding: 2.4rem 2rem;
  border-radius: 16px;
  color: #f3f6f2;
  background:
    radial-gradient(120% 130% at 90% -10%, rgba(124,58,237,.30), transparent 55%),
    radial-gradient(90% 120% at 0% 120%, rgba(13,148,136,.28), transparent 55%),
    linear-gradient(135deg, var(--qc-green-dark), var(--qc-green));
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
}
.qc-hero-grid { display: flex; gap: 2.2rem; align-items: center; flex-wrap: wrap; }
.qc-hero-cover { flex: 0 0 auto; }
.qc-hero-cover img {
  width: 232px; max-width: 42vw; border-radius: 8px; display: block;
  border: 1px solid rgba(207,169,78,.5);
  box-shadow: 0 22px 50px rgba(0,0,0,.5), 0 6px 14px rgba(0,0,0,.35);
}
.qc-hero-main { flex: 1 1 340px; min-width: 300px; }
@media (max-width: 640px) { .qc-hero-cover img { width: 180px; margin: 0 auto; } }
.qc-hero .qc-kicker {
  text-transform: uppercase; letter-spacing: .18em; font-size: .72rem;
  font-weight: 700; color: var(--qc-gold);
}
.qc-hero h1 {
  color: #ffffff !important; margin: .3rem 0 .4rem; font-weight: 800;
  line-height: 1.08; font-size: 2.1rem;
}
.qc-hero p { color: #dfeae2; font-size: .98rem; max-width: 46rem; }
.qc-hero .qc-cta { margin-top: 1.1rem; display: flex; gap: .6rem; flex-wrap: wrap; }
.qc-hero .qc-btn {
  display: inline-block; padding: .55rem 1rem; border-radius: 10px;
  font-weight: 700; font-size: .85rem; text-decoration: none;
}
.qc-hero .qc-btn.primary { background: var(--qc-violet-2); color: #fff; }
.qc-hero .qc-btn.ghost   { background: rgba(255,255,255,.10); color: #fff;
  border: 1px solid rgba(255,255,255,.35); }
.qc-hero .qc-btn:hover { filter: brightness(1.08); }

/* franja de datos rápidos */
.qc-facts { display: flex; gap: 1.4rem; flex-wrap: wrap; margin-top: 1.3rem; }
.qc-facts .f { color: #eaf2ec; font-size: .82rem; }
.qc-facts .f b { display: block; color: #fff; font-size: 1.02rem; }

/* ---- Tarjetas (grid cards de Material) — acento cuántico ---- */
.md-typeset .grid.cards > ul > li {
  border-radius: 12px; border: 1px solid var(--md-default-fg-color--lightest);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.md-typeset .grid.cards > ul > li:hover {
  border-color: var(--qc-violet-2);
  box-shadow: 0 10px 24px rgba(0,0,0,.10); transform: translateY(-2px);
}

/* insignia de semana / estado */
.qc-badge {
  display: inline-block; padding: .12rem .5rem; border-radius: 999px;
  font-size: .68rem; font-weight: 700; letter-spacing: .02em;
  background: rgba(124,58,237,.12); color: var(--qc-violet);
}
.qc-badge.teal { background: rgba(13,148,136,.14); color: var(--qc-teal); }
.qc-badge.gold { background: rgba(207,169,78,.18); color: #9a7b20; }

/* video de YouTube responsivo (16:9) */
.qc-video {
  position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;
  border-radius: 12px; margin: .6rem 0 1rem;
  box-shadow: 0 10px 26px rgba(0,0,0,.14);
}
.qc-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* pie institucional */
.md-footer-meta { background: var(--qc-green-dark); }