/* === Mobile Menu Open/Close Animation (Smoother & Easier) === */
@media (max-width:991px) {
  .nav-link-container {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: 
      max-height 0.5s cubic-bezier(0.4,0,0.2,1),
      opacity 0.4s cubic-bezier(0.4,0,0.2,1);
    will-change: max-height, opacity;
  }
  .nav-link-container.open {
    max-height: 500px; /* Large enough to fit all links */
    opacity: 1;
  }
  .nav-link {
    opacity: 0;
    transform: translateY(24px);
    transition: 
      opacity 0.35s cubic-bezier(0.4,0,0.2,1),
      transform 0.35s cubic-bezier(0.4,0,0.2,1);
  }
  .nav-link-container.open .nav-link {
    opacity: 1;
    transform: translateY(0);
  }
  .nav-link-container.open .nav-link:nth-child(1) {
    transition-delay: 0.08s;
  }
  .nav-link-container.open .nav-link:nth-child(2) {
    transition-delay: 0.16s;
  }
  .nav-link-container.open .nav-link:nth-child(3) {
    transition-delay: 0.24s;
  }
  /* Hide close icon by default */
  .mobile-close-ico { display: none; }
  /* Show close icon only when menu is open */
  .mobile-menu.open .mobile-close-ico { 
    display: inline-flex; 
    align-items: center; 
    justify-content: center; 
  }
}
@media (min-width:992px){
  .nav-link-container{
    display:flex!important;
    max-height:none!important;
    opacity:1!important;
    overflow:visible!important;
    flex-direction:row;
    transition:none!important;
  }
  .nav-link{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}

/* === Arrow Rotate Animation on Case Cards === */
.case-card .circle-button .arrow-right {
  transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
  transform: rotate(0deg);
}
.case-card:hover .circle-button .arrow-right {
  transform: rotate(-45deg);
}

/* === Floating Background Circles Animation (Desktop Only) === */
@keyframes float1 {
  0%   { transform: translate(0,0) rotate(0); }
  50%  { transform: translate(30px, -20px) rotate(8deg); }
  100% { transform: translate(0,0) rotate(0); }
}
@keyframes float2 {
  0%   { transform: translate(0,0) rotate(0); }
  50%  { transform: translate(-25px, 40px) rotate(-6deg); }
  100% { transform: translate(0,0) rotate(0); }
}
@keyframes float3 {
  0%   { transform: translate(0,0) rotate(0); }
  50%  { transform: translate(20px, 30px) rotate(5deg); }
  100% { transform: translate(0,0) rotate(0); }
}
@keyframes floatTop1 {
  0%   { transform: translate(0,0) rotate(0); }
  50%  { transform: translate(25px, -30px) rotate(-7deg); }
  100% { transform: translate(0,0) rotate(0); }
}
@keyframes floatTop2 {
  0%   { transform: translate(0,0) rotate(0); }
  50%  { transform: translate(-20px, -25px) rotate(10deg); }
  100% { transform: translate(0,0) rotate(0); }
}
@keyframes floatTop3 {
  0%   { transform: translate(0,0) rotate(0); }
  50%  { transform: translate(15px, -20px) rotate(-5deg); }
  100% { transform: translate(0,0) rotate(0); }
}

@media (min-width: 991px) {
  .circle-bot01 {
    animation: float1 16s ease-in-out infinite alternate;
  }
  .circle-bot02 {
    animation: float2 17s ease-in-out infinite alternate;
  }
  .circle-bot03 {
    animation: float3 18s ease-in-out infinite alternate;
  }
  .circle-top01 {
    animation: floatTop1 15s ease-in-out infinite alternate;
  }
  .circle-top02 {
    animation: floatTop2 16s ease-in-out infinite alternate;
  }
  .circle-top03 {
    animation: floatTop3 17s ease-in-out infinite alternate;
  }
}

/* === Diagram Wrapper Background for Zoomable/Pannable Images === */
.diagram-wrapper {
  background-image: radial-gradient(circle, #D5D1CF 1px, transparent 0);
  background-size: 24px 24px;
  background-color: #FCFCFD;
  overflow: hidden;
  touch-action: none;
}

/* === External Link Icon for Links Opening in New Tab === */
a[target="_blank"]::after {
  content: '';
  display: inline-block;
  vertical-align: text-bottom;
  margin-left: 0.125rem;
  width: 1.125rem;
  height: 1.125rem;
  background: currentColor;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 256 256"><path d="M224,104a8,8,0,0,1-16,0V59.32l-66.33,66.34a8,8,0,0,1-11.32-11.32L196.68,48H152a8,8,0,0,1,0-16h64a8,8,0,0,1,8,8Zm-40,24a8,8,0,0,0-8,8v72H48V80h72a8,8,0,0,0,0-16H48A16,16,0,0,0,32,80V208a16,16,0,0,0,16,16H176a16,16,0,0,0,16-16V136A8,8,0,0,0,184,128Z"/></svg>') no-repeat center;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 256 256"><path d="M224,104a8,8,0,0,1-16,0V59.32l-66.33,66.34a8,8,0,0,1-11.32-11.32L196.68,48H152a8,8,0,0,1,0-16h64a8,8,0,0,1,8,8Zm-40,24a8,8,0,0,0-8,8v72H48V80h72a8,8,0,0,0,0-16H48A16,16,0,0,0,32,80V208a16,16,0,0,0,16,16H176a16,16,0,0,0,16-16V136A8,8,0,0,0,184,128Z"/></svg>') no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
}