* { box-sizing: border-box; }
p{
	line-height: 1.5;
}
:root {
	--red: #b3000a;
	--red-dark: #7a0006;
	--gold: #d7a307;
	--soft: #faf9f7;
	--ink: #111318;
	--muted: #5c6670;
	--card: #ffffff;
	--shadow: 0 18px 40px rgba(17, 19, 24, 0.08);
	--radius: 18px;
}
body {
	margin: 0;
	font-family: "Montserrat", sans-serif;
	color: var(--ink);
	background: #ffffff;
	scroll-behavior: smooth;
	opacity: 1;
	transition: opacity 0.35s ease;
}
body.js-enabled {
	opacity: 0;
	animation: pageFadeIn 0.45s ease forwards;
}
body.page-exit {
	opacity: 0;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
ul { padding-left: 20px; margin: 0; }

.container {
	width: min(1200px, 92%);
	margin: 0 auto;
}

.top-info {
	background: #ffffff;
	font-size: 13px;
	color: var(--muted);
	border-bottom: 1px solid #f0f0f0;
}
.top-info__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 0;
	gap: 16px;
	flex-wrap: wrap;
}
.top-info__left {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}
.top-info__right {
	display: flex;
	gap: 10px;
}
.dot {
	width: 8px;
	height: 8px;
	background: var(--red);
	border-radius: 999px;
	display: inline-block;
}
.sep { opacity: 0.5; }
.chip {
	background: #ffffff;
	padding: 4px 10px;
	border-radius: 999px;
	border: 1px solid #f0e0b9;
	color: var(--red);
}
.icon{
	margin-right: 6px;
	color: #111318;
}
.site-header {
	position: sticky;
	top: 0;
	background: #ffffff;
	z-index: 10;
	border-bottom: 1px solid #f0f0f0;
	box-shadow: 1px 4px 6px rgba(0, 0, 0, 0.1);
}
.nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 18px 0;
}
.logo {
	display: flex;
	align-items: center;
	gap: 12px;
	font-weight: 700;
}
.logo-img {
	width: 120PX;
}
.logo-text span {
	font-size: 18px;
	letter-spacing: 1px;
}
.logo-text small {
	display: block;
	font-size: 12px;
	color: var(--muted);
	letter-spacing: 2px;
}
.nav-links {
	display: flex;
	gap: 20px;
	font-weight: 600;
	color: var(--muted);
}
.nav-links a {
	position: relative;
	padding-bottom: 6px;
	transition: color 0.25s ease;
}
.nav-links a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background: var(--gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.25s ease;
}
.nav-links a.active {
	color: var(--red);
}
.nav-links a.active::after,
.nav-links a:hover::after {
	transform: scaleX(1);
}
.nav-links a.is-activating {
	color: var(--red);
}
.nav-links a.is-activating::after {
	transform: scaleX(1);
	transition: none;
	animation: navUnderline 0.45s ease;
}
.nav-actions {
	display: flex;
	gap: 12px;
}

.button, button {
	border: 0;
	border-radius: 999px;
	padding: 12px 22px;
	cursor: pointer;
	font-weight: 600;
	font-family: inherit;
	transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, color 0.25s ease;
}
.button:hover, button:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.button.primary { background: var(--red); color: #fff; }
.button.outline { background: transparent; border: 1px solid var(--gold); color: var(--red); }
.button.ghost { background: #ffffff; border: 1px solid #f0e0b9; color: var(--red); }

.hero .button.outline { color: #ffffff; }

.hero {
	position: relative;
	min-height: 72vh;
	display: flex;
	align-items: center;
	color: #ffffff;
}
.hero__bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
}
.hero__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	animation: heroSlide 16s infinite;
	animation-timing-function: ease-in-out;
	background-size: cover;
	background-position: center;
	filter: saturate(1.05);
	will-change: opacity;
}
.hero__slide::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(120deg, rgba(179, 0, 10, 0.78), rgba(122, 0, 6, 0.68));
}
.slide-1 { background-image: url("/assets/img/pexels-chetanvlad-2892618.webp"); animation-delay: 0s; }
.slide-2 { background-image: url("/assets/img/colsan-ltda-LMb98OOtoYU-unsplash.webp"); animation-delay: 4s; }
.slide-3 { background-image: url("/assets/img/ehmitrich-Q3WVbAfdOoY-unsplash.webp"); animation-delay: 8s; }
.slide-4 { background-image: url("/assets/img/pexels-deyler-rivera-segura-1300296248-29506742.webp"); animation-delay: 12s; }

@keyframes heroSlide {
	0% { opacity: 0; transform: scale(1.04); }
	6% { opacity: 1; transform: scale(1.02); }
	24% { opacity: 1; transform: scale(1.01); }
	32% { opacity: 0; transform: scale(1.04); }
	100% { opacity: 0; transform: scale(1.04); }
}
@keyframes pageFadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
}
@keyframes navUnderline {
	0% { transform: scaleX(0.4); }
	100% { transform: scaleX(1); }
}
.hero__content {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 40px;
	padding: 80px 0;
}
.hero__text h1 {
	font-family: "Playfair Display", serif;
	font-size: clamp(32px, 4vw, 54px);
	margin: 10px 0;
}
.hero__text p {
	max-width: 520px;
	color: rgba(255, 255, 255, 0.85);
}
.badge {
	display: inline-block;
	padding: 6px 14px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	color: #ffffff;
	border: 1px solid rgba(215, 163, 7, 0.65);
	font-size: 12px;
	letter-spacing: 1px;
	text-transform: uppercase;
}
.actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.hero__card {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.hero__card-inner {
	background: #ffffff;
	color: var(--ink);
	padding: 26px;
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	border: 1px solid #f0e0b9;
	width: min(360px, 100%);
}
.hero__card-inner ul { margin: 12px 0 20px; color: var(--muted); }
.hero__dots { display: flex; gap: 6px; margin-top: 24px; }
.hero__dots span { width: 8px; height: 8px; border-radius: 999px; background: rgba(179, 0, 10, 0.25); }
.hero__dots span:first-child { background: var(--red); }

.section { padding: 70px 0; }
.section.soft { background: #ffffff; }
.section__header { text-align: center; margin-bottom: 30px; }
.section__header h2 { font-family: "Playfair Display", serif; font-size: 32px; margin-bottom: 6px; }
.section__bar { width: 60px; height: 3px; background: var(--gold); margin: 0 auto; border-radius: 99px; }

.split {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 40px;
	align-items: center;
}
.features { display: grid; gap: 16px; margin-top: 20px; }
.mt-24 { margin-top: 24px; }
.feature {
	background: #ffffff;
	padding: 16px 18px;
	border-radius: 14px;
	border: 1px solid #f3ead0;
}
.card.highlight {
	background: #ffffff;
	border: 1px solid #f0e0b9;
	padding: 24px;
	border-radius: var(--radius);
	box-shadow: var(--shadow);
}

.filters {
	display: flex;
	gap: 12px;
	justify-content: center;
	margin-bottom: 28px;
	flex-wrap: wrap;
}
input, select {
	padding: 12px 16px;
	border-radius: 999px;
	border: 1px solid #f0e0b9;
	font-family: inherit;
	min-width: 240px;
}

.grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
}
.course {
	background: #ffffff;
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: var(--shadow);
	border: 1px solid #f3ead0;
	display: grid;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.course:hover {
	transform: translateY(-6px);
	box-shadow: 0 24px 50px rgba(17, 19, 24, 0.12);
}
.course__image {
	height: 250px;
	background: #f3f3f3 center/cover no-repeat;
	display: flex;
	align-items: center;
}
.course__image img {
	width: 90%;
	height: 90%;
	object-fit: contain;
}
.course__body{
	padding: 20px;
}
.course-img-equipos { background-image: url("/assets/img/03_EQUIPOS_MOVILES.webp"); }
.course-img-altura { background-image: url("/assets/img/02_TRABAJO_EN_ALTURA.webp"); }
.course-img-emergencias { background-image: url("/assets/img/01_RESPUESTA_A_EMERGENCIAS.webp"); }
.course-img-quimicas { background-image: url("/assets/img/09_SUSTANCIAS_QUIMICAS.webp"); }
.course-img-herramientas { background-image: url("/assets/img/08_HERRAMIENTAS_MANUALES.webp"); }
.course-img-incendio { background-image: url("/assets/img/07_INCENDIO_Y_EXPLOSION.webp"); }
.course-img-izaje { background-image: url("/assets/img/06_ELEVACION_IZAJE.webp"); }
.course-img-electrica { background-image: url("/assets/img/05_SEGURIDAD_ELECTRICA.webp"); }
.course-img-bloqueo { background-image: url("/assets/img/04_AISLAMIENTO_Y_BLOQUEO.webp"); }
.course__body { padding: 20px; display: grid; gap: 10px; }

.modal {
	position: fixed;
	inset: 0;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 24px;
	z-index: 50;
}
.modal.is-open {
	display: flex;
}
.modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(17, 19, 24, 0.55);
	backdrop-filter: blur(2px);
}
.modal__panel {
	position: relative;
	background: #ffffff;
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	border: 1px solid #f0e0b9;
	width: min(680px, 100%);
	padding: 28px;
	margin: 0 auto;
	transform: translateY(12px);
	opacity: 0;
	animation: modalIn 0.3s ease forwards;
}
.modal__close {
	position: absolute;
	top: 16px;
	right: 16px;
	width: 40px;
	height: 40px;
	border-radius: 999px;
	background: #ffffff;
	border: 1px solid #f0e0b9;
	color: var(--ink);
	box-shadow: var(--shadow);
	padding: 0;
}
.modal__header {
	display: grid;
	gap: 6px;
	margin-bottom: 18px;
}
.modal__tag {
	margin: 0;
	font-size: 12px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--red);
}
.modal__meta {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	padding: 14px 16px;
	border-radius: 12px;
	border: 1px solid #f0e0b9;
	background: #fffaf0;
}
.modal__label {
	display: block;
	font-size: 12px;
	color: var(--muted);
	letter-spacing: 0.6px;
	text-transform: uppercase;
}
.modal__value {
	font-weight: 600;
}
.modal__summary {
	margin-top: 16px;
	color: var(--muted);
}
body.modal-open {
	overflow: hidden;
}

@keyframes modalIn {
	to {
		transform: translateY(0);
		opacity: 1;
	}
}

.certs {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 30px 0;
}
.cert {
	background: #ffffff;
	padding: 18px;
	border-radius: 14px;
	border: 1px solid #f3ead0;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.cert:hover {
	transform: translateY(-4px);
	box-shadow: 0 20px 40px rgba(17, 19, 24, 0.08);
}

.search {
	background: #ffffff;
	padding: 26px;
	border-radius: var(--radius);
	text-align: center;
	border: 1px solid #f3ead0;
}
.search__fields {
	display: flex;
	gap: 12px;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 16px;
}
.search__help {
	margin: 6px 0 0;
	color: var(--muted);
}
.results {
	margin-top: 18px;
	display: grid;
	gap: 10px;
}
.result-group {
	border: 1px solid #f0e0b9;
	border-radius: 12px;
	padding: 12px;
	background: #fff;
}
.result-group__title {
	font-weight: 700;
	color: var(--red);
	margin-bottom: 10px;
}
.result-group__list {
	display: grid;
	gap: 10px;
}
.result {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 14px;
	border-radius: 10px;
	border: 1px solid #f0e0b9;
	color: var(--ink);
	background: #fff;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.result:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow);
}
.result__name {
	font-weight: 600;
}
.result__info {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.result__view {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: 999px;
	border: 1px solid #f0e0b9;
	color: var(--red);
	background: #fff;
}
.result__icon {
	font-size: 16px;
}
.results__empty {
	color: var(--muted);
}

.footer {
	background: #ffffff;
	color: var(--muted);
	padding: 40px 0;
	border-top: 1px solid #f0e0b9;
}
.footer__content {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}

.reveal {
	opacity: 1;
	transform: translateY(0);
}
.js-enabled .reveal {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.5s ease, transform 0.5s ease;
}
.js-enabled .reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

@media (max-width: 980px) {
	.nav { flex-wrap: wrap; }
	.nav-links { display: none; }
	.hero__content { grid-template-columns: 1fr; }
	.split { grid-template-columns: 1fr; }
	.grid { grid-template-columns: 1fr; }
	.certs { grid-template-columns: 1fr; }
	.footer__content { grid-template-columns: 1fr; }
	.modal__meta { grid-template-columns: 1fr; }
}

.icon-lg{
	width: 100%;
	font-size: 6em;
	text-align: center;
	color: #b3000a;
}
.card{
	text-align: center;
}
.card h3{
	margin-bottom: 0px;
}
.flex{
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: center;
}
.flex-1-2{
	width: 100%;
	width: 50%;
	line-height: 1.5;
	text-align: justify;
}
.center{
	text-align: center;
	justify-content: center;
}
.footer-copy{
	background-color: #111318;
	padding: 10px 0;
	text-align: center;
	color: #f3f3f3;
	font-size: 12px;
}
.feature{
	padding: 60px 0;
	background-color: #fff;
	box-shadow: 20px 40px 60px rgba(17, 19, 24, 0.08);
}
.img-cip{
	width: 100%;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
.img-cip img{
	width: 200px;
}