@font-face {
    font-family: 'StyleScript-Regular';
    src:  local('StyleScript-Regular'), 
          url('../assets/fonts/StyleScript-Regular.woff') format('woff'),
          url('../assets/fonts/StyleScript-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display:swap;

}
@font-face {
		font-family: "Zen Kurenaido";
		src:  local("Zen Kurenaido"), 
					url('../assets/fonts/ZenKurenaido-Regular.woff') format('woff'),
					url('../assets/fonts/ZenKurenaido-Regular.ttf') format('truetype');
		font-weight: 400;
		font-style: normal;
		font-display:swap;

}
@font-face {
		font-family: "WDXL Lubrifont JP N";
		src:  local("WDXL Lubrifont JP N"), 
					url('../assets/fonts/WDXLLubrifontJPN-Regular.woff') format('woff'),
					url('../assets/fonts/WDXLLubrifontJPN-Regular.ttf') format('truetype');
		font-weight: 400;
		font-style: normal;
		font-display:swap;

}


:root{
	--primary-color: #e55ccb;
	--primary-color-light: #ec85d8;
	--primary-color-lightest: #f9d6f2;
	--white-color: #FFFFFF;
	--black-color: #000000;

	--animation-neon-flicker: neon-flicker 3s linear infinite alternate;

}
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	font-family:"Zen Kurenaido", sans-serif;
	color: #FFFFFF;
	line-height: 1.35;
	font-size: 1rem;
}


body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	overflow-x: hidden;
	min-width: 100%;
	padding: 0;
	margin:0;
  background:
    linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)),
    url('../assets/img/bg.jpg') center/cover no-repeat;
	/* Selección inteligente de formato */
	background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), -webkit-set(
			url('../assets/img/bg.avif') type('image/avif'),
			url('../assets/img/bg.webp') type('image/webp'),
			url('../assets/img/bg.jpg') type('image/jpeg')
	);
	background-image: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), image-set(
			url('../assets/img/bg.avif') type('image/avif'),
			url('../assets/img/bg.webp') type('image/webp'),
			url('../assets/img/bg.jpg') type('image/jpeg')
	);
	box-sizing: border-box;
}

h1 {
	font-size: 2rem;
	margin-bottom: 10px;
	margin-top:0;
	font-family:  "WDXL Lubrifont JP N", sans-serif;
	color: var(--white-color);
}
h2{
	font-family: 'StyleScript-Regular', cursive;
	font-size:1.5rem;
	font-weight:400;
	color: var(--primary-color-lightest);
	text-align: end;
	margin: 1em 0;
}
p {
	font-size: 1.2em;
	margin-bottom: 20px;
}

.neon-btn {
	--transform-transition-parameters: transform 0.3s ease-in-out;
	display:inline-block;
	position: relative;
	color: var(--white-color);
	z-index: 2;
	padding: 0.5rem 1.5rem;
	font-family: 'StyleScript-Regular', cursive;
	font-size: 1.75rem;
	border: 0.25rem solid var(--white-color);
	text-decoration: none;
	border-radius: 1.15rem;
	transition: var(--transform-transition-parameters);
	transform: scale(1) translateY(0rem) translateX(0rem);
	filter: drop-shadow(0px 0px 0.0625em var(--white-color))
	drop-shadow(0px 0px 0.0625em var(--white-color))
	drop-shadow(0px 0px 4em var(--primary-color-lightest))
	drop-shadow(0px 0px 2em var(--primary-color-light))
	drop-shadow(0px 0px 0.5em var(--primary-color));
	will-change: transform;
}

.neon-btn:before,
.neon-btn:after {
	content: "";
	position: absolute;
	inset: -0.25rem; /* 🔥 compensas el border */
	border: 0.25rem solid var(--white-color);
	border-radius: inherit;
	z-index: -1;
	opacity:0;
	transition: opacity 0.1s ease, var(--transform-transition-parameters);

	
	}
.neon-btn:hover{
	transform: translateY(0.6rem) translateX(0.6rem);
}
.neon-btn:hover:before {
	opacity: 1;
	transform: translate(-0.15rem, -0.15rem);
}

.neon-btn:hover:after {
	opacity: 1;
	transform: translate(-0.3rem, -0.3rem);
	
}

.neon-btn.centered {
	display: block;
	width: fit-content;
	margin: 0 auto;
}