/* ==========================================================================
   HackDevNet · Así trabajamos (template-parts/trabajamos.php)
   Usa los tokens de hdn.css y los componentes de paginas.css. Selectores con dos clases.
   ========================================================================== */

.hdn-trabajamos { --hdn-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; --hdn-negro: #141414; }

/* Sin JS se ven todos los paneles; con JS, solo el elegido. */
.hdn-trabajamos [role="tabpanel"][hidden] { display: none; }

.hdn-trabajamos .hdn-trabajamos__bajada { max-width: 46ch; font: 400 var(--hdn-t-m)/1.55 var(--hdn-fuente); color: var(--hdn-gris); }
.hdn-trabajamos .hdn-seccion--oscura .hdn-trabajamos__bajada { color: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-trabajamos__bajada strong { color: inherit; font-weight: 600; }
.hdn-trabajamos .hdn-seccion--oscura .hdn-trabajamos__bajada strong, .hdn-trabajamos .hdn-seccion--oscura .hdn-subtitulo { color: var(--hdn-blanco); }
.hdn-trabajamos .hdn-trabajamos__nota { margin-top: var(--hdn-e4); font: 400 var(--hdn-t-s)/1.55 var(--hdn-fuente); color: var(--hdn-gris); }
.hdn-trabajamos .hdn-trabajamos__nota a { color: var(--hdn-tinta); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* --- Portada con tablero ----------------------------------------------------- */
.hdn-trabajamos .hdn-trabajamos__portada-fila { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--hdn-e8); align-items: center; }
.hdn-trabajamos .hdn-trabajamos__compromisos { display: grid; gap: var(--hdn-e2); margin-top: var(--hdn-e5); list-style: none; }
.hdn-trabajamos .hdn-trabajamos__compromisos li { display: flex; align-items: center; gap: var(--hdn-e3); font: 500 var(--hdn-t-m)/1.4 var(--hdn-fuente); color: var(--hdn-tinta); }

.hdn-trabajamos .hdn-tablero, .hdn-trabajamos .hdn-flujo__arbol {
	margin: 0; overflow: hidden; background: var(--hdn-negro);
	border: 1px solid var(--hdn-tinta); border-radius: 6px; box-shadow: 0 30px 70px rgba(0, 0, 0, .22);
}
.hdn-trabajamos .hdn-tablero__barra { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.hdn-trabajamos .hdn-tablero__barra span { width: 11px; height: 11px; border-radius: 50%; background: #5A5A5A; }
.hdn-trabajamos .hdn-tablero__barra em { margin-left: 12px; font: normal 400 12px/1 var(--hdn-mono); color: var(--hdn-gris2); }
.hdn-trabajamos .hdn-tablero__columnas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 16px; }
.hdn-trabajamos .hdn-tablero__columna { display: grid; align-content: start; gap: 8px; }
.hdn-trabajamos .hdn-tablero__columna > p {
	display: flex; justify-content: space-between; margin-bottom: 2px;
	font: 500 11px/1.2 var(--hdn-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--hdn-gris2);
}
.hdn-trabajamos .hdn-tablero__tarjeta {
	display: grid; gap: 10px; padding: 10px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); border-radius: 4px;
	opacity: 0; animation: hdn-entra .45s ease forwards; animation-delay: calc(var(--i) * .18s + .2s);
}
.hdn-trabajamos .hdn-tablero__tarjeta b { font: 500 12px/1.35 var(--hdn-fuente); color: var(--hdn-blanco); }
.hdn-trabajamos .hdn-tablero__tarjeta i { display: block; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .14); position: relative; overflow: hidden; }
.hdn-trabajamos .hdn-tablero__tarjeta i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 30%; background: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-tablero__columna:nth-child(2) .hdn-tablero__tarjeta i::after { animation: hdn-carga 3.2s ease-in-out infinite alternate; }
.hdn-trabajamos .hdn-tablero__columna:nth-child(3) .hdn-tablero__tarjeta i::after { width: 100%; background: var(--hdn-blanco); }
.hdn-trabajamos .hdn-tablero__progreso { display: flex; align-items: center; gap: 12px; padding: 0 16px 16px; }
.hdn-trabajamos .hdn-tablero__progreso span { flex: 1; height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--hdn-blanco) 70%, rgba(255, 255, 255, .14) 70%); }
.hdn-trabajamos .hdn-tablero__progreso em { font: normal 400 11px/1 var(--hdn-mono); color: var(--hdn-gris2); }
@keyframes hdn-entra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes hdn-carga { from { width: 25%; } to { width: 80%; } }

/* --- Pestañas genéricas (botones) ------------------------------------------- */
.hdn .hdn-trabajamos [role="tab"] {
	margin: 0; cursor: pointer; font-family: var(--hdn-fuente); text-transform: none; letter-spacing: 0;
	box-shadow: none; transition: background-color var(--hdn-transicion), color var(--hdn-transicion), border-color var(--hdn-transicion);
}

/* --- Proceso: 5 etapas ---------------------------------------------------- */
.hdn-trabajamos .hdn-etapas__lista { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--hdn-linea); }
.hdn .hdn-trabajamos .hdn-etapas__lista [role="tab"] {
	display: grid; gap: var(--hdn-e2); justify-items: start; padding: var(--hdn-e4) var(--hdn-e3) var(--hdn-e4) 0;
	background: transparent; color: var(--hdn-gris); border: 0; border-top: 3px solid transparent; margin-top: -2px; border-radius: 0; text-align: left;
}
.hdn .hdn-trabajamos .hdn-etapas__lista [role="tab"]:hover { color: var(--hdn-tinta); border-top-color: var(--hdn-linea); }
.hdn .hdn-trabajamos .hdn-etapas__lista [role="tab"][aria-selected="true"] { color: var(--hdn-tinta); border-top-color: var(--hdn-carbon); }
.hdn-trabajamos .hdn-etapas__n { font: 500 var(--hdn-t-xs)/1 var(--hdn-mono); }
.hdn-trabajamos .hdn-etapas__t { font: 600 var(--hdn-t-m)/1.25 var(--hdn-fuente); }
.hdn-trabajamos .hdn-etapas__panel {
	display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: var(--hdn-e6); align-items: start;
	margin-top: var(--hdn-e6); padding: var(--hdn-e6); background: var(--hdn-panel); border-radius: var(--hdn-radio);
	animation: hdn-entra .35s ease;
}
.hdn-trabajamos .hdn-etapas__grande { font: 600 clamp(4rem, 3rem + 4vw, 7rem)/.9 var(--hdn-fuente); letter-spacing: -.04em; color: var(--hdn-tinta); }
.hdn-trabajamos .hdn-etapas__datos dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--hdn-e5); margin: var(--hdn-e5) 0 0; }
.hdn-trabajamos .hdn-etapas__datos dl > div { padding-top: var(--hdn-e3); border-top: 1px solid var(--hdn-linea); }
.hdn-trabajamos .hdn-etapas__datos dt { font: 600 .75rem/1.2 var(--hdn-fuente); letter-spacing: .14em; text-transform: uppercase; color: var(--hdn-gris); }
.hdn-trabajamos .hdn-etapas__datos dd { margin: var(--hdn-e2) 0 0; font: 400 var(--hdn-t-s)/1.6 var(--hdn-fuente); color: var(--hdn-texto); }

/* --- OpenSpec: diagrama interactivo ----------------------------------------- */
.hdn-trabajamos .hdn-flujo__nodos { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--hdn-e5); }
.hdn .hdn-trabajamos .hdn-flujo__nodos [role="tab"] {
	position: relative; display: flex; align-items: center; justify-content: center; gap: var(--hdn-e3); min-height: 60px; padding: var(--hdn-e3);
	background: transparent; color: var(--hdn-sobre-oscuro); border: 1px solid var(--hdn-linea-oscura); border-radius: 999px;
	font: 600 var(--hdn-t-s)/1.2 var(--hdn-fuente);
}
/* Flecha hacia el siguiente nodo. */
.hdn .hdn-trabajamos .hdn-flujo__nodos [role="tab"]:not(:last-child)::after {
	content: ""; position: absolute; left: 100%; top: 50%; width: var(--hdn-e5); height: 1px; background: rgba(255, 255, 255, .35);
}
.hdn .hdn-trabajamos .hdn-flujo__nodos [role="tab"]:not(:last-child)::before {
	content: ""; position: absolute; left: calc(100% + var(--hdn-e5) - 6px); top: calc(50% - 3px);
	border: 3px solid transparent; border-left: 6px solid rgba(255, 255, 255, .35); border-right: 0;
}
.hdn .hdn-trabajamos .hdn-flujo__nodos [role="tab"]:hover { border-color: rgba(255, 255, 255, .55); color: var(--hdn-blanco); }
.hdn .hdn-trabajamos .hdn-flujo__nodos [role="tab"][aria-selected="true"] { background: var(--hdn-blanco); color: var(--hdn-tinta); border-color: var(--hdn-blanco); }
.hdn-trabajamos .hdn-flujo__n {
	display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%;
	border: 1px solid currentColor; font: 500 12px/1 var(--hdn-mono);
}
/* Barra de tiempo del avance automático. */
.hdn-trabajamos .hdn-flujo.es-automatico [aria-selected="true"] { overflow: hidden; }
.hdn-trabajamos .hdn-flujo.es-automatico [aria-selected="true"] .hdn-flujo__n { animation: hdn-pulso 1.6s ease-in-out infinite; }
@keyframes hdn-pulso { 50% { box-shadow: 0 0 0 5px rgba(26, 26, 26, .12); } }
.hdn-trabajamos .hdn-flujo__ciclo { margin-top: var(--hdn-e4); font: 400 var(--hdn-t-xs)/1.5 var(--hdn-mono); color: var(--hdn-gris2); text-align: right; }
.hdn-trabajamos .hdn-flujo__ciclo span { font-size: 1.2em; }

.hdn-trabajamos .hdn-flujo__vista { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--hdn-e6); margin-top: var(--hdn-e6); align-items: start; }
.hdn-trabajamos .hdn-flujo__panel { animation: hdn-entra .35s ease; }
.hdn-trabajamos .hdn-flujo__panel:focus { outline: none; }
.hdn-trabajamos .hdn-flujo__paso { font: 500 var(--hdn-t-xs)/1 var(--hdn-mono); color: var(--hdn-gris2); }
.hdn-trabajamos .hdn-flujo__panel .hdn-subtitulo { margin-top: var(--hdn-e3); font-size: var(--hdn-t-xl); }
.hdn-trabajamos .hdn-flujo__texto { margin-top: var(--hdn-e4); max-width: 52ch; font: 400 var(--hdn-t-m)/1.6 var(--hdn-fuente); color: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-flujo__valida { margin-top: var(--hdn-e4); font: 400 var(--hdn-t-s)/1.5 var(--hdn-fuente); color: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-flujo__valida strong { color: var(--hdn-blanco); }
.hdn-trabajamos .hdn-flujo__tareas { display: grid; gap: var(--hdn-e2); margin-top: var(--hdn-e5); list-style: none; }
.hdn-trabajamos .hdn-flujo__tareas li { display: flex; align-items: center; gap: var(--hdn-e3); font: 400 var(--hdn-t-s)/1.4 var(--hdn-mono); color: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-flujo__tareas span {
	position: relative; flex: none; width: 16px; height: 16px; border: 1px solid rgba(255, 255, 255, .5); border-radius: 3px;
}
.hdn-trabajamos .hdn-flujo__tareas span::after {
	content: ""; position: absolute; inset: 2px; background: var(--hdn-blanco); border-radius: 1px;
	transform: scale(0); animation: hdn-marca .3s ease forwards; animation-delay: calc(var(--i) * .7s + .5s);
}
@keyframes hdn-marca { to { transform: scale(1); } }

.hdn-trabajamos .hdn-flujo__arbol ul { display: grid; gap: 2px; padding: 16px; list-style: none; }
.hdn-trabajamos .hdn-flujo__arbol li {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; padding: 4px 8px; border-radius: 3px;
	transition: background-color var(--hdn-transicion);
}
.hdn-trabajamos .hdn-flujo__arbol code { padding: 0; background: none; font: 400 13px/1.6 var(--hdn-mono); color: var(--hdn-gris2); white-space: pre; transition: color var(--hdn-transicion); }
.hdn-trabajamos .hdn-flujo__arbol small { display: none; font: 400 11px/1.4 var(--hdn-fuente); color: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-flujo__arbol li.es-activo { background: rgba(255, 255, 255, .09); }
.hdn-trabajamos .hdn-flujo__arbol li.es-activo code { color: var(--hdn-blanco); }
.hdn-trabajamos .hdn-flujo__arbol li.es-activo small { display: inline; }

.hdn-trabajamos .hdn-trabajamos__beneficios {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--hdn-e5);
	margin-top: var(--hdn-e8); padding-top: var(--hdn-e6); border-top: 1px solid var(--hdn-linea-oscura); list-style: none;
}
.hdn-trabajamos .hdn-trabajamos__beneficios li { font: 400 var(--hdn-t-s)/1.6 var(--hdn-fuente); color: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-trabajamos__beneficios strong { display: block; margin-bottom: var(--hdn-e2); font: 600 var(--hdn-t-m)/1.3 var(--hdn-fuente); color: var(--hdn-blanco); }

/* --- Fábrica de software --------------------------------------------------- */
.hdn-trabajamos .hdn-sprint { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--hdn-e2); margin-top: var(--hdn-e4); list-style: none; }
.hdn-trabajamos .hdn-sprint__dia {
	display: grid; align-content: start; gap: var(--hdn-e2); min-height: 120px; padding: var(--hdn-e4);
	background: var(--hdn-panel); border: 1px solid var(--hdn-linea); border-radius: var(--hdn-radio);
	opacity: 0; animation: hdn-entra .4s ease forwards; animation-delay: calc(var(--i) * .06s);
}
.hdn-trabajamos .hdn-sprint__fecha { font: 500 11px/1.2 var(--hdn-mono); color: var(--hdn-gris); }
.hdn-trabajamos .hdn-sprint__dia strong { font: 600 var(--hdn-t-s)/1.3 var(--hdn-fuente); color: var(--hdn-tinta); }
.hdn-trabajamos .hdn-sprint__dia small { font: 400 var(--hdn-t-xs)/1.45 var(--hdn-fuente); color: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-sprint__daily { align-self: end; margin-top: auto; font: 400 11px/1.2 var(--hdn-mono); color: var(--hdn-gris); }
.hdn-trabajamos .hdn-sprint__dia--hito { background: var(--hdn-carbon); border-color: var(--hdn-carbon); }
.hdn-trabajamos .hdn-sprint__dia--hito strong { color: var(--hdn-blanco); }
.hdn-trabajamos .hdn-sprint__dia--hito .hdn-sprint__fecha { color: var(--hdn-gris2); }

.hdn-trabajamos .hdn-tarjetas--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: var(--hdn-e6); }
.hdn-trabajamos .hdn-tarjetas--4 .hdn-tarjeta { min-height: 0; }
.hdn-trabajamos .hdn-tarjetas--4 .hdn-tarjeta:hover, .hdn-trabajamos .hdn-modalidad:hover { transform: none; box-shadow: none; border-color: var(--hdn-linea); }

.hdn-trabajamos .hdn-trabajamos__dos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--hdn-e8); margin-top: var(--hdn-e8); }
.hdn-trabajamos .hdn-trabajamos__separa { margin-top: var(--hdn-e6); }

/* Tubería DevOps: un punto recorre las etapas. */
.hdn-trabajamos .hdn-tuberia { position: relative; display: grid; gap: var(--hdn-e2); margin-top: var(--hdn-e5); padding-left: 28px; list-style: none; }
.hdn-trabajamos .hdn-tuberia::before { content: ""; position: absolute; left: 7px; top: 14px; bottom: 14px; width: 2px; background: var(--hdn-linea); }
.hdn-trabajamos .hdn-tuberia::after {
	content: ""; position: absolute; left: 3px; top: 10px; width: 10px; height: 10px; border-radius: 50%; background: var(--hdn-carbon);
	animation: hdn-recorre 6s ease-in-out infinite;
}
.hdn-trabajamos .hdn-tuberia li {
	position: relative; padding: var(--hdn-e3) var(--hdn-e4); background: var(--hdn-blanco); border: 1px solid var(--hdn-linea); border-radius: var(--hdn-radio);
	font: 500 var(--hdn-t-s)/1.3 var(--hdn-fuente); color: var(--hdn-tinta);
}
.hdn-trabajamos .hdn-tuberia li::before {
	content: ""; position: absolute; left: -25px; top: calc(50% - 4px); width: 8px; height: 8px; border-radius: 50%; background: var(--hdn-blanco); border: 2px solid var(--hdn-gris2);
}
@keyframes hdn-recorre { 0% { top: 10px; } 90%, 100% { top: calc(100% - 20px); } }

.hdn-trabajamos .hdn-trabajamos__chips { display: flex; flex-wrap: wrap; gap: var(--hdn-e2); margin-top: var(--hdn-e4); list-style: none; }
.hdn-trabajamos .hdn-trabajamos__chips li { padding: .5rem .9rem; border: 1px solid var(--hdn-tinta); border-radius: 999px; font: 500 var(--hdn-t-s)/1.2 var(--hdn-mono); color: var(--hdn-tinta); }
.hdn-trabajamos .hdn-trabajamos__chips .hdn-trabajamos__chip-tenue { border-style: dashed; border-color: var(--hdn-gris2); font-family: var(--hdn-fuente); color: var(--hdn-gris); }
.hdn-trabajamos .hdn-lista-check--una { grid-template-columns: 1fr; gap: var(--hdn-e3); margin-top: var(--hdn-e4); }
.hdn-trabajamos .hdn-trabajamos__video { max-width: 860px; margin-top: var(--hdn-e8); }
.hdn-trabajamos .hdn-trabajamos__video .hdn-video { margin-top: var(--hdn-e4); }

/* --- Por servicio ------------------------------------------------------------- */
.hdn-trabajamos .hdn-pilares-pestanas__lista { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; background: var(--hdn-blanco); border: 1px solid var(--hdn-linea); border-radius: 999px; }
.hdn .hdn-trabajamos .hdn-pilares-pestanas__lista [role="tab"] {
	padding: .6rem 1.2rem; background: transparent; color: var(--hdn-texto); border: 0; border-radius: 999px; font: 600 var(--hdn-t-s)/1.2 var(--hdn-fuente);
}
.hdn .hdn-trabajamos .hdn-pilares-pestanas__lista [role="tab"]:hover { background: var(--hdn-panel); color: var(--hdn-tinta); }
.hdn .hdn-trabajamos .hdn-pilares-pestanas__lista [role="tab"][aria-selected="true"] { background: var(--hdn-carbon); color: var(--hdn-blanco); }
.hdn-trabajamos .hdn-pilares-pestanas__panel { margin-top: var(--hdn-e6); animation: hdn-entra .35s ease; }
.hdn-trabajamos .hdn-pilares-pestanas__panel:focus { outline: none; }
.hdn-trabajamos .hdn-pilares-pestanas__panel .hdn-pilar__lema { margin-top: 0; font-size: var(--hdn-t-l); }
.hdn-trabajamos .hdn-pilares-pestanas__panel .hdn-anclas { margin-top: var(--hdn-e6); }

/* --- Roles -------------------------------------------------------------------- */
.hdn-trabajamos .hdn-roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--hdn-e4); }
.hdn-trabajamos .hdn-roles__lado { padding: var(--hdn-e6); border: 1px solid var(--hdn-linea); border-radius: var(--hdn-radio); }
.hdn-trabajamos .hdn-roles__lado dl { display: grid; gap: var(--hdn-e4); margin: var(--hdn-e5) 0 0; }
.hdn-trabajamos .hdn-roles__lado dl > div { padding-top: var(--hdn-e4); border-top: 1px solid var(--hdn-linea); }
.hdn-trabajamos .hdn-roles__lado dt { font: 600 var(--hdn-t-m)/1.3 var(--hdn-fuente); color: var(--hdn-tinta); }
.hdn-trabajamos .hdn-roles__lado dd { margin: var(--hdn-e1) 0 0; font: 400 var(--hdn-t-s)/1.55 var(--hdn-fuente); color: var(--hdn-gris); }
.hdn-trabajamos .hdn-roles__lado--oscuro { background: var(--hdn-carbon); border-color: var(--hdn-carbon); }
.hdn-trabajamos .hdn-roles__lado--oscuro .hdn-subtitulo, .hdn-trabajamos .hdn-roles__lado--oscuro dt { color: var(--hdn-blanco); }
.hdn-trabajamos .hdn-roles__lado--oscuro dd { color: var(--hdn-sobre-oscuro); }
.hdn-trabajamos .hdn-roles__lado--oscuro dl > div { border-top-color: var(--hdn-linea-oscura); }

/* --- Modalidades -------------------------------------------------------------- */
.hdn-trabajamos .hdn-modalidad__mide { margin-top: var(--hdn-e4); padding-top: var(--hdn-e4); border-top: 1px solid var(--hdn-linea); font: 400 var(--hdn-t-s)/1.55 var(--hdn-fuente); color: var(--hdn-texto); }
.hdn-trabajamos .hdn-modalidad__mide strong { color: var(--hdn-tinta); }
.hdn-trabajamos .hdn-modalidad__servicios { display: grid; gap: var(--hdn-e2); margin-top: auto; padding-top: var(--hdn-e5); list-style: none; }

/* --- Preguntas ---------------------------------------------------------------- */
.hdn-trabajamos .hdn-trabajamos__preguntas { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--hdn-e8); align-items: start; }
.hdn-trabajamos .hdn-preguntas { border-top: 1px solid var(--hdn-linea); }
.hdn-trabajamos .hdn-preguntas details { border-bottom: 1px solid var(--hdn-linea); }
.hdn-trabajamos .hdn-preguntas summary {
	display: flex; justify-content: space-between; align-items: center; gap: var(--hdn-e4); padding: var(--hdn-e5) 0;
	cursor: pointer; list-style: none; font: 600 var(--hdn-t-m)/1.35 var(--hdn-fuente); color: var(--hdn-tinta);
}
.hdn-trabajamos .hdn-preguntas summary::-webkit-details-marker { display: none; }
.hdn-trabajamos .hdn-preguntas summary .hdn-ico { transition: transform var(--hdn-transicion); }
.hdn-trabajamos .hdn-preguntas details[open] summary .hdn-ico { transform: rotate(180deg); }
.hdn-trabajamos .hdn-preguntas details p { max-width: 64ch; padding-bottom: var(--hdn-e5); font: 400 var(--hdn-t-m)/1.65 var(--hdn-fuente); color: var(--hdn-texto); }

/* --- Responsive ----------------------------------------------------------------- */
@media (max-width: 1023px) {
	.hdn-trabajamos .hdn-trabajamos__portada-fila, .hdn-trabajamos .hdn-flujo__vista, .hdn-trabajamos .hdn-trabajamos__dos,
	.hdn-trabajamos .hdn-trabajamos__preguntas { grid-template-columns: 1fr; gap: var(--hdn-e6); }
	.hdn-trabajamos .hdn-etapas__panel { grid-template-columns: 1fr; gap: var(--hdn-e4); }
	.hdn-trabajamos .hdn-etapas__datos dl, .hdn-trabajamos .hdn-trabajamos__beneficios { grid-template-columns: 1fr; }
	.hdn-trabajamos .hdn-tarjetas--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	/* Nodos de OpenSpec en columna, con flecha hacia abajo. */
	.hdn-trabajamos .hdn-flujo__nodos { grid-template-columns: 1fr; gap: var(--hdn-e4); max-width: 420px; }
	.hdn .hdn-trabajamos .hdn-flujo__nodos [role="tab"] { justify-content: flex-start; min-height: 52px; }
	.hdn .hdn-trabajamos .hdn-flujo__nodos [role="tab"]:not(:last-child)::after { left: 50%; top: 100%; width: 1px; height: var(--hdn-e4); }
	.hdn .hdn-trabajamos .hdn-flujo__nodos [role="tab"]:not(:last-child)::before { display: none; }
	.hdn-trabajamos .hdn-flujo__ciclo { text-align: left; }
}
@media (max-width: 760px) {
	/* Etapas: lista desplazable en horizontal. */
	.hdn-trabajamos .hdn-etapas__lista { grid-template-columns: repeat(5, minmax(140px, 1fr)); overflow-x: auto; scrollbar-width: thin; }
	.hdn-trabajamos .hdn-etapas__panel { padding: var(--hdn-e5); }
	.hdn-trabajamos .hdn-sprint { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hdn-trabajamos .hdn-sprint__dia { min-height: 0; }
	.hdn-trabajamos .hdn-tablero__columnas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding: 10px; }
	.hdn-trabajamos .hdn-tablero__tarjeta b { font-size: 11px; }
	.hdn-trabajamos .hdn-tablero__columna > p span { display: none; }
	.hdn-trabajamos .hdn-roles, .hdn-trabajamos .hdn-tarjetas--4 { grid-template-columns: 1fr; }
	.hdn-trabajamos .hdn-roles__lado { padding: var(--hdn-e5); }
	.hdn-trabajamos .hdn-flujo__arbol code { font-size: 12px; }
	.hdn-trabajamos .hdn-pilares-pestanas__lista { display: flex; border-radius: var(--hdn-radio); }
	.hdn .hdn-trabajamos .hdn-pilares-pestanas__lista [role="tab"] { flex: 1 1 45%; border-radius: var(--hdn-radio); }
}

@media (prefers-reduced-motion: reduce) {
	.hdn-trabajamos .hdn-tablero__tarjeta, .hdn-trabajamos .hdn-sprint__dia { opacity: 1; animation: none; }
	.hdn-trabajamos *, .hdn-trabajamos *::before, .hdn-trabajamos *::after { animation: none !important; }
	.hdn-trabajamos .hdn-flujo__tareas span::after { transform: scale(1); }
}
