/*!************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/scss/header.scss ***!
  \************************************************************************/
header {
  .explore-btn {
    max-width: 230px;
  }
}

/*!***********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/scss/about.scss ***!
  \***********************************************************************/
section.about {
  background: linear-gradient(180deg, #fff 0%, rgba(255, 246, 202, 0.2) 100%);
  .about-title-description {
    text-align: right;
    font-size: 24px;
    font-weight: 700;
    line-height: normal;
  }

  h3 {
    font-size: 40px;
    font-weight: 600;
    line-height: normal;
  }
  .about-card {
    .about-card-description {
      background-color: white;
      border-radius: 8px;
        box-shadow: 0px 4px 8px -2px rgba(17, 24, 39, 0.10), 0px 2px 4px -2px rgba(17, 24, 39, 0.06);
    }
    p {
      text-align: right;
      font-size: 20px;
      font-weight: 500;
      line-height: 130%; /* 26px */
    }
  }
}

/*!***************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/scss/companies.scss ***!
  \***************************************************************************/
section.companies {
    margin-top: 56px;
    background: radial-gradient(49.91% 49.91% at 50% 50.09%, #FAF9F9 0%, #FAF9F9 15.5%, #FFFBEA 42%, #FEFBEA 71%, #FFF 100%);
    .first-row {

        @media (min-width: 1440px) {
            gap: 100px;
            margin-top: 150px;
        }
    }
    .second-row {
        @media (min-width: 1440px) {
            margin-top: 150px;
        }
    }

    .card {
        border: 0;
        border-radius: 8px;
        background: #FAFCFE;
        box-shadow: 0px 4px 16px 0px rgba(2, 16, 34, 0.20);

        @media (min-width: 1440px) {
            min-height: 281px;
        }

    }

    .card-body {

        .logo {
            left: 3%;
            bottom: 80%;
            max-width: 112px;

        
            @media (min-width: 1440px) {
                left: -10%;
                bottom: 76%;
                max-width: unset;
            }
        }
    }

    .card-content {
        @media (min-width: 1440px) {
            min-height: 180px;
            margin-bottom: 30px;
        }
    }

    .card-title h5 { 
        text-align: center;
        font-size: 24px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%; /* 24px */
    }
    .card-text {
        text-align: right;
        font-size: 16px;
        font-weight: 500;
        line-height: 130%; /* 20.8px */
        margin-top: 16px;
        max-width: 250px;

        @media (min-width: 1440px) {
        max-width: 314px;
        }
    }
     
    a {
        color: #021022;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%; /* 14px */
    }

    .studio-card,
    .darb-card {
        margin-top: 100px;
        
        @media (min-width: 1440px) {
            margin-top: 0;
        }
    }
}
/*!**************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/scss/services.scss ***!
  \**************************************************************************/
section.services {
    margin-top: 112px;
    background: radial-gradient(49.91% 49.91% at 50% 50.09%, #FAF9F9 0%, #FAF9F9 15.5%, #FFFBEA 42%, #FEFBEA 71%, #FFF 100%);

    .first-row {

        @media (min-width: 1440px) {
            margin-top: 64px;
            gap: 48px;
        }
    }
    .second-row {
        @media (min-width: 1440px) {
            margin-top: 48px;
            gap: 48px;
        }
    }
    

    .card {
        border: 0;
        background: rgba(153, 178, 221, 0.1);;
        margin-top: 48px;

        @media (min-width: 1440px) {
            margin-top: 0;
        }
    }

    .benefit-icon {
        @media (min-width: 1440px) {
            max-height: 60px;
            max-width: 60px;
        }
    }

    .card-title {
        margin-top: 53px;

        h5 {
            font-size: 32px;
            font-style: normal;
            font-weight: 700;
            line-height: 120%; /* 39px */
        }
    }

    .card-text {
        margin-top: 30px;
        font-size: 20px;
        font-weight: 600;
        line-height: normal;

        @media (min-width: 1440px) {
            max-width: 337px;
            min-height: 121px;
        }
    }

    .services-description {
        font-size: 24px;
        font-weight: 600;
        line-height: 32px; /* 133.333% */
    }

    .card-body {
        padding-right: 24px;
        padding-top: 80px;
        padding-bottom: 24px;

        @media (min-width: 1440px) {
           padding-right: 87px;
           padding-top: 57px;
           padding-bottom: 60px;

        }

        a {
            color: #021022;
            font-size: 16px;
            font-weight: 700;
            line-height: normal;
        }
    }
     
}
/*!**************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/scss/projects.scss ***!
  \**************************************************************************/
section.projects {
    background: linear-gradient(180deg, #FFF 0%, rgba(255, 246, 202, 0.00) 100%);
    .card {
        border: 0;

        .project-logo {
            @media (min-width: 1440px) {
                width: 250px;
                height: 250px;
            }

        }

        .card-text {
            text-align: center;
            font-size: 24px;
            font-weight: 700;
            line-height: normal;
            margin-top: 20px;

            @media (min-width: 1440px) {
                max-width: 295px;
            }
        }
    }
    
    .projects-description {
        font-size: 24px;
        font-weight: 600;
        line-height: 32px; /* 133.333% */
    }

    .explore-btn {
        @media (min-width: 1440px) {
            margin-top: 90px;
        }
    }
}
/*!***********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/scss/owner.scss ***!
  \***********************************************************************/
section.owner {
  background-image: linear-gradient(180deg, #fff, #fff6ca57 , #fff);

  .video-container {
    width: 100%; /* Desired display width */
    height: 490px; /* Desired display height */
    overflow: hidden; /* Hide excess video outside the container */
    position: relative;
  }
  
  video {
    width: 100%; /* Make the video fill the container */
    height: 100%; /* Make the video fill the container */
    object-fit: cover; /* Crop and scale the video to fill */
  }

  p {
    font-size: 27px;
    font-weight: 400;
    line-height: 37.8px;
  }
  .owner-about {
    .owner-image {
      max-width: 100%;

      @media (min-width: 768px) {
        max-width: 430px;
      }
    }
    .image-card {
      span {
        font-size: 20px;
        font-weight: 400;
        line-height: 26px;
        text-align: center;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
      }
    }
  }
  
  .owner-news {
    h5 {
      font-size: 20px;
      font-weight: 700;
      line-height: 32px;
    }
    p {
      font-size: 16px;
      font-weight: 400;
      line-height: 29.98px;
      text-align: right;
    }
    .read-more-btn {
      font-size: 18px;
      font-weight: 600;
      line-height: 33.73px;
      min-width: 150px;
    }
    .col-news {
      max-width: 420px;
      min-height: 570px;
    }
    .card {
      height: 100%;
      border-radius: 8px;
    }
  }
  .owner-social {
    .owner-social-link {
      font-size: 24px;
      font-weight: 700;
      line-height: 33.6px;
      color: black;
      text-decoration: none;
    }
  }
}

/*!************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/scss/footer.scss ***!
  \************************************************************************/
footer {
    background: #021022;
    h5.border-bottom {
        border-bottom: 4px solid #FFD700 !important;
    }
}
/*!*************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/scss/main.scss ***!
  \*************************************************************************************************************/
body {
  color: black !important;
  font-family: "Cairo", sans-serif;
}

.navbar {
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.4) 4.01%, rgba(254, 225, 70, 0.2) 100%);
}
.navbar .navbar-brand img {
  width: 64px;
  height: 64px;
}
.navbar .nav-link {
  font-weight: 700;
  color: black;
}
.navbar .nav-icons {
  display: flex;
  gap: 24px;
}
.navbar .nav-icons img {
  border-radius: 100%;
  width: 40px;
  height: 40px;
}

section {
  padding-top: 40px;
}

.btn-primary {
  border-radius: 8px;
  background: #ffd700;
  font-size: 16px;
  font-weight: 500;
  line-height: 100%; /* 16px */
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:active:focus {
  background-color: #c0a300;
  border-color: #c0a300;
  box-shadow: 0 0 0 0.25rem #d8b800 !important;
}

h2 {
  font-size: 40px;
  font-weight: 700;
  line-height: 68px;
}
@media (min-width: 768px) and (max-width: 1439px) {
  h2 {
    font-size: 48px;
    line-height: 81.6px;
  }
}
@media (min-width: 1440px) {
  h2 {
    color: #021022;
    font-size: 48px;
    line-height: 47.25px; /* 98.438% */
  }
}

h3 {
  font-size: 32px;
  font-weight: 700;
  line-height: 54.4px;
}
@media (min-width: 768px) and (max-width: 1439px) {
  h3 {
    font-size: 32px;
    font-weight: 700;
    line-height: 54.4px;
  }
}
@media (min-width: 1440px) {
  h3 {
    font-size: 32px;
    font-weight: 700;
    line-height: 54.4px;
  }
}