@font-face {
    font-family: 'Satisfy';
    src: url('fonts/Satisfy.eot');
    src: url('fonts/Satisfy.eot?#iefix') format('embedded-opentype'),
        url('fonts/Satisfy.woff2') format('woff2'),
        url('fonts/Satisfy.woff') format('woff'),
        url('fonts/Satisfy.ttf') format('truetype'),
        url('fonts/Satisfy.svg#Satisfy') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Scriptina';
    src: url('fonts/Scriptina.eot');
    src: url('fonts/Scriptina.eot?#iefix') format('embedded-opentype'),
        url('fonts/Scriptina.woff2') format('woff2'),
        url('fonts/Scriptina.woff') format('woff'),
        url('fonts/Scriptina.ttf') format('truetype'),
        url('fonts/Scriptina.svg#Scriptina') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Nexa Slab';
    src: url('fonts/NexaSlabHeavy.eot');
    src: url('fonts/NexaSlabHeavy.eot?#iefix') format('embedded-opentype'),
        url('fonts/NexaSlabHeavy.woff2') format('woff2'),
        url('fonts/NexaSlabHeavy.woff') format('woff'),
        url('fonts/NexaSlabHeavy.ttf') format('truetype'),
        url('fonts/NexaSlabHeavy.svg#NexaSlabHeavy') format('svg');
    font-weight: 900;
    font-style: normal;
}

body {
	margin: 0;
	height: 100vh;
	background-image: url('../docs/background.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	position: relative;
}
.effect {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('../docs/effect.png');
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	z-index: 1;
}
.container {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%); 
	width: 100%;
	height: 100%;
	z-index: 2;
}

.local {
	font-family: 'Nexa Slab';
	font-weight: 900;
	font-style: normal;
	font-size: 2vw;
	color: white;
}

.soon {
	font-family: 'Scriptina';
    font-weight: normal;
    font-style: normal;
    font-size: 4vw;
    color: white;
}

a {
    font-family: 'Nexa Slab';
    font-weight: 900;
    font-style: normal;
    font-size: 1vw;
    position: absolute;
    bottom: 2%;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: white;
    text-decoration: none;
}

@media (max-width: 767px) {
    .local {
        font-size: 4.3vw;
    }
    .soon {
    	font-size: 10vw;
    }
    a {
        font-size: 3vw;
    }
}

/* Estilos para telas médias (como tablets) */
@media (min-width: 768px) and (max-width: 1024px) {
   .local {
        font-size: 4vw;
    }
    .soon {
    	font-size: 10vw;
    }
    a {
        font-size: 4vw;
    }
}