.topbar { background: var(--color-dark); color: var(--color-white); font-size: 13px; overflow: hidden; max-height: 80px; transition: max-height 0.35s ease, opacity 0.3s ease; }
.topbar-inner { display: flex; max-width: 1180px; justify-content: space-between; align-items: center; padding: 8px 24px; flex-wrap: wrap; gap: 18px; transition: padding 0.35s ease; }
.topbar-left, .topbar-right { display: contents; }
.topbar a, .topbar span { display: inline-flex; align-items: center; gap: 6px; color: var(--color-white); }
.topbar .btn-sm { padding: 6px 14px; font-size: 12px; }
.topbar-right span { display: none; }
.icon { width: 16px; height: 16px; stroke: currentColor; }

/* El header compacta su altura al hacer scroll; sin esto el navegador
   reajusta la posición del scroll en cada frame de la animación para
   "anclar" el contenido y provoca vibración (tiritar) al subir. */
html { overflow-anchor: none; }

.site-header { position: sticky; top: 0; z-index: 1000; transition: box-shadow 0.3s ease; }
.main-nav { background: var(--color-dark); padding: 14px 0; transition: padding 0.35s ease; }
.main-nav-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.site-logo { display: flex; align-items: center; gap: 8px; color: var(--color-white); }
.site-logo .site-logo-img { max-height: 56px; width: auto; height: auto; display: block; transition: max-height 0.35s ease; }

/* Estado compacto al hacer scroll */
.site-header.is-scrolled { box-shadow: 0 6px 22px rgba(0, 0, 0, 0.28); }
.site-header.is-scrolled .topbar { max-height: 0; opacity: 0; }
.site-header.is-scrolled .topbar-inner { padding-top: 0; padding-bottom: 0; }
.site-header.is-scrolled .main-nav { padding: 8px 0; }
.site-header.is-scrolled .site-logo .site-logo-img { max-height: 44px; }

@media (prefers-reduced-motion: reduce) {
	.site-header,
	.topbar,
	.topbar-inner,
	.main-nav,
	.site-logo .site-logo-img { transition: none; }
}
.site-logo .logo-icon { width: 40px; height: 40px; color: var(--color-gold); }
.logo-text { font-weight: 800; line-height: 1.1; color: var(--color-white); }
.logo-text strong { color: var(--color-green); }

.primary-menu { list-style: none; display: flex; gap: 28px; margin: 0; padding: 0; }
.primary-menu a { color: var(--color-white); font-weight: 400; font-size: 14px; text-transform: uppercase; }
.primary-menu .current-menu-item > a { color: var(--color-gold); border-bottom: 2px solid var(--color-gold); }

.nav-toggle { display: none; background: none; border: none; color: var(--color-white); padding: 8px; margin: -8px; cursor: pointer; line-height: 0; }
.nav-toggle .icon { width: 30px; height: 30px; }
.nav-toggle .icon-close { display: none; }
.nav-toggle[aria-expanded="true"] .icon-open { display: none; }
.nav-toggle[aria-expanded="true"] .icon-close { display: block; }

.whatsapp-float {
	position: fixed; right: 20px; bottom: 20px; z-index: 999;
	width: 56px; height: 56px; border-radius: 50%;
	background: #25D366; color: var(--color-white);
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 4px 12px rgba(0,0,0,0.25);
}
.whatsapp-float .icon { width: 28px; height: 28px; }

.site-footer { background: var(--color-dark); color: var(--color-white); }
.site-footer .container { max-width: 1240px; }

@media (max-width: 1024px) {
	.topbar-left span:nth-child(3), .topbar-left span:nth-child(4) { display: none; }
	.nav-toggle { display: inline-flex; align-items: center; justify-content: center; order: 2; }
	.primary-menu {
		flex-direction: column; gap: 0; position: absolute; left: 0; right: 0; top: 100%;
		background: var(--color-dark); padding: 12px 24px; z-index: 1000;
		box-shadow: 0 14px 26px rgba(0,0,0,0.35); border-top: 1px solid rgba(255,255,255,0.08);
		opacity: 0; visibility: hidden; transform: translateY(-12px); pointer-events: none;
		transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
	}
	.primary-menu.is-open { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; }
	.primary-menu li { border-bottom: 1px solid rgba(255,255,255,0.08); opacity: 0; transform: translateY(-6px); transition: opacity 0.3s ease, transform 0.3s ease; }
	.primary-menu li:last-child { border-bottom: none; }
	.primary-menu.is-open li { opacity: 1; transform: translateY(0); }
	.primary-menu.is-open li:nth-child(1) { transition-delay: 0.04s; }
	.primary-menu.is-open li:nth-child(2) { transition-delay: 0.08s; }
	.primary-menu.is-open li:nth-child(3) { transition-delay: 0.12s; }
	.primary-menu.is-open li:nth-child(4) { transition-delay: 0.16s; }
	.primary-menu.is-open li:nth-child(5) { transition-delay: 0.20s; }
	.primary-menu.is-open li:nth-child(6) { transition-delay: 0.24s; }
	.primary-menu a { display: block; padding: 12px 0; }
	.main-nav-inner { position: relative; flex-wrap: wrap; }
	.main-nav-inner .btn-gold { order: 3; }
}

@media (max-width: 1024px) and (prefers-reduced-motion: reduce) {
	.primary-menu,
	.primary-menu li { transition: none; transform: none; }
}

.footer-grid { display: grid; grid-template-columns: 1fr 1.35fr 1.35fr .65fr .9fr; gap: 28px; padding: 48px 24px; }
.footer-brand p { opacity: 0.75; font-size: 14px; margin-top: 12px; }
.footer-col h4 { color: var(--color-gold); font-size: 14px; text-transform: uppercase; margin-bottom: 14px; }
.footer-col p { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; opacity: 0.85; }
.footer-col p .icon { width: 19px; height: 19px; color: var(--color-gold); flex: 0 0 19px; }
.footer-sede { align-self: start; min-width: 0; min-height: 100%; box-sizing: border-box; padding: 20px 18px; border: 1px solid rgba(255,255,255,.18); border-top: 3px solid var(--color-gold); border-radius: 5px; background: rgba(255,255,255,.045); }
.footer-sede h4 { margin-bottom: 16px; }
.footer-sede p span { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
.footer-sede .footer-sede-email { font-size: 12px; }
.footer-sede .footer-sede-email span { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.footer-sede p:last-child { margin-bottom: 0; }
.footer-menu { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.footer-menu a { font-size: 14px; opacity: 0.85; }
.footer-social { display: flex; gap: 12px; margin-bottom: 20px; }
.footer-social a { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.3); display: flex; align-items: center; justify-content: center; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; padding: 16px 24px; border-top: 1px solid rgba(255,255,255,0.1); font-size: 13px; opacity: 0.7; flex-wrap: wrap; gap: 8px; }
.footer-legal-links { display: flex; gap: 16px; }

@media (max-width: 1024px) {
	.footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.footer-grid { grid-template-columns: 1fr; }
	.footer-bottom { flex-direction: column; text-align: center; }
}