/* Comparar Hojas de Cálculo – Header  (prefijo .chch para no chocar con el tema) */
.chch {
	--chch-azul: #2156D9;
	--chch-azul-hover: #1A47B8;
	--chch-menta: #2EC4A6;
	--chch-menta-osc: #139A80;
	--chch-marino: #0F1B3D;
	--chch-pizarra: #5B6B82;
	--chch-azul-claro: #EEF3FF;
	--chch-borde: #E4E9F2;
	--chch-alto: 76px;
	position: relative;
	z-index: 999;
	width: 100%;
	background: #fff;
	border-bottom: 1px solid var(--chch-borde);
	font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	color: var(--chch-marino);
	box-sizing: border-box;
}
.chch *, .chch *::before, .chch *::after { box-sizing: border-box; }
.chch--sticky { position: sticky; top: 0; }
.admin-bar .chch--sticky { top: 32px; }
@media (max-width: 782px) { .admin-bar .chch--sticky { top: 0; } }
.chch.is-scrolled { box-shadow: 0 4px 20px rgba(15, 27, 61, .07); }

.chch a { text-decoration: none; color: inherit; }
.chch button { font: inherit; color: inherit; background: none; border: 0; margin: 0; cursor: pointer; }
.chch ul { list-style: none; margin: 0; padding: 0; }

.chch__bar {
	max-width: 1240px;
	height: var(--chch-alto);
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	align-items: center;
	gap: 24px;
}

/* Logo */
.chch__logo { display: flex; align-items: center; flex-shrink: 0; }
.chch__logo svg, .chch__logo img { display: block; height: 46px; width: auto; }
.chch__logo-mark { display: none; }

/* Navegación (escritorio) */
.chch__nav { flex: 1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.chch__menu { display: flex; align-items: center; gap: 2px; }
.chch__item { position: relative; }
.chch__link {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 10px 14px;
	border-radius: 10px;
	font-size: 15px; font-weight: 500; line-height: 1.2;
	color: var(--chch-marino);
	transition: background .15s, color .15s;
	white-space: nowrap;
}
.chch__link:hover, .chch__toggle[aria-expanded="true"] { background: var(--chch-azul-claro); color: var(--chch-azul); }
.chch__link.is-current { color: var(--chch-azul); }
.chch__link:focus-visible, .chch__sublink:focus-visible, .chch__tool:focus-visible, .chch__cta:focus-visible, .chch__burger:focus-visible {
	outline: 2px solid var(--chch-azul); outline-offset: 2px;
}
.chch__chev { width: 12px; height: 12px; transition: transform .2s; }
.chch__toggle[aria-expanded="true"] .chch__chev { transform: rotate(180deg); }
.chch__globe { width: 18px; height: 18px; }

/* Paneles desplegables */
.chch__panel {
	position: absolute; top: calc(100% + 10px); left: 0;
	min-width: 200px;
	padding: 8px;
	background: #fff;
	border: 1px solid var(--chch-borde);
	border-radius: 16px;
	box-shadow: 0 18px 40px rgba(15, 27, 61, .12);
	opacity: 0; visibility: hidden; transform: translateY(-6px);
	transition: opacity .18s, transform .18s, visibility .18s;
}
.chch__toggle[aria-expanded="true"] + .chch__panel { opacity: 1; visibility: visible; transform: none; }
.chch__panel--lang { left: auto; right: 0; min-width: 190px; }
.chch__sublink {
	display: flex; align-items: center; gap: 10px;
	padding: 10px 12px; border-radius: 10px;
	font-size: 14.5px; font-weight: 500;
}
.chch__sublink:hover { background: var(--chch-azul-claro); color: var(--chch-azul); }
.chch__sublink.is-current { color: var(--chch-azul); }
.chch__lang-code {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 30px; height: 22px; padding: 0 6px;
	border-radius: 6px; background: var(--chch-azul-claro); color: var(--chch-azul);
	font-size: 11.5px; font-weight: 600;
}

/* Mega menú de herramientas (3 grupos; "Convertir" ocupa dos columnas) */
.chch__item--mega { position: static; }
.chch__panel--mega {
	top: calc(100% - 6px);
	left: 50%; transform: translate(-50%, -6px);
	width: min(1040px, calc(100vw - 48px));
	padding: 18px 18px 12px;
}
.chch__toggle[aria-expanded="true"] + .chch__panel--mega { transform: translate(-50%, 0); }
.chch__groups { display: grid; grid-template-columns: 1fr 1fr 2fr; gap: 8px 18px; }
.chch__group { min-width: 0; }
.chch__group + .chch__group { border-left: 1px solid var(--chch-borde); padding-left: 18px; }
.chch__group-title {
	margin: 0 0 6px; padding: 0 10px;
	font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
	color: var(--chch-pizarra);
}
.chch__tools { display: grid; grid-template-columns: 1fr; gap: 2px; }
.chch__group--convertir .chch__tools { grid-template-columns: 1fr 1fr; }
.chch__tool {
	display: flex; align-items: center; gap: 11px;
	padding: 8px 10px; border-radius: 12px;
	transition: background .15s;
}
.chch__tool:hover, .chch__tool.is-current { background: var(--chch-azul-claro); }
.chch__tool-icon {
	flex-shrink: 0; width: 40px; height: 40px; border-radius: 11px;
	background: var(--chch-azul-claro);
	display: flex; align-items: center; justify-content: center;
	transition: background .15s;
}
.chch__group--convertir .chch__tool-icon { background: #E8FAF5; }
.chch__tool:hover .chch__tool-icon, .chch__tool.is-current .chch__tool-icon { background: #fff; }
.chch__tool-icon svg { width: 31px; height: 31px; }
.chch__all {
	display: flex; align-items: center; justify-content: center; gap: 6px;
	margin-top: 12px; padding: 11px 12px 4px;
	border-top: 1px solid var(--chch-borde);
	font-size: 14px; font-weight: 600; color: var(--chch-azul) !important;
}
.chch__all svg { width: 15px; height: 15px; transition: transform .15s; }
.chch__all:hover svg { transform: translateX(3px); }
.chch__tool-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.chch__tool-text strong { font-size: 14px; font-weight: 600; color: var(--chch-marino); line-height: 1.3; }
.chch__tool-text small { font-size: 12px; color: var(--chch-pizarra); line-height: 1.35; }

@media (min-width: 1081px) and (max-width: 1180px) {
	.chch__tool-text small { display: none; }
}

/* Acciones: idioma + botón */
.chch__actions { display: flex; align-items: center; gap: 8px; margin-left: 8px; padding-left: 12px; border-left: 1px solid var(--chch-borde); }
.chch__lang-btn { gap: 6px; }
.chch__cta {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 11px 20px; border-radius: 12px;
	background: var(--chch-azul); color: #fff !important;
	font-size: 15px; font-weight: 600; white-space: nowrap;
	transition: background .15s, transform .15s;
}
.chch__cta:hover { background: var(--chch-azul-hover); }

/* Botón hamburguesa */
.chch__burger {
	display: none; margin-left: auto;
	width: 44px; height: 44px; border-radius: 12px;
	align-items: center; justify-content: center; flex-direction: column; gap: 5px;
}
/* .chch button resetea margin: subir especificidad */
.chch .chch__burger { margin-left: auto; }
.chch__burger:hover { background: var(--chch-azul-claro); }
.chch__burger span { display: block; width: 22px; height: 2.4px; border-radius: 2px; background: var(--chch-marino); transition: transform .25s, opacity .2s; }
.chch__burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7.4px) rotate(45deg); }
.chch__burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.chch__burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7.4px) rotate(-45deg); }

/* ---------- Tableta y móvil ---------- */
@media (max-width: 1080px) {
	.chch { --chch-alto: 68px; }
	.chch__bar { padding: 0 20px; }
	.chch__logo svg, .chch__logo img { height: 38px; }
	.chch__burger { display: inline-flex; }

	.chch__nav {
		position: absolute; top: 100%; left: 0; right: 0;
		flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0;
		max-height: calc(100vh - var(--chch-alto));
		max-height: calc(100dvh - var(--chch-alto));
		overflow-y: auto;
		padding: 12px 20px 24px;
		background: #fff;
		border-bottom: 1px solid var(--chch-borde);
		box-shadow: 0 18px 30px rgba(15, 27, 61, .10);
		display: none;
	}
	.chch.is-open .chch__nav { display: flex; }
	.chch__menu { flex-direction: column; align-items: stretch; gap: 2px; }
	.chch__link { width: 100%; justify-content: space-between; padding: 14px 12px; font-size: 16px; }

	.chch__panel, .chch__panel--mega, .chch__panel--lang {
		position: static; width: auto; min-width: 0;
		transform: none !important; box-shadow: none; border: 0;
		padding: 0 0 8px; opacity: 1; visibility: visible;
		display: none;
	}
	.chch__toggle[aria-expanded="true"] + .chch__panel { display: block; }
	.chch__groups { grid-template-columns: 1fr; gap: 14px; padding-top: 4px; }
	.chch__group + .chch__group { border-left: 0; padding-left: 0; }
	.chch__tools, .chch__group--convertir .chch__tools { grid-template-columns: 1fr 1fr; gap: 6px; }
	.chch__all { justify-content: flex-start; padding: 12px 10px 4px; margin-top: 8px; }
	.chch__sublink { padding: 12px 14px; }

	.chch__actions {
		margin: 12px 0 0; padding: 16px 0 0;
		border-left: 0; border-top: 1px solid var(--chch-borde);
		flex-direction: column; align-items: stretch; gap: 10px;
	}
	.chch__item--lang { width: 100%; }
	.chch__lang-btn { justify-content: flex-start; }
	.chch__lang-btn .chch__chev { margin-left: auto; }
	.chch__cta { width: 100%; padding: 14px 20px; }
}

@media (max-width: 640px) {
	.chch__bar { padding: 0 16px; gap: 12px; }
	.chch__nav { padding: 8px 16px 20px; }
	.chch__tools, .chch__group--convertir .chch__tools { grid-template-columns: 1fr; }
	.chch__tool { padding: 8px; }
	.chch__tool-text small { display: none; }
}

@media (max-width: 380px) {
	.chch__logo-full { display: none; }
	.chch__logo-mark { display: block; }
	.chch__logo-mark svg { height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
	.chch *, .chch *::before, .chch *::after { transition: none !important; }
}