.cold-content .hero-temperature{--range-progress:0;position:absolute;right:clamp(48px,22vw,420px);top:28px;bottom:auto;width:268px;padding:18px 22px 16px;overflow:hidden;isolation:isolate;border:0;border-radius:0;color:#214a76;background:transparent;box-shadow:none}
.hero-temperature::before{content:none}
.hero-temperature-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.hero-temperature-top>span{font-size:10px;font-weight:500;letter-spacing:.16em;color:inherit}.hero-temperature-toggle{width:30px;height:30px;display:grid;place-items:center;background:transparent;color:inherit;border:0;border-radius:50%;opacity:.65;cursor:pointer;padding:6px}.hero-temperature-toggle:hover{background:#ffffff18}.hero-temperature-toggle:focus-visible{outline:2px solid #fff;outline-offset:3px}.hero-temperature-toggle svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.hero-temperature-reading{display:flex;align-items:center;gap:10px;margin:8px 0 14px;line-height:1}.hero-temperature-reading>span{font-size:62px;letter-spacing:-2px;font-weight:400;font-variant-numeric:tabular-nums;min-width:108px}.hero-temperature-reading>small{font-size:28px;font-weight:400;align-self:flex-start;margin-top:8px}.cold-content .hero-thermometer{width:25px;height:46px;stroke:currentColor;stroke-width:1;fill:none;margin-right:5px}.hero-thermometer circle{fill:none;stroke:currentColor;stroke-width:1}.hero-temperature-track{position:relative;height:1px;background:#214a7640;border-radius:9px}.hero-temperature-track i{display:block;width:calc(var(--range-progress)*100%);height:100%;background:linear-gradient(90deg,#3684bd,#53d5ed);border-radius:9px;position:relative}.hero-temperature-track i::after{content:'';position:absolute;right:-3px;top:-3px;width:7px;height:7px;border-radius:50%;background:#d9f8ff;border:1px solid #328bb7;box-shadow:0 0 12px #87e6ff55}.hero-temperature-scale{display:flex;justify-content:space-between;font-size:11px;margin-top:16px;color:inherit;font-variant-numeric:tabular-nums}
@media(max-width:1100px) and (min-width:701px){.cold-content .hero-temperature{right:14%;top:24px;bottom:auto;width:226px;padding:15px 18px}.hero-temperature-top>span{font-size:8px}.hero-temperature-reading>span{font-size:54px;min-width:94px}.hero-temperature-reading>small{font-size:23px}}
@media(max-width:700px){.cold-content .hero-temperature{right:20px;top:auto;bottom:48px;width:190px;padding:12px 15px;border-radius:0;color:#fff}.hero-temperature-top>span{font-size:7px;letter-spacing:.08em}.hero-temperature-toggle{width:27px;height:27px}.hero-temperature-reading{gap:5px;margin:5px 0 10px}.hero-temperature-reading>span{font-size:44px;min-width:78px}.hero-temperature-reading>small{font-size:21px;margin-top:5px}.cold-content .hero-thermometer{width:19px;height:35px;margin-right:3px}.hero-temperature-scale{font-size:9px}}

.hero-temperature-track::after{content:"";position:absolute;left:0;right:0;top:4px;height:4px;background:repeating-linear-gradient(90deg,currentColor 0,currentColor 1px,transparent 1px,transparent calc(100% / 12));opacity:.3;pointer-events:none}
@media(max-width:700px){.hero-temperature-track{background:#ffffff50}.hero-temperature-toggle{opacity:.8}}