/* Fixes on top of the Webflow stylesheet (2026-10-14). Nothing here changes
   the design at phone or desktop widths. */

/* Services grid: four fixed-width cards (13rem + 20px margins) overflowed the
   viewport between 992px and ~1100px, cutting off the fourth card and adding a
   horizontal scrollbar. Let the cards fill their grid column in that range. */
@media screen and (min-width: 992px) and (max-width: 1099px) {
  .grid .div-block-2 { width: auto; }
}

/* Services page title is an h1 now (the page had none); these are the exact
   sizes the h2 had at every Webflow breakpoint, so it renders the same.
   Scoped to the services page: the about and contact titles were h1s already. */
html[data-wf-page="66ad241f819b3c15eb9fac5b"] h1.page-title { font-size: 45px; line-height: 1.25; margin-top: 0; margin-bottom: 0; font-weight: 700; }
@media screen and (min-width: 1280px) { html[data-wf-page="66ad241f819b3c15eb9fac5b"] h1.page-title { font-size: 52px; } }
@media screen and (min-width: 1440px) { html[data-wf-page="66ad241f819b3c15eb9fac5b"] h1.page-title { font-size: 64px; } }
@media screen and (max-width: 991px) { html[data-wf-page="66ad241f819b3c15eb9fac5b"] h1.page-title { font-size: 40px; } }
@media screen and (max-width: 767px) { html[data-wf-page="66ad241f819b3c15eb9fac5b"] h1.page-title { font-size: 32px; } }
@media screen and (max-width: 479px) { html[data-wf-page="66ad241f819b3c15eb9fac5b"] h1.page-title { font-size: 28px; line-height: 1.26; } }

/* Desktop header: the logo (98-110px tall) hung 11-17px below the header's
   1px bottom border, so the line ran through "Commercial Insurance Agency".
   Give the header room for the logo; nothing else moves except the line and
   the content below it, by 24px. */
@media screen and (min-width: 992px) {
  .header-section { min-height: 130px; }
}
