/* Serenity Ultrasound — typography and component styles that sit on top of the
   compiled utility stylesheet. Loaded after site.css.
   ------------------------------------------------------------------------- */

/* Long-form editor content: legal pages, blog posts, the extra copy blocks on
   service and contact pages. (.post-body is the blog CARD body, not this.) */
.article-body {
  color: #4a4a4a;
  font-size: 1rem;
  line-height: 1.75;
}
.article-body > * + * { margin-top: 1.15rem; }
.article-body h2 {
  margin-top: 2.75rem;
  font-size: 1.5rem;
  line-height: 1.3;
  font-weight: 700;
  color: #123a63;
}
.article-body h3 {
  margin-top: 2rem;
  font-size: 1.15rem;
  line-height: 1.4;
  font-weight: 700;
  color: #123a63;
}
.article-body h4 {
  margin-top: 1.75rem;
  font-size: 1.02rem;
  font-weight: 700;
  color: #123a63;
}
.article-body > h2:first-child,
.article-body > h3:first-child { margin-top: 0; }
.article-body ul,
.article-body ol { padding-left: 1.35rem; }
.article-body ul { list-style: disc; }
.article-body ol { list-style: decimal; }
.article-body li + li { margin-top: .4rem; }
.article-body li::marker { color: #8388da; }
.article-body a {
  color: #8388da;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.article-body a:hover { color: #6c71c4; }
.article-body strong { color: #123a63; }
.article-body hr {
  margin-top: 2.25rem;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, .1);
}
.article-body address { font-style: normal; }
.article-body blockquote {
  border-left: 3px solid #8388da;
  padding-left: 1rem;
  color: #123a63;
}

/* Tables inside long-form content scroll sideways rather than breaking the
   page on a phone. */
.article-body table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  font-size: .95rem;
}
.article-body th,
.article-body td {
  border: 1px solid rgba(0, 0, 0, .1);
  padding: .6rem .8rem;
  text-align: left;
  vertical-align: top;
}
.article-body thead th {
  background: #f3f3fb;
  color: #123a63;
  font-weight: 700;
}
.article-body tbody tr:nth-child(2n) { background: rgba(0, 0, 0, .02); }

/* Ninja Forms on the contact page, kept in the brand's shapes and colours.
   Selectors carry the plugin's own .ninja-forms-field / .nf-element classes so
   they outrank the plugin stylesheet without needing !important. */
.serenity-form .nf-form-title { display: none; }
.serenity-form .nf-field-container { margin-bottom: 1.1rem; }
.serenity-form .nf-field-label label {
  font-weight: 600;
  color: #123a63;
  font-size: .95rem;
}
.serenity-form .nf-field-hp { display: none !important; }
.serenity-form input.ninja-forms-field[type="text"],
.serenity-form input.ninja-forms-field[type="email"],
.serenity-form input.ninja-forms-field[type="tel"],
.serenity-form input.ninja-forms-field[type="number"],
.serenity-form select.ninja-forms-field,
.serenity-form textarea.ninja-forms-field,
.serenity-form input[type="text"],
.serenity-form input[type="email"],
.serenity-form input[type="tel"],
.serenity-form input[type="number"],
.serenity-form select,
.serenity-form textarea {
  width: 100%;
  font: inherit;
  color: #1f2937;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: .65rem;
  padding: .7rem .9rem;
}
.serenity-form textarea,
.serenity-form textarea.ninja-forms-field { min-height: 9rem; }
.serenity-form input:focus,
.serenity-form textarea:focus,
.serenity-form select:focus {
  outline: 2px solid #8388da;
  outline-offset: 1px;
  border-color: #8388da;
}
.serenity-form input.ninja-forms-field[type="submit"],
.serenity-form input.ninja-forms-field[type="button"],
.serenity-form input[type="button"],
.serenity-form input[type="submit"],
.serenity-form button[type="submit"] {
  background: #8388da;
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: .85rem 1.9rem;
  font-weight: 700;
  letter-spacing: .02em;
  cursor: pointer;
  transition: background-color .15s ease;
}
.serenity-form input.ninja-forms-field[type="submit"]:hover,
.serenity-form input.ninja-forms-field[type="button"]:hover,
.serenity-form input[type="button"]:hover,
.serenity-form input[type="submit"]:hover,
.serenity-form button[type="submit"]:hover { background: #6c71c4; }
.serenity-form .nf-error-msg { color: #b42318; font-size: .85rem; }

/* Pagination on the blog index. */
.pagination .page-numbers,
.nav-links .page-numbers {
  display: inline-block;
  min-width: 2.5rem;
  margin: 0 .2rem;
  padding: .5rem .75rem;
  border: 1px solid rgba(0, 0, 0, .1);
  border-radius: .6rem;
  color: #123a63;
  font-weight: 600;
  text-decoration: none;
}
.pagination .page-numbers.current,
.nav-links .page-numbers.current {
  background: #8388da;
  border-color: #8388da;
  color: #fff;
}
.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* Cookie consent banner (inc/consent.php). Sits above the page, does not
   block it, and is reopened from the "Cookie settings" link in the footer. */
.su-consent {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 60;
  background: #fff;
  border-top: 1px solid rgba(0, 0, 0, .08);
  box-shadow: 0 -8px 30px rgba(18, 58, 99, .12);
}
.su-consent[hidden] { display: none; }
.su-consent__inner {
  max-width: 78rem;
  margin: 0 auto;
  padding: 1.1rem 5%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
}
.su-consent__text {
  flex: 1 1 24rem;
  font-size: .9rem;
  line-height: 1.6;
  color: #4a4a4a;
}
.su-consent__title {
  font-weight: 700;
  color: #123a63;
  margin-bottom: .15rem;
}
.su-consent__text a { color: #8388da; text-decoration: underline; }
.su-consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-left: auto;
}
/* Leave room on the right so the floating WhatsApp button never sits over
   the consent buttons. */
.su-consent__inner { padding-right: calc(5% + 11.5rem); }
@media (max-width: 640px) {
  .su-consent__inner { padding-right: calc(5% + 3.5rem); }
  .su-consent__actions { width: 100%; }
  .su-consent__actions .btn { flex: 1 1 auto; text-align: center; }
}

/* Paragraph rhythm inside editable copy blocks.
   PM Suite's Visual Editor wraps field paragraphs in its own div, so the
   compiled `.prose-flow > p` rule never matched and multi-paragraph fields ran
   together. Matching on descendants covers both the wrapped and unwrapped case. */
.prose-flow p { margin-top: 0; }
.prose-flow p + p { margin-top: 1em; }
.prose-flow ul,
.prose-flow ol { margin-top: 1em; padding-left: 1.25rem; }
.prose-flow ul { list-style: disc; }
.prose-flow ol { list-style: decimal; }

/* Floating WhatsApp button, bottom right on every page. Sits above the
   cookie banner so it is never covered, and shrinks a little on phones. */
.su-whatsapp {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 70;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .75rem 1.15rem .75rem .85rem;
  border-radius: 999px;
  background: #25d366;
  color: #fff;
  font-weight: 600;
  font-size: .95rem;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .22);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.su-whatsapp:hover,
.su-whatsapp:focus-visible { background: #1ebe5b; color: #fff; transform: translateY(-2px); box-shadow: 0 14px 32px rgba(0, 0, 0, .26); }
.su-whatsapp svg { width: 1.6rem; height: 1.6rem; flex: none; fill: currentColor; }
@media (max-width: 640px) {
  .su-whatsapp { right: 1rem; bottom: 1rem; padding: .85rem; }
  .su-whatsapp span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}