/* General Styles */

html, body {
   overflow-x: hidden;
   border: 0;
   box-sizing: border-box;
   margin: 0;
   padding: 0;
}

body {
   font-family: "Montserrat", sans-serif !important;
}

:root {
   --primary: #2B3A67;
   --secondary: #E84855;
   --third: #7ADFBB;
   --vindme: #9AAEF2;
}

/* Navigation Bar Styling */

.navbar-nav .nav-item .nav-link {
   border-radius: 15px;
   width: 160px;
   margin: 0 5px;
   text-align: center;
   line-height: 20px;
   padding: 5px;
   font-size: 1.4rem;
   color: var(--primary);
}

.navbar-nav .nav-item:hover .nav-link {
   background-color: var(--third);
   color: #ffffff;
}

.nav-item.dropdown:hover .nav-link::after {
   transform: rotate(180deg);
}

.navbar-brand {
   margin-left: 20px;
   margin-bottom: 10px;
}

.navbar-nav .nav-item.dropdown:hover .dropdown-menu {
   display: block;
}

.dropdown-menu .dropdown-item {
   font-size: 1.4rem;
   padding: 10px;
   text-decoration: none;
   color: #333;
   transition: background-color 0.3s;
}

.navbar-nav>li>.dropdown-menu a:hover {
   background-color: var(--third);
   color: #ffffff;
}

/* Media Queries */

@media (min-width: 1200px) and (max-width: 1900px) {
   .navbar-brand {
      width: 190px;
      height: 50px;
   }
}

@media (min-width: 370px) and (max-width: 1200px) {
   .navbar-brand {
      width: 130px;
      height: 50px;
   }
}

@media (max-width: 950px) {
   .navbar-collapse .nav-item .nav-link,
   .navbar-collapse>.nav-item>li>.dropdown-item {
      width: 150px;
      margin-left: 30px;
      text-align: left;
   }
}

/* Section Styles */

.main-section {
   position: relative;
   height: 100vh;
   width: 100%;
   overflow: hidden;
}

.background-image {
   background-image: url('/Assets/womans-latin-live.jpg');
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
   height: 100vh;
   display: flex;
   align-items: center;
 }
 
 .center-content {
   text-align: center;
   color: white; /* Adjust text color as needed */
   padding: 20px; /* Adjust padding as needed */
 }
 

.center-content {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   text-align: left;
   color: #ffffff;
   z-index: 1;
   max-width: 40%;
   height: auto;
}

.center-content h1 {
   max-width: 18em;
   font-size: 8vh;
   font-weight: 600;
   line-height: .9;
   margin-bottom: 0.5em;
   text-align: left;
   color: #ffffff;
}

.center-content .description,
.read {
   font-weight: 400;
   font-style: normal;
   font-size: 2.7rem;
   color: #ffffff;
   text-align: justify;
}

.read {
   font-size: 1.9rem;
   color: var(--third);
   text-decoration: underline;
}

/* Another Section Styles */

.head-title {
   font-weight: 600;
   color: var(--secondary);
   text-align:end;
}

.main-font {
   font-weight: 400;
   font-style: normal;
   font-size: 1.6rem;
   color: #2b2b2b;
   text-align: justify;
}

/* Scrolling Section Styles */

.scrolling {
   background: url(../Assets/cdmx.png) no-repeat fixed 100%;
   background-size: cover;
}

.background-scrolling {
   padding-top: 7%;
   padding-bottom: 7%;
}

.title-banner {
   font-weight: 600;
   font-size: 2.5rem;
   color: var(--third);
   text-align: center;
}


/* Last Section Styles */

.parent-container {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   height: 60vh;
}

.custom-container {
   margin: 50px;
   width: 90vh;
   height: 80%;
   border-radius: 3%;
   background-color: var(--primary);
   transition: all 0.5s;
}

.card-cont {
   width: 100%;
   height: 100%;
   padding: 3%;
}

.last-img {
   width: auto;
   height: 100%;
   border-radius: 3%;
}

.last-h1 {
   font-weight: 600;
   font-size: 2.3rem;
   color: var(--third);
   text-align: left;
}

.last-text {
   font-weight: 400;
   font-size: 1.4rem;
   color: #ffffff;
   text-align: justify;
}

.custom-container:hover {
   box-shadow: -10px 0 20px rgba(0, 0, 0, 0.6);
   transform: translateX(-3%) scale(1.05);
}

@media (min-width: 1020px) and (max-width: 1700px) {
   .center-content {
      max-width: 70% !important;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
   }

   .center-content .description {
      font-size: 2rem;
   }

   .read {
      font-size: 1.6rem;
   }
}

@media (min-width: 365px) and (max-width: 1020px) {
   .center-content {
      max-width: 85%;
      max-height: 90%;
      top: 40%;
      left: 50%;
      transform: translate(-50%, -40%);
   }

   .center-content, .description {
      font-size: 1.3rem !important;
   }

   .main-font {
      font-size: 1.2rem;
      font-weight: 400;
   }

   .vindme-logo {
      width: 120px;
   }

   .title-banner, .last-h1 {
      font-size: 1.7rem;
   }
   
   .scrolling {
      background: url(../Assets/angel2.webp) no-repeat fixed 100% !important;
      background-size: cover;
   }
}

/* Values Section Styles */

.icon-square {
   width: 3rem;
   height: 3rem;
   border-radius: 0.75rem;
}

.feat-title {
   margin-bottom: 30px;
   font-size: 2.7rem;
   font-weight: 600;
   color: var(--secondary);
}

.feat-content {
   margin-top: 5px;
   font-weight: 500;
   font-size: 1.5rem;
   text-align: justify;
   color: var(--primary);
}

/* Footer Section Styles */

.footer-bg {
   background-color: #f7f5ff;
}

#footer-section p {
   font-size: 1.3rem;
}

#footer-section a {
   color: #4e4e4e;
   font-size: 1.3rem;
}

.social-link:hover {
   background-color: var(--vindme);
   border-radius: 50%;
}

.foot-btn:hover {
   color: var(--vindme) !important;
   text-decoration: underline;
}

.logo-v {
   transition: all 1s;
}

.logo-v:hover {
   transform: scale(1.1);
}