* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}


body {
	margin: 0;
	padding: 0;
	background-image: linear-gradient(to top, #252525, #202020, #1b1b1b, #161616, #111010, #0e0d0d, #090808, #050404, #040303, #020202, #010101, #000000);
  	 /* background: url("https://hagall-media.de/cp/forest3.jpg") repeat-x; */
	/* background-color: black; */
	background-position: center bottom;
	background-size: cover;
	overflow: hidden;
	height: 100vh;
	width: 100vw;
	
	background-attachment: fixed;        /* Fija el gradiente al viewport */
  	min-height: 100vh;                   /* Ocupa toda la altura visible */
}

.container-one {
    width: 100%; /* Ajusta el ancho para móviles */
    height: 100vh; /* Ajusta la altura automáticamente */
    background-color: transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    position: relative;
    z-index: 10;
	margin-top: -17vh;
}

.container-one .logo img {
    width: 100%; /* Ajusta el tamaño de la imagen al contenedor */
    max-width: 290px; /* Limita el tamaño máximo */
    filter: invert(100%);
    margin-bottom: -10px;
}

.container-one .text-verify {
    text-align: center;
    font-size: 0.8rem;
    margin-bottom: -3px;
    width: 100%; /* Ajusta el ancho al 100% */
    max-width: 400px; /* Limita el ancho máximo */
    color: rgb(255, 255, 255);
	text-transform: uppercase;
}

.container-one span {
    text-align: center;
    font-size: 0.7rem;
    margin-bottom: -3px;
    width: 100%; /* Ajusta el ancho al 100% */
    max-width: 400px; /* Limita el ancho máximo */
    color: rgba(243, 243, 243, 0.5);
	text-transform: uppercase;
}

/* MODIFICA ESTOS ESTILOS */
.footer-text {
    position: fixed; /* Usamos fixed para mejor control */
    bottom: 30px; /* Distancia desde el fondo */
    left: 50%; /* Centrado horizontal */
    transform: translateX(-50%); /* Ajuste fino de centrado */
    text-align: center;
    font-size: 0.7rem;
    color: rgba(243, 243, 243, 0.5);
    text-transform: uppercase;
    letter-spacing: 0px;
    width: 100%;
    max-width: 300px; /* Ancho máximo para mejor legibilidad */
    padding: 0 20px;
    z-index: 11;
    pointer-events: all;
}

.footer-text a {
    display: inline-block; /* Necesario para animaciones */
    font-size: 0.9rem;
    text-decoration: none;
    color: rgba(255, 255, 255, 0.8);
    transition: all 0.3s ease;
    margin: 1px 0; /* Espaciado vertical */
}

/* Efecto hover para feedback visual */
.footer-text a:hover {
    color: white;
    transform: translateY(-1px);
    text-shadow: 0 2px 8px rgba(255, 255, 255, 0.3);
}

.check {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100px; /* Ajusta el tamaño según lo que necesites */
    width: 100px; /* Ajusta el tamaño según lo que necesites */
}

.check img {
    width: 70%;
    /* filter: drop-shadow(0px 5px 15px #8bcff6); */
}

canvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#snow-canvas-1 {
	z-index: 6;
}
#snow-canvas-2 {
	z-index: 5;
}
#snow-canvas-3 {
	z-index: 4;
}
#snow-canvas-4 {
	z-index: 3;
}
#snow-canvas-5 {
	z-index: 2;
}
#snow-canvas-6 {
	z-index: 1;
}

.clouds-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1;
    background: url("./tinified/clouds.png") repeat-x;
    background-size: cover;
    mix-blend-mode: plus-lighter;
    will-change: background-position;
    backface-visibility: hidden;
    transform: translate3d(0, 0, 0); /* Acelera hardware */
    
    /* Estados iniciales */
    opacity: 0;
    animation: moveClouds 200s linear infinite paused;
    transition: opacity 1.5s ease-out;
}

.clouds-bg.loaded {
    opacity: 0.7;
    animation-play-state: running;
}

@keyframes moveClouds {
    0% { background-position: 5vw 0; }
    100% { background-position: calc(20vw - 3000px) 0; }
}