body.mg-shared {
	--noir: #14110E;
	--noir-2: #1B1710;
	--or: #D4AF37;
	--or-lite: #F1DB95;
	--or-soft: #997C21;
	--crema: #F4EFE4;
	--xampany: #EFE7D6;
	--filet: 1px solid rgba(212, 175, 55, .26);
	--ease: cubic-bezier(.2, .7, .2, 1);
	--degradat: linear-gradient(135deg, #F1DB95, #D4AF37 48%, #997C21);
	--barra: 64px;
	--baix: 0px;
	--admin: var(--wp-admin--admin-bar--height, 0px);

	margin: 0;

	font-family: Poppins, "Helvetica Neue", Arial, sans-serif;
	font-weight: 400;
	letter-spacing: .01em;
	-webkit-font-smoothing: antialiased;
}
@media (min-width: 1180px) {
	body.mg-shared { --barra: 76px; }
}
body.mg-shared { --baix: 64px; }
@media (min-width: 1180px) {
	body.mg-shared { --baix: 0px; }
}

.mg-shared *, .mg-shared *::before, .mg-shared *::after { box-sizing: border-box; }
.mg-shared img { max-width: none; }

.mgc-ocult,
.mg-shared .mgc-nav__resta {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- Foco visible en todo ---------- */
.mg-shared a:focus-visible,
.mg-shared button:focus-visible,
.mg-shared input:focus-visible,
.mg-shared select:focus-visible {
	outline: 2px solid var(--or-lite);
	outline-offset: 3px;
	box-shadow: none;
}
.mg-shared .mgc-nav a:focus-visible {
	outline: 2px solid var(--or-lite);
	outline-offset: 2px;
}
/* Al hacer clic con el ratón no sale ningún recuadro (Alex, 2026-09-29); con teclado, sí. */
.mg-shared .mgc-barra a:focus:not(:focus-visible),
.mg-shared .mgc-barra button:focus:not(:focus-visible) {
	outline: none;
}
.mg-shared .mgc-capitol--clar a:focus-visible,
.mg-shared .mgc-capitol--clar button:focus-visible {
	outline-color: var(--noir-2);
}

.mgc-salt {
	position: fixed;
	left: 12px;
	top: calc(var(--admin) + 8px);
	z-index: 100;
	padding: 12px 18px;
	border-radius: 13px;
	background: var(--noir-2);
	color: var(--crema) !important;
	transform: translateY(-160%);
}
.mgc-salt:focus { transform: none; }

/* =================================================================
   BARRA SUPERIOR
   ================================================================= */
.mgc-barra {
	position: sticky;
	top: var(--admin);
	z-index: 40;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	padding: 8px 16px;
	background: rgba(20, 17, 14, .94);
	border-bottom: var(--filet);
}
.mgc-barra {
	position: fixed;
	left: 0; right: 0;
	flex-wrap: nowrap;
	height: var(--barra);
	padding-block: 0;
	/* SIN backdrop-filter, a propósito: igual que transform, convierte la barra
	   en el contenedor de sus hijos `position: fixed`, y la hoja del índice
	   (que vive dentro de esta barra) se colocaba respecto a la barra, fuera de
	   la pantalla. Medido: el botón decía "abierto" y no se veía nada. */
	background: linear-gradient(to bottom, rgba(20, 17, 14, .95), rgba(20, 17, 14, .84));
}

.mg-shared .mgc-marca {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-right: auto;
	color: var(--xampany);
	text-decoration: none;
}
.mgc-marca__logo {
	display: block;
	width: 40px;
	height: 40px;
	object-fit: contain;
}
.mgc-marca__nom {
	max-width: 12.6em;
	font-size: 9.5px;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: .32em;
	text-transform: uppercase;
}
@media (min-width: 1180px) {
	.mgc-marca__logo { width: 46px; height: 46px; }
	.mgc-marca__nom { font-size: 10px; }
}

/* Navegación de apartados.
   Sin JS en pantallas estrechas: una fila que se desliza bajo la marca.
   Con JS y por debajo de 1180 px: hoja que abre el botón "Índice".
   Desde 1180 px: en línea en la barra, con el progreso bajo el activo. */
.mgc-nav { order: 3; flex-basis: 100%; overflow-x: auto; }
.mgc-nav ol {
	display: flex;
	gap: 6px;
	margin: 0;
	padding: 0 0 4px;
	list-style: none;
}
.mg-shared .mgc-nav a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 12px;
	border-radius: 10px;
	color: rgba(244, 239, 228, .74);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: .18em;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
}
.mgc-nav__num { color: var(--or); font-size: 10px; letter-spacing: .1em; }
.mg-shared .mgc-nav a:hover { color: var(--crema); }
.mg-shared .mgc-nav a[aria-current="true"] { color: var(--or-lite); }

@media (max-width: 1179px) {
	.mgc-nav {
		position: fixed;
		left: 12px; right: 12px;
		bottom: calc(var(--baix) + 10px);
		z-index: 45;
		overflow: visible;
		padding: 8px;
		border: var(--filet);
		border-radius: 14px;
		background: var(--noir-2);
		box-shadow: 0 18px 48px rgba(0, 0, 0, .45);
		opacity: 0;
		visibility: hidden;
		transform: translateY(14px);
		transition: opacity .3s var(--ease), transform .3s var(--ease), visibility 0s linear .3s;
	}
	.mgc-nav.es-oberta {
		opacity: 1;
		visibility: visible;
		transform: none;
		transition: opacity .3s var(--ease), transform .3s var(--ease);
	}
	.mgc-nav ol { flex-direction: column; gap: 2px; padding: 0; }
	.mgc-nav a { min-height: 56px; padding: 0 16px; font-size: 12px; white-space: normal; }
	.mgc-nav a[aria-current="true"] { background: rgba(212, 175, 55, .1); }
	.mgc-nav .mgc-nav__resta { position: static !important; width: auto; height: auto; margin: 0; clip: auto; overflow: visible; white-space: normal; }
}

@media (min-width: 1180px) {
	.mgc-nav { order: 0; flex-basis: auto; overflow: visible; }
	.mgc-nav ol { gap: clamp(2px, .6vw, 10px); padding: 0; }
	.mg-shared .mgc-nav a { padding: 0 clamp(6px, .7vw, 12px); }
	.mg-shared .mgc-nav a::after {
		content: "";
		position: absolute;
		left: clamp(6px, .7vw, 12px);
		right: clamp(6px, .7vw, 12px);
		bottom: 8px;
		height: 1px;
		background: var(--or);
		transform: scaleX(0);
		transform-origin: left center;
	}
	.mg-shared .mgc-nav a[aria-current="true"]::after { transform: scaleX(var(--p, 1)); }
}

/* =================================================================
   BOTONES Y ENLACES
   ================================================================= */
.mg-shared .mgc-boto {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 64px;
	padding: 0 26px;
	border: 1px solid transparent;
	border-radius: 13px;
	font-family: Poppins, "Helvetica Neue", Arial, sans-serif;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: .16em;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: filter .25s var(--ease), background-color .25s var(--ease), border-color .25s var(--ease);
}
@media (min-width: 768px) {
	.mg-shared .mgc-boto { min-height: 56px; }
}
.mg-shared .mgc-boto--primari {
	background: var(--degradat);
	color: var(--noir-2);
	box-shadow: 0 10px 28px rgba(20, 17, 14, .28);
}
.mg-shared .mgc-boto--primari:hover { filter: brightness(1.06); color: var(--noir-2); }
.mg-shared .mgc-boto--fantasma {
	background: rgba(20, 17, 14, .38);
	border-color: rgba(241, 219, 149, .55);
	color: var(--crema);
}
.mg-shared .mgc-boto--fantasma:hover { background: rgba(20, 17, 14, .6); border-color: var(--or-lite); color: var(--crema); }
.mg-shared .mgc-capitol--clar .mgc-boto--fantasma {
	background: rgba(244, 239, 228, .55);
	border-color: rgba(27, 23, 16, .42);
	color: var(--noir-2);
}
.mg-shared .mgc-capitol--clar .mgc-boto--fantasma:hover { background: rgba(244, 239, 228, .9); border-color: var(--noir-2); }

.mg-shared .mgc-whatsapp-barra {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 1px solid rgba(241, 219, 149, .38);
	border-radius: 13px;
	color: var(--or-lite);
}
.mg-shared .mgc-whatsapp-barra svg { width: 22px; height: 22px; }
.mg-shared .mgc-whatsapp-barra:hover { border-color: var(--or-lite); color: var(--crema); }
@media (max-width: 1179px) {
	/* Con JS, en estrecho va en la barra inferior. */
	.mg-shared .mgc-whatsapp-barra { display: none; }
}
@media (min-width: 1180px) and (max-width: 1319px) {
	/* Sitio para seis apartados, WhatsApp y el buscador: la marca queda en
	   isotipo (monograma solo), que el manual admite. El nombre sigue en la
	   etiqueta accesible del enlace. */
	.mgc-marca__nom { display: none; }
}

.mg-shared .mgc-boto--barra {
	flex: none;
	min-height: 44px;
	padding: 0 14px;
	font-size: 10.5px;
	letter-spacing: .14em;
}
@media (min-width: 1180px) {
	.mg-shared .mgc-boto--barra { min-height: 48px; padding: 0 18px; }
}

.mg-shared .mgc-enllac a,
.mg-shared .mgc-canals a {
	color: var(--crema);
	text-decoration: underline;
	text-decoration-color: rgba(212, 175, 55, .7);
	text-decoration-thickness: 1px;
	text-underline-offset: 5px;
}
.mg-shared .mgc-enllac a:hover,
.mg-shared .mgc-canals a:hover { text-decoration-color: var(--or-lite); }

/* =================================================================
   CAPÍTULOS — MODO ESTÁTICO (base)
   ================================================================= */

body.mg-shared{padding-top:var(--barra);background:inherit;color:inherit;}
body.mg-shared #masthead{display:none!important;}
.mg-shared .mgc-barra{font-family:Poppins,Arial,sans-serif;color:var(--crema);line-height:1.5;}
.mg-shared .mgc-nav a[aria-current="true"]{--p:1;}
.mg-header-toggle{display:none;}
@media(max-width:1179px){.mg-shared .mgc-nav{top:calc(var(--barra) + var(--admin) + 8px);bottom:auto;}.mg-header-toggle{display:block;min-height:44px;padding:8px 12px;border:1px solid #997C21;border-radius:10px;background:transparent;color:#F4EFE4;font:12px Poppins,sans-serif;}.mg-shared .mgc-boto--barra{display:none;}}