@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative&family=Poppins&display=swap');

:root {
	--light-blue:#cce5ff;
	--primary-blue:#66b0ff;
	--normal-blue:#699CFE;
	--primary-blue:#6990f2;
	--dark-blue:#695CFE;
	--light-green:#f3ffa8;
	--primary-green:#c5e019;
}

html {
    scroll-behavior: smooth;
}

body {
	font-family:"Poppins" ,sans-serif;
	box-sizing:border-box;	
	overflow-x:hidden;
	background:#f9f9f9;
}

::-webkit-scrollbar {
	width:8px;
	height:8px;
}

::-webkit-scrollbar-track {
	background:#fff;
	border-radius:100vw;
	margin-block:.5rem;
}

::-webkit-scrollbar-track {
	background:#eee;
	border-radius:100vw;
	margin-block:.5rem;
}
 
::-webkit-scrollbar-thumb {
	background:#bbb;
	border-radius:100vw;
}

::-webkit-scrollbar-thumb:hover {
	background:var(--normal-blue);
}

.nav ul li:nth-child(2) a::after{
	content:'';
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:4px;
	color:#fff;
	background:var(--secondary-color);;
}

@media screen and (max-width:80rem) {
	
	.nav ul li:nth-child(2) a{
		color:#fff;
		background:var(--primary-color);
	}
	
	.nav ul li:nth-child(2) a:hover{
		color:#fff;
		background:var(--primary-color);
	}
	
	.nav ul li:nth-child(2) a::after{
		content:'';
		display:none;
	}
}


* {
	padding:0;
	margin:0;
	box-sizing:border-box;
}

a {
	text-decoration:none;
}

button {
	border:none;
	background:transparent;
	cursor:pointer;
}

button:active {
	outline:2px solid #ddd;
}

.front-cover {
	width:100vw;
	height:clamp(400px,calc(70vh - 15px),1000px);
	position:relative;
	object-fit:cover;
	top:0;
	left:0;
}

.front-content {
	width:100vw;
	height:clamp(400px,calc(70vh - 15px),1000px);
	position:absolute;
	z-index:1;
	top:0;
	left:0;
	display:flex;
	justify-content:center;
	align-items:center;
}

.front-content h1 {
	width:clamp(100px,90vw,500px);
	color:#fff;
	transform:scale(1.6);
	text-shadow:0 0 6px #000;
	text-align:center;
}

@media (max-width:1000px) {
	.front-content h1 {
		transform:scale(1.2);
	}
	
}

@media (max-width:600px) {
	
	.front-content h1 {
		transform:scale(1);
	}
	
	p {
		text-align:justify;
	}
	
}

.about-section-wrapper {
	width:100vw;
	padding:50px 0;
	min-height:300px;
	display:flex;
	justify-content:center;
	margin-bottom:50px;
}

.about-section-content {
	width:85vw;
	min-height:400px;
	display:flex;
	gap:20px;
}

@media (max-width:1000px) {
	.front-cnt h1 {
		transform:scale(1.3);
	}
	
	.list-to-do {
		display:none;
		pointer-events:none;
	}
}

@media (max-width:640px) {
	.front-cnt h1 {
		transform:scale(1);
		width:100vw;
		padding-inline:10px;
	}
	
	.about-cnt {
		display:flex;
		flex-wrap:wrap;
	}
}

.about-image {
	width:230px;
	height:150px;
	object-fit:cover;
}

.about-cnt {
	display:flex;
	gap:20px;
	font-size:.85rem;
	margin-block:15px;
}

.about-cnt > *{
	flex-shrink:0;
}

.about-cnt > p{
	width:clamp(200px,100%,670px);
	line-height:1.7rem;
	color:#777;
}

.list-to-do {
	min-width:280px;
	background:#fff;
	padding:10px;
}

.list-to-do h3 {
	color:var(--primary-color);
	margin-bottom:10px;
	font-size:1.3rem;
	font-weight:400;
}

.list-to-do ul {
	padding-inline:15px;
	font-size:.9rem;
	list-style: none;
}

.list-to-do ul li{
	margin-block:5px;
	cursor:pointer;
}

.list-to-do ul li a{
	margin-block:5px;
	cursor:pointer;
	color:#888;
}

.list-to-do ul li::before {
  content: "\2022";
  color: #aaa;
  font-weight: bold;
  display: inline-block; 
  width: 1em;
  margin-left: -1em;
}

.list-to-do ul li:hover{
	text-decoration:underline;
}

.about-wr {
	padding-bottom:50px;
}

.about-wr h3 {
	padding-bottom:5px;
	border-bottom:1px solid #ddd;
	margin-bottom:15px;
	font-size:1.5rem;
	color:var(--primary-color);
	font-weight:400;
}

.footer-section {
	background-image:linear-gradient(to bottom, #fff,#fff,var(--secondary-color-light));
}

