@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');

body {
  font-family: 'Open Sans', sans-serif;
}

:root {
  --md-primary-fg-color:        #101b19;
  --md-primary-fg-color--light: #9ea6c2;
  --md-primary-fg-color--dark:  #4f5a71;
}

h1 {
  font-size: 2.5rem !important;
  font-weight: 700 !important;
  color: #425b76 !important;
  margin-bottom: 2rem !important;
}

h2 {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: #425b76;
}

.hero-section {
  background: url("../assets/images/codenotary-bg.png") ;
  background-size: cover;
  position: relative;
  color: #fff;
  border-radius: 8px;
  padding: 2rem;
}

.hero-content {
  position: relative; /* ensures content is above the overlay */
  z-index: 1;
  max-width: 800px;
  text-align: left; /* ensure the text is left-aligned */
  display: flex;
  flex-direction: column;
  justify-content: start;
  gap: 2rem

}

.hero-content h1 {
  color: #fff !important;
  margin-bottom: 0rem;
  word-break: break-word;
}

.hero-button {
  display: inline-block;
  color: #FF9903 !important;
  font-weight: normal;
  position: relative;
}

.hero-button::after {
  content: '→'; /* right arrow icon */
  display: inline-block;
  margin-left: 8px;
  transition: transform 0.3s ease;
}

.hero-button:hover::after {
  transform: translateX(5px); /* move the arrow to the right on hover */
}

.hero-button:hover {
  font-weight: bold;
}

.md-nav__item {
  color: #425b76;
}

.md-nav__link--active {
  color: #9ea6c2 !important;
}