*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;color:#333;background-color:#fafafa}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}html{scroll-behavior:smooth}.container{max-width:1200px;margin:0 auto;padding:0 20px}.section{padding:80px 0;border-bottom:1px solid #e5e5e5}.section:last-child{border-bottom:none}.section-title{font-size:2.5rem;font-weight:700;color:#1a1a1a;margin-bottom:1rem;text-align:center}.section-subtitle{font-size:1.2rem;color:#666;text-align:center;margin-bottom:3rem;max-width:600px;margin-left:auto;margin-right:auto}.card{background:#fff;border-radius:12px;padding:2rem;margin-bottom:2rem;box-shadow:0 4px 6px #0000000d;border:1px solid #e5e5e5;transition:transform .2s ease,box-shadow .2s ease}.card:hover{transform:translateY(-2px);box-shadow:0 8px 25px #0000001a}.card-title{font-size:1.5rem;font-weight:600;color:#1a1a1a;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.card-content{color:#555;line-height:1.7}.step-list{list-style:none;counter-reset:step-counter}.step-list li{counter-increment:step-counter;margin-bottom:1.5rem;padding-left:3rem;position:relative}.step-list li:before{content:counter(step-counter);position:absolute;left:0;top:0;background:#3b82f6;color:#fff;width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem}.video-placeholder{background:#f8f9fa;border:2px dashed #dee2e6;border-radius:8px;padding:3rem;text-align:center;margin:2rem 0;color:#6c757d}.video-placeholder h3{margin-bottom:1rem;color:#495057}.warning{background:#fff3cd;border:1px solid #ffeaa7;border-radius:8px;padding:1rem;margin:1rem 0;color:#856404}.important{background:#f8d7da;border:1px solid #f5c6cb;border-radius:8px;padding:1rem;margin:1rem 0;color:#721c24}.tip{background:#d1ecf1;border:1px solid #bee5eb;border-radius:8px;padding:1rem;margin:1rem 0;color:#0c5460}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-top:2rem}@media (max-width: 768px){.section{padding:60px 0}.section-title{font-size:2rem}.card{padding:1.5rem}.grid{grid-template-columns:1fr}}:root{--bg-primary: #f8fafc;--bg-secondary: #e2e8f0;--bg-card: rgba(255, 255, 255, .95);--bg-nav: rgba(255, 255, 255, .95);--text-primary: #1e293b;--text-secondary: #64748b;--text-muted: #475569;--border-color: rgba(148, 163, 184, .2);--shadow-light: rgba(0, 0, 0, .05);--shadow-medium: rgba(0, 0, 0, .1);--accent-color: #10b981;--accent-hover: #059669;--accent-dark: #047857;--header-bg: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #334155 100%);--footer-bg: linear-gradient(135deg, #0f172a 0%, #1e293b 100%)}[data-theme=dark]{--bg-primary: #0f172a;--bg-secondary: #1e293b;--bg-card: rgba(30, 41, 59, .95);--bg-nav: rgba(15, 23, 42, .95);--text-primary: #f1f5f9;--text-secondary: #cbd5e1;--text-muted: #94a3b8;--border-color: rgba(148, 163, 184, .3);--shadow-light: rgba(0, 0, 0, .3);--shadow-medium: rgba(0, 0, 0, .4);--accent-color: #34d399;--accent-hover: #10b981;--accent-dark: #059669;--header-bg: linear-gradient(135deg, #020617 0%, #0f172a 50%, #1e293b 100%);--footer-bg: linear-gradient(135deg, #020617 0%, #0f172a 100%)}.App{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 100%);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--text-primary);transition:all .3s ease}.nav{position:fixed;top:0;left:0;right:0;background:var(--bg-nav);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border-color);z-index:1000;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 3px var(--shadow-light)}.nav:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--accent-color),var(--accent-hover),var(--accent-dark));background-size:200% 100%;animation:modernTrail 4s ease-in-out infinite}@keyframes modernTrail{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.nav-container{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;max-width:1200px;margin:0 auto;gap:1rem}.nav-brand{display:flex;align-items:center;gap:.75rem;font-size:1.25rem;font-weight:700;color:var(--text-primary);letter-spacing:-.025em}.nav-brand svg{color:var(--accent-color);filter:drop-shadow(0 1px 2px rgba(16,185,129,.2))}.nav-controls{display:flex;align-items:center;gap:1rem}.theme-toggle{background:none;border:1px solid var(--border-color);border-radius:12px;color:var(--text-secondary);cursor:pointer;padding:.75rem;font-size:1.125rem;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}.theme-toggle:hover{background:#10b9810d;color:var(--accent-color);border-color:var(--accent-color);transform:translateY(-1px);box-shadow:0 4px 12px #10b98133}.theme-toggle:active{transform:translateY(0)}.desktop-menu{display:flex;list-style:none;margin:0;padding:0;gap:0;height:100%}.nav-link{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:none;border:none;border-radius:0;color:var(--text-secondary);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);text-decoration:none;position:relative;overflow:hidden;height:100%;min-width:fit-content}.nav-link:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(16,185,129,.1),transparent);transition:left .4s ease}.nav-link:hover:before{left:100%}.nav-link:hover{background:#10b9810d;color:var(--accent-color);transform:translateY(-1px)}.nav-link.active{background:linear-gradient(135deg,var(--accent-color),var(--accent-hover));color:#fff;box-shadow:0 4px 12px #10b9814d;border-radius:0;flex:1;justify-content:center}.nav-link svg{font-size:1rem}.mobile-menu-btn{display:none;background:none;border:1px solid var(--border-color);border-radius:10px;font-size:1.25rem;color:var(--text-secondary);cursor:pointer;padding:.5rem;transition:all .2s ease}.mobile-menu-btn:hover{background:#10b9810d;color:var(--accent-color);border-color:var(--accent-color)}.mobile-menu{position:absolute;top:100%;left:0;right:0;background:var(--bg-nav);border-top:1px solid var(--border-color);box-shadow:0 10px 25px var(--shadow-medium);transform:translateY(-100%);opacity:0;visibility:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.mobile-menu.open{transform:translateY(0);opacity:1;visibility:visible}.mobile-nav-menu{list-style:none;margin:0;padding:1rem 0}.mobile-nav-link{display:flex;align-items:center;gap:1rem;width:100%;padding:1rem 2rem;background:none;border:none;color:var(--text-secondary);font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-align:left;border-bottom:1px solid var(--border-color)}.mobile-nav-link:hover{background:#10b9810d;color:var(--accent-color);padding-left:2.5rem}.mobile-nav-link.active{background:linear-gradient(135deg,var(--accent-color),var(--accent-hover));color:#fff}.mobile-nav-link svg{font-size:1.125rem;min-width:1.125rem}@media (max-width: 1024px){.desktop-menu{display:none}.mobile-menu-btn{display:block}.nav-container{padding:.75rem 1.5rem}.nav-brand{font-size:1.125rem}.nav-controls{order:2}.nav-brand{order:1}.mobile-menu-btn{order:3}}@media (min-width: 1025px){.mobile-menu{display:none}.nav-controls{order:2}.nav-brand{order:1}.desktop-menu{order:3}}.header{background:linear-gradient(#0f172a99,#1e293b99),url(/background.webp) center center/cover no-repeat;color:#fff;padding:8rem 0 6rem;text-align:center;margin-top:60px;position:relative;overflow:hidden}.header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 25% 25%,rgba(16,185,129,.1) 0%,transparent 50%),radial-gradient(circle at 75% 75%,rgba(59,130,246,.1) 0%,transparent 50%),radial-gradient(circle at 50% 50%,rgba(139,92,246,.05) 0%,transparent 50%);pointer-events:none}.header:after{content:"🧭";position:absolute;top:2rem;right:2rem;font-size:2.5rem;opacity:.2;animation:modernCompass 8s ease-in-out infinite;display:none}@keyframes modernCompass{0%,to{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.1)}}.header h1{font-size:4rem;font-weight:800;margin-bottom:1.5rem;text-shadow:0 4px 8px rgba(0,0,0,.3);position:relative;letter-spacing:-.025em}.header h1:before{content:"🏔️";position:absolute;left:-80px;top:50%;transform:translateY(-50%);font-size:2.5rem;opacity:.6}.header h1:after{content:"🏔️";position:absolute;right:-80px;top:50%;transform:translateY(-50%);font-size:2.5rem;opacity:.6}.header p{font-size:1.25rem;opacity:.9;max-width:600px;margin:0 auto;line-height:1.7;font-weight:400}.download-btn{background:linear-gradient(135deg,var(--accent-color),var(--accent-hover));color:#fff;border:none;padding:1rem 2rem;border-radius:16px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);margin-top:2.5rem;box-shadow:0 4px 20px #10b9814d;display:inline-flex;align-items:center;gap:.75rem;letter-spacing:.025em}.download-btn:hover{transform:translateY(-2px);box-shadow:0 8px 30px #10b98166;background:linear-gradient(135deg,var(--accent-hover),var(--accent-dark))}.footer{background:var(--footer-bg);color:#fff;padding:3rem 0;text-align:center;margin-top:auto;position:relative}.footer:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--accent-color),var(--accent-hover),var(--accent-dark));background-size:200% 100%;animation:modernTrail 4s ease-in-out infinite}.footer p{margin-bottom:.5rem;opacity:.8;font-weight:400}.footer a{color:var(--accent-color);text-decoration:none;transition:color .2s ease;font-weight:500}.footer a:hover{color:#34d399}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:2rem;margin-top:2rem}.section{padding:5rem 0;opacity:0;transform:translateY(20px);animation:modernFadeIn .6s ease forwards;position:relative}.section:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:80px;height:3px;background:linear-gradient(90deg,#10b981,#059669);border-radius:2px}.section:nth-child(3){animation-delay:.1s}.section:nth-child(4){animation-delay:.2s}.section:nth-child(5){animation-delay:.3s}.section:nth-child(6){animation-delay:.4s}.section:nth-child(7){animation-delay:.5s}.section:nth-child(8){animation-delay:.6s}.section:nth-child(9){animation-delay:.7s}.section:nth-child(10){animation-delay:.8s}@keyframes modernFadeIn{to{opacity:1;transform:translateY(0)}}.section-title{font-size:3rem;font-weight:800;color:var(--text-primary);text-align:center;margin-bottom:1rem;letter-spacing:-.025em;position:relative}.section-title:before{content:"🗺️";position:absolute;left:-60px;top:50%;transform:translateY(-50%);font-size:2rem;opacity:.5;display:none}.section-title:after{content:"🗺️";position:absolute;right:-60px;top:50%;transform:translateY(-50%);font-size:2rem;opacity:.5;display:none}.section-subtitle{font-size:1.125rem;color:var(--text-secondary);text-align:center;margin-bottom:3rem;font-weight:400;max-width:600px;margin-left:auto;margin-right:auto}.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:20px;padding:2.5rem;box-shadow:0 4px 6px var(--shadow-light),0 10px 15px var(--shadow-medium);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.card:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(16,185,129,.05),transparent);transition:left .5s ease}.card:hover:before{left:100%}.card:hover{transform:translateY(-8px);box-shadow:0 20px 25px var(--shadow-medium),0 10px 10px var(--shadow-light);border-color:#10b9814d}.card:after{content:"📍";position:absolute;top:1.5rem;right:1.5rem;font-size:1.25rem;opacity:.3}.card-title{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem;border-bottom:2px solid rgba(16,185,129,.2);padding-bottom:1rem;letter-spacing:-.025em}.card-title svg{color:var(--accent-color)}.card-content{color:var(--text-muted);line-height:1.7;font-weight:400}.card-content h4{color:var(--text-primary);font-weight:600;margin:2rem 0 .75rem;font-size:1.125rem;letter-spacing:-.025em}.card-content ul,.card-content ol{margin:.75rem 0;padding-left:1.5rem}.card-content li{margin-bottom:.75rem;position:relative;line-height:1.6}.card-content li:before{display:none}.step-list{counter-reset:step-counter}.step-list li{counter-increment:step-counter;margin-bottom:1.25rem;padding-left:3rem;position:relative}.step-list li:before{content:counter(step-counter);position:absolute;left:0;top:0;background:linear-gradient(135deg,#10b981,#059669);color:#fff;width:2rem;height:2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:600;box-shadow:0 2px 8px #10b9814d}.tip,.warning,.important{background:var(--bg-card);border-left:4px solid;padding:1.5rem;margin:1.5rem 0;border-radius:0 12px 12px 0;position:relative;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tip{border-left-color:var(--accent-color);background:#10b9810d}.tip:before{content:"💡";position:absolute;left:-30px;top:50%;transform:translateY(-50%);background:var(--bg-card);border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:.875rem;box-shadow:0 2px 8px var(--shadow-light)}.warning{border-left-color:#f59e0b;background:#f59e0b0d}.warning:before{content:"⚠️";position:absolute;left:-30px;top:50%;transform:translateY(-50%);background:var(--bg-card);border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:.875rem;box-shadow:0 2px 8px var(--shadow-light)}.important{border-left-color:#ef4444;background:#ef44440d}.important:before{content:"❗";position:absolute;left:-30px;top:50%;transform:translateY(-50%);background:var(--bg-card);border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:.875rem;box-shadow:0 2px 8px var(--shadow-light)}.video-placeholder{background:linear-gradient(135deg,#10b9810d,#3b82f60d);border:2px dashed rgba(16,185,129,.3);border-radius:20px;padding:4rem;text-align:center;margin:4rem 0;position:relative;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.video-placeholder:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 80%,rgba(16,185,129,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(59,130,246,.1) 0%,transparent 50%);pointer-events:none}.video-placeholder:hover{transform:scale(1.02);box-shadow:0 20px 40px var(--shadow-medium);border-color:#10b98180}.video-placeholder svg{color:var(--accent-color);margin-bottom:1.5rem;filter:drop-shadow(0 4px 8px rgba(16,185,129,.3))}.video-placeholder h3{color:var(--text-primary);font-size:1.75rem;margin-bottom:1rem;font-weight:700;letter-spacing:-.025em}.video-placeholder p{color:var(--text-secondary);font-weight:400;line-height:1.6}@media (max-width: 1024px){.header{margin-top:50px;padding:5rem 0 4rem}.header h1{font-size:2.75rem}.header h1:before,.header h1:after{display:none}.header p{font-size:1.125rem}.section{padding:3rem 0}.section-title{font-size:2.25rem}.section-title:before,.section-title:after{display:none}.grid{grid-template-columns:1fr;gap:1.5rem}.card{padding:2rem}.container{padding:0 1.5rem}}@media (max-width: 480px){.header h1{font-size:2.25rem}.section-title{font-size:2rem}.card-title{font-size:1.25rem}.nav-brand{font-size:1rem}.download-btn{padding:.875rem 1.75rem;font-size:.875rem}.container{padding:0 1rem}}