.logo-image {
    height: 50px;
    width: auto;
}

.nav-link {
    position: relative;
    text-decoration: none;
    transition: color 0.3s ease;
}

.nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -4px;
    left: 0;
    background-color: #059669;
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

/* Mobile Menu Styles with Translucent Background */
.mobile-menu {
    max-height: 0;
    overflow: hidden;
    transition: all 0.3s ease-out;
    background: rgba(255, 255, 255, 0.8); /* Translucent white */
    backdrop-filter: blur(8px); /* Blur effect for background */
    -webkit-backdrop-filter: blur(8px); /* For Safari support */
    border-top: 1px solid rgba(229, 231, 235, 0.5); /* Subtle border */
}

.mobile-menu.active {
    max-height: 300px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
                0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* Style the mobile menu items for better visibility */
.mobile-menu a {
    position: relative;
    z-index: 1;
    transition: background-color 0.3s ease;
}

.mobile-menu a:hover {
    background-color: rgba(255, 255, 255, 0.5);
}

/* Hamburger Menu Styles */
.hamburger {
    cursor: pointer;
    padding: 10px;
    z-index: 50;
}

.hamburger-line {
    width: 24px;
    height: 2px;
    background-color: #374151;
    margin: 5px 0;
    transition: 0.4s;
}

.hamburger.active .hamburger-line:nth-child(1) {
    transform: rotate(-45deg) translate(-5px, 6px);
}

.hamburger.active .hamburger-line:nth-child(2) {
    opacity: 0;
}

.hamburger.active .hamburger-line:nth-child(3) {
    transform: rotate(45deg) translate(-5px, -6px);
}

/* Animation Classes */
.button-primary {
    transition: all 0.3s ease;
}

.button-primary:hover {
    transform: scale(1.05);
}

/* Ensure the navigation bar itself has a solid background */
nav {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Optional: Add a subtle transition when opening/closing the menu */
.mobile-menu {
    transition: max-height 0.3s ease-out,
                opacity 0.2s ease-out,
                transform 0.2s ease-out;
    opacity: 0;
    transform: translateY(-10px);
}

.mobile-menu.active {
    opacity: 17;
    transform: translateY(0);
}

body {
	background: #000;
}


*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }


.mouse_scroll {
	display: block;
	margin: 0 auto;
	width: 24px;
	height: 100px;
	
}


.m_scroll_arrows
{
  display: block;
  width: 5px;
  height: 5px;
  -ms-transform: rotate(45deg); /* IE 9 */
  -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
  transform: rotate(45deg);
   
  border-right: 2px solid rgb(0, 0, 0);
  border-bottom: 2px solid rgb(0, 0, 0);
  margin: 0 0 3px 4px;
  
  width: 16px;
  height: 16px;
}


.unu
{
  margin-top: 1px;
}

.unu, .doi, .trei
{
    -webkit-animation: mouse-scroll 1s infinite;
    -moz-animation: mouse-scroll 1s infinite;
    animation: mouse-scroll 1s infinite;
  
}

.unu
{
  -webkit-animation-delay: .1s;
  -moz-animation-delay: .1s;
  -webkit-animation-direction: alternate;
  
  animation-direction: alternate;
  animation-delay: alternate;
}

.doi
{
  -webkit-animation-delay: .2s;
  -moz-animation-delay: .2s;
  -webkit-animation-direction: alternate;
  
  animation-delay: .2s;
  animation-direction: alternate;
  
  margin-top: -6px;
}

.trei
{
  -webkit-animation-delay: .3s;
  -moz-animation-delay: .3s;
  -webkit-animation-direction: alternate;
  
  animation-delay: .3s;
  animation-direction: alternate;
  
  
  margin-top: -6px;
}

.mouse {
  height: 42px;
  width: 24px;
  border-radius: 14px;
  transform: none;
  border: 2px solid rgb(0, 0, 0);
  top: 170px;
}

.wheel {
  height: 5px;
  width: 2px;
  display: block;
  margin: 5px auto;
  background: rgb(0, 0, 0);
  position: relative;
  
  height: 4px;
  width: 4px;
  border: 2px solid #000000;
  -webkit-border-radius: 8px;
          border-radius: 8px;
}

.wheel {
  -webkit-animation: mouse-wheel 0.6s linear infinite;
  -moz-animation: mouse-wheel 0.6s linear infinite;
  animation: mouse-wheel 0.6s linear infinite;
}

@-webkit-keyframes mouse-wheel{
   0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
  }
}
@-moz-keyframes mouse-wheel {
  0% { top: 1px; }
  25% { top: 2px; }
  50% { top: 3px;}
  75% { top: 2px;}
  100% { top: 1px;}
}
@-o-keyframes mouse-wheel {

   0% { top: 1px; }
  25% { top: 2px; }
  50% { top: 3px;}
  75% { top: 2px;}
  100% { top: 1px;}
}
@keyframes mouse-wheel {

   0% { top: 1px; }
  25% { top: 2px; }
  50% { top: 3px;}
  75% { top: 2px;}
  100% { top: 1px;}
}

@-webkit-keyframes mouse-scroll {

  0%   { opacity: 0;}
  50%  { opacity: .5;}
  100% { opacity: 1;}
}
@-moz-keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
@-o-keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
@keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}



/* Hamburger Menu Styles */
.hamburger {
    cursor: pointer;
    padding: 10px;
}

.hamburger-line {
    width: 24px;
    height: 2px;
    background-color: #374151;
    margin: 5px 0;
    transition: 0.4s;
}

.hamburger.active .hamburger-line:nth-child(1) {
    transform: rotate(-45deg) translate(-5px, 6px);
}

.hamburger.active .hamburger-line:nth-child(2) {
    opacity: 0;
}

.hamburger.active .hamburger-line:nth-child(3) {
    transform: rotate(45deg) translate(-5px, -6px);
}

/* Animation Classes */
.button-primary {
    transition: all 0.3s ease;
}

.button-primary:hover {
    transform: scale(1.05);
}

/* Base Styles */
html {
    scroll-behavior: smooth;
}

body {
    font-family: system-ui, -apple-system, sans-serif;
}

/* Logo Styles */
.logo-image {
    width: 180px;
    height: auto;
    transition: transform 0.3s ease;
}

.logo-image:hover {
    transform: scale(1.05);
}


/* Base Styles */
html {
    scroll-behavior: smooth;
}

body {
    font-family: system-ui, -apple-system, sans-serif;
}

/* Logo Styles */
.logo-image {
    width: 180px;
    height: auto;
    transition: transform 0.3s ease;
    /* Remove any margin that might affect spacing */
    margin: 0;
    /* Ensure the image doesn't grow beyond its container */
    max-width: 100%;
    object-fit: contain;
}

.logo-image:hover {
    transform: scale(1.05);
}

/* Navigation Styles */
nav {
    height: 80px; /* Set a fixed height for the header */
}

nav .max-w-7xl {
    height: 100%; /* Make the container take full height */
}

nav .flex {
    height: 100%; /* Make the flex container take full height */
}

.flex.justify-between {
    /* Add padding to ensure content doesn't touch edges */
    padding: 0.5rem 0;
    /* Align items vertically */
    align-items: center;
}

.flex.items-center {
    /* Prevent logo from affecting layout */
    flex-shrink: 0;
    /* Move logo to far left */
    margin-right: auto;
}

/* Navigation Links Container */
.hidden.md\:flex.items-center {
    /* Prevent navigation from being pushed by logo */
    flex-shrink: 0;
    /* Add spacing between logo and links */
    margin-left: 2rem;
}

/* Navigation Styles */
.nav-link {
    position: relative;
    transition: color 0.3s ease;
}

.nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -4px;
    left: 0;
    background-color: #16a34a;
    transition: width 0.3s ease;
}

.nav-link:hover::after {
    width: 100%;
}

/* 3D Card Effects */
.perspective-container {
    perspective: 1000px;
}

.card-3d {
    transform-style: preserve-3d;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    backface-visibility: hidden;
}

.card-3d:hover {
    transform: translateZ(20px) rotateX(5deg);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

/* Floating Animation */
.floating {
    animation: float 6s ease-in-out infinite;
}

@keyframes float {
    0% { 
        transform: translateY(0px);
    }
    50% { 
        transform: translateY(-20px);
    }
    100% { 
        transform: translateY(0px);
    }
}

/* Gradient Text Effect */
.gradient-text {
    background: linear-gradient(45deg, #166534, #15803d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Button Hover Effects */
.button-primary {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.button-primary:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.6s ease, height 0.6s ease;
}

.button-primary:hover:before {
    width: 300px;
    height: 300px;
}

/* Scroll Reveal Animation */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s ease;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .logo-image {
        width: 140px;
    }
    
    .card-3d:hover {
        transform: translateZ(10px) rotateX(3deg);
    }
}

/* Section Transitions */
.section {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.section.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #16a34a;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #15803d;
}

.button-primary {
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.button-primary:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.6s ease, height 0.6s ease;
}

.button-primary:hover:before {
    width: 300px;
    height: 300px;
}

.button-primary:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
}

/* Form input and select styles */
input, select, textarea {
    transition: all 0.3s ease;
    border-color: #16a34a;
}

input:focus, 
select:focus, 
textarea:focus {
    border-color: #15803d;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.2);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .contact-form .grid {
        grid-template-columns: 1fr;
    }