html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  font-family: sans-serif;
}

body {
  margin: 0;
}

nav, section {
  display: block;
}

a {
  background-color: #0000;
}

a:active, a:hover {
  outline: 0;
}

h1 {
  margin: .67em 0;
  font-size: 2em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

@font-face {
  font-family: webflow-icons;
  src: url("data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBiUAAAC8AAAAYGNtYXDpP+a4AAABHAAAAFxnYXNwAAAAEAAAAXgAAAAIZ2x5ZmhS2XEAAAGAAAADHGhlYWQTFw3HAAAEnAAAADZoaGVhCXYFgQAABNQAAAAkaG10eCe4A1oAAAT4AAAAMGxvY2EDtALGAAAFKAAAABptYXhwABAAPgAABUQAAAAgbmFtZSoCsMsAAAVkAAABznBvc3QAAwAAAAAHNAAAACAAAwP4AZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADpAwPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAQAAAAAwACAACAAQAAQAg5gPpA//9//8AAAAAACDmAOkA//3//wAB/+MaBBcIAAMAAQAAAAAAAAAAAAAAAAABAAH//wAPAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEBIAAAAyADgAAFAAAJAQcJARcDIP5AQAGA/oBAAcABwED+gP6AQAABAOAAAALgA4AABQAAEwEXCQEH4AHAQP6AAYBAAcABwED+gP6AQAAAAwDAAOADQALAAA8AHwAvAAABISIGHQEUFjMhMjY9ATQmByEiBh0BFBYzITI2PQE0JgchIgYdARQWMyEyNj0BNCYDIP3ADRMTDQJADRMTDf3ADRMTDQJADRMTDf3ADRMTDQJADRMTAsATDSANExMNIA0TwBMNIA0TEw0gDRPAEw0gDRMTDSANEwAAAAABAJ0AtAOBApUABQAACQIHCQEDJP7r/upcAXEBcgKU/usBFVz+fAGEAAAAAAL//f+9BAMDwwAEAAkAABcBJwEXAwE3AQdpA5ps/GZsbAOabPxmbEMDmmz8ZmwDmvxmbAOabAAAAgAA/8AEAAPAAB0AOwAABSInLgEnJjU0Nz4BNzYzMTIXHgEXFhUUBw4BBwYjNTI3PgE3NjU0Jy4BJyYjMSIHDgEHBhUUFx4BFxYzAgBqXV6LKCgoKIteXWpqXV6LKCgoKIteXWpVSktvICEhIG9LSlVVSktvICEhIG9LSlVAKCiLXl1qal1eiygoKCiLXl1qal1eiygoZiEgb0tKVVVKS28gISEgb0tKVVVKS28gIQABAAABwAIAA8AAEgAAEzQ3PgE3NjMxFSIHDgEHBhUxIwAoKIteXWpVSktvICFmAcBqXV6LKChmISBvS0pVAAAAAgAA/8AFtgPAADIAOgAAARYXHgEXFhUUBw4BBwYHIxUhIicuAScmNTQ3PgE3NjMxOAExNDc+ATc2MzIXHgEXFhcVATMJATMVMzUEjD83NlAXFxYXTjU1PQL8kz01Nk8XFxcXTzY1PSIjd1BQWlJJSXInJw3+mdv+2/7c25MCUQYcHFg5OUA/ODlXHBwIAhcXTzY1PTw1Nk8XF1tQUHcjIhwcYUNDTgL+3QFt/pOTkwABAAAAAQAAmM7nP18PPPUACwQAAAAAANciZKUAAAAA1yJkpf/9/70FtgPDAAAACAACAAAAAAAAAAEAAAPA/8AAAAW3//3//QW2AAEAAAAAAAAAAAAAAAAAAAAMBAAAAAAAAAAAAAAAAgAAAAQAASAEAADgBAAAwAQAAJ0EAP/9BAAAAAQAAAAFtwAAAAAAAAAKABQAHgAyAEYAjACiAL4BFgE2AY4AAAABAAAADAA8AAMAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEADQAAAAEAAAAAAAIABwCWAAEAAAAAAAMADQBIAAEAAAAAAAQADQCrAAEAAAAAAAUACwAnAAEAAAAAAAYADQBvAAEAAAAAAAoAGgDSAAMAAQQJAAEAGgANAAMAAQQJAAIADgCdAAMAAQQJAAMAGgBVAAMAAQQJAAQAGgC4AAMAAQQJAAUAFgAyAAMAAQQJAAYAGgB8AAMAAQQJAAoANADsd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzVmVyc2lvbiAxLjAAVgBlAHIAcwBpAG8AbgAgADEALgAwd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzUmVndWxhcgBSAGUAZwB1AGwAYQByd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzRm9udCBnZW5lcmF0ZWQgYnkgSWNvTW9vbi4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==") format("truetype");
  font-weight: normal;
  font-style: normal;
}

[class*=" w-icon-"] {

  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  font-family: webflow-icons !important;
}

.w-icon-dropdown-toggle:before {
  content: "î˜ƒ";
}

* {
  box-sizing: border-box;
}

html {
  height: 100%;
}

body {
  color: #333;
  background-color: #fff;
  min-height: 100%;
  margin: 0;
  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 20px;
}

img {
  vertical-align: middle;
  max-width: 100%;
  display: inline-block;
}

.w-inline-block {
  max-width: 100%;
  display: inline-block;
}

h1, h2, h3 {
  margin-bottom: 10px;
  font-weight: bold;
}

h1 {
  margin-top: 20px;
  font-size: 38px;
  line-height: 44px;
}

h2 {
  margin-top: 20px;
  font-size: 32px;
  line-height: 36px;
}

h3 {
  margin-top: 20px;
  font-size: 24px;
  line-height: 30px;
}


ul {
  margin-top: 0;
  margin-bottom: 10px;
  padding-left: 40px;
}

.w-list-unstyled {
  padding-left: 0;
  list-style: none;
}

.w-embed:before, .w-embed:after {
  content: " ";
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-embed:after {
  clear: both;
}

.w-container {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
}

.w-container:before, .w-container:after {
  content: " ";
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-container:after {
  clear: both;
}

@media screen and (max-width: 991px) {
  .w-container {
    max-width: 728px;
  }
}

@media screen and (max-width: 479px) {
  .w-container {
    max-width: none;
  }  
}

.w-dropdown {
  text-align: left;
  z-index: 900;
  margin-left: auto;
  margin-right: auto;
  display: inline-block;
  position: relative;
}

.w-dropdown-toggle, .w-dropdown-link {
  vertical-align: top;
  color: #222;
  text-align: left;
  white-space: nowrap;
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  text-decoration: none;
  position: relative;
}

.w-dropdown-toggle {
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  padding-right: 40px;
  display: inline-block;
}

.w-dropdown-toggle:focus {
  outline: 0;
}

.w-icon-dropdown-toggle {
  width: 1em;
  height: 1em;
  margin: auto 20px auto auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
}

.w-dropdown-list {
  background: #ddd;
  min-width: 100%;
  display: none;
  position: absolute;
}

.w-dropdown-link {
  color: #222;
  padding: 10px 20px;
  display: block;
}

.w-dropdown-link.w--current {
  color: #0082f3;
}

.w-dropdown-link:focus {
  outline: 0;
}

@media screen and (max-width: 767px) {
  .w-nav-brand {
    padding-left: 10px;
  }
}

.w-nav {
  z-index: 1000;
  background: #ddd;
  position: relative;
}

.w-nav:before, .w-nav:after {
  content: " ";
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-nav:after {
  clear: both;
}

.w-nav-brand {
  float: left;
  color: #333;
  text-decoration: none;
  position: relative;
}

.w-nav-menu {
  float: right;
  position: relative;
}

@media screen and (max-width: 767px) {

  .w-nav-brand {
    padding-left: 10px;
  }
}

:root {
  --primary: #e2d9c7;
  --body-font: Clashdisplay, Arial, sans-serif;
  --secondary: #080808;
  --black: black;
  --white: white;
  --transparent: transparent;
}

.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}


body {
  background-color: var(--primary);
  font-family: var(--body-font);
  color: var(--secondary);
  letter-spacing: .2px;
  background-image: url("https://cdn.prod.website-files.com/677f56fb31afe3feff7d22b5/677f59d36a775b86865fc295_Noise%20bg.png");
  background-position: 50%;
  background-repeat: repeat;
  background-size: auto;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
}

h1 {
  color: var(--secondary);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 48px;
  font-weight: 600;
  line-height: 1.3;
}

h2 {
  color: var(--secondary);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 38px;
  font-weight: 600;
  line-height: 1.4;
}

h3 {
  color: var(--secondary);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.3;
}


ul {
  margin-top: 0;
  margin-bottom: 10px;
  padding-left: 40px;
}

img {
  filter: saturate(0%);
  max-width: 100%;
  display: inline-block;
}

.section-y-axis-gap {
  padding-top: 100px;
  padding-bottom: 100px;
}

.section-bottom-gap {
  padding-bottom: 100px;
}

.main-container {
  max-width: 1080px;
  padding-left: 15px;
  padding-right: 15px;
}

.main-container.relative {
  height: 100%;
  position: relative;
}

.primary-button-block {
  border: 1px solid var(--secondary);
  background-color: var(--primary);
  color: var(--secondary);
  text-align: center;
  justify-content: center;
  align-items: center;
  padding: 20px 40px;
  text-decoration: none;
  transition: background-color .5s, color .5s;
  display: flex;
  overflow: hidden;
}

.primary-button-block:hover {
  background-color: var(--secondary);
  color: var(--white);
}

.button-text {
  letter-spacing: .2px;
  text-transform: uppercase;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
}

.secondary-button-block {
  border: 1px solid var(--secondary);
  background-color: var(--secondary);
  color: var(--white);
  justify-content: center;
  align-items: center;
  padding: 20px 40px;
  text-decoration: none;
  transition: background-color .5s, color .5s;
  display: flex;
  overflow: hidden;
}

.secondary-button-block:hover {
  background-color: var(--primary);
  color: var(--secondary);
}

.secondary-button-block.bg-transparent {
  border-color: var(--primary);
  background-color: var(--transparent);
  color: var(--primary);
}

.secondary-button-block.bg-transparent:hover {
  background-color: var(--primary);
  color: var(--secondary);
}

.nav-button-wrapper {
  z-index: 9999;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.navbar-wrapper {
  justify-content: space-between;
  align-items: center;
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 20px;
  padding-left: 25px;
  padding-right: 25px;
  display: flex;
}

.brand-logo {
  flex: none;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.hamburger-menu-link {
  color: #fff;
  font-size: 44px;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
  transition: color .6s;
}

.hamburger-menu-link:hover {
  color: var(--primary);
}

.menu-overlay-single-columm {
  border: 1px solid var(--secondary);
  background-color: var(--secondary);
  transform-origin: 50% 0;
  width: 100%;
  height: 100%;
}

.menu-overlay-single-columm._1 {
  transform-origin: 100% 0;
}

.hamburger-menu-block {
  z-index: 10;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0%;
}

.navbar-brand.desktop {
  margin-left: -105px;
}



.nav-menu-link:focus-visible {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 4px;
  outline: 2px solid #0050bd;
}

.hamburger-dropdown-icon {
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 0;
  font-size: 30px;
  position: relative;
}

.nav-dropdown-wrap {
  flex-flow: column;
  align-items: flex-start;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.menu-overlay-grid {
  z-index: 5;
  perspective: 60px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  height: 100%;
  position: relative;
}

.nav-heading {
  color: var(--primary);
  margin-bottom: 10px;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
}



.nav-menu-link {
  position: relative;
  color: var(--secondary);
  letter-spacing: 0.22px;
  text-transform: uppercase;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
  transition: color 0.5s;
  z-index: 1;
}

.nav-menu-bottom-border.v2 {
  position: absolute;
  left: 0;
  top: 50%; /* Align with vertical center of text */
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
  height: 1px;
  width: 100%;
  background-color: var(--secondary);
  pointer-events: none;
}

/* Hover animation */
.nav-menu-wrap:hover .nav-menu-bottom-border.v2 {
  transform: scaleX(1);
}



.nav-menu-bottom-border.v3 {
  background-color: var(--primary);
}

.nav-menu-wrap {
  border-radius: 4px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  margin-left: 0;
  display: flex;
  position: relative;
}

.nav-menu-list {
  grid-column-gap: 100px;
  grid-row-gap: 100px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  display: flex;
}

.nav-dropdown-link {
  color: #fff;
  padding: 5px 0;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
  transition: color .5s;
}

.nav-dropdown-link:hover {
  color: var(--primary);
}

.nav-dropdown-link:focus-visible {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 5px;
  outline: 2px solid #0050bd;
}

.nav-dropdown-link.w--current {
  color: var(--primary);
}

.nav-dropdown-flex {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border: 1px solid var(--primary);
  background-color: var(--secondary);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-around;
  min-width: 550px;
  margin: 1px;
  padding: 20px;
  display: flex;
}

.nav-menu-wrapper {
  border-bottom: 1px solid var(--secondary);
  justify-content: center;
  align-items: center;
  width: 100%;
  padding-top: 16px;
  padding-bottom: 16px;
  display: flex;
}

.navbar-menu-container {
  background-color: #0000;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
  overflow: hidden;
}

.dropdown-border-line {
  border: 1px solid var(--primary);
  opacity: 0;
  width: 10px;
  height: 10px;
  position: absolute;
}

.hamburger-menu-text {
  font-size: 44px;
  font-weight: 400;
  line-height: 1.2;
  text-decoration: none;
}

.header {
  z-index: 9999;
  position: absolute;
  top: 25px;
  left: 0;
  right: 0;
  overflow: hidden;
}

.nav-dropdown-flex-v2 {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  border: 1px solid var(--primary);
  flex-flow: column;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-around;
  align-items: flex-start;
  min-width: 200px;
  padding: 20px;
  display: flex;
}

.menu-block {
  z-index: 999;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: none;
  position: fixed;
  inset: 0%;
  overflow: hidden;
}

.nav-menu-item {
  position: relative;
}

.dropdown-list {
  background-color: var(--transparent);
  display: block;
  position: relative;
  overflow: hidden;
}

.hamburger-text {
  z-index: 2;
  color: var(--secondary);
  letter-spacing: .2px;
  cursor: pointer;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.4;
  position: relative;
}

.hamburger-menu-text-wrap {
  z-index: 2;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
}

.nav-dropdown-link-block {
  align-items: center;
  display: flex;
  position: relative;
}

.hamburger-dropdown-toggle {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  color: #fff;
  justify-content: flex-start;
  align-items: center;
  padding: 0;
  transition: color .6s;
  display: flex;
}

.hamburger-dropdown-toggle:hover {
  color: var(--primary);
}

.hamburger-dropdown-block {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  flex-flow: column;
  display: inline-flex;
}

.hamburger-menu-list {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 0;
  padding-left: 0;
  list-style-type: none;
  display: flex;
  overflow: hidden;
}

.hamburger-menu-list-item {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.hamburger-menu-list-item._3 {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.hamburger-menu-list-item._2 {
  position: relative;
}

.nav-location-text {
  text-align: center;
  max-width: 122px;
}

.nav-location {
  color: var(--secondary);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: underline;
}

.nav-top-content-block {
  border-bottom: 1px solid var(--secondary);
  justify-content: center;
  align-items: center;
}

.left-right-border {
  border-right: 1px solid var(--secondary);
  border-left: 1px solid var(--secondary);
  padding-left: 25px;
  padding-right: 25px;
}

.section-heading-block.align-center {
  text-align: center;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.section-title-block.max-width-754px {
  max-width: 500px;
}

.section-title-block.max-width-840px {
  max-width: 650px;
}

.section-title-block.max-width-770px {
  max-width: 600px;
}

.page-intro-title {
  text-transform: uppercase;
}

.footer {
  border-top: 1px solid var(--secondary);
  padding-top: 100px;
  overflow: hidden;
}

.footer-wrapper {
  overflow: hidden;
}

.footer-upper-content-block {
  justify-content: space-between;
  align-items: flex-end;
  max-width: 1920px;
  min-height: 108px;
  max-height: 108px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
  position: relative;
}

.footer-info-link {
  z-index: 999;
  border-bottom: 1px solid var(--transparent);
  color: var(--secondary);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
  transition: border-color .4s;
  position: relative;
}

.footer-info-link:hover {
  border-bottom-color: var(--secondary);
}

.footer-logo {
  position: relative;
}

.footer-social-block {
  z-index: 999;
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  align-items: center;
  display: flex;
  position: relative;
}

.footer-social-link {
  border-bottom: 1px solid var(--transparent);
  color: var(--secondary);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
  transition: border-color .4s;
}

.footer-social-link:hover {
  border-bottom-color: var(--secondary);
}

.footer-middle-content-block {
  border-top: 1px solid var(--secondary);
  border-bottom: 1px solid var(--secondary);
  margin-top: 20px;
  padding: 16px 20px;
}

.footer-middle-content-flex {
  justify-content: center;
  align-items: center;
  margin-left: 45px;
  display: flex;
}

.footer-lower-content-block {
  justify-content: space-between;
  align-items: center;
  max-width: 1920px;
  padding: 25px 20px;
  display: flex;
}

.copyright-link {
  border-bottom: 1px solid var(--transparent);
  color: var(--secondary);
  text-decoration: none;
  transition: border-color .4s;
}

.copyright-link:hover {
  border-bottom-color: var(--secondary);
}

.footer-menu-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.footer-link {
  border-bottom: 1px solid var(--transparent);
  color: var(--secondary);
  text-decoration: none;
  transition: border-color .4s;
}

.footer-link:hover {
  border-bottom-color: var(--secondary);
}

.footer-menu-circle {
  background-color: var(--secondary);
  border-radius: 100%;
  width: 12px;
  height: 12px;
}

.hero-wrapper {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  border-right: 1px solid var(--secondary);
  border-bottom: 1px solid var(--secondary);
  border-left: 1px solid var(--secondary);
  grid-template-rows: auto;
  grid-template-columns: 7fr 5fr;
  grid-auto-columns: 1fr;
  align-items: center;
  padding-top: 320px;
  display: grid;
}

.hero-wrapper.left-right-border {
  grid-auto-columns: 1fr;
}

.hero-hero-image-block {
  overflow: hidden;
}

.section-description-block.margin-top-32px {
  margin-top: 24px;
}

.section-description.text-white {
  background-color: var(--white);
  color: var(--white);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}

.section-description-bold-text {
  font-size: 30px;
  font-weight: 500;
}

.hero-button-block {
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 30px;
  display: flex;
}

.about-us-section {
  overflow: clip;
}

.about-us-wrapper {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  border-right: 1px solid var(--secondary);
  border-bottom: 1px solid var(--secondary);
  border-left: 1px solid var(--secondary);
  grid-template-rows: auto;
  grid-template-columns: 5fr 7fr;
  grid-auto-columns: 1fr;
  align-items: center;
  display: grid;
  position: relative;
}

.about-us-left-column, .about-us-right-column {
  z-index: 100;
  position: relative;
}

.about-us-left-image-block {
  position: relative;
  overflow: hidden;
}

.about-us-left-button-block {
  justify-content: flex-end;
  align-items: center;
  margin-top: 25px;
  display: flex;
}

.section-title {
  text-transform: uppercase;
}

.section-title.text-white {
  background-color: var(--white);
  color: var(--white);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}

.about-us-right-image-block {
  margin-top: 30px;
  overflow: hidden;
}

.section-subtitle-block-left {
  z-index: 5;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0% auto 0% -14%;
}
 .section-subtitle-block-left {
      position: absolute;
      left: -8.5%;
      top: 50%;
      transform: translateY(-95%);
      z-index: 5;
      display: flex;
      align-items: center;
    }
.section-subtitle-block-left.portfolio {
    top: 30%;
    transform: translateY(-120%);
}
.section-subtitle-block-left.blog {
    top: 30%;
    transform: translateY(-120%);
}
.section-subtitle-block-right.testimonial {
    top: 30%;
    transform: translateY(-120%);
}
.section-subtitle-block-left.services {
    top: 30%;
    transform: translateY(-120%);
}
   
    .section-subtitle-text {
      background-color: var(--primary);
      color: var(--transparent);
      -webkit-text-stroke-width: 1.5px;
      -webkit-text-stroke-color: var(--secondary);
      text-transform: uppercase;
      background-image: url("https://cdn.prod.website-files.com/677f56fb31afe3feff7d22b5/677f59d36a775b86865fc295_Noise%20bg.png");
      background-position: 50%;
      background-size: auto;
      font-size: 32px;
      line-height: 1.3;
      will-change: transform;
      transition: transform 0.2s linear;
    }


.section-subtitle-text._270degree {
  transform: rotate(270deg);
  transition: transform 0.2s linear;
  will-change: transform;
}

.service-section {
  overflow: clip;
}

.service-wrapper {
  border-right: 1px solid var(--secondary);
  border-left: 1px solid var(--secondary);
  position: relative;
}

.service-top-content-block {
  z-index: 100;
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  grid-template-rows: auto;
  grid-template-columns: 7fr 5fr;
  grid-auto-columns: 1fr;
  align-items: center;
  display: grid;
  position: relative;
}

.service-top-right-content-block {
  overflow: hidden;
}

.service-video-and-content-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  margin-top: 20px;
  display: grid;
}

.service-video-block {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.service-video-image-block {
  position: relative;
  overflow: hidden;
}
.video-icon {
  justify-content: center;
  align-items: center;
  width: 32px;
  display: flex;
}

.video-lightbox-wrap {
  z-index: 100;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.video-lightbox-block {
  z-index: 10;
  border-radius: 100%;
  width: 43px;
  height: 43px;
  position: relative;
}

.video-lightbox {
  z-index: 100;
  border: 1px solid var(--transparent);
  background-color: var(--white);
  color: var(--secondary);
  border-radius: 100%;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: background-color .4s, border-color .4s;
  display: inline-flex;
  position: relative;
}

.video-lightbox:hover {
  border: 1px solid var(--secondary);
  background-color: var(--transparent);
  color: #0a0119;
}


@keyframes pulseRing {
  0% {
    transform: scale(0.9);
    opacity: 0.9;
  }
  50% {
    transform: scale(1.5);
    opacity: 0.6;
  }
  100% {
    transform: scale(2);
    opacity: 0;
  }
}

.video-light-one,
.video-light-two {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  transform: scale(0.9);
  opacity: 0;
  z-index: 1;
  animation: pulseRing 2.5s ease-out infinite;
}

/* First ring */
.video-light-one {
  background-color: rgba(255, 255, 255, 0.4);
  animation-delay: 0s;
}

/* Second ring */
.video-light-two {
  background-color: rgba(255, 255, 255, 0.7);
  animation-delay: 1.25s; /* offset by half of duration */
}


.service-video-image {
  width: 100%;
}

.service-video-block-summary {
  font-size: 18px;
}



.service-down-arrow-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  margin-top: 40px;
}

.service-down-arrow-image {
  opacity: 0;
  transform: translateY(0px);
  animation: arrowWave 5s ease-in-out infinite;
  margin-bottom: -10px;
}

/* Delays from bottom to top */
.service-down-arrow-image._1 {
  animation-delay: 2s;
}
.service-down-arrow-image._2 {
  animation-delay: 1.5s;
}
.service-down-arrow-image._3 {
  animation-delay: 1s;
}
.service-down-arrow-image._4 {
  animation-delay: 0.5s;
}
.service-down-arrow-image._5 {
  animation-delay: 0s;
}

@keyframes arrowWave {
  0%, 15% {
    opacity: 0;
    transform: translateY(-6px);
  }
  35%, 55% {
    opacity: 1;
    transform: translateY(0);
  }
  75%, 100% {
    opacity: 0;
    transform: translateY(6px);
  }
}


.service-bottom-content-block {
  z-index: 100;
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  margin-top: 60px;
  display: flex;
  position: relative;
}

.service-cms-list-wrap {
  position: sticky;
  top: 5%;
}

.service-cms-list-block {
  grid-column-gap: 40px;
  grid-row-gap: 40px;
  flex-flow: column;
  display: flex;
}

.service-cms-single-item {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  grid-template-rows: auto;
  grid-template-columns: 7fr 5fr;
  grid-auto-columns: 1fr;
  align-items: center;
  display: grid;
}

.service-content-block {
  background-color: var(--primary);
  background-image: url("https://cdn.prod.website-files.com/677f56fb31afe3feff7d22b5/677f59d36a775b86865fc295_Noise%20bg.png");
  background-position: 50%;
  background-size: auto;
}

.service-image-block {
  overflow: hidden;
}
.service-image-block {
  height: 500px; /* Set the desired fixed height */
  overflow: hidden;
}

.service-image {
  height: 100%;
  width: 100%;
  object-fit: cover; /* Ensures the image fills the container without distortion */
  display: block;
}

.service-serial-number {
  color: var(--transparent);
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: var(--secondary);
}

.service-title-link {
  text-decoration: none;
}

.service-title {
  border-bottom: 1px solid var(--transparent);
  line-height: 1.4;
  transition: border-color .4s;
}

.service-title:hover {
  border-bottom: 1px solid var(--secondary);
}

.service-summary-block {
  margin-top: 20px;
}

.service-button-wrap {
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 30px;
  display: flex;
}

.service-serial-number-block {
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.section-subtitle-block-right {
  z-index: 5;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0% -12% 0% auto;
}


.section-subtitle-text._270deg {
  transform: rotate(90deg); /* flips the letters to face left */
  transition: transform 0.2s linear;
  will-change: transform;
  white-space: nowrap;
}


.cta-section {
  z-index: 1;
  background-image: url("img/signal-2025-06-27-142223_024.jpeg");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover; /* optional: better for full section */
  background-attachment: fixed;
  position: relative;
  overflow: hidden;
  filter: grayscale(100%);
}


.cta-wrapper {
  z-index: 10;
  text-align: center;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  max-width: 650px;
  margin-left: auto;
  margin-right: auto;
  padding: 150px 20px;
  display: flex;
  position: relative;
}

.cta-overlay {
  z-index: 5;
  background-color: #000000b3;
  position: absolute;
  inset: 0%;
}

.cta-button-wrap {
  margin-top: 30px;
}

.cta-upper-shape {
  z-index: 99;
  position: absolute;
  inset: -5px 0% auto auto;
}

.cta-shape {
  width: 80px;
}

.cta-bottom-shape {
  z-index: 999;
  position: absolute;
  inset: auto auto 0 0%;
}

.portfolio-section {
  overflow: clip;
}

.portfolio-wrapper {
  border-bottom: 1px solid var(--secondary);
  position: relative;
}


.portfolio-content-block {
  z-index: 100;
  margin-top: 60px;
  position: relative;
}

.portfolio-cms-list-block {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  display: flex;
}

.portfolio-single-card {
  border: 1px solid var(--secondary);
  justify-content: space-between;
  align-items: center;
  padding: 16px 25px;
  display: flex;
  position: relative;
  transition: color 0.9s ease;
  cursor: pointer;
  /* Don't clip child image overflow */
  overflow: visible;
  background-color: transparent;
}

/* .portfolio-single-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #000;
  z-index: 0;
  transform: translateY(100%); 
  transition: transform 0.9s ease-in-out;
}

.portfolio-single-card:hover::before {
  transform: translateY(0); 
} */

/* 
  .portfolio-single-card > * {
  position: relative;
  z-index: 1;
  transition: color 0.9s ease;
}
        /* .portfolio-single-card:hover > * {
            color: white;
        } */ 

.portfolio-single-card:hover {
  background-color: black;
}
.portfolio-card-left-column, .portfolio-card-right-column {
  z-index: 10;
  position: relative;
}

.portfolio-star-image {
  justify-content: center;
  align-items: center;
  display: flex;
}

.portfolio-title-link {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  color: var(--secondary);
  align-items: center;
  text-decoration: none;
  display: flex;
}

.portfolio-title {
  color: var(--secondary);
}

.portfolio-arrow {
  color: var(--secondary);
  justify-content: center;
  align-items: center;
  display: flex;
}



.portfolio-overlay {
  z-index: 5;
  background-color: var(--secondary);
  transform-origin: 50% 100%;
  transform-style: preserve-3d;
  position: absolute;
  inset: 0%;
  transform: scale3d(1, 0, 1);
}

.portfolio-image-link {
  z-index: 100;
  position: relative;
}

.portfolio-button-wrap {
  justify-content: flex-end;
  align-items: flex-start;
  margin-top: 30px;
  display: flex;
}

.testimonial-section {
  overflow: hidden;
}

.testimonial-wrapper {
  border-bottom: 1px solid var(--secondary);
  position: relative;
}

.testimonial-content-block {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex: none;
  justify-content: flex-start;
  align-items: stretch;
  padding-bottom: 12px;
  display: flex;  animation: scroll-left 15s linear infinite;
}

.testimonial-single-card-block {
  z-index: 10;
  border: 1px solid var(--black);
  background-color: var(--primary);
  flex-flow: column;
  flex: none;
  justify-content: space-between;
  min-width: 420px;
  max-width: 430px;
  height: 100%;
  padding: 20px;
  transition: box-shadow .4s;
  display: flex;
  position: relative;
}

.testimonial-single-card-block:hover {
  box-shadow: 12px 12px 0 0 var(--secondary);
}

.testimonial-summary {
  z-index: 10;
  position: relative;
}

.testimonial-summary-bold-text {
  font-size: 35px;
  font-weight: 500;
}

.testimonial-author-block {
  z-index: 10;
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  justify-content: space-between;
  align-items: center;
  margin-top: 40px;
  display: flex;
  position: relative;
}

.testimonial-image-block {
  position: relative;
}

.testimonial-author-image {
  z-index: 10;
  position: relative;
}

.testimonial-author-name {
  text-transform: uppercase;
}

.testimonial-image-shape {
  border: 1px solid var(--secondary);
  position: absolute;
  inset: -4px 4px 4px -4px;
}

.testimonial-box {
  border: 1px solid var(--secondary);
  position: absolute;
  inset: 13px -12px -12px 13px;
}

.testimonial-content-wrap {

  grid-column-gap: 30px;
  grid-row-gap: 30px;
  margin-top: 60px;
  display: flex;
  position: relative;
  overflow: hidden;

  z-index: 100;
}
@keyframes scroll-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}
.blog-section {
  overflow: hidden;
}

.blog-wrapper {
  position: relative;
}

.blog-content-block {
  z-index: 999;
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  margin-top: 60px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.blog-cms-list-block {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  flex-flow: column;
  display: flex;
}

.blog-single-item-block {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 5fr 7fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.blog-image-block {
  max-width: 360px;
  position: absolute;
  inset: 0% 0% auto;
  overflow: hidden;
}
.blog-image-block {
    transition: transform 0.4s ease, z-index 0s; /* Smooth transform, no delay on z-index */
}
.blog-content-card-block {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  border: 1px solid var(--secondary);
  background-color: var(--primary);
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  display: flex;
}

.blog-card-left-column {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 400px;
  display: flex;
}

.blog-card-right-column {
    /* display: flex
; */
    /* align-items: center; */
    /* justify-content: space-between; */
    /* width: 60px; */
    /* height: 60px; */
    /* border: 1px solid var(--secondary); */
    /* color: var(--secondary); */
    /* text-decoration: none; */
    position: relative;
    overflow: hidden;
    border: 1px solid var(--secondary);
    color: var(--secondary);
    justify-content: space-between;
    align-items: center;
    width: 60px;
    height: 60px;
    display: flex
;
    overflow: hidden;
}

.blog-meta-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.blog-meta-calender {
  justify-content: center;
  align-items: center;
  display: flex;
}

.blog-meta-text {
  font-size: 18px;
}

.blog-title-link {
  text-decoration: none;
}

.blog-title {
  text-transform: uppercase;
  padding-left: 0;
  transition: transform .5s;
}

.blog-title:hover {
  transform: translate(8px);
}

.blog-arrow {
    justify-content: center;
    align-items: center;
    display: flex
;
}
        .blog-arrow-block {
            position: relative;
            z-index: 10;

        }

        .blog-arrow-dot {
            width: 8px;
            height: 8px;
            background-color: var(--secondary);
            border-radius: 50%;
            position: relative;
            z-index: 10;
            transition: all 0.4s ease;
        }

        .blog-arrow-circle {
            position: absolute;
            top: 50%;
            right: 12px;
            width: 8px;
            height: 8px;
            background-color: var(--secondary);
            border-radius: 50%;
            transform: translateY(-50%);
            transition: all 0.4s ease;
            z-index: 1;
        }

        .blog-single-item-block:hover .blog-image-block {
            transform: translateY(-20px);
            z-index: 10;
        }

        .blog-single-item-block:hover .blog-card-right-column {
            color: var(--primary);
        }

      .blog-single-item-block:hover .blog-arrow-circle {
    width: 90px;
    height: 90px;
    right: -10px;
    transform: translateY(-50%);
}

        .blog-single-item-block:hover .blog-arrow-block {
    color: var(--primary);
    transform: translateX(15px);
}

        .blog-single-item-block:hover .blog-arrow-dot {
            opacity: 0;
        }

.testimonial-single-card-wrap {
  position: relative;
}

.blog-button-wrap {
  justify-content: flex-end;
  align-items: center;
  margin-top: 40px;
  display: flex;
}

.hamburger-text-absolute {
  z-index: 2;
  opacity: 0;
  color: var(--white);
  letter-spacing: .2px;
  cursor: pointer;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.4;
  position: absolute;
}

.menu-shape-block-one {
  z-index: 300;
  background-color: var(--primary);
  transform-origin: 50% 100%;
  width: 1px;
  height: 100%;
  position: absolute;
  inset: 0% auto 0% 10px;
}

.menu-shape-block-two {
  z-index: 300;
  background-color: var(--primary);
  transform-origin: 50% 0;
  width: 1px;
  height: 100%;
  position: absolute;
  inset: 0% 10px 0% auto;
}

.menu-shape-block-three {
  z-index: 300;
  background-color: var(--primary);
  transform-origin: 100%;
  width: 100%;
  height: 1px;
  position: absolute;
  inset: 10px 0% auto;
}

.menu-shape-block-four {
  z-index: 300;
  background-color: var(--primary);
  transform-origin: 0%;
  width: 100%;
  height: 1px;
  position: absolute;
  inset: auto 0% 10px;
}

.footer-logo-wrap {
  z-index: 100;
  justify-content: center;
  align-items: center;
  min-height: 108px;
  max-height: 108px;
  display: flex;
  position: absolute;
  inset: auto 0% 0%;
}

.nav-top-link {
  margin-left: 0;
  text-decoration: none;
  transition: margin .4s;
}

.nav-top-link:hover {
  margin-left: 5px;
}

@media screen and (min-width: 1280px) {
  h1 {
    font-size: 54px;
  }

  h2 {
    font-size: 42px;
  }

  h3 {
    font-size: 26px;
  }

  .section-y-axis-gap {
    padding-top: 120px;
    padding-bottom: 120px;
  }

  .section-bottom-gap {
    padding-bottom: 120px;
  }

  .main-container {
    max-width: 1170px;
    padding-left: 0;
    padding-right: 0;
  }

  .navbar-wrapper {
    max-width: 1170px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .navbar-brand.desktop {
    margin-left: -100px;
  }

  .nav-dropdown-flex, .nav-dropdown-flex-v2 {
    padding-left: 25px;
    padding-right: 25px;
  }

  .left-right-border {
    padding-left: 30px;
    padding-right: 30px;
  }

  .section-title-block.max-width-754px {
    max-width: 600px;
  }

  .section-title-block.max-width-840px {
    max-width: 700px;
  }

  .section-title-block.max-width-770px {
    max-width: 650px;
  }

  .footer {
    padding-top: 120px;
  }

  .hero-wrapper {
    padding-top: 300px;
  }

  .hero-button-block {
    margin-top: 40px;
  }

  .about-us-wrapper {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .section-subtitle-block-left {
    left: -14%;
  }

  .section-subtitle-block-left.blog {
    left: -6.5%;
  }

  .section-subtitle-block-left.about-us {
    left: -11.8%;
  }

  .section-subtitle-block-left.portfolio {
    left: -12%;
  }

  .section-subtitle-text {
    font-size: 45px;
  }

  .service-video-block-summary {
    font-size: 20px;
  }

  .service-cms-single-item {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .section-subtitle-block-right.services {
    right: -10.5%;
  }

  .section-subtitle-block-right.testimonial {
    right: -14.5%;
  }

  .cta-wrapper {
    max-width: 700px;
  }

  .cta-upper-shape {
    right: -5%;
  }

  .cta-shape {
    width: auto;
  }

  .cta-bottom-shape {
    left: -5%;
  }

  .blog-image-block {
    max-width: 415px;
  }

  .blog-card-left-column {
    max-width: 450px;
  }
}

@media screen and (min-width: 1440px) {
  h1 {
    font-size: 64px;
  }

  h2 {
    font-size: 48px;
  }

  h3 {
    font-size: 30px;
  }

  .section-y-axis-gap {
    padding-top: 140px;
    padding-bottom: 140px;
  }

  .section-bottom-gap {
    padding-bottom: 140px;
  }

  .main-container {
    max-width: 1360px;
  }

  .primary-button-block {
    padding: 27px 52px;
  }

  .secondary-button-block {
    padding: 27px 52px;
  }

  .nav-button-wrapper {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
  }

  .navbar-wrapper {
    max-width: 1360px;
    padding-bottom: 30px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .hamburger-menu-link {
    font-size: 52px;
  }

  .navbar-brand.desktop {
    margin-left: -95px;
  }

  .nav-menu-list {
    grid-column-gap: 150px;
    grid-row-gap: 150px;
    align-items: center;
  }

  .nav-dropdown-flex {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    padding-left: 30px;
    padding-right: 30px;
  }

  .nav-menu-wrapper {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .hamburger-menu-text {
    font-size: 52px;
  }

  .header {
    top: 30px;
  }

  .nav-dropdown-flex-v2 {
    padding-left: 30px;
    padding-right: 30px;
  }

  .hamburger-text {
    font-size: 24px;
  }

  .hamburger-menu-list {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .nav-location {
    font-size: 24px;
  }

  .left-right-border {
    padding-left: 40px;
    padding-right: 40px;
  }

  .section-title-block.max-width-754px {
    max-width: 700px;
  }

  .section-title-block.max-width-840px {
    max-width: 800px;
  }

  .section-title-block.max-width-770px {
    max-width: 700px;
  }

  .footer {
    padding-top: 130px;
  }

  .footer-upper-content-block {
    padding-left: 32px;
    padding-right: 32px;
  }

  .footer-social-block {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }

  .footer-middle-content-block {
    margin-top: 25px;
    padding: 20px 32px;
  }

  .footer-lower-content-block {
    padding: 30px 32px;
  }

  .footer-menu-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .hero-wrapper {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
    padding-top: 380px;
  }

  .section-description-block.margin-top-32px {
    margin-top: 32px;
  }

  .section-description-bold-text {
    font-size: 34px;
  }

  .hero-button-block {
    margin-top: 52px;
  }

  .about-us-wrapper {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }

  .about-us-left-button-block {
    margin-top: 32px;
  }

  .about-us-right-image-block {
    margin-top: 52px;
  }

  .section-subtitle-block-left {
    left: -14%;
  }

  .section-subtitle-block-left.blog {
    left: -5.7%;
  }

  .section-subtitle-block-left.about-us {
    left: -10%;
  }

  .section-subtitle-block-left.portfolio {
    left: -10.5%;
  }

  .service-top-content-block {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }

  .service-video-and-content-block {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    margin-top: 24px;
  }

  .service-video-block {
    position: relative;
  }

  .video-icon {
    width: 33px;
  }

  .service-down-arrow-block {
    margin-top: 52px;
  }

  .service-bottom-content-block, .service-cms-list-block, .service-cms-single-item {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
  }

  .service-summary-block {
    margin-top: 24px;
  }

  .service-button-wrap {
    margin-top: 52px;
  }

  .section-subtitle-block-right.services {
    right: -9%;
  }

  .section-subtitle-block-right.testimonial {
    right: -12.5%;
  }

  .cta-wrapper {
    max-width: 840px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 250px;
    padding-bottom: 250px;
  }

  .cta-button-wrap {
    margin-top: 52px;
  }

  .cta-upper-shape {
    top: 0;
    right: -4%;
  }

  .cta-bottom-shape {
    left: -4%;
  }

  .portfolio-content-block {
    margin-top: 70px;
  }

  .portfolio-cms-list-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .portfolio-single-card {
    padding: 20px 32px;
  }

  .portfolio-image-block {
    z-index: 10;
    right: 320px;
  }

  .portfolio-overlay {
    z-index: 5;
    background-color: var(--secondary);
    position: absolute;
    inset: 0%;
  }

  .portfolio-button-wrap {
    margin-top: 52px;
  }

  .testimonial-content-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .testimonial-single-card-block {
    min-width: 480px;
    max-width: 480px;
    padding: 26px;
  }

  .testimonial-summary-bold-text {
    font-size: 40px;
  }

  .testimonial-author-block {
    justify-content: space-between;
    margin-top: 60px;
  }

  .testimonial-author-name {
    text-transform: uppercase;
  }

  .testimonial-content-wrap, .blog-content-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    margin-top: 70px;
  }

  .blog-cms-list-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .blog-image-block {
    max-width: 480px;
  }

  .blog-content-card-block {
    padding: 32px;
  }

  .blog-card-left-column {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    max-width: 550px;
  }

  .blog-button-wrap {
    margin-top: 52px;
  }

  .hamburger-text-absolute {
    font-size: 24px;
  }

  .menu-shape-block-one {
    left: 30px;
  }

  .menu-shape-block-two {
    right: 30px;
  }

  .menu-shape-block-three {
    top: 30px;
  }

  .menu-shape-block-four {
    bottom: 30px;
  }
}

@media screen and (min-width: 1920px) {
  h1 {
    font-size: 70px;
  }

  h2 {
    font-size: 52px;
  }

  h3 {
    font-size: 32px;
  }

  .main-container {
    max-width: 1560px;
  }

  .nav-button-wrapper {
    padding-left: 24px;
    padding-right: 24px;
  }

  .navbar-wrapper {
    max-width: 1920px;
    padding-bottom: 40px;
  }

  .navbar-brand.desktop {
    margin-left: -50px;
  }

  .nav-menu-list {
    grid-column-gap: 200px;
    grid-row-gap: 200px;
  }

  .navbar-menu-container {
    padding-left: 0;
    padding-right: 0;
    position: relative;
  }

  .header {
    top: 40px;
  }

  .hamburger-menu-text-wrap, .nav-location-text {
    background-color: var(--transparent);
  }

  .left-right-border {
    padding-left: 60px;
    padding-right: 60px;
  }

  .section-title-block.max-width-754px {
    max-width: 754px;
  }

  .section-title-block.max-width-840px {
    max-width: 840px;
  }

  .section-title-block.max-width-770px {
    max-width: 770px;
  }

  .footer {
    padding-top: 140px;
  }

  .footer-upper-content-block {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
  }

  .footer-middle-content-block {
    justify-content: center;
    align-items: center;
  }

  .hero-wrapper {
    border-bottom: 1px solid var(--secondary);
    padding-top: 394px;
  }

  .section-description {
    overflow: hidden;
  }

  .section-subtitle-block-left {
    left: -14%;
  }

  .section-subtitle-block-left.align-left {
    left: -14.5%;
  }

  .section-subtitle-block-left.blog.align-left {
    left: -7.8%;
  }

  .section-subtitle-block-left.about-us {
    left: -13.6%;
  }

  .section-subtitle-block-left.portfolio {
    left: -14.5%;
  }

  .section-subtitle-text {
    font-size: 70px;
  }

  .section-subtitle-block-right.services {
    right: -12.3%;
  }

  .section-subtitle-block-right.testimonial {
    right: -17%;
  }

  .cta-section {
    overflow: visible;
  }

  .blog-single-item-block {
    grid-template-columns: 5fr 920px;
  }

  .blog-image-block {
    max-width: 488px;
  }

  .blog-card-left-column {
    max-width: 574px;
  }
}

@media screen and (max-width: 991px) {
  h1 {
    font-size: 38px;
  }

  h2 {
    font-size: 34px;
  }

  .section-y-axis-gap {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .section-bottom-gap {
    padding-bottom: 80px;
  }

  .main-container {
    max-width: 740px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .button-text {
    font-size: 18px;
  }

  .secondary-button-block {
    padding-left: 30px;
    padding-right: 30px;
  }

  .nav-button-wrapper {
    width: 100%;
  }

  .navbar-wrapper {
    max-width: 720px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .navbar-brand.desktop {
    margin-left: -100px;
  }

  .nav-menu-link {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 18px;
  }

  .nav-dropdown-wrap {
    padding-top: 0;
    padding-bottom: 0;
  }

  .nav-heading {
    font-size: 24px;
  }

  .nav-menu-wrap {
    margin-right: 0;
    padding-right: 5px;
  }

  .nav-menu-list {
    z-index: 10;
    display: flex;
  }

  .nav-dropdown-column {
    padding-left: 0;
    padding-right: 0;
  }

  .nav-dropdown-flex {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    padding: 15px 20px;
  }

  .nav-menu-wrapper {
    width: 100%;
    display: flex;
    position: relative;
  }

  .nav-dropdown-flex-v2 {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-right: 10px;
  }

  .left-right-border {
    padding-left: 20px;
    padding-right: 20px;
  }

  .section-title-block.max-width-840px {
    max-width: 550px;
  }

  .footer {
    padding-top: 80px;
  }

  .footer-upper-content-block {
    min-height: auto;
    max-height: none;
    padding-left: 15px;
    padding-right: 15px;
  }

  .footer-logo-link {
    margin-left: 20px;
  }

  .footer-social-block {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }

  .footer-middle-content-block {
    padding-left: 15px;
    padding-right: 15px;
  }

  .footer-middle-content-flex {
    margin-left: 0;
  }

  .footer-lower-content-block {
    grid-column-gap: 40px;
    grid-row-gap: 16px;
    flex-flow: wrap;
    justify-content: center;
    padding: 20px 15px;
  }

  .hero-wrapper {
    grid-template-columns: 7fr;
    padding-top: 280px;
  }

  .section-description-block.margin-top-32px {
    margin-top: 20px;
  }

  .hero-image {
    width: 100%;
  }

  .section-subtitle-block-left, .section-subtitle-block-left.align-left {
    left: -16%;
  }

  .section-subtitle-block-left.blog {
    left: -6.5%;
  }

  .section-subtitle-block-left.about-us {
    left: -12.5%;
  }

  .section-subtitle-block-left.portfolio {
    left: -13.5%;
  }

  .section-subtitle-text {
    font-size: 32px;
  }

  .service-top-content-block {
    grid-template-columns: 7fr;
  }

  .service-video-block-summary {
    font-size: 18px;
  }

  .service-right-image {
    width: 100%;
  }

  .service-down-arrow-block {
    margin-top: 20px;
  }

  .service-bottom-content-block {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    margin-top: 50px;
  }

  .service-cms-list-wrap {
    position: static;
    top: auto;
  }

  .service-cms-list-block {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }

  .service-button-wrap {
    margin-top: 20px;
  }

  .section-subtitle-block-right {
    right: -13.5%;
  }

  .section-subtitle-block-right.services {
    right: -11.5%;
  }

  .section-subtitle-block-right.testimonial {
    right: -16%;
  }

  .cta-wrapper {
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .portfolio-content-block {
    margin-top: 50px;
  }

  .portfolio-image-block {
    max-width: 280px;
  }

  .testimonial-author-block {
    margin-top: 30px;
  }

  .testimonial-content-wrap {
    margin-top: 50px;
  }

  .blog-content-block {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
    margin-top: 50px;
  }

  .blog-cms-list-block {
    grid-column-gap: 25px;
    grid-row-gap: 25px;
  }

  .blog-single-item-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }

  .blog-image-block.active, .blog-image-block.inactive {
    max-width: 334px;
    position: absolute;
  }

  .blog-image-link {
    width: 100%;
  }

  .blog-content-card-block {
    flex-flow: wrap;
  }

  .blog-card-right-column {
    flex: none;
    display: none;
  }

  .footer-logo-wrap {
    position: static;
  }
}

@media screen and (max-width: 767px) {
  h1 {
    font-size: 32px;
  }

  h2 {
    font-size: 30px;
  }

  p {
    font-size: 18px;
  }

  .section-y-axis-gap {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .section-bottom-gap {
    padding-bottom: 60px;
  }

  .main-container {
    max-width: 630px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .primary-button-block {
    padding-left: 30px;
    padding-right: 30px;
  }

  .secondary-button-block {
    padding-left: 30px;
    padding-right: 30px;
  }

  .nav-button-wrapper {
    margin-right: 5px;
  }

  .navbar-wrapper {
    max-width: 640px;
  }

  .hamburger-menu-block {
    padding-left: 15px;
    padding-right: 15px;
  }

  .navbar-brand {
    padding-left: 0;
  }

  .navbar-brand.desktop {
    max-width: 80px;
    margin-left: 0;
  }

  .nav-menu-link {
    display: inline-block;
  }

  .nav-menu-list {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    padding-left: 0;
  }

  .nav-dropdown-flex {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: wrap;
    justify-content: space-between;
    min-width: 400px;
  }

  .nav-location-text {
    display: none;
  }

  .nav-location {
    font-size: 20px;
  }

  .left-right-border {
    padding-left: 15px;
    padding-right: 15px;
  }

  .section-title-block.max-width-754px.margin-top-12px {
    margin-top: 8px;
  }

  .section-title-block.max-width-840px.margin-top-8px {
    margin-top: 5px;
  }

  .footer {
    padding-top: 60px;
  }

  .footer-wrapper {
    padding-left: 0;
    padding-right: 0;
  }

  .footer-upper-content-block {
    grid-column-gap: 40px;
    grid-row-gap: 16px;
    min-height: auto;
    max-height: none;
  }

  .footer-info-link {
    font-size: 18px;
  }

  .footer-social-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
  }

  .footer-social-link {
    font-size: 18px;
  }

  .footer-middle-content-block {
    padding-left: 15px;
    padding-right: 15px;
  }

  .footer-lower-content-block {
    grid-column-gap: 30px;
  }

  .hero-wrapper {
    padding-top: 260px;
  }

  .section-description-block.margin-top-32px {
    margin-top: 16px;
  }

  .hero-button-block {
    margin-top: 25px;
  }

  .about-us-wrapper {
    grid-template-columns: 5fr;
  }

  .about-us-right-image-block {
    margin-top: 20px;
  }

  .section-subtitle-block-left {
    justify-content: center;
    align-items: center;
    position: relative;
    inset: auto;
  }

  .section-subtitle-block-left.align-left {
    justify-content: flex-start;
    align-items: center;
    left: auto;
  }

  .section-subtitle-block-left.blog {
    position: relative;
    left: auto;
  }

  .section-subtitle-block-left.about-us {
    left: auto;
  }

  .section-subtitle-block-left.portfolio {
    justify-content: flex-start;
    align-items: center;
    left: auto;
  }

  .section-subtitle-text {
    -webkit-text-stroke-width: 1px;
    margin-bottom: 5px;
    font-size: 28px;
  }

  .section-subtitle-text._270deg {
    background-color: var(--transparent);
    background-color: var(--transparent);
    transform: none;
  }

  .section-subtitle-text._270degree {
    background-color: var(--transparent);
    transform: none;
  }

  .service-top-content-block.margin-top-20px {
    margin-top: 8px;
  }

  .service-video-and-content-block {
    grid-template-columns: 1fr;
  }

  .service-video-image-block {
    width: 100%;
  }

  .video-lightbox-block {
    width: 80px;
    height: 80px;
  }

  .video-icon {
    width: 25px;
  }

  .service-video-image {
    object-fit: cover;
    width: 100%;
  }

  .service-down-arrow-block {
    display: none;
  }

  .service-bottom-content-block {
    margin-top: 40px;
  }

  .service-cms-list-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .service-cms-single-item {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    grid-template-columns: 7fr;
  }

  .service-content-block {
    background-color: var(--transparent);
  }

  .service-button-wrap {
    margin-top: 16px;
  }

  .section-subtitle-block-right {
    justify-content: center;
    align-items: center;
    position: relative;
    inset: auto;
  }

  .section-subtitle-block-right.services {
    justify-content: flex-start;
    align-items: center;
    right: auto;
  }

  .section-subtitle-block-right.testimonial {
    right: auto;
  }

  .cta-wrapper {
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .cta-button-wrap {
    margin-top: 20px;
  }

  .cta-upper-shape {
    max-width: 60px;
    display: none;
    top: 2px;
    right: -1%;
  }

  .cta-bottom-shape {
    max-width: 60px;
    display: none;
    bottom: 0;
    left: -1%;
  }

  .portfolio-content-block {
    margin-top: 40px;
  }

  .portfolio-single-card {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    padding-left: 20px;
    padding-right: 20px;
  }

  .portfolio-card-right-column {
    display: none;
  }

  .portfolio-title-link {
    border-bottom: 1px solid var(--transparent);
    transition: border-color .4s;
  }

  .portfolio-title-link:hover {
    border-bottom-color: var(--secondary);
  }

  .portfolio-image-block {
    width: 100%;
    max-width: none;
    display: block;
    position: static;
    overflow: hidden;
  }

  .portfolio-image {
    width: 100%;
  }

  .portfolio-overlay {
    display: none;
  }

  .portfolio-image-link {
    width: 100%;
  }

  .portfolio-button-wrap {
    justify-content: center;
    align-items: flex-start;
  }

  .testimonial-single-card-block {
    min-width: 400px;
    max-width: 400px;
  }

  .testimonial-author-block {
    margin-top: 25px;
  }

  .testimonial-content-wrap {
    margin-top: 40px;
  }

  .blog-content-block {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    margin-top: 40px;
  }

  .blog-cms-list-block {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
  }

  .blog-single-item-block {
    grid-template-columns: 1fr;
  }

  .blog-image-block.active, .blog-image-block.inactive {
    max-width: none;
    position: static;
  }

  .blog-thumbnail {
    width: 100%;
  }

  .blank-div {
    display: none;
  }
}

@media screen and (max-width: 479px) {

  .primary-button-block {
    padding-left: 15px;
    padding-right: 15px;
  }

  .button-text {
    font-size: 16px;
  }

  .secondary-button-block {
    padding-left: 15px;
    padding-right: 15px;
  }

  .nav-button-wrapper {
    width: auto;
  }

  .navbar-wrapper {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    justify-content: space-between;
    padding-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .hamburger-menu-link {
    font-size: 35px;
  }

  .navbar-brand.desktop {
    justify-content: center;
    align-items: center;
  }

  .nav-heading {
    margin-bottom: 5px;
  }

  .nav-menu-bottom-border {
    width: 100%;
  }

  .nav-menu-wrap {
    padding-right: 0;
  }

  .nav-menu-list {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
  }

  .nav-dropdown-column {
    padding-left: 0;
    padding-right: 0;
  }

  .nav-dropdown-flex {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    min-width: auto;
    max-height: 200px;
    padding-top: 15px;
    padding-bottom: 15px;
    overflow: auto;
  }

  .nav-menu-wrapper {
    padding-left: 5px;
    padding-right: 5px;
  }

  .hamburger-menu-text {
    font-size: 35px;
  }

  .header {
    top: 20px;
  }

  .nav-dropdown-flex-v2 {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }

  .hamburger-text {
    font-size: 20px;
  }

  .nav-location-text {
    max-width: 95px;
  }

  .nav-location {
    font-size: 18px;
  }

  .page-intro-title {
    font-size: 28px;
  }

  .footer-upper-content-block {
    grid-column-gap: 20px;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
  }

  .footer-logo-link {
    margin-left: 0;
  }

  .footer-lower-content-block {
    grid-row-gap: 10px;
  }

  .copyright-text {
    font-size: 18px;
  }

  .footer-menu-block {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    flex-flow: wrap;
  }

  .footer-link {
    font-size: 18px;
  }

  .footer-menu-circle {
    display: none;
  }

  .hero-wrapper {
    padding-top: 200px;
  }

  .section-description-block.margin-top-32px {
    margin-top: 12px;
  }

  .about-us-left-button-block {
    flex-flow: column;
    justify-content: flex-start;
    align-items: stretch;
  }

  .section-title {
    font-size: 28px;
  }

  .section-subtitle-text {
    font-size: 24px;
  }

  .video-lightbox-block {
    width: 70px;
    height: 70px;
  }

  .video-icon {
    width: 20px;
  }

  .service-video-image {
    height: 300px;
  }

  .service-cms-list-block {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
  }

  .service-button-wrap {
    flex-flow: column;
    align-items: stretch;
    margin-top: 12px;
  }

  .cta-wrapper {
    padding: 60px 10px;
  }

  .cta-upper-shape, .cta-bottom-shape {
    max-width: 60px;
    right: -3%;
  }

  .portfolio-single-card {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .portfolio-star-image {
    width: 25px;
  }

  .portfolio-title-link {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
  }

  .portfolio-title {
    font-size: 20px;
  }

  .portfolio-image {
    object-fit: cover;
    min-height: 250px;
  }

  .portfolio-button-wrap {
    flex-flow: column;
    justify-content: flex-start;
    align-items: stretch;
  }

  .testimonial-single-card-block {
    min-width: 350px;
    max-width: 350px;
  }

  .testimonial-author-block {
    margin-top: 20px;
  }

  .testimonial-author-name {
    font-size: 20px;
  }

  .blog-content-block, .blog-cms-list-block {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }

  .blog-content-card-block {
    padding: 15px 10px;
  }

  .blog-title {
    font-size: 20px;
  }

  .blog-button-wrap {
    flex-flow: column;
    align-items: stretch;
  }

  .hamburger-text-absolute {
    font-size: 20px;
  }

  .footer-logo-wrap {
    min-height: 90px;
    position: static;
    inset: 0%;
  }
}

@font-face {
  font-family: 'Clashdisplay';
  src: url('https://cdn.prod.website-files.com/677f56fb31afe3feff7d22b5/677f6059a4320c057b86be58_ClashDisplay-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Clashdisplay';
  src: url('https://cdn.prod.website-files.com/677f56fb31afe3feff7d22b5/677f6066ecacb224bdc0bfff_ClashDisplay-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Clashdisplay';
  src: url('https://cdn.prod.website-files.com/677f56fb31afe3feff7d22b5/677f60750ecf79b244997259_ClashDisplay-Semibold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Clashdisplay';
  src: url('https://cdn.prod.website-files.com/677f56fb31afe3feff7d22b5/677f60856ae8bdb657069334_ClashDisplay-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
.zoom-in {
  opacity: 0;
  transform: scale(0.92); /* subtle initial scale */
  transition: opacity 1.2s cubic-bezier(0.25, 1, 0.5, 1), 
              transform 1.2s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: opacity, transform;
}

.zoom-in.visible {
  opacity: 1;
  transform: scale(1);
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.portfolio-star-image {
  animation: spin 9s linear infinite;
  display: inline-block; /* ensures the animation applies correctly */
}
.zoom-out {
  opacity: 0;
  transform: scale(1.08); /* subtle zoom-in start */
  transition: 
    opacity 1.2s cubic-bezier(0.33, 1, 0.68, 1),
    transform 1.2s cubic-bezier(0.33, 1, 0.68, 1);
  will-change: opacity, transform;
}


.zoom-out.visible {
  opacity: 1;
  transform: scale(1);
}

.hero-hero-image-block,
.about-us-left-image-block,
.about-us-right-image-block,
.service-top-right-content-block,
.service-video-image-block,
.service-image-block {

  overflow: hidden;
  position: relative;
  display: inline-block;
}



.portfolio-single-card .portfolio-title {
  color: #000; /* default black */
  transition: color 0.3s ease;
}

.portfolio-single-card .portfolio-image {
  filter: none;
  transition: filter 0.3s ease;
}




.portfolio-title {
  color: #000;
  transition: color 0.3s ease;
}

.portfolio-image {
  filter: none;
  transition: filter 0.3s ease;
}

.portfolio-arrow svg path {
  fill: currentColor;
  transition: fill 0.3s ease;
}

.portfolio-arrow {
  color: #000; /* default arrow color */
  transition: color 0.3s ease;
}

/* Initial state with smooth transitions */
.portfolio-title,
.portfolio-arrow {
  transition: color 0.9s ease;
}

.portfolio-star-image svg path {
  transition: fill 0.9s ease;
}

/* Hover styles */
.portfolio-single-card:hover .portfolio-title {
  color: #fff;
}

.portfolio-single-card:hover .portfolio-arrow {
  color: #fff;
}

.portfolio-single-card:hover .portfolio-star-image svg path {
  fill: white;
}
.portfolio-image {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

/* Show the image on card hover */
.portfolio-single-card:hover .portfolio-image {
  opacity: 1;
  transform: translateY(0);
}
.portfolio-image-block {
  z-index: 99;
  transform-origin: 100%;
  display: none;
  position: absolute;
  inset: -70px 13% 0% auto;
}

.portfolio-image {
  z-index: 100;
  position: relative;
}
/* .section-subtitle-block-left.align-left {
  left: -14.5%;
}

.section-subtitle-block-left.blog {
  left: -4.5%;
}

.section-subtitle-block-left.about-us {
  left: -8.5%;
}

.section-subtitle-block-left.portfolio {
  left: -9.5%;
} */
 .section-subtitle-block-left.portfolio {
    transform: translateY(-95%); 
} 



/* Default state: image is hidden via clip-path */
.hover-image {
  position: absolute;
  top: -115px;
  left: 50%;
  transform: translateX(-0%);
  width: 400px;
  pointer-events: none;
  z-index: 10;
}

.hover-image img {
  width: 100%;
  display: block;
  clip-path: inset(0 0 0 100%);
  transition: clip-path 0.6s ease;
}

/* Desktop hover effect */
@media (min-width: 768px) {
  .portfolio-single-card:hover .hover-image img {
    clip-path: inset(0 0 0 0);
  }

}

/* Mobile: show image always by default */
@media (max-width: 767px) {
  .hover-image img {
    clip-path: inset(0 0 0 0);
  }  .hover-image {
    position: unset;
    top: -115px;
    left: 50%;
    transform: translateX(-0%);
    width: 100%;
    pointer-events: none;
    z-index: 10;
}
}

   .blog-thumbnail {
  filter: grayscale(100%);
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }

}