/* ==========================================================================
   SIIE v2 — Propuesta de vista "moderna" (estilo iOS)
   Capa que se carga DESPUÉS de siie.css cuando la vista moderna está activa
   (helper siie_tema_moderno). Conserva la paleta institucional y agrega un
   acento dorado. El modo de alto contraste sigue mandando: todas las reglas
   quedan dentro de html.tema-moderno:not([data-contraste="alto"]).
   ========================================================================== */

:root {
	/* Acento nuevo: dorado ámbar (armoniza con el dorado de gob.mx y contrasta con el marino) */
	--m-dorado:        #F2B33D;   /* sobre fondos oscuros */
	--m-dorado-suave:  #FFF3D6;
	--m-dorado-texto:  #8A5A00;   /* texto sobre blanco (contraste AA) */
	--m-frambuesa:     #B8336A;   /* guinda luminoso, solo para degradados */

	--m-fondo:         #F2F2F7;   /* gris agrupado de iOS */
	--m-relleno:       rgba(118, 118, 128, .12);
	--m-separador:     rgba(60, 60, 67, .14);
	--m-vidrio:        rgba(255, 255, 255, .72);

	--m-radio-s: 12px;
	--m-radio:   20px;
	--m-radio-l: 28px;

	--m-sombra-1: 0 1px 2px rgba(0, 0, 35, .04), 0 2px 8px rgba(0, 0, 35, .04);
	--m-sombra-2: 0 1px 2px rgba(0, 0, 35, .04), 0 10px 30px rgba(0, 0, 35, .08);
	--m-sombra-3: 0 2px 4px rgba(0, 0, 35, .05), 0 22px 48px rgba(0, 0, 35, .14);

	--m-grad-guinda:   linear-gradient(135deg, var(--m-frambuesa) 0%, #612145 100%);
	--m-grad-marino:   linear-gradient(135deg, #1B2A6B 0%, #000023 100%);
	--m-grad-petroleo: linear-gradient(135deg, #0F6A84 0%, #002E3F 100%);
	--m-grad-verde:    linear-gradient(135deg, #1E7A5C 0%, #002A20 100%);
	--m-grad-dorado:   linear-gradient(135deg, #FFD27A 0%, #E09A1C 100%);
	--m-grad-lavanda:  linear-gradient(135deg, #8C8CD9 0%, #4B4B9B 100%);

	--m-curva: cubic-bezier(.2, .8, .2, 1);
}

html.tema-moderno:not([data-contraste="alto"]) {

	--bs-border-radius: var(--m-radio-s);
	--siie-radio: var(--m-radio);
	--siie-borde: var(--m-separador);

	body {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		letter-spacing: -.003em;
	}
	h1, h2, h3, .titulo-seccion { letter-spacing: -.022em; }
	h1 { font-weight: 800; }

	/* ---------- Encabezado: barra de vidrio esmerilado ---------- */
	.barra-institucional { background: #fff; border-bottom: 0; }
	.btn-a11y { border-radius: 999px; border-color: transparent; background: var(--m-relleno); }

	.encabezado {
		background: var(--m-vidrio);
		-webkit-backdrop-filter: saturate(180%) blur(20px);
		backdrop-filter: saturate(180%) blur(20px);
		border-bottom: 1px solid var(--m-separador);
		box-shadow: none;
	}
	.encabezado .nav-link {
		border-radius: 999px;
		padding: .5rem .85rem !important;
		transition: background-color .2s var(--m-curva), color .2s var(--m-curva);
	}
	.encabezado .nav-link:hover,
	.encabezado .nav-link:focus-visible { background: var(--m-relleno); }
	.encabezado .nav-link.active {
		background: var(--siie-marino); color: #fff;
		box-shadow: none; border-radius: 999px;
	}
	.encabezado .nav-restringido.active { background: var(--siie-guinda); }

	.encabezado .dropdown-menu {
		border: 1px solid rgba(255, 255, 255, .6);
		border-radius: var(--m-radio);
		background: rgba(255, 255, 255, .86);
		-webkit-backdrop-filter: saturate(180%) blur(24px);
		backdrop-filter: saturate(180%) blur(24px);
		box-shadow: var(--m-sombra-3);
		padding: .5rem;
		margin-top: .5rem !important;
	}
	.encabezado .dropdown-menu.show { animation: m-aparecer .22s var(--m-curva); }
	.encabezado .dropdown-item { border-radius: var(--m-radio-s); padding: .6rem .85rem; }
	.encabezado .dropdown-item:hover,
	.encabezado .dropdown-item:focus { background: var(--m-relleno); }
	.dropdown-divider { border-color: var(--m-separador); margin: .35rem .5rem; }

	.btn-acceso { background: var(--m-grad-marino); box-shadow: 0 6px 16px rgba(0, 0, 35, .25); }
	.navbar-toggler { border: 0; background: var(--m-relleno); border-radius: var(--m-radio-s); }

	@media (max-width: 1199.98px) {
		.encabezado .nav-link.active { border-radius: var(--m-radio-s); box-shadow: none; }
		.encabezado .dropdown-menu { box-shadow: none; background: var(--m-relleno); border: 0; }
	}

	/* ---------- Botones: cápsulas con relieve suave ---------- */
	.btn {
		border-radius: 999px;
		padding-inline: 1.25rem;
		transition: transform .15s var(--m-curva), box-shadow .2s var(--m-curva), background-color .2s;
	}
	.btn:active { transform: scale(.97); }
	.btn-sm { border-radius: 999px; padding-inline: .85rem; }
	.btn-lg { padding: .8rem 1.6rem; font-size: 1.05rem; }
	.btn-cta {
		background: var(--m-grad-guinda); border: 0; color: #fff;
		box-shadow: 0 8px 20px rgba(97, 33, 69, .32);
	}
	.btn-cta:hover, .btn-cta:focus { background: var(--m-grad-guinda); color: #fff; box-shadow: 0 12px 26px rgba(97, 33, 69, .42); transform: translateY(-1px); }
	.btn-outline-primario { border: 0; background: var(--m-relleno); color: var(--siie-marino); }
	.btn-outline-primario:hover, .btn-outline-primario:focus { background: var(--siie-marino); color: #fff; }
	.btn-primary { background: var(--m-grad-marino); border: 0; }
	.btn-outline-secondary, .btn-outline-primary, .btn-outline-danger, .btn-light {
		border-color: transparent; background: var(--m-relleno);
	}
	.btn-outline-secondary { color: var(--siie-texto); }
	.btn-outline-primary { color: var(--siie-marino); }
	.btn-outline-danger { color: #C4262E; }
	.btn-outline-secondary:hover, .btn-outline-primary:hover { background: var(--siie-marino); color: #fff; }
	.btn-outline-danger:hover { background: #C4262E; color: #fff; }

	/* ---------- Inicio: portada oscura con degradado de malla ---------- */
	.hero {
		position: relative; overflow: hidden; isolation: isolate;
		background:
			radial-gradient(60% 80% at 85% 20%, rgba(184, 51, 106, .55) 0%, transparent 60%),
			radial-gradient(50% 70% at 10% 90%, rgba(15, 106, 132, .45) 0%, transparent 60%),
			radial-gradient(35% 45% at 60% 95%, rgba(242, 179, 61, .28) 0%, transparent 70%),
			linear-gradient(160deg, #0A0A3A 0%, #000023 60%);
		color: #fff;
		padding: clamp(3rem, 8vw, 6.5rem) 0;
		border-bottom: 0;
	}
	.hero::before {
		content: ""; position: absolute; inset: 0; z-index: -1;
		background: url("../img/identidad/fondo-hero-oscuro.webp") center / cover no-repeat;
		opacity: .18; mix-blend-mode: screen;
		-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 60%);
		mask-image: linear-gradient(90deg, transparent 0%, #000 60%);
	}
	.hero h1 { color: #fff; font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1.06; }
	.hero-resalte {
		background: linear-gradient(90deg, #FFD27A 0%, #F2B33D 45%, #F08AB6 100%);
		-webkit-background-clip: text; background-clip: text; color: transparent;
	}
	.hero-antetitulo {
		display: inline-flex; align-items: center; gap: .5rem;
		background: rgba(255, 255, 255, .1); color: #fff;
		border: 1px solid rgba(255, 255, 255, .18);
		-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
		padding: .4rem .9rem; border-radius: 999px; letter-spacing: .06em;
	}
	.hero-antetitulo::before {
		content: ""; width: .5rem; height: .5rem; border-radius: 50%;
		background: var(--m-dorado); box-shadow: 0 0 0 4px rgba(242, 179, 61, .25);
	}
	.hero-texto { color: rgba(255, 255, 255, .78); font-size: 1.2rem; }
	.hero .btn-outline-primario {
		background: rgba(255, 255, 255, .12); color: #fff;
		border: 1px solid rgba(255, 255, 255, .22);
		-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	}
	.hero .btn-outline-primario:hover { background: #fff; color: var(--siie-marino); }
	.hero .btn-cta { background: var(--m-grad-dorado); color: #1E1400; box-shadow: 0 10px 28px rgba(242, 179, 61, .35); }
	.hero .btn-cta:hover, .hero .btn-cta:focus { background: var(--m-grad-dorado); color: #1E1400; }
	.hero-imagen {
		filter: brightness(0) invert(1) drop-shadow(0 10px 30px rgba(184, 51, 106, .55));
		opacity: .92;
		animation: m-flotar 7s ease-in-out infinite;
	}

	/* Secciones */
	.seccion-gris { background: var(--m-fondo); }
	.titulo-seccion { font-weight: 800; padding-bottom: 0; }
	.titulo-seccion::after { display: none; }
	.mas-texto summary { color: var(--siie-guinda); }

	/* Lista agrupada estilo Ajustes de iOS */
	.tarjeta-guia {
		background: #fff; border: 0; border-radius: var(--m-radio-l);
		box-shadow: var(--m-sombra-2); padding: 1.5rem 1.25rem .75rem;
	}
	.tarjeta-guia h3 { padding-inline: .5rem; }
	.lista-guia li {
		position: relative; align-items: center; gap: .9rem;
		padding: .7rem .5rem; border-top: 0; border-radius: var(--m-radio-s);
		transition: background-color .15s;
	}
	.lista-guia li + li::before {
		content: ""; position: absolute; top: 0; left: 3.6rem; right: .5rem;
		border-top: 1px solid var(--m-separador);
	}
	.lista-guia li:hover { background: var(--m-fondo); }
	.lista-guia li::after {
		content: "\F285"; font-family: "bootstrap-icons"; color: #C7C7CC; margin-left: auto; font-size: .9rem;
	}
	.lista-guia i {
		flex-shrink: 0; width: 2.25rem; height: 2.25rem; border-radius: 10px;
		display: grid; place-items: center; font-size: 1.1rem; line-height: 1;
		color: #fff; background: var(--m-grad-marino);
	}
	.lista-guia li:nth-child(6n+2) i { background: var(--m-grad-guinda); }
	.lista-guia li:nth-child(6n+3) i { background: var(--m-grad-petroleo); }
	.lista-guia li:nth-child(6n+4) i { background: var(--m-grad-dorado); }
	.lista-guia li:nth-child(6n+5) i { background: var(--m-grad-verde); }
	.lista-guia li:nth-child(6n+6) i { background: var(--m-grad-lavanda); }
	.lista-guia a { color: var(--siie-texto); }
	.lista-guia a::after { content: ""; position: absolute; inset: 0; }   /* toda la fila es clic */
	.lista-guia a:hover { color: var(--siie-texto); text-decoration: none; }

	/* Carrusel de secciones: tarjetas con icono tipo app */
	.btn-carrusel { border: 0; background: #fff; box-shadow: var(--m-sombra-1); }
	.btn-carrusel:hover { background: var(--siie-marino); }
	.carrusel { padding: .5rem .5rem 1.5rem; scrollbar-width: none; }
	.tarjeta-seccion {
		border: 0; border-radius: var(--m-radio-l); padding: 1.75rem;
		box-shadow: var(--m-sombra-2);
		transition: transform .35s var(--m-curva), box-shadow .35s var(--m-curva);
	}
	.tarjeta-seccion:hover, .tarjeta-seccion:focus-visible { transform: translateY(-6px) scale(1.01); box-shadow: var(--m-sombra-3); }
	.tarjeta-icono {
		width: 3.75rem; height: 3.75rem; border-radius: 16px; font-size: 1.65rem;
		background: var(--m-grad-marino);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 8px 18px rgba(0, 0, 35, .2);
	}
	.carrusel-item:nth-child(6n+2) .tarjeta-icono { background: var(--m-grad-guinda); }
	.carrusel-item:nth-child(6n+3) .tarjeta-icono { background: var(--m-grad-petroleo); }
	.carrusel-item:nth-child(6n+4) .tarjeta-icono { background: var(--m-grad-dorado); }
	.carrusel-item:nth-child(6n+5) .tarjeta-icono { background: var(--m-grad-verde); }
	.carrusel-item:nth-child(6n+6) .tarjeta-icono { background: var(--m-grad-lavanda); }
	.tarjeta-enlace {
		align-self: flex-start; background: var(--m-relleno); color: var(--siie-marino);
		padding: .4rem .9rem; border-radius: 999px; transition: background-color .2s, color .2s;
	}
	.tarjeta-seccion:hover .tarjeta-enlace { background: var(--siie-marino); color: #fff; }

	/* Cifras: banda oscura con tarjetas de vidrio */
	.cifras {
		background:
			radial-gradient(50% 90% at 0% 0%, rgba(184, 51, 106, .45) 0%, transparent 60%),
			radial-gradient(40% 80% at 100% 100%, rgba(242, 179, 61, .22) 0%, transparent 60%),
			#000023;
	}
	.cifras .titulo-seccion { color: #fff; }
	.cifra {
		background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12);
		-webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
		border-radius: var(--m-radio-l); padding: 1.75rem 1.25rem;
	}
	.cifra i { color: var(--m-dorado); }
	.cifra strong {
		font-weight: 800; font-size: clamp(2.2rem, 4vw, 3.2rem); letter-spacing: -.03em;
		background: linear-gradient(180deg, #FFFFFF 0%, #FFD27A 140%);
		-webkit-background-clip: text; background-clip: text; color: transparent;
	}
	.cifra span { color: rgba(255, 255, 255, .7); }

	/* ---------- Páginas de sección ---------- */
	.cabecera-seccion {
		background:
			radial-gradient(45% 120% at 100% 0%, rgba(184, 51, 106, .14) 0%, transparent 60%),
			radial-gradient(35% 90% at 85% 100%, rgba(242, 179, 61, .14) 0%, transparent 60%),
			linear-gradient(180deg, #FFFFFF 0%, var(--m-fondo) 100%);
		border-bottom: 0;
		padding: 2.25rem 0 2.75rem;
	}
	.cabecera-seccion h1 { font-size: clamp(2rem, 4.5vw, 3rem); }
	.cabecera-icono {
		width: 4rem; height: 4rem; border-radius: 18px; font-size: 1.8rem;
		background: var(--m-grad-guinda);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 10px 24px rgba(97, 33, 69, .3);
	}
	.breadcrumb { font-weight: 500; }

	/* Pestañas como control segmentado */
	.pestanas-contenedor { scrollbar-width: none; }
	.pestanas {
		display: inline-flex; gap: 2px; border: 0;
		background: var(--m-relleno); border-radius: 14px; padding: 3px;
	}
	.pestanas .nav-link {
		border: 0 !important; border-radius: 11px; margin: 0;
		color: var(--siie-texto); padding: .55rem 1.1rem; font-weight: 600;
		transition: background-color .2s var(--m-curva), box-shadow .2s var(--m-curva);
	}
	.pestanas .nav-link:hover { background: rgba(255, 255, 255, .55); color: var(--siie-texto); }
	.pestanas .nav-link.active {
		background: #fff; color: var(--siie-marino);
		box-shadow: 0 3px 8px rgba(0, 0, 0, .12), 0 3px 1px rgba(0, 0, 0, .04);
	}

	.aviso-pendiente {
		border: 0; border-radius: var(--m-radio);
		background: var(--m-dorado-suave); color: #3D2A00;
	}
	.aviso-pendiente i { color: var(--m-dorado-texto); }

	/* Contenido */
	.cita-destacada { border-radius: var(--m-radio); border-left: 0; box-shadow: var(--m-sombra-1); }
	.figura-contenido img { border: 0; border-radius: var(--m-radio-l); box-shadow: var(--m-sombra-2); }
	.tarjeta-documento, .tarjeta-enlace-externo, .tarjeta-pifie, .practica-identificada, .tarjeta-contacto {
		border: 0 !important; border-radius: var(--m-radio); box-shadow: var(--m-sombra-1); background: #fff;
		transition: transform .3s var(--m-curva), box-shadow .3s var(--m-curva);
	}
	.tarjeta-enlace-externo:hover, .tarjeta-pifie:hover { transform: translateY(-4px); box-shadow: var(--m-sombra-3); }
	.tarjeta-pifie { overflow: hidden; }
	.tarjeta-pifie img { border-bottom: 0; }
	.practica-identificada[open] { box-shadow: var(--m-sombra-2); }
	.filtros-tarjetas { background: #fff; box-shadow: var(--m-sombra-1); border-radius: var(--m-radio); }
	.lista-equipo li, .lista-roles li { border: 0; background: var(--m-relleno); }

	/* ---------- Formularios: campos rellenos, sin borde ---------- */
	.form-control, .form-select {
		border-radius: var(--m-radio-s);
		background-color: var(--m-fondo);
		border: 1px solid transparent;
		padding: .7rem .95rem;
		transition: background-color .2s, box-shadow .2s, border-color .2s;
	}
	.form-control:focus, .form-select:focus {
		background-color: #fff; border-color: rgba(0, 0, 35, .35);
		box-shadow: 0 0 0 4px rgba(97, 33, 69, .14);
	}
	.form-control.is-invalid, .was-validated .form-control:invalid { border-color: var(--bs-danger); }
	.input-group > .form-control, .input-group > .btn { border-radius: var(--m-radio-s); }
	.form-check-input { border-color: rgba(60, 60, 67, .3); }
	.form-switch .form-check-input { width: 2.6em; height: 1.5em; margin-top: 0; }
	.form-switch .form-check-input:checked { background-color: #34A065; border-color: #34A065; }
	.tarjeta-acceso { border: 0; border-radius: var(--m-radio-l); box-shadow: var(--m-sombra-3); padding: 2.25rem; }
	.formulario-panel legend, .reactivo legend { letter-spacing: -.01em; }
	.btn-opcion { border-radius: 999px; border-color: transparent; background: var(--m-relleno); }

	.indicador-pasos span { border-radius: 50%; }
	.indicador-pasos li.activo span { background: var(--m-grad-guinda); border-color: transparent; box-shadow: 0 4px 12px rgba(97, 33, 69, .3); }
	.indicador-pasos li.hecho span { background: #34A065; border-color: #34A065; }

	.reactivo, .dimension-rubrica { border: 0; border-radius: var(--m-radio); box-shadow: var(--m-sombra-1); }
	.opcion-reactivo label { border-radius: var(--m-radio-s); border-color: transparent; background: var(--m-fondo); }
	.opcion-reactivo input:checked + label { background: #fff; border-color: var(--siie-guinda); box-shadow: 0 0 0 3px rgba(97, 33, 69, .12); }
	.progress { border-radius: 999px; background: var(--m-relleno); }
	.progress-bar { background: var(--m-grad-guinda); border-radius: 999px; }

	/* ---------- Paneles internos ---------- */
	.cabecera-panel {
		background: linear-gradient(180deg, #FFFFFF 0%, var(--m-fondo) 100%);
		border-bottom: 0;
	}
	.cabecera-panel h1 { font-weight: 800; }
	.panel-usuario .badge { background: var(--m-grad-guinda) !important; }
	.menu-panel .nav {
		display: inline-flex; gap: 2px; background: var(--m-relleno); border-radius: 14px; padding: 3px;
	}
	.menu-panel .nav-link {
		border-radius: 11px; padding: .5rem 1rem; color: var(--siie-texto); margin: 0;
	}
	.menu-panel .nav-link:hover { background: rgba(255, 255, 255, .55); }
	.menu-panel .nav-link.active {
		background: #fff; color: var(--siie-marino); margin: 0;
		box-shadow: 0 3px 8px rgba(0, 0, 0, .12), 0 3px 1px rgba(0, 0, 0, .04);
	}
	.panel-contenido { background: var(--m-fondo); }
	.bloque-panel { border: 0; border-radius: var(--m-radio-l); box-shadow: var(--m-sombra-1); }
	.bloque-destacado { border-left: 0; box-shadow: inset 4px 0 0 var(--siie-guinda), var(--m-sombra-1); }
	.tarjeta-panel {
		border: 0; border-radius: var(--m-radio-l); box-shadow: var(--m-sombra-1);
		transition: transform .3s var(--m-curva), box-shadow .3s var(--m-curva);
	}
	a.tarjeta-panel:hover { transform: translateY(-4px); box-shadow: var(--m-sombra-3); }
	.tarjeta-panel .tarjeta-icono { width: 3rem; height: 3rem; border-radius: 14px; font-size: 1.35rem; }
	.row > :nth-child(6n+2) > .tarjeta-panel .tarjeta-icono { background: var(--m-grad-guinda); }
	.row > :nth-child(6n+3) > .tarjeta-panel .tarjeta-icono { background: var(--m-grad-petroleo); }
	.row > :nth-child(6n+4) > .tarjeta-panel .tarjeta-icono { background: var(--m-grad-dorado); }
	.row > :nth-child(6n+5) > .tarjeta-panel .tarjeta-icono { background: var(--m-grad-verde); }
	.tarjeta-numero { font-weight: 800; letter-spacing: -.03em; }

	.tabla-panel { border: 0; border-radius: var(--m-radio-l); box-shadow: var(--m-sombra-1); }
	.tabla-panel thead th {
		background: #fff; color: rgba(60, 60, 67, .6);
		border-bottom: 1px solid var(--m-separador);
		text-transform: none; letter-spacing: 0; font-size: .8rem;
	}
	.tabla-panel tbody tr { transition: background-color .15s; }
	.tabla-panel tbody tr:hover { background: rgba(0, 0, 35, .025); }
	.tabla-panel td { border-color: var(--m-separador); }
	.buscador-tabla .form-control { border-radius: var(--m-radio-s); background: #fff; box-shadow: var(--m-sombra-1); }

	/* Etiquetas teñidas estilo iOS */
	.badge { border-radius: 999px; font-weight: 600; padding: .4em .75em; }
	.text-bg-success { background: rgba(52, 160, 101, .15) !important; color: #1C6B40 !important; }
	.text-bg-warning { background: var(--m-dorado-suave) !important; color: var(--m-dorado-texto) !important; }
	.text-bg-danger  { background: rgba(196, 38, 46, .12) !important; color: #A11D24 !important; }
	.text-bg-light   { background: var(--m-relleno) !important; color: var(--siie-texto) !important; border: 0 !important; }

	/* Avisos y ventanas */
	.alert { border: 0; border-radius: var(--m-radio); box-shadow: var(--m-sombra-1); }
	.alert-success { background: #E8F6EE; color: #17583A; }
	.alert-danger { background: #FDECEC; color: #8A1A20; }
	.modal-content {
		border: 0; border-radius: var(--m-radio-l);
		background: rgba(255, 255, 255, .92);
		-webkit-backdrop-filter: saturate(180%) blur(24px); backdrop-filter: saturate(180%) blur(24px);
		box-shadow: var(--m-sombra-3);
	}
	.modal.show .modal-dialog { animation: m-aparecer .25s var(--m-curva); }
	.modal-header, .modal-footer { border: 0; }
	.modal-backdrop.show { opacity: .35; }

	/* ---------- Menú secundario y pie ---------- */
	.menu-secundario { background: var(--m-fondo); padding: 2.5rem 0; }
	.acceso-secundario {
		border: 0; border-radius: var(--m-radio-l); background: #fff; box-shadow: var(--m-sombra-1);
		transition: transform .3s var(--m-curva), box-shadow .3s var(--m-curva);
	}
	.acceso-secundario:hover, .acceso-secundario.active { transform: translateY(-3px); box-shadow: var(--m-sombra-2); background: #fff; color: var(--siie-texto); }
	.acceso-icono { border-radius: 14px; background: var(--m-grad-guinda); color: #fff; }
	.row > :nth-child(4n+2) > .acceso-secundario .acceso-icono { background: var(--m-grad-petroleo); }
	.row > :nth-child(4n+3) > .acceso-secundario .acceso-icono { background: var(--m-grad-dorado); }
	.row > :nth-child(4n+4) > .acceso-secundario .acceso-icono { background: var(--m-grad-marino); }

	.pie {
		background:
			radial-gradient(60% 120% at 100% 0%, rgba(184, 51, 106, .5) 0%, transparent 60%),
			linear-gradient(180deg, #612145 0%, #3E1029 100%);
		border-radius: var(--m-radio-l) var(--m-radio-l) 0 0;
		margin-top: -1.5rem; position: relative;
	}
	.pie-logo { border-radius: 16px; box-shadow: 0 8px 20px rgba(0, 0, 0, .25); }
	.pie-redes a {
		display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%;
		background: rgba(255, 255, 255, .12); font-size: 1.15rem; text-decoration: none;
		transition: background-color .2s, color .2s;
	}
	.pie-redes a:hover { background: var(--m-dorado); color: #1E1400; }
	.pie hr { border-color: rgba(255, 255, 255, .14); }
}

@keyframes m-aparecer {
	from { opacity: 0; transform: translateY(-6px) scale(.98); }
	to   { opacity: 1; transform: none; }
}
@keyframes m-flotar {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-10px); }
}

/* Sin animaciones para quien lo prefiera */
@media (prefers-reduced-motion: reduce) {
	html.tema-moderno *, html.tema-moderno *::before, html.tema-moderno *::after {
		animation: none !important; transition: none !important;
	}
	html.tema-moderno .tarjeta-seccion:hover, html.tema-moderno a.tarjeta-panel:hover { transform: none; }
}