.city-guide-teaser{background:var(--surface)}
.city-guide-teaser .city-guide-photo img{border-radius:var(--r-xl)}
.city-guide-teaser h2{font-size:34px;line-height:1.22;letter-spacing:-.7px;margin:12px 0 18px}
.city-guide-teaser-panel{display:flex;flex-direction:column;align-self:stretch;gap:24px;min-width:0}
.city-guide-teaser-copy{margin-block:auto;min-width:0}
.city-guide-teaser .city-guide-teaser-button{min-height:48px;padding:7px 18px 7px 20px;border-radius:14px;gap:16px}
.city-guide-teaser-button-arrow{display:grid;place-items:center;flex:none;width:32px;height:32px;border:1px solid #ffffff80;border-radius:50%}
.city-guide-teaser-button-arrow svg{display:block;width:20px;height:20px}
.city-guide-teaser-socials{display:grid;gap:12px;margin-top:24px}
.city-guide-teaser-socials .city-guide-teaser-social-link{display:grid;grid-template-columns:42px minmax(0,1fr) 20px;align-items:center;gap:14px;min-height:80px;padding:16px;border:1px solid var(--blue-100);border-radius:var(--r-lg);background:var(--blue-50);color:var(--ink);text-decoration:none;box-sizing:border-box;transition:background .2s,border-color .2s}
.city-guide-teaser-social-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--blue);color:#fff}
.city-guide-teaser-social-icon svg{display:block;width:23px;height:23px}
.city-guide-teaser-social-copy{display:grid;gap:3px;min-width:0}
.city-guide-teaser-social-copy strong{font-size:15px;line-height:1.45;font-weight:650}
.city-guide-teaser-social-copy>span{font-size:13px;line-height:1.55;color:var(--muted)}
.city-guide-teaser-social-arrow{display:block;width:20px;height:20px;color:var(--blue);transition:transform .2s}
.city-guide-teaser-socials .city-guide-teaser-social-link:hover{background:#e5edff;border-color:#c4d3ff}
.city-guide-teaser-social-link:hover .city-guide-teaser-social-arrow{transform:translateX(2px)}
.city-weather{align-self:flex-end;width:320px;max-width:100%;margin:0;padding:12px 14px 10px;border:1px solid var(--blue-100);border-radius:14px;background:#fff;box-sizing:border-box;color:var(--ink)}
.city-weather[hidden],.city-weather [hidden]{display:none!important}
.city-weather-main{display:flex;align-items:center;gap:10px;min-height:40px}
.city-weather-icon{display:grid;place-items:center;flex:none;width:36px;height:36px;color:var(--blue);border-radius:11px;background:var(--blue-50)}
.city-weather-icon svg{width:24px;height:24px;display:block}
.city-weather-icon[data-symbol="sun"],.city-weather-icon[data-symbol="partly"]{color:#b47900;background:#fff7df}
.city-weather-temperature{font-size:28px;font-weight:750;line-height:1;letter-spacing:-1px;white-space:nowrap}
.city-weather-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.city-weather-heading{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.city-weather-copy>strong{font-size:13px;line-height:1.4;font-weight:650}
.city-weather-wind{font-size:11px;line-height:1.4;color:var(--muted)}
.city-weather-wind:empty{display:none}
.city-weather-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 8px;border-top:1px solid var(--line);margin-top:8px;padding-top:6px;font-size:11px;line-height:1.6;color:var(--muted)}
.city-weather-meta a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.city-weather-retry{padding:8px 0;border:0;background:none;color:var(--blue);font:inherit;font-size:12px;font-weight:650;cursor:pointer}
.city-weather-retry:focus-visible{outline:3px solid var(--blue);outline-offset:4px;border-radius:3px}
.city-weather.is-unavailable .city-weather-main{flex-wrap:wrap;gap:12px}
.city-weather.is-unavailable .city-weather-temperature{display:none}
.city-weather.is-unavailable .city-weather-copy{flex:1}
.city-weather.is-unavailable .city-weather-retry{flex-basis:100%;text-align:left}
@media(max-width:1000px){.city-guide-teaser h2{font-size:30px}.city-guide-teaser-socials .city-guide-teaser-social-link{gap:12px;padding:14px}.city-guide-teaser-social-copy strong{font-size:14px}}
@media(max-width:700px){.city-guide-teaser h2{font-size:27px;letter-spacing:-.45px}.city-guide-teaser-copy{margin:0}.city-guide-teaser-socials{margin-top:24px}}
@media(max-width:360px){.city-guide-teaser-socials .city-guide-teaser-social-link{grid-template-columns:36px minmax(0,1fr) 16px;gap:10px;padding:12px}.city-guide-teaser-social-icon{width:36px;height:36px}.city-guide-teaser-social-icon svg{width:21px;height:21px}.city-guide-teaser-social-arrow{width:16px;height:16px}}
@media(prefers-reduced-motion:reduce){.city-guide-teaser-socials .city-guide-teaser-social-link,.city-guide-teaser-social-arrow{transition:none}}