@font-face {
	font-family: 'Mulish';
	src: url('/fonts/Mulish-VariableFont_wght.ttf') format('truetype');
	font-weight: 200 900;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Mulish';
	src: url('/fonts/Mulish-Italic-VariableFont_wght.ttf') format('truetype');
	font-weight: 200 900;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Crimson Pro'; font-style: normal; font-weight: 400; /* Regular weight */
	src: url('/fonts/CrimsonPro-Regular.ttf') format('truetype');
	font-display: swap; /* Ensures text is visible during font loading */
}
@font-face {
	font-family: 'Crimson Pro'; font-style: normal; font-weight: 600; /* SemiBold weight */
	src: url('/fonts/CrimsonPro-SemiBold.ttf') format('truetype');
	font-display: swap; /* Ensures text is visible during font loading */
}

html { font-size:100%; box-sizing:border-box; }*,*:before,*:after { box-sizing:inherit; }
html { -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; background: #c8ffc8; }
body { margin: 0; padding: 0; overflow-y: scroll; }

.banner { display: flex; flex-direction: row; width: 100%; height: auto; }

.banner-left { width: 35%; height: auto; }

.banner-right { width: 65%; height: auto; padding: 2rem 2rem 0 2rem;
	font-family: 'Mulish', sans-serif; font-size: 2rem; letter-spacing: 0.06rem; font-weight : 700;
  color: #fff;
  -webkit-text-stroke: 1px rgba(0, 64, 0, 0.4);
  text-shadow:
    /* -1px -1px 0 rgba(0, 0, 0, 0.5),
     1px -1px 0 rgba(0, 0, 0, 0.5),
    -1px  1px 0 rgba(0, 0, 0, 0.5), */
     3px  3px 3px rgba(0, 64, 0, 0.1);
}

.logo { width:100%; height: auto; margin: 0 auto; padding: 0.5rem 0 0 0.5rem; }
.logo img { height: 15rem; }

.wrapper {
	display: flex; flex-direction: column; width: 70%; max-width: 900px; height: auto; margin: 0 auto; justify-content: center; background: #fff;
	box-shadow: -8px 0 20px rgba(0,0,0,0.08), 8px 0 20px rgba(0,0,0,0.08);
	}

.divider {
	width: calc(100% - 2rem);
	margin: 1rem auto;
	height: 0.1875rem;
	border: none;
	background: #c8ffc8;
}

.content { display: flex; flex-direction: row; width: 100%; height: auto; }

.content-left { width: 60%; height: auto; }

.content-right { width: 40%; height: auto; padding-right: 1rem; }

.content-right img { width: 100%; height: auto; display: block; }

.main-text p {	margin: 0; padding: 0; }
.main-text ul { /* margin: 0; padding: 0; */	}
.main-text li { line-height: 2rem; }

  /* ********************************************************************************************************* */
 /* SKILLS SECTION ***************************************************************************************** */
/* ********************************************************************************************************* */

.skills-wrapper { width: 100%; height: auto; padding: 0.5rem 2rem 0.5rem 0.5rem;
	}
.skill {
	position: relative; display: flex; align-items: center; padding-left: 0.5rem; margin: 0 0 0.5rem 0;
	}
.skill img {
	margin: 0.3rem 0; width: 100%; height: auto; display: block; z-index: 2;
	}

  /* ********************************************************************************************************* */
 /* CONTACT SECTION ***************************************************************************************** */
/* ********************************************************************************************************* */

.mobile-wrapper { width: 60%; height: auto; padding: 0.5rem 2rem 0.5rem 0.5rem;
	}
.mobile {
	position: relative; display: flex; align-items: center; padding-left: 0.5rem; margin: 0 0 0.5rem 0;
	}
.mobile img {
	margin: 0.3rem 0; width: 100%; height: auto; display: block; z-index: 2;
	}

.email-wrapper { width: 45%; height: auto; padding: 0.5rem 2rem 0.5rem 0.5rem;
	}
.email {
	position: relative; display: flex; align-items: center; padding-left: 0.5rem; margin: 0 0 0.5rem 0;
	}
.email img {
	margin: 0.3rem 0; width: 100%; height: auto; display: block; z-index: 2;
	}

.contact-wrapper { width: 100%; height: auto; padding: 0.5rem; }


.contact-email {
	position: relative;
	display: flex;
	align-items: center;
	padding-left: 0.5rem;
	margin: 0 0 2rem 1rem;
	font-family: 'Mulish', sans-serif;
	letter-spacing: 0.06rem;
	text-decoration: none;
	/* overflow: visible; */
}

.contact-email img {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-55%);
	width: 3.5rem;
	height: auto;
	display: block;
	z-index: 2;
}

.contact-email span {
	display: inline-block;
	margin-left: 0.4rem;
	padding: 0.2rem 1.5rem 0.2rem 3.2rem;
	background: #D1CCFF;
	border: 1px solid rgba(0, 120, 0, 0.15);
	border-radius: 1rem;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
	font-weight: 800;
	color: #007700;
	text-decoration: none;
}

  /* ********************************************************************************************************* */
 /* FOOTER ************************************************************************************************** */
/* ********************************************************************************************************* */

footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 100%;
    padding: 1rem 0;

    font-family: 'Mulish', sans-serif;
    font-size: 0.8rem;
    letter-spacing: 0.06rem;
    text-align: center;
}

footer p {
    margin: 0.2rem 0;
}