.vem-weather { background: #f8b638; border-bottom: 1px solid rgba(1,55,57,.14); color: #063f41; font-family: "DM Sans", sans-serif; position: relative; z-index: 8; }
.vem-weather__inner { align-items: center; display: grid; gap: 24px; grid-template-columns: auto 1fr auto; margin: 0 auto; max-width: 1380px; min-height: 58px; padding: 7px 28px; }
.vem-weather__title { align-items: center; display: flex; font-size: .78rem; font-weight: 800; gap: 7px; margin: 0; text-transform: uppercase; white-space: nowrap; }
.vem-weather__title span { font-size: 1.15rem; }
.vem-weather__zones { align-items: center; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vem-weather__zone { align-items: center; border-left: 1px solid rgba(1,55,57,.18); display: grid; gap: 8px; grid-template-columns: 27px auto 37px 1fr; min-width: 0; padding: 0 20px; }
.vem-weather__zone > span:nth-child(2) { display: flex; flex-direction: column; line-height: 1.1; }
.vem-weather__zone b { font-size: .76rem; }
.vem-weather__zone small { font-size: .62rem; opacity: .72; }
.vem-weather__zone strong { font-size: 1.15rem; }
.vem-weather__icon { font-size: 1.45rem; line-height: 1; text-align: center; }
.vem-weather__condition { font-size: .69rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vem-weather__toggle { align-items: center; background: #075f62; border: 0; border-radius: 999px; color: #fff; cursor: pointer; display: flex; font-family: inherit; font-size: .7rem; font-weight: 700; gap: 8px; padding: 10px 15px; white-space: nowrap; }
.vem-weather__toggle:hover, .vem-weather__toggle:focus-visible { background: #034b4e; }
.vem-weather__toggle span { font-size: 1rem; transition: transform .2s ease; }
.vem-weather__toggle.is-open span { transform: rotate(180deg); }
.vem-weather__details { background: #fff8e9; border-top: 1px solid rgba(1,55,57,.13); box-shadow: 0 12px 25px rgba(1,55,57,.12); padding: 22px 28px 13px; }
.vem-weather__forecast { display: grid; gap: 16px; grid-template-columns: repeat(3, 1fr); margin: 0 auto; max-width: 1324px; }
.vem-weather__forecast article { background: #fff; border: 1px solid #ebdcc0; border-radius: 14px; padding: 17px; }
.vem-weather__forecast h2 { font-family: "DM Sans", sans-serif; font-size: .9rem; margin: 0 0 12px; }
.vem-weather__forecast h2 small { color: #607778; font-size: .65rem; font-weight: 500; margin-left: 5px; }
.vem-weather__days { display: grid; grid-template-columns: repeat(3, 1fr); }
.vem-weather__days > div { align-items: center; border-left: 1px solid #eee4d3; display: flex; flex-direction: column; gap: 3px; padding: 2px 8px; text-align: center; }
.vem-weather__days > div:first-child { border-left: 0; }
.vem-weather__days b { font-size: .65rem; }
.vem-weather__days strong { font-size: 1rem; }
.vem-weather__days strong small { color: #708485; font-size: .7rem; font-weight: 500; }
.vem-weather__days span:not(.vem-weather__day-icon) { font-size: .62rem; font-weight: 600; }
.vem-weather__days > div > small { color: #637879; font-size: .56rem; line-height: 1.4; }
.vem-weather__day-icon { font-size: 1.3rem; line-height: 1.15; }
.vem-weather__source { color: #667b7c; font-size: .55rem; margin: 9px auto 0; max-width: 1324px; text-align: right; }
.vem-weather__source a { color: inherit; text-decoration: underline; }

@media (max-width: 1024px) {
  .vem-weather__inner { gap: 12px; grid-template-columns: 1fr auto; padding-inline: 18px; }
  .vem-weather__title { display: none; }
  .vem-weather__zone { padding-inline: 12px; }
  .vem-weather__condition { display: none; }
  .vem-weather__forecast { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .vem-weather__inner { display: block; padding: 7px 12px 9px; }
  .vem-weather__zones { overflow-x: auto; scrollbar-width: none; }
  .vem-weather__zones::-webkit-scrollbar { display: none; }
  .vem-weather__zone { border-left: 0; grid-template-columns: 23px auto 32px; min-width: 150px; padding: 2px 10px; }
  .vem-weather__zone + .vem-weather__zone { border-left: 1px solid rgba(1,55,57,.18); }
  .vem-weather__icon { font-size: 1.2rem; }
  .vem-weather__toggle { justify-content: center; margin: 7px auto 0; padding: 7px 13px; }
  .vem-weather__details { padding: 14px 10px 10px; }
  .vem-weather__forecast article { padding: 13px 9px; }
  .vem-weather__days > div { padding-inline: 4px; }
}