img {
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 100% !important;
}

/* Apply same flex container behavior to all three regions */
.layout__region.layout__region--first,
.layout__region.layout__region--second,
.layout__region.layout__region--third {
  display: flex;
  flex-direction: column; /* keep items stacked vertically */
  align-items: center;    /* center children horizontally */
  text-align: center;     /* center text inside children */
  gap: 0.75rem;           /* consistent spacing between items */
}

/* Opt-out utility for any child that should span full width */
.layout__region.layout__region--first > .stretch,
.layout__region.layout__region--second > .stretch,
.layout__region.layout__region--third > .stretch {
  align-self: stretch;
  width: 100%;
}


/* Fix first & third regions so content truly centers like the map */

/* Mobile: remove side padding from the three-col container */
@media (max-width: 767.98px) {
  .layout--threecol-section.layout--threecol-section--33-34-33 > .container {
    padding-left: 0;
    padding-right: 0;
  }

  /* Remove extra padding on the first and third regions themselves */
  .layout--threecol-33-34-33 > .layout__region--first,
  .layout--threecol-33-34-33 > .layout__region--third {
    padding-left: 0;
    padding-right: 0;
  }

  /* Make sure images in first/third are perfectly centered */
  .layout--threecol-33-34-33 > .layout__region--first img,
  .layout--threecol-33-34-33 > .layout__region--third img {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
}


@media (max-width: 767.98px) {
  .layout--threecol-section.layout--threecol-section--33-34-33
    .layout__region--first img,
  .layout--threecol-section.layout--threecol-section--33-34-33
    .layout__region--third img {
    display: block;
    box-sizing: border-box;   /* include padding in width so it doesn't overflow */
    width: 100%;              /* fill region */
    max-width: 100%;
    margin: 0 auto;           /* center if smaller than full width */
    padding: 0 12px;          /* equal left/right padding */
  }
}

.layout--threecol-section img {
  width: 100%;
  height: auto;
  display: block;
}

img {
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* DESKTOP: make right-column map fill the column */
@media (min-width: 768px) {
  /* Let the third region stretch children instead of centering them */
  .layout--threecol-section.layout--threecol-section--33-34-33
    .layout__region--third {
    align-items: stretch;        /* override any align-items:center */
    text-align: center;          /* keep text centered if you like */
  }

  /* Map container takes full column width */
  .layout--threecol-section.layout--threecol-section--33-34-33
    .layout__region--third .weather-map-desktop {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 0.75rem;          /* even left/right padding inside column */
    box-sizing: border-box;
  }

  /* Iframe fills that container */
  .layout--threecol-section.layout--threecol-section--33-34-33
    .layout__region--third .weather-map-desktop iframe {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 400px;               /* tweak height if needed */
  }
}


/*@media (min-width: 762px) {
  *, *::before, *::after {
    box-sizing: content-box !important;
  }
}
*/

  .layout--threecol-section.layout--threecol-section--33-34-33 img {
    display: block;
    max-width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }