/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap');

/* Root */
:root {
	--primary: #d0b557;
	--secondary: #2C3447;
	--text-dark: #363636;
}

/* Basics */
body, html {
	height: 100vh;
	background-color: #f9f8f3;
}

p, a, li, div, span {
	font-family: "EB Garamond", serif;
}

.cursiva {
	font-family: "parfumerie-script", sans-serif;
}

p, section li, input {
	font-size: 16px;
}

li a {
	font-size: inherit;
}

b, strong {
	font-weight: 900!important;
}

.white {
	background-color: #fff;
}

.text-white {
	color: #fff;
}

.text-primary {
	color: var(--primary)!important;
}

.primary {
	background-color: var(--primary);
}

h1.nomes {
	font-size: clamp(80px, 24vw, 200px)!important;
	line-height: 0.8;
	color: #384b21!important;
}

#overlay {
	background-color: #f9f8f3;
	transition: opacity 0.8s ease, visibility 0.8s ease;
    opacity: 1;
    visibility: visible;
}

#overlay.faded {
	opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

img.envelope {
	transition: 0.3s;
	width: 200px;
}

img.envelope:hover {
	transform: scale(1.1) rotate(5deg);
}

div.bordado {
	border-top: 3px solid var(--primary);
	border-bottom: 3px solid var(--primary);
}

@keyframes balanco-topo {
    0% { transform: scaleX(-1) rotate(7deg); }
    100% { transform: scaleX(-1) rotate(13deg); }
}

@keyframes balanco-base {
    0% { transform: scaleX(-1) rotate(187deg); }
    100% { transform: scaleX(-1) rotate(193deg); }
}

.folhas-container {
    --folha-width: 25vw;
    --folha-offset-y: -3%;
    --folha-offset-x: -3%;
}

img.folha {
    display: block;
    pointer-events: none;
    width: var(--folha-width);
    height: auto;
    max-width: 600px;
}

img.folha-01 {
    transform: scaleX(-1) rotate(10deg);
    top: var(--folha-offset-y);
    right: var(--folha-offset-x);
	animation: balanco-topo 6s ease-in-out infinite alternate;
}

img.folha-02 {
    transform: scaleX(-1) rotate(190deg);
    bottom: var(--folha-offset-y);
    left: var(--folha-offset-x);
	animation: balanco-base 6s ease-in-out infinite alternate;
}

a.botao {
	transition: 0.3s;
	width: 100px;
	height: 100px;
	display: block;
	font-size: 30px;
	margin: 0 auto;
	text-align: center;
	line-height: 100px;
	background-color: var(--primary);
	color: #fff;
	border-radius: 50%;
}

a.botao:hover {
	transform: scale(1.05);
}

a.botao i {
	font-size: inherit;
}

@media only screen and (max-width: 992px) {
    .folhas-container {        
        --folha-width: 55vw;
        --folha-offset-y: -5%;
        --folha-offset-x: -15%;
    }
	
	.texto-botao {
		font-size: 16px!important;
	}
	
	a.botao {
		width: 80px;
		height: 80px;
		line-height: 80px;
	}
}

@media only screen and (max-width: 576px) {
    .folhas-container {
		--folha-width: 45vw;
		--folha-offset-y: -1%;
        --folha-offset-x: -15%;
    }
	
	img.folha { max-width: none; }
}