html.saya-menu-lock,
body.saya-menu-lock {
  overflow: hidden !important;
}

/* Main header */
.saya-site-header {
  position: relative;
  z-index: 1000;
}

.saya-site-header .menu-box {
  display: flex;
  align-items: center;
}

.saya-site-header .saya-menu-open {
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

/* Mega menu */
.saya-mega-menu {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  background: #f8f6f1 !important;
  z-index: 99999 !important;
  overflow: hidden !important;
  padding: 0 !important;
  display: none;
}

.saya-mega-menu.is-visible {
  display: block !important;
}

.saya-mega-menu * {
  box-sizing: border-box;
}

.saya-mega-menu .saya-menu-shell {
  height: 100%;
  display: grid;
  grid-template-columns: 22.5% 47.5% 30%;
  font-family: "mont-book", Arial, sans-serif;
  color: #242424;
  overflow: hidden;
  position: relative;
}

.saya-menu-left {
  grid-column: 1;
  background: #fff;
  padding: 22px 26px 18px 4.25vw;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #ece6dc;
  overflow: hidden;
  position: relative;
  z-index: 3;
}

.saya-menu-logo {
  display: block;
  width: 180px;
  margin: 0 0 14px;
}

.saya-menu-logo img {
  width: 100% !important;
  height: auto !important;
  display: block;
}

.saya-menu-left nav {
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  min-height: 0;
}

.saya-nav-item {
  min-height: 48px;
  display: flex !important;
  align-items: center;
  gap: 0;
  padding: 0 22px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent;
  color: #252525 !important;
  text-decoration: none !important;
  text-transform: uppercase;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 13px !important;
  letter-spacing: .055em;
  text-align: left;
  cursor: pointer;
  position: relative;
  border-radius: 0;
  transition: background .22s ease, color .22s ease;
  width: 100%;
}

.saya-nav-item::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 0;
  height: 1px;
  background: rgba(168, 102, 29, .16);
  pointer-events: none;
}

.saya-menu-left nav .saya-nav-item:last-child::after {
  display: none;
}

.saya-nav-item:hover,
.saya-nav-item:focus,
.saya-nav-item.is-active {
  background: #f78e32 !important;
  color: #fff !important;
}

.saya-nav-item i {
  font: 27px/1 Arial;
  margin-left: auto;
  transition: transform .3s;
}

.saya-project-trigger.is-open i {
  transform: rotate(180deg);
}

.saya-menu-social {
  border-top: 1px solid #e7dfd3;
  margin: 10px 16px 0;
  padding-top: 14px;
  display: flex;
  gap: 12px;
  justify-content: center;
}

.saya-menu-social a {
  width: 35px;
  height: 35px;
  border: 1px solid #e7c9aa;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #f47b32 !important;
  font-size: 14px;
  transition: background .2s ease, border-color .2s ease,
    color .2s ease, transform .2s ease;
}

.saya-menu-social a:hover,
.saya-menu-social a:focus {
  background: #f47b32 !important;
  border-color: #f47b32 !important;
  color: #fff !important;
  transform: translateY(-2px);
}

.saya-connect {
  font: 9px/1.2 "mont-book", Arial, sans-serif;
  letter-spacing: .28em;
  color: #777;
  margin: 9px 16px 0;
  text-align: center;
}

/* Intro artwork */
.saya-menu-intro {
  grid-column: 2;
  grid-row: 1;
  position: relative;
  overflow: hidden;
  opacity: 1;
  transition: opacity .3s ease;
  z-index: 1;
  background: linear-gradient(
    135deg,
    #fffdf9 0%,
    #f8f2e8 48%,
    #fffaf0 100%
  );
}

.saya-mega-menu.projects-open .saya-menu-intro {
  opacity: 0;
  pointer-events: none;
}

.saya-artwork {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background:
    radial-gradient(
      circle at 22% 38%,
      rgba(255, 255, 255, .98) 0 8%,
      transparent 32%
    ),
    radial-gradient(
      circle at 75% 42%,
      rgba(218, 172, 103, .13),
      transparent 34%
    ),
    linear-gradient(
      118deg,
      rgba(255, 255, 255, .7),
      rgba(238, 218, 187, .18) 52%,
      rgba(255, 255, 255, .55)
    );
}

.saya-art-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(45px);
  opacity: .7;
}

.glow-one {
  width: 42vw;
  height: 42vw;
  left: -16vw;
  top: 10%;
  background: rgba(226, 185, 122, .20);
}

.glow-two {
  width: 32vw;
  height: 32vw;
  right: -10vw;
  bottom: -10%;
  background: rgba(244, 209, 151, .22);
}

.saya-art-curve {
  position: absolute;
  border: 2px solid rgba(193, 144, 78, .18);
  border-left-color: transparent;
  border-bottom-color: transparent;
  border-radius: 50%;
  transform: rotate(-18deg);
}

.curve-one {
  width: 72vw;
  height: 36vw;
  left: -18vw;
  top: 25%;
}

.curve-two {
  width: 64vw;
  height: 28vw;
  left: -8vw;
  top: 42%;
  border-color: rgba(210, 166, 102, .12);
  border-left-color: transparent;
  border-bottom-color: transparent;
}

.saya-art-lines {
  position: absolute;
  left: 3%;
  top: -5%;
  width: 18%;
  height: 110%;
  opacity: .22;
  background: repeating-linear-gradient(
    90deg,
    rgba(164, 119, 61, .28) 0 1px,
    transparent 1px 14px
  );
  mask-image: linear-gradient(
    to bottom,
    transparent,
    #000 18%,
    #000 82%,
    transparent
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent,
    #000 18%,
    #000 82%,
    transparent
  );
}

/* Projects */
.saya-project-panel {
  grid-column: 2;
  grid-row: 1;
  padding: 24px 2.5vw 14px;
  background: #fdfcf9;
  overflow: hidden;
  opacity: 0;
  transform: translateX(-18px);
  pointer-events: none;
  transition: .32s ease;
  z-index: 2;
}

.saya-mega-menu.projects-open .saya-project-panel {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

.saya-project-head {
  display: flex;
  align-items: center;
  gap: 18px;
  color: #f78e32;
  font-family: "mont-semibold", Arial, sans-serif;
  font-size: 12px;
  letter-spacing: .27em;
}

.saya-project-head i {
  width: 78px;
  height: 1px;
  background: #c58b4a;
}

.saya-project-panel h2 {
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 400 !important;
  font-size: clamp(31px, 2.65vw, 48px) !important;
  line-height: 1.02 !important;
  margin: 10px 0 20px !important;
  color: #222 !important;
  letter-spacing: -.02em !important;
}

.saya-project-group h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 8px !important;
  padding-bottom: 9px;
  border-bottom: 1px solid #ded5c9;
  color: #f78e32 !important;
  font: 15px/1.2 "mont-semibold", Arial, sans-serif !important;
  letter-spacing: .05em;
}

.group-icon {
  font-size: 22px;
  color: #f78e32;
}

.saya-project-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 22px;
}

.saya-project-card {
  display: grid;
  grid-template-columns: 98px 1fr 30px;
  align-items: center;
  gap: 11px;
  min-height: 80px;
  color: #202020 !important;
  text-decoration: none !important;
}

.saya-project-card img {
  width: 98px !important;
  height: 67px !important;
  object-fit: cover !important;
  border-radius: 7px !important;
  display: block !important;
  box-shadow: 0 4px 11px rgba(0, 0, 0, .09);
}

.saya-project-card strong {
  display: block;
  font: 13px/1.2 "mont-semibold", Arial, sans-serif !important;
  margin-bottom: 5px;
}

.saya-project-card small {
  display: block;
  color: #000;
  font: 9px/1.3 "mont-book", Arial, sans-serif;
  letter-spacing: .025em;
}

.saya-project-card em {
  width: 29px;
  height: 29px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
  display: flex;
  align-items: center;
  justify-content: center;
  font: 21px/1 Arial;
  font-style: normal;
  transition: .25s;
}

.saya-project-card:hover em {
  transform: translateX(4px);
  background: #f78e32;
  color: #fff;
}

.commercial {
  margin-top: 26px;
}

.saya-project-signoff {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #ded5c9;
  color: #c79759;
  font: italic 18px/1.2 Georgia, serif;
}

/* Right visual */
.saya-menu-visual {
  grid-column: 3;
  grid-row: 1;
  position: relative;
  overflow: hidden;
  opacity: 1;
  transform: none;
  transition: .35s ease;
  z-index: 2;
  background: #eee;
}

.saya-menu-visual > a {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.saya-menu-visual video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

/* Close / back */
.saya-menu-close {
  position: fixed !important;
  right: 24px !important;
  top: 18px !important;
  z-index: 100002 !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .88) !important;
  border: 1px solid rgba(0, 0, 0, .08) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 3px 15px rgba(0, 0, 0, .06);
}

.saya-menu-close span {
  position: absolute;
  width: 23px;
  height: 1.5px;
  background: #333;
}

.saya-menu-close span:first-child {
  transform: rotate(45deg);
}

.saya-menu-close span:nth-child(2) {
  transform: rotate(-45deg);
}

.saya-menu-close small {
  position: absolute;
  top: 42px;
  font: 6px Arial;
  letter-spacing: .14em;
  color: #333;
}

.saya-mega-menu,
.saya-menu-left,
.saya-project-panel,
.saya-menu-visual,
.saya-menu-intro {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.saya-mega-menu::-webkit-scrollbar,
.saya-menu-left::-webkit-scrollbar,
.saya-project-panel::-webkit-scrollbar,
.saya-menu-visual::-webkit-scrollbar,
.saya-menu-intro::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* Search overlay */
.saya-next-search {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw;
  min-height: 100dvh;
  z-index: 99998;
  background: #fff;
  display: none !important;
}

.saya-next-search.is-visible {
  display: block !important;
}

.saya-next-search .menu-other-details {
  min-height: calc(100dvh - 100px);
  display: flex;
  align-items: center;
}

.saya-search-form {
  position: relative;
  width: 100%;
}

.saya-search-form .form-item {
  margin: 0;
}

.saya-search-form label {
  display: block;
}

.saya-search-form .form-text {
  width: 100%;
}

.saya-search-form .form-actions {
  position: relative;
}

/* Responsive */
@media (max-height: 760px) and (min-width: 768px) {
  .saya-menu-logo {
    width: 150px;
    margin-bottom: 6px;
  }

  .saya-nav-item {
    min-height: 40px;
    font-size: 15px !important;
  }

  .saya-menu-social {
    padding-top: 8px;
    margin-top: 5px;
  }

  .saya-menu-social a {
    width: 30px;
    height: 30px;
  }

  .saya-connect {
    margin-top: 5px;
  }

  .saya-project-panel {
    padding-top: 17px;
  }

  .saya-project-panel h2 {
    font-size: 34px !important;
    margin: 7px 0 12px !important;
  }

  .saya-project-card {
    grid-template-columns: 80px 1fr 27px;
    min-height: 66px;
  }

  .saya-project-card img {
    width: 80px !important;
    height: 55px !important;
  }

  .commercial {
    margin-top: 26px;
  }

  .saya-project-signoff {
    display: none;
  }
}

@media (max-width: 1100px) {
  .saya-mega-menu .saya-menu-shell {
    grid-template-columns: 31% 69%;
  }

  .saya-menu-intro {
    grid-column: 2;
  }

  .saya-menu-visual {
    display: none;
  }

  .saya-project-panel {
    grid-column: 2;
    padding-right: 4vw;
  }

  .saya-project-card {
    grid-template-columns: 86px 1fr 28px;
  }

  .saya-project-card img {
    width: 86px !important;
    height: 62px !important;
  }
}

@media (min-width: 768px) {
  .saya-menu-intro {
    display: none !important;
  }

  .saya-project-panel {
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  .saya-project-trigger {
    cursor: default !important;
  }

  .saya-project-trigger > i {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .saya-mega-menu .saya-menu-shell {
    display: block;
    height: 100%;
    overflow: hidden;
  }

  .saya-menu-left {
    padding: 18px 16px;
    min-height: 100%;
    height: 100%;
  }

  .saya-menu-logo {
    width: 140px;
  }

  .saya-nav-item {
    min-height: 45px;
    font-family: "mont-semibold", Arial, sans-serif !important;
    font-size: 12px !important;
    letter-spacing: .045em;
  }

  .saya-menu-social a {
    border-color: #e7c9aa;
    color: #f47b32 !important;
  }

  .saya-connect {
    color: #17222d;
  }

  .saya-menu-intro {
    display: none;
  }

  .saya-project-panel {
    display: none;
    height: 100%;
    padding: 22px 16px 28px;
    opacity: 1;
    transform: none;
    overflow-y: auto;
    background: #fdfcf9;
  }

  .saya-mega-menu.projects-open .saya-project-panel {
    display: block;
  }

  .saya-mega-menu.projects-open .saya-menu-left {
    display: none;
  }

  .saya-project-grid {
    grid-template-columns: 1fr;
  }

  .saya-project-panel h2 {
    font-size: 34px !important;
    padding-right: 48px;
  }

  .saya-project-card {
    grid-template-columns: 82px 1fr 30px;
    gap: 10px;
    min-height: 78px;
  }

  .saya-project-card img {
    width: 82px !important;
    height: 60px !important;
  }

  .saya-menu-close {
    width: 48px !important;
    height: 48px !important;
    right: 10px !important;
    top: 10px !important;
    background: rgba(255, 255, 255, .94) !important;
  }

  .saya-menu-close small {
    display: none;
  }

  .saya-mega-menu.projects-open .saya-menu-close {
    background: #fff8ef !important;
    border-color: #ead8bf !important;
  }

  .saya-mega-menu.projects-open .saya-menu-close span {
    background: #a8661d;
  }

  .saya-mega-menu.projects-open .saya-menu-close::after {
    content: "BACK";
    position: absolute;
    top: 34px;
    font: 6px/1 Arial;
    letter-spacing: .12em;
    color: #a8661d;
  }
}
/* =========================================================
   Secondary navigation sticky behaviour
   ========================================================= */

.secondary-nav.sticky {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 9990 !important;
  background: #fff !important;
}

.secondary-nav.sticky.push {
  top: 0 !important;
}

.secondary-nav.sticky .container {
  position: relative;
  z-index: 1;
}


/* Project menu group icons - CSS only, encoding safe */
.saya-project-group .group-icon {
  position: relative;
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 9px;
  vertical-align: -3px;
  flex: 0 0 18px;
}

/* Residential - house */
.saya-project-group .group-icon-home::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 7px;
  width: 10px;
  height: 9px;
  border: 1.5px solid currentColor;
  border-top: 0;
  box-sizing: border-box;
}

.saya-project-group .group-icon-home::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 3px;
  width: 10px;
  height: 10px;
  border-left: 1.5px solid currentColor;
  border-top: 1.5px solid currentColor;
  transform: rotate(45deg);
  box-sizing: border-box;
}

/* Commercial - building */
.saya-project-group .group-icon-commercial::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 2px;
  width: 12px;
  height: 15px;
  border: 1.5px solid currentColor;
  box-sizing: border-box;
  background:
    linear-gradient(currentColor,currentColor) 3px 3px/2px 2px no-repeat,
    linear-gradient(currentColor,currentColor) 7px 3px/2px 2px no-repeat,
    linear-gradient(currentColor,currentColor) 3px 7px/2px 2px no-repeat,
    linear-gradient(currentColor,currentColor) 7px 7px/2px 2px no-repeat;
}

.saya-project-group .group-icon-commercial::after {
  content: "";
  position: absolute;
  left: 8px;
  bottom: 1px;
  width: 3px;
  height: 5px;
  background: currentColor;
}

/* === Common Site Header Interaction Layer === */
/* Shared by all Next.js pages */

.saya-site-header{
    position:absolute!important;
    left:0;
    top:0;
    width:100%;
    z-index:9990!important;
    pointer-events:none;
}

.saya-site-header > .container{
    position:relative;
    z-index:1;
    pointer-events:none;
}

.saya-site-header .logo,
.saya-site-header .menu-box{
    position:relative;
    z-index:2;
    pointer-events:auto!important;
}

.saya-site-header .logo,
.saya-site-header .logo img,
.saya-site-header .serch-click,
.saya-site-header .saya-menu-open,
.saya-site-header .saya-menu-open img{
    pointer-events:auto!important;
}

.saya-mega-menu{
    z-index:99999!important;
}

.saya-mega-menu.is-visible{
    pointer-events:auto!important;
}

.saya-menu-close{
    position:fixed!important;
    z-index:100002!important;
    pointer-events:auto!important;
    cursor:pointer!important;
}



/* BIZTOP HEADER ALIGNMENT FIX */
.saya-biztop-page > .saya-site-header > .container {
    width: 90% !important;
    max-width: 90% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.saya-biztop-page > .saya-site-header > .container > .row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
}

.saya-biztop-page > .saya-site-header > .container > .row > .col {
    flex: 1 1 auto !important;
    min-width: 0;
}

.saya-biztop-page > .saya-site-header > .container > .row > .ml-md-auto {
    flex: 0 0 auto !important;
    margin-left: auto !important;
}

.saya-biztop-page > .saya-site-header .menu-box {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 88px;
    height: 40px;
    border-radius: 20px;
    background: #f6883e;
}

@media (max-width: 767px) {
    .saya-biztop-page > .saya-site-header > .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 15px;
        padding-right: 15px;
    }
}


/* BIZTOP HEADER POSITION FIX V2 */
.saya-biztop-page > header.saya-site-header {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9990 !important;
}

.saya-biztop-page > header.saya-site-header > .container {
    width: 90% !important;
    max-width: 90% !important;
    margin: 0 auto !important;
}

.saya-biztop-page > header.saya-site-header > .container > .row {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    margin: 0 !important;
}

.saya-biztop-page > header.saya-site-header > .container > .row > .col {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

.saya-biztop-page > header.saya-site-header > .container > .row > .ml-md-auto {
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin-left: auto !important;
    padding: 0 !important;
}

.saya-biztop-page > header.saya-site-header .menu-box {
    margin-left: auto !important;
}

@media (max-width: 767px) {
    .saya-biztop-page > header.saya-site-header > .container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 15px !important;
    }
}


/* BIZTOP HAMBURGER ONLY FIX 20261009 */
.saya-biztop-page > header.saya-site-header .menu-box {
    width: 50px !important;
    height: 40px !important;
    min-width: 50px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 20px !important;
    background: #f6883e !important;
}

.saya-biztop-page > header.saya-site-header .menu-box > .serch-click {
    display: none !important;
}

.saya-biztop-page > header.saya-site-header .menu-box > .saya-menu-open {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
}
