/* =========================================================
   AULA DIGITAL · ESTILO GLOBAL PARA UNIDADES DE CONTENIDO
   Comercio y Marketing · Estilo limpio, juvenil y editorial
========================================================= */

#site-header {
  display: none !important;
}

:root {
  --aula-fondo: #fffdfb;
  --aula-texto: #2a1834;
  --aula-muted: #6c5d74;

  --aula-rosa: #e95d78;
  --aula-rosa-suave: #fdecef;

  --aula-lila: #9c7ac9;
  --aula-lila-suave: #f6f0ff;

  --aula-morado: #5a2b63;
  --aula-morado-oscuro: #47204f;

  --aula-verde: #4f9f73;
  --aula-verde-suave: #edf8f1;

  --aula-ambar: #d9913d;
  --aula-ambar-suave: #fff6e8;

  --aula-azul: #5f7fd6;
  --aula-azul-suave: #eef3ff;

  --aula-blanco: #ffffff;
  --aula-linea: #f1e2e7;

  --aula-radio: 24px;
  --aula-radio-grande: 32px;
  --aula-sombra: 0 14px 38px rgba(42, 24, 52, 0.06);
  --aula-sombra-hover: 0 18px 48px rgba(42, 24, 52, 0.1);
}

/* CONTENEDOR GENERAL */

.aula-unidad {
  max-width: 1180px;
  margin: 0 auto;
  padding: 32px 20px 70px;
  background: var(--aula-fondo);
  color: var(--aula-texto);
  font-family: Inter, Arial, sans-serif;
  line-height: 1.72;
  scroll-behavior: smooth;
}

.aula-unidad * {
  box-sizing: border-box;
}

.aula-unidad p {
  margin: 0 0 15px;
  color: var(--aula-texto);
}

.aula-unidad a {
  color: var(--aula-rosa);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.18em;
}

.aula-unidad strong {
  color: var(--aula-morado);
}

/* TÍTULOS */

.aula-unidad h1,
.aula-unidad h2,
.aula-unidad h3,
.aula-unidad h4 {
  font-family: "Playfair Display", Georgia, serif;
  color: var(--aula-texto);
}

.aula-unidad h1 {
  font-size: clamp(2.3rem, 5vw, 4.3rem);
  line-height: 1.04;
  letter-spacing: -0.035em;
  margin: 0 0 22px;
}

.aula-unidad h2 {
  font-size: clamp(1.65rem, 2.6vw, 2.35rem);
  line-height: 1.16;
  margin: 58px 0 20px;
  letter-spacing: -0.025em;
  position: relative;
}

.aula-unidad h2::after {
  content: "";
  width: 58px;
  height: 3px;
  background: var(--aula-rosa);
  border-radius: 20px;
  display: block;
  margin-top: 10px;
}

.aula-unidad h3 {
  font-size: 1.35rem;
  line-height: 1.25;
  margin: 32px 0 12px;
}

.aula-unidad h4 {
  font-size: 1.08rem;
  margin: 24px 0 8px;
  font-family: Inter, Arial, sans-serif;
  font-weight: 800;
  color: var(--aula-morado);
}

/* LISTAS */

.aula-unidad ul,
.aula-unidad ol {
  margin-top: 8px;
  margin-bottom: 18px;
  padding-left: 1.4rem;
}

.aula-unidad li {
  margin: 7px 0;
}

/* HERO DE UNIDAD */

.aula-hero-unidad,
.uac-hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #fff5f6 0%, #f6f0ff 62%, #ffffff 100%);
  border: 1px solid #f2d5df;
  border-radius: var(--aula-radio-grande);
  padding: 42px;
  margin: 0 0 34px;
  box-shadow: var(--aula-sombra);
}

.aula-hero-unidad::after,
.uac-hero::after {
  content: "";
  position: absolute;
  right: -90px;
  top: -90px;
  width: 260px;
  height: 260px;
  background: radial-gradient(circle, rgba(233, 93, 120, 0.28), rgba(156, 122, 201, 0.14));
  border-radius: 50%;
}

.aula-hero-unidad > *,
.uac-hero > * {
  position: relative;
  z-index: 1;
}

.aula-kicker,
.uac-kicker {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
}

.aula-pill,
.uac-pill {
  display: inline-block;
  border: 1px solid #f2cbd5;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 999px;
  padding: 7px 13px;
  font-size: 0.84rem;
  font-weight: 800;
  color: var(--aula-rosa);
}

.aula-pill.dark,
.uac-pill.dark {
  background: var(--aula-morado);
  color: #ffffff;
  border-color: var(--aula-morado);
}

.aula-lead,
.uac-lead {
  font-size: 1.13rem;
  line-height: 1.72;
  max-width: 940px;
  color: #493751;
}

/* ÍNDICE */

.aula-toc,
.uac-toc {
  border: 1px solid var(--aula-linea);
  background: #ffffff;
  border-radius: 28px;
  padding: 24px;
  margin: 30px 0 38px;
  box-shadow: var(--aula-sombra);
}

.aula-toc h2,
.uac-toc h2 {
  margin-top: 0;
}

.aula-toc ol,
.uac-toc ol {
  columns: 2;
  column-gap: 38px;
  padding-left: 1.3rem;
}

.aula-toc a,
.uac-toc a {
  color: var(--aula-morado);
  font-weight: 650;
  text-decoration: none;
}

.aula-toc a:hover,
.uac-toc a:hover {
  color: var(--aula-rosa);
}

/* BOTONES */

.aula-btn,
.boton-descarga,
.uac-print {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 13px 24px;
  text-decoration: none !important;
  font-weight: 800;
  transition: all 0.25s ease;
  background: var(--aula-morado);
  color: #ffffff !important;
  border: none;
  box-shadow: 0 10px 24px rgba(90, 43, 99, 0.16);
}

.aula-btn:hover,
.boton-descarga:hover,
.uac-print:hover {
  transform: translateY(-3px);
  background: var(--aula-morado-oscuro);
}

.aula-btn.rosa {
  background: var(--aula-rosa);
}

.aula-btn.rosa:hover {
  background: #d84c68;
}

.aula-btn.lila {
  background: var(--aula-lila);
}

.aula-btn.lila:hover {
  background: #8764b9;
}

/* BLOQUE DESCARGA */

.descarga-unidad,
.aula-descarga {
  background: linear-gradient(135deg, var(--aula-rosa-suave), var(--aula-lila-suave));
  border: 1px solid #f2d5df;
  padding: 26px;
  border-radius: 26px;
  margin: 30px 0;
  text-align: center;
  box-shadow: 0 10px 28px rgba(42, 24, 52, 0.045);
}

.descarga-unidad h2,
.aula-descarga h2 {
  margin-top: 0;
}

.descarga-unidad h2::after,
.aula-descarga h2::after {
  margin-left: auto;
  margin-right: auto;
}

/* TARJETAS Y GRIDS */

.aula-grid,
.uac-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
  gap: 18px;
  margin: 22px 0 28px;
}

.aula-grid.two,
.uac-grid.two {
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
}

.aula-card,
.uac-card {
  background: #ffffff;
  border: 1px solid var(--aula-linea);
  border-radius: var(--aula-radio);
  padding: 22px;
  box-shadow: 0 10px 30px rgba(42, 24, 52, 0.045);
  transition: all 0.25s ease;
}

.aula-card:hover,
.uac-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--aula-sombra-hover);
}

.aula-card h3,
.aula-card h4,
.uac-card h3,
.uac-card h4 {
  margin-top: 0;
}

.aula-card .emoji,
.uac-card .emoji {
  font-size: 1.7rem;
  display: block;
  margin-bottom: 8px;
}

.aula-mini,
.uac-mini {
  font-size: 0.92rem;
  color: var(--aula-muted);
}

/* CAJAS DESTACADAS */

.aula-alert,
.uac-alert {
  border-radius: var(--aula-radio);
  padding: 22px 24px;
  margin: 24px 0;
  border: 1px solid var(--aula-linea);
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(42, 24, 52, 0.04);
}

.aula-alert h2,
.uac-alert h2,
.aula-alert h3,
.uac-alert h3 {
  margin-top: 0;
}

.aula-alert.blue,
.uac-alert.blue {
  background: var(--aula-azul-suave);
  border-color: #d7e1ff;
}

.aula-alert.green,
.uac-alert.green {
  background: var(--aula-verde-suave);
  border-color: #cfead9;
}

.aula-alert.amber,
.uac-alert.amber {
  background: var(--aula-ambar-suave);
  border-color: #f1d7af;
}

.aula-alert.purple,
.uac-alert.purple {
  background: var(--aula-lila-suave);
  border-color: #ded0f2;
}

.aula-alert.rose,
.uac-alert.rose {
  background: var(--aula-rosa-suave);
  border-color: #f2cbd5;
}

/* ACTIVIDADES */

.aula-activity,
.uac-activity {
  border-left: 7px solid var(--aula-verde);
  background: var(--aula-verde-suave);
  border-radius: 0 22px 22px 0;
  padding: 22px;
  margin: 26px 0;
  box-shadow: 0 8px 24px rgba(42, 24, 52, 0.04);
}

.aula-activity h3,
.uac-activity h3 {
  margin-top: 0;
  color: #397451;
}

.aula-activity.ai,
.uac-activity.ai {
  border-left-color: var(--aula-lila);
  background: var(--aula-lila-suave);
}

.aula-activity.ai h3,
.uac-activity.ai h3 {
  color: #6f4fa3;
}

.aula-activity.eval,
.uac-activity.eval {
  border-left-color: var(--aula-ambar);
  background: var(--aula-ambar-suave);
}

.aula-activity.eval h3,
.uac-activity.eval h3 {
  color: #9a6422;
}

.aula-activity.role,
.uac-activity.role {
  border-left-color: var(--aula-rosa);
  background: var(--aula-rosa-suave);
}

.aula-activity.role h3,
.uac-activity.role h3 {
  color: #b34059;
}

/* CHECKLIST */

.aula-checklist,
.uac-checklist {
  list-style: none !important;
  padding-left: 0 !important;
}

.aula-checklist li,
.uac-checklist li {
  position: relative;
  padding-left: 32px;
  margin: 10px 0;
}

.aula-checklist li::before,
.uac-checklist li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--aula-verde);
  font-weight: 900;
}

/* TABLAS */

.aula-table-wrap,
.uac-table-wrap {
  overflow-x: auto;
  margin: 22px 0;
  border-radius: 22px;
  border: 1px solid var(--aula-linea);
  box-shadow: 0 8px 26px rgba(42, 24, 52, 0.04);
}

.aula-table,
.uac-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
  background: #ffffff;
}

.aula-table th,
.uac-table th {
  background: var(--aula-morado);
  color: #ffffff;
  text-align: left;
  padding: 14px;
  border: 1px solid var(--aula-morado);
  vertical-align: top;
}

.aula-table td,
.uac-table td {
  padding: 14px;
  border: 1px solid #f1e8ec;
  vertical-align: top;
}

.aula-table tr:nth-child(even) td,
.uac-table tr:nth-child(even) td {
  background: #fff8fa;
}

/* DESPLEGABLES */

details.aula-details,
details.uac-details {
  border: 1px solid var(--aula-linea);
  border-radius: 20px;
  background: #ffffff;
  margin: 15px 0;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(42, 24, 52, 0.035);
}

details.aula-details summary,
details.uac-details summary {
  cursor: pointer;
  list-style: none;
  padding: 17px 20px;
  font-weight: 850;
  color: var(--aula-morado);
  background: linear-gradient(135deg, #fff8fa, #f8f4ff);
}

details.aula-details summary::-webkit-details-marker,
details.uac-details summary::-webkit-details-marker {
  display: none;
}

details.aula-details summary::before,
details.uac-details summary::before {
  content: "＋";
  display: inline-block;
  margin-right: 8px;
  color: var(--aula-rosa);
  font-weight: 900;
}

details.aula-details[open] summary::before,
details.uac-details[open] summary::before {
  content: "−";
}

.aula-details-body,
.uac-details-body {
  padding: 20px;
}

/* PROCESOS NUMERADOS */

.aula-process,
.uac-process {
  counter-reset: step;
  display: grid;
  gap: 13px;
  margin: 22px 0;
}

.aula-step,
.uac-step {
  counter-increment: step;
  border: 1px solid var(--aula-linea);
  border-radius: 20px;
  padding: 17px 18px 17px 60px;
  background: #ffffff;
  position: relative;
  box-shadow: 0 6px 18px rgba(42, 24, 52, 0.035);
}

.aula-step::before,
.uac-step::before {
  content: counter(step);
  position: absolute;
  left: 18px;
  top: 18px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--aula-rosa);
  color: #ffffff;
  display: grid;
  place-items: center;
  font-weight: 900;
}

/* ORGANIGRAMAS */

.aula-org,
.uac-org {
  display: flex;
  flex-direction: column;
  gap: 11px;
  align-items: center;
  margin: 24px 0;
  padding: 22px;
  border-radius: 28px;
  background: #ffffff;
  border: 1px solid var(--aula-linea);
  overflow-x: auto;
  box-shadow: 0 8px 26px rgba(42, 24, 52, 0.04);
}

.aula-org-row,
.uac-org-row {
  display: flex;
  gap: 11px;
  justify-content: center;
  flex-wrap: wrap;
}

.aula-org-box,
.uac-org-box {
  background: #fff8fa;
  border: 1px solid #f2cbd5;
  border-radius: 16px;
  padding: 11px 14px;
  min-width: 170px;
  text-align: center;
  font-weight: 800;
  box-shadow: 0 4px 10px rgba(42, 24, 52, 0.045);
}

.aula-org-box.main,
.uac-org-box.main {
  background: var(--aula-morado);
  color: #ffffff;
  border-color: var(--aula-morado);
}

.aula-org-box.green,
.uac-org-box.green {
  border-color: #cfead9;
  background: var(--aula-verde-suave);
}

.aula-org-box.amber,
.uac-org-box.amber {
  border-color: #f1d7af;
  background: var(--aula-ambar-suave);
}

.aula-org-box.purple,
.uac-org-box.purple {
  border-color: #ded0f2;
  background: var(--aula-lila-suave);
}

/* CITAS */

.aula-quote,
.uac-quote {
  border-left: 7px solid var(--aula-rosa);
  background: var(--aula-rosa-suave);
  border-radius: 0 22px 22px 0;
  padding: 20px 22px;
  margin: 26px 0;
  font-size: 1.06rem;
}

/* TEST */

.aula-test,
.uac-test {
  counter-reset: q;
}

.aula-question,
.uac-question {
  counter-increment: q;
  border: 1px solid var(--aula-linea);
  background: #ffffff;
  border-radius: 20px;
  padding: 18px;
  margin: 15px 0;
  box-shadow: 0 6px 18px rgba(42, 24, 52, 0.035);
}

.aula-question::before,
.uac-question::before {
  content: "Pregunta " counter(q);
  font-weight: 900;
  color: var(--aula-rosa);
  display: block;
  margin-bottom: 7px;
}

/* BUENO / MALO */

.aula-bad,
.uac-bad {
  color: #b34059;
  font-weight: 800;
}

.aula-good,
.uac-good {
  color: #397451;
  font-weight: 800;
}

/* FOOTER */

.aula-footer,
.uac-footer {
  border-top: 1px solid var(--aula-linea);
  margin-top: 60px;
  padding-top: 24px;
  color: var(--aula-muted);
  font-size: 0.92rem;
}

/* RESPONSIVE */

@media (max-width: 900px) {
  .aula-unidad {
    padding: 24px 16px 56px;
  }

  .aula-hero-unidad,
  .uac-hero {
    padding: 30px;
    border-radius: 28px;
  }

  .aula-toc ol,
  .uac-toc ol {
    columns: 1;
  }

  .aula-grid.two,
  .uac-grid.two {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .aula-unidad {
    padding: 18px 12px 48px;
  }

  .aula-unidad h1 {
    font-size: 2.35rem;
  }

  .aula-hero-unidad,
  .uac-hero {
    padding: 24px;
  }

  .aula-btn,
  .boton-descarga,
  .uac-print {
    width: 100%;
    text-align: center;
  }

  .aula-org-box,
  .uac-org-box {
    min-width: 100%;
  }
}

/* IMPRESIÓN */

@media print {
  .aula-unidad {
    max-width: none;
    background: #ffffff;
    color: #000000;
  }

  .aula-toc,
  .uac-toc,
  .uac-print,
  .boton-descarga {
    display: none;
  }

  .aula-card,
  .uac-card,
  .aula-alert,
  .uac-alert,
  details.aula-details,
  details.uac-details {
    break-inside: avoid;
  }

  details.aula-details .aula-details-body,
  details.uac-details .uac-details-body {
    display: block !important;
  }

  details.aula-details,
  details.uac-details {
    border: 1px solid #cccccc;
  }

  details.aula-details summary::before,
  details.uac-details summary::before {
    content: "";
  }
}

/* ÍNDICE AUTOMÁTICO Y LATERAL */

.aula-toc--sticky {
  position: sticky !important;
  top: 24px;
  z-index: 10;
  overflow: visible !important;
  align-self: start;
}

.aula-toc--sticky ol {
  columns: 1;
  margin-bottom: 0;
}

.aula-toc__item--h3 {
  margin-left: 16px !important;
  font-size: 0.92rem;
}

.aula-toc a:focus-visible,
.aula-btn:focus-visible,
.boton-descarga:focus-visible,
.uac-print:focus-visible {
  outline: 3px solid var(--aula-azul);
  outline-offset: 4px;
}

.aula-unidad h2,
.aula-unidad h3 {
  scroll-margin-top: 32px;
}

/*
 * Elementor: añade la clase "aula-col-indice" al contenedor que envuelve el
 * shortcode. Sticky deja de funcionar si un contenedor padre usa overflow.
 */
.aula-col-indice,
.aula-col-indice > .e-con-inner,
.aula-col-indice .elementor-widget-wrap {
  overflow: visible !important;
}

@media (max-width: 900px) {
  .aula-toc--sticky {
    position: static !important;
    top: auto;
  }
}