.blurred-src {
  display: block;
  position: absolute;
  transition: all 0.3s ease;
  z-index: 2;
  opacity: 1;
  filter: blur(5px);
}

.blurred-src ~ img {
  z-index: 0;
}

.blur-loaded {
  opacity: 0;
  filter: blur(0px);
}

.bm-scroll-reveal {
  opacity: 0;
  transform: translateY(1.25rem);
  transition: opacity 0.55s ease, transform 0.55s ease;
}

.bm-scroll-reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

body.bm-elementor-edit .bm-scroll-reveal,
body.elementor-editor-active .bm-scroll-reveal {
  opacity: 1;
  transform: none;
  transition: none;
}


/* Animation för den horisontella linjen på desktop vid scroll-in */
@keyframes bmScaleX {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

.bm-process-line {
  transform-origin: left;
  /* Simulerar Framer Motions whileInView */
  animation: bmScaleX 1.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Transitions för interaktiva element */
.bm-process-step, 
.bm-process-node, 
.bm-process-glow, 
.bm-process-node-ring,
.bm-process-step-accent {
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.bm-process-glow {
  opacity: 0;
  transform: scale(1);
}
.bm-process-step-accent {
  transform: scaleX(0);
  transform-origin: left;
}

.bm-process-step.is-active .bm-process-node {
  transform: translateY(-4px) scale(1.12);
}
@media (max-width: 767px) {
  .bm-process-step.is-active .bm-process-node {
    transform: scale(1.08);
  }
}

.bm-process-step.is-active .bm-process-glow {
  opacity: 1;
  transform: scale(1.4);
}

.bm-process-step.is-active .bm-process-node-ring {
  background-color: hsl(var(--primary-foreground));
  border-color: hsl(var(--primary-foreground));
}

.bm-process-step.is-active .bm-process-step-accent {
  transform: scaleX(1);
}

.bm-process-container.has-active-step .bm-process-step:not(.is-active) {
  opacity: 0.45;
}

.grid-cols-7 {
  grid-template-columns: repeat(7,minmax(0,1fr));
}

button[disabled] {
	opacity: 0.3;
}

.hover\:bg-muted:hover[disabled] {
  background-color: transparent;
}

.flex-row-reverse {
	flex-direction: row-reverse;
}

.radio-accent {
	accent-color: hsl(var(--nav) / .95);
}

video:fullscreen {
    object-fit: contain !important;
    width: 100vw !important;
    height: 100vh !important;
}

video:-webkit-full-screen {
    object-fit: contain !important;
    width: 100vw !important;
    height: 100vh !important;
}

@media (min-width: 640px) {
  .sm\:px-9 {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
  }
}

@media (min-width: 768px) {
  .md\:px-18 {
    padding-left: 4.5rem;
    padding-right: 4.5rem;
  }
}