@import url('https://fonts.googleapis.com/css2?family=Sora:wght@100..800&display=swap');
:root {
    --primary-font: "Sora", sans-serif;
}
:root {
    --primary-color: #161616;
    --secondary-color: #e0b53a;
    --terciary-color: #0094d9;
    --grey: #5c5c5c;
    --dark: #343a40;
    --light: #f0f0f0;
    --alert: #b31610;
    --success: #4caf50;
    --border-radius: 0.25em;
    --border-color: #dee2e6;
    --wrapper-width: 1180px;
    --slider-height: 34vw;
}
*{
    font-family: var(--primary-font);
    font-optical-sizing: auto;
    font-weight: weight;
    font-style: bold;
    font-display:swap;
    scroll-behavior: smooth;
}
/* menu */
header{
    background-color: var(--primary-color);
    /* height: 100px; */
}
nav a{
    font-family: var(--primary-font);
    font-optical-sizing: auto;
    font-weight: weight;
    font-style: bold;
    font-display:swap;
    font-size: 1.05rem;
}
nav a:hover{
    color: var(--secondary-color);
}
#mobile-menu {
  transition: all 0.3s ease;
}
.gradient-hero {
      background: linear-gradient(90deg, rgba(6, 95, 70, 0.06), rgba(2, 6, 23, 0.03));
}
/* animação banner */
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fadeInUp {
  animation: fadeInUp 1.2s ease-out forwards;
}