:root {
  --clr-palette-1: #fefffe;
  --clr-palette-2: #a3bd92;
  --clr-palette-3: #66914c;
  --clr-palette-4: #3d6630;
  --clr-palette-5: #20471b;

  --clr-comp-1: #00120b;
  --clr-comp-2: #f1e8b8;
  /* either --dark-mode or --no-dark-mode */
  --color-scheme: var(--dark-mode);

  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
    Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  --font-family2: system-ui;

  --fs-300: clamp(0.94rem, calc(0.92rem + 0.08vw), 0.98rem);
  --fs-400: clamp(1.13rem, calc(1.06rem + 0.33vw), 1.31rem);
  --fs-500: clamp(1.35rem, calc(1.21rem + 0.69vw), 1.75rem);
  --fs-600: clamp(1.62rem, calc(1.37rem + 1.24vw), 2.33rem);
  --fs-700: clamp(1.94rem, calc(1.54rem + 2.03vw), 3.11rem);
  --fs-800: clamp(2.33rem, calc(1.7rem + 3.15vw), 4.14rem);
  --fs-900: clamp(2.8rem, calc(1.85rem + 4.74vw), 5.52rem);

  --clr-primary-300: hsl(219, 76%, 55%);
  --clr-primary-400: hsl(219, 76%, 40%);
  --clr-primary-500: hsl(219, 76%, 25%);
  --clr-secondary-300: hsl(269, 75%, 55%);
  --clr-secondary-400: hsl(269, 75%, 40%);
  --clr-secondary-500: hsl(269, 75%, 25%);
  --clr-accent-300: hsl(358, 72%, 65%);
  --clr-accent-400: hsl(358, 72%, 50%);
  --clr-accent-500: hsl(358, 72%, 35%);

  --clr-hue-1: 7.8260869565;

  /* settings */
  --no-dark-mode: light;
  --dark-mode: dark light;
}

body {
  margin: 0;
  font-family: sans-serif;
  /* min-height: 500vh; */
  color: var(--clr-palette-1);

  max-height: 100%; 
  overflow-y: auto;
  padding-right: 3px; 

  /*overflow-x: 3px;*/
}

.body__solutions {
  background-color: var(--clr-palette-5);
}

body::-webkit-scrollbar {
  width: 6px;
}

body::-webkit-scrollbar-thumb {
  background-color: var(--clr-palette-4);
  border-radius: 3px;
}

footer {
  display: flex;
  flex-direction: column;

  background-color: var(--clr-palette-5);

  height: 25rem; 
  padding: 1rem;
}

@media (max-width: 780px) {
  footer {
    height: 35rem; 
  }
}
.footer_top {
  display: flex;
  justify-content: space-between;
  width: 100%;
  gap: 3rem;
  align-items: top;
}

.footer_bottom {
  margin-top: 1rem;
}

a {
  text-decoration: none;
}

a i {
  font-size: 18px;
  margin: 10px;
  color:  var(--clr-palette-2);
}

a i:hover {
  color: var(--clr-palette-3);
}

.links_wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.link_heading {
  font-family: monospace;
}

.files_footer {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.files_footer > a {
  color: var(--clr-palette-2);
}

.files_footer > a:hover {
  cursor: pointer;
  color: var(--clr-palette-3);
}

.files_footer > a i {
  font-size: 18px;
}

.company-details__wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.company-details-heading {
  font-family: monospace;
}

.copyright {
  display: flex;
  justify-content: center;
}

.useful-links_wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.useful-links-heading {
  font-family: monospace;
}

.useful-links > a {
  text-decoration: none;  
  color: var(--clr-palette-2);
}

.footer-call {
  text-decoration: none;
  color:  var(--clr-palette-2);
}

.custom-hr {
  width: 90%;
  overflow: hidden;

  -webkit-mask: linear-gradient(
    90deg,
    transparent,
    white 20%,
    white 80%,
    transparent
  );
  mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
}