@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700&family=Cinzel:wght@400;600&family=Libre+Baskerville&family=Cormorant+Garamond:wght@400;600&display=swap');

html,body{
	margin:0;
	padding:0;
	color:#5a7190;
	font-family:'Libre Baskerville',serif;
	background-color:#D9FAFB;
	background-attachment:fixed;
}
#header{
	background-image:url("images/head.jpg");
	background-color:#D9FAFB;
	background-repeat:no-repeat;
	background-position:center;
	height:584px;
	width:100%;
	position:relative;
}
#layout-container{
	width:70%;
	max-width:1160px;
	margin:45px auto 0;
	padding:35px;
	display:block!important;
	position:relative;
	z-index:5;
}
#navigation{
	display:grid;
	grid-template-columns:repeat(3,max-content);
	justify-content:center;
	align-items:center;
	gap:1.2rem 3rem;
	width:fit-content;
	margin:-70px auto 80px;
}
#navigation a{
	position:relative;
	overflow:hidden;
	display:flex;
	align-items:center;
	justify-content:center;
	min-width:90px;
	padding:1rem 2rem;
	margin-top:40px;
	font-family:'Cinzel',serif;
	font-size:.72rem;
	font-weight:600;
	letter-spacing:.35em;
	text-transform:uppercase;
	text-decoration:none;
	color:#6b97b8;
	background:linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(244,252,255,.82) 45%,rgba(221,243,251,.70) 100%);
	border:1px solid rgba(194,229,243,.75);
	border-radius:999px;
	backdrop-filter:blur(18px);
	box-shadow:inset 0 2px 0 rgba(255,255,255,.95),inset 0 -10px 18px rgba(170,219,238,.18),0 18px 35px rgba(160,205,225,.20);
	transition:.45s ease;
}
#navigation a::before{
	content:"";
	position:absolute;
	left:8px;
	right:8px;
	top:8px;
	height:42%;
	border-radius:999px;
	background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,0));
	pointer-events:none;
}
#navigation a::after{
	content:"";
	position:absolute;
	top:-40%;
	left:-120%;
	width:60%;
	height:180%;
	background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);
	transform:rotate(25deg);
	transition:left .9s;
}
#navigation a:hover{
	color:#5ab6d8;
	transform:translateY(-6px)scale(1.04);
	border-color:#b8e6f5;
	box-shadow:inset 0 2px 0 rgba(255,255,255,1),inset 0 -12px 20px rgba(176,227,245,.24),0 25px 45px rgba(162,208,228,.28),0 0 35px rgba(204,241,251,.35);
}
#navigation a:hover::after{
	left:170%;
}
.contentx {
	position: relative;
	max-width: 1120px;
	margin: -60px auto;
	padding: 3.7rem 3.7rem;
	background: linear-gradient(135deg,rgba(210, 235, 255, 0.75),rgba(245, 250, 255, 0.85),rgba(200, 225, 255, 0.65));
	backdrop-filter: blur(14px) saturate(160%);
	-webkit-backdrop-filter: blur(14px) saturate(160%);
	border: 1px solid rgba(255, 255, 255, 0.45);
	border-radius: 22px;
	box-shadow:0 20px 60px rgba(20, 60, 120, 0.12),0 8px 20px rgba(20, 60, 120, 0.08);
	color: #5f7f9c;
	font-size: 1.15rem;
	line-height: 2.2;
	letter-spacing: 0.3px;
	overflow: hidden;
}
.contentx::before {
	content: "";
	position: absolute;
	inset: -40%;
	background: radial-gradient(circle at 30% 20%,rgba(255, 255, 255, 0.65),transparent 60%);
	transform: rotate(12deg);
	pointer-events: none;
	opacity: 0.7;
}
.contentx::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(120deg,transparent 0%,rgba(255, 255, 255, 0.25) 45%,rgba(255, 255, 255, 0.05) 55%,transparent 100%);
	pointer-events: none;
	mix-blend-mode: screen;
}
h1{
	position:relative;
	margin:0 0 90px;
	padding:0;
	text-align:left;
	font-family:'Cormorant Garamond',serif;
	font-size:38px;
	font-weight:300;
	line-height:.95;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:#6ea8c9;
	text-shadow:0 0 30px rgba(214,243,250,.6),0 2px 0 rgba(255,255,255,.85);
}
h1::before{
	content:"";
	position:absolute;
	left:0;
	bottom:-24px;
	width:100%;
	max-width:340px;
	height:2px;
	background:linear-gradient(90deg,rgba(255,255,255,.95),rgba(181,226,243,.9),transparent);
}
h1::after{
	content:"◦ ◦ ◦";
	position:absolute;
	left:0;
	bottom:-52px;
	font-family:'Libre Baskerville',serif;
	font-size:14px;
	letter-spacing:1em;
	color:#b8deef;
}
h1 span{
	display:block;
	margin-top:18px;
	font-family:'Libre Baskerville',serif;
	font-size:17px;
	font-style:italic;
	font-weight:400;
	text-transform:none;
	letter-spacing:.22em;
	color:#92bfd8;
	opacity:.85;
}
blockquote{
	position:relative;
	width:90%;
	margin:7rem auto;
	padding:2rem 0 2rem 3rem;
	font-family:'Cormorant Garamond',serif;
	font-size:1.6rem;
	font-style:italic;
	font-weight:400;
	line-height:1.8;
	color:#6b8ca6;
	background:none;
	border:none;
	border-left:2px solid rgba(182,224,239,.7);
	box-shadow:none;
}
blockquote::before{
	content:"“";
	position:absolute;
	left:-.35rem;
	top:-1.2rem;
	font-family:'Cinzel Decorative',serif;
	font-size:6rem;
	line-height:1;
	color:rgba(196,232,245,.55);
	text-shadow:0 0 20px rgba(219,245,252,.75);
}
blockquote::after{
	content:"";
	position:absolute;
	left:3rem;
	bottom:0;
	width:120px;
	height:1px;
	background:linear-gradient(90deg,#bfe6f5,transparent);
}
blockquote cite{
	display:block;
	margin-top:2rem;
	font-family:'Libre Baskerville',serif;
	font-size:.85rem;
	font-style:normal;
	letter-spacing:.35em;
	text-transform:uppercase;
	color:#95bdd3;
}
blockquote p:last-child{
	margin-bottom:0;
}
b,strong{
	color:#6ea7c7;
	font-weight:700;
	letter-spacing:.03em;
	text-shadow:0 0 10px rgba(205,238,248,.35);
}
i,em{
	color:#82bdd8;
	font-style:italic;
	font-family:'Cormorant Garamond',serif;
	font-size:1.06em;
	letter-spacing:.04em;
}
.contentx a{
	position:relative;
	color:#66acd1;
	text-decoration:none;
	transition:.35s ease;
}
.contentx a::after{
	content:"";
	position:absolute;
	left:0;
	bottom:-4px;
	width:100%;
	height:6px;
	background:radial-gradient(ellipse at center,rgba(190,232,248,.7) 0%,rgba(190,232,248,.45) 45%,transparent 75%);
	transform:scaleX(.4);
	opacity:0;
	transition:.35s;
}
.contentx a:hover{
	color:#9cdcf1;
	text-shadow:0 0 12px rgba(211,243,252,.6);
}
.contentx a:hover::after{
	opacity:1;
	transform:scaleX(1);
}
textarea,input,select{
	width:88%;
	max-width:800px;
	padding:1.2rem 1.5rem;
	font-family:'Libre Baskerville',serif;
	font-size:16px;
	color:#66809d;
	background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(243,252,255,.86));
	border:1px solid rgba(194,227,241,.72);
	border-radius:16px;
	backdrop-filter:blur(10px);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 12px 28px rgba(172,209,226,.12);
	transition:.35s;
}
textarea:hover,input:hover,select:hover{
	border-color:#abdced;
}
textarea:focus,input:focus,select:focus{
	outline:none;
	background:rgba(255,255,255,.98);
	border-color:#8fd2ea;
	box-shadow:0 0 0 4px rgba(191,234,247,.35),0 18px 38px rgba(170,209,226,.18);
	transform:translateY(-2px);
}
#footer{
	position:relative;
	margin:2rem auto 3rem;
	padding:2rem 0 0;
	text-align:center;
	background:none;
	border:none;
	box-shadow:none;
	opacity:1;
}
#footer::before{
	content:"";
	display:block;
	width:180px;
	height:1px;
	margin:0 auto 2.5rem;
	background:linear-gradient(90deg,transparent,rgba(171,220,238,.9),transparent);
}
#footer::after{
	content:"";
	display:block;
	width:8px;
	height:8px;
	margin:2.5rem auto 0;
	border-radius:50%;
	background:#c8ebf8;
	box-shadow:0 0 18px rgba(202,236,248,.8);
}
.footer-bottom{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:.8rem;
}
.footer-divider{
	display:none;
}
.footer-bottom p{
	margin:0;
	font-family:'Cormorant Garamond',serif;
	font-size:1.35rem;
	font-weight:400;
	letter-spacing:.08em;
	color:#7fa7c2;
}
.footer-bottom a{
	color:#72b3d2;
	text-decoration:none;
	transition:.35s;
}
.footer-bottom a:hover{
	color:#a5def2;
	letter-spacing:.08em;
}
.back-to-top{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	margin-top:2rem;
	padding:0;
	background:none;
	border:none;
	box-shadow:none;
	font-family:'Cinzel',serif;
	font-size:.78rem;
	letter-spacing:.35em;
	text-transform:uppercase;
	color:#86bdd8 !important;
	transition:.35s;
}
.back-to-top::before{
	content:"↑";
	margin-right:.8rem;
	font-size:1rem;
}
.back-to-top:hover{
	color:#b8e6f5 !important;
	transform:translateY(-2px);
}
@media (max-width:1024px){
	#header{
		height:420px;
		background-size:cover;
		background-position:center;
	}
	#layout-container{
		width:92%;
		padding:24px;
		margin:-10px auto 0;
	}
	#navigation{
		position:sticky;
		top:15px;
		width:calc(100% - 24px);
		max-width:700px;
		margin:0 auto 28px;
		flex-wrap:wrap;
		justify-content:center;
		padding:8px;
		gap:6px;
		transform:none;
		left:auto;
	}
	#navigation a{
		padding:10px 16px;
		font-size:12px;
		letter-spacing:.14em;
	}
	.contentx{
		margin-top:0;
		padding:34px;
		font-size:18px;
		line-height:1.9;
	}
	h1{
		font-size:30px;
		letter-spacing:.16em;
	}
	h1::before{
		width:180px;
	}
	blockquote{
		margin:55px auto;
		padding:36px;
		font-size:20px;
	}
	textarea,input,select{
		width:100%;
		max-width:none;
	}
	#footer{
		padding:60px 24px 35px;
	}
	.footer-divider{
		width:100px;
	}
	.footer-bottom p{
		font-size:19px;
	}
}
@media (max-width:768px){
	#header{
		height:300px;
	}
	#layout-container{
		width:100%;
		padding:14px;
	}
	#navigation{
		position:relative;
		top:auto;
		width:100%;
		padding:8px;
		border-radius:14px;
		flex-direction:column;
		align-items:stretch;
		gap:4px;
	}
	#navigation a{
		justify-content:center;
		padding:12px;
		font-size:11px;
	}
	.contentx{
		padding:24px;
		font-size:17px;
		line-height:1.8;
		border-radius:18px;
	}
	h1{
		font-size:24px;
		letter-spacing:.08em;
	}
	h1 span{
		font-size:16px;
		letter-spacing:.08em;
	}
	blockquote{
		margin:40px 0;
		padding:24px;
		font-size:18px;
		line-height:1.7;
	}
	blockquote::before{
		font-size:42px;
		left:18px;
		top:12px;
	}
	b,strong{
		padding:4px 10px;
	}
	i,em{
		padding:2px 7px;
	}
	textarea,input,select{
		width:100%;
		padding:1rem 1.1rem;
		font-size:15px;
		border-radius:12px;
	}
	#footer{
		margin-top:60px;
		padding:45px 18px 30px;
	}
	.footer-bottom{
		gap:8px;
	}
	.footer-bottom p{
		font-size:17px;
	}
	.back-to-top{
		width:100%;
		max-width:220px;
		padding:12px;
	}
}