html {
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

body {
  overflow-x: hidden;
}

img,
video,
iframe,
table {
  max-width: 100%;
}

img {
  height: auto;
}

iframe {
  display: block;
}

input,
select,
textarea,
button {
  max-width: 100%;
}

.entry-content table,
.single-post-content table {
  display: block;
  overflow-x: auto;
  width: 100%;
}

@media (max-width: 921px) {
  .main-header-bar {
    padding: 10px 0 !important;
  }

  .main-header-bar .ast-container {
    padding-right: 16px;
    padding-left: 16px;
  }

  .ast-flex.main-header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
  }

  .site-branding {
    min-width: 0;
  }

  .ast-site-identity {
    display: flex;
    align-items: center;
    min-width: 0;
  }

  .site-logo-img {
    flex: 0 0 auto;
    padding-right: 10px !important;
  }

  header .custom-logo-link img,
  .site-header .site-logo-img .custom-logo-link img,
  .ast-header-break-point .site-branding img,
  .ast-header-break-point .custom-logo-link img,
  .cms-public-shell .custom-logo-link img {
    width: 56px !important;
    max-width: 56px !important;
  }

  .site-description {
    display: block !important;
    overflow-wrap: anywhere;
    color: #3a3a3a;
    font-size: 13px !important;
    line-height: 1.35 !important;
  }

  .ast-mobile-menu-buttons {
    display: block !important;
    margin-left: auto;
  }

  .main-header-menu-toggle {
    min-width: 44px;
    min-height: 44px;
    padding: 10px 12px !important;
    letter-spacing: 0 !important;
  }

  .ast-main-header-bar-alignment {
    display: none;
    flex-basis: 100%;
    width: 100%;
  }

  body.is-menu-open .ast-main-header-bar-alignment,
  .cms-public-shell.is-menu-open .ast-main-header-bar-alignment {
    display: block;
  }

  body.is-menu-open .main-header-bar-navigation,
  .cms-public-shell.is-menu-open .main-header-bar-navigation {
    display: block !important;
  }

  .main-header-menu {
    display: grid !important;
    width: 100%;
    padding: 8px 0 0 !important;
  }

  .main-header-menu .menu-item,
  .main-header-menu .ast-masthead-custom-menu-items {
    width: 100%;
    border-top: 1px solid #e5e5e5;
  }

  .main-header-menu .menu-link {
    display: block;
    padding: 13px 0 !important;
    line-height: 1.35;
  }

  .ast-search-menu-icon,
  .ast-search-menu-icon form.search-form,
  .ast-search-menu-icon .search-field {
    width: 100% !important;
  }

  .ast-search-menu-icon {
    padding: 10px 0;
  }

  .ast-search-icon {
    display: none;
  }

  .search-field {
    min-height: 42px;
    padding: 10px 12px !important;
    border: 1px solid #d6dde3 !important;
  }

  .elementor-section.elementor-section-boxed > .elementor-container,
  .ast-container,
  .site-content > .ast-container {
    width: min(100%, 100vw);
    max-width: 100%;
  }

  .elementor-container {
    flex-wrap: wrap;
  }

  .elementor-column,
  .elementor-col-25,
  .elementor-col-33,
  .elementor-col-50,
  .elementor-col-66,
  .elementor-col-100 {
    width: 100% !important;
  }

  .elementor-widget-wrap {
    padding-right: 18px !important;
    padding-left: 18px !important;
  }

  .elementor-section,
  .elementor-top-section,
  .elementor-inner-section {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .elementor-section-height-min-height {
    min-height: auto !important;
  }

  .elementor-spacer-inner {
    max-height: 32px;
  }

  h1,
  .entry-content :where(h1),
  .entry-content :where(h1) a,
  .elementor-widget-heading h1.elementor-heading-title {
    font-size: clamp(30px, 9vw, 40px) !important;
    line-height: 1.2 !important;
  }

  h2,
  .entry-content :where(h2),
  .entry-content :where(h2) a,
  .elementor-widget-heading h2.elementor-heading-title {
    font-size: clamp(24px, 7vw, 32px) !important;
    line-height: 1.25 !important;
  }

  h3,
  .entry-content :where(h3),
  .entry-content :where(h3) a,
  .elementor-widget-heading h3.elementor-heading-title {
    font-size: clamp(21px, 6vw, 27px) !important;
    line-height: 1.3 !important;
  }

  .entry-content,
  .single-post-content,
  .elementor-widget-text-editor {
    font-size: 16px;
    line-height: 1.7;
  }

  .entry-content p,
  .single-post-content p {
    overflow-wrap: anywhere;
  }

  .wp-block-button .wp-block-button__link,
  .elementor-button,
  .ast-button,
  .button,
  input[type="button"],
  input[type="submit"] {
    min-height: 44px;
    white-space: normal;
  }

  .cms-public-footer__inner {
    display: grid;
    gap: 22px;
  }

  .cms-public-footer nav {
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .ast-separate-container #content .ast-container,
  .site-content > .ast-container {
    padding-right: 14px !important;
    padding-left: 14px !important;
  }

  .ast-separate-container .ast-article-single,
  .ast-separate-container .ast-article-post,
  .page-content-card {
    margin: 22px 0 40px !important;
    padding: 20px !important;
    border-radius: 8px;
  }

  .single-post-title {
    font-size: 30px !important;
    line-height: 1.2 !important;
  }

  .single-post-content h2 {
    font-size: 24px !important;
  }

  .single-post-content h3 {
    font-size: 21px !important;
  }

  .single-post-gallery {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .public-posts,
  .devotion-grid,
  .testimonies-grid {
    grid-template-columns: 1fr !important;
    padding-right: 16px !important;
    padding-left: 16px !important;
  }

  .testimony-feature,
  .testimony-card {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 20px !important;
  }

  .testimony-card__mark,
  .testimony-feature .testimony-card__mark {
    width: 54px;
    height: 54px;
  }

  .posts-hero {
    padding: 34px 16px 22px !important;
  }

  .posts-hero h1 {
    font-size: 34px !important;
  }

  .category-tabs {
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 4px;
    flex-wrap: nowrap;
  }

  .category-tabs button {
    flex: 0 0 auto;
  }

  .lightbox {
    padding: 16px;
  }

  .lightbox button {
    top: 10px;
    right: 10px;
  }
}
