/* Sowtec Cursos 1.0.0 */

.cursos-hero,
.cursos-filtro,
.cursos-seccion,
.cursos-compara {
	--sc-tinta: #0a2540;
	--sc-suave: #5d6b7a;
	--sc-linea: #e3e9f0;
	--sc-azul: #1b6ea8;
	--sc-rojo: #e0242b;
	--sc-verde: #157f4a;
}

/* ---------- Hero ---------- */

.cursos-hero {
	background: linear-gradient(100deg, #0a2540 0%, #103a5e 55%, #15507f 100%);
	background-size: cover;
	background-position: center;
	color: #fff;
	padding: 68px 0 60px;
}

.cursos-hero__titulo {
	font-size: clamp(2rem, 4vw, 3.1rem);
	line-height: 1.1;
	letter-spacing: -.03em;
	color: #fff;
	margin: 0 0 16px;
	max-width: 18ch;
}

.cursos-hero__texto {
	font-size: 1.06rem;
	line-height: 1.6;
	color: #c7d5e6;
	max-width: 54ch;
	margin: 0 0 28px;
}

.cursos-hero__botones {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 30px;
}

.cursos-btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 14px 26px;
	border-radius: 9px;
	font-size: .98rem;
	font-weight: 700;
	text-decoration: none;
	transition: transform .16s ease, background .16s ease, box-shadow .16s ease;
}

.cursos-btn:hover { transform: translateY(-2px); text-decoration: none; }

.cursos-btn--claro { background: #fff; color: var(--sc-tinta); }
.cursos-btn--claro:hover { background: #f1f5f9; color: var(--sc-tinta); }
.cursos-btn--claro svg { color: var(--sc-rojo); }

.cursos-btn--rojo { background: var(--sc-rojo); color: #fff; }
.cursos-btn--rojo:hover { background: #c01d24; color: #fff; }

.cursos-hero__sellos {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 14px 32px;
}

.cursos-hero__sellos li {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: .92rem;
	color: #c7d5e6;
}

.cursos-hero__sellos svg { color: #8fb3d4; flex: none; }

/* ---------- Filtro ---------- */

.cursos-filtro {
	background: #f7f9fc;
	border-bottom: 1px solid var(--sc-linea);
	padding: 16px 0;
}

.cursos-filtro__inner {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
}

.cursos-filtro__etq {
	font-size: .9rem;
	font-weight: 700;
	color: var(--sc-tinta);
}

.cursos-filtro__lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.cursos-pill {
	display: inline-block;
	padding: 10px 20px;
	border: 1px solid var(--sc-linea);
	border-radius: 9px;
	background: #fff;
	font-size: .92rem;
	font-weight: 600;
	color: var(--sc-tinta);
	text-decoration: none;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.cursos-pill:hover { border-color: #b9c8db; text-decoration: none; }

.cursos-pill.is-activa {
	background: var(--sc-rojo);
	border-color: var(--sc-rojo);
	color: #fff;
}

/* ---------- Secciones ---------- */

.cursos-seccion { padding: 54px 0; }
.cursos-seccion--pago { background: #fdf6f6; }

.cursos-seccion__cab {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-bottom: 30px;
}

.cursos-seccion__titulo {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: clamp(1.5rem, 2.6vw, 2rem);
	letter-spacing: -.02em;
	margin: 0 0 6px;
	color: var(--sc-tinta);
}

.cursos-seccion__icono {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 9px;
	flex: none;
	color: #fff;
}

.cursos-seccion__icono--yt { background: var(--sc-rojo); }
.cursos-seccion__icono--premium { background: #c0392b; }

.cursos-seccion__texto {
	font-size: 1rem;
	color: var(--sc-suave);
	margin: 0;
}

.cursos-seccion__enlace {
	font-size: .93rem;
	font-weight: 650;
	color: var(--sc-azul);
	text-decoration: none;
	white-space: nowrap;
}

.cursos-seccion__enlace:hover { text-decoration: underline; }

.cursos-rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
	gap: 24px;
}

.cursos-vacio {
	background: #fff;
	border: 1px dashed var(--sc-linea);
	border-radius: 12px;
	padding: 34px;
	text-align: center;
	color: var(--sc-suave);
	margin: 0;
}

/* ---------- Tarjeta ---------- */

.curso {
	background: #fff;
	border: 1px solid var(--sc-linea);
	border-radius: 14px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .16s ease, border-color .16s ease, transform .16s ease;
}

.curso:hover {
	border-color: #cfd9e6;
	box-shadow: 0 16px 40px rgba(10, 37, 64, .10);
	transform: translateY(-3px);
}

.curso__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	background: linear-gradient(135deg, #e8eef5, #d7e3ef);
	overflow: hidden;
}

.curso__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .35s ease;
}

.curso:hover .curso__media img { transform: scale(1.04); }

.curso__sinimagen {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	font-weight: 800;
	color: #8fa6bd;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.curso__duracion {
	position: absolute;
	right: 10px;
	bottom: 10px;
	background: rgba(10, 37, 64, .88);
	color: #fff;
	font-size: .76rem;
	font-weight: 700;
	padding: 4px 9px;
	border-radius: 5px;
	letter-spacing: .02em;
}

.curso__insignia {
	position: absolute;
	left: 10px;
	top: 10px;
	background: var(--sc-rojo);
	color: #fff;
	font-size: .72rem;
	font-weight: 700;
	padding: 5px 11px;
	border-radius: 999px;
	letter-spacing: .02em;
}

.curso__cuerpo {
	padding: 18px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}

.curso__titulo {
	font-size: 1.04rem;
	font-weight: 700;
	line-height: 1.32;
	letter-spacing: -.015em;
	margin: 0;
}

.curso__titulo a { color: var(--sc-tinta); text-decoration: none; }
.curso__titulo a:hover { color: var(--sc-azul); }

.curso__subtitulo {
	font-size: .93rem;
	font-weight: 600;
	color: var(--sc-suave);
	margin: -4px 0 0;
}

.curso__desc {
	font-size: .9rem;
	line-height: 1.55;
	color: var(--sc-suave);
	margin: 0;
	flex: 1;
}

/* Pie de la tarjeta gratuita */

.curso__pie {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 4px;
}

.curso__gratis {
	font-size: .76rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--sc-verde);
	background: #eaf6ef;
	border-radius: 5px;
	padding: 5px 10px;
}

.curso__vistas {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: .82rem;
	color: var(--sc-suave);
}

.curso__vistas svg { width: 15px; height: 15px; }

.curso__yt {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-left: auto;
	background: var(--sc-rojo);
	color: #fff;
	font-size: .82rem;
	font-weight: 700;
	padding: 8px 14px;
	border-radius: 7px;
	text-decoration: none;
	transition: background .15s ease;
}

.curso__yt:hover { background: #c01d24; color: #fff; text-decoration: none; }
.curso__yt svg { width: 15px; height: 15px; }

/* Datos del curso de pago */

.curso__datos {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 14px;
	margin-top: 2px;
}

.curso__chip {
	font-size: .78rem;
	font-weight: 600;
	color: var(--sc-tinta);
	background: #eef2f7;
	border-radius: 5px;
	padding: 5px 10px;
}

.curso__dato {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: .82rem;
	color: var(--sc-suave);
}

.curso__dato svg { width: 15px; height: 15px; }

.curso__estrellas {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: .82rem;
	color: var(--sc-suave);
}

.curso__estrellas svg { color: #e8a317; }
.curso__estrellas strong { color: var(--sc-tinta); }

.curso__compra {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 12px;
	padding-top: 14px;
	border-top: 1px solid var(--sc-linea);
}

.curso__precio {
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.curso__antes {
	font-size: .88rem;
	color: var(--sc-suave);
	text-decoration: line-through;
}

.curso__ahora {
	font-size: 1.45rem;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--sc-rojo);
}

.curso__acciones { display: flex; gap: 8px; flex-wrap: wrap; }

.curso__btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 10px 16px;
	border-radius: 8px;
	font-size: .86rem;
	font-weight: 700;
	text-decoration: none;
	background: var(--sc-rojo);
	color: #fff;
	border: 1px solid var(--sc-rojo);
	transition: background .15s ease, color .15s ease;
}

.curso__btn:hover { background: #c01d24; color: #fff; text-decoration: none; }
.curso__btn svg { width: 15px; height: 15px; }

.curso__btn--linea {
	background: #fff;
	color: var(--sc-tinta);
	border-color: var(--sc-linea);
}

.curso__btn--linea:hover { background: #f1f5f9; color: var(--sc-tinta); }

/* ---------- Banda comparativa ---------- */

.cursos-compara {
	background: linear-gradient(90deg, #f2f7fc 0%, #f2f7fc 50%, #fdf4f4 50%, #fdf4f4 100%);
	border-top: 1px solid var(--sc-linea);
	padding: 36px 0;
}

.cursos-compara__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
}

.cursos-compara__col {
	display: flex;
	align-items: flex-start;
	gap: 16px;
}

.cursos-compara__col + .cursos-compara__col {
	border-left: 1px solid var(--sc-linea);
	padding-left: 40px;
}

.cursos-compara__icono {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 11px;
	flex: none;
	color: #fff;
}

.cursos-compara__icono svg { width: 22px; height: 22px; }
.cursos-compara__icono--libre { background: var(--sc-azul); }
.cursos-compara__icono--premium { background: var(--sc-rojo); }

.cursos-compara h3 {
	font-size: 1.06rem;
	margin: 0 0 5px;
	color: var(--sc-tinta);
}

.cursos-compara p {
	font-size: .92rem;
	line-height: 1.6;
	color: var(--sc-suave);
	margin: 0;
}

@media (max-width: 860px) {
	.cursos-compara__inner { grid-template-columns: 1fr; gap: 26px; }
	.cursos-compara { background: #f6f9fc; }
	.cursos-compara__col + .cursos-compara__col {
		border-left: 0;
		padding-left: 0;
		border-top: 1px solid var(--sc-linea);
		padding-top: 26px;
	}
}

@media (max-width: 600px) {
	.cursos-hero { padding: 44px 0 40px; }
	.cursos-rejilla { grid-template-columns: 1fr; }
	.curso__compra { flex-direction: column; align-items: flex-start; }
	.curso__acciones { width: 100%; }
	.curso__btn { flex: 1; justify-content: center; }
}

/* =========================================================
   Material de curso
   ========================================================= */

.cursos-seccion--material { background: #f7f9fc; }
.cursos-seccion__icono--material { background: var(--sc-azul); }

.material-grupos { display: grid; gap: 30px; }

.material-grupo__titulo {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	font-size: 1.12rem;
	letter-spacing: -.015em;
	margin: 0 0 14px;
}

.material-grupo__titulo a { color: var(--sc-tinta); text-decoration: none; }
.material-grupo__titulo a:hover { color: var(--sc-azul); }

.material-grupo__etq {
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--sc-verde);
	background: #eaf6ef;
	border-radius: 5px;
	padding: 4px 9px;
}

.material-grupo__etq--pago { color: #9c1f14; background: #fdecea; }

.material-lista {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 12px;
}

.material {
	display: flex;
	align-items: center;
	gap: 13px;
	background: #fff;
	border: 1px solid var(--sc-linea);
	border-radius: 11px;
	padding: 14px 16px;
	text-decoration: none;
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.material:hover {
	border-color: #cfd9e6;
	box-shadow: 0 10px 26px rgba(10, 37, 64, .08);
	transform: translateY(-2px);
	text-decoration: none;
}

.material__ext {
	flex: none;
	width: 42px;
	height: 42px;
	border-radius: 9px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .68rem;
	font-weight: 800;
	letter-spacing: .02em;
	background: #e8f5ee;
	color: #16653c;
}

.material__ext--word { background: #e8f0fb; color: #1c4f9c; }
.material__ext--pdf  { background: #fdeaea; color: #a12626; }
.material__ext--bi   { background: #fef6e0; color: #8a5a00; }

.material__txt { flex: 1; min-width: 0; }

.material__titulo {
	display: block;
	font-size: .95rem;
	font-weight: 650;
	line-height: 1.35;
	color: var(--sc-tinta);
}

.material__estado {
	display: block;
	font-size: .8rem;
	color: var(--sc-verde);
	margin-top: 2px;
}

.material--bloqueado .material__estado { color: #9c1f14; }

.material__flecha { flex: none; color: #9db1c8; transition: transform .15s ease; }
.material:hover .material__flecha { transform: translateX(3px); color: var(--sc-azul); }

/* Bloque dentro de la ficha del curso */

.material-bloque {
	margin: 36px 0 0;
	padding-top: 28px;
	border-top: 1px solid var(--sc-linea);
}

.material-bloque__titulo { font-size: 1.25rem; letter-spacing: -.015em; margin: 0 0 5px; }
.material-bloque__texto { font-size: .95rem; color: var(--sc-suave); margin: 0 0 16px; }

/* Aviso en la ficha del material */

.material-aviso {
	background: #eef5fb;
	border: 1px solid #cfe0ef;
	border-left: 4px solid var(--sc-azul);
	border-radius: 11px;
	padding: 20px 22px;
	margin: 0 0 26px;
}

.material-aviso--bloqueado {
	background: #fdf3f2;
	border-color: #f3d3cf;
	border-left-color: var(--sc-rojo);
}

.material-aviso__etq {
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--sc-azul);
	margin: 0 0 5px;
}

.material-aviso--bloqueado .material-aviso__etq { color: var(--sc-rojo); }

.material-aviso__curso { font-size: 1.15rem; letter-spacing: -.015em; margin: 0 0 8px; }
.material-aviso__curso a { color: var(--sc-tinta); text-decoration: none; }
.material-aviso__curso a:hover { color: var(--sc-azul); }

.material-aviso__texto {
	font-size: .95rem;
	line-height: 1.6;
	color: var(--sc-suave);
	margin: 0;
}

.material-aviso__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	background: var(--sc-rojo);
	color: #fff;
	font-size: .92rem;
	font-weight: 700;
	padding: 12px 24px;
	border-radius: 9px;
	text-decoration: none;
	transition: background .15s ease;
}

.material-aviso__btn:hover { background: #c01d24; color: #fff; text-decoration: none; }

/* En un material bloqueado no se ofrece la descarga gratuita. */
.material-restringido .sowtec-descarga,
.material-restringido .panel-descarga__estado,
.material-restringido .panel-descarga__titulo,
.material-restringido .panel-descarga__sub { display: none !important; }

/* =========================================================
   Descargas de los videos
   ========================================================= */

.cursos-hero--corto { padding: 50px 0 44px; }

.videofile-rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 24px;
}

.videofile {
	background: #fff;
	border: 1px solid var(--sc-linea);
	border-radius: 14px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .16s ease, border-color .16s ease, transform .16s ease;
}

.videofile:hover {
	border-color: #cfd9e6;
	box-shadow: 0 16px 40px rgba(10, 37, 64, .10);
	transform: translateY(-3px);
}

.videofile__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	background: linear-gradient(135deg, #e8eef5, #d7e3ef);
	overflow: hidden;
}

.videofile__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.videofile__sinimagen {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	font-weight: 800;
	color: #8fa6bd;
	letter-spacing: .06em;
}

.videofile__play {
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--sc-rojo);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.videofile__play svg { width: 17px; height: 17px; }

.videofile__cuerpo {
	padding: 18px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 9px;
	flex: 1;
}

.videofile__titulo {
	font-size: 1.02rem;
	font-weight: 700;
	line-height: 1.32;
	letter-spacing: -.015em;
	margin: 0;
}

.videofile__titulo a { color: var(--sc-tinta); text-decoration: none; }
.videofile__titulo a:hover { color: var(--sc-azul); }

.videofile__desc {
	font-size: .9rem;
	line-height: 1.55;
	color: var(--sc-suave);
	margin: 0;
	flex: 1;
}

.videofile__pie {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 4px;
}

.videofile__pie .material__ext { width: 38px; height: 38px; font-size: .64rem; }

.videofile__btn {
	margin-left: auto;
	background: var(--sc-azul);
	color: #fff;
	font-size: .86rem;
	font-weight: 700;
	padding: 10px 18px;
	border-radius: 8px;
	text-decoration: none;
	transition: background .15s ease;
}

.videofile__btn:hover { background: #14598a; color: #fff; text-decoration: none; }

.videofile-paginado {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 34px;
}

.videofile-paginado .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid var(--sc-linea);
	border-radius: 8px;
	background: #fff;
	font-size: .92rem;
	font-weight: 600;
	color: var(--sc-tinta);
	text-decoration: none;
}

.videofile-paginado .page-numbers.current {
	background: var(--sc-azul);
	border-color: var(--sc-azul);
	color: #fff;
}

.material-aviso--video {
	background: #f4f8fc;
	border-color: #d4e3f0;
	border-left-color: var(--sc-rojo);
}

.material-aviso--video .material-aviso__etq { color: var(--sc-rojo); }

.material-aviso__btn--yt { background: var(--sc-rojo); }
.material-aviso__btn--yt:hover { background: #c01d24; }
