.weather{margin-top:30px;text-align:center}.weather-image{font-size:20px}.weather h1{font-size:80px;font-weight:700;color:#1a4d6d}.weather h2{font-size:55px;font-weight:500;margin-top:20px;color:#000}.weather .description{color:#929293}.weather .details{display:flex;justify-content:space-between;align-items:stretch;margin-top:10px;padding:0 20px}.weather .details i{font-size:80px;margin-top:15px}.weather .details p{font-size:28px;margin-top:15px}.weather .details .col{width:190px;border-radius:6px;transition:all .3s ease}.weather .details .col:hover{background:#dddddf;color:#fff;box-shadow:0 4px 10px #00000080;transform:translateY(-3px)}.search-box{position:relative;width:100%;display:flex;align-items:center;justify-content:center;gap:8px;margin:20px auto;max-width:400px}.search-box input{flex:1;padding:8px 12px;border-radius:6px;border:1px solid #ccc;font-size:16px;outline:none;transition:.2s}.search-box input:focus{border-color:#0078ff;box-shadow:0 3px 16px #0078ff66}.search-box .icon-btn{background:#fff;border:none;font-size:20px;cursor:pointer;color:#6c6e6f;transition:.2s;border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;box-shadow:2px 2px 8px #00000026}.search-box .icon-btn:hover{background:#b0b1b2;color:#1a4d6d;transform:scale(1.05)}.search-box .clear-btn{color:#ff4c4c}.search-box .clear-btn:hover{background:#b0b1b2;color:#ff4c4c}.container{position:relative;width:400px;margin:50px auto;padding:28px 32px;background:#fff;border-radius:16px;box-shadow:0 8px 24px #00000026;font-family:Lato,sans-serif;transition:all .3s ease;overflow:hidden}.container:hover{transform:translateY(-3px);box-shadow:0 12px 32px #0003}.container .search-wrapper{display:flex;flex-direction:column}.container .search-wrapper .suggestions-list{background:#fff;border:1px solid #ccc;width:100%;max-height:180px;overflow-y:auto;border-radius:4px;z-index:10}.container .search-wrapper .suggestions-list li{padding:6px 10px;cursor:pointer}.container .search-wrapper .suggestions-list li:hover{background:#f0f0f0}*{padding:0;margin:0;box-sizing:border-box;outline:none;border:0}body{background:linear-gradient(135deg,#74ebd5,#acb6e5);min-height:100vh;display:flex;align-items:center;justify-content:center}.container{display:block;position:relative;background-color:#fff;width:500px;padding:28px 32px;overflow:hidden;border-radius:18px;font-family:"Lato" sans-serif}