/**
 * MumsandBubs custom styles — migrated from Customizer "Additional CSS"
 * (Renovation Task 2, 2026-07-04).
 *
 * The verbatim pre-migration blob is preserved at docs/customizer-css-backup.css
 * in the theme repo. Rules are kept byte-identical to the blob except for
 * grouping/section comments and these deletions (verified dead against the
 * full staging corpus — 113 posts + 9 pages, desktop + mobile markup):
 *
 *   - .ast-primary-header-bar { display:none }        Astra header no longer
 *   - footer#colophon { display:none }                 rendered (Task 1)
 *   - "FIX: GREEN HEADER BAR HEIGHT" block             all Astra header bars
 *     (.ast-primary-header-bar/.main-header-bar/.ast-above-header-bar
 *      min-heights + two media queries)                gone after Task 1
 *   - .elementor-2219 …-5a3cf31 shape-divider rule     page/template 2219 no
 *     longer exists; element 5a3cf31 now lives in the single-post template
 *     .elementor-3924 with a VISIBLE "waves" bottom divider. The old rule has
 *     been a no-op; re-scope to .elementor-3924 if the divider should be hidden.
 *   - body.single-post h3.ea-header                    .ea-header appears in
 *     zero posts/pages
 *
 * NOT deleted despite the sprint brief calling it empty: #wpforms-submit-17
 * has three live declarations and form 17's submit button exists on the
 * contact page.
 */

/* ====================================================================
   HOMEPAGE CARDS & SECTIONS
   ==================================================================== */

.ekit-wid-con .elementskit-post-image-card:hover .elementskit-entry-thumb>img {
    -webkit-transform: scale(1)!important;
    transform: scale(1)!important;
    opacity: 1!important;
}

/* --- Homepage editorial polish (July 2026) --- */
/* Hero: larger image column, balanced with headline */
.elementor-element-0324bfd .elementskit-post-image-card { align-items: center; }
.elementor-element-0324bfd .elementskit-entry-header { flex: 0 0 42%; max-width: 42%; }
.elementor-element-0324bfd .elementskit-entry-thumb { display: block; width: 100%; }
.elementor-element-0324bfd .elementskit-entry-thumb img { width: 100%; aspect-ratio: 3/2; object-fit: cover; border-radius: 10px; }
.elementor-element-0324bfd h2.entry-title, .elementor-element-0324bfd h3.entry-title { line-height: 1.22; }

/* Card grids: reserve image space (no lazy-load jump) */
.elementskit-entry-thumb img { aspect-ratio: 3/2; object-fit: cover; width: 100%; height: auto; }

/* Card grids: equal heights, Read More pinned to bottom */
.row.post-items { align-items: stretch; }
.row.post-items > [class*=col-] { display: flex; }
.row.post-items > [class*=col-] > .elementskit-post-image-card { width: 100%; }
.col-lg-4 .elementskit-post-image-card, .col-md-6 .elementskit-post-image-card { display: flex; flex-direction: column; height: 100%; }
.col-lg-4 .elementskit-post-image-card .elementskit-post-body, .col-md-6 .elementskit-post-image-card .elementskit-post-body { display: flex; flex-direction: column; flex: 1 1 auto; }
.col-lg-4 .elementskit-post-image-card .elementskit-btn, .col-md-6 .elementskit-post-image-card .elementskit-btn { margin-top: auto; align-self: flex-start; }

/* Card titles demoted h2→h3 (Renovation Task 3, inc/mnb-heading-filters.php)
   keep the exact visual sizing they had as h2. No other h3 carries
   .entry-title (verified across all posts/pages), so this only targets
   the demoted cards. */
h3.entry-title,
.elementor-kit-659 h3.entry-title {
  font-size: 28px !important;
  line-height: 1.3 !important;
  margin-bottom: 0.5em !important;
  margin-top: 1.2em !important;
}
@media (max-width: 921px) {
  h3.entry-title,
  .elementor-kit-659 h3.entry-title {
    font-size: 24px !important;
  }
}
@media (max-width: 544px) {
  h3.entry-title,
  .elementor-kit-659 h3.entry-title {
    font-size: 22px !important;
    line-height: 1.4 !important;
  }
}

/* Section headers: align View All with heading, style as pill */
.e-con-inner:has(.elementor-element-a9506a5), .e-con-inner:has(.elementor-element-d6d35d7), .e-con-inner:has(.elementor-element-cbf600a) { align-items: center; }
.elementor-element-a9506a5 .elementor-button, .elementor-element-d6d35d7 .elementor-button, .elementor-element-cbf600a .elementor-button { border: 1.5px solid #7fb3ae; border-radius: 999px; padding: 10px 24px; background: transparent; color: #35625d; transition: all .2s ease; }
.elementor-element-a9506a5 .elementor-button:hover, .elementor-element-d6d35d7 .elementor-button:hover, .elementor-element-cbf600a .elementor-button:hover { background: #7fb3ae; color: #fff; }

/* ====================================================================
   FORMS
   ==================================================================== */

.wpforms-container .wpforms-field-label {
    display: block;
    font-weight: 400!important;
    float: none;
    word-break: break-word;
    word-wrap: break-word;
    color: #4a4a4a!important;
}

#wpforms-submit-17{
    border-color: #e777a1!important;
    background-color: #e777a1!important;
    font-weight: 400!important;
}

/* ====================================================================
   GLOBAL TYPOGRAPHY & ELEMENTS
   (sections 1-11, 13-16, 19 of the original "Industry Average" sheet)
   ==================================================================== */

/* --- 1. Body typography --- */

body,
button,
input,
select,
textarea {
  font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 18px !important; /* Up from 16px - 78% of top sites use 17-18px */
  font-weight: 400 !important;
  line-height: 1.7 !important; /* Up from 1.5 - 89% of sites use 1.6-1.7 */
  color: #333333 !important; /* Darker from #4a4a4a - better contrast */
}

/* --- 2. Heading typography --- */

h1, h2, h3, h4, h5, h6,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.elementor-kit-659 h1,
.elementor-kit-659 h2,
.elementor-kit-659 h3,
.elementor-kit-659 h4,
.elementor-kit-659 h5,
.elementor-kit-659 h6 {
  font-family: 'Lato', 'Open Sans', sans-serif !important; /* Keep your excellent choice */
  font-weight: 700 !important;
  color: #222222 !important; /* Slightly darker for better hierarchy */
}

/* --- 3. H1 (Desktop: 36px, Tablet: 30px, Mobile: 28px) --- */

h1,
.entry-content h1,
.elementor-kit-659 h1,
header.entry-header .entry-title {
  font-size: 36px !important; /* Down from 40px - industry average 36-42px */
  line-height: 1.3 !important;
  margin-bottom: 0.6em !important;
  margin-top: 0 !important;
}

/* --- 4. H2 (Desktop: 28px, Tablet: 24px, Mobile: 22px) --- */

h2,
.entry-content h2,
.elementor-kit-659 h2 {
  font-size: 28px !important; /* Down from 56px - industry average 26-32px */
  line-height: 1.3 !important; /* Up from 1.0 - critical for multi-line headings */
  margin-bottom: 0.5em !important;
  margin-top: 1.2em !important; /* Add space above for visual separation */
}

/* --- 5. H3 (Desktop: 22px, Tablet: 20px, Mobile: 18px) --- */

h3,
.entry-content h3,
.elementor-kit-659 h3 {
  font-size: 22px !important; /* Down from 40px - industry average 20-26px */
  line-height: 1.4 !important; /* Up from 1.0 */
  margin-bottom: 0.4em !important;
  margin-top: 1.0em !important;
}

/* --- 6. H4-H6 --- */

h4,
.entry-content h4,
.elementor-kit-659 h4 {
  font-size: 19px !important; /* Down from 24px */
  line-height: 1.4 !important;
  margin-bottom: 0.4em !important;
}

h5,
.entry-content h5,
.elementor-kit-659 h5 {
  font-size: 17px !important; /* Down from 20px */
  line-height: 1.5 !important;
}

h6,
.entry-content h6,
.elementor-kit-659 h6 {
  font-size: 15px !important; /* Up from 13px */
  line-height: 1.5 !important;
}

/* --- 7. Paragraph & text spacing --- */

p,
.entry-content p {
  margin-bottom: 1.6em !important; /* Up from 1em - 96% of sites use 1.5-1.8em */
  line-height: 1.7 !important;
}

/* First paragraph - no top margin */
.entry-content > p:first-child {
  margin-top: 0 !important;
}

/* --- 8. Lists --- */

ul, ol {
  margin-bottom: 1.6em !important;
  padding-left: 1.8em !important;
}

li {
  margin-bottom: 0.5em !important;
  line-height: 1.7 !important;
}

/* Nested lists */
li ul,
li ol {
  margin-top: 0.5em !important;
  margin-bottom: 0.5em !important;
}

/* --- 9. Links --- */

a {
  color: #2c5282 !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

a:hover,
a:focus {
  color: #1a365d !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

/* Content links - subtle underline only on hover */
.entry-content a:not(.ast-button):not(.wp-block-button__link) {
  color: #2c5282 !important;
  text-decoration: none !important;
  font-weight: 400 !important;
}

.entry-content a:not(.ast-button):not(.wp-block-button__link):hover {
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 2px !important;
  color: #1a365d !important;
}

/* --- 10. Buttons --- */

.ast-button,
.wp-block-button__link,
.elementor-button,
.menu-toggle,
button,
.button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
  font-family: 'Lato', 'Open Sans', sans-serif !important;
  font-size: 16px !important; /* Up from 14px */
  font-weight: 600 !important; /* Down from 800 - less aggressive */
  line-height: 1.5 !important;
  text-transform: none !important; /* Remove uppercase - 71% of sites don't use it */
  letter-spacing: 0.5px !important; /* Down from 2px - less screamy */
  padding: 14px 28px !important; /* More generous padding */
  border-radius: 6px !important; /* Slightly more rounded */
  transition: all 0.3s ease !important;
}

.ast-button:hover,
.wp-block-button__link:hover,
.elementor-button:hover,
button:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* --- 11. Blockquotes --- */

blockquote {
  font-size: 20px !important;
  line-height: 1.6 !important;
  font-style: italic !important;
  color: #555555 !important;
  border-left: 4px solid #f47c7c !important;
  padding-left: 1.5em !important;
  margin: 1.8em 0 !important;
}

blockquote p {
  margin-bottom: 1em !important;
}

blockquote cite {
  font-size: 16px !important;
  font-style: normal !important;
  color: #666666 !important;
}

/* --- 13. Content width --- */

.entry-content[data-ast-blocks-layout] > * {
  max-width: 720px !important; /* Down from 750px - industry average 680-720px */
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Keep wide elements full width */
.entry-content .alignwide,
.entry-content .alignfull {
  max-width: 100% !important;
}

/* --- 14. Images --- */

.entry-content img {
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  margin-bottom: 1.6em !important;
}

figure {
  margin-bottom: 1.6em !important;
}

figcaption {
  font-size: 15px !important;
  color: #666666 !important;
  font-style: italic !important;
  text-align: center !important;
  margin-top: 0.5em !important;
}

/* --- 15. Code blocks --- */

code {
  background: #f5f5f5 !important;
  padding: 0.2em 0.4em !important;
  border-radius: 3px !important;
  font-size: 0.9em !important;
  font-family: 'Courier New', Courier, monospace !important;
  color: #d63384 !important;
}

pre {
  background: #f5f5f5 !important;
  padding: 1.5em !important;
  border-radius: 6px !important;
  overflow-x: auto !important;
  margin-bottom: 1.6em !important;
  border: 1px solid #e0e0e0 !important;
}

pre code {
  background: transparent !important;
  padding: 0 !important;
  color: #333333 !important;
}

/* --- 16. Accessibility (focus states) --- */

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
  outline: 3px solid #f47c7c !important;
  outline-offset: 2px !important;
}

/* --- 19. Font smoothing --- */

body,
h1, h2, h3, h4, h5, h6 {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
}

/* ====================================================================
   COMPARISON TABLES
   ==================================================================== */

/* --- 12. Tables (generic) --- */

table {
  margin-bottom: 1.6em !important;
  line-height: 1.6 !important;
  font-size: 16px !important;
  border-collapse: collapse !important;
  width: 100% !important;
}

th, td {
  padding: 0.8em 1em !important;
  border: 1px solid #e0e0e0 !important;
  text-align: left !important;
}

th {
  background-color: #f8f8f8 !important;
  font-weight: 600 !important;
}

tr:nth-child(even) {
  background-color: #fafafa !important;
}

/* --- Comparison table fixes (July 2026) --- */
.entry-content table,
.elementor-widget-theme-post-content table {
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  table-layout: auto;
  border-collapse: collapse;
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}
.entry-content table th, .entry-content table td,
.elementor-widget-theme-post-content table th,
.elementor-widget-theme-post-content table td {
  min-width: 90px;
  padding: 10px 12px;
  vertical-align: top;
  line-height: 1.45;
  word-break: normal !important;
  overflow-wrap: normal !important;
}
.entry-content table th,
.elementor-widget-theme-post-content table th {
  background: #2d6a64 !important; /* was #7fb3ae — white text 2.34:1 fail; deep-teal token = 6.70:1 (Sprint 9 T2) */
  color: #fff !important;
  text-align: left;
}
.entry-content table tbody tr:nth-child(even),
.elementor-widget-theme-post-content table tbody tr:nth-child(even) {
  background: #f4f9f8;
}

/* Legacy per-article scroll helper (used in ~40 posts) */
@media only screen and (max-width: 767px) {

.fix-mobile-scroll{
    overflow-x: scroll;
}
}

/* ====================================================================
   SINGLE POST
   ==================================================================== */

body.single-post p, body.single-post .entry-content p{
	margin-bottom: 1em !important;
	line-height:1.3em!important;
}

body.single-post ul,
body.single-post ol{
	padding-left: 0em!important;
	margin-bottom: 1em !important;
}

body.single-post li {
    margin-bottom: 0.5em !important;
    line-height: 1.1em !important;
}

body.single-post a.orange-btn{
	display: inline-block;
	background: #c2410c; /* was #ff6b35 — white text 2.83:1 fail; token accent = 5.18:1 (Sprint 9 T2) */
	color: white!important;
	padding: 15px 40px;
	text-decoration: none;
	border-radius: 5px;
	font-weight: bold;
	font-size: 18px;
	box-shadow: 0 4px 6px rgba(0,0,0,0.1);
	transition: transform 0.2s;
}

body.single-post a.orange-btn-small{
	display: inline-block;
	background: #c2410c; /* was #ff6b35 — white text 2.83:1 fail; token accent = 5.18:1 (Sprint 9 T2) */
	color: white!important;
	padding: 5px 15px;
	text-decoration: none;
	border-radius: 5px;
	font-weight: bold;
	font-size: 16px;
	box-shadow: 0 4px 6px rgba(0,0,0,0.1);
	transition: transform 0.2s;
}

/* ====================================================================
   RESPONSIVE (tablet ≤921px, mobile ≤544px)
   ==================================================================== */

@media (max-width: 921px) {
  body {
    font-size: 17px !important; /* Slightly smaller on tablet */
  }

  h1,
  .entry-content h1,
  .elementor-kit-659 h1 {
    font-size: 30px !important; /* Down from 48px */
  }

  h2,
  .entry-content h2,
  .elementor-kit-659 h2 {
    font-size: 24px !important; /* Down from 40px */
  }

  h3,
  .entry-content h3,
  .elementor-kit-659 h3 {
    font-size: 20px !important;
  }

  h4,
  .entry-content h4 {
    font-size: 18px !important;
  }

  blockquote {
    font-size: 18px !important;
  }

  table {
    font-size: 15px !important;
  }
}

@media (max-width: 544px) {
  body {
    font-size: 17px !important; /* Maintain readable size on mobile */
  }

  h1,
  .entry-content h1,
  .elementor-kit-659 h1 {
    font-size: 28px !important;
    line-height: 1.3 !important;
  }

  h2,
  .entry-content h2,
  .elementor-kit-659 h2 {
    font-size: 22px !important;
    line-height: 1.4 !important;
  }

  h3,
  .entry-content h3,
  .elementor-kit-659 h3 {
    font-size: 18px !important;
  }

  h4,
  .entry-content h4 {
    font-size: 17px !important;
  }

  blockquote {
    font-size: 17px !important;
    padding-left: 1em !important;
  }

  .ast-button,
  .wp-block-button__link,
  button {
    font-size: 15px !important;
    padding: 12px 24px !important;
  }

  table {
    font-size: 14px !important;
  }

  th, td {
    padding: 0.6em 0.8em !important;
  }
}

/* ====================================================================
   PRINT
   ==================================================================== */

@media print {
  body {
    font-size: 12pt !important;
    line-height: 1.5 !important;
    color: #000000 !important;
  }

  a {
    text-decoration: underline !important;
  }

  a[href]:after {
    content: " (" attr(href) ")" !important;
  }
}

/* ====================================================================
   MISC ELEMENTOR OVERRIDES (working element-ID selectors, kept as-is)
   ==================================================================== */

/* Terms & Conditions (page 1828) and Privacy Policy (page 1888):
   suppress section background image on element 58gg2hm */
.elementor-1828 .elementor-element.elementor-element-58gg2hm::before{
	background-image:none!important;
}

.elementor-1888 .elementor-element.elementor-element-58gg2hm::before{
	background-image:none!important;
}