.elementor-3606 .elementor-element.elementor-element-e8a13ae{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3606 .elementor-element.elementor-element-1f7778e5{--display:flex;}.elementor-3606 .elementor-element.elementor-element-451712dd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3606 .elementor-element.elementor-element-7099dd2b{--display:flex;--min-height:0vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--z-index:0;}.elementor-3606 .elementor-element.elementor-element-7099dd2b.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-3606 .elementor-element.elementor-element-7a3ea562{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;--lottie-container-width:50%;--lottie-container-max-width:50%;}.elementor-3606 .elementor-element.elementor-element-7a3ea562 > .elementor-widget-container{padding:150px 0px 0px 250px;}.elementor-3606 .elementor-element.elementor-element-38824ee2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--z-index:2;}.elementor-3606 .elementor-element.elementor-element-456d0355{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--z-index:2;}.elementor-3606 .elementor-element.elementor-element-4d92a995{--display:flex;}.elementor-3606 .elementor-element.elementor-element-3a3ab02f{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--flex-wrap:nowrap;--overflow:hidden;}.elementor-3606 .elementor-element.elementor-element-77a004d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:0.5;--z-index:99;}.elementor-3606 .elementor-element.elementor-element-77a004d:not(.elementor-motion-effects-element-type-background), .elementor-3606 .elementor-element.elementor-element-77a004d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-3606 .elementor-element.elementor-element-77a004d::before, .elementor-3606 .elementor-element.elementor-element-77a004d > .elementor-background-video-container::before, .elementor-3606 .elementor-element.elementor-element-77a004d > .e-con-inner > .elementor-background-video-container::before, .elementor-3606 .elementor-element.elementor-element-77a004d > .elementor-background-slideshow::before, .elementor-3606 .elementor-element.elementor-element-77a004d > .e-con-inner > .elementor-background-slideshow::before, .elementor-3606 .elementor-element.elementor-element-77a004d > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-3606 .elementor-element.elementor-element-993e6da{--e-filter-direction:row;--e-filter-white-space:nowrap;--e-filter-justify-content:flex-start;--e-filter-item-width:initial;--e-filter-item-flex-grow:0;--e-filter-wrap:nowrap;--e-filter-overflow-x:scroll;width:100%;max-width:100%;--e-filter-space-between:40px;--e-filter-normal-text-color:var( --e-global-color-c4a7441 );--e-filter-hover-text-color:var( --e-global-color-primary );--e-filter-active-text-color:var( --e-global-color-primary );--e-filter-item-border-radius:30px 30px 30px 30px;}.elementor-3606 .elementor-element.elementor-element-993e6da .e-filter-item:not( [aria-pressed=true] ):not( :hover ){background-color:var( --e-global-color-primary );border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-c4a7441 );}.elementor-3606 .elementor-element.elementor-element-993e6da .e-filter-item:hover:not( [aria-pressed=true] ){background-color:var( --e-global-color-c4a7441 );border-style:none;}.elementor-3606 .elementor-element.elementor-element-993e6da .e-filter-item[aria-pressed="true"]{background-color:var( --e-global-color-c4a7441 );border-style:none;}.elementor-3606 .elementor-element.elementor-element-993e6da > .elementor-widget-container{padding:0px 0px 4px 0px;}.elementor-3606 .elementor-element.elementor-element-993e6da.elementor-element{--align-self:flex-start;}.elementor-3606 .elementor-element.elementor-element-993e6da .e-filter-item{font-family:"Helvetica", Sans-serif;font-size:1.2rem;font-weight:400;text-transform:none;font-style:normal;text-decoration:none;padding:10px 20px 10px 20px;}.elementor-3606 .elementor-element.elementor-element-3bb9185{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-3606 .elementor-element.elementor-element-0e6cb97{--e-filter-direction:row;--e-filter-white-space:nowrap;--e-filter-justify-content:flex-start;--e-filter-item-width:initial;--e-filter-item-flex-grow:0;--e-filter-wrap:nowrap;--e-filter-overflow-x:scroll;width:var( --container-widget-width, 45% );max-width:45%;--container-widget-width:45%;--container-widget-flex-grow:0;--e-filter-space-between:40px;--e-filter-normal-text-color:var( --e-global-color-c4a7441 );--e-filter-hover-text-color:var( --e-global-color-primary );--e-filter-active-text-color:var( --e-global-color-primary );--e-filter-item-border-radius:30px 30px 30px 30px;}.elementor-3606 .elementor-element.elementor-element-0e6cb97 .e-filter-item:not( [aria-pressed=true] ):not( :hover ){background-color:var( --e-global-color-primary );border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-c4a7441 );}.elementor-3606 .elementor-element.elementor-element-0e6cb97 .e-filter-item:hover:not( [aria-pressed=true] ){background-color:var( --e-global-color-c4a7441 );border-style:none;}.elementor-3606 .elementor-element.elementor-element-0e6cb97 .e-filter-item[aria-pressed="true"]{background-color:var( --e-global-color-c4a7441 );border-style:none;}.elementor-3606 .elementor-element.elementor-element-0e6cb97 > .elementor-widget-container{padding:0px 0px 4px 0px;}.elementor-3606 .elementor-element.elementor-element-0e6cb97 .e-filter-item{font-family:"Helvetica", Sans-serif;font-size:1.2rem;font-weight:400;text-transform:none;font-style:normal;text-decoration:none;padding:10px 20px 10px 20px;}.elementor-3606 .elementor-element.elementor-element-7c5b938{width:var( --container-widget-width, 10% );max-width:10%;--container-widget-width:10%;--container-widget-flex-grow:0;}.elementor-3606 .elementor-element.elementor-element-7c5b938 .elementor-button{font-family:"Helvetica", Sans-serif;font-size:1.2rem;padding:10px 20px 10px 20px;}.elementor-3606 .elementor-element.elementor-element-82c65f4{--grid-columns:3;width:100%;max-width:100%;}.elementor-3606 .elementor-element.elementor-element-82c65f4 .elementor-loop-container{grid-auto-rows:1fr;}.elementor-3606 .elementor-element.elementor-element-82c65f4 .e-loop-item > .elementor-section, .elementor-3606 .elementor-element.elementor-element-82c65f4 .e-loop-item > .elementor-section > .elementor-container, .elementor-3606 .elementor-element.elementor-element-82c65f4 .e-loop-item > .e-con, .elementor-3606 .elementor-element.elementor-element-82c65f4 .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}body.elementor-page-3606:not(.elementor-motion-effects-element-type-background), body.elementor-page-3606 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}:root{--page-title-display:none;}@media(min-width:768px){.elementor-3606 .elementor-element.elementor-element-7099dd2b{--width:100%;}.elementor-3606 .elementor-element.elementor-element-38824ee2{--width:50%;}.elementor-3606 .elementor-element.elementor-element-456d0355{--width:50%;}.elementor-3606 .elementor-element.elementor-element-3a3ab02f{--content-width:100%;}}@media(max-width:1024px){.elementor-3606 .elementor-element.elementor-element-993e6da{--e-filter-direction:row;--e-filter-white-space:nowrap;}.elementor-3606 .elementor-element.elementor-element-0e6cb97{--e-filter-direction:row;--e-filter-white-space:nowrap;}.elementor-3606 .elementor-element.elementor-element-82c65f4{--grid-columns:2;}}@media(max-width:767px){.elementor-3606 .elementor-element.elementor-element-82c65f4{--grid-columns:1;}}/* Start custom CSS for container, class: .elementor-element-451712dd */#final-line{
font-family: "Helvetica Neue", Helvetica, Arial, system-ui, -apple-system, "Segoe UI", Roboto;
  margin: 2rem 0 0 0;
  text-align: center;
  font-weight: 400;
  font-size: clamp(20px, 4vw, 42px);
  line-height: 1.2;
  color: #1c1c1c;

  opacity: 0;
  transform: translateY(8px);
  transition: opacity .45s ease, transform .45s ease;
  pointer-events: none;
}
#final-line.is-visible{
  opacity: 1;
  transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-7099dd2b *//* ===========================================================
   DOORS + ROUND REVEAL (unchanged) + HARD TABS OUTSIDE CIRCLE
   Works reliably with Elementor by using *real* tab elements.
   =========================================================== */

.elementor-3606 .elementor-element.elementor-element-7099dd2b{
  /* Tweak these 4 values only */
  --R: 37vmin;          /* circle radius (must match your reveal circle) */
  --outside: #fff;      /* doors + outside color */
  --tabW: 16px;         /* tab thickness */
  --tabLen: 8vmin;      /* how far tabs extend OUTSIDE the circle */
}

/* Stage — set the background image on this container in Elementor */
.elementor-3606 .elementor-element.elementor-element-7099dd2b{
  position: relative !important;
  overflow: hidden !important;
  height: 100vh !important;
}

/* ============ Doors ============ */
.elementor-3606 .elementor-element.elementor-element-7099dd2b .door-left,
.elementor-3606 .elementor-element.elementor-element-7099dd2b .door-right{
  position: absolute !important;
  top: 0 !important;
  width: 50% !important;
  height: 100% !important;
  background: var(--outside) !important;
  z-index: 2 !important;
  will-change: transform, opacity;
  transition: transform 1s ease-in-out, opacity .35s ease 1s !important;
}

/* Start off-screen */
.elementor-3606 .elementor-element.elementor-element-7099dd2b .door-left  { left: 0 !important;  transform: translateX(-100%) !important; }
.elementor-3606 .elementor-element.elementor-element-7099dd2b .door-right { right: 0 !important; transform: translateX( 100%) !important; }

/* Close (tiny overlap removes hairline) */
.elementor-3606 .elementor-element.elementor-element-7099dd2b.is-anim .door-left  { transform: translateX( 0.5px) !important; }
.elementor-3606 .elementor-element.elementor-element-7099dd2b.is-anim .door-right { transform: translateX(-0.5px) !important; }

/* Fade under circle */
.elementor-3606 .elementor-element.elementor-element-7099dd2b.is-reveal .door-left,
.elementor-3606 .elementor-element.elementor-element-7099dd2b.is-reveal .door-right { opacity: 0 !important; }

/* Concave inner edges (logo wings) */
@supports (-webkit-mask: none) or (mask: none){
  .elementor-3606 .elementor-element.elementor-element-7099dd2b .door-left{
    -webkit-mask: radial-gradient(circle var(--R) at 100% 50%, transparent 99%, #000 100%) !important;
            mask: radial-gradient(circle var(--R) at 100% 50%, transparent 99%, #000 100%) !important;
  }
  .elementor-3606 .elementor-element.elementor-element-7099dd2b .door-right{
    -webkit-mask: radial-gradient(circle var(--R) at   0% 50%, transparent 99%, #000 100%) !important;
            mask: radial-gradient(circle var(--R) at   0% 50%, transparent 99%, #000 100%) !important;
  }
}

/* ============ Circle reveal (outside becomes solid) ============ */
.elementor-3606 .elementor-element.elementor-element-7099dd2b::before{
  content:"";
  position:absolute;
  top:50%; left:50%;
  width:0; height:0;                       /* start hidden */
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:transparent;                  /* inside circle remains transparent */
  box-shadow:0 0 0 0 var(--outside);
  opacity:0;
  z-index:3;                               /* below tabs, above doors */
  pointer-events:none;
  transition: width 1.2s ease, height 1.2s ease, opacity .2s linear;
}
.elementor-3606 .elementor-element.elementor-element-7099dd2b.is-reveal::before{
  opacity:1;
  width:calc(var(--R)*2);
  height:calc(var(--R)*2);
  box-shadow:0 0 0 9999px var(--outside);
}

/* ============ HARD TABS (real elements) ============ */
/* Wrapper */
.elementor-3606 .elementor-element.elementor-element-7099dd2b .reveal-tabs{
  position:absolute !important;
  inset:0 !important;
  z-index:4 !important;                    /* above the circle */
  pointer-events:none !important;
  opacity:0;                               /* hidden until final frame */
  transition: opacity .2s ease !important;
}

/* Show tabs only at the end */
.elementor-3606 .elementor-element.elementor-element-7099dd2b.is-reveal .reveal-tabs{ opacity:1 !important; }

/* Tabs — placed using the circle radius math */
.elementor-3606 .elementor-element.elementor-element-7099dd2b .reveal-tabs .tab{
  position:absolute !important;
  left:50% !important;
  width:var(--tabW) !important;
  height:var(--tabLen) !important;
  background:var(--outside) !important;
  transform:translateX(-50%) !important;
  border-radius:2px !important;            /* soften edge a touch (optional) */
}

/* Top tab: sits just OUTSIDE the circle */
.elementor-3606 .elementor-element.elementor-element-7099dd2b .reveal-tabs .tab-top{
  top: calc(50% - var(--R) - var(--tabLen)) !important;
}

/* Bottom tab: sits just OUTSIDE the circle */
.elementor-3606 .elementor-element.elementor-element-7099dd2b .reveal-tabs .tab-bottom{
  top: calc(50% + var(--R)) !important;
}

/* ============ RESET (replay) ============ */
.elementor-3606 .elementor-element.elementor-element-7099dd2b.reset .door-left,
.elementor-3606 .elementor-element.elementor-element-7099dd2b.reset .door-right{
  transition:none !important;
  opacity:1 !important;
}
.elementor-3606 .elementor-element.elementor-element-7099dd2b.reset .door-left  { transform:translateX(-100%) !important; }
.elementor-3606 .elementor-element.elementor-element-7099dd2b.reset .door-right { transform:translateX( 100%) !important; }

.elementor-3606 .elementor-element.elementor-element-7099dd2b.reset::before{
  transition:none !important;
  width:0 !important;
  height:0 !important;
  opacity:0 !important;
  box-shadow:0 0 0 0 var(--outside) !important;
}
.elementor-3606 .elementor-element.elementor-element-7099dd2b.reset .reveal-tabs{
  transition:none !important;
  opacity:0 !important;
}/* End custom CSS */
/* Start custom CSS for loop-grid, class: .elementor-element-82c65f4 */.elementor-3606 .elementor-element.elementor-element-82c65f4 {
  display: flex !important;
  flex-wrap: nowrap !important;
  width: max-content !important;
  gap: 24px;
  transition: transform 0.4s ease-in-out;
  align-items: stretch !important;
}

/* Each card */
.elementor-3606 .elementor-element.elementor-element-82c65f4 .elementor-loop-item {
  flex: 0 0 350px;
  scroll-snap-align: start;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 12px;
  transition: transform 0.3s ease;
}

.elementor-3606 .elementor-element.elementor-element-82c65f4 .elementor-loop-item:hover {
  transform: translateY(-5px);
}

/* Clamp titles and excerpts to prevent width expansion */
.elementor-3606 .elementor-element.elementor-element-82c65f4 .elementor-heading-title,
.elementor-3606 .elementor-element.elementor-element-82c65f4 .elementor-widget-text-editor {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Responsive widths */
@media (max-width: 1024px) {
  .elementor-3606 .elementor-element.elementor-element-82c65f4 .elementor-loop-item { flex: 0 0 300px; }
}
@media (max-width: 768px) {
  .elementor-3606 .elementor-element.elementor-element-82c65f4 .elementor-loop-item { flex: 0 0 260px; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-3a3ab02f */.elementor-3606 .elementor-element.elementor-element-3a3ab02f {
  display: flex;
  overflow: hidden;
  position: relative;
  width: 100%;
  cursor: grab;
  gap: 24px;
  padding-bottom: 10px;
}

.elementor-3606 .elementor-element.elementor-element-3a3ab02f:active {
  cursor: grabbing;
}

.elementor-3606 .elementor-element.elementor-element-3a3ab02f {
  scroll-snap-stop: always;
}

.elementor-3606 .elementor-element.elementor-element-3a3ab02f::-webkit-scrollbar { display: none; }/* End custom CSS */
/* Start custom CSS */<script>
document.addEventListener("DOMContentLoaded", () => {
  const container = document.querySelector(".projects-scroll-container");
  if (!container) return;

  // Mouse wheel scrolls sideways
  container.addEventListener("wheel", e => {
    if (Math.abs(e.deltaY) > Math.abs(e.deltaX)) {
      container.scrollLeft += e.deltaY;
      e.preventDefault();
    }
  });

  // Drag-to-scroll
  let isDown = false, startX, scrollLeft;
  container.addEventListener("mousedown", e => {
    isDown = true;
    startX = e.pageX - container.offsetLeft;
    scrollLeft = container.scrollLeft;
    container.style.cursor = "grabbing";
  });
  container.addEventListener("mouseleave", () => { isDown = false; container.style.cursor = "grab"; });
  container.addEventListener("mouseup", () => { isDown = false; container.style.cursor = "grab"; });
  container.addEventListener("mousemove", e => {
    if (!isDown) return;
    e.preventDefault();
    const x = e.pageX - container.offsetLeft;
    const walk = (x - startX) * 1.2;
    container.scrollLeft = scrollLeft - walk;
  });
});
</script>

/* ---------------------------------
   Animated taxonomy filter chips
   --------------------------------- */

.project-filter-bar .e-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-start;
}

/* Base chip style */
.project-filter-bar .e-filter-item {
  border-radius: 999px;
  padding: 8px 16px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(12, 177, 242, 0.25); /* #0CB1F2 with transparency */
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition:
    background 0.25s ease,
    color 0.25s ease,
    box-shadow 0.25s ease,
    transform 0.2s ease;
}

.project-filter-bar .e-filter-item span,
.project-filter-bar .e-filter-item a {
  font-size: 0.9rem;
  font-weight: 500;
  color: #1c1c1c;
}

/* Hover animation */
.project-filter-bar .e-filter-item:hover {
  background: rgba(12, 177, 242, 0.10);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  transform: translateY(-1px) scale(1.02);
}

/* Active filter state (clicked) */
.project-filter-bar .e-filter-item.e-filter-item--active {
  background: #0CB1F2;
  box-shadow: 0 6px 18px rgba(12, 177, 242, 0.45);
  transform: translateY(-2px);
}

.project-filter-bar .e-filter-item.e-filter-item--active span,
.project-filter-bar .e-filter-item.e-filter-item--active a {
  color: #ffffff;
}

/* Little animated underline inside active chip */
.project-filter-bar .e-filter-item.e-filter-item--active::after {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 6px;
  height: 2px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.8);
  transform-origin: left;
  animation: filter-underline 0.35s ease-out forwards;
}

@keyframes filter-underline {
  from {
    transform: scaleX(0);
    opacity: 0;
  }
  to {
    transform: scaleX(1);
    opacity: 1;
  }
}



<script>
document.addEventListener("DOMContentLoaded", function () {

  const resetBtn = document.querySelector(".reset-filter-btn");
  const filterItems = document.querySelectorAll(".project-filter-bar .e-filter-item");

  if (resetBtn) {
    resetBtn.addEventListener("click", function (e) {
      e.preventDefault();

      // Remove active class from all filters
      filterItems.forEach(item => item.classList.remove("e-filter-item--active"));
      
      // Trigger default "show all" functionality
      const firstFilter = document.querySelector(".project-filter-bar .e-filter-item[data-filter='*']");
      if (firstFilter) {
        firstFilter.click();
      } else {
        // Fallback: reload loop grid with all items
        location.reload();
      }
    });
  }
});
</script>/* End custom CSS */