html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, sans-serif; }

.loader { border-top-color: #1e40af; animation: spinner 0.8s linear infinite; }
@keyframes spinner { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

#navbar { background-color: rgba(0, 0, 0, 0.3); backdrop-filter: blur(5px); border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.navbar-scrolled { background-color: rgba(0, 0, 0, 0.7); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }

.group:hover .group-hover\:opacity-100 { animation: dropdownFadeIn 0.5s ease-out; }
.group:hover .group-hover\:translate-y-0 { animation: dropdownSlideIn 0.5s ease-out; }
@keyframes dropdownFadeIn { from { opacity: 0; transform: translateY(-10px) scale(0.95); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes dropdownSlideIn { from { transform: translateY(-10px); } to { transform: translateY(0); } }
.group\/item:hover { transform: translateX(4px); box-shadow: 0 4px 12px rgba(30, 64, 175, 0.2); }

@media (hover: none) and (pointer: coarse) {
  .group:hover .group-hover\:opacity-100 { animation: none; }
  .group:hover .group-hover\:translate-y-0 { animation: none; }
  .group:active .group-hover\:opacity-100 { opacity: 1; visibility: visible; }
  .group:active .group-hover\:translate-y-0 { transform: translateY(0); }
}

.card-hover { transition: all 0.3s ease; }
.card-hover:hover { transform: translateY(-5px); }

.btn-primary { background-color: #1e40af; color: white; padding: 0.75rem 1.5rem; border-radius: 0.375rem; font-weight: 500; transition: all 0.3s ease; }
.btn-primary:hover { background-color: rgba(30, 64, 175, 0.9); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.btn-primary:focus { outline: none; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25), 0 0 0 4px rgba(30, 64, 175, 0.5); }

.btn-secondary { background-color: #f97316; color: white; padding: 0.75rem 1.5rem; border-radius: 0.375rem; font-weight: 500; transition: all 0.3s ease; }
.btn-secondary:hover { background-color: rgba(249, 115, 22, 0.9); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.btn-secondary:focus { outline: none; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25), 0 0 0 4px rgba(249, 115, 22, 0.5); }

.content-auto { content-visibility: auto; }
.top-1\/2 { top: 38% !important; }
.text-shadow { text-shadow: 0 2px 4px rgba(0,0,0,0.1); }
.hover-scale { transition: transform 0.3s ease; }
.hover-scale:hover { transform: scale(1.05); }

.fly-in-left { opacity: 0; transform: translateX(-100px); transition: all 1s ease-out; }
.fly-in-right { opacity: 0; transform: translateX(100px); transition: all 1s ease-out; }
.fly-in-up { opacity: 0; transform: translateY(100px); transition: all 1s ease-out; }
.fly-in-down { opacity: 0; transform: translateY(-100px); transition: all 1s ease-out; }
.fly-in-visible { opacity: 1; transform: translate(0); }

@media (max-width: 768px) {
  #menuBtn { min-height: 44px; min-width: 44px; touch-action: manipulation; user-select: none; -webkit-tap-highlight-color: transparent; }
  #mobileMenu { max-height: calc(100vh - 80px); z-index: 1000; will-change: transform, opacity; -webkit-overflow-scrolling: touch; }
  #mobileMenu.hidden { transform: translateY(-10px); opacity: 0; visibility: hidden; }
  .mobile-dropdown-btn { min-height: 48px; touch-action: manipulation; -webkit-tap-highlight-color: transparent; position: relative; overflow: hidden; }
  .mobile-dropdown-btn::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(30, 64, 175, 0.1), transparent); transition: left 0.5s ease; }
  .mobile-dropdown-btn:active::before { left: 100%; }
  #mobileMenu a { min-height: 44px; display: flex; align-items: center; touch-action: manipulation; -webkit-tap-highlight-color: transparent; position: relative; overflow: hidden; }
  #mobileMenu a::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(30, 64, 175, 0.05), transparent); transition: left 0.3s ease; }
  #mobileMenu a:active::before { left: 100%; }
  .mobile-dropdown-content { transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease; overflow: hidden; }
  .mobile-dropdown-content.hidden { max-height: 0 !important; opacity: 0; }
  #mobileMenu { pointer-events: auto; }
  #mobileMenu.hidden { pointer-events: none; }
  #mobileMenu::-webkit-scrollbar { width: 4px; }
  #mobileMenu::-webkit-scrollbar-track { background: transparent; }
  #mobileMenu::-webkit-scrollbar-thumb { background: rgba(30, 64, 175, 0.3); border-radius: 2px; }
  #mobileMenu::-webkit-scrollbar-thumb:hover { background: rgba(30, 64, 175, 0.5); }
  .btn-primary, .btn-secondary { padding: 0.5rem 1rem; font-size: 0.875rem; }
  .card-hover { margin-bottom: 1rem; }
}

.mobile-dropdown-btn:focus, #menuBtn:focus { outline: 2px solid #1e40af; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .mobile-dropdown-content, #mobileMenu, .mobile-dropdown-btn::before, #mobileMenu a::before { transition: none; }
}

form input, form select, form textarea { transition: border-color 0.3s ease, box-shadow 0.3s ease; }
form input:focus, form select:focus, form textarea:focus { border-color: #1e40af; box-shadow: 0 0 0 2px rgba(30, 64, 175, 0.25); }

img { transition: all 0.3s ease; }

#home { position: relative; }
#home::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); z-index: 10; }

@media (max-width: 768px) {
  #home::before { display: none; }
}

html, body { margin: 0; padding: 0; min-height: 100vh; overflow-x: hidden; }
body { position: relative; }
* { box-sizing: border-box; }
img { max-width: 100%; height: auto; }

footer { position: relative; width: 100vw; margin-left: calc(-50vw + 50%); background: linear-gradient(135deg, #1f2937 0%, #111827 50%, #000000 100%) !important; box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.3); }
/*footer.bg-gradient-to-br.to-black { margin-bottom: -80px; }*/
footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent); }
footer a { transition: color 0.3s ease; }
footer a:hover { color: white; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
section { animation: fadeIn 0.8s ease-out; }

button:disabled { opacity: 0.6; cursor: not-allowed; }

nav a { position: relative; }
nav a::after { content: ''; position: absolute; width: 0; height: 2px; bottom: -2px; left: 0; background-color: #1e40af; transition: width 0.3s ease; }
nav a:hover::after { width: 100%; }

.carousel { position: relative; overflow: hidden; }
.hero-carousel { position: relative; overflow: hidden; }
.hero-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1s ease-in-out; }
.hero-slide.active { opacity: 1; }
.hero-slide video, .hero-slide img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-carousel-prev, .hero-carousel-next { backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.2); }
.hero-carousel-prev:hover, .hero-carousel-next:hover { backdrop-filter: blur(15px); border-color: rgba(255, 255, 255, 0.4); transform: translateY(-50%) scale(1.1); }
.hero-indicator.active { background-color: white; transform: scale(1.2); }
.hero-indicator:hover { background-color: rgba(255, 255, 255, 0.8); transform: scale(1.1); }
.hero-slide.active img { animation: kenburns 8s ease-in-out forwards; }
@keyframes kenburns { 0% { transform: scale(1) translateY(0); } 100% { transform: scale(1.08) translateY(-2%); } }
