/* Font Styles */
.fs-lg {
  font-size: 1.25rem !important;
}
h2{
  color: #6e6e6e;
}
display-5 {
  font-size: calc(1rem + 2.1vw);
}
p {
  line-height: 1.82rem;
}

ul li {
  margin-bottom: 1.25rem;
}
.hero {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  background-color: #1f1b2d;
}

/* Hero Background */
.hero-bg {
  position: absolute;
  inset: 0;
  background-image: url("../img/gosia.jpg");
  background-size: cover;
  background-position: center;
  transform: translateZ(0);
  will-change: transform;
  filter: contrast(150%) grayscale(20%);
}


/* Mobile image */
@media (max-width: 767px) {
  .hero-bg {
    background-image: url("../img/gosia-mobile.jpg");
    background-position: center right;
  }
}

.img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    0deg,
    rgba(31, 27, 45, 0.7),
    rgba(31, 27, 45, 0.7)
  );
  z-index: 1;
}

.content-overlay {
  position: relative;
  z-index: 2;
}

/* Style for m logo in hero*/

.logo-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 50%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 4rem;
  z-index: 1;
  pointer-events: none;
}

.logo-background img {
  width: 100%;
  max-width: 1200px;
  opacity: 0.34;
  filter: blur(0.2px);
}

/* Keep logo subtle on small screens */
@media (max-width: 1200px) {
  .logo-background img {
    max-width: 90%;
    display: none;
  }
}

.hero-bg {
  z-index: 0;
}

.logo-background {
  z-index: 1;
}

.img-overlay {
  z-index: 2;
}

.content-overlay {
  z-index: 3;
}

/* Make transparent navbar (bg-none) become white on scroll */
.navbar.bg-none {
  background: transparent !important;
  transition: background-color .5s ease-in-out, box-shadow .5s ease-in-out;
}

.navbar.bg-none.navbar-stuck {
  background-color: #ffffff !important;
  opacity: 0.9;
  box-shadow: 0 .125rem .125rem -0.125rem rgba(31,27,45,.08), 0 .25rem .75rem rgba(31,27,45,.08) !important;
}

/* If you use dark links, ensure contrast when navbar becomes white */
.navbar.bg-none.navbar-stuck .nav-link {
  color: #333 !important;
}

/* Navbar link typography and spacing */
.navbar .nav-link .navbar-toggler-icon{
  color: #ffae00  !important; /* default while navbar transparent */
  transition: color .25s ease-in-out, letter-spacing .2s ease-in-out;
}

/* When navbar becomes white (stuck) use muted color */
.navbar.bg-none.navbar-stuck .nav-link{
  color: #6e6e6e !important;
}

@media (min-width: 992px) {
  .navbar-expand-lg .navbar-nav .nav-link {
    padding: 33px 75px 20px 75px;
    font-size: 1.25rem;
    font-weight: 300;
  }
}
/* Increase container left padding on tablet and mobile for better spacing */
@media (max-width: 1199.98px) {
  /* Tablet and below */
  .content-overlay.container,
  .container {
    padding-left: 2rem !important; /* 32px */
    padding-right: 1rem !important;
  }
}

@media (max-width: 767.98px) {
  /* Mobile */
  .content-overlay.container,
  .container {
    padding-left: 1.5rem !important; /* 24px */
    padding-right: 1rem !important;
  }
}