:root{
--cream:#f7f3ee;
--stone:#b5a898;
--warm:#7a6e65;
--charcoal:#2c2825;
}

*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

html,
body{
	width:100%;
	height:100%;
	overflow-x:hidden;
}

body{
	position:relative;
	background:var(--cream);
	color:var(--charcoal);
	font-family:'Cormorant Garamond', serif;
	-webkit-font-smoothing:antialiased;
}


.wrap{
	position:relative;
	z-index:3;
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:40px;
}

.content{
	width:100%;
	max-width:560px;
	text-align:center;
}

.logo{
	font-family:'Playfair Display', serif;
	font-size:clamp(96px,16vw,194px);
	line-height:.92;
	letter-spacing:-0.05em;
}

.sub{
	margin-top:16px;
	font-size:21px;
	letter-spacing:5px;
	color:var(--stone);
}


.intro{
	font-size:22px;
	font-style:italic;
	font-weight:300;
	line-height:1.6;
	margin-bottom:34px;
	margin-top: 34px;
}

form{
	display:flex;
	flex-direction:column;
	align-items:center;
}

.email{
	width:100%;
	background:transparent;
	border:none;
	border-bottom:1px solid rgba(181,168,152,.7);
	padding:14px 0;
	text-align:center;
	font-size:17px;
	font-family:'Cormorant Garamond', serif;
	color:var(--charcoal);
	outline:none;
	transition:.35s ease;
}

.email::placeholder{
	color:var(--stone);
	font-style:italic;
}

.email:focus{
	border-color:var(--charcoal);
}

.submit{
	margin-top:18px;
	background:transparent;
	border:none;
	cursor:pointer;
	font-size:10px;
	letter-spacing:4px;
	text-transform:uppercase;
	color:var(--warm);
	transition:.3s ease;
}

.submit:hover{
	color:var(--charcoal);
}

.success-message{
	margin-bottom:26px;
	margin-top:40px;
	font-size:30px;
	font-style:italic;
	color:var(--warm);
}

.fade-up{
	opacity:0;
	transform:translateY(18px);
	animation:fadeUp 1.8s cubic-bezier(.19,1,.22,1) forwards;
}

.delay-1{ animation-delay:.35s; }
.delay-2{ animation-delay:.85s; }
.delay-3{ animation-delay:1.2s; }

@keyframes fadeUp{

from{
	opacity:0;
	transform:translateY(18px);
}

to{
	opacity:1;
	transform:translateY(0);
}

}

@media(max-width:640px){

	.logo{
		font-size:110px;
	}

}