/* Extracted from index.html */
@keyframes float { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-10px); } }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pulse-glow { 0%, 100% { box-shadow: 0 0 20px rgba(249, 115, 22, 0.3); } 50% { box-shadow: 0 0 30px rgba(249, 115, 22, 0.6); } }
.float-animation { animation: float 3s ease-in-out infinite; }
.fade-in-up { animation: fadeInUp 0.8s ease-out forwards; }
.pulse-glow { animation: pulse-glow 2s ease-in-out infinite; }
.gradient-text { background: linear-gradient(135deg, #f97316, #ef4444, #f59e0b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; background-size: 200% 200%; animation: gradient-shift 3s ease infinite; }
@keyframes gradient-shift { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
.particles { position: absolute; width: 100%; height: 100%; overflow: hidden; pointer-events: none; }
.particle { position: absolute; width: 4px; height: 4px; background: rgba(249, 115, 22, 0.3); border-radius: 50%; animation: particle-float 6s linear infinite; }
@keyframes particle-float { 0% { transform: translateY(100vh) rotate(0deg); opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { transform: translateY(-100px) rotate(360deg); opacity: 0; } }
.hero-interactive { position: relative; }
.hero-interactive::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: radial-gradient(600px circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(249, 115, 22, 0.1) 0%, transparent 50%); pointer-events: none; opacity: 0; transition: opacity 0.3s ease; }
.hero-interactive:hover::before { opacity: 1; }
.typewriter { overflow: hidden; border-right: 3px solid rgba(249, 115, 22, 0.8); white-space: nowrap; animation: typing 2s steps(8, end), blink-caret 1s step-end infinite; }
@keyframes typing { from { width: 0; } to { width: 100%; } }
@keyframes blink-caret { from, to { border-color: transparent; } 50% { border-color: rgba(249, 115, 22, 0.8); } }
.counter { display: inline-block; }
.floating-card { animation: float-card 4s ease-in-out infinite; }
.floating-card:nth-child(2) { animation-delay: 1s; }
.floating-card:nth-child(3) { animation-delay: 2s; }
.floating-card:nth-child(4) { animation-delay: 3s; }
@keyframes float-card { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-5px); } }
.v1-professional { background: linear-gradient(135deg, #fff7ed 0%, #fed7aa 100%); }
.site-header-v1 { background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(12px); }
.logo-v1 { display: flex; align-items: center; gap: 0.75rem; text-decoration: none; }
.logo-icon { width: 2.5rem; height: 2.5rem; border-radius: 0.75rem; background: linear-gradient(135deg, #f97316, #ef4444); display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); animation: pulse-glow 2s ease-in-out infinite; }
.logo-text { font-size: 1.25rem; font-weight: 700; color: #1f2937; }
.nav-links-v1 a { text-decoration: none; }
.nav-links-v1 a:hover { color: #f97316; text-decoration: none; }
.lang-switcher-btn { display: flex; align-items: center; gap: 0.25rem; padding: 0.375rem 0.5rem; background: rgba(255, 255, 255, 0.9); border: 1px solid rgba(249, 115, 22, 0.2); border-radius: 0.75rem; color: #374151; font-size: 0.8rem; font-weight: 500; cursor: pointer; transition: all 0.2s ease; backdrop-filter: blur(8px); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); }
.lang-switcher-btn:hover { background: rgba(255, 255, 255, 1); border-color: rgba(249, 115, 22, 0.4); box-shadow: 0 4px 8px rgba(249, 115, 22, 0.1); transform: translateY(-1px); }
.lang-switcher-btn:focus { outline: none; border-color: #f97316; box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.1); }
.dropdown:focus .lang-switcher-btn .chevron-down { transform: rotate(180deg); }
.lang-dropdown-menu { position: absolute; top: 100%; right: 0; margin-top: 0.5rem; min-width: 7rem; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(12px); border: 1px solid rgba(249, 115, 22, 0.1); border-radius: 0.75rem; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.05); padding: 0.5rem; z-index: 50; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.2s ease; }
.dropdown:focus-within .lang-dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.lang-dropdown-menu li { list-style: none; margin: 0; }
.lang-option { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.625rem; color: #374151; text-decoration: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 500; transition: all 0.15s ease; cursor: pointer; }
.lang-option:hover { background: linear-gradient(135deg, #fff7ed, #fed7aa); color: #f97316; transform: translateX(2px); }
.lang-option.active { background: linear-gradient(135deg, #fff7ed, #fed7aa); color: #f97316; font-weight: 600; box-shadow: 0 2px 4px rgba(249, 115, 22, 0.1); }
.lang-flag { font-size: 1rem; line-height: 1; }
.lang-text { flex: 1; }