:root{--navy:#12365a;--blue:#2467a5;--ink:#182536;--muted:#6d7c8d;--line:#e6ebf0;--bg:#f5f7fa;--white:#fff;--shadow:0 12px 34px rgba(21,48,76,.07)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,sans-serif}.site-header{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(5vw,20px)}.brand{display:flex;align-items:center;gap:10px;color:var(--navy);font-size:21px;font-weight:800;text-decoration:none;letter-spacing:-.7px}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:var(--navy);color:white;font-size:20px}.brand-dot{color:#2784c7}.header-actions{display:flex;align-items:center;gap:20px}.country-label{font-size:12px;color:var(--muted)}button{font:inherit;cursor:pointer}.btn{border:0;border-radius:9px;padding:10px 14px;font-weight:600}.btn-outline{background:#fff;border:1px solid #d9e2eb;color:var(--navy)}.container{width:min(1160px,90%);margin:0 auto}.hero{margin:34px 0 24px;padding:42px 44px;border-radius:22px;background:linear-gradient(120deg,#102f50,#194e7b);color:#fff;display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;overflow:visible}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:800;color:#5b91bf}.hero .eyebrow{color:#9ec8e9}.hero h1{font-size:clamp(34px,4.5vw,53px);line-height:1.08;letter-spacing:-2px;margin:13px 0}.hero h1 span{color:#9ed5f8}.hero-copy p{color:#d5e4f0;max-width:390px;line-height:1.7;font-size:14px}.location-panel{background:#fff;color:var(--ink);border-radius:16px;padding:20px;box-shadow:0 15px 35px #071d3430}.location-panel label{display:block;font-size:12px;font-weight:700;margin-bottom:10px}.search-wrap{height:46px;border:1px solid #dce4ec;border-radius:9px;display:flex;align-items:center;padding-left:12px;gap:8px}.search-wrap>span{font-size:24px;color:#71859a}.search-wrap input{min-width:0;flex:1;border:0;outline:0;font:inherit;font-size:12px}.search-wrap button{height:36px;margin-right:4px;padding:0 13px;border:0;border-radius:7px;background:var(--blue);color:#fff;font-size:12px;font-weight:700}.city-results{position:relative;z-index:5}.city-option{width:100%;text-align:left;padding:10px;border:0;border-bottom:1px solid var(--line);background:#fff;color:var(--ink);font-size:12px}.city-option:hover{background:#f1f6fa}.current-location{margin-top:14px;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px}.pulse{width:7px;height:7px;border-radius:50%;background:#21a56b;box-shadow:0 0 0 4px #21a56b20}.date-strip{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 24px;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow)}.small-label{display:block;color:#8795a4;font-size:9px;font-weight:800;letter-spacing:1.2px;margin-bottom:7px}.date-strip strong{font-size:21px;color:var(--navy);letter-spacing:-.5px}.date-right{text-align:right}.date-right strong{font-size:15px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:38px 0 16px}.section-heading h2,.info-section h2{font-size:24px;letter-spacing:-.8px;margin:6px 0 0}.updated{font-size:10px;color:#8b98a6}.dashboard-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.data-card{min-height:218px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:19px;box-shadow:var(--shadow)}.card-top{display:flex;justify-content:space-between;align-items:center}.card-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;font-size:20px;font-weight:700}.weather-icon{background:#fff4dc;color:#bd861c}.air-icon{background:#e9f5f1;color:#23856b}.gold-icon{background:#fff5e3;color:#b27c20}.silver-icon{background:#edf2f7;color:#6d8297}.card-tag{font-size:8px;letter-spacing:1px;color:#9aa5b1;font-weight:800}.card-title{font-size:12px;color:#657587;margin:17px 0 4px}.metric{display:flex;align-items:baseline;gap:5px}.metric strong{font-size:40px;letter-spacing:-2px;color:var(--navy)}.metric span{font-size:12px;color:#718092}.card-sub{font-size:11px;color:#8a97a4;margin:2px 0 17px}.card-foot{border-top:1px solid #edf0f3;padding-top:12px;display:flex;justify-content:space-between;gap:8px;color:#8995a1;font-size:9px}.card-foot b{color:#536477}.placeholder-metric strong{color:#aeb9c4}.attribution{font-size:10px;color:#8995a1;margin:13px 2px}.attribution a{color:#477da7}.info-section{margin:50px 0;background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px;display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}.info-section p{max-width:470px;color:var(--muted);font-size:12px;line-height:1.8}.feature-list{display:grid;gap:16px}.feature-list>div{display:flex;gap:13px;align-items:center}.feature-list>div>span{font-size:12px;color:#7da4c5;font-weight:800}.feature-list b,.feature-list small{display:block}.feature-list b{font-size:12px}.feature-list small{font-size:10px;color:#8995a1;margin-top:4px}.site-footer{min-height:85px;background:#fff;border-top:1px solid var(--line);padding:20px max(5vw,20px);display:flex;justify-content:space-between;align-items:center;color:#8a97a4;font-size:10px}.footer-brand{font-size:16px}.footer-brand .brand-mark{width:28px;height:28px;font-size:16px}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#173b5e;color:#fff;padding:11px 16px;border-radius:9px;font-size:12px;transition:.2s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:900px){.dashboard-grid{grid-template-columns:repeat(2,1fr)}.hero{padding:30px;grid-template-columns:1fr}.hero-copy p{margin-bottom:8px}}@media(max-width:560px){.site-header{height:64px}.country-label{display:none}.header-actions{gap:0}.btn-outline{font-size:10px;padding:9px}.brand{font-size:18px}.container{width:92%}.hero{margin-top:18px;padding:25px 20px;border-radius:16px;gap:20px}.hero h1{font-size:38px}.date-strip{padding:15px}.date-strip strong{font-size:18px}.date-right strong{font-size:12px}.dashboard-grid{gap:9px}.data-card{padding:14px;min-height:205px}.metric strong{font-size:34px}.card-foot{font-size:8px}.section-heading h2{font-size:21px}.info-section{grid-template-columns:1fr;padding:23px;gap:18px;margin:32px 0}.site-footer{align-items:flex-start;gap:14px;flex-direction:column}}
