/* Variables CSS - Paleta CORSAN & ABOGADOS (Verde Bosque & Dorado) */
:root {
	/* Colores de la marca Corsan */
	--color-primary-dark: #274E3C; /* Verde Bosque (Principal) */
	--color-secondary-light: #C39E5F; /* Dorado/Ocre (Acento/Highlight) */
	--color-background-base: #FFFFFF; /* Blanco */
	--color-background-soft: #1C372B; /* Fondo de caja sutil (Verde oscuro) */
	--color-text-main: #FFFFFF;	/* Texto principal: Blanco */
	--color-text-slogan: #C39E5F; /* Dorado para el slogan */
	--color-text-subtle: #AAAAAA;/* Gris para textos secundarios */
	
	/* Fuentes Corporativas */
	--font-heading: 'Cormorant Garamond', serif;
	--font-body: 'Montserrat', sans-serif;
	--font-subtitle: 'Montserrat', sans-serif;
	--font-buttons: 'Montserrat', sans-serif;
}
/* ------------------- AJUSTES GENERALES Y TIPOGRAFÍA ------------------- */
body {
	font-family: var(--font-body);
	margin: 0;
	padding: 0;
	background-color: var(--color-primary-dark); /* Fondo Verde Bosque */
	
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 100vh;
}
/* Estructura de la Landing */
	.background-layer {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: -1;
		
		background-image: url('./assets/img/background.jpg');
		background-size: cover;
		background-position: center;
		background-attachment: fixed;
		
		filter: contrast(1.1);
		opacity: 1;
	}
	.content-box {
		max-width: 550px; 
		width: 100%;
		background-color: rgba(28, 55, 43, 0.95); 
		border-radius: 8px;
		border: 1px solid var(--color-secondary-light);	
		box-shadow: 0 0 15px rgba(195, 158, 95, 0.5), 0 0 30px rgba(39, 78, 60, 0.8);	
		text-align: center;
		z-index: 1;
	}
/* ------------------- PERFIL ------------------- */
	@keyframes pulse-legal { /* Nueva animación Legal */
		0% {
			transform: scale(1);
			box-shadow: 0 0 10px var(--color-primary-dark), 0 0 20px var(--color-secondary-light);
		}
		50% {
			transform: scale(1.03);
			box-shadow: 0 0 20px var(--color-primary-dark), 0 0 40px var(--color-secondary-light);
		}
		100% {
			transform: scale(1);
			box-shadow: 0 0 10px var(--color-primary-dark), 0 0 20px var(--color-secondary-light);
		}
	}
	#profileAvatar {
		width: 120px;
		height: 120px;
		object-fit: cover;
		border: 5px solid var(--color-secondary-light);
		box-shadow: 0 0 10px var(--color-primary-dark), 0 0 20px var(--color-secondary-light);
		background-color: var(--color-background-base); 
		border-radius: 50%;
	}
	#profileAvatar:hover {
		animation: pulse-legal 1.5s infinite alternate ease-in-out;
		cursor: pointer;
	}
/* ------------------- TÍTULOS & STATS ------------------- */
	h1 {
		font-family: var(--font-heading);
		color: var(--color-text-main); /* Blanco */
		font-size: 3em;
		text-shadow: 1px 1px 2px var(--color-primary-dark);
		margin-top: 10px !important;
	}
	.subtitle {
		font-family: var(--font-subtitle);
		color: var(--color-secondary-light);	/* Dorado */
		font-size: 1.1em;
		letter-spacing: 2px; 
		font-weight: 400;
	}
	/* CORRECCIÓN CLAVE 1: Estilos de la línea de estadísticas */
	.stats-line {
		color: var(--color-text-main); /* Blanco */
		display: flex;
		justify-content: space-around;
		padding: 10px 0;
		margin-top: 15px !important;
		margin-bottom: 25px !important;
		border-top: 1px dashed var(--color-text-subtle);
		border-bottom: 1px dashed var(--color-text-subtle);
		font-size: 0.95em;
	}
	.stats-line span {
		font-weight: 700;
		display: block;
	}
	.stats-line i {
		margin-right: 5px;
	}

	/* CORRECCIÓN CLAVE 2: Aplicar colores de icono de forma explícita */
	.color-primary { color: var(--color-primary-dark) !important; }
	.color-secondary { color: var(--color-secondary-light) !important; }

/* ------------------- BOTÓN CTA PRINCIPAL (MAIN) ------------------- */
	.cta-main {
		font-family: var(--font-buttons);
		font-weight: 700;
		font-size: 1.2em;
		width: 100%;
		
		/* Estilo DORADO sobre VERDE BOSQUE */
		background-color: var(--color-secondary-light) !important; 
		color: var(--color-primary-dark) !important; 
		
		border: 2px solid var(--color-primary-dark); 
		border-radius: 4px;
		
		box-shadow: 0 0 10px rgba(195, 158, 95, 0.5); 
		transition: all 0.2s ease;
		padding: 15px 25px;
	}
	.cta-main:hover {
		background-color: var(--color-primary-dark) !important;
		color: var(--color-secondary-light) !important;
	}
/* ------------------- BOTONES DE ENLACES (VERDE BOSQUE Y DORADO) ------------------- */
	.link-button {
		font-family: var(--font-buttons);
		font-weight: 700;
		border-radius: 4px;	
		padding: 15px 25px;	
		font-size: 1em;	
	}
	.link-button.style-wine { /* Verde Bosque con texto Dorado (Dark Button) */
		background-color: var(--color-primary-dark);
		color: var(--color-secondary-light);
		border-color: var(--color-secondary-light);
	}
	.link-button.style-wine:hover {
		background-color: var(--color-secondary-light);
		color: var(--color-primary-dark) !important;
		box-shadow: 0 0 10px var(--color-secondary-light);
	}
	.link-button.style-rose { /* Dorado con texto Verde Bosque (Light Button) */
		color: var(--color-primary-dark);
		background-color: var(--color-secondary-light);
		border-color: var(--color-secondary-light);
	}
	.link-button.style-rose:hover {
		background-color: var(--color-background-base); /* Blanco */
		color: var(--color-primary-dark) !important;
		box-shadow: 0 0 10px var(--color-secondary-light);
	}
	.contact-button { /* (Usado para Ubícanos en este caso) */
		background-color: var(--color-secondary-light);
		border-color: var(--color-secondary-light);
		color: var(--color-primary-dark);
	}
	.contact-button:hover {
		background-color: var(--color-primary-dark);
		color: var(--color-secondary-light);
	}
/* ------------------- FOOTER ------------------- */
	.footer-credits {
		color: var(--color-text-main);
		font-size: 0.75em;
	}
	.footer-credits a {
		color: var(--color-secondary-light);
	}
	.footer-credits a:hover {
		color: var(--color-primary-dark);
	}
/* ------------------- SWEETALERT2 STYLES ------------------- */
	.neon-popup {
		background: var(--color-primary-dark) !important;
		border: 2px solid var(--color-secondary-light) !important;
		color: var(--color-text-main) !important;
	}
	.neon-title {
		color: var(--color-secondary-light) !important;	
		font-family: var(--font-heading) !important;
	}
	.neon-confirm-button {
		color: var(--color-primary-dark) !important;
		background-color: var(--color-secondary-light) !important;
	}
	.neon-cancel-button {
		background-color: var(--color-primary-dark) !important;
		color: var(--color-secondary-light) !important;
	}