:root {
  --primary: #0047ab;
  --primary-dark: #00387c;
  --accent: #dcdedd;
  --white: #ffffff;
  --muted: #6c757d;
  --radius: 0.75rem;
  /* 12px */
  --max-width: 75rem;
  /* 1200px */
}

/* =========================================================
   Uranum Website Stylesheet (rem/em responsive version)
   ========================================================= */

/* ======= FONTES GERAIS ======= */
body {
  font-family: "Inter", sans-serif;
  color: var(--primary-dark);
  background-color: var(--white);
  line-height: 1.6;
  margin: 0;
  padding: 0;
  font-size: 1rem;
  /* 16px base */
}

h1,
h2,
h3,
h4,
h5,
h6,
.navbar-brand,
.btn {
  font-family: "New Amsterdam", sans-serif;
  letter-spacing: 0.06em;
}

/* Header */
.navbar {
  backdrop-filter: blur(0.375rem);
  /* 6px */
  background: rgba(255, 255, 255, 0.75);
  transition: background 0.25s ease, box-shadow 0.25s ease;
  padding: 0.75rem 1.25rem;
}

.navbar.scrolled {
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 0.375rem 1.375rem rgba(0, 0, 0, 0.08);
  /* 6px 22px */
}

.nav-link {
  color: #0b1b2b !important;
  font-weight: 600;
  font-size: 1rem;
}

.hero {
  min-height: 78vh;
  display: flex;
  align-items: center;
  position: relative;
  background-image: url("img/UranumBackground_1_hero.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  /* parallax */
  filter: contrast(0.98) saturate(0.9) brightness(0.85);
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 71, 171, 0.25), rgba(0, 56, 124, 0.25));
  z-index: 1;
}

.hero-content {
  z-index: 2;
  color: var(--white);
  max-width: var(--max-width);
  width: 100%;
  padding: 0 1rem;
}

/* Card styles */
.feature-card {
  border-radius: var(--radius);
  border: 1px solid rgba(10, 20, 40, 0.04);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background: #fff;
  padding: 1.25rem;
}

.feature-card:hover {
  transform: translateY(-0.375rem);
  /* -6px */
  box-shadow: 0 0.75rem 1.875rem rgba(10, 20, 40, 0.06);
  /* 12px 30px */
}

/* Business card preview */
.biz-card {
  width: 20rem;
  /* 320px */
  height: 11.875rem;
  /* 190px */
  border-radius: 0.625rem;
  /* 10px */
  overflow: hidden;
  box-shadow: 0 0.5rem 1.25rem rgba(10, 20, 40, 0.08);
  /* 8px 20px */
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: linear-gradient(90deg, var(--white), var(--white));
}

.biz-front {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem;
  /* 20px */
  background: var(--white);
}

.biz-back {
  padding: 1.25rem;
  background: linear-gradient(90deg, var(--primary), var(--primary-dark));
  color: var(--white);
}

/* Footer */
footer {
  background: #fafafb;
  border-top: 1px solid rgba(0, 0, 0, 0.03);
}

/* Back to top button */
#backToTop {
  position: fixed;
  right: 1.25rem;
  /* 20px */
  bottom: 1.5rem;
  /* 24px */
  z-index: 999;
  width: 3rem;
  /* 48px */
  height: 3rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--primary);
  color: var(--white);
  border: 0;
  box-shadow: 0 0.5rem 1.25rem rgba(0, 71, 171, 0.18);
  /* 8px 20px */
  transition: transform 0.2s ease, opacity 0.2s ease;
  opacity: 0;
  transform: translateY(0.625rem) scale(0.9);
}

#backToTop.show {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Small tweaks */
.badge-soft {
  background: rgba(0, 71, 171, 0.08);
  color: var(--primary);
  font-weight: 600;
  border-radius: 999px;
  padding: 0.375rem 0.75rem;
  /* 6px 12px */
}

.section {
  padding: 5rem 0;
  /* 80px */
}

/* Responsive */
@media (max-width: 48em) {

  /* 768px */
  .hero {
    min-height: 64vh;
  }

  .biz-card {
    width: 16.25rem;
    /* 260px */
    height: 9.6875rem;
    /* 155px */
  }

  .navbar {
    padding: 0.75rem 1rem;
  }
}

.section-parallax {
  position: relative;
  min-height: 35vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("img/Uranum_machning.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  filter: contrast(0.98) saturate(0.9) brightness(0.75);
  overflow: hidden;
  animation: fadeInParallax 1.2s ease-out;
}

/* Camada escura e ligeira transição */
.section-parallax::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(0, 0, 0, 0.55),
      rgba(0, 0, 0, 0.6));
  z-index: 1;
  opacity: 0;
  animation: fadeOverlay 1.5s ease forwards;
}

/* conteúdo visível acima do overlay */
.section-parallax .container {
  position: relative;
  z-index: 1;
  color: #fff !important; 
}

/* Fade suave ao aparecer */
@keyframes fadeInParallax {
  from {
    opacity: 0;
    transform: scale(1.05);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Faz o overlay surgir lentamente */
@keyframes fadeOverlay {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

#financing h2 {
  font-family: "New Amsterdam", sans-serif;
  letter-spacing: 0.06em;
  color: var(--primary-dark);
}

#financing .alert-primary {
  background: rgba(0, 71, 171, 0.08);
  border: none;
  color: var(--primary-dark);
  font-weight: 600;
  border-radius: var(--radius);
  padding: 0.75rem 1rem;
}

.bg-bull {
  position: relative;
  z-index: 0; /* define o contexto base */
  background-color: #ffffff;
  background-image: url('/img/UranumBackground_bull.png');
  background-repeat: no-repeat;
  background-position: right center;
  background-size: auto 80%;
  background-attachment: scroll;
}

.bg-bull::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.8);
  z-index: -1; /* fica atrás do conteúdo e da imagem */
}
#financing .container {
  position: relative;
  z-index: 2; /* assegura que o texto fica sobre a camada branca */
}