@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap";@keyframes gradientAnimation{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes glow{0%{box-shadow:0 0 5px #4285f499}50%{box-shadow:0 0 20px #4285f4cc}to{box-shadow:0 0 5px #4285f499}}.homepage-container{background-color:#121212;color:#f5f5f5;font-family:Inter,sans-serif}.hero-section{display:flex;align-items:center;justify-content:center;text-align:center;min-height:80vh;padding:2rem;background:linear-gradient(-45deg,#1a237e,#283593,#1e88e5,#0d47a1);background-size:400% 400%;animation:gradientAnimation 20s ease infinite}.hero-content{animation:fadeInUp 1s ease-out}.hero-title{font-size:4.5rem;font-weight:700;margin-bottom:1rem;letter-spacing:-2px;background:linear-gradient(90deg,#a7c7e7,#fff,#a7c7e7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-fill-color:transparent}.hero-subtitle{font-size:1.25rem;max-width:600px;margin:0 auto 2.5rem;color:silver;line-height:1.7}.hero-cta-button{display:inline-flex;align-items:center;gap:12px;padding:1rem 2.5rem;background-color:#4285f4;color:#fff;font-size:1.1rem;font-weight:700;text-decoration:none;border-radius:8px;transition:transform .2s ease;animation:glow 4s linear infinite}.hero-cta-button:hover{transform:translateY(-4px)}.features-section{padding:5rem 2rem;text-align:center;background-color:#f4f7f9;border-top:1px solid #e0e0e0}.features-section h2{font-size:2.5rem;margin-bottom:4rem;color:#2c3e50}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2.5rem;max-width:1200px;margin:0 auto}.feature-card{background-color:#fff;padding:2.5rem;border-radius:16px;border:1px solid #dde3ea;transition:transform .3s ease,box-shadow .3s ease}.feature-card:hover{transform:translateY(-8px);box-shadow:0 15px 40px #34495e1f}.feature-icon{color:#4285f4;margin-bottom:1.5rem;transition:transform .3s ease}.feature-card:hover .feature-icon{transform:scale(1.1) rotate(-5deg)}.feature-card h3{font-size:1.5rem;margin-bottom:.75rem;color:#2c3e50}.feature-card p{color:#5a6a79;line-height:1.6}.footer{text-align:center;padding:3rem 2rem;background-color:#fff;color:#777;font-size:.9rem;border-top:1px solid #dde3ea}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.feature-card-link{text-decoration:none;color:inherit}body{font-family:Inter,sans-serif;background-color:#242424;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{height:100vh;width:100vw;margin:0;padding:0}.map-container{height:100%;width:100%}.panel{background:#282828bf;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.15);padding:30px;border-radius:16px;box-shadow:0 8px 32px #0000005e;z-index:10;color:#f5f5f5}.panel h1,.panel h2{color:#fff;margin-top:0;margin-bottom:10px}.panel p{color:#dcdcdc;line-height:1.5}.welcome-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:420px}.ui-panel{position:absolute;top:20px;left:20px;width:350px}.saved-routes-panel{position:absolute;top:20px;left:390px;width:300px}.choice-btn,.demo-route-btn,.save-route-btn,.view-routes-btn{width:100%;padding:15px;margin-top:15px;font-size:16px;font-weight:700;cursor:pointer;border-radius:8px;border:none;color:#fff;transition:transform .2s ease,box-shadow .2s ease;display:flex;align-items:center;gap:15px;justify-content:center}.choice-btn:hover,.demo-route-btn:hover,.save-route-btn:hover,.view-routes-btn:hover{transform:translateY(-3px);box-shadow:0 4px 15px #0003}.distance-checker-btn{background-color:#4285f4}.safe-route-btn{background-color:#34a853}.view-routes-btn{background-color:#fbbc05}.demo-route-btn{background-color:#4a90e2}.save-route-btn{background-color:#50c878}.back-btn{display:flex;align-items:center;gap:8px;background:none;border:none;color:#a4c4f9;cursor:pointer;font-weight:500;font-size:16px;margin-bottom:20px;padding:0}.back-btn:hover{color:#fff}.search-box{width:100%;padding:12px;border:1px solid rgba(255,255,255,.2);background:#0000004d;border-radius:8px;font-size:16px;color:#fff;box-sizing:border-box}.saved-routes-panel ul{list-style:none;padding:0;margin-top:20px}.saved-routes-panel li{padding:12px;border-bottom:1px solid rgba(255,255,255,.1);cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background-color .2s}.saved-routes-panel li:hover{background-color:#ffffff1a}.delete-route-btn{background-color:#ea4335;color:#fff;border:none;border-radius:50%;width:24px;height:24px;cursor:pointer;font-weight:700;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.delete-route-btn:hover{background-color:#d03d30}@keyframes pulse{0%{box-shadow:0 0 #1786ffb3}70%{box-shadow:0 0 0 20px #1786ff00}to{box-shadow:0 0 #1786ff00}}.user-location-marker{width:18px;height:18px;background-color:#1786ff;border:3px solid white;border-radius:50%;box-shadow:0 0 5px #0000004d;animation:pulse 2s infinite}.status-container{display:flex;align-items:center;gap:10px;min-height:24px}.loader{width:16px;height:16px;border:2px solid #f3f3f3;border-top:2px solid #4285F4;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}