.dmvh-services-module {
  margin-top: var(--dmvh-services-top-margin, 0px);
  margin-bottom: var(--dmvh-services-bottom-margin, 0px);
}

.dmvh-services-module .dmvh-section-title {
  margin-bottom: var(--dmvh-services-title-margin-bottom, 70px);
}

.dmvh-services-module .dmvh-center-actions {
  margin-top: var(--dmvh-services-actions-margin-top, 52px);
}

.dmvh-services-module .dmvh-service-icon-svg {
  display: block;
  width: 48px;
  height: 48px;
}

.dmvh-services-module .dmvh-service-card {
  min-height: var(--card-min-height, 330px);
  display: flex;
  flex-direction: column;
  position: relative;
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.35s ease;
}

.dmvh-services-module .dmvh-service-card h3 {
  white-space: pre-line;
}

/* Card content alignment */
.dmvh-services-module.dmvh-align-center .dmvh-service-card {
  text-align: center;
}

.dmvh-services-module.dmvh-align-center .dmvh-service-icon {
  display: flex;
  justify-content: center;
}

/* Clickable card link styling */
.dmvh-services-module a.dmvh-service-card {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.dmvh-services-module a.dmvh-service-card:hover {
  text-decoration: none;
  color: inherit;
}

.dmvh-services-module a.dmvh-service-card:focus-visible {
  outline: 2px solid var(--dmvh-orange, #f05a28);
  outline-offset: 4px;
}

/* Desktop staggered vertical offset & clearance */
@media (min-width: 801px) {
  .dmvh-services-module .dmvh-service-grid {
    margin-top: var(--dmvh-services-stagger-top-clearance, 0px);
    margin-bottom: var(--dmvh-services-stagger-clearance, 0px);
  }

  .dmvh-services-module .dmvh-service-card {
    transform: translateY(var(--card-offset-y, 0px));
  }
}

/* ==========================================================================
   Hover Effects
   ========================================================================== */

/* 1. Lift & deep diffused shadow */
@media (min-width: 801px) {
  .dmvh-services-module.dmvh-hover-lift .dmvh-service-card:hover {
    transform: translateY(calc(var(--card-offset-y, 0px) - 10px));
    box-shadow: 0 24px 50px rgba(24, 57, 91, 0.16), 0 4px 12px rgba(24, 57, 91, 0.06);
  }
}

@media (max-width: 800px) {
  .dmvh-services-module.dmvh-hover-lift .dmvh-service-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(24, 57, 91, 0.14);
  }
}

/* 2. Soft orange glow */
@media (min-width: 801px) {
  .dmvh-services-module.dmvh-hover-glow .dmvh-service-card:hover {
    transform: translateY(calc(var(--card-offset-y, 0px) - 6px));
    box-shadow: 0 16px 40px rgba(240, 90, 40, 0.18), 0 0 0 1.5px rgba(240, 90, 40, 0.35);
  }
}

@media (max-width: 800px) {
  .dmvh-services-module.dmvh-hover-glow .dmvh-service-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(240, 90, 40, 0.18), 0 0 0 1.5px rgba(240, 90, 40, 0.35);
  }
}

/* 3. Scale + Icon micro-bounce */
@media (min-width: 801px) {
  .dmvh-services-module.dmvh-hover-scale-icon .dmvh-service-card:hover {
    transform: translateY(var(--card-offset-y, 0px)) scale(1.025);
    box-shadow: 0 20px 45px rgba(24, 57, 91, 0.14);
  }
}

@media (max-width: 800px) {
  .dmvh-services-module.dmvh-hover-scale-icon .dmvh-service-card:hover {
    transform: scale(1.02);
    box-shadow: 0 16px 36px rgba(24, 57, 91, 0.12);
  }
}

.dmvh-services-module.dmvh-hover-scale-icon .dmvh-service-card .dmvh-service-icon {
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), color 0.3s ease;
}

.dmvh-services-module.dmvh-hover-scale-icon .dmvh-service-card:hover .dmvh-service-icon {
  transform: translateY(-4px) scale(1.08);
  color: var(--dmvh-orange, #f05a28);
}

/* ==========================================================================
   Entrance Animations
   ========================================================================== */

@keyframes dmvhServiceFadeUp {
  from {
    opacity: 0;
    transform: translateY(calc(var(--card-offset-y, 0px) + 30px));
  }
  to {
    opacity: 1;
    transform: translateY(var(--card-offset-y, 0px));
  }
}

@keyframes dmvhServiceFadeUpMobile {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes dmvhServicePopIn {
  from {
    opacity: 0;
    transform: translateY(var(--card-offset-y, 0px)) scale(0.92);
  }
  to {
    opacity: 1;
    transform: translateY(var(--card-offset-y, 0px)) scale(1);
  }
}

@keyframes dmvhServicePopInMobile {
  from {
    opacity: 0;
    transform: scale(0.92);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@media (min-width: 801px) {
  .dmvh-services-module.dmvh-anim-fade-up .dmvh-service-card {
    animation: dmvhServiceFadeUp 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
    animation-delay: calc(var(--card-index, 0) * 0.1s);
  }
  .dmvh-services-module.dmvh-anim-pop-in .dmvh-service-card {
    animation: dmvhServicePopIn 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;
    animation-delay: calc(var(--card-index, 0) * 0.08s);
  }
}

@media (max-width: 800px) {
  .dmvh-services-module.dmvh-anim-fade-up .dmvh-service-card {
    animation: dmvhServiceFadeUpMobile 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;
    animation-delay: calc(var(--card-index, 0) * 0.08s);
  }
  .dmvh-services-module.dmvh-anim-pop-in .dmvh-service-card {
    animation: dmvhServicePopInMobile 0.5s cubic-bezier(0.16, 1, 0.3, 1) both;
    animation-delay: calc(var(--card-index, 0) * 0.06s);
  }
}

@media (prefers-reduced-motion: reduce) {
  .dmvh-services-module.dmvh-anim-fade-up .dmvh-service-card,
  .dmvh-services-module.dmvh-anim-pop-in .dmvh-service-card {
    animation: none !important;
  }
  .dmvh-services-module .dmvh-service-card {
    transition: none !important;
  }
}

/* ==========================================================================
   Mobile overrides
   ========================================================================== */

@media (max-width: 800px) {
  .dmvh-services-module .dmvh-section-title {
    margin-bottom: 36px;
  }

  .dmvh-services-module .dmvh-service-icon-svg {
    width: 40px;
    height: 40px;
  }
}
