/* Footer live badge embed (embed.js) */
.ksb-footer-badge {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 0 0 36px;
}

.ksb-footer-badge > a,
.ksb-footer-badge > span {
  display: inline-block;
  max-width: 100%;
}

.ksb-footer-badge img,
.ksb-footer-badge svg {
  display: block;
  max-width: min(240px, 100%);
  height: auto;
}

@media (max-width: 720px) {
  .ksb-footer-badge {
    padding-bottom: 28px;
  }
}

/* Marketing site — mobile layout overrides for baked static pages */

.ksb-nav-cta-short {
  display: none;
}

@media (max-width: 900px) {
  /* Two-column hero / content / signup / contact grids */
  div[style*="grid-template-columns: 1.35fr"],
  div[style*="grid-template-columns: 1.4fr"],
  div[style*="grid-template-columns: 1.3fr"],
  div[style*="grid-template-columns: 1.1fr"],
  div[style*="grid-template-columns: 1fr 1.15fr"],
  div[style*="grid-template-columns: 1fr 1fr"]:not([style*="auto 1fr"]) {
    grid-template-columns: 1fr !important;
  }

  /* Badge benefit rows: checkmark stays left, copy stacks beside it */
  div[style*="minmax(220px, 300px)"],
  .ksb-benefit-row {
    grid-template-columns: auto 1fr !important;
    grid-template-rows: auto auto;
    align-items: start;
    row-gap: 8px !important;
    column-gap: 16px !important;
  }

  div[style*="minmax(220px, 300px)"] > svg:first-child,
  .ksb-benefit-row > svg:first-child {
    grid-column: 1;
    grid-row: 1 / span 2;
    margin-top: 2px;
  }

  div[style*="minmax(220px, 300px)"] > h3,
  .ksb-benefit-row > h3 {
    grid-column: 2;
    grid-row: 1;
  }

  div[style*="minmax(220px, 300px)"] > p,
  .ksb-benefit-row > p {
    grid-column: 2;
    grid-row: 2;
  }

  /* Icon + text bullet rows (consumer page, install steps) */
  div[style*="grid-template-columns: auto 1fr"],
  .ksb-check-row {
    grid-template-columns: auto 1fr !important;
    align-items: start;
  }

  div[style*="grid-template-columns: auto 1fr"] > svg,
  .ksb-check-row > svg {
    flex-shrink: 0;
  }
}

@media (max-width: 720px) {
  /* Narrower page gutters */
  header > div[style*="max-width: 1180px"],
  header > .ksb-header,
  section > div[style*="max-width: 1180px"],
  footer > div[style*="max-width: 1180px"],
  main .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  header > div[style*="max-width: 1180px"],
  header > .ksb-header {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
  }

  .ksb-header > a:first-child {
    flex-shrink: 0;
    min-width: 0;
  }

  .ksb-logo-text {
    font-size: 11px;
    letter-spacing: -0.01em;
  }

  /* Mobile nav: logo + essential actions only */
  .ksb-nav {
    width: auto !important;
    flex: 0 1 auto;
    margin-left: auto;
    justify-content: flex-end;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    font-size: 12.5px !important;
  }

  .ksb-nav a:not(.ksb-nav-cta):not(.ksb-nav-keep) {
    display: none !important;
  }

  .ksb-nav-cta {
    margin-left: 0;
    white-space: nowrap;
    padding: 8px 12px !important;
    font-size: 12px !important;
  }

  .ksb-nav-keep {
    white-space: nowrap;
  }

  .ksb-nav-cta-long {
    display: none;
  }

  .ksb-nav-cta-short {
    display: inline !important;
  }

  /* Three-up cards / photo grids */
  div[style*="repeat(3, 1fr)"] {
    grid-template-columns: 1fr !important;
  }

  /* Four-up stat / style grids → 2 columns */
  div[style*="repeat(4,"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* Footer link columns */
  div[style*="grid-template-columns: 2fr"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  /* Hero / CTA button rows */
  .ksb-hero-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .ksb-hero-actions a {
    justify-content: center !important;
    text-align: center;
  }

  /* Tighter section spacing */
  section[style*="padding: 96px"],
  section[style*="padding: 88px"],
  section[style*="padding: 84px"],
  section[style*="padding: 120px"] {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }
}

@media (max-width: 520px) {
  div[style*="repeat(4,"] {
    grid-template-columns: 1fr !important;
  }
}

/* Prevent grid children from squishing below content width */
div[style*="display: grid"] > * {
  min-width: 0;
}