/*//////////////////////////////////*/
/*//////////////////////////////////*/
/* CUSTOM STYLES                    */
/*//////////////////////////////////*/
/*//////////////////////////////////*/

/*//////////////////////////////////*/
/* CURSOR                           */
/*//////////////////////////////////*/

.cursor_icon.is--active {
  opacity: 1;
  transform: scale(1);
}

/*//////////////////////////////////*/
/* SELECTION                        */
/*//////////////////////////////////*/

::-moz-selection {
  /* Code for Firefox */
  color: white;
  background: #222;
}

::selection {
  color: white;
  background: #222;
}

/*//////////////////////////////////*/
/* TOUCHSCREEN FIXES                */
/*//////////////////////////////////*/

/*
@media only screen and (hover: none) and (pointer: coarse) and (min-width: 992px) {
  .cursor {
    display: none;
  }
}
@media only screen and (hover: hover) and (min-width: 992px) {
  .slide_txt {
    opacity: 0;
  }
  .slider:hover .slide_txt {
    opacity: 1;
  }
  .arrow {
    display: none;
  }
  .cursor {
    display: flex;
  }
}
*/

.swiper-nav-arrow {
  display: none;
}
html.is--touch .swiper-nav-arrow {
  display: block;
}
/*
html.is--touch .swiper-slide {
  padding: 0px 24px;
}
*/
html.is--touch .trigger_icon {
  color: #a7a7a7;
}
/* =============================================================================
   ACCORDION STYLES
   ============================================================================= */

/* The Content Container */
[data-acc="target"] {
  height: 0;
  overflow: hidden;
  /* Modern, non-linear easing for height */
  transition: height 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  will-change: height;
}

/* The Trigger Icon (SVG) */
.trigger_icon svg {
  transform-origin: center;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

/* Active State: Rotate the Plus to an X */
.projects_item.is--open .trigger_icon svg {
  transform: rotate(45deg);
}

/* Active State: Optional styling for title/trigger when open */
.projects_item.is--open .trigger_title {
  /* Add color change if desired, e.g.: opacity: 0.6; */
}

/* =============================================================================
   [CUSTOM CURSOR & INTERACTIONS]
   ============================================================================= */

/* 1. Circle Transition
   ----------------------------------------------------------------------------- */
.cursor_kreis {
  /* Smooth transition for size changes */
  transition: width 0.3s cubic-bezier(0.25, 1, 0.5, 1),
    height 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

/* Expanded State 
     Note: !important is used here to override Webflow's inline styles (width: 24px) 
  */
.cursor_kreis.is--expanded {
  width: 44px !important;
  height: 44px !important;
}

/* 2. Icons inside Cursor
     ----------------------------------------------------------------------------- */
.cursor_icon {
  /* Position absolute ensures they center within the moving #cursor div */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.8);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 2; /* Ensure icon sits above the circle */
}

/* Show icon when active */
.cursor_icon.is--visible {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

/* 3. Link Pulsation (The actual link element)
     ----------------------------------------------------------------------------- */
@keyframes linkPulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.25;
  }
  100% {
    opacity: 1;
  }
}

/* Applied to the <a> tag itself */
.is--pulsating {
  animation: linkPulse 1.5s infinite ease-in-out;
}
