/* =========================================================
   Colegio de Técnicos Distrito II — hoja de estilos principal (v2.0)
   ========================================================= */

:root {
	--td2-azul: #003366;
	--td2-celeste: #91BDCC;
	--td2-celeste-claro: #66CCFF;
	--td2-verde: #00BF63;
	--td2-naranja: #FFB435;
	--td2-blanco: #FFFFFF;

	--td2-azul-oscuro: #002347;
	--td2-gris-texto: #33454f;
	--td2-borde: #d8e6ea;

	--td2-font-display: 'Cooper Hewitt', 'Montserrat', Arial, sans-serif;
	--td2-font-body: 'Montserrat', Arial, sans-serif;

	--td2-radius: 10px;
	--td2-container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--td2-font-body); color: var(--td2-gris-texto); background: var(--td2-blanco); line-height: 1.6; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { margin: 0; padding: 0; list-style: none; }

.skip-link { position: absolute; left: -9999px; top: 0; background: var(--td2-azul); color: #fff; padding: 10px 16px; z-index: 999; }
.skip-link:focus { left: 10px; top: 10px; }

.td2-wrap { max-width: var(--td2-container); margin: 0 auto; padding: 0 20px; }

h1, h2, h3, h4 { font-family: var(--td2-font-display); color: var(--td2-azul); margin: 0 0 .6em; }
.section-title { font-size: 1.05rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 1rem; }
.section { padding: 34px 20px; }

/* ---------------- Encabezado ---------------- */
.site-header-top { background: var(--td2-celeste); }
.site-header-top__inner { display: flex; align-items: center; justify-content: space-between; padding: 12px 20px; }
.site-logo {
	display: flex; align-items: center;
	background: #fff; border-radius: 8px; padding: 8px 16px;
	box-shadow: 0 1px 3px rgba(0,51,102,.12);
	order: 1;
}
.site-logo img { max-height: 56px; width: auto; display: block; }
.site-logo a { display: block; }
.site-logo__placeholder { display: flex; flex-direction: column; color: var(--td2-azul); }
.site-logo__placeholder strong { font-family: var(--td2-font-display); font-weight: 800; font-size: 1.05rem; text-transform: uppercase; }
.site-logo__placeholder small { font-size: .72rem; letter-spacing: .04em; }

.social-icons { display: flex; gap: 10px; order: 2; }
.social-icons__link {
	display: flex; align-items: center; justify-content: center;
	width: 34px; height: 34px; border-radius: 50%;
	border: 1.6px solid var(--td2-azul); color: var(--td2-azul);
	transition: background .15s ease, color .15s ease;
}
.social-icons__link svg { width: 17px; height: 17px; }
.social-icons__link:hover { background: var(--td2-azul); color: #fff; }
.social-icons--footer .social-icons__link { border-color: var(--td2-celeste-claro); color: var(--td2-celeste-claro); }
.social-icons--footer .social-icons__link:hover { background: var(--td2-celeste-claro); color: var(--td2-azul); }

.mobile-menu-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	border: none;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(0,51,102,.12);
	cursor: pointer;
	padding: 0;
}
.td2-menu-toggle-checkbox { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }

.mobile-menu-toggle span { display: block; width: 20px; height: 2px; background: var(--td2-azul); border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }
#td2-menu-toggle:checked ~ .site-header-top .mobile-menu-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
#td2-menu-toggle:checked ~ .site-header-top .mobile-menu-toggle span:nth-child(2) { opacity: 0; }
#td2-menu-toggle:checked ~ .site-header-top .mobile-menu-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.site-nav-primary { background: var(--td2-azul); }
.site-nav-primary__inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 0 20px; }
.nav-menu--primary { display: flex; flex-wrap: wrap; }
.nav-menu--primary > li { position: relative; }
.nav-menu--primary > li > a { display: block; padding: 16px 14px; color: #fff; font-weight: 700; font-size: .82rem; text-transform: uppercase; letter-spacing: .03em; }
.nav-menu--primary > li:hover > a, .nav-menu--primary > li.current-menu-item > a { color: var(--td2-celeste-claro); }

.nav-menu--secondary { display: flex; flex-wrap: wrap; }
.nav-menu--secondary > li { position: relative; }
.nav-menu--secondary > li > a { display: block; padding: 10px 14px; color: var(--td2-azul); font-weight: 700; font-size: .74rem; text-transform: uppercase; letter-spacing: .03em; }

.sub-menu { display: none; position: absolute; top: 100%; left: 0; min-width: 230px; background: #fff; border-radius: 0 0 8px 8px; box-shadow: 0 10px 24px rgba(0,51,102,.18); z-index: 60; padding: 6px 0; }
li:hover > .sub-menu, li:focus-within > .sub-menu { display: block; }
.sub-menu li a { display: block; padding: 9px 16px; color: var(--td2-azul); font-weight: 600; font-size: .8rem; text-transform: none; letter-spacing: normal; white-space: nowrap; }
.sub-menu li a:hover { background: #eaf3f6; }

.nav-buttons { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.btn-buscador { background: var(--td2-naranja); color: var(--td2-azul); font-weight: 800; text-transform: uppercase; font-size: .8rem; letter-spacing: .03em; padding: 10px 20px; border-radius: 6px; white-space: nowrap; }
.btn-buscador:hover { filter: brightness(1.05); }
.btn-matriculados { background: transparent; color: var(--td2-naranja); border: 2px solid var(--td2-naranja); }
.btn-matriculados:hover { background: var(--td2-naranja); color: var(--td2-azul); }

.site-nav-secondary { background: #eef6f8; border-bottom: 1px solid var(--td2-borde); }

/* ---------------- Slider / banner de portada ---------------- */
.td2-slider { position: relative; overflow: hidden; background: var(--td2-celeste); }
.td2-slider__track { display: flex; transition: transform .5s ease; }
.td2-slider__slide { min-width: 100%; flex-shrink: 0; }
.td2-slider__slide img { width: 100%; height: 340px; object-fit: cover; display: block; }
.td2-slider__dots { position: absolute; bottom: 16px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; }
.td2-slider__dots button { width: 10px; height: 10px; border-radius: 50%; border: 2px solid #fff; background: rgba(255,255,255,.4); padding: 0; cursor: pointer; }
.td2-slider__dots button.is-active { background: #fff; }
@media (max-width: 640px) {
	.td2-slider__slide img { height: 200px; }
}

/* ---------------- Secciones de portada ---------------- */
.section-agenda { background: #fff; }
.section-agenda__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px; max-width: var(--td2-container); margin: 0 auto; }
.agenda-panel, .capacitaciones-panel { border-radius: var(--td2-radius); padding: 20px; }
.agenda-panel { background: #eaf3f6; }
.capacitaciones-panel { background: var(--td2-verde); }
.capacitaciones-panel .section-title { color: #fff; }

.agenda-list__item { margin-bottom: 10px; }
.agenda-list__link { display: flex; align-items: center; gap: 14px; background: #fff; border-radius: 8px; padding: 10px 14px; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.agenda-list__date { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 46px; color: var(--td2-azul); line-height: 1.1; }
.agenda-list__date strong { font-size: 1.15rem; font-family: var(--td2-font-display); }
.agenda-list__date em { font-style: normal; font-size: .68rem; letter-spacing: .06em; }
.agenda-list__title { font-weight: 600; font-size: .92rem; color: var(--td2-gris-texto); }

.capacitaciones-list__item { margin-bottom: 10px; }
.capacitaciones-list__link { display: block; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.4); border-radius: 8px; padding: 12px 14px; }
.capacitaciones-list__estado { display: inline-block; font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #fff; background: rgba(0,0,0,.18); padding: 2px 8px; border-radius: 4px; margin-bottom: 6px; }
.capacitaciones-list__title { display: block; color: #fff; font-weight: 700; font-size: .92rem; }
.section-empty { color: #6a7c85; font-size: .9rem; }

.section-areas { background: var(--td2-celeste); }
.section-areas .section-title, .section-areas h2 { color: var(--td2-azul); text-align: center; }
.areas-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: var(--td2-container); margin: 0 auto; }
.area-card { background: #fff; border-radius: var(--td2-radius); padding: 26px 16px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 12px; transition: transform .15s ease, box-shadow .15s ease; }
.area-card--destacada { background: var(--td2-naranja); }
.area-card--destacada .area-card__icon { stroke: var(--td2-azul); }
.area-card--destacada .area-card__title { color: var(--td2-azul); font-weight: 800; }
.area-card:hover { transform: translateY(-3px); box-shadow: 0 8px 18px rgba(0,51,102,.15); }
.area-card__icon { width: 46px; height: 46px; }
.area-card__title { font-weight: 800; color: var(--td2-azul); text-transform: uppercase; font-size: .84rem; letter-spacing: .03em; }

.section-accesos { background: var(--td2-celeste); }
.section-accesos .section-title, .section-accesos h2 { text-align: center; }
.accesos-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: var(--td2-container); margin: 0 auto; }
.acceso-card {
	background: #fff; border-radius: 16px; padding: 20px 18px; text-align: center; font-weight: 800;
	color: var(--td2-azul); text-transform: uppercase; letter-spacing: .03em; font-size: .82rem;
	display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 14px;
	transition: transform .15s ease, box-shadow .15s ease;
}
.acceso-card:hover { transform: translateY(-3px); box-shadow: 0 8px 18px rgba(0,51,102,.15); }
.acceso-card__logo {
	display: flex; align-items: center; justify-content: center;
	width: 100%; height: 64px;
}
.acceso-card__logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.acceso-card__logo--dark {
	background: #0d2438; border-radius: 10px; padding: 8px 14px;
}
.acceso-card__logo--dark img { max-height: 48px; }
.acceso-card__title { color: var(--td2-azul); }

.section-noticias { background: #fff; }
.section-noticias .section-title, .section-noticias h2 { text-align: center; }
.noticias-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: var(--td2-container); margin: 0 auto; }
.noticia-card { border: 1px solid var(--td2-borde); border-radius: var(--td2-radius); overflow: hidden; display: block; transition: transform .15s ease, box-shadow .15s ease; }
.noticia-card:hover { transform: translateY(-3px); box-shadow: 0 8px 18px rgba(0,51,102,.12); }
.noticia-card__media { aspect-ratio: 16/10; background: #eaf3f6; }
.noticia-card__placeholder { width: 100%; height: 100%; background: linear-gradient(135deg, #eaf3f6, #d8e6ea); }
.noticia-card__body { padding: 14px 16px; }
.noticia-card__title { font-size: .95rem; margin: 0 0 6px; color: var(--td2-azul); }
.noticia-card__excerpt { font-size: .82rem; color: #5b6d76; margin: 0; }
.section-noticias__more { text-align: center; margin-top: 24px; }

.btn-outline { display: inline-block; border: 2px solid var(--td2-azul); color: var(--td2-azul); font-weight: 800; text-transform: uppercase; font-size: .8rem; letter-spacing: .03em; padding: 10px 22px; border-radius: 6px; }
.btn-outline:hover { background: var(--td2-azul); color: #fff; }

/* ---------------- Páginas de contenido ---------------- */
.content-page { padding: 40px 0 60px; }
.page-title { font-size: 1.6rem; }
.single-noticia__meta { color: #6a7c85; font-size: .85rem; margin: -8px 0 20px; }
.single-noticia__media { margin-bottom: 20px; border-radius: var(--td2-radius); overflow: hidden; }
.page-content p { margin: 0 0 1em; }

.resoluciones-list { max-width: 760px; margin: 0 auto; border: 1px solid var(--td2-borde); border-radius: var(--td2-radius); overflow: hidden; list-style: none; padding: 0; }
.resoluciones-list li { border-bottom: 1px solid var(--td2-borde); }
.resoluciones-list li:last-child { border-bottom: none; }
.resoluciones-list li a, .resoluciones-list li span { display: block; padding: 12px 18px; font-size: .92rem; color: var(--td2-azul); font-weight: 600; }
.resoluciones-list li a:hover { background: #eaf3f6; }
.descargas-wrap { max-width: 760px; margin: 0 auto; }
.descargas-subtitulo { margin: 34px 0 12px; font-size: 1.05rem; color: var(--td2-azul); text-align: center; }
.descargas-buscador-wrap { margin: 0 0 22px; }
.descargas-buscador {
	width: 100%; box-sizing: border-box; padding: 12px 18px; font-size: .95rem;
	border: 1.6px solid var(--td2-borde); border-radius: var(--td2-radius);
	color: var(--td2-azul); font-family: inherit; background: #fff;
}
.descargas-buscador:focus { outline: none; border-color: var(--td2-azul); }
.descargas-buscador::placeholder { color: #8a9aa5; }
.descargas-sin-resultados { text-align: center; color: #8a9aa5; font-style: italic; margin-top: 14px; }

/* Layout de 2 columnas: lista (izquierda) + imágenes (derecha) */
.descargas-columnas { display: grid; grid-template-columns: 2fr 1fr; gap: 40px; max-width: var(--td2-container); margin: 0 auto; align-items: start; }
.descargas-col-lista .descargas-wrap { max-width: none; margin: 0; }
.descargas-col-imagenes { display: flex; flex-direction: column; gap: 22px; position: sticky; top: 20px; }
.descargas-imagen { width: 100%; height: auto; border-radius: var(--td2-radius); border: 1px solid var(--td2-borde); display: block; }

/* Acordeón Año → Mes */
.descargas-acordeon { border: 1px solid var(--td2-borde); border-radius: var(--td2-radius); overflow: hidden; margin-bottom: 10px; }
.descargas-anio { border-bottom: 1px solid var(--td2-borde); }
.descargas-anio:last-child { border-bottom: none; }
.descargas-anio > summary {
	cursor: pointer; list-style: none; padding: 14px 18px; font-weight: 800;
	color: #fff; background: var(--td2-azul); font-size: 1rem;
}
.descargas-anio > summary::-webkit-details-marker { display: none; }
.descargas-anio > summary::before { content: "▸ "; }
.descargas-anio[open] > summary::before { content: "▾ "; }
.descargas-mes { border-top: 1px solid var(--td2-borde); }
.descargas-mes > summary {
	cursor: pointer; list-style: none; padding: 10px 18px 10px 30px; font-weight: 700;
	color: var(--td2-azul); background: #f5f9fa; font-size: .9rem;
}
.descargas-mes > summary::-webkit-details-marker { display: none; }
.descargas-mes > summary::before { content: "▸ "; }
.descargas-mes[open] > summary::before { content: "▾ "; }
.descargas-mes .resoluciones-list { max-width: none; border: none; border-radius: 0; border-top: 1px solid var(--td2-borde); }
.descargas-mes .resoluciones-list li a { padding-left: 34px; }

@media (max-width: 900px) {
	.descargas-columnas { grid-template-columns: 1fr; }
	.descargas-col-imagenes { position: static; flex-direction: row; flex-wrap: wrap; }
	.descargas-col-imagenes .descargas-imagen { width: calc(50% - 11px); }
}
@media (max-width: 560px) {
	.descargas-col-imagenes { flex-direction: column; }
	.descargas-col-imagenes .descargas-imagen { width: 100%; }
}

/* ---------------- Pie de página ---------------- */
.newsletter-strip { background: var(--td2-celeste); }
.newsletter-strip__inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding: 20px; }
.newsletter-strip__text { font-family: var(--td2-font-display); font-weight: 800; color: var(--td2-azul); margin: 0; text-transform: uppercase; font-size: .95rem; }
.newsletter-form { display: flex; gap: 10px; flex-wrap: wrap; }
.newsletter-form input[type="email"] { padding: 10px 14px; border-radius: 6px; border: none; min-width: 240px; font-family: var(--td2-font-body); }
.newsletter-form button { background: var(--td2-naranja); color: var(--td2-azul); border: none; font-weight: 800; text-transform: uppercase; padding: 10px 20px; border-radius: 6px; cursor: pointer; font-size: .8rem; letter-spacing: .03em; }

.footer-columns { background: var(--td2-azul); color: #cfe0e8; }
.footer-columns__inner { display: grid; grid-template-columns: 1fr 1.3fr 1.3fr; gap: 30px; padding: 34px 20px; }
.footer-col h4 { color: #fff; font-size: .85rem; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 14px; }
.footer-col__label { font-size: .78rem; margin: 14px 0 8px; color: #cfe0e8; }
.footer-list li { font-size: .84rem; margin-bottom: 8px; line-height: 1.4; }
.footer-list__label { color: #fff; font-weight: 700; }
.footer-col--brand strong { color: #fff; font-family: var(--td2-font-display); font-size: 1rem; text-transform: uppercase; }

.footer-bottom { background: var(--td2-azul-oscuro); }
.footer-bottom .td2-wrap { padding: 14px 20px; text-align: center; }
.footer-bottom p { margin: 0; font-size: .76rem; color: #a9c2cd; }

.screen-reader-text { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }

/* ---------------- Buscador de Profesionales ---------------- */
.td2-buscador__intro { max-width: 760px; margin: 0 auto 24px; text-align: center; }
.td2-buscador__controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.td2-buscador__tabs { display: flex; gap: 8px; }
.td2-buscador__tab {
	background: #fff; border: 2px solid var(--td2-azul); color: var(--td2-azul); font-weight: 700;
	text-transform: uppercase; font-size: .78rem; letter-spacing: .03em; padding: 8px 18px; border-radius: 6px; cursor: pointer;
}
.td2-buscador__tab.is-active { background: var(--td2-azul); color: #fff; }
.td2-buscador__search {
	flex: 1; min-width: 220px; max-width: 320px; padding: 9px 14px; border-radius: 6px; border: 1px solid var(--td2-borde); font-family: var(--td2-font-body);
}
.td2-buscador__table-wrap { overflow-x: auto; border: 1px solid var(--td2-borde); border-radius: var(--td2-radius); }
.td2-buscador__table { width: 100%; border-collapse: collapse; font-size: .85rem; min-width: 720px; }
.td2-buscador__table th { background: #eaf3f6; color: var(--td2-azul); text-align: left; padding: 10px 12px; font-size: .76rem; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; }
.td2-buscador__table td { padding: 9px 12px; border-top: 1px solid var(--td2-borde); vertical-align: top; }
.td2-buscador__table tbody tr:hover { background: #f7fbfc; }
.td2-buscador__empty { text-align: center; padding: 20px; color: #6a7c85; }
.td2-buscador__contacto { text-align: center; margin-top: 24px; font-size: .88rem; color: #5b6d76; }

@media (max-width: 640px) {
	.td2-buscador__controls { flex-direction: column; align-items: stretch; }
	.td2-buscador__search { max-width: none; }
}

/* ---------------- Responsive ---------------- */
@media (max-width: 900px) {
	.section-agenda__grid { grid-template-columns: 1fr; }
	.areas-grid, .accesos-grid, .noticias-grid { grid-template-columns: repeat(2, 1fr); }
	.footer-columns__inner { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.site-header-top__inner { padding: 10px 16px; }
	.site-logo { padding: 6px 12px; }
	.site-logo img { max-height: 44px; }
	.mobile-menu-toggle { display: flex; }

	.site-nav-primary, .site-nav-secondary { display: none; }
	#td2-menu-toggle:checked ~ .site-nav-primary,
	#td2-menu-toggle:checked ~ .site-nav-secondary { display: block; }

	.site-nav-primary__inner { flex-direction: column; align-items: stretch; padding: 10px 16px; }
	.nav-menu--primary, .nav-menu--secondary { flex-direction: column; width: 100%; }
	.nav-menu--primary > li, .nav-menu--secondary > li { position: static; }
	.nav-menu--primary > li > a, .nav-menu--secondary > li > a { padding: 12px 4px; border-bottom: 1px solid rgba(255,255,255,.12); }
	.nav-menu--secondary > li > a { border-bottom-color: var(--td2-borde); }
	.sub-menu { display: block; position: static; box-shadow: none; border-radius: 0; padding-left: 14px; background: rgba(255,255,255,.06); }
	.nav-menu--secondary .sub-menu { background: rgba(0,51,102,.04); }
	.nav-menu--primary .sub-menu li a { color: #fff; }
	.nav-menu--secondary .sub-menu li a { color: var(--td2-azul); }
	.nav-buttons { flex-direction: column; align-items: stretch; }
	.btn-buscador { display: block; text-align: center; margin: 12px 16px 4px; }
	.site-nav-secondary .td2-wrap { padding: 0 16px 12px; }

	.section { padding: 26px 16px; }
	.td2-wrap { padding: 0 16px; }
	.areas-grid, .accesos-grid, .noticias-grid { grid-template-columns: 1fr; }
	.newsletter-strip__inner { flex-direction: column; align-items: flex-start; }
	.newsletter-form { width: 100%; }
	.newsletter-form input[type="email"] { min-width: 0; flex: 1; }
}
@media (min-width: 641px) {
	.mobile-menu-toggle { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}
