/*
 * MyIPScan blog repair layer.
 * Purpose: prevent mobile clipping without changing the visual direction.
 * Version: 1.0.2
 */

html,
body,
body.mips-blog {
  max-width: 100%;
  overflow-x: hidden;
}

body.mips-blog #page,
body.mips-blog .site,
body.mips-blog #content,
body.mips-blog .site-content,
body.mips-blog .ast-container,
body.mips-blog #primary,
body.mips-blog .content-area,
body.mips-blog main,
body.mips-blog article,
body.mips-blog .entry-content,
body.mips-blog .mips-main {
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

body.mips-blog *,
body.mips-blog *::before,
body.mips-blog *::after {
  min-width: 0;
}

body.mips-blog .mips-wrap,
body.mips-blog .mips-wrap-narrow,
body.mips-blog .mips-topnav-inner {
  max-width: calc(100vw - 32px) !important;
}

body.mips-blog .mips-hero,
body.mips-blog .mips-section,
body.mips-blog .mips-article-shell,
body.mips-blog .mips-footer {
  max-width: 100vw;
  overflow-x: hidden;
}

body.mips-blog .mips-hero-grid,
body.mips-blog .mips-post-grid,
body.mips-blog .mips-related-grid,
body.mips-blog .mips-footer-cols {
  max-width: 100%;
}

body.mips-blog .mips-blog h1,
body.mips-blog h1,
body.mips-blog h2,
body.mips-blog h3,
body.mips-blog .mips-lede,
body.mips-blog .mips-content,
body.mips-blog .mips-content p,
body.mips-blog .mips-content li,
body.mips-blog .mips-post-card,
body.mips-blog .mips-post-card h2,
body.mips-blog .mips-post-card h3 {
  max-width: 100%;
  overflow-wrap: break-word;
  word-break: normal;
}

body.mips-blog .mips-actions,
body.mips-blog .mips-post-nav,
body.mips-blog .mips-pagination {
  flex-wrap: wrap;
}

body.mips-blog .mips-btn,
body.mips-blog .mips-actions .mips-btn,
body.mips-blog .mips-hero-card .mips-btn {
  max-width: 100%;
  white-space: normal;
}

body.mips-blog .mips-article,
body.mips-blog .mips-hero-card,
body.mips-blog .mips-post-card,
body.mips-blog .mips-related,
body.mips-blog #ez-toc-container,
body.mips-blog .ez-toc-container {
  max-width: 100%;
  overflow-x: hidden;
}

body.mips-blog .mips-content table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

body.mips-blog .mips-content img,
body.mips-blog .mips-content video,
body.mips-blog .mips-content iframe {
  max-width: 100%;
  height: auto;
}

@media (max-width: 640px) {
  body.mips-blog .mips-wrap,
  body.mips-blog .mips-wrap-narrow,
  body.mips-blog .mips-topnav-inner {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  body.mips-blog .mips-hero-grid,
  body.mips-blog .mips-post-grid,
  body.mips-blog .mips-related-grid,
  body.mips-blog .mips-footer-cols {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.mips-blog .mips-hero-copy,
  body.mips-blog .mips-article-header,
  body.mips-blog .mips-content,
  body.mips-blog .mips-section-head,
  body.mips-blog .mips-post-card,
  body.mips-blog .mips-related {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.mips-blog .mips-blog h1,
  body.mips-blog h1,
  body.mips-blog .mips-article-header h1 {
    width: 100% !important;
    max-width: calc(100vw - 48px) !important;
    font-size: clamp(27px, 7.4vw, 30px) !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  body.mips-blog .mips-content h2,
  body.mips-blog h2 {
    font-size: clamp(23px, 7vw, 28px) !important;
    line-height: 1.16 !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  body.mips-blog .mips-article {
    width: 100% !important;
    padding: 18px !important;
  }

  body.mips-blog .mips-primary-nav {
    left: 16px;
    right: 16px;
    max-width: calc(100vw - 32px);
  }

  body.mips-blog .mips-post-card h2,
  body.mips-blog .mips-post-card h3 {
    font-size: 22px !important;
  }

  body.mips-blog .mips-lede,
  body.mips-blog .mips-content,
  body.mips-blog .mips-content p,
  body.mips-blog .mips-content li,
  body.mips-blog .mips-post-card p,
  body.mips-blog #ez-toc-container,
  body.mips-blog .ez-toc-container {
    width: 100% !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }
}