/* Recaptcha */
.grecaptcha-badge {
  visibility: hidden;
}

/* Hide footer on desktop */
@media (min-width: 1221px) {
  .projects-template-default footer {
    display: none !important;
  }
}

/* Show footer on smaller screens (default) */
/* @media (max-width: 1220px) {
  .projects-template-default footer {
    display: block !important;
  }
} */

.elementor .industry a {
  color: #1e1e1e !important;
}
.background_services {
  padding-top: 20px;
  padding-bottom: 40px;
  background-color: #1e1e1e;
}
.our_services {
  font-family: "AeonikTRIAL-Regular";
  font-weight: 400;
  font-size: 15px;
  line-height: 25px;
  text-transform: uppercase;
  color: #ffffff;
}
p#service_number {
  font-family: "AeonikTRIAL-Regular";
  font-weight: 400;
  font-size: 17px;
  line-height: 25px;
}
.services_item {
  color: #ffffff;
  text-transform: uppercase;
  line-height: 60px;
}

.hover-container {
  position: relative;
  display: inline-block;
}

.text-original {
  font-family: "AeonikTRIAL-Regular";
  font-size: 80px;
  line-height: 70px;
  font-weight: 400;
  color: white;
  opacity: 0.5;
  text-transform: uppercase;
  position: relative;
  z-index: 1;
}

.text-reveal {
  font-family: "AeonikTRIAL-Regular";
  font-size: 80px;
  line-height: 70px;
  font-weight: 400;
  color: white;
  text-transform: uppercase;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  clip-path: inset(0 100% 0 0);
  z-index: 3;
}

.hover-rectangle {
  position: absolute;
  width: 100px;
  height: 200px;
  pointer-events: none;
  z-index: 2;
  display: none;
  transition: transform 0.2s ease;
}

.hover-bg {
  /* border-radius: 90px; */
  position: absolute;
  width: 100%;
  height: 100%;
  /* background-image: url("https://stg-steveandco-staging.kinsta.cloud/wp-content/uploads/2025/08/tokyo-tower.jpg"); */
  background-size: cover;
  background-position: center;
  z-index: 1;
  top: 0;
  left: 0;
}

.hover-text-inside {
  position: absolute;
  color: white;
  font-size: 5px;
  text-transform: uppercase;
  z-index: 2;
  top: 0;
  left: 0;
  white-space: nowrap;
  pointer-events: none;
}
.hovering {
  text-decoration: none;
}

.our_mobile_services {
  font-family: "AeonikTRIAL-Regular";
  font-size: 15px;
  line-height: 25px;
  text-transform: uppercase;
  color: #ffffff;
}
.hover-mobile-container {
  position: relative;
  display: inline-block;
}

.text-mobile-original {
  font-family: "AeonikTRIAL-Regular";
  font-size: 32px;
  line-height: 31px;
  color: white;
  opacity: 0.5;
  text-transform: uppercase;
  position: relative;
  z-index: 1;
}

.text-mobile-reveal {
  font-family: "AeonikTRIAL-Regular";
  font-size: 32px;
  line-height: 31px;
  color: white;
  text-transform: uppercase;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  clip-path: inset(0 100% 0 0);
  z-index: 3;
}
.hover-mobile-rectangle {
  position: absolute;
  width: 150px;
  height: 150px;
  pointer-events: none;
  z-index: 2;
  display: none;
}

.hover-mobile-bg {
  border-radius: 90px;
  position: absolute;
  width: 100%;
  height: 100%;
  /* background-image: url("https://stg-steveandco-staging.kinsta.cloud/wp-content/uploads/2025/08/tokyo-tower.jpg"); */
  background-size: cover;
  background-position: center;
  z-index: 1;
  top: 0;
  left: 0;
}

.hover-text-mobile-inside {
  position: absolute;
  color: white;
  font-size: 5px;
  text-transform: uppercase;
  z-index: 2;
  top: 0;
  left: 0;
  white-space: nowrap;
  pointer-events: none;
}
.hovering-mobile {
  text-decoration: none;
  font-family: Aeonik TRIAL;
}
#service_number_mobile {
  font-family: "AeonikTRIAL-Regular";
  font-size: 17px;
  line-height: 25px;
}
/* for the image or video */

.media-item-first,
.media-item-second {
  height: 1000px; /* desktop */
}

@media (max-width: 768px) {
  .media-item-first {
    height: 500px !important;
  }
  .media-item-second {
    height: 200px !important;
  }
  .media-item-third {
    height: 400px !important;
  }
  .media-item-fourth {
    height: 300px !important;
  }
  .media-item-fifth {
    height: 400px !important;
  }
  .media-item-sixth {
    height: 400px !important;
  }
  .media-item-seven {
    height: 200px !important;
  }
  .media-item-full {
    height: 500px !important;
  }
}

/* archive page */

.filters {
  margin: 20px 0px 20px 0px;
  font-family: "AeonikTRIAL-Regular";
  font-size: 15px;
  line-height: 27px;
  font-weight: 400;
  text-transform: uppercase;
}
/* button in the archive page  */
button {
  border-radius: 0px !important;
}

.filters button:focus,
.filters button:hover {
  background-color: #1e1e1e !important;
}

.filters .filter-btn:focus,
.filters .filter-btn:hover {
  background-color: transparent !important;
  color: #1e1e1e !important;
}
/* span.arrow {
  display: inline-block;
  width: 14px;
  height: 14px;
  content: url(/wp-content/uploads/2025/08/arrow_outward-1.svg) !important;
  background-size: contain;
  transition: transform 0.3s ease;
} */

.filter-toggle {
  background: #1e1e1e;
  color: #fff;
  padding: 0px 7px;
  border: none;
  cursor: pointer;
  font-size: 15px;
  line-height: 25px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 10px;
}
.filter-toggle:hover {
  background: #1e1e1e !important;
}
.filter-toggle .arrow {
  display: inline-block;
  width: 10px;
  height: 14px;
  content: url(/wp-content/uploads/2025/08/arrow_outward-1.svg) !important;
  transition: transform 0.3s ease;
}

.filter-toggle .arrow.rotated {
  transform: rotate(90deg);
}

.filter-buttons {
  margin-top: 12px;
  display: none;
  gap: 20px;
  flex-wrap: wrap;
}

.filter-buttons.show {
  display: flex !important;
}

.filter-group {
  display: flex;
  align-items: center;
  gap: 12px;
}

.filter-btn:hover,
.filter-btn:focus {
  background-color: transparent !important;
  color: #fff !important;
}
.filter-btn {
  color: #1e1e1e !important;
  background: none;
  border: 1px solid #000;
  padding: 0px 7px;
  cursor: pointer;
  font-size: 14px;
  text-transform: uppercase;
}

.filter-items {
  display: none;
}

.filter-items.active {
  display: flex;
  gap: 20px;
}

.filter-item {
  cursor: pointer;
  font-size: 14px;
}

.filter-item.active {
  text-decoration: underline;
}
.projects-list {
  display: flex;
  flex-direction: column;
}
.project-row.insights {
  display: grid;
  grid-template-columns: 3fr 30fr 0fr 0fr;
  align-items: center;
  border-bottom: 1px solid #1e1e1e;
  padding: 29.25px 20px 30.75px 20px;
}

.project-row {
  position: relative;
  overflow: hidden; /* hide the overflow so the bg doesn’t spill */
  display: grid;
  grid-template-columns: 2fr 1fr 2fr 3fr 1fr;
  align-items: center;
  border-bottom: 1px solid #1e1e1e;
  padding: 29.25px 20px 30.75px 20px;
  transition: color 0.4s ease;
}
.project-row::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -100%;
  width: 100%;
  height: 100%;
  background-color: #1e1e1e;
  transition: bottom 0.4s ease;
  z-index: 0;
}
.project-row:hover::before {
  bottom: 0;
}
.project-row * {
  position: relative;
  z-index: 1;
  transition: color 0.4s ease;
}
.project-row:hover {
  background-color: #1e1e1e !important;
}



/* make title + link react on hover */
.project-row:hover .project-title,
.project-row:hover .project-link,
.project-row:hover .project-country,
.project-row:hover .project-industry,
.project-row:hover .project-services,
.project-row:hover .project-link a,
.project-row:hover .project-link span.link-arrow {
  color: #ffffff; /* highlight text */
  /* transition: color 0.8s ease; */
}
.project-row .project-link .link-arrow img {
  width: 16px;
  height: auto;
  transition: transform 0.4s ease;
}

/* Rotate on hover */
.project-row:hover .project-link .link-arrow img {
  transform: rotate(45deg); /* adjust angle as needed */
}

.project-link .link-arrow {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-left: 31.56px;
  background: url(/wp-content/uploads/2025/09/arrow_outward-black.svg) no-repeat
    center;
  background-size: contain !important;
  transition: background-image 0.3s ease;
}

/* Rotate + swap color on hover */
.project-row:hover .link-arrow {
  width: 10px !important;
  height: 10px !important;
  background: url(/wp-content/uploads/2025/09/arrow_outward_white.svg) no-repeat
    center !important;
  background-size: cover !important;
}

.project-title {
  font-family: "AeonikTRIAL-Regular";
  font-size: 15px;
  line-height: 27px;
  font-weight: 400;
  text-transform: uppercase;
  color: #1e1e1e;
}
.project-link {
  font-family: "AeonikTRIAL-Regular";
  font-size: 15px;
  line-height: 27px;
  font-weight: 400;

  color: #1e1e1e;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.project-country,
.project-industry,
.project-services {
  font-family: "AeonikTRIAL-Regular";
  font-weight: 400;
  font-size: 17px;
  line-height: 25px;
  color: #1e1e1e;
}

.project-link a {
  text-decoration: none;
  color: #1e1e1e;
  font-family: "AeonikTRIAL-Regular";
  font-weight: 400;
  font-size: 17px;
  line-height: 25px;
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: flex-end;
}

.project-link span.link-arrow {
  margin-left: 31.56px;
  /* content: url(/wp-content/uploads/2025/09/arrow_outward-black.svg) !important; */
}
.load-more-container {
  margin-top: 20px;
  text-align: center;
}
#load-more {
  background: #1e1e1e;
  color: #fff;
  border: none;
  padding: 0px 7px;
  font-size: 15px;
  line-height: 25px;
  font-weight: 400;
  text-transform: uppercase;
  cursor: pointer;
}
#load-more-posts {
  background: #1e1e1e;
  color: #fff;
  border: none;
  padding: 0px 7px;
  font-size: 15px;
  line-height: 25px;
  font-weight: 400;
  text-transform: uppercase;
  cursor: pointer;
}

filter-group .filter-btn {
    font-size: 15px !important;
    line-height: 25px !important;
}

/* moblie veiw */

@media screen and (max-width: 767px) {

.project-row:hover,
.project-row:active {
  background-color: transparent !important;
}
.project-row:hover .project-link .link-arrow img {
  transform: rotate(45deg); /* adjust angle as needed */
}
.project-row:hover .link-arrow {
  width: 10px !important;
  height: 10px !important;
  background: url(/wp-content/uploads/2025/09/arrow_outward-black.svg) no-repeat
    center !important;
  background-size: cover !important;
}
.project-row::before {
  background-color: transparent;
}
/* make title + link react on hover */
.project-row:hover .project-title,
.project-row:hover .project-link,
.project-row:hover .project-country,
.project-row:hover .project-industry,
.project-row:hover .project-services,
.project-row:hover .project-link a,
.project-row:hover .project-link span.link-arrow {
  color: #1e1e1e; /* highlight text */
  /* transition: color 0.8s ease; */
}
  .filters {
    margin: 20px 20px;
  }
  .projects-filter-section .project-country,
  .projects-filter-section .project-industry,
  .projects-filter-section .project-services,
  .project-row.insights .project-country {
    display: none !important;
  }

  .project-row.insights .project-title {
        padding-right: 20px !important;
  }


  .filters .filter-btn button:focus,
  .filters .filter-btn  button:hover {
    background-color: transparent !important;
    color: #1e1e1e !important;
}

  .selected-filter-container {
    margin: 15px 20px 25px 20px !important;
  }
  .project-row {
    grid-template-columns: 1fr; /* Stack items vertically */
    padding: 30px 0;
    row-gap: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .project-row.insights {
    grid-template-columns: 1fr; /* Stack items vertically */
    padding: 30px 0;
    row-gap: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .filter-buttons,
  .filter-items.active {
    flex-direction: column;
    width: 100%;
    gap: 12px;
  }
.filter-items.active {
      align-items: center;
}
  .filter-group {
    flex-direction: column;
    align-items: flex-start;
  }

  .filter-toggle {
    width: 100%;
    justify-content: space-between;
  }

  .project-link a {
    justify-content: space-between;
  }

  .project-link span.link-arrow {
    margin-left: 12px;
  }

  .projects-list {
    padding: 0 20px;
  }

  .filter-btn {
    width: 100%;
    text-align: center;
  }

  .filter-items {
    flex-direction: column;
    gap: 10px;
  }
}
/* filter clear for the project */

.selected-filter-container {
  margin: 15px 0px;
  /* padding: 10px;
    background: #f3f3f3;
    border-left: 4px solid #1E1E1E;
    display: flex; */
  align-items: center;
  justify-content: space-between;
}

.selected-filter-label {
  font-family: "AeonikTRIAL-Regular";
  font-weight: 400;
  font-size: 12px;
  line-height: 23px;
  padding-right: 15px;
}

.clear-filter {
  border: 1px solid #1e1e1e;
  background: #1e1e1e;
  font-weight: 400;
  font-size: 12px;
  font-family: "AeonikTRIAL-Regular";
  color: #ffffff;
  border: none;
  padding: 0px 5px;
  cursor: pointer;
}

.clear-filter:hover {
  background-color: transparent !important;
  color: #1e1e1e;
  border: 1px solid #1e1e1e;
}
/* .clear-filter::after {
content: "\00d7";
font-size: 20px;
} */

/* vacancies */

.vacancies-section {
  margin-top: 20px;
}
.vacancies-title {
  color: #ffffff;
  font-size: 15px;
  line-height: 27px;
  font-family: "AeonikTRIAL-Regular";
  font-weight: 400;
  text-transform: uppercase;
  padding-bottom: 30px;
  margin-block-end: 0px;
  border-bottom: 1px solid #ffffff;
}
.vacancies-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30px 0;
  border-bottom: 1px solid #ffffff;
}
.vacancies-job {
  color: #ffffff;
  font-family: "AeonikTRIAL-Regular";
  font-size: 17px;
  font-weight: 400;
  line-height: 25px;
}
.vacancies-link {
  font-family: "AeonikTRIAL-Regular";
  font-size: 17px;
  font-weight: 400;
  line-height: 25px;
  text-decoration: none;
  color: #ffffff !important;
}
.vacancies-link::after {
  content: url("/wp-content/uploads/2025/08/arrow_outward-1.svg");
  display: inline-block;
  margin-left: 10px; /* space between text and icon */
  /* vertical-align: middle; */
}
.vacancies-link:hover {
  color: #f00; /* change color on hover */
}

selector {
  transform: translateY(100%);
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
selector.elementor-popup-modal.elementor-popup-modal-open {
  transform: translateY(0);
}

/* .next-project-section {
  height: 100vh;
  background:#532f33;
  display:flex;
  flex-direction:column;
  align-items:center; justify-content:center;
  padding:40px 20px; color:#fff;
} */
/* */
.next-project-section {
  height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 135px 365px;
  color: #fff;
  background-size: cover;
  background-position: center;
  position: sticky;
  overflow: hidden;
}


.np-title {
  font-family: "AeonikTRIAL-Regular";
  font-size: 15px;
  line-height: 28px;
  font-weight: 400;
  margin-bottom: 20px;
  text-align: left;
  text-transform: uppercase;
  width: 100%; /* Fill available width */
  max-width: 1191px; /* Don't go beyond this */
  z-index: 999;
}
.np-subtitle {
  font-family: "AeonikTRIAL-Regular";
  font-size: 25px;
  line-height: 30px;
  font-weight: 400;
  text-transform: uppercase;
  z-index: 999;
}

.np-title br {
  content: "";
}

/* .np-image img {
  max-width:800px;
  width:100%;
  height:auto;
  border-radius:6px;
  margin-bottom:40px;
  box-shadow:0 8px 25px rgba(0,0,0,.4);
} */

.np-image img {
  width: 100%; /* Fill available width */
  max-width: 1191px; /* Don't go beyond this */
  aspect-ratio: 1191 / 469; /* Maintain height ratio automatically */
  object-fit: cover;
  margin-bottom: 20px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
  display: block;
  transition: transform 0.4s ease-out;
  will-change: transform;
}

.np-progress-track {
  /*width:90%;
  max-width:900px;*/
  width: 100%;
  max-width: 1191px;
  height: 3px;
  background: rgba(255, 255, 255, 0.25);
  position: relative;
  z-index: 999;
}
.np-progress-fill {
  width: 0%;
  height: 100%;
  background: #fff;
  transition: width 0.1s linear;
}
.np-hint {
  font-family: "AeonikTRIAL-Regular";
  color: #ffffff;
  margin-top: 12px;
  font-weight: 400;
  font-size: 15px;
  line-height: 28px;
  text-transform: uppercase;
  width: 100%;
  max-width: 1191px;
  z-index: 999;
}
/* moblie menu css */

/* Ensure popup stays behind content */
/* Mobile menu behind content */

/*


  .mobile-slide-menu {
    display: none;
    transform: translateY(-100%);
    transition: transform 0.4s ease, opacity 0.4s ease;
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background: white;
    height: 100vh;
    overflow-y: auto;
  }

  .mobile-slide-menu.active {
    display: block;
    transform: translateY(0);
    opacity: 1;
  }

  .mobile-slide-menu.slide-up {
    transform: translateY(-100%);
    opacity: 0;
  } */

/* .main-content {
  position: relative;
  transition: all 1s ease-in-out;
  z-index: 1000;
} */

/*

/* Main content wrapper */
/* ---------- MAIN CONTENT (animation target) ---------- */
/* 1) main-content styling (hardware-accelerated transform + stacking) */
/* 1) main-content styling (hardware-accelerated transform + stacking) */
/* Default state */
.main-content {
  transform: translateY(0);
  transition: transform 0.6s ease-in-out;
  position: relative;
  z-index: 1000;
}

.main-content.shifted {
  transform: translateY(100vh); /* push down by one viewport height */
}

/* Smooth slide for main content */
[data-elementor-type="wp-page"].main-content {
  transition: transform 0.48s cubic-bezier(0.2, 0.9, 0.2, 1);
  will-change: transform;
  position: relative;
  z-index: 10;
}

/* When popup (menu) is open */
body.dialog-open [data-elementor-type="wp-page"].main-content {
  transform: translateY(
    calc(100vh - 64px)
  ); /* full screen minus header height */
  pointer-events: none; /* disable clicks while menu open */
}

/* Optional: lock scroll when menu open */
body.dialog-open {
  overflow: hidden;
  touch-action: none;
}

/* footer email css */

@media (max-width: 768px) {
  .text-word {
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

.single-projects .elementor-widget-container h6 {
    padding: 35px 0px 30px 0px;
    margin-block-end: 0px;
    margin-block-start: 0px;
}

.single-projects .elementor-widget-container p {

    margin-block-end: 25px;
}

/* moblie menu */
/* .elementor-272 .elementor-element.elementor-element-a89d43e .menu-item.current-menu-item a.hfe-menu-item,
.elementor-272 .elementor-element.elementor-element-a89d43e .menu-item.current-menu-ancestor a.hfe-menu-item:active,
.elementor-272 .elementor-element.elementor-element-a89d43e .menu-item.current-menu-ancestor a.hfe-menu-item:focus {
    border: none !important;
} */

.elementor-272 .elementor-element.elementor-element-a89d43e .menu-item a.hfe-menu-item:hover,
.elementor-272 .elementor-element.elementor-element-a89d43e .sub-menu a.hfe-sub-menu-item:hover,
.elementor-272 .elementor-element.elementor-element-a89d43e .menu-item.current-menu-item a.hfe-menu-item,
.elementor-272 .elementor-element.elementor-element-a89d43e .menu-item a.hfe-menu-item.highlighted,
.elementor-272 .elementor-element.elementor-element-a89d43e .menu-item a.hfe-menu-item:focus {
   border: none !important;
}
/* Default state */
.dialog-widget .hfe-nav-menu .menu-item a {
  color: #7a7a7a !important;
  transition: color 0.3s ease;
}

/* Hover state */
.dialog-widget .hfe-nav-menu .menu-item a:hover {
  color: #ffffff !important;
}

/* Active/current page state */
.dialog-widget .hfe-nav-menu .menu-item.current-menu-item > a,
.dialog-widget .hfe-nav-menu .menu-item.current_page_item > a {
  color: #ffffff !important;
}