html { scroll-behavior: smooth; }
body.menu-is-open { overflow: hidden; }
.main-menu-all ul { align-items: center; }
.main-menu-all a { cursor: pointer; }
.subscribe-form .rr-btn-primary { display: inline-flex; border: 1px solid rgba(255,255,255,.6); }
.footer-widget-box .subscribe-form .email-input-group {
  border-bottom: 1px solid #DADADA;
}
.footer-widget-box .subscribe-form .contact-submit {
  display: flex;
  margin-top: 16px;
}
.footer-widget-box .subscribe-form .contact-submit .rr-btn-primary {
  justify-content: center;
  width: 100%;
}
.header__nav.work-menu-source { display: none !important; }
.side-info-4 {
  background: #fff;
  color: var(--primary);
}
.side-info-4 .offcanvas-4 {
  min-height: 100%;
  background: #fff;
}
.side-info-4 .offcanvas-4 .offset-header {
  border-bottom-color: rgba(17, 17, 17, .12);
}
.side-info-4 .offcanvas-4 .offset-header h6,
.side-info-4 .offcanvas-4 .offset-header .date {
  color: var(--secondary);
}
.side-info-4 .offcanvas-4 .contact-item .mobile-menu ul li a {
  color: var(--primary);
}
.side-info-4 .offcanvas-4 .contact-item .mobile-menu ul li:hover > a {
  color: var(--secondary);
}
body.menu-is-open .header-area {
  z-index: 100000000;
  pointer-events: none;
  background: transparent;
}
body.menu-is-open .header-area .header-main {
  border-bottom-color: transparent;
}
body.menu-is-open .header-area .header-meta,
body.menu-is-open .work-header-logo {
  opacity: 0;
  pointer-events: none;
}
body.menu-is-open .work-header-logo {
  opacity: 1;
}
body.menu-is-open .work-header-logo img {
  filter: none !important;
}
body.menu-is-open .side-info-4 .offcanvas-4 .offset-logo {
  visibility: hidden;
}
body.menu-is-open .header-area .header__navicon {
  position: relative;
  z-index: 100000001;
  pointer-events: auto;
}
/* Both menu controls share one visual state through body.menu-is-open. */
.menu-trigger {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.menu-trigger .bar-icon {
  width: 30px !important;
  height: 14px !important;
  overflow: visible;
}
.menu-trigger .bar-icon span {
  width: 30px;
  height: 1px;
  flex: 0 0 1px;
  background: #DADADA;
  transition: transform .3s ease, opacity .2s ease, background-color .2s ease;
}
.header-area .work-header-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  column-gap: 24px;
  align-items: center;
}
.header-area .work-header-logo {
  justify-self: start;
}
.header-area .work-header-logo a,
.header-area .work-header-logo img {
  display: block;
}
.header-area .work-header-logo img {
  width: clamp(95px, 8vw, 132px);
  height: auto;
  max-width: none;
}
.header-area:not(.scrolled) .work-header-logo img {
  filter: invert(1);
}
.header-area .work-header-tagline {
  justify-self: center;
  white-space: nowrap;
}
.header-area .work-header-layout .header-right {
  justify-self: end;
}
.header-area .work-header-layout .header__navicon {
  margin-left: 0;
}
.header-area.scrolled .work-header-menu-toggle .bar-icon span {
  background: var(--primary);
}
.hero-nav .menu-trigger {
  left: 19px;
}
.hero-nav .menu-trigger .bar-icon {
  rotate: -90deg;
}
body.menu-is-open .hero-nav {
  z-index: 100000000;
  mix-blend-mode: normal;
}
body.menu-is-open .hero-nav::before,
body.menu-is-open .hero-nav__content {
  opacity: 0;
  pointer-events: none;
}
body.menu-is-open .side-toggle .bar-icon {
  position: relative;
  width: 30px !important;
  height: 30px !important;
  display: block;
  overflow: visible;
  rotate: 0deg !important;
}
body.menu-is-open .side-toggle .bar-icon span {
  position: absolute;
  top: 50%;
  left: 0;
  width: 30px;
  height: 1.5px !important;
  margin-left: 0 !important;
  background: var(--primary) !important;
  transform-origin: center;
  animation: none !important;
}
body.menu-is-open .side-toggle .bar-icon span:first-child {
  transform: translateY(-50%) rotate(45deg);
}
body.menu-is-open .side-toggle .bar-icon span:nth-child(2) {
  opacity: 0;
  transform: translateY(-50%) scaleX(0);
}
body.menu-is-open .side-toggle .bar-icon span:nth-child(3) {
  transform: translateY(-50%) rotate(-45deg);
}
.side-info-4 .offcanvas-4 .offset-widget-box {
  display: block !important;
}
.side-info-4 .offcanvas-4 .work-menu-nav-container {
  display: block;
  padding: clamp(36px, 5vw, 72px) 0 0 clamp(96px, 10vw, 180px);
}
.side-info-4 .offcanvas-4 .work-menu-nav {
  display: flex !important;
  min-width: 0;
}
.side-info-4 .offcanvas-4 .work-menu-nav .contact-item__menu {
  width: 100%;
}
.side-info-4 .offcanvas-4 .work-menu-nav .mobile-menu.mean-container .meanmenu-reveal {
  display: none !important;
}
.side-info-4 .offcanvas-4 .work-menu-nav .mobile-menu.mean-container .mean-nav > ul {
  display: block !important;
}
.side-info-4 .offcanvas-4 .work-menu-nav .mobile-menu ul li a {
  padding: clamp(8px, 1vw, 12px) 0;
  line-height: .98;
  font-size: clamp(34px, 5vw, 64px);
}
.side-info-4 .offcanvas-4 .work-menu-socials {
  display: flex;
  gap: 12px;
  padding: 28px 0 0 clamp(96px, 10vw, 180px);
}
.side-info-4 .offcanvas-4 .work-menu-socials__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid #DADADA;
  border-radius: 50%;
  color: var(--primary);
  font-size: 20px;
}
.work-placeholder-page {
  min-height: 100vh;
  background: #EDECE8;
  color: var(--primary);
  padding-top: clamp(130px, 14vw, 190px);
}
.work-placeholder-page .section-title__wrapper { align-items: flex-start; }
.work-placeholder-page .section-title__wrapper .desc { max-width: 680px; color: var(--secondary); }
.work-placeholder-actions { margin-top: 44px; display: flex; gap: 12px; flex-wrap: wrap; }
.work-placeholder-actions .rr-btn-primary { border: 1px solid var(--border); }
@media only screen and (max-width: 767px) {
  .header-area__inner { gap: 12px; }
  .header-area .header-right { gap: 4px; margin-left: auto; }
  .work-header-menu-toggle { flex: 0 0 44px; }
  .header-area .work-header-layout {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .header-area .work-header-logo img {
    width: 95px;
  }
  .side-info-4 .offcanvas-4 .work-menu-nav-container {
    padding: 24px 0 0 clamp(24px, 7vw, 40px);
  }
  .side-info-4 .offcanvas-4 .work-menu-socials {
    padding-left: clamp(24px, 7vw, 40px);
  }
}
