.weather-card{margin-top:24px;padding:22px;border:1px solid #d4ae35;border-radius:16px;background:#f5cc4b;color:#173d32;text-align:left;box-shadow:0 4px 16px #36533a0a}
.hours .weather-card h4{margin:0 0 14px;font-family:inherit;font-size:1.2rem;line-height:1.35;font-weight:600;color:#173d32}
.weather-values{display:grid;grid-template-columns:54px 1fr;gap:3px 14px;align-items:center}.weather-values[hidden]{display:none}.weather-icon{grid-row:span 2;font-size:2.6rem;text-align:center}.weather-temperature{font-size:2rem;font-weight:650;line-height:1.2}.weather-condition{font-size:1rem}.weather-wind{grid-column:1/-1;margin-top:10px;font-weight:600;font-size:1rem}
.hours .weather-card .weather-status{margin:14px 0 8px;font-size:.83rem;line-height:1.5;color:#294638}.weather-source{font-size:.72rem;line-height:1.5}.weather-source a{color:inherit;text-decoration:underline;text-underline-offset:3px}.weather-source a:focus-visible{outline:2px solid #173d32;outline-offset:3px}
@media(max-width:480px){.weather-card{padding:18px}.weather-temperature{font-size:1.8rem}}

.hero-weather{padding:22px 20px 8px;background:#f3e7c2}.hero-weather .weather-card{max-width:920px;margin:0 auto;padding:20px 26px;display:grid;grid-template-columns:1fr 1fr;gap:4px 28px;align-items:center;scroll-margin-top:190px}.hero-weather h2{margin:0;font-family:inherit;font-size:1.25rem;line-height:1.4;font-weight:600;color:#173d32}.hero-weather .weather-values{grid-column:2;grid-row:1/4;grid-template-columns:45px auto auto;gap:4px 12px}.hero-weather .weather-icon{grid-row:1/3}.hero-weather .weather-temperature{font-size:1.8rem}.hero-weather .weather-condition{grid-column:2}.hero-weather .weather-wind{grid-column:3;grid-row:1/3;margin:0;font-size:.95rem;white-space:nowrap}.hero-weather .weather-status{margin:7px 0 2px;font-size:.8rem;line-height:1.5}.hero-weather .weather-source{font-size:.7rem;line-height:1.5}@media(max-width:700px){.hero-weather{padding:16px 16px 4px}.hero-weather .weather-card{display:block;padding:18px;max-width:480px}.hero-weather h2{font-size:1.1rem;margin-bottom:12px}.hero-weather .weather-values{grid-template-columns:42px auto auto;gap:4px 10px}.hero-weather .weather-temperature{font-size:1.65rem}.hero-weather .weather-wind{font-size:.83rem}.hero-weather .weather-status{margin-top:12px}.hero-weather .weather-source{font-size:.68rem}}

#weather-title{scroll-margin-top:210px}