body{margin:0;font-family:Inter,Tahoma,sans-serif;background:#222831;color:#eee;line-height:1.6;display:flex;flex-direction:column;min-height:100vh}.navbar{position:fixed;top:0;right:0;left:0;height:70px;background:#393e46;display:flex;justify-content:space-between;align-items:center;padding:0 5%;box-shadow:0 5px 20px #0006;z-index:1000}.logo{font-size:22px;font-weight:700;color:#00adb5}.nav-menu{display:flex;list-style:none;align-items:center;margin:0;padding:0}.nav-menu li a{text-decoration:none;color:#00adb5;margin-right:20px;font-weight:600;font-size:15px;transition:.3s}.nav-menu li a:hover{color:#eee}.logout-btn{background:transparent;border:2px solid #ef4444;color:#ef4444;padding:6px 15px;border-radius:8px;cursor:pointer;font-weight:700;margin-right:20px;transition:.3s}.logout-btn:hover{background:#ef4444;color:#fff}.register-btn{background:#00adb5;color:#222831!important;padding:8px 18px;border-radius:20px}body{padding-top:80px}.hero{text-align:center;padding:60px 20px}.hero h1{font-size:clamp(26px,5vw,40px);margin-bottom:15px}.hero p{color:#b0bec5;margin-bottom:30px}.main-btn{background:#00adb5;color:#222831;padding:12px 32px;border-radius:30px;text-decoration:none;font-weight:700;display:inline-block;transition:.3s}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:25px;padding:40px 5%}.card{background:#393e46;padding:30px;border-radius:18px;text-align:center;box-shadow:0 10px 30px #0000004d}.card .icon{font-size:40px;margin-bottom:15px}@media(max-width:768px){.menu-toggle{display:block;cursor:pointer}.menu-toggle .bar{display:block;width:25px;height:3px;margin:5px auto;background-color:#00adb5;transition:all .3s ease-in-out}.nav-menu{position:absolute;top:70px;left:-100%;flex-direction:column;background-color:#393e46;width:100%;text-align:center;transition:.3s;box-shadow:0 10px 20px #0000004d;padding:20px 0}.nav-menu.active{left:0}.nav-menu li{margin:15px 0}.nav-menu li a,.logout-btn{margin:0;font-size:18px}.is-active .bar:nth-child(2){opacity:0}.is-active .bar:nth-child(1){transform:translateY(8px) rotate(45deg)}.is-active .bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}}footer{background:#393e46;padding:20px;text-align:center;border-top:2px solid #00ADB5}
