/* /assets/css/curso.css */
.curso-contenedor { margin: 0 auto; max-width: 1180px; padding: 16px 16px 40px; }
.migas { align-items: center; color: #77717d; display: flex; font-size: 11px; gap: 7px; margin: 2px 0 15px; overflow: hidden; white-space: nowrap; }
.migas strong { color: #332f37; overflow: hidden; text-overflow: ellipsis; }
.curso-presentacion { display: grid; gap: 18px; }
.curso-imagen-principal { align-items: center; aspect-ratio: 1.2; background: #f7f6f8; border: 1px solid #ebe8ef; border-radius: 18px; display: flex; justify-content: center; overflow: hidden; padding: 20px; }
.curso-imagen-principal img { height: 100%; object-fit: contain; width: 100%; }
.curso-imagen-principal span { color: #817b85; font-size: 12px; }
.curso-miniaturas { display: flex; gap: 8px; margin-top: 9px; overflow-x: auto; }
.curso-miniatura-boton { background: #f7f6f8; border: 1px solid #ebe8ef; border-radius: 9px; flex: 0 0 64px; height: 54px; overflow: hidden; padding: 4px; }
.curso-miniatura-boton.activa { border-color: var(--violeta); box-shadow: 0 0 0 1px var(--violeta); }
.curso-miniatura-boton img { height: 100%; object-fit: contain; width: 100%; }
.curso-distintivo, .curso-sobrelinea { color: var(--violeta); font-size: 9px; font-weight: 850; letter-spacing: .75px; }
.curso-resumen > h1 { font-size: 31px; letter-spacing: -1.25px; line-height: 1; margin: 8px 0 3px; }
.curso-subtitulo { color: #625c68; font-size: 17px; margin: 0; }
.curso-datos-rapidos { display: flex; flex-wrap: wrap; gap: 7px; margin: 15px 0; }
.curso-datos-rapidos span { background: #f6f3fc; border-radius: 7px; color: #524b59; font-size: 9px; font-weight: 700; padding: 7px 8px; }
.curso-descripcion-corta { color: #5e5863; font-size: 12px; line-height: 1.55; margin: 0 0 17px; }
.curso-compra { border: 1px solid #e7e1ee; border-radius: 16px; box-shadow: 0 12px 35px rgba(45,28,70,.08); padding: 16px; }
.curso-precio { display: grid; grid-template-columns: 1fr auto; }
.curso-precio small { color: #77717d; font-size: 9px; grid-column: 1; }
.curso-precio strong { font-size: 29px; grid-column: 1; letter-spacing: -1px; line-height: 1.1; }
.curso-precio span { align-self: end; color: #77717d; font-size: 9px; grid-column: 2; grid-row: 1 / 3; }
.chance-incluida { align-items: center; background: linear-gradient(120deg,#f4edff,#fff9e9); border-radius: 11px; display: flex; gap: 10px; margin: 14px 0; padding: 11px; }
.chance-incluida > span { font-size: 23px; }
.chance-incluida strong, .chance-incluida small { display: block; }
.chance-incluida strong { font-size: 11px; }
.chance-incluida small { color: #716b76; font-size: 8px; margin-top: 2px; }
.curso-boton-comprar { align-items: center; background: linear-gradient(135deg,var(--violeta),#7b39ed); border-radius: 11px; color: #fff; display: flex; font-size: 13px; font-weight: 800; height: 47px; justify-content: space-between; margin-top: 11px; padding: 0 15px; }
.curso-boton-comprar span { font-size: 20px; }
.curso-aclaracion { color: #827c86; display: block; font-size: 8px; line-height: 1.4; margin-top: 8px; text-align: center; }
.curso-seccion { border-top: 1px solid #eeeaf1; margin-top: 34px; padding-top: 29px; }
.curso-seccion h2 { font-size: 24px; letter-spacing: -.8px; line-height: 1.08; margin: 6px 0 17px; }
.curso-modulos { display: grid; gap: 8px; }
.curso-modulos article { align-items: flex-start; border: 1px solid #ebe7ef; border-radius: 12px; display: grid; gap: 11px; grid-template-columns: 30px 1fr; padding: 13px; }
.curso-modulos article > span { align-items: center; background: #f2ecfd; border-radius: 8px; color: var(--violeta); display: flex; font-size: 9px; font-weight: 850; height: 30px; justify-content: center; }
.curso-modulos h3 { font-size: 12px; margin: 1px 0 4px; }
.curso-modulos p { color: #716b76; font-size: 9px; line-height: 1.45; margin: 0; }
.curso-premios { background: linear-gradient(135deg,#f7f2ff,#fffbf1); border: 0; border-radius: 17px; padding: 20px; }
.curso-premios-texto > p { color: #665f6b; font-size: 11px; line-height: 1.5; }
.curso-premios-texto > a { color: var(--violeta); font-size: 10px; font-weight: 800; }
.curso-premios-lista { display: grid; gap: 8px; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 18px; }
.curso-premios-lista a { min-width: 0; }
.curso-premios-lista a > div { align-items: center; aspect-ratio: 1; background: #fff; border: 1px solid #ece8ef; border-radius: 10px; display: flex; justify-content: center; overflow: hidden; padding: 6px; }
.curso-premios-lista img { height: 100%; object-fit: contain; width: 100%; }
.curso-premios-lista strong, .curso-premios-lista small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.curso-premios-lista strong { font-size: 9px; margin-top: 6px; }
.curso-premios-lista small { color: #77717d; font-size: 7px; margin-top: 2px; }
.curso-estado { margin: 80px auto; max-width: 500px; text-align: center; }
.curso-estado h1 { font-size: 29px; }
.curso-estado p { color: #716b76; font-size: 12px; }
.curso-estado a { color: var(--violeta); font-size: 12px; font-weight: 800; }

@media (min-width: 760px) {
    .curso-contenedor { padding: 28px 24px 60px; }
    .curso-presentacion { align-items: start; gap: 44px; grid-template-columns: minmax(0,1.08fr) minmax(360px,.92fr); }
    .curso-imagen-principal { aspect-ratio: 1.12; padding: 36px; }
    .curso-resumen > h1 { font-size: 47px; }
    .curso-subtitulo { font-size: 21px; }
    .curso-descripcion-corta { font-size: 14px; }
    .curso-compra { padding: 20px; }
    .curso-seccion { margin-top: 54px; padding-top: 43px; }
    .curso-seccion h2 { font-size: 31px; }
    .curso-modulos { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .curso-modulos article { padding: 16px; }
    .curso-modulos h3 { font-size: 14px; }
    .curso-modulos p { font-size: 11px; }
    .curso-premios { align-items: center; display: grid; gap: 42px; grid-template-columns: .85fr 1.15fr; padding: 35px; }
    .curso-premios-lista { margin-top: 0; }
    .curso-premios-lista strong { font-size: 11px; }
    .curso-premios-lista small { font-size: 8px; }
}

@media (min-width: 1024px) {
    .curso-contenedor { padding-top: 35px; }
    .migas { font-size: 12px; margin-bottom: 22px; }
    .curso-presentacion { gap: 64px; }
    .curso-resumen > h1 { font-size: 54px; }
}
