* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  /* font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; */
}
.rubik-doodle-shadow-regular {
  font-family: "Rubik Doodle Shadow", system-ui;
  font-weight: 500;
  font-style: normal;
}
.nova-slim-regular {
  font-family: "Nova Slim", system-ui;
  font-weight: 500;
  font-style: normal;
}
.rubik-mono-one-regular {
  font-family: "Rubik Mono One", monospace;
  font-weight: 500;
  font-style: normal;
}

.rubik {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
.reveal {
  opacity: 0;
  transform: translateY(50px);
  transition: all 0.6s ease;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

.nav-link.active {
  color: #dc4077 !important;
}

.navbar {
  /* background-color: #fff054f5; */
  /* background-image: linear-gradient(to right, #ffeb7b, #ffe658);
  position: sticky;
  top: 0;
  padding-top: 30px;
  padding-bottom: 20px;
  z-index: 2; */
}
.navbar {
  position: fixed;
  width: 100%;
  background-image: linear-gradient(to right, #ffeb7b, #ffe658);
  transition: background-image 0.3s ease, box-shadow 0.3s ease;
  background-color: transparent;
  padding: 1rem 2rem;
  z-index: 1000;
}
.navbar.scrolled {
  background-color: #fff054f5;
  padding: 0;
  box-shadow: 0px 0px 16px #ffd129;
}
.scrolled .navbar-brand img {
  width: 36%;
  position: initial;
}
.nav-link {
  font-weight: 500;
  color: #272727;
  margin-right: 20px;
}
.navbar button {
  border: none;
  background-color: transparent;
}
/* .navbar-brand {
  width: 10%;
} */
.navbar-brand img {
  width: 10%;
  position: absolute;
  top: 0;
  left: 0;
}
/* Banner */
.banner {
  padding: 180px 50px 200px 50px;
  background-image: url(https://res.cloudinary.com/dbtsrjssc/image/upload/v1746767354/Union-1_t5pz7i.svg);
  background-repeat: no-repeat;
  background-size: cover;
  /* background-image: linear-gradient(
    160deg,
    rgba(254, 231, 94, 0.78) 0%,
    #ffdf1d 100%
  ); */
}
.btn-wrapper {
  border-radius: 6px;
  background-color: #dc407759;
  width: max-content;
  padding: 6px;
  border-radius: 10px;
  margin-top: 1rem;
}
.btn-wrapper a {
  text-decoration: none;
  color: #fff;
}
.banner h1 {
  font-weight: 500;
  font-size: 4rem;
}

.btn-wrapper button {
  background-color: #dc4077;
  padding: 8px 30px;
  color: #fff;
  border: none;
  border-radius: 10px;
  box-shadow: #ff679c62 0px 0.711334px 1.56494px 0px,
    #ff679c62 0px 1.93715px 4.26173px 0px, #ff679c62 0px 4.25329px 9.35723px 0px,
    #ff679c62 0px 9.44132px 20.7709px 0px, #ff679c62 0px 16px 52.8px 0px;
}
.banner .btn-wrapper button {
  font-size: 20px;
}
.banner-img-slider {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.banner-img-slider img {
  position: absolute;
  top: 0;
  left: 40%;
  transform: translateX(-50%);
  opacity: 0;
  transition: opacity 1s ease-in-out;
  max-height: 100%;
  max-width: 100%;
  width: 50%;
  height: 100%;
}

.banner-img-slider img.active {
  opacity: 1;
  z-index: 1;
}

/* about homepage */
.about-home {
  padding: 40px 0;
}
.about-hm-pg-img {
  width: 90%;
  margin: 0 auto;
}
.about-hm-pg-img img {
  width: 100%;
}
.about-company {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  height: 100%;
}
.about-company p {
  font-size: 16px;
}
.about-company .btn-wrapper {
  margin-top: 0;
}
.btn-wrapper button:hover {
  transform: scale(0.97); /* shrinks to 90% size */
  transition: transform 0.3s ease;
}

/* features */
.featues-home {
  padding: 20px 0 50px 0;
}
.feature-ice {
  text-align: center;
  padding: 20px;
}
.feature-ice p {
  font-size: 0.8rem;
  text-align: justify;
  color: rgb(50, 50, 50);
}
.feature-ice img {
  width: 50%;
  padding-bottom: 1rem;
}
.feature-ice h5,
.fa-circle-check {
  color: #dc4077;
}

/* Facts */
.facts-home {
  padding: 40px 0 0px 0;
  text-align: center;
}
.facts-div {
  margin: 30px 0;
  padding: 20px;
}
.facts-border {
  border-right: 0.5px solid #dcdcdc;
}
.facts-div .dig {
  color: #dc4077;
  font-size: 3rem;
  font-weight: 600;
}
.facts-div .genre {
  font-size: 1rem;
  font-weight: 400;
  margin-top: -1rem;
}

/* more info */
.more-info-home {
  /* background-color: rgba(237, 15, 89, 0.12); */
  background-image: url(https://res.cloudinary.com/dbtsrjssc/image/upload/v1746767355/Union-2_urd6am.svg);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 160px 0;
}
.house-of-ice img {
  width: 100%;
}
.elem {
  position: relative;
  margin-bottom: 100px;
  margin-top: 50px;
}
/* .elementor-shape-bottom {
  bottom: -1px;
  transform: rotate(180deg);
} */
.elementor-shape {
  position: absolute;
  left: 0px;
  width: 100%;
  line-height: 0;
  direction: ltr;
  overflow: hidden;

  /* transform: rotate(180deg); */
}
.elementor-shape-fill {
  /* fill: rgba(237, 15, 89, 0.12); */
}
.elementor-shape-top {
  top: -22.232%;
  transform: rotate(180deg);
}
.elementor-shape-bottom {
  bottom: -22.2%;
}

/* house-of-ice-cream-info */
.house-of-ice-cream-info {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  height: 100%;
}
.house-of-ice-cream-info p {
  font-size: 16px;
  text-align: justify;
}
/* believe in */
.we-believe {
  padding: 0px 0 50px 0;
  text-align: center;
}
.believe-in {
  margin-top: 20px;
  /* padding: 10px; */
}
.believe-in img {
  width: 25%;
  margin-bottom: 1rem;
}
.believe-in p {
  font-size: 0.8rem;
  text-align: justify;
}
.believe-in-border {
  padding-right: 20px;
  border-right: 0.5px solid #dcdcdc;
}

/* stay-connected */
.stay-connected {
  padding: 100px 0 18px 0;
  /* position: relative; */
  background-image: url(https://res.cloudinary.com/dbtsrjssc/image/upload/v1746767354/Union_dwu0hw.svg);
  background-repeat: no-repeat;
  background-size: cover;
}
.stay-connected-shape {
  position: absolute;
  left: 0px;
  width: 100%;
  line-height: 0;
  direction: ltr;
  overflow: hidden;

  /* transform: rotate(180deg); */
}
.stay-connected-shape-fill {
  /* fill: #fff04f; */
}
.stay-connected-shape-top {
  top: -0%;
  transform: rotate(180deg);
}

.stay-conn-div {
  /* background-image: linear-gradient(#fff04f, #fff); */
  padding: 50px 0 80px 0;
  text-align: center;
  margin: 0 auto;
}
.stay-hungry {
  text-align: center;
  margin: 0 auto;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.stay-hungry .btn-wrapper {
  margin-top: 0;
}
.footer {
  text-align: center;
  font-size: small;
  color: rgb(90, 90, 90);
}

/* Media queries */
@media (max-width: 880px) {
  .nav-link {
    text-align: center;
    font-size: small;
  }
  .navbar-collapse {
    border-bottom: 1px solid grey;
  }
  .navbar-nav {
    width: max-content;
    margin: auto;
  }
}
@media (max-width: 550px) {
  .navbar-brand img {
    width: 20%;
    left: 10px;
    padding-top: 14px;
  }
  .banner h1 {
    font-size: 2.4rem;
  }
  .navbar-brand {
    width: 30%;
  }
  .nav-link {
    font-size: 14px;
  }
  .feature-ice img {
    width: 35%;
  }
  .navbar {
    padding: 10px;
    /* background-image: none !important; */
  }
  .nav-link {
    margin-right: 0px;
  }

  .banner-img-slider {
    height: 50vh;
    margin-top: 1.2rem;
  }
  .navbar.scrolled {
    background-color: #fff154;
  }
  .banner-img-slider img {
    width: 100%;
    height: auto;
    display: none;
    left: 50%;
  }

  .banner-img-slider img.active {
    display: block;
  }
  .scrolled .navbar-brand img {
    width: 40%;
  }
  .banner {
    padding: 120px 20px 50px 20px;
  }
  .about-company {
    text-align: center;
    padding-top: 10px;
    align-items: center;
  }
  .about-company p {
    text-align: justify;
    padding: 0 20px;
  }
  .about-home {
    padding: 40px 0 50px 0;
  }
  .feature-ice {
    padding: 0 20px;
  }
  .facts-home {
    padding: 10px 0 0px 0;
  }
  .feature-ice p,
  .believe-in p,
  .stay-hungry p {
    font-size: 14px;
  }
  .facts-border {
    border: none;
  }
  .elementor-shape-top {
    top: -5.7%;
  }
  .facts-div {
    margin: 5px 0;
    padding: 20px;
  }
  .facts-div .dig {
    font-size: 2.3rem;
  }
  .facts-div .genre {
    margin-top: -0.5rem;
  }
  .house-of-ice-cream-info {
    text-align: center;
    align-items: center;
    padding: 20px;
  }
  .elementor-shape-bottom {
    bottom: -5.5%;
  }
  .btn-wrapper button {
    padding: 8px 21px;
    font-size: 14px;
  }
  .we-believe {
    padding: 0px 0 50px 0;
  }
  .believe-in-border {
    border: none;
    padding-right: 0;
    padding: 20px;
  }
  .mobile-border-padding {
    padding: 0 20px;
  }
  .banner {
    text-align: center;
  }
  .banner .btn-wrapper {
    margin: 0 auto;
  }
  .stay-connected-shape-top {
    top: -4.5%;
  }
  .stay-connected {
    padding: 20px 0 18px 0;
  }
  .stay-hungry {
    padding: 100px 20px 0;
  }
  .banner .btn-wrapper button {
    font-size: 15px;
  }
}
@media (min-width: 550px) and (max-width: 990px) {
  .facts-border {
    border: none;
  }
  .facts-div .genre {
    margin-top: 0;
  }
  .elementor-shape-top {
    top: -8.5%;
  }
  .elementor-shape-bottom {
    bottom: -8.44%;
  }
  .stay-connected-shape-top {
    top: 6%;
  }
}
@media (max-width: 340px) {
  .elementor-shape-top {
    top: -4.1%;
  }

  .elementor-shape-bottom {
    bottom: -4.2%;
  }
  .stay-connected-shape-top {
    top: -1.5%;
  }
}
@media (min-width: 340px) and (max-width: 385px) {
  .elementor-shape-top {
    top: -4.6%;
  }

  .elementor-shape-bottom {
    bottom: -4.6%;
  }
  .stay-connected-shape-top {
    top: -1.5%;
  }
}
@media (min-width: 386px) and (max-width: 400px) {
  .elementor-shape-top {
    top: -4.9%;
  }

  .elementor-shape-bottom {
    bottom: -4.9%;
  }
  .stay-connected-shape-top {
    top: -1.5%;
  }
}
@media (min-width: 401px) and (max-width: 420px) {
  .elementor-shape-top {
    top: -5.2%;
  }

  .elementor-shape-bottom {
    bottom: -5.2%;
  }
  .stay-connected-shape-top {
    top: -1.5%;
  }
}
@media (min-width: 421px) and (max-width: 450px) {
  .elementor-shape-top {
    top: -5.5%;
  }

  .elementor-shape-bottom {
    bottom: -5.5%;
  }
  .stay-connected-shape-top {
    top: -1.5%;
  }
}
@media (min-width: 1600px) and (max-width: 1710px) {
  .elementor-shape-top {
    top: -26%;
  }
  .elementor-shape-bottom {
    bottom: -26%;
  }
  .stay-connected-shape-top {
    top: -12%;
  }
}
@media (min-width: 1500px) and (max-width: 1600px) {
  .elementor-shape-top {
    top: -24.44%;
  }
  .elementor-shape-bottom {
    bottom: -24.44%;
  }
  .stay-connected-shape-top {
    top: -10%;
  }
}
@media (min-width: 1422px) and (max-width: 1500px) {
  .elementor-shape-top {
    top: -21.66%;
  }
  .stay-connected-shape-top {
    top: -8%;
  }
  .elementor-shape-bottom {
    bottom: -21.66%;
  }
}
@media (min-width: 1252px) and (max-width: 1420px) {
  .elementor-shape-top {
    top: -22.76%;
  }
  .elementor-shape-bottom {
    bottom: -22.76%;
  }
}
@media (min-width: 1150px) and (max-width: 1252px) {
  .elementor-shape-top {
    top: -24.66%;
  }
  .elementor-shape-bottom {
    bottom: -24.66%;
  }
}
@media (min-width: 1000px) and (max-width: 1150px) {
  .elementor-shape-top {
    top: -21.76%;
  }
  .elementor-shape-bottom {
    bottom: -21.76%;
  }
}
@media (min-width: 1600px) {
  .banner {
    padding: 160px 50px 500px 50px;
    background-image: url(https://res.cloudinary.com/dbtsrjssc/image/upload/v1746767354/Union-1_t5pz7i.svg);
    background-repeat: repeat-x;
    background-size: contain;
    height: 80vh;
  }
  .more-info-home {
    background-image: url(https://res.cloudinary.com/dbtsrjssc/image/upload/v1746767355/Union-2_urd6am.svg);
    background-repeat: repeat-x;
    background-size: contain;
    padding: 130px 0;
  }
}
.toast {
  position: fixed;
  bottom: 30px;
  right: 30px;
  background-color: #4caf50;
  color: white;
  padding: 16px;
  border-radius: 5px;
  z-index: 1000;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  animation: fadein 0.5s, fadeout 0.5s 3s;
}

@keyframes fadein {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeout {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(20px);
  }
}