/*
 * Profmed Phase 1 — overrides.css
 * Built by Digital Thread / Faith & Fear — May 2026
 *
 * ============================================================
 * CONFIRMED BRAND PALETTE (from XD — May 2026)
 * ============================================================
 *
 * PRIMARY
 *   Black      #000000
 *   White      #F5F5F5
 *   Grey       #AFB8B3  ← also used as dark-section background
 *
 * SECONDARY
 *   Blue       #6786F9  (RGB 102,135,250 / CMYK 59%,46%,0%,2%)
 *   Orange     #FF6E42  (PANTONE 811)
 *   Lime       #D3F12F  (RGB 213,242,48 / PANTONE 388C / CMYK 22%,0%,93%,0%)
 *   Aubergine  #581845  (PANTONE 5115)
 *
 * BENEFIT OPTION COLOURS
 *   ProPinnacle  #ED2B47  (red-pink)
 *   ProSecure    #632A7E  (purple)
 *   ProActive    #02AF79  (green)
 *   ProSelect    #F79719  (orange)
 *
 * ============================================================
 * STRUCTURE
 *   1.  CSS custom properties (design tokens)
 *   2.  Global resets & base
 *   3.  Typography
 *   4.  Buttons
 *   5.  Section utilities
 *   6.  Navigation
 *   7.  Footer
 *   8.  Homepage
 *   9.  Who Qualifies
 *   10. Benefit Options
 *   11. Contact / Join
 *   12. Mobile global tweaks
 *   13. Utility classes
 * ============================================================
 */


/* ============================================================
   0. FONT-FACE OVERRIDES
   Fix: parent theme style.css hardcodes https://profmed.co.za/ URLs.
   These declarations use relative paths so the dev server (and any
   future server) loads fonts from its own /wp-content/themes/Profmed/fonts/
   folder instead of the live production site.
   Relative path from this file → ../Profmed/fonts/
   ============================================================ */

/* 100 — Thin */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-Thin.eot');
    src: url('../Profmed/fonts/JosefinSans-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

/* 100 — Thin Italic */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-ThinItalic.eot');
    src: url('../Profmed/fonts/JosefinSans-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

/* 200 — ExtraLight */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-ExtraLight.eot');
    src: url('../Profmed/fonts/JosefinSans-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

/* 200 — ExtraLight Italic */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-ExtraLightItalic.eot');
    src: url('../Profmed/fonts/JosefinSans-ExtraLightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

/* 300 — Light */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-Light.eot');
    src: url('../Profmed/fonts/JosefinSans-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

/* 300 — Light Italic */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-LightItalic.eot');
    src: url('../Profmed/fonts/JosefinSans-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

/* 400 — Regular */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-Regular.eot');
    src: url('../Profmed/fonts/JosefinSans-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* 400 — Italic */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-Italic.eot');
    src: url('../Profmed/fonts/JosefinSans-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

/* 500 — Medium */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-Medium.eot');
    src: url('../Profmed/fonts/JosefinSans-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* 500 — Medium Italic */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-MediumItalic.eot');
    src: url('../Profmed/fonts/JosefinSans-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

/* 600 — SemiBold */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-SemiBold.eot');
    src: url('../Profmed/fonts/JosefinSans-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* 600 — SemiBold Italic */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-SemiBoldItalic.eot');
    src: url('../Profmed/fonts/JosefinSans-SemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

/* 700 — Bold */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-Bold.eot');
    src: url('../Profmed/fonts/JosefinSans-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

/* 700 — Bold Italic */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../Profmed/fonts/JosefinSans-BoldItalic.eot');
    src: url('../Profmed/fonts/JosefinSans-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}


/* ============================================================
   1. CSS CUSTOM PROPERTIES
   ============================================================ */
:root {
  /* Primary */
  --color-black:       #000000;
  --color-white:       #F5F5F5;
  --color-pure-white:  #FFFFFF;
  --color-grey:        #AFB8B3;
  --color-dark-bg:     #AFB8B3;

  /* Secondary */
  --color-blue:        #6786F9;
  --color-orange:      #FF6E42;
  --color-lime:        #D3F12F;
  --color-aubergine:   #581845;

  /* Benefit plan colours */
  --color-propinnacle: #ED2B47;
  --color-prosecure:   #754691;
  --color-proactive:   #02AF79;
  --color-proselect:   #F79719;
  --color-prosecureplus: #632A7E;

  /* Text & UI */
  --color-text:        #333333;
  --color-border:      #E0E0E0;
  --color-light-bg:    #F5F5F5;

  /* Typography */
  --font-primary:  'Josefin Sans', sans-serif;
  --fw-light:      300;
  --fw-regular:    400;
  --fw-semibold:   600;
  --fw-bold:       700;

  /* Spacing */
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  2rem;
  --space-lg:  3rem;
  --space-xl:  5rem;

  /* Buttons */
  --btn-radius:  100px;
  --btn-padding: 1rem 2rem;
}


/* ============================================================
   2. HIDE PARENT THEME HEADER & FOOTER
   ============================================================ */

/* Header — hide everything the parent theme outputs */
.wrapper-navbar,
.wrapper-fluid,
#wrapper-navbar,
.top-nav,
nav.navbar,
.ContactModal,
#contactModal,
#contactCTA,
#searchModal {
    display: none !important;
}

/* Hide WordPress page/post title injected by parent theme template */
.entry-title,
.page-title,
.post-title,
.wp-block-post-title,
.page-header,
h1.entry-title,
h2.entry-title,
.site-main > article > header,
.entry-header {
    display: none !important;
}

/* Footer — replaced by child theme footer.php */
#wrapper-footer,
.site-footer,
#colophon {
    display: none !important;
}

/* ALL buttons — rounded pill on everything site-wide */
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.btn,
.button,
.wp-block-button__link,
.cmplz-manage-consent,
#cmplz-manage-consent,
.cmplz-btn {
    border-radius: 100px !important;
}

/* Complianz "Manage consent" button — smaller than site buttons */
.cmplz-manage-consent,
#cmplz-manage-consent,
.cmplz-btn.cmplz-manage-consent,
button.cmplz-manage-consent {
    font-size: 0.65rem !important;
    padding: 0.35rem 0.85rem !important;
    border-radius: 100px !important;
    min-height: unset !important;
    height: auto !important;
    line-height: 1.4 !important;
}

/* "Get in Touch" floating button — parent theme relic */
#contactCTA,
.contactCTA {
    display: none !important;
}

/* Hide all sidebars + widget areas + blog meta completely */
#right-sidebar,
#left-sidebar,
.widget-area,
.sidebar,
#secondary,
#wrapper-footer-full,
#footer-full-content,
.blogRow,
.blog-sidebar,
aside.widget-area,
/* WP blog/archive search + widgets */
.widget_search,
.widget_recent_entries,
.widget_recent_comments,
.widget_archive,
.widget_categories,
.widget_meta,
.widget_tag_cloud,
.widget_calendar {
    display: none !important;
}

/* Make content full-width when sidebar is gone */
.col-md-9,
.col-md-8 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ── Full-bleed layout — remove ALL side gaps ── */
html,
body {
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: clip;   /* clip (not hidden) → contains full-bleed WITHOUT breaking position:sticky */
    width: 100%;
}

#page,
.hfeed,
.site,
.site-content,
#content,
.entry-content,
.container,
.container-fluid,
.wp-site-blocks,
.is-root-container {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* WordPress block editor outer wrapper */
.wp-block-post-content,
.entry-content > *,
.wp-block-group {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
}

/*
 * Force every Phase 1 section to be truly full-viewport-width
 * regardless of any parent container width Bootstrap or WP applies.
 * Uses the standard "full-bleed inside constrained parent" trick.
 */
.home-hero,
.benefit-glance-section,
.testimonials-section,
.why-profmed-section,
.additional-benefits-section,
.app-section {
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}


/* ============================================================
   3. PHASE 1 CUSTOM NAV
   ============================================================ */

#pm-phase1-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1rem;
    transition: background 0.25s ease, box-shadow 0.25s ease;
    pointer-events: none; /* default: let clicks through transparent bar */
}

/* ── HERO STATE: transparent bar, only hamburger ── */
#pm-phase1-nav[data-state="hero"] {
    background: transparent;
}
#pm-phase1-nav[data-state="hero"] .pm-nav-logo    { display: none; }
#pm-phase1-nav[data-state="hero"] .pm-nav-contact { display: none; }
#pm-phase1-nav[data-state="hero"] .pm-nav-hamburger {
    pointer-events: all;
}

/* ── CONTACT STATE: scroll-down, CONTACT ME full-width ── */
#pm-phase1-nav[data-state="contact"] {
    background: #000;
    padding: 0.75rem 1.25rem;
    pointer-events: none;
    align-items: stretch;
}
#pm-phase1-nav[data-state="contact"] .pm-nav-logo      { display: none; }
#pm-phase1-nav[data-state="contact"] .pm-nav-hamburger { display: none; }
#pm-phase1-nav[data-state="contact"] .pm-nav-contact {
    pointer-events: all;
    flex: 1;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── STICKY STATE: scroll-up, white bar with logo + hamburger ── */
#pm-phase1-nav[data-state="sticky"] {
    background: var(--color-white);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    pointer-events: all;
}
#pm-phase1-nav[data-state="sticky"] .pm-nav-contact { display: none; }

/* Tablet/iPad: keep menu button when scrolling (contact state hides it on desktop) */
@media (max-width: 1199px) {
    #pm-phase1-nav[data-state="contact"] {
        flex-direction: row;
        align-items: center;
        pointer-events: all;
    }
    #pm-phase1-nav[data-state="contact"] .pm-nav-hamburger {
        display: flex !important;
        pointer-events: all;
    }
    #pm-phase1-nav[data-state="contact"] .pm-nav-contact {
        flex: 1;
        margin-right: 0.75rem;
    }
}

/* ── Hamburger button — always pinned to right ── */
.pm-nav-hamburger {
    background: #000;
    border: none;
    border-radius: 100px;   /* full pill shape */
    width: 68px;
    height: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    padding: 0 16px;
    flex-shrink: 0;
    margin-left: auto;   /* pushes hamburger to far right in every nav state */
}
.pm-nav-hamburger span {
    display: block;
    width: 100%;
    height: 2px;
    background: var(--color-lime);   /* lime lines */
    border-radius: 2px;
}

/* ── CONTACT ME pill ── */
.pm-nav-contact {
    display: inline-block;
    background: var(--color-lime) !important;
    color: #000 !important;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 1.2rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.85rem 2rem;
    border-radius: var(--btn-radius);
    transition: opacity 0.2s;
}
.pm-nav-contact:link,
.pm-nav-contact:visited { color: #000 !important; background: var(--color-lime) !important; }
.pm-nav-contact:hover { opacity: 0.85; text-decoration: none; color: #000 !important; }

/* Hide "CONTACT ME" nav button when already on the contact page */
body.page-id-1582 .pm-nav-contact { display: none !important; }

/* ── Logo in sticky nav ── */
.pm-nav-logo { display: flex; align-items: center; }
.pm-nav-logo img { height: 22px; width: auto; display: block; }


/* ============================================================
   4. GLOBAL RESETS & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--font-primary);
  font-size: 25px;
  color: var(--color-text);
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

/* Remove WPBakery wrapper padding */
.vc_row,
.wpb_column,
.vc_column_container > .vc_column-inner {
  padding-left: 0 !important;
  padding-right: 0 !important;
}


/* ============================================================
   3. TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-primary);
  font-weight: var(--fw-bold);
  line-height: 1.1;
  letter-spacing: -0.01em;
  margin-top: 0;
  color: var(--color-black);
}

h1 { font-size: clamp(2rem,   8vw, 3.5rem); }
h2 { font-size: clamp(2rem, 9vw, 3rem); }
h3 { font-size: clamp(1.2rem, 4vw, 1.8rem); }
h4 { font-size: clamp(1rem,   3vw, 1.4rem); }

p {
  font-family: var(--font-primary);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--color-text);
}

.profmed-section-dark h1,
.profmed-section-dark h2,
.profmed-section-dark h3,
.profmed-section-dark p { color: var(--color-black); }


/* ============================================================
   4. BUTTONS
   ============================================================ */
.profmed-btn {
  display: block;
  width: 100%;
  padding: var(--btn-padding);
  border-radius: var(--btn-radius);
  font-family: var(--font-primary);
  font-size: 1.2rem;
  font-weight: var(--fw-bold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 2px solid transparent;
  transition: opacity 0.2s ease, transform 0.1s ease;
  -webkit-appearance: none;
}

.profmed-btn:hover { opacity: 0.88; transform: translateY(-1px); }

.profmed-btn-lime    { background-color: var(--color-lime); color: var(--color-black); border-color: var(--color-lime); }
.profmed-btn-black   { background-color: var(--color-black); color: var(--color-white); border-color: var(--color-black); }
.profmed-btn-outline { background-color: transparent; color: var(--color-black); border-color: var(--color-black); }
.profmed-btn-outline-white { background-color: transparent; color: var(--color-pure-white); border-color: var(--color-pure-white); }

.profmed-btn-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

/* WordPress block buttons */
.wp-block-button__link {
  border-radius: var(--btn-radius) !important;
  font-family: var(--font-primary) !important;
  font-size: 1.2rem !important;
  font-weight: var(--fw-bold) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 1rem 2rem !important;
  width: 100% !important;
  text-align: center !important;
}

@media (min-width: 768px) {
  .profmed-btn { display: inline-block; width: auto; min-width: 200px; }
  .profmed-btn-group { flex-direction: row; flex-wrap: wrap; }
  .wp-block-button__link { width: auto !important; }
}


/* ============================================================
   5. SECTION UTILITIES
   ============================================================ */
.profmed-section,
.profmed-section-white {
  background-color: var(--color-pure-white);
  padding: var(--space-lg) var(--space-sm);
}

.profmed-section-dark {
  background-color: var(--color-dark-bg);
  padding: var(--space-lg) var(--space-sm);
}

.profmed-section-light {
  background-color: var(--color-light-bg);
  padding: var(--space-lg) var(--space-sm);
}

.profmed-section-black {
  background-color: var(--color-black);
  padding: var(--space-lg) var(--space-sm);
}

@media (min-width: 768px) {
  .profmed-section,
  .profmed-section-white,
  .profmed-section-dark,
  .profmed-section-light,
  .profmed-section-black {
    padding: var(--space-xl) var(--space-md);
  }
}

.profmed-container {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  padding: 0 var(--space-sm);
}

@media (min-width: 1024px) {
  .profmed-container { max-width: 1100px; }
}


/* ============================================================
   6. NAVIGATION
   ============================================================ */
.site-header, #masthead {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--color-black);
  padding: 0.75rem var(--space-sm);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.top-bar, .header-top, .header-utility, #top-bar { display: none; }

@media (min-width: 1024px) {
  .top-bar, .header-top, .header-utility, #top-bar { display: block; }
}


/* ============================================================
   7. FOOTER
   ============================================================ */
.site-footer, #colophon {
  background-color: var(--color-black);
  color: var(--color-pure-white);
  padding: var(--space-lg) var(--space-sm);
}

.site-footer a { color: var(--color-pure-white); text-decoration: none; font-size: 0.85rem; }
.site-footer a:hover { color: var(--color-lime); }

.footer-heading {
  font-size: 0.75rem;
  font-weight: var(--fw-bold);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-lime);
  margin-bottom: var(--space-sm);
}

.footer-social { display: flex; gap: var(--space-sm); align-items: center; margin-top: var(--space-md); }


/* ============================================================
   8. HOMEPAGE
   ============================================================ */

/* ── Hero ─────────────────────────────────────────────────── */
.home-hero {
  background-color: var(--color-black) !important;
  padding: var(--space-lg) var(--space-sm) !important;
}

.home-hero h1 {
  color: var(--color-pure-white) !important;
  font-size: clamp(2.2rem, 9vw, 4rem);
  margin-bottom: var(--space-sm);
  text-transform: uppercase;
}

.home-hero p {
  color: rgba(255,255,255,0.85) !important;
  font-size: 1rem;
  margin-bottom: var(--space-md);
}

/* ── Benefit pills ────────────────────────────────────────── */
.benefit-pills {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin: var(--space-md) 0;
}

.benefit-pill {
  display: block;
  padding: 1rem 1.75rem;
  border-radius: var(--btn-radius);
  font-family: var(--font-primary);
  font-weight: var(--fw-bold);
  font-size: 1.5rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: left;
  text-decoration: none !important;
  color: #fff !important;
  transition: opacity 0.2s;
}
.benefit-pill:link,
.benefit-pill:visited { color: #fff !important; text-decoration: none !important; }
.benefit-pill:hover { opacity: 0.88; color: #fff !important; text-decoration: none !important; }

.benefit-pill-proselect   { background-color: var(--color-proselect); }
.benefit-pill-proactive   { background-color: var(--color-proactive); }
.benefit-pill-prosecure   { background-color: var(--color-prosecure); }
.benefit-pill-propinnacle { background-color: var(--color-propinnacle); }

@media (min-width: 768px) {
  .benefit-pills { flex-direction: row; flex-wrap: wrap; }
  .benefit-pill  { flex: 0 0 calc(50% - 0.3rem); }
}

/* ── Testimonial ──────────────────────────────────────────── */
.testimonial-card {
  background: var(--color-pure-white);
  border-radius: 12px;
  padding: var(--space-md);
  margin: var(--space-md) 0;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

.testimonial-card .stars { color: #F4B400; font-size: 1rem; margin-bottom: 0.5rem; }
.testimonial-card p { font-size: 0.9rem; color: var(--color-text); font-style: italic; margin-bottom: var(--space-sm); }
.testimonial-card .author { font-weight: var(--fw-bold); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--color-black); }

/* ── App badges ───────────────────────────────────────────── */
.app-badges {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  margin-top: var(--space-md);
}

.app-badge { display: block; border-radius: 8px; overflow: hidden; max-width: 180px; }
.app-badge img { width: 100%; height: auto; }

@media (min-width: 480px) {
  .app-badges { flex-direction: row; flex-wrap: wrap; align-items: center; }
}

/* ── Additional benefits icon list ───────────────────────── */
.additional-benefits-list {
  list-style: none;
  padding: 0;
  margin: var(--space-md) 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.additional-benefits-list li {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-weight: var(--fw-semibold);
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.additional-benefits-list .benefit-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: var(--color-lime);
  flex-shrink: 0;
  font-size: 1.25rem;
}


/* ============================================================
   9. WHO QUALIFIES PAGE
   ============================================================ */
.qualify-list {
  list-style: none;
  padding: 0;
  margin: var(--space-md) 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

.qualify-list li {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  font-size: 1rem;
  line-height: 1.4;
  font-weight: var(--fw-semibold);
}

.qualify-list li::before {
  content: '';
  display: inline-block;
  min-width: 28px;
  height: 28px;
  background-color: var(--color-lime);
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60%;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.video-wrapper {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  margin: var(--space-md) 0;
  border-radius: 12px;
  overflow: hidden;
  background: var(--color-black);
}

.video-wrapper iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
}


/* ============================================================
   10. BENEFIT OPTIONS PAGE
   ============================================================ */
.plan-card {
  border-radius: 16px;
  padding: var(--space-md);
  margin-bottom: var(--space-md);
  color: var(--color-pure-white);
}

.plan-card h3 {
  color: var(--color-pure-white);
  font-size: clamp(1.4rem, 5vw, 1.8rem);
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}

.plan-card .plan-tagline {
  font-size: 0.8rem;
  font-weight: var(--fw-semibold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85);
  margin-bottom: var(--space-sm);
  display: block;
}

.plan-card .plan-features {
  list-style: none;
  padding: 0;
  margin: var(--space-sm) 0 var(--space-md);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.plan-card .plan-features li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.9rem;
  color: rgba(255,255,255,0.9);
}

.plan-card .plan-features li::before {
  content: '';
  display: inline-block;
  min-width: 18px;
  height: 18px;
  background-color: rgba(255,255,255,0.25);
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60%;
  flex-shrink: 0;
  margin-top: 0.15rem;
}

.plan-card-proselect   { background-color: var(--color-proselect); }
.plan-card-proactive   { background-color: var(--color-proactive); }
.plan-card-prosecure   { background-color: var(--color-prosecure); }
.plan-card-propinnacle { background-color: var(--color-propinnacle); }

.plan-card .plan-info-link {
  display: block;
  color: rgba(255,255,255,0.75);
  font-size: 0.8rem;
  text-decoration: underline;
  margin-bottom: var(--space-sm);
  letter-spacing: 0.04em;
}


/* ============================================================
   11. CONTACT / JOIN PAGE
   ============================================================ */
.form-section-heading {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: var(--space-sm);
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--color-lime);
}

.form-section-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background-color: var(--color-lime);
  color: var(--color-black);
  font-weight: var(--fw-bold);
  font-size: 0.9rem;
  flex-shrink: 0;
}

.form-section-title {
  font-size: 0.8rem;
  font-weight: var(--fw-bold);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0;
}

.nf-form-cont input[type="text"],
.nf-form-cont input[type="email"],
.nf-form-cont input[type="tel"],
.nf-form-cont input[type="date"],
.nf-form-cont select,
.nf-form-cont textarea {
  width: 100%;
  border: 1.5px solid var(--color-border);
  border-radius: 8px;
  padding: 0.85rem 1rem;
  font-family: var(--font-primary);
  font-size: 1rem;
  color: var(--color-text);
  background: var(--color-pure-white);
  margin-bottom: 0.75rem;
  -webkit-appearance: none;
  appearance: none;
}

.nf-form-cont input:focus,
.nf-form-cont select:focus,
.nf-form-cont textarea:focus {
  outline: none;
  border-color: var(--color-black);
}

.nf-form-cont input[type="submit"],
.nf-form-cont button[type="submit"],
.nf-form-cont .submit-container input {
  background-color: var(--color-black);
  color: var(--color-pure-white);
  border: none;
  border-radius: var(--btn-radius);
  padding: var(--btn-padding);
  font-family: var(--font-primary);
  font-weight: var(--fw-bold);
  font-size: 0.9rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  width: 100%;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.nf-form-cont input[type="submit"]:hover { opacity: 0.85; }

.form-privacy-note { font-size: 0.78rem; color: #777; margin-top: var(--space-sm); line-height: 1.5; }


/* ============================================================
   12. MOBILE GLOBAL TWEAKS
   ============================================================ */
@media (max-width: 767px) {
  .entry-content > *:first-child,
  .page-content > *:first-child { margin-top: 0 !important; }

  .wp-block-group,
  .wp-block-cover { padding-left: var(--space-sm) !important; padding-right: var(--space-sm) !important; }

  .wp-block-columns { flex-direction: column; }
  .wp-block-column  { flex-basis: 100% !important; min-width: 100% !important; }
  .wp-block-image   { width: 100%; }
  .wp-block-heading { margin-bottom: 0.75rem; }
}


/* ============================================================
   13. UTILITY CLASSES
   ============================================================ */
.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-lime   { color: var(--color-lime) !important; }
.text-white  { color: var(--color-pure-white) !important; }
.text-black  { color: var(--color-black) !important; }
.text-upper  { text-transform: uppercase; letter-spacing: 0.08em; }
.text-sm     { font-size: 0.85rem; }
.text-bold   { font-weight: var(--fw-bold); }

.mb-0  { margin-bottom: 0 !important; }
.mb-sm { margin-bottom: var(--space-sm) !important; }
.mb-md { margin-bottom: var(--space-md) !important; }
.mt-0  { margin-top: 0 !important; }

.bg-black { background-color: var(--color-black) !important; }
.bg-lime  { background-color: var(--color-lime) !important; }
.bg-grey  { background-color: var(--color-grey) !important; }


/* ============================================================
   14. PROFMED ICON (CSS — used in hero + footer)
   ============================================================ */
.profmed-icon {
    border-radius: 50%;
    background: var(--color-lime);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.profmed-icon-bar {
    background: #fff;
    border-radius: 100px;
}
/* Hero size */
.profmed-icon--hero {
    width:  min(52vw, 220px);
    height: min(52vw, 220px);
    gap: min(3vw, 13px);
}
.profmed-icon--hero .profmed-icon-bar {
    width: 62%;
    height: 13%;
}

/* Real image icon in hero */
.hero-icon-img {
    width: min(48vw, 180px);
    height: auto;
    display: block;
}


/* ============================================================
   15. HERO SECTION
   ============================================================ */
.home-hero {
    background: var(--color-black);
    min-height: 100svh;
    padding: 3.5rem 1.5rem 4rem;
    display: flex;
    flex-direction: column;
    gap: 3.5rem;
}

.hero-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}

/* White wordmark: invert the dark logo */
.hero-wordmark {
    filter: brightness(0) invert(1);
    width: 160px;
    height: auto;
    display: block;
}

.hero-content { display: flex; flex-direction: column; gap: 1.25rem; }

.hero-heading {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 8vw, 3rem);
    line-height: 1.1;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
}

.hero-sub {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.6;
    color: rgba(255,255,255,0.85);
    margin: 0;
}

.hero-ctas {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    margin-top: 0.5rem;
}

.hero-ctas .profmed-btn-lime {
    display: block;
    text-align: center;
    padding: 1.1rem 2rem;
    font-size: 1.2rem;
    letter-spacing: 0.12em;
    border-radius: 100px;
    text-decoration: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    background-color: var(--color-lime);
    color: var(--color-black);
}


/* ============================================================
   16. BENEFIT OPTIONS AT A GLANCE
   ============================================================ */
.benefit-glance-section {
    background: var(--color-black);
    padding: 3rem 0 3rem 1.25rem;
    overflow: hidden;
}

.benefit-glance-inner { overflow: hidden; }

.benefit-glance-heading {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem); /* matches all section h2s */
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #fff;
    margin: 0 0 2rem;
}
.benefit-glance-lime { color: var(--color-lime); }

.benefit-pills-wrap {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    overflow: hidden;          /* clips right-side of pills */
}

.benefit-pill {
    display: flex;
    align-items: center;
    gap: 0;
    border-radius: 100px;      /* full pill — right cap hidden by overflow */
    padding: 1.4rem 2rem;
    width: calc(100% + 60px);  /* extends 60 px beyond right edge */
    text-decoration: none !important;
    font-family: var(--font-primary);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 1.5rem;
    line-height: 1;
    color: #fff !important;
    transition: opacity 0.2s;
}
.benefit-pill:link,
.benefit-pill:visited { color: #fff !important; text-decoration: none !important; }
.benefit-pill:hover   { opacity: 0.88; color: #fff !important; text-decoration: none !important; }

.pill-pre  { font-weight: var(--fw-light);   margin-right: 0.1em; color: inherit; }
.pill-name { font-weight: var(--fw-bold);                          color: inherit; }

/* Plan colours */
.benefit-pill--proselect  { background: var(--color-proselect);   color: #000 !important; }
.benefit-pill--proactive  { background: var(--color-proactive);   color: #fff !important; }
.benefit-pill--prosecure  { background: var(--color-prosecure);   color: #fff !important; }
.benefit-pill--propinnacle{ background: var(--color-propinnacle); color: #fff !important; }

/* ProSelect: dark text (orange bg is light enough) */
.benefit-pill--proselect,
.benefit-pill--proselect:link,
.benefit-pill--proselect:visited { color: #000 !important; }
.benefit-pill--proselect .pill-pre,
.benefit-pill--proselect .pill-name { color: #000 !important; }


/* ============================================================
   17. TESTIMONIALS SECTION
   ============================================================ */
.testimonials-section {
    background: var(--color-white);
    overflow: hidden;
}

/*
 * Perfect circle arc:
 * A 120vw × 120vw square with border-radius 50% = true circle at every
 * viewport size. Pulled upward so only the bottom arc is visible.
 * Parent overflow:hidden clips the sides and top.
 */
.testimonials-arc {
    background: var(--color-black);
    width: 120vw;
    height: 120vw;          /* equal width & height = perfect circle */
    border-radius: 50%;
    margin-left: -10vw;     /* centre horizontally (10vw bleed each side) */
    margin-top: -52vw;      /* pull up less → arc edge sits further down */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    /* Left pad = 10vw (compensate for margin-left: -10vw) + 1.5rem visual indent */
    padding: 0 2rem 5rem calc(10vw + 1.5rem);
    text-align: left;
    flex-shrink: 0;
}

.testimonials-heading {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem);
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #fff;
    margin: 0;
}
.testimonials-lime { color: var(--color-lime); }

/* Body copy below arc */
.testimonials-body { padding: 2rem 1.5rem 3rem; }

.testimonials-sub {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--color-black);
    margin: 0 0 2rem;
    text-align: left;            /* mobile: left aligned, flush with cards */
}

/* Horizontally scrolling review cards */
.testimonials-scroll {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 1rem;
    scrollbar-width: none;       /* Firefox */
}
.testimonials-scroll::-webkit-scrollbar { display: none; }

.review-card {
    flex: 0 0 82vw;
    max-width: 320px;
    background: #fff;
    border-radius: 16px;
    padding: 1.25rem;
    box-shadow: 0 2px 16px rgba(0,0,0,0.1);
    scroll-snap-align: start;
}

.review-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.review-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 1rem;
    color: #fff;
    flex-shrink: 0;
}
.review-avatar--lime  { background: var(--color-lime);  color: #000; }
.review-avatar--blue  { background: var(--color-blue); }
.review-avatar--green { background: var(--color-proactive); }

.review-meta { flex: 1; }
.review-name {
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    font-size: 0.85rem;
    color: var(--color-blue);
    line-height: 1.2;
}
.review-source {
    font-size: 0.7rem;
    color: #888;
}

.review-google {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-weight: 700;
    font-size: 1.1rem;
    color: #4285F4;
    margin-left: auto;
}

.review-stars {
    color: #FBBC05;
    font-size: 0.9rem;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}

.review-text {
    font-family: var(--font-primary);
    font-weight: var(--fw-regular);
    font-size: 0.82rem;
    line-height: 1.5;
    color: #333;
    margin: 0;
}


/* ============================================================
   18. WHY CHOOSE PROFMED?
   ============================================================ */
.why-profmed-section {
    background: var(--color-white);
    border-top: 1px solid rgba(0,0,0,0.08);
    padding: 3rem 1.5rem 4rem;
}

.why-profmed-inner { max-width: 480px; }

.why-profmed-section h2 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-black);
    margin: 0 0 1rem;
    line-height: 1.1;
}

.why-profmed-section > .why-profmed-inner > p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--color-black);
    margin: 0 0 2.5rem;
}

/* ── Pyramid diagram (now real image) ── */
.pyramid-wrap {
    width: 85%;
    max-width: 340px;
    margin: 0 auto;
}
.pyramid-img {
    width: 100%;
    height: auto;
    display: block;
}

/* Grey triangle (upper) */
.pyramid-top {
    position: relative;
    width: 100%;
    padding-bottom: 65%;
    overflow: visible;
}
.pyramid-top-bg {
    position: absolute;
    inset: 0;
    background: #CACECE;
    clip-path: polygon(50% 0%, 100% 100%, 0% 100%);
}
.pyramid-top-text {
    position: absolute;
    bottom: 18%;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: 65%;
    font-family: var(--font-primary);
    font-size: 0.78rem;
    line-height: 1.35;
    color: #222;
    pointer-events: none;
}
.pyramid-top-text strong {
    display: block;
    font-weight: var(--fw-bold);
    font-size: 0.82rem;
    margin-bottom: 0.2em;
}
.pyramid-top-text span { font-weight: var(--fw-light); }

/* Lime base (lower) */
.pyramid-bottom {
    background: var(--color-lime);
    padding: 1.5rem 1rem;
    text-align: center;
    border-radius: 0 0 6px 6px;
    margin-top: -1px;
}
.pyramid-bottom p {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.85rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #000;
    line-height: 1.4;
    margin: 0;
}


/* ============================================================
   19. ADDITIONAL BENEFITS FOR PROFESSIONALS
   ============================================================ */
.additional-benefits-section {
    background: var(--color-grey);        /* #AFB8B3 */
    padding: 3rem 1.5rem 4rem;
}

.additional-benefits-inner { max-width: 480px; }

.additional-benefits-section h2 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-black);
    margin: 0 0 1rem;
    line-height: 1.1;
}

.additional-benefits-section > .additional-benefits-inner > p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--color-black);
    margin: 0 0 2rem;
}

/* Icon list */
.benefits-icon-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}
.benefits-icon-list li {
    display: flex;
    align-items: center;
    gap: 1.1rem;
}
.benefits-icon-list li span:last-child {
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    font-size: 1.3rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-black);
}

/* Circle icon badge */
.benefit-icon-circle {
    width: 58px;
    height: 58px;
    flex-shrink: 0;
    border: 2px solid var(--color-black);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--color-black);
}
.benefit-icon-circle i { font-size: 1.5rem; }
.benefit-icon-circle img { width: 28px; height: 28px; }


/* ============================================================
   20. GET THE PROFMED APP
   ============================================================ */
.app-section {
    background: var(--color-white);
    position: relative;
    overflow: hidden;
    padding: 3rem 1.5rem 0;
    border-top: 1px solid rgba(0,0,0,0.08);
}

.app-inner {
    position: relative;
    z-index: 2;
    max-width: 480px;
    padding-bottom: 3rem;
}

.app-section h2 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-black);
    margin: 0 0 1rem;
    line-height: 1.1;
}

.app-section > .app-inner > p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--color-black);
    margin: 0 0 2rem;
}

/* App store badges — centred */
.app-badges {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.85rem;
    position: relative;
    z-index: 2;
}

.app-badge {
    display: block;
    text-decoration: none;
}
.app-badge svg {
    width: 100%;
    max-width: 240px;
    height: auto;
    border-radius: 8px;
    display: block;
}
.app-badge:hover { opacity: 0.85; }

/* Lime arch background element */
.app-arch {
    position: absolute;
    bottom: -45%;
    left: 50%;
    transform: translateX(-50%);
    width: 140%;
    aspect-ratio: 1 / 1;
    background: var(--color-lime);
    border-radius: 50%;
    z-index: 1;
    pointer-events: none;
}


/* ============================================================
   21. PHASE 1 FOOTER
   ============================================================ */
#pm-phase1-footer.pm-footer {
    background: var(--color-black);
    color: #fff;
    padding: 3rem 1.5rem 2rem;
    font-family: var(--font-primary);
}

/* Link columns */
.pm-footer-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem 1.5rem;
    margin-bottom: 2.5rem;
}

.pm-footer-col-heading {
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    font-size: 0.95rem;
    letter-spacing: 0.06em;
    color: #fff;
    margin: 0 0 1rem;
    text-transform: none;
}

.pm-footer-col ul,
.pm-footer-legal ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.pm-footer-col ul a,
.pm-footer-legal ul a {
    font-family: var(--font-primary);
    font-weight: var(--fw-regular);
    font-size: 0.82rem;
    color: rgba(255,255,255,0.75);
    text-decoration: none;
    line-height: 1.4;
    display: block;
}
.pm-footer-col ul a:hover,
.pm-footer-legal ul a:hover {
    color: var(--color-lime);
    text-decoration: none;
}

/* Lower row: legal + brand */
.pm-footer-lower {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem 1.5rem;
    align-items: end;
    margin-bottom: 3rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(255,255,255,0.12);
}

/* Profmed icon in footer */
.pm-footer-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.75rem;
}

.pm-footer-icon-img {
    width: 100px;   /* circle + PROFMED text below */
    height: auto;
    display: block;
}

.pm-footer-wordmark img {
    filter: brightness(0) invert(1);
    width: 110px;
    height: auto;
    display: block;
}

/* Social icons */
.pm-footer-social {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    padding: 2rem 0;
    border-top: 1px solid rgba(255,255,255,0.12);
    border-bottom: 1px solid rgba(255,255,255,0.12);
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}
.pm-footer-social a {
    color: rgba(255,255,255,0.8);
    font-size: 1.3rem;
    text-decoration: none;
    transition: color 0.2s;
    display: flex;
    align-items: center;
}
.pm-footer-social a:hover { color: var(--color-lime); }

/* Copyright */
.pm-footer-copy {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 0.72rem;
    color: rgba(255,255,255,0.5);
    text-align: center;
    line-height: 1.5;
    margin: 0;
    padding: 0 0.5rem;
}


/* ============================================================
   22. FULL-SCREEN MENU OVERLAY
   ============================================================ */

.pm-menu-overlay {
    position: fixed;
    inset: 0;
    background: #000;
    z-index: 10000;
    transform: translateX(-100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.pm-menu-overlay.is-open {
    transform: translateX(0);
}

.pm-menu-inner {
    display: flex;
    flex-direction: column;
    min-height: 100svh;
    min-height: 100vh;
    padding: 1.25rem 1.5rem 3rem;
}

/* ── Header: X close + white logo ── */
.pm-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 3rem;
    min-height: 52px;
}

.pm-menu-close {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    margin-left: -0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.pm-menu-close:focus-visible {
    outline: 2px solid var(--color-lime);
    border-radius: 4px;
}

.pm-menu-logo-link {
    display: flex;
    align-items: center;
}
.pm-menu-logo-link img {
    height: 20px;
    width: auto;
    display: block;
}

/* ── Primary links ── */
.pm-menu-primary {
    list-style: none;
    margin: 0 0 2.5rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.pm-menu-primary li a {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(1.2rem, 5.5vw, 1.6rem);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
    display: block;
    padding: 0.9rem 0;
    line-height: 1.15;
    transition: color 0.2s;
}
.pm-menu-primary li a:hover,
.pm-menu-primary li a:focus { color: var(--color-lime); text-decoration: none; }

/* ── Secondary links ── */
.pm-menu-secondary {
    list-style: none;
    margin: 0 0 2rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.pm-menu-secondary li a {
    font-family: var(--font-primary);
    font-weight: var(--fw-regular);
    font-size: 1rem;
    color: rgba(255,255,255,0.6);
    text-decoration: none;
    display: block;
    padding: 0.35rem 0;
    transition: color 0.2s;
}
.pm-menu-secondary li a:hover,
.pm-menu-secondary li a:focus { color: var(--color-lime); text-decoration: none; }

/* ── Social row ── */
.pm-menu-social {
    margin-top: auto;
    display: flex;
    gap: 1.5rem;
    align-items: center;
    flex-wrap: wrap;
    padding-top: 2rem;
}
.pm-menu-social a {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.75;
    transition: opacity 0.2s;
}
.pm-menu-social a:hover { opacity: 1; }
/* Force all social SVG icons to white */
.pm-menu-social img {
    width: 24px;
    height: 24px;
    filter: brightness(0) invert(1);
}

/* Footer social icons white filter */
.pm-footer-social img {
    filter: brightness(0) invert(1);
    width: 22px;
    height: 22px;
}
.pm-footer-social a {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.75;
    transition: opacity 0.2s;
    text-decoration: none;
}
.pm-footer-social a:hover { opacity: 1; }


/* ============================================================
   23. SCREEN READER ONLY
   ============================================================ */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

/* ── Font size: 25px mobile, 22px tablet+ ── */
@media (min-width: 768px) {
    body { font-size: 22px; }
}


/* ============================================================
   24. PAGE BREADCRUMB
   ============================================================ */

/*
 * Inner pages: push all page content below the fixed 70px nav.
 * This is more reliable than margin-top on the first child because
 * it works regardless of what WordPress wrapper the first block is
 * inside. The homepage hero is full-height + transparent nav so
 * it does NOT need this offset.
 */
/* Push ALL inner-page content below the 70px fixed nav.
   Covers: pages (.page), single posts (.single-post), archives (.archive),
   category/tag (.category, .tag), and any other non-home body. */
body:not(.home):not(.error404) {
    padding-top: 70px !important;
}

.pm-breadcrumb {
    background: var(--color-white);
    padding: 0.85rem 1.5rem;
    font-size: 0.82rem;
    color: #666;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-bottom: 1px solid rgba(0,0,0,0.07);
    font-family: var(--font-primary);
    /* No margin-top — padding-top on entry-content handles the nav gap */
    width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
}
.pm-breadcrumb a { color: #666; text-decoration: none; }
.pm-breadcrumb a:hover { color: var(--color-black); }
.pm-breadcrumb-sep { color: #bbb; font-size: 1rem; }
.pm-breadcrumb-current { color: var(--color-black); font-weight: var(--fw-semibold); }

/* Benefit Options page (ID 153): breadcrumb is transparent — hero extends behind it */
body.page-id-153 .pm-breadcrumb {
    background: transparent !important;
    border-bottom: none !important;
    position: relative;
    z-index: 2;
}
body.page-id-153 .pm-breadcrumb,
body.page-id-153 .pm-breadcrumb a  { color: rgba(255,255,255,0.65); }
body.page-id-153 .pm-breadcrumb-current { color: #fff; }
body.page-id-153 .pm-breadcrumb-sep     { color: rgba(255,255,255,0.35); }


/* ============================================================
   25. WHO QUALIFIES PAGE
   ============================================================ */
.wq-intro-section {
    background: #f1f1f1;
    padding: 2.5rem 1.5rem 2rem;
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}
.wq-intro-inner { padding: 0 1.5rem; }

/* ── Lime blob: arch-top, holds checklist + CTA ── */
.wq-qualify-section {
    background: var(--color-lime);
    border-radius: 50% 50% 0 0;
    padding: 3rem 1.5rem 3rem;
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    margin-top: 0 !important;
}

.wq-intro-section h1 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-black);
    line-height: 1.05;
    margin: 0 0 1rem;
}

.wq-intro-section > div > p:first-of-type {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--color-black);
    margin: 0 0 2rem;
}

.wq-qualify-heading {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(1.4rem, 5.5vw, 1.9rem);
    color: var(--color-black);
    line-height: 1.2;
    margin: 0 0 1.5rem;
    letter-spacing: 0;
}

.wq-checklist {
    list-style: none;
    padding: 0;
    margin: 0 0 2.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}
.wq-checklist li {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    font-family: var(--font-primary);
    font-size: 1rem;
    color: var(--color-black);
    line-height: 1.5;
}
.wq-checklist li::before {
    content: '';
    display: inline-block;
    min-width: 32px;
    height: 32px;
    background-color: var(--color-black);
    border-radius: 50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60%;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.wq-cta-btn {
    display: block;
    width: 100%;
    text-align: center;
    padding: 1.1rem 2rem;
    font-size: 1.2rem;
    letter-spacing: 0.12em;
    border-radius: 100px;
    background: #fff;
    color: var(--color-black);
    text-decoration: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    border: none;
    transition: opacity 0.2s;
}
.wq-cta-btn:hover { opacity: 0.85; color: var(--color-black); text-decoration: none; }

/* Why Profmed video section — lime continuation */
.wq-why-section {
    background: var(--color-lime);
    padding: 2rem 1.5rem 0;
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    overflow: hidden;
    margin-top: -2px !important; /* close hairline gap with lime qualify section */
}
.wq-why-inner {
    position: relative;
    z-index: 2;
    max-width: 480px;
    padding: 0 1.5rem 3rem;
}

.wq-why-section h2 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-black);
    margin: 0 0 1rem;
    line-height: 1.05;
}
.wq-why-section p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--color-black);
    margin: 0 0 0.75rem;
}

/* Bottom arch — same pattern as .app-arch, slightly lighter circle */
.wq-why-arch {
    position: absolute;
    bottom: -45%;
    left: 50%;
    transform: translateX(-50%);
    width: 140%;
    aspect-ratio: 1 / 1;
    background: rgba(255,255,255,0.22);
    border-radius: 50%;
    z-index: 1;
    pointer-events: none;
}
/* ── YouTube lite embed ── */
.wq-video-wrap {
    position: relative;
    width: 100%;
    margin: 2rem 0 0;
    border-radius: 12px;
    overflow: hidden;
    background: #000;
    cursor: pointer;
    aspect-ratio: 16 / 9;
}
.wq-video-wrap .yt-thumb {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.wq-video-wrap .yt-play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.25);
    transition: background 0.2s;
}
.wq-video-wrap:hover .yt-play { background: rgba(0,0,0,0.15); }
.wq-video-wrap .yt-play svg { width: 68px; height: 48px; filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)); }
.wq-video-wrap iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}


/* ============================================================
   26. BENEFIT OPTIONS PAGE
   ============================================================ */

/* ── Hero (dark feather background, matching production design) ── */
.bo-hero-section {
    background-color: var(--color-black);
    background-image:
        linear-gradient(rgba(0,0,0,0.50), rgba(0,0,0,0.65)),
        url('images/bo-hero-bg.jpg');
    background-size: cover;
    background-position: center center;
    padding: 2.5rem 1.5rem 3rem;
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}

/* Pull hero up so it sits visually behind the transparent breadcrumb */
body.page-id-153 .bo-hero-section {
    margin-top: -50px !important;
    padding-top: calc(2.5rem + 50px) !important;
    background-position: center top !important;
}
.bo-hero-section h1 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem) !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #fff !important;
    line-height: 1.05;
    margin: 0 0 1rem;
}
.bo-hero-section > p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.65;
    color: rgba(255,255,255,0.85);
    margin: 0 0 2rem;
}
.bo-hero-ctas {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* 1st CTA = LIME filled, dark text */
.bo-btn-outline {
    display: block;
    width: 100%;
    text-align: center;
    padding: 1.1rem 2rem;
    font-size: 1.2rem;
    letter-spacing: 0.12em;
    border-radius: 100px;
    background: var(--color-lime);
    color: var(--color-black);
    border: 2px solid var(--color-lime);
    text-decoration: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    transition: opacity 0.2s;
}
.bo-btn-outline:hover { opacity: 0.85; color: var(--color-black); text-decoration: none; }

/* 2nd CTA = transparent with white border */
.bo-btn-black {
    display: block;
    width: 100%;
    text-align: center;
    padding: 1.1rem 2rem;
    font-size: 1.2rem;
    letter-spacing: 0.12em;
    border-radius: 100px;
    background: transparent;
    color: #fff;
    border: 2px solid rgba(255,255,255,0.7);
    text-decoration: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    transition: opacity 0.2s;
}
.bo-btn-black:hover { opacity: 0.85; color: #fff; text-decoration: none; }

/* ── Four options / one promise (light section) ── */
.bo-promise-section {
    background: var(--color-white);
    padding: 3rem 1.5rem;
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}
.bo-promise-section h2 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-black);
    margin: 0 0 1rem;
    line-height: 1.05;
}
.bo-promise-section p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    color: rgba(0,0,0,0.65);
    margin: 0;
    line-height: 1.6;
}

/* ── Plan cards container ── */
.bo-plans-section {
    background: var(--color-white);
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 0.5rem 0 3rem;
}

/* ── Individual card — box with shadow ── */
.bo-plan-card {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 4px 28px rgba(0,0,0,0.13);
    overflow: hidden;
    margin: 0 1.5rem;
    color: var(--color-black);
}

/* ── Coloured header strip ── */
.bo-plan-header {
    padding: 1.75rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bo-plan-card--proselect  .bo-plan-header { background: var(--color-proselect); }
.bo-plan-card--proactive  .bo-plan-header { background: var(--color-proactive); }
.bo-plan-card--prosecure  .bo-plan-header { background: var(--color-prosecure); }
.bo-plan-card--propinnacle .bo-plan-header { background: var(--color-propinnacle); }
.bo-plan-card--prosecureplus .bo-plan-header { background: var(--color-prosecureplus); }

/* ── Plan name (white, centred on colour header) ── */
.bo-plan-name {
    font-family: var(--font-primary);
    font-size: clamp(2rem, 8vw, 2.8rem) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em;
    margin: 0 !important;
    line-height: 1;
    color: #fff !important;
    text-decoration: none !important;
    text-align: center;
}
.bo-plan-name .pill-pre  { font-weight: var(--fw-light); }
.bo-plan-name .pill-name { font-weight: var(--fw-bold); }

/* ── White card body ── */
.bo-plan-body {
    padding: 1.5rem;
    background: #fff;
}

/* ── Tagline (plan colour) ── */
.bo-plan-tagline {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.82rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin: 0 0 1.25rem;
    line-height: 1.35;
}
.bo-plan-card--proselect  .bo-plan-tagline { color: var(--color-proselect); }
.bo-plan-card--proactive  .bo-plan-tagline { color: var(--color-proactive); }
.bo-plan-card--prosecure  .bo-plan-tagline { color: var(--color-prosecure); }
.bo-plan-card--propinnacle .bo-plan-tagline { color: var(--color-propinnacle); }
.bo-plan-card--prosecureplus .bo-plan-tagline { color: var(--color-prosecureplus); }

/* ── Features list (dark text, plan-coloured circles) ── */
.bo-plan-features {
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.bo-plan-features li {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-family: var(--font-primary);
    font-size: 0.95rem;
    color: var(--color-black);
    line-height: 1.3;
}
.bo-plan-features li::before {
    content: '';
    display: inline-block;
    min-width: 20px;
    height: 20px;
    border-radius: 50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60%;
    flex-shrink: 0;
}
.bo-plan-card--proselect  .bo-plan-features li::before { background-color: var(--color-proselect); }
.bo-plan-card--proactive  .bo-plan-features li::before { background-color: var(--color-proactive); }
.bo-plan-card--prosecure  .bo-plan-features li::before { background-color: var(--color-prosecure); }
.bo-plan-card--propinnacle .bo-plan-features li::before { background-color: var(--color-propinnacle); }
.bo-plan-card--prosecureplus .bo-plan-features li::before { background-color: var(--color-prosecureplus); }

/* ── Info link ── */
.bo-plan-info-link {
    display: block;
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    font-size: 0.8rem;
    color: rgba(0,0,0,0.45);
    text-decoration: underline;
    margin-bottom: 1.25rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.bo-plan-info-link:hover { color: var(--color-black); text-decoration: none; }

/* ── GET A QUOTE button ── */
.bo-plan-quote-btn {
    display: block;
    width: 100%;
    text-align: center;
    padding: 1rem 2rem;
    font-size: 1.2rem;
    letter-spacing: 0.12em;
    border-radius: 100px;
    background: var(--color-black);
    color: #fff;
    text-decoration: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    transition: opacity 0.2s;
}
.bo-plan-quote-btn:hover { opacity: 0.8; color: #fff; text-decoration: none; }

/* ── Compare CTA strip ── */
.bo-compare-cta {
    background: var(--color-lime);
    padding: 3rem 1.5rem;
    text-align: center;
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}
.bo-compare-cta h2 {
    color: var(--color-black);
    margin: 0 0 0.5rem;
}
.bo-compare-sub {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    color: rgba(0,0,0,0.7);
    margin: 0 0 2rem;
    line-height: 1.55;
}
.bo-compare-btn {
    display: inline-block;
    padding: 1.1rem 3rem;
    font-size: 1.2rem;
    letter-spacing: 0.12em;
    border-radius: 100px;
    background: var(--color-black);
    color: #fff;
    text-decoration: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    transition: opacity 0.2s;
}
.bo-compare-btn:hover { opacity: 0.8; color: #fff; text-decoration: none; }


/* ============================================================
   27. CONTACT PAGE
   ============================================================ */
.contact-hero-section {
    background: var(--color-black);
    padding: 2.5rem 1.5rem 3.5rem;
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}
.contact-hero-section h1 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: clamp(2rem, 9vw, 3rem);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #fff;
    line-height: 1.05;
    margin: 0 0 1.25rem;
}
.contact-hero-section > p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.65;
    color: rgba(255,255,255,0.8);
    margin: 0 0 0.75rem;
}

/* White card with rounded arch top — rises over the black hero */
.contact-form-section {
    background: var(--color-white);
    border-radius: 28px 28px 0 0;
    padding: 2.5rem 1.5rem 3.5rem;
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    margin-top: -28px !important;
}
.contact-form-inner { max-width: 480px; }

.cf-section { margin-bottom: 2.5rem; }

.cf-section-head {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.25rem;
}
.cf-section-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--color-black);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #6786F9;
    font-size: 1.2rem;
}
/* Remove duplicate icon from contact section 4 (copy/paste artefact) */
.cf-section-icon--inline { display: none; }

.cf-section-title {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.95rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-black);
    margin: 0;
}

.cf-field {
    width: 100%;
    border: 1.5px solid rgba(0,0,0,0.18);
    border-radius: 8px;
    padding: 0.9rem 1rem;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    color: var(--color-text);
    background: #fff;
    margin-bottom: 0.85rem;
    -webkit-appearance: none;
    appearance: none;
    display: block;
    box-sizing: border-box;
}
.cf-field:focus {
    outline: none;
    border-color: var(--color-black);
}
.cf-field::placeholder { color: #bbb; }

/* Custom dropdown arrow for select fields */
select.cf-field {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23333' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
    cursor: pointer;
}
.cf-textarea { resize: vertical; min-height: 100px; }

/* Date of Birth — native calendar picker */
.cf-date-wrap {
    position: relative;
    margin-bottom: 0.85rem;
}
.cf-date-label {
    display: block;
    font-family: var(--font-primary);
    font-size: 0.78rem;
    color: #888;
    letter-spacing: 0.04em;
    margin-bottom: 0.3rem;
    padding-left: 0.25rem;
}
.cf-date {
    margin-bottom: 0 !important;
    width: 100%;
}
input[type="date"].cf-field {
    color: var(--color-text);
}
/* Style the calendar icon */
input[type="date"].cf-field::-webkit-calendar-picker-indicator {
    opacity: 0.45;
    cursor: pointer;
    padding: 2px;
}

.cf-eligibility-note {
    background: rgba(0,0,0,0.04);
    border-radius: 8px;
    padding: 1rem 1.1rem;
    margin-bottom: 1.25rem;
}
.cf-eligibility-note strong {
    display: block;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 0.4rem;
    color: var(--color-black);
}
.cf-eligibility-note p {
    font-size: 0.8rem;
    color: #555;
    margin: 0;
    line-height: 1.55;
}

.cf-privacy {
    font-family: var(--font-primary);
    font-size: 0.78rem;
    color: #777;
    line-height: 1.55;
    margin: 0 0 1.5rem;
}
.cf-submit {
    display: block;
    width: 100%;
    text-align: center;
    padding: 1.1rem 2rem;
    font-size: 1.2rem;
    letter-spacing: 0.12em;
    border-radius: 100px;
    background: var(--color-black);
    color: #fff;
    border: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.2s;
}
.cf-submit:hover { opacity: 0.85; }

/* Form response message */
.cf-response {
    display: none;
    padding: 0.9rem 1.1rem;
    border-radius: 10px;
    font-family: var(--font-primary);
    font-size: 0.95rem;
    line-height: 1.5;
    margin-bottom: 1.2rem;
}
.cf-response:not(:empty) { display: block; }
.cf-response--ok  { background: #e8f5e9; color: #2e7d32; border: 1px solid #a5d6a7; }
.cf-response--err { background: #ffebee; color: #c62828; border: 1px solid #ef9a9a; }



/* ============================================================
   28. QUOTE TOOL  — GET YOUR PRICE
   Page: /profmed-quote-in-60-seconds/ (ID 35754)
   ============================================================ */

/* ── Page intro (title on white, no hero bg) ───────────────── */
.qt-intro {
    padding: 2.5rem 1.5rem 1.5rem;
}
.qt-intro h1 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 2.8rem;
    text-transform: uppercase;
    color: var(--color-black);
    line-height: 1.0;
    margin: 0;
    letter-spacing: 0.02em;
}

/* ── Tab strip (dark, full-bleed standalone) ───────────────── */
.qt-tabs {
    display: flex;
    background: var(--color-black);
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
}
.qt-tab {
    flex: 1;
    padding: 0.75rem 0.3rem;
    text-align: center;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.58rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.35);
    cursor: default;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    border-bottom: 2px solid transparent;
    transition: color 0.2s;
    user-select: none;
}
.qt-tab-num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1.5px solid rgba(255,255,255,0.2);
    font-size: 0.68rem;
    font-weight: var(--fw-bold);
    transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.qt-tab--active {
    color: var(--color-lime);
    border-bottom-color: var(--color-lime);
}
.qt-tab--active .qt-tab-num {
    background: var(--color-lime);
    color: var(--color-black);
    border-color: var(--color-lime);
}
.qt-tab--done {
    color: rgba(255,255,255,0.5);
    cursor: pointer;
}
.qt-tab--done .qt-tab-num {
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.2);
    color: rgba(255,255,255,0.6);
}

/* ── Step panels ────────────────────────────────────────────── */
.qt-panel {
    display: none;
    padding: 2rem 1.5rem 1rem;
}
.qt-panel--active { display: block; }

/* ── Step section header (icon + label) ─────────────────────── */
.qt-step-header {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    margin-bottom: 1.4rem;
}
.qt-step-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--color-black);
    color: var(--color-lime);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}
.qt-step-title {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--color-black);
    margin: 0;
    line-height: 1.3;
}

/* ── Form fields ─────────────────────────────────────────────── */
.qt-field {
    display: block;
    width: 100%;
    padding: 0.9rem 1rem;
    border: 1.5px solid rgba(0,0,0,0.14);
    border-radius: 10px;
    font-family: var(--font-primary);
    font-size: 0.92rem;
    color: var(--color-black);
    background: #fff;
    margin-bottom: 0.85rem;
    outline: none;
    transition: border-color 0.2s;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
}
.qt-field:focus { border-color: var(--color-black); }
.qt-field--err  { border-color: #e53935 !important; background: #fff8f8; }

select.qt-field {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.9rem center;
    padding-right: 2.5rem;
    cursor: pointer;
}

/* DOB date field */
.qt-date-wrap {
    position: relative;
    margin-bottom: 0.85rem;
}
.qt-date-label {
    display: block;
    font-family: var(--font-primary);
    font-size: 0.75rem;
    color: #999;
    margin-bottom: 0.25rem;
    letter-spacing: 0.04em;
}
input.qt-date { margin-bottom: 0 !important; }
input[type="date"].qt-field::-webkit-calendar-picker-indicator {
    opacity: 0.45;
    cursor: pointer;
}

/* ── Eligibility block (inline text, not a card) ─────────────── */
.qt-eligibility-block {
    margin-bottom: 1.2rem;
}
.qt-eligibility-block h4 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--color-black);
    margin: 0 0 0.4rem;
}
.qt-eligibility-block p {
    font-size: 0.82rem;
    color: #555;
    margin: 0;
    line-height: 1.55;
}

/* ── Privacy note ────────────────────────────────────────────── */
.qt-privacy-note {
    font-size: 0.78rem;
    color: #888;
    line-height: 1.55;
    margin-bottom: 1.1rem;
}

/* ── Error messages ─────────────────────────────────────────── */
.qt-err-msg, .qt-plan-err {
    display: none;
    background: #ffebee;
    color: #c62828;
    border: 1px solid #ef9a9a;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-family: var(--font-primary);
    font-size: 0.84rem;
    margin-bottom: 1rem;
}

/* ── Navigation buttons ──────────────────────────────────────── */
.qt-btn-next {
    display: block;
    width: 100%;
    padding: 1.1rem;
    font-size: 0.95rem;
    letter-spacing: 0.12em;
    border-radius: 100px;
    background: var(--color-black);
    color: #fff;
    border: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.2s;
    margin-top: 0.5rem;
}
.qt-btn-next:hover { opacity: 0.82; }

.qt-btn-back {
    display: block;
    width: 100%;
    padding: 0.85rem;
    font-size: 0.85rem;
    letter-spacing: 0.1em;
    border-radius: 100px;
    background: transparent;
    color: #999;
    border: 1.5px solid #ddd;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
    margin-top: 0.7rem;
    margin-bottom: 2rem;
}
.qt-btn-back:hover { border-color: #aaa; color: #555; }

/* ── Step 2: Plan selection grid ────────────────────────────── */
.qt-plan-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem 0.65rem;
    margin-bottom: 1.5rem;
}

/* Wrapper — handles the SAVVY chip hanging below the pill */
.qt-plan-btn-wrap {
    position: relative;
    padding-bottom: 0;
}
.qt-plan-btn-wrap--savvy {
    padding-bottom: 14px; /* room for the SAVVY chip */
}

/* The pill button */
.qt-plan-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    width: 100%;
    padding: 0.85rem 0.5rem;
    border-radius: 50px;           /* full pill/stadium shape */
    font-family: var(--font-primary);
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s;
    border: 2.5px solid transparent;
    box-sizing: border-box;
    overflow: visible;
    white-space: nowrap;
}
.qt-plan-btn:hover { opacity: 0.82; }
.qt-plan-btn--sel {
    box-shadow: 0 0 0 2.5px #fff, 0 0 0 5px rgba(0,0,0,0.55);
}

/* "PRO" — thin weight */
.qt-plan-btn-pro {
    font-size: 0.7rem;
    font-weight: 300;
    letter-spacing: 0.05em;
    color: inherit;
    opacity: 0.88;
}
/* Plan name — heavy bold */
.qt-plan-btn-name {
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    color: inherit;
    line-height: 1;
}

/* SAVVY chip — black pill, positioned at bottom of wrapper */
.qt-plan-btn-savvy-chip {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background: #000;
    color: #fff;
    border-radius: 50px;
    padding: 0.2rem 0.8rem;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 0.58rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    white-space: nowrap;
    pointer-events: none;
}

/* ── Plan colours (ALL filled; ProSECURE PLUS = outlined) ─────── */
/* ProSELECT — orange */
.qt-plan-btn[data-plan="ProSELECT SAVVY"],
.qt-plan-btn[data-plan="ProSELECT"]            { background: #F79719; border-color: #F79719; color: #fff; }
/* ProACTIVE PLUS — green */
.qt-plan-btn[data-plan="ProACTIVE PLUS SAVVY"],
.qt-plan-btn[data-plan="ProACTIVE PLUS"]       { background: #02AF79; border-color: #02AF79; color: #fff; }
/* ProSECURE — purple */
.qt-plan-btn[data-plan="ProSECURE SAVVY"],
.qt-plan-btn[data-plan="ProSECURE"]            { background: #754691; border-color: #754691; color: #fff; }
/* ProSECURE PLUS — white/outlined (unique treatment per design) */
.qt-plan-btn[data-plan="ProSECURE PLUS SAVVY"],
.qt-plan-btn[data-plan="ProSECURE PLUS"]       { background: #fff; border-color: #632A7E; color: #632A7E; }
.qt-plan-btn[data-plan="ProSECURE PLUS SAVVY"].qt-plan-btn--sel,
.qt-plan-btn[data-plan="ProSECURE PLUS"].qt-plan-btn--sel {
    box-shadow: 0 0 0 2.5px #fff, 0 0 0 5px #632A7E;
}
/* ProPINNACLE — red */
.qt-plan-btn[data-plan="ProPINNACLE SAVVY"],
.qt-plan-btn[data-plan="ProPINNACLE"]          { background: #ED2B47; border-color: #ED2B47; color: #fff; }

/* ── Step 3: Dependant steppers ─────────────────────────────── */
.qt-stepper-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 1.2rem;
    background: #f6f6f6;
    border-radius: 14px;
    margin-bottom: 1rem;
    gap: 1rem;
}
.qt-stepper-label { flex: 1; min-width: 0; }
.qt-stepper-label h4 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-black);
    margin: 0 0 0.15rem;
}
.qt-stepper-label p {
    font-size: 0.76rem;
    color: #999;
    margin: 0;
    line-height: 1.4;
}
.qt-stepper {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-shrink: 0;
}
.qt-stepper-dec,
.qt-stepper-inc {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 2px solid var(--color-black);
    background: transparent;
    color: var(--color-black);
    font-size: 1.3rem;
    font-weight: 300;
    font-family: var(--font-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    line-height: 1;
    padding: 0;
}
.qt-stepper-dec:hover,
.qt-stepper-inc:hover { background: var(--color-black); color: #fff; }
.qt-stepper-val {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 1.35rem;
    min-width: 22px;
    text-align: center;
    color: var(--color-black);
}

/* ── Step 4: Quote result ─────────────────────────────────────── */
.qt-result-plan {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 50px;
    border: 2px solid currentColor;
    padding: 0.45rem 1rem;
    margin-bottom: 1.4rem;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.88rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.qt-pill-pro {
    font-size: 0.68rem;
    opacity: 0.6;
    letter-spacing: 0.15em;
}
.qt-pill-name { letter-spacing: 0.06em; }
.qt-pill-savvy {
    background: rgba(0,0,0,0.1);
    border-radius: 50px;
    padding: 0.08rem 0.45rem;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
}

.qt-result-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.25rem;
}
.qt-result-table td {
    padding: 0.7rem 0;
    border-bottom: 1px solid rgba(0,0,0,0.07);
    font-family: var(--font-primary);
    font-size: 0.9rem;
    color: var(--color-black);
    vertical-align: middle;
}
.qt-result-table td:last-child {
    text-align: right;
    font-weight: var(--fw-bold);
    white-space: nowrap;
}
.qt-total-row td {
    border-bottom: none !important;
    border-top: 2px solid var(--color-black);
    padding-top: 0.9rem;
    font-size: 1.05rem;
    font-weight: var(--fw-bold) !important;
}

.qt-disclaimer {
    font-size: 0.74rem;
    color: #aaa;
    line-height: 1.55;
    margin-bottom: 1.5rem;
}

/* ── Result action buttons ───────────────────────────────────── */
.qt-result-actions {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    margin-bottom: 1.5rem;
}
#qt-print-btn {
    display: block;
    width: 100%;
    padding: 1rem;
    font-size: 0.9rem;
    letter-spacing: 0.1em;
    border-radius: 100px;
    background: var(--color-black);
    color: #fff;
    border: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.2s;
    text-align: center;
}
#qt-print-btn:hover { opacity: 0.82; }

.qt-contact-link {
    display: block;
    width: 100%;
    padding: 1rem;
    font-size: 0.88rem;
    letter-spacing: 0.09em;
    border-radius: 100px;
    background: transparent;
    color: var(--color-black);
    border: 2px solid var(--color-black);
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
    box-sizing: border-box;
}
.qt-contact-link:hover { background: var(--color-black); color: #fff; text-decoration: none; }

/* ── Email-this-quote section ────────────────────────────────── */
.qt-email-section {
    background: #f5f5f5;
    border-radius: 14px;
    padding: 1.2rem;
    margin-bottom: 1rem;
}
.qt-email-section h4 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 0 0.8rem;
    color: var(--color-black);
}
#qt-email-input {
    display: block;
    width: 100%;
    padding: 0.85rem 1rem;
    border: 1.5px solid rgba(0,0,0,0.14);
    border-radius: 10px;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    color: var(--color-black);
    background: #fff;
    margin-bottom: 0.7rem;
    outline: none;
    transition: border-color 0.2s;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;
}
#qt-email-input:focus { border-color: var(--color-black); }
#qt-email-input.qt-field--err { border-color: #e53935 !important; background: #fff8f8; }

#qt-email-send-btn {
    display: block;
    width: 100%;
    padding: 0.9rem;
    font-size: 0.88rem;
    letter-spacing: 0.1em;
    border-radius: 100px;
    background: var(--color-lime);
    color: var(--color-black);
    border: none;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.2s;
}
#qt-email-send-btn:hover { opacity: 0.82; }
#qt-email-send-btn:disabled { opacity: 0.55; cursor: not-allowed; }

.qt-email-msg {
    margin-top: 0.55rem;
    font-family: var(--font-primary);
    font-size: 0.83rem;
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    display: none;
}
.qt-email-msg--ok  { display: block; background: #e8f5e9; color: #2e7d32; }
.qt-email-msg--err { display: block; background: #ffebee; color: #c62828; }

/* ── Print styles ────────────────────────────────────────────── */
@media print {
    #pm-phase1-nav,
    .pm-menu-overlay,
    .pm-breadcrumb,
    .qt-intro,
    .qt-tabs,
    .qt-result-actions,
    .qt-email-section,
    .qt-btn-back,
    .app-section,
    footer { display: none !important; }
    body { background: #fff !important; }
    .qt-panel { display: block !important; padding: 1rem 0 !important; }
}


/* ============================================================
   29. MEMBERS PAGE
   ============================================================ */

/* ── Hero ──────────────────────────────────────────────────── */
.pm-members-hero {
    background: var(--color-black);
    color: #fff;
    padding: 3rem 1.5rem 2.5rem;
    text-align: left;
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    box-sizing: border-box;
    padding-left: calc(50vw - 50% + 1.5rem);
    padding-right: calc(50vw - 50% + 1.5rem);
}
.pm-members-hero h1 {
    font-family: var(--font-primary);
    font-size: clamp(2.4rem, 9vw, 3.2rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.03em;
    text-transform: uppercase;
    line-height: 1.05;
    color: #fff;
    margin: 0 0 2.25rem;
}
.pm-members-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.pm-members-action-btn {
    display: block;
    padding: 0.95rem 1.5rem;
    border-radius: 100px;
    font-family: var(--font-primary);
    font-size: 0.82rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.18s;
    box-sizing: border-box;
    background: transparent;
    color: #fff;
    border: 2px solid rgba(255,255,255,0.65);
}
.pm-members-action-btn:hover { opacity: 0.78; text-decoration: none; color: #fff; }
.pm-members-action-btn--primary {
    background: var(--color-lime);
    border-color: var(--color-lime);
    color: var(--color-black);
}
.pm-members-action-btn--primary:hover { color: var(--color-black); }

/* ── List sections ─────────────────────────────────────────── */
.pm-members-section {
    padding: 2rem 1.5rem 1.5rem;
    border-bottom: 1px solid var(--color-border);
}
.pm-members-section:last-of-type { border-bottom: none; }

.pm-members-section-title {
    font-family: var(--font-primary);
    font-size: 0.65rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--color-black);
    margin: 0 0 1.25rem;
    padding-bottom: 0.6rem;
    border-bottom: 2.5px solid var(--color-lime);
    display: inline-block;
}

.pm-members-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.pm-members-list li {
    border-bottom: 1px solid rgba(0,0,0,0.07);
}
.pm-members-list li:last-child { border-bottom: none; }
.pm-members-list li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.95rem 0;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    font-weight: var(--fw-regular);
    color: var(--color-black);
    text-decoration: none;
    transition: color 0.15s;
}
.pm-members-list li a::after {
    content: '\f054';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.65rem;
    color: var(--color-lime);
    flex-shrink: 0;
    margin-left: 1rem;
}
.pm-members-list li a:hover { color: #444; text-decoration: none; }

/* ── Additional benefits chips ─────────────────────────────── */
.pm-members-chips {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-top: 0.25rem;
}
.pm-members-chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.95rem 1.1rem;
    background: #f2f2f2;
    border-radius: 10px;
    font-family: var(--font-primary);
    font-size: 0.86rem;
    font-weight: var(--fw-regular);
    color: var(--color-black);
    text-decoration: none;
    transition: background 0.15s;
}
.pm-members-chip::after {
    content: '\f054';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 0.62rem;
    color: #999;
    flex-shrink: 0;
    margin-left: 0.8rem;
}
.pm-members-chip:hover { background: #e8e8e8; text-decoration: none; color: var(--color-black); }


/* ============================================================
   30. BLOG LIST PAGE
   ============================================================ */

/* ── Hero ──────────────────────────────────────────────────── */
.pm-blog-hero {
    background: #fff;
    padding: 2.5rem 1.5rem 1.75rem;
}
.pm-blog-hero h1 {
    font-family: var(--font-primary);
    font-size: clamp(1.9rem, 7.5vw, 2.8rem);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    line-height: 1.08;
    color: var(--color-black);
    margin: 0 0 1rem;
}
.pm-blog-hero p {
    font-family: var(--font-primary);
    font-size: 0.96rem;
    font-weight: var(--fw-light);
    line-height: 1.65;
    color: #444;
    margin: 0;
    max-width: 38ch;
}

/* ── Category filters ──────────────────────────────────────── */
.pm-blog-filters {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0 1.5rem 1.5rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.pm-blog-filters::-webkit-scrollbar { display: none; }

.pm-blog-filter-btn {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 1.05rem;
    border-radius: 100px;
    font-family: var(--font-primary);
    font-size: 0.7rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--color-black);
    background: transparent;
    border: 1.5px solid rgba(0,0,0,0.2);
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.pm-blog-filter-btn--active,
.pm-blog-filter-btn:hover {
    background: var(--color-black);
    color: #fff;
    border-color: var(--color-black);
    text-decoration: none;
}
.pm-blog-search-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 100px;
    border: 1.5px solid rgba(0,0,0,0.2);
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
    margin-left: auto;
    color: var(--color-black);
    font-size: 0.8rem;
    transition: background 0.15s;
}
.pm-blog-search-btn:hover { background: #f0f0f0; }

/* ── Category chips ────────────────────────────────────────── */
.pm-blog-cat-chip {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 100px;
    font-family: var(--font-primary);
    font-size: 0.62rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #fff;
    background: var(--color-black);
    text-decoration: none;
}
.pm-blog-cat-chip--sm { font-size: 0.58rem; padding: 0.2rem 0.6rem; }

/* ── Featured article ──────────────────────────────────────── */
.pm-blog-featured {
    padding: 0 1.5rem 1.5rem;
}
.pm-blog-featured-inner {
    display: block;
    border-radius: 16px;
    overflow: hidden;
    background: #222;
    background-size: cover;
    background-position: center;
    min-height: 380px;
    position: relative;
    text-decoration: none;
}
.pm-blog-featured-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.18) 55%, transparent 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 1.5rem;
    gap: 0.5rem;
}
.pm-blog-featured-overlay h2 {
    font-family: var(--font-primary);
    font-size: clamp(1.2rem, 5vw, 1.65rem);
    font-weight: var(--fw-bold);
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.2;
    margin: 0;
}
.pm-blog-featured-overlay p {
    font-family: var(--font-primary);
    font-size: 0.85rem;
    font-weight: var(--fw-light);
    color: rgba(255,255,255,0.82);
    line-height: 1.5;
    margin: 0;
}

/* ── Blog section heading ──────────────────────────────────── */
.pm-blog-section-heading {
    font-family: var(--font-primary);
    font-size: 0.65rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--color-black);
    padding: 0 1.5rem;
    margin: 0 0 1rem;
    padding-bottom: 0.6rem;
}

/* ── Article grid ──────────────────────────────────────────── */
.pm-blog-latest { padding-bottom: 0.5rem; }

.pm-blog-grid {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.pm-blog-card {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 0.85rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    text-decoration: none;
}
.pm-blog-card-img-wrap {
    flex-shrink: 0;
    width: 88px;
    height: 88px;
    aspect-ratio: 1 / 1;
    border-radius: 12px;
    overflow: hidden;
    display: block;
    background: #eee;
}
.pm-blog-card-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pm-blog-card-img-placeholder {
    width: 100%;
    height: 100%;
}
.pm-blog-card-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.pm-blog-card-body h3 {
    margin: 0;
}
.pm-blog-card-body h3 a {
    font-family: var(--font-primary);
    font-size: 0.88rem;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--color-black);
    text-decoration: none;
    line-height: 1.25;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.pm-blog-card-body h3 a:hover { color: #444; }
.pm-blog-card-body p {
    font-family: var(--font-primary);
    font-size: 0.78rem;
    font-weight: var(--fw-light);
    color: #666;
    line-height: 1.5;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.pm-blog-card-date {
    font-family: var(--font-primary);
    font-size: 0.68rem;
    color: #aaa;
    margin-top: 0.1rem;
}
.pm-blog-load-more {
    padding: 1.5rem;
    text-align: center;
}
.pm-blog-more-btn {
    display: inline-block;
    padding: 0.9rem 2rem;
    border-radius: 100px;
    font-family: var(--font-primary);
    font-size: 0.8rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-black);
    border: 2px solid var(--color-black);
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
.pm-blog-more-btn:hover { background: var(--color-black); color: #fff; text-decoration: none; }

/* ── Newsletter section ────────────────────────────────────── */
.pm-newsletter {
    background: var(--color-black);
    color: #fff;
    padding: 2.5rem 1.5rem;
    text-align: center;
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    box-sizing: border-box;
}
.pm-newsletter-inner {
    max-width: 380px;
    margin: 0 auto;
}
.pm-newsletter-icon {
    font-size: 1.8rem;
    color: var(--color-lime);
    margin-bottom: 0.8rem;
    display: block;
}
.pm-newsletter h3 {
    font-family: var(--font-primary);
    font-size: 1.45rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #fff;
    margin: 0 0 0.65rem;
}
.pm-newsletter p {
    font-family: var(--font-primary);
    font-size: 0.88rem;
    font-weight: var(--fw-light);
    line-height: 1.6;
    color: rgba(255,255,255,0.72);
    margin: 0 0 1.5rem;
}
.pm-newsletter-form {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.pm-newsletter-form input[type="email"] {
    width: 100%;
    padding: 0.9rem 1.1rem;
    border-radius: 100px;
    border: 1.5px solid rgba(255,255,255,0.25);
    background: rgba(255,255,255,0.1);
    color: #fff;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    outline: none;
    box-sizing: border-box;
    -webkit-appearance: none;
}
.pm-newsletter-form input[type="email"]::placeholder { color: rgba(255,255,255,0.45); }
.pm-newsletter-form input[type="email"]:focus { border-color: var(--color-lime); }
.pm-newsletter-form button {
    width: 100%;
    padding: 0.95rem;
    border-radius: 100px;
    border: none;
    background: var(--color-lime);
    color: var(--color-black);
    font-family: var(--font-primary);
    font-size: 0.85rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.18s;
}
.pm-newsletter-form button:hover { opacity: 0.82; }
#pm-newsletter-msg {
    margin-top: 0.5rem;
    font-family: var(--font-primary);
    font-size: 0.82rem;
    color: var(--color-lime);
    min-height: 1.2em;
}


/* ============================================================
   31. SINGLE POST — ARTICLE PAGE
   ============================================================ */

/* ── Article header ────────────────────────────────────────── */
/* ============================================================
   30. SINGLE ARTICLE — redesigned May 2026
   ============================================================ */

/* ── Article shell ──────────────────────────────────────────── */
.pm-article {
    background: #fff;
}

/* ── Article hero: stacked (mobile) → image-left / meta-right (desktop) ── */
.pm-article-hero {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    max-width: 1120px;
    margin-inline: auto;
    padding: 1.5rem;
}
/* mobile visual order: title → image → categories → date */
.pm-article-hero .pm-article-title { order: 1; }
.pm-article-hero-media { order: 2; }
.pm-article-cats { order: 3; }
.pm-article-date { order: 4; }

.pm-article-hero-media { width: 100%; align-self: start; }
.pm-article-hero-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;          /* JS face-focus adjusts this per image */
    border-radius: 18px;
    display: block;
    background: #eee;
}
.pm-article-cats { display: flex; flex-wrap: wrap; gap: 0.55rem; margin: 0; }
.pm-article-cat {
    display: inline-block;
    padding: 0.55rem 1.5rem;
    border-radius: 100px;
    font-family: var(--font-primary);
    font-size: 0.82rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #fff !important;
    text-decoration: none !important;
}
.pm-article-cat:link,
.pm-article-cat:visited { color: #fff !important; }
.pm-article-date {
    font-family: var(--font-primary);
    font-size: 0.95rem;
    font-weight: var(--fw-light);
    color: #9a9a9a;
    margin: 0;
}
.pm-article-title {
    font-family: var(--font-primary);
    font-size: clamp(1.7rem, 7vw, 2.4rem);
    font-weight: var(--fw-bold);
    text-transform: uppercase;        /* mobile: uppercase per mockup */
    letter-spacing: 0.01em;
    line-height: 1.12;
    color: #000 !important;
    margin: 0;
}

@media (min-width: 1024px) {
    .pm-article-hero {
        display: grid;
        grid-template-columns: 42% 1fr;
        grid-template-areas:
            "media cats"
            "media date"
            "media title";
        align-items: start;
        column-gap: 3.5rem;
        row-gap: 0.9rem;
        padding: 2.75rem 1.5rem 2rem;
    }
    .pm-article-hero-media { grid-area: media; }
    .pm-article-cats  { grid-area: cats; }
    .pm-article-date  { grid-area: date; }
    .pm-article-title {
        grid-area: title;
        text-transform: none;          /* desktop: Title Case per mockup */
        font-size: clamp(2rem, 3vw, 2.7rem);
        line-height: 1.14;
        margin-top: 0.4rem;
    }
}

/* ── Article body ───────────────────────────────────────────── */
.pm-article-body {
    max-width: 1120px;
    margin-inline: auto;
    padding: 0.5rem 1.5rem 1.75rem;
    font-family: var(--font-primary);
    font-size: 0.97rem;
    font-weight: var(--fw-light);
    line-height: 1.78;
    color: #333;
}
.pm-article-body h2,
.pm-article-body h3 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--color-black);
    margin: 1.75rem 0 0.6rem;
    line-height: 1.2;
}
.pm-article-body h2 { font-size: 1.2rem; }
.pm-article-body h3 { font-size: 1rem; }
.pm-article-body p { margin: 0 0 1.1rem; }
.pm-article-body p:last-child { margin-bottom: 0; }
.pm-article-body a { color: var(--color-black); text-decoration: underline; text-underline-offset: 2px; }
.pm-article-body a:hover { color: #444; }
.pm-article-body ul,
.pm-article-body ol { padding-left: 1.4rem; margin: 0 0 1rem; }
.pm-article-body li { margin-bottom: 0.4rem; }
.pm-article-body strong { font-weight: var(--fw-bold); }
.pm-article-body blockquote {
    border-left: 3px solid var(--color-lime);
    margin: 1.5rem 0;
    padding: 0.5rem 0 0.5rem 1.2rem;
    font-style: italic;
    color: #555;
}
.pm-article-body img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    margin: 1rem 0;
}

/* ── SHARE bar ──────────────────────────────────────────────── */
.pm-article-share {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem 1.75rem;
    border-top: 1px solid rgba(0,0,0,0.08);
    flex-wrap: wrap;
}
.pm-article-share-label {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.82rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-black);
    flex-shrink: 0;
}
.pm-article-share-icons {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}
/* Circular black share button */
.pm-share-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--color-black);
    text-decoration: none !important;
    flex-shrink: 0;
    transition: opacity 0.2s;
}
.pm-share-icon:hover { opacity: 0.72; }
.pm-share-icon img {
    width: 17px;
    height: 17px;
    display: block;
    /* Force white: brightness(0) collapses any fill to black, invert(1) flips to white */
    filter: brightness(0) invert(1);
}

/* ── YOU MIGHT ALSO LIKE ────────────────────────────────────── */
.pm-related {
    background: #f5f5f5;
    width: 100vw !important;
    position: relative;
    left: 50%;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    box-sizing: border-box;
    padding-bottom: 1.5rem;
}
.pm-related-heading {
    font-family: var(--font-primary);
    font-size: 1.5rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-black);
    padding: 1.75rem 1.5rem 1rem;
    margin: 0;
    border-bottom: 2.5px solid var(--color-lime);
}
.pm-related-grid {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.pm-related-card {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    text-decoration: none !important;
    background: #f5f5f5;
    transition: background 0.15s;
}
.pm-related-card:last-child { border-bottom: none; }
.pm-related-card:hover { background: #eeeeee; }

/* Thumbnail */
.pm-related-card-img {
    flex-shrink: 0;
    width: 88px;
    height: 88px;
    aspect-ratio: 1 / 1;
    border-radius: 12px;
    overflow: hidden;
    background: #ddd;
}
.pm-related-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pm-related-card-img-placeholder {
    width: 100%;
    height: 100%;
}

/* Card text */
.pm-related-card-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}
.pm-related-cat {
    font-family: var(--font-primary);
    font-size: 0.6rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    /* color set via inline style from PHP */
}
.pm-related-title {
    font-family: var(--font-primary);
    font-size: 0.85rem;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--color-black);
    line-height: 1.25;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.pm-related-card:hover .pm-related-title { color: #444; }
.pm-related-date {
    font-family: var(--font-primary);
    font-size: 0.68rem;
    color: #aaa;
    margin-top: 0.1rem;
}


/* ============================================================
   32. GENERAL CONTENT PAGES — typography / layout base
   ============================================================ */

/* Give all default pages breathing room and consistent type */
body:not(.page-id-35754):not(.home) .site-main {
    max-width: 100%;
}

/* Entry content inside any default-template page */
.site-main .entry-content,
.site-main .entry-header + .entry-content,
body:not(.page-id-35754) .site-main article .entry-content {
    padding: 0;
    font-family: var(--font-primary);
    font-size: 0.97rem;
    font-weight: var(--fw-light);
    line-height: 1.75;
    color: #333;
    max-width: 100%;
}

/* Content wrapper padding when NOT using empty.php or our custom templates.
   Exclude home, benefit-options (153), and any empty.php template pages. */
body:not(.page-template-pm-blog-list):not(.page-template-empty) .site-main article {
    padding-bottom: 0;
    margin-bottom: 0;
}
/* Zero out article bottom spacing for empty.php pages too */
body.page-template-empty .site-main article {
    padding-bottom: 0;
    margin-bottom: 0;
}
body:not(.page-template-pm-blog-list):not(.page-template-empty):not(.single-post):not(.home):not(.page-id-153) .site-main .entry-content {
    padding: 0 1.5rem 3rem; /* top handled by body padding-top: 70px */
}

/* Headings inside entry-content — exclude home and benefit-options page
   which have their own heading colours in Sections 11 and 26 */
body:not(.home):not(.page-id-153) .entry-content h1,
body:not(.home):not(.page-id-153) .entry-content h2,
body:not(.home):not(.page-id-153) .entry-content h3,
body:not(.home):not(.page-id-153) .entry-content h4 {
    font-family: var(--font-primary) !important;
    font-weight: var(--fw-bold) !important;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--color-black);
    margin-top: 1.75rem;
    margin-bottom: 0.65rem;
    line-height: 1.15;
}
body:not(.home):not(.page-id-153) .entry-content h1 { font-size: clamp(1.8rem, 7vw, 2.6rem) !important; margin-top: 0; }
body:not(.home):not(.page-id-153) .entry-content h2 { font-size: clamp(1.25rem, 5vw, 1.65rem) !important; }
body:not(.home):not(.page-id-153) .entry-content h3 { font-size: 1.05rem !important; }
body:not(.home):not(.page-id-153) .entry-content h4 { font-size: 0.9rem !important; }

.entry-content p { margin: 0 0 1rem; }
.entry-content a { color: var(--color-black); text-decoration: underline; text-underline-offset: 2px; }
.entry-content a:hover { opacity: 0.7; }

.entry-content ul, .entry-content ol {
    padding-left: 1.4rem;
    margin: 0 0 1rem;
}
.entry-content li { margin-bottom: 0.4rem; line-height: 1.65; }

/* Tables */
.entry-content table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
    margin: 1.25rem 0;
    overflow-x: auto;
    display: block;
}
.entry-content table th,
.entry-content table td {
    padding: 0.65rem 0.85rem;
    border: 1px solid var(--color-border);
    text-align: left;
    vertical-align: top;
}
.entry-content table th {
    background: var(--color-black);
    color: #fff;
    font-weight: var(--fw-bold);
    font-size: 0.78rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.entry-content table tr:nth-child(even) { background: #fafafa; }

/* Buttons inside content */
.entry-content .wp-block-button__link,
.entry-content a.button,
.entry-content .btn {
    font-family: var(--font-primary) !important;
    font-weight: var(--fw-bold) !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
}

/* Images */
.entry-content img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

/* Gutenberg separator */
.entry-content hr {
    border: none;
    border-top: 2px solid var(--color-border);
    margin: 2rem 0;
}

/* Page-level breadcrumb for default pages */
body:not(.page-id-35754):not(.home) .pm-breadcrumb {
    padding: 0.9rem 1.5rem;
    background: transparent;
}


/* ============================================================
   33. BOOTSTRAP ROW FIX — remove gutters that cause overflow
   ============================================================ */
.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
#page-wrapper {
    padding: 0 !important;
    overflow-x: hidden;
}


/* ============================================================
   34. AUTO-WRAPPED CONTENT PAGES (.pm-content-page)
   Applied by functions.php filter to default-template pages
   that don't already have Phase 1 HTML.
   ============================================================ */

.pm-content-page {
    padding: 0 1.5rem 3rem;
    font-family: var(--font-primary);
}

.pm-content-page-title {
    font-family: var(--font-primary);
    font-size: clamp(1.7rem, 7vw, 2.5rem);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    line-height: 1.1;
    color: var(--color-black);
    margin: 1.5rem 0 1.25rem;
    padding-bottom: 0.85rem;
    border-bottom: 2.5px solid var(--color-lime);
}

.pm-content-page-body {
    font-size: 0.97rem;
    font-weight: var(--fw-light);
    line-height: 1.75;
    color: #333;
}
.pm-content-page-body h1,
.pm-content-page-body h2,
.pm-content-page-body h3,
.pm-content-page-body h4 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--color-black);
    margin: 1.75rem 0 0.6rem;
    line-height: 1.15;
}
.pm-content-page-body h1 { font-size: clamp(1.4rem, 5.5vw, 2rem); margin-top: 0; }
.pm-content-page-body h2 { font-size: clamp(1.1rem, 4.5vw, 1.45rem); }
.pm-content-page-body h3 { font-size: 1rem; }
.pm-content-page-body h4 { font-size: 0.88rem; }
.pm-content-page-body p { margin: 0 0 1rem; }
.pm-content-page-body a { color: var(--color-black); text-decoration: underline; text-underline-offset: 2px; }
.pm-content-page-body a:hover { opacity: 0.7; text-decoration: none; }
.pm-content-page-body ul,
.pm-content-page-body ol {
    padding-left: 1.4rem;
    margin: 0 0 1rem;
}
.pm-content-page-body li { margin-bottom: 0.45rem; line-height: 1.65; }
.pm-content-page-body img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    margin: 0.75rem 0;
}
.pm-content-page-body table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.86rem;
    margin: 1.25rem 0;
    overflow-x: auto;
    display: block;
}
.pm-content-page-body table th,
.pm-content-page-body table td {
    padding: 0.6rem 0.8rem;
    border: 1px solid var(--color-border);
    text-align: left;
    vertical-align: top;
}
.pm-content-page-body table th {
    background: var(--color-black);
    color: #fff;
    font-weight: var(--fw-bold);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.pm-content-page-body table tr:nth-child(even) { background: #fafafa; }
.pm-content-page-body hr {
    border: none;
    border-top: 2px solid var(--color-border);
    margin: 2rem 0;
}
.pm-content-page-body blockquote {
    border-left: 3px solid var(--color-lime);
    margin: 1.5rem 0;
    padding: 0.4rem 0 0.4rem 1.2rem;
    font-style: italic;
    color: #555;
}
.pm-content-page-body .wp-block-button__link {
    font-family: var(--font-primary) !important;
    font-weight: var(--fw-bold) !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
}

/* Empty state */
.pm-content-page--empty .pm-content-page-placeholder {
    color: #aaa;
    font-style: italic;
    font-size: 0.9rem;
    margin-top: 1.5rem;
}


/* ============================================================
   35. BENEFIT PLAN PAGES
   ============================================================ */

/* Hero */
.pm-plan-hero {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    padding: 4rem 1.5rem 3.5rem;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
}
.pm-plan-hero::after { display: none; }   /* lime line beneath plan headers removed */
.pm-plan-hero-inner {
    max-width: 760px;
    width: 100%;
    text-align: left;
}
.pm-plan-hero-label {
    display: inline-block;
    font-family: var(--font-primary);
    font-size: 0.72rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.6);
    margin-bottom: 0.9rem;
}
.pm-plan-hero-name {
    font-family: var(--font-primary);
    font-size: clamp(2rem, 9vw, 3.6rem);
    font-weight: var(--fw-light);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #fff;
    line-height: 1.05;
    margin: 0 0 1rem;
}
.pm-plan-hero-name strong { font-weight: var(--fw-bold); }
.pm-plan-hero-tagline {
    font-family: var(--font-primary);
    font-size: clamp(0.88rem, 3.5vw, 1.08rem);
    font-weight: var(--fw-light);
    color: rgba(255,255,255,0.8);
    line-height: 1.55;
    margin: 0;
    max-width: 520px;
}

/* Plan colour variants */
.pm-plan-hero--pinnacle  { background: #ED2B47; }
.pm-plan-hero--select    { background: #F79719; }
.pm-plan-hero--active    { background: #02AF79; }
.pm-plan-hero--secure    { background: #754691; }

/* About / intro */
.pm-plan-about {
    padding: 2.5rem 1.5rem 0;
    max-width: 760px;
}
.pm-plan-about p {
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: var(--fw-light);
    line-height: 1.75;
    color: #333;
    margin: 0;
}

/* Benefits list */
.pm-plan-benefits-section {
    padding: 2rem 1.5rem 2.5rem;
    max-width: 760px;
}
.pm-plan-benefits-heading {
    font-family: var(--font-primary);
    font-size: clamp(0.95rem, 4vw, 1.2rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-black);
    margin: 0 0 1.2rem;
    padding-bottom: 0.6rem;
    border-bottom: 2.5px solid var(--color-lime);
}
.pm-plan-benefits {
    list-style: none;
    padding: 0;
    margin: 0;
}
.pm-plan-benefits li {
    font-family: var(--font-primary);
    font-size: 0.97rem;
    font-weight: var(--fw-light);
    line-height: 1.65;
    color: #333;
    padding: 0.65rem 0 0.65rem 2rem;
    border-bottom: 1px solid rgba(0,0,0,0.07);
    position: relative;
}
.pm-plan-benefits li::before {
    content: '\f00c';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    color: #02AF79;
    position: absolute;
    left: 0;
    top: 0.72rem;
    font-size: 0.78rem;
}

/* Savvy callout */
.pm-plan-savvy-callout {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: #f5f5f5;
    padding: 2rem 1.5rem;
    box-sizing: border-box;
    border-left: none;
}
.pm-plan-savvy-inner {
    max-width: 760px;
}
.pm-plan-savvy-callout h3 {
    font-family: var(--font-primary);
    font-size: 0.8rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-black);
    margin: 0 0 0.6rem;
}
.pm-plan-savvy-callout p {
    font-family: var(--font-primary);
    font-size: 0.93rem;
    font-weight: var(--fw-light);
    line-height: 1.65;
    color: #555;
    margin: 0;
}

/* CTA section */
.pm-plan-cta-section {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: var(--color-black);
    padding: 3rem 1.5rem;
    box-sizing: border-box;
    text-align: center;
}
.pm-plan-cta-section h2 {
    font-family: var(--font-primary);
    font-size: clamp(1.1rem, 5vw, 1.65rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #fff;
    margin: 0 0 1.75rem;
}
.pm-plan-cta-btns {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-width: 340px;
    margin: 0 auto;
}
.pm-plan-cta-btn {
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none !important;
    padding: 1.1rem 2rem;
    border-radius: 100px;
    transition: opacity 0.2s;
    display: block;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
}
.pm-plan-cta-btn:link,
.pm-plan-cta-btn:visited { text-decoration: none !important; }
.pm-plan-cta-btn:hover   { opacity: 0.82; text-decoration: none !important; }

.pm-plan-cta-btn--primary { background: var(--color-lime); color: var(--color-black) !important; }
.pm-plan-cta-btn--primary:link,
.pm-plan-cta-btn--primary:visited { color: var(--color-black) !important; }

.pm-plan-cta-btn--outline { background: transparent; color: #fff !important; border: 2px solid rgba(255,255,255,0.5); }
.pm-plan-cta-btn--outline:link,
.pm-plan-cta-btn--outline:visited { color: #fff !important; }
.pm-plan-cta-btn--outline:hover   { border-color: #fff; color: #fff !important; }

@media (min-width: 769px) {
    .pm-plan-hero { padding: 5.5rem 2rem 4.5rem; }
    .pm-plan-about { padding: 3rem 2rem 0; }
    .pm-plan-benefits-section { padding: 2.5rem 2rem 3rem; }
}


/* ============================================================
   36. PROFESSIONAL LANDING PAGES
   ============================================================ */

.pm-prof-hero {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: var(--color-black);
    padding: 4rem 1.5rem 3.5rem;
    box-sizing: border-box;
    overflow: hidden;
}
.pm-prof-hero::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 100%;
    height: 4px;
    background: var(--color-lime);
}
.pm-prof-hero-inner {
    max-width: 760px;
    position: relative;
    z-index: 1;
}
.pm-prof-hero-label {
    font-family: var(--font-primary);
    font-size: 0.72rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--color-lime);
    display: block;
    margin-bottom: 0.75rem;
}
.pm-prof-hero-name {
    font-family: var(--font-primary);
    font-size: clamp(2rem, 8.5vw, 3.4rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.05;
    margin: 0 0 0.8rem;
}
.pm-prof-hero-sub {
    font-family: var(--font-primary);
    font-size: 0.95rem;
    font-weight: var(--fw-light);
    color: rgba(255,255,255,0.6);
    margin: 0;
    letter-spacing: 0.05em;
}

/* Intro */
.pm-prof-intro {
    padding: 2.5rem 1.5rem 0;
    max-width: 760px;
}
.pm-prof-intro p {
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: var(--fw-light);
    line-height: 1.8;
    color: #333;
    margin: 0;
}

/* Pillar grid */
.pm-prof-pillars {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1px;
    background: rgba(0,0,0,0.07);
    margin: 2.5rem 0 0;
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    box-sizing: border-box;
}
.pm-prof-pillar {
    background: #fff;
    padding: 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.pm-prof-pillar-icon {
    width: 44px;
    height: 44px;
    background: var(--color-lime);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-bottom: 0.4rem;
}
.pm-prof-pillar h3 {
    font-family: var(--font-primary);
    font-size: 0.8rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-black);
    margin: 0;
}
.pm-prof-pillar p {
    font-family: var(--font-primary);
    font-size: 0.9rem;
    font-weight: var(--fw-light);
    line-height: 1.65;
    color: #555;
    margin: 0;
}

/* Prof CTA */
.pm-prof-cta {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: var(--color-black);
    padding: 3rem 1.5rem;
    box-sizing: border-box;
    text-align: center;
    margin-top: 0;
}
.pm-prof-cta h2 {
    font-family: var(--font-primary);
    font-size: clamp(1.05rem, 5vw, 1.55rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #fff;
    margin: 0 0 0.6rem;
    line-height: 1.2;
}
.pm-prof-cta p {
    font-family: var(--font-primary);
    font-size: 0.93rem;
    font-weight: var(--fw-light);
    color: rgba(255,255,255,0.55);
    margin: 0 0 1.75rem;
    line-height: 1.6;
}
.pm-prof-cta-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
}
.pm-prof-cta-btn {
    font-family: var(--font-primary);
    font-size: 0.75rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.9rem 1.75rem;
    border-radius: 3px;
    transition: opacity 0.2s;
    display: inline-block;
}
.pm-prof-cta-btn:hover { opacity: 0.82; text-decoration: none !important; }
.pm-prof-cta-btn--primary  { background: var(--color-lime); color: var(--color-black); }
.pm-prof-cta-btn--outline  { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,0.4); }
.pm-prof-cta-btn--outline:hover { border-color: #fff; }

@media (min-width: 769px) {
    .pm-prof-pillars { grid-template-columns: repeat(3, 1fr); }
    .pm-prof-hero { padding: 5.5rem 2rem 4.5rem; }
    .pm-prof-intro { padding: 3rem 2rem 0; }
}


/* ============================================================
   37. SERVICE, CONTACT & JOIN PAGES
   ============================================================ */

/* Generic service page hero */
.pm-service-hero {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: var(--color-black);
    padding: 3rem 1.5rem 2.75rem;
    box-sizing: border-box;
}
.pm-service-hero::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 4rem;
    height: 4px;
    background: var(--color-lime);
}
.pm-service-hero h1 {
    font-family: var(--font-primary);
    font-size: clamp(1.7rem, 7vw, 2.6rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #fff;
    margin: 0 0 0.45rem;
    line-height: 1.1;
}
.pm-service-hero p {
    font-family: var(--font-primary);
    font-size: 0.93rem;
    font-weight: var(--fw-light);
    color: rgba(255,255,255,0.6);
    margin: 0;
    max-width: 520px;
}

/* Service body */
.pm-service-body {
    padding: 2rem 1.5rem 3rem;
    max-width: 760px;
    font-family: var(--font-primary);
    font-size: 0.97rem;
    font-weight: var(--fw-light);
    line-height: 1.75;
    color: #333;
}
.pm-service-body h2 {
    font-family: var(--font-primary);
    font-size: clamp(1.05rem, 4vw, 1.3rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-black);
    margin: 2.25rem 0 0.9rem;
    padding-bottom: 0;
    border-bottom: none;
}
/* Refined short accent bar instead of the heavy full-width lime underline.
   Uses --pm-accent so each page can match its own highlight colour. */
.pm-service-body h2::after {
    content: '';
    display: block;
    width: 2.75rem;
    height: 3px;
    border-radius: 2px;
    background: var(--pm-accent, #02AF79);
    margin-top: 0.6rem;
}
.pm-service-body h2:first-child { margin-top: 0; }
.pm-service-body h3 {
    font-family: var(--font-primary);
    font-size: 0.95rem;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-black);
    margin: 1.5rem 0 0.5rem;
}
.pm-service-body p { margin: 0 0 0.9rem; }
.pm-service-body a { color: var(--color-black); text-decoration: underline; text-underline-offset: 2px; }
.pm-service-body a:hover { opacity: 0.7; }
.pm-service-body ul {
    list-style: none;
    padding: 0;
    margin: 0 0 1.2rem;
}
.pm-service-body ul li {
    padding: 0.5rem 0 0.5rem 1.75rem;
    position: relative;
    border-bottom: 1px solid rgba(0,0,0,0.06);
    font-size: 0.95rem;
}
.pm-service-body ul li::before {
    content: '\f00c';                       /* solid check — reliable across the FA build */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    color: var(--pm-accent, #02AF79);
    position: absolute;
    left: 0;
    font-size: 0.78rem;
    top: 0.62rem;
}
/* For li inside service body, lime chevron on white is low contrast —
   override for items that are text-heavy */
.pm-service-body ul li::before { color: #999; }

.pm-service-callout {
    background: #f5f5f5;
    border-left: 3px solid var(--color-lime);
    padding: 1.25rem 1.25rem;
    margin: 1.5rem 0;
    border-radius: 0 6px 6px 0;
}
.pm-service-callout p { margin: 0; font-size: 0.93rem; }
.pm-service-callout a { font-weight: var(--fw-bold); }
.pm-service-callout strong { font-weight: var(--fw-bold); }

/* Contact page */
.pm-contact-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    padding: 2rem 1.5rem 3rem;
}
.pm-contact-card {
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 10px;
    padding: 1.75rem 1.5rem;
    background: #fff;
}
.pm-contact-card-label {
    font-family: var(--font-primary);
    font-size: 0.65rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #6786F9;
    display: block;
    margin-bottom: 0.5rem;
}
.pm-contact-card h3 {
    font-family: var(--font-primary);
    font-size: 0.82rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-black);
    margin: 0 0 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}
.pm-contact-items {
    list-style: none;
    padding: 0;
    margin: 0;
}
.pm-contact-items li {
    font-family: var(--font-primary);
    font-size: 0.95rem;
    font-weight: var(--fw-light);
    color: #333;
    padding: 0.35rem 0;
    display: flex;
    align-items: center;
    gap: 0.7rem;
}
.pm-contact-items li i {
    color: var(--color-black);
    width: 1rem;
    flex-shrink: 0;
    font-size: 0.85rem;
}
.pm-contact-items a {
    color: var(--color-black);
    text-decoration: none;
    font-weight: var(--fw-bold);
}
.pm-contact-items a:hover { text-decoration: underline; }

/* Join / How to Join page */
.pm-join-hero {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: var(--color-black);
    padding: 3.5rem 1.5rem 3rem;
    box-sizing: border-box;
}
.pm-join-hero::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 4rem;
    height: 4px;
    background: var(--color-lime);
}
.pm-join-hero h1 {
    font-family: var(--font-primary);
    font-size: clamp(1.9rem, 7.5vw, 2.8rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #fff;
    margin: 0 0 0.6rem;
    line-height: 1.1;
}
.pm-join-hero p {
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: var(--fw-light);
    color: rgba(255,255,255,0.7);
    margin: 0;
    max-width: 540px;
    line-height: 1.6;
}
.pm-join-body {
    padding: 2rem 1.5rem;
    max-width: 760px;
    font-family: var(--font-primary);
    font-size: 0.97rem;
    font-weight: var(--fw-light);
    line-height: 1.75;
    color: #333;
}
.pm-join-body p { margin: 0 0 1rem; }
.pm-join-body a { color: var(--color-black); font-weight: var(--fw-bold); text-decoration: underline; }
.pm-join-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    padding: 0 1.5rem 2.5rem;
}
.pm-join-card {
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 10px;
    padding: 1.75rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.pm-join-card-icon { font-size: 1.6rem; margin-bottom: 0.25rem; }
.pm-join-card h3 {
    font-family: var(--font-primary);
    font-size: 0.82rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-black);
    margin: 0;
}
.pm-join-card p {
    font-family: var(--font-primary);
    font-size: 0.91rem;
    font-weight: var(--fw-light);
    color: #555;
    line-height: 1.6;
    margin: 0;
}
.pm-join-card a {
    font-family: var(--font-primary);
    font-size: 0.78rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-black);
    text-decoration: none;
    margin-top: 0.35rem;
    display: inline-block;
}
.pm-join-card a::after { content: ' \2192'; }
.pm-join-card a:hover { text-decoration: underline; }

@media (min-width: 769px) {
    .pm-contact-grid   { grid-template-columns: repeat(2, 1fr); padding: 2.5rem 2rem 3.5rem; }
    .pm-join-cards     { grid-template-columns: repeat(3, 1fr); padding: 0 2rem 3rem; }
    .pm-join-body      { padding: 2.5rem 2rem; }
    .pm-service-hero   { padding: 4rem 2rem 3.5rem; }
    .pm-service-body   { padding: 2.5rem 2rem 3.5rem; }
}


/* ============================================================
   38. GLOBAL FIXES — v1.4.0
   ============================================================ */

/* ── Plan card header: force white text on all children (cache-bust backup) ── */
.bo-plan-header,
.bo-plan-header div,
.bo-plan-header span,
.bo-plan-header .pill-pre,
.bo-plan-header .pill-name {
    color: #fff !important;
    text-decoration: none !important;
}
/* header is now a link to the plan's benefit-info page — keep it a full-width block */
a.bo-plan-header { display: block; cursor: pointer; }

/* ── No text underlines on any button or pill-link across the site ── */
a.profmed-btn,
a[class*="btn"],
a[class*="button"],
a[class*="-cta"],
a.wq-cta-btn,
a.bo-btn-lime,
a.bo-btn-outline,
a.bo-plan-info-link,
a.bo-plan-quote-btn,
a.pm-members-action-btn,
a.pm-members-chip-link,
a.pm-plan-cta-btn,
a.pm-service-btn,
a.pm-join-cta-btn,
a.pm-prof-cta-btn,
a.pm-nav-contact,
a.pm-join-card,
button {
    text-decoration: none !important;
}

/* ── Members portal: round bottom of black hero, bigger labels & links ── */
.pm-members-hero {
    border-radius: 0 0 50% 50% / 0 0 60px 60px;
    overflow: hidden;
}
.pm-members-section-title {
    font-size: 1.65rem !important;
    letter-spacing: 0.04em !important;
}
.pm-members-list li a {
    font-size: 1rem !important;
}

/* ── Who Qualifies (page-id-141): full #f1f1f1 background ── */
body.page-id-141 {
    background-color: #f1f1f1;
}
body.page-id-141 .pm-breadcrumb {
    background: #f1f1f1 !important;
    border-bottom-color: rgba(0,0,0,0.06) !important;
}
/* Remove entry-content padding so sections run edge-to-edge with no footer gap */
body.page-id-141 .entry-content,
body.page-id-141 .site-main,
body.page-id-141 .site-main article {
    padding: 0 !important;
    margin: 0 !important;
}


/* ============================================================
   39. v1.5.0 FIXES
   ============================================================ */

/* ── Benefit Options: force white text on dark buttons ──────
   Parent theme a:link specificity beats .class colour without !important */
.bo-btn-black,
.bo-btn-black:link,
.bo-btn-black:visited { color: #fff !important; }
.bo-btn-black:hover   { color: #fff !important; opacity: 0.82; }

.bo-plan-quote-btn,
.bo-plan-quote-btn:link,
.bo-plan-quote-btn:visited { color: #fff !important; }
.bo-plan-quote-btn:hover   { color: #fff !important; }

/* ── "WANT TO COMPARE" section button → lime text on black ── */
.bo-compare-btn                       { color: var(--color-lime) !important; }
.bo-compare-btn:link,
.bo-compare-btn:visited               { color: var(--color-lime) !important; }
.bo-compare-btn:hover                 { color: var(--color-lime) !important; opacity: 0.85; }

/* ── Contact page (page-id-1582): breadcrumb matches black hero ── */
body.page-id-1582 .pm-breadcrumb {
    background: var(--color-black) !important;
    border-bottom-color: rgba(255,255,255,0.12) !important;
}
body.page-id-1582 .pm-breadcrumb,
body.page-id-1582 .pm-breadcrumb a      { color: rgba(255,255,255,0.65) !important; }
body.page-id-1582 .pm-breadcrumb-current { color: #fff !important; }
body.page-id-1582 .pm-breadcrumb-sep     { color: rgba(255,255,255,0.35) !important; }

/* Force white text in contact hero (against theme h1 colour overrides) */
.contact-hero-section h1 { color: #fff !important; }

/* Remove footer gap on contact page */
body.page-id-1582 .entry-content,
body.page-id-1582 .site-main,
body.page-id-1582 .site-main article:not(.review-card) {   /* exclude review cards so they keep their padding, matching homepage */
    padding: 0 !important;
    margin: 0 !important;
}

/* ── Blog: "Latest Articles" heading — larger + even padding ── */
.pm-blog-section-heading {
    font-size: 1.5rem !important;
    padding: 1.5rem !important;
    margin: 0 !important;
    letter-spacing: 0.05em !important;
}

/* ── Blog: article card titles — show full title, no truncation ── */
.pm-blog-card-body h3 a {
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    display: block !important;
    overflow: visible !important;
}

/* ── Quote tool: plan buttons — equal height across all plans ── */
.qt-plan-btn {
    min-height: 52px;
}

/* ── Quote tool: result pill — inherit color set by JS ── */
#qt-result-plan {
    color: var(--color-black); /* JS overrides per plan; this is the default */
}


/* ================================================================
   §31 — MEMBER SERVICES TEMPLATE  (pm-member-services.php)
        Used for: Preventative Care, Chronic Medication, etc.
================================================================ */

/* ── Hero ──────────────────────────────────────────────────── */
.pm-ms-hero {
    background: var(--color-black);
    color: #fff;
    padding: 3.5rem 1.5rem 3rem;
    text-align: center;
}
.pm-ms-hero-inner {
    max-width: 700px;
    margin: 0 auto;
}
.pm-ms-hero h1 {
    font-family: var(--font-primary);
    font-weight: var(--fw-black, 900);
    font-size: clamp(2rem, 9vw, 3.5rem);
    color: #fff !important;
    line-height: 1.05;
    margin: 0 0 1rem;
    text-transform: uppercase;
}
.pm-ms-hero p {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.65;
    margin: 0 auto;
    max-width: 560px;
}

/* ── Body content ───────────────────────────────────────────── */
.pm-ms-body {
    background: #fff;
    padding: 3rem 1.5rem 4rem;
}
.pm-ms-body-inner {
    max-width: 780px;
    margin: 0 auto;
}

/* Headings inside the member-services body */
.pm-ms-body-inner h2,
.pm-ms-body-inner h3,
.pm-ms-body-inner h4 {
    font-family: var(--font-primary);
    font-weight: var(--fw-black, 900);
    text-transform: uppercase;
    color: var(--color-black);
    margin: 2rem 0 0.75rem;
    line-height: 1.15;
}
.pm-ms-body-inner h2 { font-size: clamp(1.4rem, 5vw, 2rem); }
.pm-ms-body-inner h3 { font-size: clamp(1.1rem, 4vw, 1.5rem); }
.pm-ms-body-inner h4 { font-size: 1rem; }

.pm-ms-body-inner p {
    color: #2e2e2e;
    line-height: 1.75;
    margin: 0 0 1.1rem;
}
.pm-ms-body-inner ul,
.pm-ms-body-inner ol {
    margin: 0 0 1.5rem 1.5rem;
    padding: 0;
    color: #2e2e2e;
    line-height: 1.85;
}
.pm-ms-body-inner li {
    margin-bottom: 0.35rem;
}
.pm-ms-body-inner li::marker {
    color: var(--color-lime);
}
.pm-ms-body-inner a {
    color: var(--color-black);
    text-decoration: underline;
}
.pm-ms-body-inner strong {
    font-weight: 700;
    color: var(--color-black);
}

/* ── CTA strip ──────────────────────────────────────────────── */
.pm-ms-cta {
    background: var(--color-black);
    padding: 3.5rem 1.5rem 4rem;
    text-align: center;
}
.pm-ms-cta-inner {
    max-width: 480px;
    margin: 0 auto;
}
.pm-ms-cta h2 {
    font-family: var(--font-primary);
    font-weight: var(--fw-black, 900);
    font-size: clamp(1.6rem, 7vw, 2.6rem);
    color: #fff !important;
    text-transform: uppercase;
    line-height: 1.1;
    margin: 0 0 0.75rem;
}
.pm-ms-cta p {
    color: rgba(255, 255, 255, 0.68);
    margin: 0 0 2rem;
    font-size: 1rem;
}
.pm-ms-cta-btns {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.pm-ms-cta-btn {
    display: block;
    width: 100%;
    padding: 1.05rem 2rem;
    border-radius: 100px;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 0.9rem;
    letter-spacing: 0.06em;
    text-align: center;
    text-decoration: none !important;
    transition: opacity 0.2s;
    box-sizing: border-box;
}
.pm-ms-cta-btn:hover { opacity: 0.85; }
.pm-ms-cta-btn--primary {
    background: var(--color-lime);
    color: var(--color-black) !important;
}
.pm-ms-cta-btn--primary:link,
.pm-ms-cta-btn--primary:visited { color: var(--color-black) !important; }
.pm-ms-cta-btn--outline {
    background: transparent;
    color: #fff !important;
    border: 2px solid rgba(255, 255, 255, 0.4);
}
.pm-ms-cta-btn--outline:link,
.pm-ms-cta-btn--outline:visited { color: #fff !important; }
.pm-ms-cta-btn--outline:hover { border-color: #fff; }

/* ── Breadcrumb on member services pages ────────────────────── */
.pm-ms-breadcrumb {
    background: var(--color-black);
    color: rgba(255, 255, 255, 0.55);
}
.pm-ms-breadcrumb a { color: rgba(255, 255, 255, 0.55); }
.pm-ms-breadcrumb a:hover { color: var(--color-lime); }
.pm-ms-breadcrumb .pm-breadcrumb-sep,
.pm-ms-breadcrumb .pm-breadcrumb-current { color: rgba(255, 255, 255, 0.55); }


/* ================================================================
   §32 — CHRONIC DISEASE LIST  (pm-cdl.php)
================================================================ */

.pm-cdl-hero p {
    font-size: 1.05rem;
    max-width: 620px;
}

/* ── Conditions section wrapper ─────────────────────────────── */
.pm-cdl-section {
    background: #f5f5f5;
    padding: 3rem 1.5rem 4rem;
}
.pm-cdl-inner {
    max-width: 820px;
    margin: 0 auto;
}

/* ── Tab strip ──────────────────────────────────────────────── */
.pm-cdl-tabs-wrap {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.07);
    overflow: hidden;
}
.pm-cdl-tabs {
    display: flex;
    border-bottom: 2px solid #eee;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.pm-cdl-tabs::-webkit-scrollbar { display: none; }

.pm-cdl-tab {
    flex: 1;
    min-width: 80px;
    padding: 1rem 0.75rem;
    background: none;
    border: none;
    cursor: pointer;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #888;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: color 0.2s, border-color 0.2s;
    white-space: nowrap;
}
.pm-cdl-tab:hover {
    color: var(--plan-color, var(--color-black));
}
.pm-cdl-tab--active {
    color: var(--plan-color, var(--color-black));
    border-bottom-color: var(--plan-color, var(--color-black));
}

/* ── Tab panels ─────────────────────────────────────────────── */
.pm-cdl-panel {
    display: none;
}
.pm-cdl-panel--active {
    display: block;
}
.pm-cdl-panel-inner {
    padding: 2rem 1.75rem 2.5rem;
}
.pm-cdl-panel-note {
    color: #555;
    font-size: 0.9rem;
    margin: 0 0 1.25rem;
}

/* ── Conditions list ────────────────────────────────────────── */
.pm-cdl-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 0.5rem 2rem;
}
.pm-cdl-list li {
    position: relative;
    padding: 0.55rem 0.55rem 0.55rem 1.4rem;
    font-size: 0.9rem;
    color: #2e2e2e;
    border-bottom: 1px solid #eee;
}
.pm-cdl-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--plan-color, var(--color-lime));
}

/* ── Decoded VC HTML cleanup ────────────────────────────────── */
.pm-cdl-decoded-html table {
    width: 100%;
    border-collapse: collapse;
}
.pm-cdl-decoded-html td,
.pm-cdl-decoded-html th {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #eee;
    font-size: 0.9rem;
    color: #2e2e2e;
    vertical-align: top;
}
.pm-cdl-decoded-html th {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.07em;
    color: #777;
}
.pm-cdl-decoded-html ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.pm-cdl-decoded-html ul li {
    padding: 0.45rem 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 0.9rem;
    color: #2e2e2e;
}
.pm-cdl-no-data {
    color: #777;
    font-size: 0.9rem;
}
.pm-cdl-no-data a { color: var(--color-black); }

/* ── Info strip ─────────────────────────────────────────────── */
.pm-cdl-info {
    background: var(--color-lime);
    padding: 1.75rem 1.5rem;
}
.pm-cdl-info-inner {
    max-width: 820px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}
.pm-cdl-info-icon {
    font-size: 1.5rem;
    color: var(--color-black);
    flex-shrink: 0;
}
.pm-cdl-info-text {
    flex: 1;
    min-width: 200px;
}
.pm-cdl-info-text strong {
    display: block;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--color-black);
    margin-bottom: 0.25rem;
}
.pm-cdl-info-text p {
    font-size: 0.88rem;
    color: rgba(0,0,0,0.7);
    margin: 0;
}
.pm-cdl-info-text a { color: var(--color-black); font-weight: 700; }
.pm-cdl-info-btn {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    background: var(--color-black);
    color: #fff !important;
    border-radius: 100px;
    font-weight: 700;
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    text-decoration: none !important;
    white-space: nowrap;
    flex-shrink: 0;
}
.pm-cdl-info-btn:link,
.pm-cdl-info-btn:visited { color: #fff !important; }
.pm-cdl-info-btn:hover { opacity: 0.85; }

/* ── CDL intro body (light bg variant) ─────────────────────── */
.pm-cdl-intro-body {
    background: #fff;
    padding-bottom: 0;
}


/* ============================================================
   V2 — COLOUR DIRECTION (2026-06, client feedback)
   Self-contained override block. Delete this whole section to
   revert to V1. Implements: light hero + black outline buttons,
   f1f1f1 capsules, outlined benefit pills with coloured copy,
   grey app backdrop, unified heading scale.
   ============================================================ */

/* ── Hero: dark → light with architectural background ──────── */
/* !important needed to beat the legacy .home-hero block (lines ~715-731) */
.home-hero {
    background: #ffffff url('images/hero-bg.jpg') center center / cover no-repeat !important;
}
.home-hero .hero-heading,
.home-hero h1.hero-heading { color: var(--color-black) !important; }
.home-hero .hero-sub,
.home-hero p.hero-sub      { color: var(--color-black) !important; }

/* Hero CTAs → black outline pills */
.hero-ctas .profmed-btn-lime {
    background-color: transparent !important;
    border: 2px solid var(--color-black) !important;
    color: var(--color-black) !important;
}
.hero-ctas .profmed-btn-lime:hover {
    background-color: var(--color-black) !important;
    color: #ffffff !important;
}

/* ── Benefit Options: white section + f1f1f1 capsule ───────── */
.benefit-glance-section {
    background: #ffffff;
    padding: 2.5rem 0;          /* no side margins — capsule stretches full width */
    overflow: visible;
}
.benefit-glance-inner {
    background: #f1f1f1;
    border-radius: 50vw;                 /* = half the full-bleed width → true stadium (round caps, straight sides) */
    padding: 8rem 1.5rem 8rem 0;         /* more top/bottom room inside the caps */
    overflow: hidden;                    /* clip pills at the capsule's left edge */
}
.benefit-glance-heading {
    padding-left: 2.5rem;                /* heading indent (inner has no left padding) */
}
.benefit-glance-heading,
.benefit-glance-heading .benefit-glance-lime { color: var(--color-black); }

/* Benefit pills → outlined, coloured copy, bleeding off the LEFT edge */
.benefit-pills-wrap { overflow: visible; gap: 1rem; }
.benefit-pill {
    width: calc(100% + 60px);
    margin-left: 30px;                   /* left cap visible, indented; bleeds off the right */
    padding-left: 3rem;
    background: #ffffff !important;
    border: 2px solid currentColor;
}
.benefit-pill:hover { opacity: 1; }
.benefit-pill .pill-pre { opacity: 0.72; }

.benefit-pill--proselect,
.benefit-pill--proselect:link,
.benefit-pill--proselect:visited,
.benefit-pill--proselect .pill-pre,
.benefit-pill--proselect .pill-name   { color: var(--color-proselect)   !important; border-color: var(--color-proselect); }
.benefit-pill--proactive,
.benefit-pill--proactive:link,
.benefit-pill--proactive:visited,
.benefit-pill--proactive .pill-pre,
.benefit-pill--proactive .pill-name   { color: var(--color-proactive)   !important; border-color: var(--color-proactive); }
.benefit-pill--prosecure,
.benefit-pill--prosecure:link,
.benefit-pill--prosecure:visited,
.benefit-pill--prosecure .pill-pre,
.benefit-pill--prosecure .pill-name   { color: var(--color-prosecure)   !important; border-color: var(--color-prosecure); }
.benefit-pill--propinnacle,
.benefit-pill--propinnacle:link,
.benefit-pill--propinnacle:visited,
.benefit-pill--propinnacle .pill-pre,
.benefit-pill--propinnacle .pill-name { color: var(--color-propinnacle) !important; border-color: var(--color-propinnacle); }
.benefit-pill--prosecureplus,
.benefit-pill--prosecureplus:link,
.benefit-pill--prosecureplus:visited,
.benefit-pill--prosecureplus .pill-pre,
.benefit-pill--prosecureplus .pill-name { color: var(--color-prosecureplus) !important; border-color: var(--color-prosecureplus); }

/* Paired "& X Savvy" labels are longer → let the glance pills scale + wrap so nothing clips */
.benefit-glance-section .benefit-pill {
    font-size: clamp(1rem, 3.4vw, 1.55rem);
    letter-spacing: 0.05em;
    line-height: 1.25;
    padding-top: 1.15rem;
    padding-bottom: 1.15rem;
}
.benefit-glance-section .pill-label { display: block; }
/* forced 2-line label (break after "&") → keep every pill the same height */
.benefit-glance-section .benefit-pill br { display: inline; }

/* ── App section: lime arch → f1f1f1 grey capsule ──────────── */
.app-arch { background: #f1f1f1; }

/* ── Unify section headings to the hero scale ──────────────── */
.benefit-glance-heading,
.testimonials-heading,
.why-profmed-section h2,
.additional-benefits-section h2,
.app-section h2 {
    font-size: clamp(2rem, 8vw, 3rem);
    line-height: 1.1;
    letter-spacing: 0.04em;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
}

/* ── Remove black arc behind "Professionals who love Profmed" ─ */
.testimonials-arc {
    background: transparent !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 3rem 1.5rem 0 !important;
}
.testimonials-heading,
.testimonials-heading .testimonials-lime { color: var(--color-black) !important; }

/* ── All body copy: black, hero size ───────────────────────── */
.benefit-glance-section p,
.testimonials-sub,
.why-profmed-section p,
.why-profmed-section > .why-profmed-inner > p,
.additional-benefits-section p,
.additional-benefits-section > .additional-benefits-inner > p,
.app-section p,
.app-section > .app-inner > p {
    color: var(--color-black) !important;
    font-size: 1rem !important;
}

/* ── Footer logo: left-aligned, full width of its column ───── */
.pm-footer-brand {
    align-items: flex-start !important;   /* align left within the 2nd column */
}
.pm-footer-icon-img { width: 100%; }      /* fill the column width */

/* ── Floating CONTACT ME button → lime outline + lime copy ─── */
.pm-nav-contact,
.pm-nav-contact:link,
.pm-nav-contact:visited {
    background: transparent !important;
    border: 2px solid var(--color-lime) !important;
    color: var(--color-lime) !important;
}
.pm-nav-contact:hover {
    background: var(--color-lime) !important;
    color: #000 !important;
}

/* ── Menu overlay → light theme (Menu.jpg) ─────────────────── */
.pm-menu-overlay        { background: #F5F5F5 !important; }
.pm-menu-primary li a   { color: var(--color-black) !important; }
.pm-menu-secondary li a { color: var(--color-black) !important; }
.pm-menu-close svg line { stroke: #000 !important; }            /* X → black */
.pm-menu-close:focus-visible { outline-color: #000 !important; }
/* Social icons in a full-bleed black bar at the bottom (icons stay white) */
.pm-menu-social {
    background: #000 !important;
    margin: auto -1.5rem -3rem !important;   /* bleed to side + bottom edges */
    padding: 1.5rem !important;
    justify-content: center !important;
    gap: 1.25rem !important;
}


/* ============================================================
   V2 — MEMBERS PAGE (purple / aubergine theme)
   ============================================================ */

/* Hero → light architectural bg, black heading, no logo */
.pm-members-brand { display: none !important; }
.pm-members-hero {
    background: #f1f1f1 url('images/members-hero-bg.jpg') center center / cover no-repeat !important;
    color: var(--color-black) !important;
    border-radius: 0 !important;   /* square off the old rounded bottom */
}
.pm-members-hero h1 { color: var(--color-black) !important; }
.pm-members-hero-sub {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--color-black);
    margin: -1.25rem 0 1.75rem;
    max-width: 30rem;
}

/* Action buttons → black outline + homepage-hero button typography */
.pm-members-action-btn,
.pm-members-action-btn:link,
.pm-members-action-btn:visited,
.pm-members-action-btn--primary,
.pm-members-action-btn--primary:link,
.pm-members-action-btn--primary:visited {
    background: transparent !important;
    border: 2px solid var(--color-black) !important;
    color: var(--color-black) !important;
    font-size: 1.2rem !important;
    font-weight: var(--fw-bold) !important;
    letter-spacing: 0.12em !important;
    padding: 1.1rem 2rem !important;
}
.pm-members-action-btn:hover,
.pm-members-action-btn--primary:hover {
    background: var(--color-black) !important;
    color: #ffffff !important;
}

/* Section title underline → aubergine */
.pm-members-section-title { border-bottom-color: var(--color-aubergine) !important; }

/* Per-item icons → aubergine outline circle (icons added in markup) */
.pm-members-list li a,
.pm-members-chip {
    justify-content: flex-start !important;
    gap: 0.9rem;
}
.pm-members-list li a::after,
.pm-members-chip::after { content: none !important; }
.pm-mi {
    width: 2.5rem;
    height: 2.5rem;
    border: 1.5px solid var(--color-aubergine);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--color-aubergine);
}
.pm-mi i { font-size: 0.95rem; line-height: 1; }

/* Additional Benefits chips → flat list rows (drop the grey box) */
.pm-members-chips { gap: 0 !important; }
.pm-members-chip {
    background: transparent !important;
    border-radius: 0 !important;
    border-bottom: 1px solid rgba(0,0,0,0.07);
    padding: 0.85rem 0 !important;
}
.pm-members-chip:hover { background: transparent !important; }

/* Per-section backgrounds (targeted via :has on the title class) */
.pm-members-section:has(.pm-mst--scheme)     { background: #f1f1f1; }
.pm-members-section:has(.pm-mst--services)   { background: var(--color-grey); }
.pm-members-section:has(.pm-mst--additional) { background: #f5f5f5 url('images/members-pill-bg.jpg') center / cover no-repeat; }

/* Breadcrumb now lives INSIDE the hero, on the hero background (no white gap) */
.pm-members-hero { padding-top: 1.75rem !important; }
.pm-members-hero .pm-breadcrumb {
    background: transparent !important;
    border-bottom: none !important;
    width: auto !important;                             /* drop the 100vw full-bleed */
    left: auto !important;
    margin: 0 0 0.75rem !important;                     /* (also resets margin-left to 0) */
    padding: 0.85rem 0 0.95rem !important;              /* breathing room above + below */
    justify-content: flex-start !important;             /* align left with the heading */
}
.pm-members-hero .pm-breadcrumb a,
.pm-members-hero .pm-breadcrumb-current,
.pm-members-hero .pm-breadcrumb i { color: var(--color-black) !important; }


/* ============================================================
   V2 — GLOBAL BUTTON HOVER: left-to-right colour wipe
   ============================================================ */
.profmed-btn-lime,
.hero-ctas .profmed-btn-lime,
.pm-members-action-btn,
.pm-nav-contact,
.benefit-pill,
.bo-plan-quote-btn,
.bo-plan-info-link,
.pm-plan-cta-btn,
.pm-service-btn,
.pm-join-cta-btn,
.pm-prof-cta-btn {
    position: relative;
    overflow: hidden;
    z-index: 0;
    --wipe: var(--color-black);
}
.profmed-btn-lime::before,
.pm-members-action-btn::before,
.pm-nav-contact::before,
.benefit-pill::before,
.bo-plan-quote-btn::before,
.bo-plan-info-link::before,
.pm-plan-cta-btn::before,
.pm-service-btn::before,
.pm-join-cta-btn::before,
.pm-prof-cta-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--wipe);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.35s ease;
    z-index: -1;
    pointer-events: none;
}
.profmed-btn-lime:hover::before,
.pm-members-action-btn:hover::before,
.pm-nav-contact:hover::before,
.benefit-pill:hover::before,
.bo-plan-quote-btn:hover::before,
.bo-plan-info-link:hover::before,
.pm-plan-cta-btn:hover::before,
.pm-service-btn:hover::before,
.pm-join-cta-btn:hover::before,
.pm-prof-cta-btn:hover::before { transform: scaleX(1); }

.profmed-btn-lime:hover,
.pm-members-action-btn:hover,
.benefit-pill:hover,
.bo-plan-quote-btn:hover,
.bo-plan-info-link:hover,
.pm-plan-cta-btn:hover,
.pm-service-btn:hover,
.pm-join-cta-btn:hover,
.pm-prof-cta-btn:hover {
    background: transparent !important;
    color: #fff !important;
    opacity: 1 !important;
}
/* per-button wipe colour + hover text contrast */
.pm-nav-contact { --wipe: var(--color-lime); }
.pm-nav-contact:hover { background: transparent !important; color: #000 !important; }
.benefit-pill--proselect   { --wipe: var(--color-proselect); }
.benefit-pill--proactive   { --wipe: var(--color-proactive); }
.benefit-pill--prosecure   { --wipe: var(--color-prosecure); }
.benefit-pill--propinnacle { --wipe: var(--color-propinnacle); }
.benefit-pill--prosecureplus { --wipe: var(--color-prosecureplus); }
/* Benefit pills: copy turns white on hover / focus / click (all plans) */
.benefit-pill:hover,
.benefit-pill:focus,
.benefit-pill:active,
.benefit-pill:hover .pill-pre,
.benefit-pill:hover .pill-name,
.benefit-pill:focus .pill-pre,
.benefit-pill:focus .pill-name,
.benefit-pill:active .pill-pre,
.benefit-pill:active .pill-name { color: #fff !important; }
.benefit-pill:focus::before,
.benefit-pill:active::before { transform: scaleX(1) !important; }


/* ============================================================
   V2 — BENEFIT OPTIONS hero → light (page-id-153)
   ============================================================ */
.bo-hero-section {
    background-color: #f1f1f1 !important;
    background-image: url('images/bo-hero-bg-v2.jpg') !important;   /* drop the dark gradient */
    background-size: cover !important;
    background-position: center center !important;
}
.bo-hero-section h1   { color: var(--color-black) !important; }
.bo-hero-section > p  { color: var(--color-black) !important; }

/* Both hero CTAs → black outline + black text (override the :link white rule) */
.bo-btn-outline,
.bo-btn-outline:link,
.bo-btn-outline:visited,
.bo-btn-black,
.bo-btn-black:link,
.bo-btn-black:visited {
    background: transparent !important;
    color: var(--color-black) !important;
    border: 2px solid var(--color-black) !important;
}

/* Breadcrumb on the light hero → black text */
body.page-id-153 .pm-breadcrumb,
body.page-id-153 .pm-breadcrumb a,
body.page-id-153 .pm-breadcrumb-current,
body.page-id-153 .pm-breadcrumb i { color: var(--color-black) !important; }
body.page-id-153 .pm-breadcrumb-sep { color: rgba(0,0,0,0.4) !important; }

/* Pull the hero background up under the nav (no white band at top) */
body.page-id-153 .bo-hero-section {
    margin-top: -120px !important;
    padding-top: calc(1.5rem + 120px) !important;
}


/* ============================================================
   V2 — WHO QUALIFIES (page-id-141)
   ============================================================ */
/* Hero is now ONE merged section — a single cover image, no repeat, pulled up
   under the fixed nav. (qualify section merged + breadcrumb moved in via deploy) */
body.page-id-141 { background-color: #f1f1f1 !important; }
.wq-intro-section {
    background: #f1f1f1 url('images/wq-bg.png') center / cover no-repeat !important;
    border-radius: 0 !important;
    margin-top: 0 !important;                            /* sit below the nav (no pull-up) */
    padding: 1rem 1.5rem 3rem !important;
}
/* Align the heading + paragraph with the breadcrumb and checklist (drop the inner indent) */
body.page-id-141 .wq-intro-inner { padding: 0 !important; }

/* Breadcrumb (now inside the hero) — same padding as the other pages, left-aligned */
body.page-id-141 .pm-breadcrumb {
    background: transparent !important;
    border-bottom: none !important;
    width: auto !important;
    left: auto !important;
    margin: 0 0 0.75rem !important;
    padding: 0.85rem 0 0.95rem !important;
}
body.page-id-141 .pm-breadcrumb,
body.page-id-141 .pm-breadcrumb a,
body.page-id-141 .pm-breadcrumb-current,
body.page-id-141 .pm-breadcrumb i { color: var(--color-black) !important; }

/* CONTACT ME → black outline + hover wipe */
.wq-cta-btn,
.wq-cta-btn:link,
.wq-cta-btn:visited {
    background: transparent !important;
    border: 2px solid var(--color-black) !important;
    color: var(--color-black) !important;
    position: relative; overflow: hidden; z-index: 0; --wipe: var(--color-black);
}
.wq-cta-btn::before {
    content: ''; position: absolute; inset: 0; background: var(--wipe);
    transform: scaleX(0); transform-origin: left center;
    transition: transform 0.35s ease; z-index: -1; pointer-events: none;
}
.wq-cta-btn:hover::before { transform: scaleX(1); }
.wq-cta-btn:hover { background: transparent !important; color: #fff !important; opacity: 1 !important; }

/* Why Profmed section → light (remove lime + arch) */
.wq-why-section { background: #f1f1f1 !important; }
.wq-why-arch { display: none !important; }
/* "WHY PROFMED?" heading → match the page's main heading size */
body:not(.home) .entry-content .wq-why-section h2 {
    font-size: clamp(1.8rem, 7vw, 2.6rem) !important;
    line-height: 1.1 !important;
}


/* ============================================================
   V2 — Shared section headings: keep hero scale on inner pages too
   (beats the inner-page `.entry-content h2` shrink rule)
   ============================================================ */
body:not(.home) .entry-content h2.testimonials-heading,
body:not(.home) .entry-content h2.benefit-glance-heading,
body:not(.home) .entry-content .testimonials-arc h2,
body:not(.home) .entry-content .why-profmed-section h2,
body:not(.home) .entry-content .additional-benefits-section h2,
body:not(.home) .entry-content .app-section h2 {
    font-size: clamp(2rem, 8vw, 3rem) !important;
    line-height: 1.1 !important;
    letter-spacing: 0.04em !important;
}

/* Hover wipe on the hero CTAs (black fill, white text) */
.bo-btn-outline,
.bo-btn-black { position: relative; overflow: hidden; z-index: 0; --wipe: var(--color-black); }
.bo-btn-outline::before,
.bo-btn-black::before {
    content: ''; position: absolute; inset: 0; background: var(--wipe);
    transform: scaleX(0); transform-origin: left center;
    transition: transform 0.35s ease; z-index: -1; pointer-events: none;
}
.bo-btn-outline:hover::before,
.bo-btn-black:hover::before { transform: scaleX(1); }
.bo-btn-outline:hover,
.bo-btn-black:hover { background: transparent !important; color: #fff !important; opacity: 1 !important; }

/* Compare CTA block → black with white elements (was lime) */
.bo-compare-cta { background: var(--color-black) !important; }
.bo-compare-cta h2 { color: #fff !important; }
.bo-compare-sub { color: rgba(255,255,255,0.8) !important; }
.bo-compare-btn,
.bo-compare-btn:link,
.bo-compare-btn:visited {
    background: transparent !important;
    border: 2px solid #fff !important;
    color: #fff !important;
    position: relative;
    overflow: hidden;
    z-index: 0;
    --wipe: #fff;
}
.bo-compare-btn::before {
    content: ''; position: absolute; inset: 0; background: var(--wipe);
    transform: scaleX(0); transform-origin: left center;
    transition: transform 0.35s ease; z-index: -1; pointer-events: none;
}
.bo-compare-btn:hover::before { transform: scaleX(1); }
.bo-compare-btn:hover { background: transparent !important; color: #000 !important; opacity: 1 !important; }


/* ============================================================
   V2 — CONSISTENT HERO SPACING ACROSS ALL PAGES
   ============================================================ */
/* 1a. Heroes whose breadcrumb is reset to normal flow (inside the hero) —
   0 horizontal padding aligns them with the hero content */
.pm-members-hero .pm-breadcrumb,
body.page-id-141 .pm-breadcrumb {
    padding: 0.85rem 0 0.95rem !important;
    margin: 0 0 0.75rem !important;
}
/* 1b. Heroes whose breadcrumb stays FULL-BLEED (benefit options = transparent on
   texture, contact = black strip on black hero) — keep the full-bleed (don't touch
   left/width/margin-left), just unify vertical padding (base keeps 1.5rem left indent) */
body.page-id-153 .pm-breadcrumb {
    padding-top: 0.85rem !important;
    padding-bottom: 0.95rem !important;
    margin-bottom: 0.75rem !important;
}
/* Contact: black breadcrumb strip butts directly onto the black hero —
   margin-bottom:0 so no white body gap shows between the two black blocks */
body.page-id-1582 .pm-breadcrumb {
    padding-top: 0.85rem !important;
    padding-bottom: 0.95rem !important;
    margin-bottom: 0 !important;
}
/* 2. Homepage hero uses margins (not flex gap) so spacing matches the others */
.home-hero .hero-content { gap: 0 !important; }
/* 3. Title → paragraph gap (uniform) */
.hero-heading,
.pm-members-hero h1,
.bo-hero-section h1,
.wq-intro-section h1 { margin: 0 0 1rem !important; }
/* 4. Paragraph → button gap (uniform) */
.hero-sub,
.pm-members-hero-sub,
.bo-hero-section > p,
.wq-intro-section > .wq-intro-inner > p { margin: 0 0 1.75rem !important; }

/* =====================================================================
   BLOG — invert the "Never Miss an Update" newsletter to a LIGHT section
   (blog list, page-id-570 / pm-blog-list template). Dark text on light
   grey, white input, aubergine bell; lime CTA kept as the brand pop.
   ===================================================================== */
body.page-id-570 .pm-newsletter,
.page-template-pm-blog-list .pm-newsletter {
    background: #f1f1f1 !important;
    color: var(--color-black) !important;
}
body.page-id-570 .pm-newsletter-icon,
.page-template-pm-blog-list .pm-newsletter-icon {
    color: var(--color-aubergine) !important;
}
body.page-id-570 .pm-newsletter h3,
.page-template-pm-blog-list .pm-newsletter h3 {
    color: var(--color-black) !important;
}
body.page-id-570 .pm-newsletter p,
.page-template-pm-blog-list .pm-newsletter p {
    color: #555 !important;
}
body.page-id-570 .pm-newsletter-form input[type="email"],
.page-template-pm-blog-list .pm-newsletter-form input[type="email"] {
    background: #fff !important;
    border: 1.5px solid #ccc !important;
    color: var(--color-black) !important;
}
body.page-id-570 .pm-newsletter-form input[type="email"]::placeholder,
.page-template-pm-blog-list .pm-newsletter-form input[type="email"]::placeholder {
    color: #888 !important;
}
body.page-id-570 .pm-newsletter-form input[type="email"]:focus,
.page-template-pm-blog-list .pm-newsletter-form input[type="email"]:focus {
    border-color: var(--color-aubergine) !important;
}

/* =====================================================================
   LEGACY BREADCRUMB SUPPRESSION (site-wide)
   Old-template pages render a Yoast/theme breadcrumb (a <p> wrapping
   spans, ending in span.breadcrumb_last) inside .entry-content. Phase 1
   already injects its own styled .pm-breadcrumb, so the legacy one is a
   visible duplicate. Hide the wrapper that contains .breadcrumb_last.
   Safe: aligned pages don't output .breadcrumb_last, so nothing else hides.
   ===================================================================== */
.entry-content p:has(.breadcrumb_last),
.entry-content > p:has(> span .breadcrumb_last),
.entry-content div:has(> .breadcrumb_last),
.entry-content nav.breadcrumb:has(.breadcrumb_last) {
    display: none !important;
}

/* =====================================================================
   FALLBACK HERO for old/raw pages (site-wide, but only matches stragglers)
   A handful of pages were never rebuilt with a bespoke hero; on those the
   page title <h1> is a DIRECT child of .entry-content. Every aligned page
   nests its h1 inside a hero div (pm-service-hero / pm-ms-hero-inner /
   pm-members-hero / pm-prof-hero-inner ...), so `.entry-content > h1` and
   `:has(> h1)` match ONLY un-aligned pages (verified across 20+ pages).
   Style the auto-breadcrumb + that h1 into the standard black hero block.
   ===================================================================== */
.entry-content:has(> h1) > .pm-breadcrumb {
    background: var(--color-black) !important;
    color: rgba(255,255,255,0.8) !important;
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    margin: 0 0 0 -50vw !important;
    padding: 0.85rem 1.5rem 0.55rem !important;
    box-sizing: border-box !important;
}
.entry-content:has(> h1) > .pm-breadcrumb a,
.entry-content:has(> h1) > .pm-breadcrumb i,
.entry-content:has(> h1) > .pm-breadcrumb .pm-breadcrumb-sep,
.entry-content:has(> h1) > .pm-breadcrumb .pm-breadcrumb-current {
    color: rgba(255,255,255,0.8) !important;
}
.entry-content:has(> h1) > h1 {
    background: var(--color-black) !important;
    color: #fff !important;
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    margin: 0 0 2rem -50vw !important;
    padding: 0.4rem 1.5rem 2.25rem !important;
    box-sizing: border-box !important;
    font-family: var(--font-primary) !important;
    font-size: clamp(2rem, 8vw, 3rem) !important;
    font-weight: var(--fw-bold) !important;
    line-height: 1.05 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}
/* Force any inner spans/<sup>/links in the fallback-hero title to white
   (some old titles carry inline gold/coloured text or superscripts) */
.entry-content:has(> h1) > h1 * {
    color: #fff !important;
}
/* Messy legacy markup: some old titles split across consecutive <h1>s
   (header_line1/2) with empty <p> spacers. Collapse those so the black
   hero stays one solid block instead of breaking into separate bars. */
.entry-content:has(> h1) > p:empty { display: none !important; }
.entry-content:has(> h1) > h1:has(+ h1) {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
.entry-content:has(> h1) > h1 + h1 {
    padding-top: 0 !important;
}


/* ============================================================
   40. DESKTOP OPTIMISATION — HOMEPAGE
   ------------------------------------------------------------
   The Phase 1 build is mobile-first: components are single-column
   flex stacks with *-inner wrappers capped at ~480px and no desktop
   layout rules, so on wide screens content hugs the left with a large
   empty void on the right. This layer adds desktop layouts. Everything
   is min-width scoped → ZERO effect on the signed-off mobile design.
   Desktop breakpoint = 1024px (matches .profmed-container / nav).
   ============================================================ */
@media (min-width: 1024px) {

  /* ── Shared content width token for this layer ── */
  /* (sections keep their full-bleed backgrounds; only inner content is capped) */

  /* ── 15. HERO → two-column, centred cluster, inline CTAs ── */
  .home-hero {
    flex-direction: row;
    align-items: flex-start;     /* logo top aligns with heading top */
    justify-content: center;
    gap: 5rem;
    padding: 5rem 2rem;
    min-height: 70vh;
  }
  .home-hero .hero-brand { margin-top: 0.25rem; }
  .home-hero .hero-brand { flex: 0 0 auto; }
  .home-hero .hero-icon-img { width: 240px; height: auto; }
  .home-hero .hero-content { flex: 0 1 600px; gap: 1.75rem; }
  .home-hero .hero-heading { font-size: clamp(2.8rem, 3.4vw, 4.2rem); }
  .home-hero .hero-sub { font-size: 1.15rem; max-width: 50ch; }
  .home-hero .hero-ctas { flex-direction: row; flex-wrap: wrap; gap: 1rem; margin-top: 1rem; }
  .home-hero .hero-ctas .profmed-btn-lime { display: inline-block; width: auto; }

  /* ── 16. BENEFIT OPTIONS AT A GLANCE → capsule bleeds off LEFT edge,
     heading + pills align to the shared content line (1120px centred) ── */
  .benefit-glance-section { padding: 4rem 0; overflow: hidden; }   /* clip off-page left */
  .benefit-glance-inner {
    max-width: none;
    margin: 0 10vw 0 -16rem;       /* bleed further off the left edge (left cap off-screen) */
    /* left padding aligns content to the SAME shared line as every other section */
    padding: 4.5rem 5rem 4.5rem calc((100vw - 1120px) / 2 + 16rem);
    overflow: hidden;
  }
  .benefit-glance-heading {
    text-align: left;
    padding-left: 0;
    margin-bottom: 2.5rem;
  }
  .benefit-pills-wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.75rem 2.25rem;
    max-width: 1120px;             /* wider columns so each 2-line label fits without squashing to a 3rd line */
    overflow: visible;
  }
  /* reset the v2 mobile right-bleed so pills sit cleanly inside grid cells */
  .benefit-pills-wrap .benefit-pill {
    width: 100%;
    margin-left: 0;
    padding-left: 2rem;
  }

  /* ── 17. TESTIMONIALS → centred heading/body + 3-up card grid ──
     (v2 already removed the black arc; just centre + grid the cards) */
  .testimonials-arc { text-align: center !important; padding-top: 4rem !important; }
  .testimonials-heading { text-align: center; white-space: nowrap; }
  .testimonials-heading br { display: inline-block; width: 0.35em; }   /* break → word space */
  .testimonials-body {
    max-width: 1180px;
    margin-inline: auto;
    padding: 2.5rem 2rem 4rem;
    text-align: center;
  }
  .testimonials-sub {
    max-width: 60ch;
    margin: 0 auto 2rem !important;   /* !important beats .entry-content p (0,1,1) so block truly centres */
    text-align: center !important;
  }
  .testimonials-scroll {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    overflow: visible;
  }
  .testimonials-scroll .review-card { flex: initial; max-width: none; width: 100%; }

  /* ── 18. WHY CHOOSE PROFMED → text left / pyramid right ── */
  .why-profmed-section { padding: 5rem 2rem; }
  .why-profmed-inner {
    max-width: 1120px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    column-gap: 4rem;
    align-items: center;
  }
  /* h2 hugs bottom of row 1, p hugs top of row 2 → the pair sits at the
     vertical middle, aligned to the pyramid's centre. line-height tightened. */
  .why-profmed-inner > h2 {
    grid-column: 1; grid-row: 1;
    align-self: end;
    line-height: 1.02;
    margin: 0 0 1.1rem;
  }
  .why-profmed-section > .why-profmed-inner > p {
    grid-column: 1; grid-row: 2;
    align-self: start;
    margin: 0;
  }
  .why-profmed-inner .pyramid-wrap { grid-column: 2; grid-row: 1 / span 2; max-width: 420px; margin: 0 auto; align-self: center; }

  /* ── 19. ADDITIONAL BENEFITS → 2-column icon grid, centred ── */
  .additional-benefits-section { padding: 5rem 2rem; }
  .additional-benefits-section h2 br { display: inline-block; width: 0.35em; }   /* break → word space */
  .additional-benefits-inner { max-width: 1120px; margin-inline: auto; }
  .benefits-icon-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 3rem;
    row-gap: 1.5rem;
  }

  /* ── 20. GET THE PROFMED APP → centred single column ── */
  .app-section { padding: 6rem 2rem 0; }
  .app-section h2 br { display: inline-block; width: 0.35em; }   /* break → word space */
  .app-inner {
    max-width: 1120px;
    margin-inline: auto;
    padding-bottom: 5rem;
    text-align: center;            /* centre heading + copy (no big right gap) */
  }
  .app-section > .app-inner > p { max-width: 70ch; margin-inline: auto; }
  .app-inner .app-badges {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;       /* badges centred */
    align-items: center;
    gap: 1rem;
    margin-top: 2rem;
  }
  .app-arch { width: 48%; bottom: -22%; }

  /* ── 21. FOOTER → 4 columns (brand · services · benefits · legal) ──
     The links + lower wrappers are flattened with display:contents so
     their children become direct grid items in one row. */
  #pm-phase1-footer.pm-footer {
    display: grid;
    grid-template-columns: repeat(4, 1fr);   /* four evenly-sized columns */
    column-gap: 3rem;
    row-gap: 2.5rem;
    max-width: none;                          /* dark bg is full-bleed (no white sides) */
    margin-inline: 0;
    padding: 4.5rem max(2rem, calc((100vw - 1120px) / 2)) 2rem;
    align-items: start;
  }
  #pm-phase1-footer .pm-footer-links,
  #pm-phase1-footer .pm-footer-lower { display: contents; }
  #pm-phase1-footer .pm-footer-brand {
    order: -1;                       /* logo becomes the first column */
    align-items: center;             /* centre the logo within its column */
    text-align: center;
    border-top: none;
    padding-top: 0;
    margin: 0;
  }
  #pm-phase1-footer .pm-footer-icon-img { width: 140px; }
  #pm-phase1-footer .pm-footer-social,
  #pm-phase1-footer .pm-footer-copy { grid-column: 1 / -1; }
}


/* ============================================================
   41. DESKTOP OPTIMISATION — INNER PRIORITY PAGES
   ------------------------------------------------------------
   Same approach as section 40: min-width:1024px only (zero mobile
   impact). Constrains content to the shared 1120px line, makes
   buttons inline, and turns mobile stacks into desktop columns.
   ============================================================ */
@media (min-width: 1024px) {

  /* ===== WHO QUALIFIES (page-id-141) ===== */
  body.page-id-141 .wq-intro-inner { max-width: 1120px; margin-inline: auto; }
  .wq-intro-section { padding-block: 2rem 4rem !important; }
  .wq-checklist {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem 3rem;            /* tighter bullet spacing */
    max-width: 880px;
    align-items: center;        /* balance single-line items against wrapped 2-line ones */
  }
  .wq-cta-btn { display: inline-block; width: auto; min-width: 260px; }

  /* Why Profmed → text middle-aligned to the video on the right.
     (text is wrapped in .wq-why-text via a content edit so it can be one grid cell) */
  .wq-why-inner {
    max-width: 1120px;
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 4rem;
    align-items: center;
    padding-bottom: 4rem;
  }
  .wq-why-inner > .wq-why-text { grid-column: 1; grid-row: 1; align-self: center; }
  .wq-why-inner > .wq-video-wrap { grid-column: 2; grid-row: 1 / span 20; align-self: center; margin: 0; }
  /* fallback if the text isn't wrapped yet: keep items in col 1 */
  .wq-why-inner > h2, .wq-why-inner > p { grid-column: 1; }
}

@media (min-width: 1024px) {
  /* ===== BENEFIT OPTIONS (page-id-153) ===== */
  /* full-bleed sections keep their bg; constrain content to the 1200 line */
  .bo-hero-section,
  .bo-promise-section,
  .bo-compare-cta {
    padding-inline: max(1.5rem, (100vw - 1120px) / 2) !important;
  }
  .bo-hero-ctas { flex-direction: row; flex-wrap: wrap; gap: 1rem; }
  .bo-btn-outline, .bo-btn-black { display: inline-block; width: auto; min-width: 240px; }

  /* 4 plan cards → 2×2 grid. Keep the section FULL-BLEED grey (from the base
     rule) so there are no white side margins; only the grid is constrained to
     the 1120 line via padding-inline. */
  .bo-plans-section {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    padding: 1rem max(1.5rem, (100vw - 1120px) / 2) 4rem;
  }
  .bo-plan-card { margin: 0 !important; }

  .bo-compare-btn { display: inline-block; width: auto; min-width: 260px; }
}

@media (min-width: 1024px) {
  /* ===== PLAN PAGES (pm-plan-*) ===== */
  .pm-plan-hero { justify-content: flex-start !important; padding-inline: max(1.5rem, (100vw - 1120px) / 2) !important; }
  .pm-plan-hero-inner { max-width: 1000px; }

  /* content blocks align to the shared 1200 line */
  .pm-plan-about,
  .pm-plan-benefits-section,
  .pm-plan-savvy-inner {
    max-width: 1120px !important;
    margin-inline: auto !important;
    padding-inline: 1.5rem;
  }
  /* long benefit checklist → 2 columns */
  .pm-plan-benefits {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 3.5rem;
  }
  .pm-plan-benefits li:last-child { border-bottom: 1px solid rgba(0,0,0,0.07); }

  /* CTA buttons → inline row */
  .pm-plan-cta-btns { flex-direction: row; flex-wrap: wrap; justify-content: center; max-width: none; gap: 1rem; }
  .pm-plan-cta-btn { width: auto; }
}

@media (min-width: 1024px) {
  /* ===== MEMBERS (page-id-259) ===== */
  .pm-members-hero { padding-inline: max(1.5rem, (100vw - 1120px) / 2) !important; }
  .pm-members-actions { flex-direction: row; flex-wrap: wrap; gap: 1rem; }
  .pm-members-action-btn { width: auto; min-width: 240px; }
  .pm-members-section { padding-inline: max(1.5rem, (100vw - 1120px) / 2) !important; }
  .pm-members-list { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 3rem; }

  /* ===== BLOG (page-id-570) ===== */
  .pm-blog-hero, .pm-blog-filters, .pm-blog-featured,
  .pm-blog-latest { max-width: 1120px; margin-inline: auto; }
  .pm-blog-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 2.5rem;
  }
  /* category capsules wrap to the word, not full width */
  .pm-blog-cat-chip { align-self: flex-start; width: auto; }
  /* featured (first post) main image aligned to middle-centre */
  .pm-blog-featured-inner { background-position: center center; }
  /* featured title + body run across the full width */
  .pm-blog-featured-overlay h2,
  .pm-blog-featured-overlay p { max-width: none; width: 100%; }
  /* card title + body copy run the full width of the card (no clamp) */
  .pm-blog-card-body h3 a { -webkit-line-clamp: unset; display: block; }
  .pm-blog-card-body p { -webkit-line-clamp: unset; display: block; }
  /* blog listing hero: title + intro run full width (drop forced breaks + cap) */
  .pm-blog-hero h1 { max-width: none; }
  .pm-blog-hero h1 br { display: none; }
  .pm-blog-hero p { max-width: none; }

  /* ===== CONTACT (page-id-1582) ===== */
  .contact-hero-section { padding-inline: max(1.5rem, (100vw - 1120px) / 2) !important; }
  .contact-form-inner { max-width: 720px; margin-inline: auto; }
}

@media (min-width: 1024px) {
  /* ===== QUOTE TOOL (page-id-35754) → match contact form width throughout ===== */
  .qt-intro,
  .qt-panel,
  .qt-result-plan,
  .qt-result-table,
  .qt-result-actions { max-width: 720px; margin-inline: auto; }
}


/* ============================================================
   42. DESKTOP HEADER-ALIGNMENT CONSISTENCY (Phase-1 audit 2026-07-07)
   ------------------------------------------------------------
   Every inner-page header (breadcrumb + hero) aligns to the shared
   1120px content line, left-aligned — matching Members (259).
   • Service pages (pm-service-*) had NO desktop treatment: hero copy
     sat at the 32px edge and the body was capped at 760px hugging the
     left. This aligns the hero to the 1120 line and runs the body full
     width within margins (2 columns, like the Members list).
   • Hardcoded <br> in titles becomes a word-space so titles wrap
     naturally on desktop instead of force-breaking (homepage pattern).
   • Multi-<p> hero copy (contact) flows as one line, no paragraph gap.
   More-specific in-hero / fallback-hero breadcrumb rules still win, so
   the already-correct pages are untouched.
   ============================================================ */
@media (min-width: 1024px) {

  /* ---- Breadcrumbs: align to the 1120 line everywhere ---- */
  .pm-breadcrumb { padding-inline: max(1.5rem, (100vw - 1120px) / 2) !important; }

  /* ---- Service pages: hero to the 1120 line; body full width, 2 columns ---- */
  .pm-service-hero { padding-inline: max(1.5rem, (100vw - 1120px) / 2) !important; }
  .pm-service-hero::after { left: max(1.5rem, (100vw - 1120px) / 2) !important; }
  .pm-service-hero p { max-width: 640px; }
  .pm-service-body {
    max-width: 1120px !important;
    margin-inline: auto !important;
    padding-inline: 1.5rem !important;
    column-count: 2;
    column-gap: 3.5rem;
  }
  .pm-service-body > * { break-inside: avoid; }
  .pm-service-body > h2 { break-after: avoid-column; }

  /* ---- Titles: hardcoded <br> → word-space (wrap naturally, don't force-break) ---- */
  .pm-service-hero h1 br,
  .wq-intro-section h1 br,
  .bo-hero-section h1 br,
  .contact-hero-section h1 br,
  .pm-members-hero h1 br,
  .pm-plan-hero h1 br { display: inline-block; width: 0.35em; }

  /* ---- Contact hero: two <p> sentences flow as one line (no paragraph break) ---- */
  .contact-hero-section p { display: inline; }
  .contact-hero-section p + p::before { content: " "; white-space: pre; }

  /* ---- WHO QUALIFIES (141): breadcrumb, intro, qualify heading, checklist &
          CTA all align to the 1120 line (they were split between the section
          padding at 24px and the .wq-intro-inner at 160px). Give the section
          the 1120-line padding and flatten the inner so everything lines up. ---- */
  body.page-id-141 .wq-intro-section {
    padding-inline: max(1.5rem, (100vw - 1120px) / 2) !important;
  }
  body.page-id-141 .wq-intro-inner {
    max-width: none !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    text-align: left !important;
  }
}


/* ============================================================
   43. HOW TO CLAIM (page-id-305) — bespoke sectioned rebuild 2026-07-07
   Mobile-first designed sections: hero + claim-method cards +
   note/fact sections + app CTA. Full-bleed alternating backgrounds,
   content constrained to the 1120 line on desktop.
   ============================================================ */
.htc-section {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: #fff;
    padding: 2.75rem 1.5rem;
    box-sizing: border-box;
}
.htc-section.htc-alt { background: var(--color-white); }   /* #F5F5F5 grey */
.htc-inner { max-width: 1120px; margin-inline: auto; }
.htc-inner--narrow { max-width: 760px; }

.htc-heading {
    font-family: var(--font-primary);
    font-size: clamp(1.5rem, 6vw, 2.1rem);
    font-weight: var(--fw-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-black);
    line-height: 1.1;
    margin: 0 0 0.6rem;
}
.htc-subhead {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    color: #555;
    line-height: 1.6;
    max-width: 620px;
    margin: 0 0 2rem;
}
.htc-section p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    line-height: 1.75;
    color: #333;
    margin: 0 0 1rem;
}
.htc-section a { color: var(--color-black); text-decoration: underline; text-underline-offset: 2px; }
.htc-section a:hover { opacity: 0.7; }

.htc-subheading {
    font-family: var(--font-primary);
    font-size: 0.95rem;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-black);
    margin: 1.75rem 0 0.5rem;
}

/* ── Claim-method cards ── */
.htc-methods {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}
.htc-method-card {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.07);
    padding: 1.75rem 1.5rem;
}
.htc-alt .htc-method-card { box-shadow: 0 4px 24px rgba(0,0,0,0.09); }
.htc-method-icon {
    width: 48px; height: 48px;
    border-radius: 50%;
    background: var(--color-lime);
    color: var(--color-black);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.15rem;
    margin-bottom: 1rem;
}
.htc-method-card h3 {
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-black);
    margin: 0 0 0.75rem;
}
.htc-method-card ul { list-style: none; margin: 0; padding: 0; }
.htc-method-card li {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 0.95rem;
    line-height: 1.6;
    color: #444;
    position: relative;
    padding: 0.35rem 0 0.35rem 1.6rem;
}
.htc-method-card li::before {
    content: '\f00c';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    left: 0; top: 0.55rem;
    color: var(--color-lime);
    font-size: 0.72rem;
}
.htc-method-card a { word-break: break-word; }
.htc-address {
    font-style: normal;
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    line-height: 1.65;
    color: var(--color-black);
    margin: 0.35rem 0 0;
    padding-left: 1.6rem;
}

/* ── Note + fact callouts ── */
.htc-note {
    background: #581845;                          /* aubergine — full pill / capsule callout */
    border-radius: 999px;
    padding: 1.4rem 1.7rem;
    margin: 0 0 1.5rem;
    color: #fff;
    text-align: center;                           /* centre the copy in the capsule (Image #29) */
}
/* aubergine callout: ALL copy white, links lime — no black text (unreadable on
   aubergine). !important beats .pm-legal p (#333) and .htc-inner--narrow p a. */
.htc-note, .htc-note p, .htc-note li, .htc-note span, .htc-note div,
.htc-note td, .htc-note h1, .htc-note h2, .htc-note h3, .htc-note h4 { color: #fff !important; }
.htc-note p { margin: 0; font-weight: var(--fw-regular); }
.htc-note p + p { margin-top: 0.75rem; }
.htc-note strong { color: #fff !important; }
.htc-note a, .htc-note a:link, .htc-note a:visited { color: #D3F12F !important; font-weight: var(--fw-bold); text-decoration: underline; }
.htc-note a:hover { color: #fff !important; }
/* callout icons never use a benefit-option colour → force to lime */
.htc-note i { color: #D3F12F !important; }
.htc-fact {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.09);
    border-radius: 12px;
    padding: 1.1rem 1.35rem;
    margin: 0 0 1.5rem;
}
.htc-alt .htc-fact { background: #fff; }
.htc-fact i { color: var(--color-black); font-size: 1.15rem; margin-top: 0.15rem; flex-shrink: 0; }
.htc-fact p { margin: 0; color: var(--color-black); }
.htc-fact--lime { background: var(--color-lime); border-color: var(--color-lime); }
.htc-fact--lime i, .htc-fact--lime p { color: var(--color-black); }

@media (min-width: 1024px) {
    .htc-section {
        padding-inline: max(1.5rem, (100vw - 1120px) / 2);
        padding-block: 4rem;
    }
    .htc-methods { grid-template-columns: repeat(3, 1fr); gap: 2rem; }
}


/* ============================================================
   44. PROPINNACLE & SAVVY (page-id-183) — plan-detail rebuild 2026-07-07
   Red hero + jump links, Benefits Paid From Risk, Day-to-Day Benefits,
   aubergine Optional Benefits (PPS Gap/Wallet) + CTAs, app section.
   Builds on the existing .pm-plan-hero system.
   ============================================================ */

/* breadcrumb sits inside the coloured hero, white text, no full-bleed */
.pm-plan-hero-inner .pm-breadcrumb {
    background: transparent !important;
    border: none !important;
    width: auto !important;
    left: auto !important;
    margin: 0 0 1.4rem !important;
    padding: 0 !important;
}
.pm-plan-hero-inner .pm-breadcrumb a,
.pm-plan-hero-inner .pm-breadcrumb-current,
.pm-plan-hero-inner .pm-breadcrumb i { color: rgba(255,255,255,0.9) !important; }
.pm-plan-hero-inner .pm-breadcrumb-sep { color: rgba(255,255,255,0.5) !important; }

/* jump / anchor buttons in the hero */
.pm-plan-jump {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1.9rem;
}
.pm-plan-jump-btn {
    display: block;
    text-align: center;
    padding: 0.9rem 1.5rem;
    border: 1.5px solid rgba(255,255,255,0.85);
    border-radius: 100px;
    color: #fff;
    font-family: var(--font-primary);
    font-size: 0.8rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
.pm-plan-jump-btn:hover { background: #fff; color: var(--color-black); text-decoration: none; }

/* benefit blocks — full-bleed, alternating bg */
.pm-plan-block {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: #fff;
    padding: 3rem 1.5rem;
    box-sizing: border-box;
    scroll-margin-top: 80px;
}
.pm-plan-block--alt { background: var(--color-white); }   /* #F5F5F5 grey */
.pm-plan-block-inner { max-width: 760px; margin-inline: auto; }
.pm-plan-block-heading {
    font-family: var(--font-primary);
    font-size: clamp(1.5rem, 6vw, 2.1rem);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--color-black);
    line-height: 1.1;
    margin: 0 0 1.5rem;
}
.pm-plan-block-heading--light { color: #fff; }

/* sub-bullets under a benefit item */
.pm-plan-sublist { list-style: none; margin: 0.5rem 0 0; padding: 0; }
.pm-plan-sublist li {
    border: none;
    padding: 0.25rem 0 0.25rem 1.25rem;
    font-size: 0.9rem;
    color: #666;
    line-height: 1.55;
}
/* Remove ONLY the stray line under sub-bullets (the last sub-bullet picks up a
   border from .pm-plan-benefits li:last-child). Keep the main item's separator
   line (the icon row). */
.pm-plan-benefits--icons .pm-plan-sublist li,
.pm-plan-benefits--icons .pm-plan-sublist li:last-child { border: none !important; }
.pm-plan-sublist li::before {
    content: '\2013';           /* en-dash, not the green tick */
    font-family: var(--font-primary);
    font-weight: 400;
    color: #aaa;
    top: 0.25rem;
    font-size: 0.9rem;
}
.pm-plan-benefits a { color: var(--color-black); text-decoration: underline; text-underline-offset: 2px; }

/* Optional Benefits — aubergine section */
.pm-plan-optional {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: #581845;
    color: #fff;
    padding: 3.5rem 1.5rem;
    box-sizing: border-box;
    scroll-margin-top: 80px;
}
.pm-plan-optional-inner { max-width: 760px; margin-inline: auto; }
.pm-plan-opt-item { margin-bottom: 2rem; }
.pm-plan-opt-title {
    font-family: var(--font-primary);
    font-size: clamp(1.9rem, 9vw, 2.8rem);
    font-weight: var(--fw-light);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: rgba(255,255,255,0.95);
    line-height: 1;
    margin: 0 0 0.55rem;
}
.pm-plan-opt-title span { font-weight: var(--fw-bold); }
.pm-plan-optional p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    color: rgba(255,255,255,0.8);
    line-height: 1.6;
    margin: 0;
    max-width: 520px;
}
.pm-plan-opt-cta {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    margin-top: 2.5rem;
}
.pm-plan-opt-btn {
    display: block;
    text-align: center;
    padding: 1.2rem 2.75rem;
    background: var(--pm-plan-c, #ED2B47);
    color: #fff;
    border-radius: 100px;
    font-family: var(--font-primary);
    font-size: 0.9rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    transition: opacity 0.2s;
}
.pm-plan-opt-btn:hover { opacity: 0.85; text-decoration: none; color: #fff; }

@media (min-width: 1024px) {
    .pm-plan-jump { flex-direction: row; flex-wrap: wrap; }
    .pm-plan-jump-btn { min-width: 220px; }
    .pm-plan-block,
    .pm-plan-optional { padding-inline: max(1.5rem, (100vw - 1120px) / 2); padding-block: 4rem; }
    .pm-plan-block-inner { max-width: 900px; }
    .pm-plan-optional-inner { max-width: 1120px; }
    .pm-plan-opt-cta { flex-direction: row; }
    .pm-plan-opt-btn { min-width: 240px; }
}


/* ============================================================
   45. HEADER BACKGROUND IMAGES (2026-07-07)
   Solid-colour headers get a textured photo behind a flat overlay.
   • Black headers (pm-service-hero, contact) → black photo + #000000 overlay.
   • Grey headers → grey photo + #f1f1f1 overlay (add .pm-hero-grey-img).
   Headers that already carry their own image (members, benefit options,
   who qualifies) are NOT in these selectors, so they're left as-is.
   Overlay kept ~0.8 so the texture reads subtly while text stays legible.
   ============================================================ */
.pm-service-hero,
.contact-hero-section {
    background-color: #000 !important;
    background-image:
        linear-gradient(rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.55)),
        url('images/hero-black-2.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Going-forward GREY headers: add class .pm-hero-grey-img to the hero. */
.pm-hero-grey-img {
    background-color: #f1f1f1 !important;
    background-image:
        linear-gradient(rgba(241, 241, 241, 0.82), rgba(241, 241, 241, 0.82)),
        url('images/hero-grey.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Coloured plan hero — red geometric image behind the ProPinnacle red overlay */
.pm-plan-hero--pinnacle {
    background-color: #ED2B47 !important;
    background-image:
        linear-gradient(rgba(237, 43, 71, 0.95), rgba(237, 43, 71, 0.95)),
        url('images/hero-red.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}


/* ============================================================
   46. PROPINNACLE — per-item red icons, PPS logos, moved CTA row
   ============================================================ */
/* Red circular benefit icons (replaces the generic green tick) */
/* Flex layout (NOT absolute) so icons stay put inside the CSS multi-column
   list AND vertically centre against their (multi-line) copy. */
.pm-plan-benefits--icons > li {
    display: flex;
    align-items: center;
    column-gap: 0.9rem;
    padding-left: 0;
}
.pm-plan-benefits--icons > li::before { display: none !important; }
.pm-bic {
    width: 2.5rem;
    height: 2.5rem;
    border: 1.6px solid var(--pm-plan-c, #ED2B47);
    border-radius: 50%;
    color: var(--pm-plan-c, #ED2B47);
    font-size: 1rem;
    text-align: center;
    flex-shrink: 0;
}
.pm-bic-body { flex: 1 1 auto; min-width: 0; }
/* items with sub-bullets: align the icon to the main term, not the whole block */
.pm-plan-benefits--icons > li:has(.pm-plan-sublist) { align-items: flex-start; }
/* STANDARD icon-circle centering (all FA icon circles): the glyph is a
   block whose line-height fills the circle so it sits dead-centre.
   NB: never put display:grid on the .pm-bic <i> itself — that breaks the
   FontAwesome glyph. Centre via the ::before/child line-height instead. */
.pm-bic::before,
.pm-bic > i,
.htc-method-icon::before,
.htc-method-icon > i,
.pm-icon-circle::before,
.pm-icon-circle > i { display: block; line-height: 2; }

/* PPS logos replace the text headings in Optional Benefits */
.pm-plan-opt-logo {
    display: block;
    width: auto;
    height: auto;
    max-width: 190px;
    margin: 0 0 0.9rem;
}
.pm-plan-opt-logo--wallet { max-width: 205px; margin-bottom: 1rem; }

/* CTA buttons moved OUT of the aubergine section into their own white band */
.pm-plan-cta-row {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    background: #fff;
    padding: 2.5rem 1.5rem 3rem;
    box-sizing: border-box;
}
.pm-plan-cta-row-inner {
    max-width: 760px;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

/* Snail Mail address (How to Claim) — 14px */
.htc-address { font-size: 14px; }

@media (min-width: 1024px) {
    .pm-plan-cta-row { padding-inline: max(1.5rem, (100vw - 1120px) / 2); }
    .pm-plan-cta-row-inner { flex-direction: row; justify-content: center; max-width: none; gap: 1.25rem; }

    /* Optional Benefits: let the body copy run full width on desktop */
    .pm-plan-optional-inner { max-width: 1120px; }
    .pm-plan-optional p { max-width: none; }

    /* 2 columns via multi-column flow (not grid) so a tall item doesn't leave
       a big gap in the other column — any leftover space lands at the end. */
    .pm-plan-benefits--icons {
        display: block;
        column-count: 2;
        column-gap: 3.5rem;
    }
    .pm-plan-benefits--icons > li {
        break-inside: avoid;
        -webkit-column-break-inside: avoid;
    }
}


/* ============================================================
   47. PLAN PAGES — per-plan colour + colored header images
   Colour drives .pm-bic icons and .pm-plan-opt-btn via --pm-plan-c.
   ============================================================ */
body.page-id-183 { --pm-plan-c: #ED2B47; }   /* ProPinnacle  — red */
body.page-id-227 { --pm-plan-c: #F79719; }   /* ProSelect    — orange */
body.page-id-231 { --pm-plan-c: #02AF79; }   /* ProActive    — green */
body.page-id-233 { --pm-plan-c: #754691; }   /* ProSecure      — lighter purple */
body.page-id-235 { --pm-plan-c: #632A7E; }   /* ProSecure Plus — darker purple */

.pm-plan-hero--select {
    background-color: #F79719 !important;
    background-image:
        linear-gradient(rgba(247, 151, 25, 0.95), rgba(247, 151, 25, 0.95)),
        url('images/hero-orange.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}
.pm-plan-hero--active {
    background-color: #02AF79 !important;
    background-image:
        linear-gradient(rgba(2, 175, 121, 0.95), rgba(2, 175, 121, 0.95)),
        url('images/hero-green.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}
.pm-plan-hero--secure {
    background-color: #754691 !important;
    background-image:
        linear-gradient(rgba(117, 70, 145, 0.95), rgba(117, 70, 145, 0.95)),
        url('images/hero-purple.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}
/* ProSecure Plus — darker purple #632A7E (rgb 99,42,126) */
.pm-plan-hero--secureplus {
    background-color: #632A7E !important;
    background-image:
        linear-gradient(rgba(99, 42, 126, 0.95), rgba(99, 42, 126, 0.95)),
        url('images/hero-purple.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Marketing opt-in checkbox copy (.cf-marketing-consent injected before form submit
   buttons across the site's forms) → 14px so it doesn't render oversized */
.cf-marketing-consent,
.cf-marketing-consent span {
    font-size: 14px !important;
    line-height: 1.5;
}


/* ============================================================
   48. SERVICE-PAGE SECTION ICONS + per-page accent colours
   --pm-accent drives the h2 icon, the h2 accent bar and the bullets,
   so each page reads as its own colour instead of one lime everywhere.
   ============================================================ */
.pm-svc-hicon {
    color: var(--pm-accent, #02AF79);
    margin-right: 0.65rem;
    font-size: 0.92em;
    display: inline-block;
    min-width: 1.1em;
    text-align: center;
}
/* per-page accents (brand palette variety) */
body.page-id-317  { --pm-accent: #6786F9; }   /* Pre-authorisation — blue */
body.page-id-321  { --pm-accent: #02AF79; }   /* Prescribed Minimum Benefits — green */
body.page-id-332  { --pm-accent: #FF6E42; }   /* Reference Pricing — orange */
body.page-id-345  { --pm-accent: #6786F9; }   /* Savvy Network Hospitals — blue */
body.page-id-363  { --pm-accent: #02AF79; }   /* Designated Service Provider Networks — green */
body.page-id-368  { --pm-accent: #581845; }   /* Download Documents — aubergine */
body.page-id-386  { --pm-accent: #02AF79; }   /* Member Services — green */
body.page-id-390  { --pm-accent: #6786F9; }   /* Profmed App — blue */
body.page-id-407  { --pm-accent: #FF6E42; }   /* Profmed Baby — orange */
body.page-id-85   { --pm-accent: #02AF79; }   /* About Profmed — green */
body.page-id-39970{ --pm-accent: #6786F9; }   /* FAQ — blue */
body.page-id-305  { --pm-accent: #02AF79; }   /* How to Claim (uses htc-*, harmless) */


/* ============================================================
   49. BLOG ARTICLE — Gutenberg button = black pill, full-width on mobile
   ============================================================ */
.pm-article-body .wp-block-button__link,
.pm-article-body .wp-element-button {
    background: #000 !important;
    color: #fff !important;
    border: none;
    border-radius: 100px;
    padding: 0.95rem 2.4rem;
    font-family: var(--font-primary);
    font-size: 0.85rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    transition: opacity 0.2s;
}
.pm-article-body .wp-block-button__link:hover,
.pm-article-body .wp-element-button:hover { opacity: 0.82; color: #fff !important; }
.pm-article-body .wp-block-buttons { margin: 1.5rem 0; }
@media (max-width: 767px) {
    .pm-article-body .wp-block-button { width: 100%; }
    .pm-article-body .wp-block-button__link,
    .pm-article-body .wp-element-button { display: block; width: 100%; text-align: center; }
}


/* ============================================================
   50. ABOUT PROFMED (page-id-85) — bespoke sectioned rebuild 2026-07-08
   Mobile-first. Reuses the How-to-Claim section/card system (§43):
   black hero + intro + Values cards + Advantages list + Partner cards
   + CTA + app. Content sourced from the live about page.
   ============================================================ */

/* card body copy (Values + Partners use <p>, not <li>) */
.pm-values .htc-method-card p,
.pm-partners .htc-method-card p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 0.95rem;
    line-height: 1.65;
    color: #444;
    margin: 0;
}
.pm-values .htc-method-card h3,
.pm-partners .htc-method-card h3 { margin-bottom: 0.6rem; }

/* Values cards — keep the lime icon circle, tighten spacing */
.pm-values .htc-method-card { text-align: left; }

/* Partner cards — name, blurb, then a bottom-anchored "Visit Website" link */
.pm-partner-card { display: flex; flex-direction: column; }
.pm-partner-card h3 { text-transform: none; letter-spacing: 0.01em; font-size: 1.1rem; }
.pm-partner-link {
    margin-top: auto;
    padding-top: 1.1rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-primary);
    font-size: 0.78rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-black) !important;
    text-decoration: none !important;
}
.pm-partner-link i { font-size: 0.72rem; transition: transform 0.2s; }
.pm-partner-link:hover { opacity: 0.7; }
.pm-partner-link:hover i { transform: translateX(3px); }

/* Partner logo — sits below the copy, left-aligned to the text */
.pm-partner-logo {
    margin: 0.75rem 0 0.25rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 52px;
}
.pm-partner-logo img {
    max-height: 48px;
    max-width: 170px;
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: left center;
}

/* Governance — linked document list, chevron rows, aubergine accents */
.pm-gov-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}
.pm-gov-list li { border-bottom: 1px solid rgba(0,0,0,0.08); }
.pm-gov-list a {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.9rem 0.25rem;
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.4;
    color: var(--color-black) !important;
    text-decoration: none !important;
    transition: color 0.15s, padding-left 0.15s;
}
.pm-gov-list a i {
    color: #581845;                         /* aubergine */
    font-size: 0.8rem;
    flex-shrink: 0;
    transition: transform 0.15s;
}
.pm-gov-list a:hover { color: #581845 !important; padding-left: 0.6rem; }
.pm-gov-list a:hover i { transform: translateX(2px); }

@media (min-width: 1024px) {
    .pm-gov-list { grid-template-columns: repeat(2, 1fr); column-gap: 3rem; }
}

/* Advantages — per-item Font Awesome icons in aubergine, 1 col mobile */
.pm-about-adv {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.35rem 2rem;
}
.pm-about-adv li {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    padding: 0.55rem 0;
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.55;
    color: #333;
}
.pm-about-adv li i {
    color: #581845;                         /* aubergine */
    font-size: 1.1rem;
    width: 1.6rem;
    text-align: center;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

@media (min-width: 1024px) {
    /* 5 value cards + 7 partner cards flow nicely in the §43 3-col grid.
       Advantages become two columns of check bullets. */
    .pm-about-adv { grid-template-columns: repeat(2, 1fr); }
}


/* ============================================================
   51. GOVERNANCE PAGES — grey hero + document/board template 2026-07-08
   Rebuilt from WPBakery into pm-service-hero (grey) + htc-section.
   Shared grey header image across all governance pages.
   ============================================================ */

/* Grey header image — same for every governance page. Overrides the
   black hero (§45) via the extra .pm-gov-hero class (higher specificity). */
.pm-service-hero.pm-gov-hero {
    background-color: #3a3a3a !important;
    background-image:
        linear-gradient(rgba(28,28,28,0.52), rgba(28,28,28,0.52)),
        url('images/hero-grey.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Hero jump buttons (e.g. Annual Reports: current vs previous) */
.pm-gov-jump {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1.75rem;
}
.pm-gov-jump-btn {
    display: block;
    text-align: center;
    padding: 0.9rem 1.6rem;
    border: 1.5px solid rgba(255,255,255,0.85);
    border-radius: 100px;
    color: #fff;
    font-family: var(--font-primary);
    font-size: 0.8rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none !important;
    transition: background 0.2s, color 0.2s;
}
.pm-gov-jump-btn:hover { background: #fff; color: var(--color-black); }
#current-report, #previous-reports { scroll-margin-top: 90px; }

/* Document download buttons (PDF links) */
.pm-doc-btn {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: #fff;
    border: 1px solid rgba(88, 24, 69, 0.25);
    color: var(--color-black) !important;
    padding: 0.95rem 1.5rem;
    border-radius: 50px;
    font-family: var(--font-primary);
    font-weight: var(--fw-regular);
    font-size: 0.95rem;
    line-height: 1.4;
    text-decoration: none !important;
    transition: border-color 0.2s, background 0.2s, transform 0.2s;
}
.pm-doc-btn i { color: #581845; font-size: 1.05rem; flex-shrink: 0; }
.pm-doc-btn:hover { border-color: #581845; background: rgba(88, 24, 69, 0.04); }
.pm-doc-grid {
    display: grid;
    grid-template-columns: 1fr;   /* mobile: 1 col; desktop → 2 cols (below) */
    gap: 0.75rem;
    margin-top: 1rem;
}

/* Plain content lists inside governance/htc bodies: body font, slight indent,
   small circle bullet. Scoped with :not([class]) so styled lists
   (.pm-about-adv, .pm-gov-list) keep their own treatment. */
.htc-section ul:not([class]) {
    list-style: none;
    margin: 1rem 0 1.25rem;
    padding-left: 0.5rem;
}
.htc-section ul:not([class]) li {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1rem;
    line-height: 1.7;
    color: #333;
    position: relative;
    padding-left: 1.4rem;
    margin-bottom: 0.35rem;
}
.htc-section ul:not([class]) li::before {
    content: '';
    position: absolute;
    left: 0.25rem;
    top: 0.62em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #581845;
}
.htc-section ul:not([class]) li a,
.htc-section .htc-inner > p a,
.htc-inner--narrow p a {
    color: var(--color-black);
    font-weight: var(--fw-bold);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.htc-section ul:not([class]) li a:hover,
.htc-section .htc-inner > p a:hover { opacity: 0.7; }

/* PDF embed — self-contained iframe viewer (pdf-embedder plugin is inactive) */
.pm-pdf-embed {
    margin: 1.5rem 0 1rem;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 12px;
    overflow: hidden;
    background: #f4f4f4;
}
.pm-pdf-frame {
    display: block;
    width: 100%;
    height: 70vh;
    min-height: 480px;
    border: 0;
}
.pm-pdf-actions {
    margin: 0 0 0.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.pm-pdf-actions .pm-doc-btn { display: inline-flex; flex: 1 1 260px; }

/* Board of Trustees — member bio cards */
.pm-board-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    margin-top: 1.75rem;
}
.pm-board-card {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.07);
    padding: 1.75rem 1.5rem;
}
.pm-board-card img {
    width: 104px;
    height: 104px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    margin: 0 0 1.1rem;
    max-width: 104px;
}
.pm-board-card h3 {
    font-family: var(--font-primary);
    font-size: 1.2rem;
    font-weight: var(--fw-bold);
    color: var(--color-black);
    margin: 0 0 0.35rem;
}
.pm-board-card strong {
    display: block;
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    color: #581845;
    font-size: 0.9rem;
    line-height: 1.45;
    margin-bottom: 0.15rem;
}
.pm-board-card p,
.pm-board-card {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    line-height: 1.65;
    color: #444;
    font-size: 0.95rem;
}
.pm-board-card p { margin: 0.9rem 0 0; }

@media (min-width: 768px) {
    #pm-dl-grid { grid-template-columns: repeat(2, 1fr); gap: 0.85rem; }
}
@media (min-width: 1024px) {
    .pm-board-grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; }
    .pm-gov-jump { flex-direction: row; flex-wrap: wrap; }
    .pm-gov-jump-btn { min-width: 260px; }
}


/* ============================================================
   52. HOMEPAGE ADDITIONAL-BENEFIT TILE LINKS + MOBILE BREADCRUMB
   ============================================================ */
/* Additional-benefit tiles become clickable without changing their look */
.benefits-icon-list li a.benefit-link {
    display: flex;
    align-items: center;
    gap: inherit;
    color: inherit;
    text-decoration: none;
    width: 100%;
}
.benefits-icon-list li a.benefit-link:hover { opacity: 0.72; }

/* Mobile: deep breadcrumbs (2+ ancestors) show only the ancestor levels,
   e.g. "About > Governance" — hide the home icon and the current page. */
@media (max-width: 767px) {
    .pm-bc-deep .pm-breadcrumb-home,
    .pm-bc-deep .pm-bc-home-sep,
    .pm-bc-deep .pm-breadcrumb-current,
    .pm-bc-deep .pm-bc-cur-sep { display: none; }
}


/* ============================================================
   53. GOVERNANCE BUTTONS — same left-to-right colour-wipe hover as
   the homepage buttons (see §"V2 GLOBAL BUTTON HOVER").
   ============================================================ */
.pm-doc-btn,
.pm-gov-jump-btn {
    position: relative;
    overflow: hidden;
    z-index: 0;
}
.pm-doc-btn::before,
.pm-gov-jump-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--wipe, #581845);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.35s ease;
    z-index: -1;
    pointer-events: none;
}
.pm-doc-btn:hover::before,
.pm-gov-jump-btn:hover::before { transform: scaleX(1); }

/* Doc buttons: aubergine wipe, text + icon go white */
.pm-doc-btn { --wipe: #581845; transition: color 0.2s ease, border-color 0.2s ease; }
.pm-doc-btn:hover {
    background: transparent !important;
    border-color: #581845;
    color: #fff !important;
    opacity: 1;
}
.pm-doc-btn:hover i { color: #fff; }

/* Hero jump / View-Download buttons: white wipe, text goes dark */
.pm-gov-jump-btn { --wipe: #fff; }
.pm-gov-jump-btn:hover {
    background: transparent;
    color: var(--color-black) !important;
}


/* ============================================================
   54. RESPONSIVE VIDEO EMBEDS + ABOUT INTRO (copy + video) 2026-07-08
   ============================================================ */
.pm-video {
    position: relative;
    aspect-ratio: 16 / 9;
    background: #000;
    border-radius: 12px;
    overflow: hidden;
}
.pm-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.pm-video-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    margin-top: 1.25rem;
}
.pm-video-item { margin: 0; }
.pm-video-item figcaption {
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    font-size: 0.95rem;
    color: var(--color-black);
    margin-top: 0.75rem;
}

/* About intro — copy left, video right (stacks on mobile) */
.pm-about-intro {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.75rem;
    align-items: start;
}
.pm-about-intro-copy p { margin: 0 0 1rem; }

@media (min-width: 900px) {
    .pm-video-grid { grid-template-columns: repeat(3, 1fr); }
    .pm-about-intro { grid-template-columns: 1.15fr 0.85fr; gap: 2.5rem; }
    .pm-about-intro-video { position: sticky; top: 90px; }
}


/* ============================================================
   55. LEGAL PAGES — plain grey header + simple body typography
   ============================================================ */
.pm-legal h2 {
    font-family: var(--font-primary);
    font-size: clamp(1.2rem, 4vw, 1.5rem);
    font-weight: var(--fw-bold);
    color: var(--color-black);
    margin: 2rem 0 0.75rem;
}
.pm-legal h2:first-child { margin-top: 0; }
.pm-legal p {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    line-height: 1.75;
    color: #333;
    margin: 0 0 1rem;
}
.pm-legal ul { margin: 0 0 1rem; padding-left: 0; list-style: none; }
.pm-legal li {
    position: relative;
    padding: 0.3rem 0 0.3rem 1.4rem;
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    line-height: 1.6;
    color: #333;
}
.pm-legal li::before {
    content: '';
    position: absolute;
    left: 0.25rem;
    top: 0.85em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #581845;
}
.pm-legal a { color: var(--color-black); text-decoration: underline; text-underline-offset: 2px; }
.pm-legal a:hover { opacity: 0.7; }


/* ============================================================
   56. MEMBER SERVICES — "thank you for getting in touch" page
   ============================================================ */
.pm-ty-lead {
    font-family: var(--font-primary);
    font-weight: var(--fw-light);
    font-size: 1.1rem;
    line-height: 1.7;
    color: #333;
    margin: 0 0 2.25rem;
}
.pm-contact-groups {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.75rem 2.5rem;
}
.pm-contact-title {
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #581845;
    margin: 0 0 0.9rem;
}
.pm-contact-row {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.4rem 0;
    text-decoration: none !important;
    color: var(--color-black) !important;
}
.pm-contact-ic {
    width: 2.6rem;
    height: 2.6rem;
    flex-shrink: 0;
    border-radius: 50%;
    background: #6786F9;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: transform 0.2s;
}
.pm-contact-row:hover .pm-contact-ic { transform: scale(1.08); }
.pm-contact-num {
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    font-size: 1.15rem;
    color: var(--color-black);
}
.pm-contact-num em { font-style: normal; font-weight: var(--fw-light); font-size: 0.85rem; color: #666; }

.pm-ty-cta { margin-top: 2.5rem; }
.pm-ty-btn {
    position: relative;
    overflow: hidden;
    z-index: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #6786F9;
    color: #fff !important;
    padding: 1.05rem 2.4rem;
    border-radius: 100px;
    font-family: var(--font-primary);
    font-size: 0.85rem;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none !important;
    --wipe: #2f4bc7;
}
.pm-ty-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--wipe);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.35s ease;
    z-index: -1;
}
.pm-ty-btn:hover::before { transform: scaleX(1); }
.pm-ty-btn:hover { color: #fff !important; }

@media (min-width: 700px) {
    .pm-contact-groups { grid-template-columns: repeat(2, 1fr); }
}


/* ============================================================
   58. CHRONIC DISEASE LIST — mobile-first searchable conditions grid
   ============================================================ */
.pm-cdl-searchwrap { position: relative; max-width: 460px; margin: 0 0 1.5rem; }
.pm-cdl-searchwrap i {
    position: absolute; left: 1.1rem; top: 50%; transform: translateY(-50%);
    color: #6786F9; font-size: 0.95rem;
}
.pm-cdl-search {
    width: 100%; box-sizing: border-box;
    border: 1.5px solid rgba(0,0,0,0.15); border-radius: 50px;
    padding: 0.9rem 1.2rem 0.9rem 2.7rem;
    font-family: var(--font-primary); font-size: 1rem; color: var(--color-black); background: #fff;
}
.pm-cdl-search:focus { outline: none; border-color: #6786F9; box-shadow: 0 0 0 3px rgba(103,134,249,0.15); }

/* plan selector pills */
.pm-cdl-plans { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0 0 1.4rem; }
.pm-cdl-plan {
    font-family: var(--font-primary); font-weight: var(--fw-bold); font-size: 0.8rem;
    letter-spacing: 0.06em; text-transform: uppercase;
    padding: 0.7rem 1.3rem; border-radius: 50px; cursor: pointer;
    background: #fff; color: var(--color-black); border: 1.5px solid rgba(0,0,0,0.18);
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.pm-cdl-plan:hover { border-color: var(--c, #6786F9); color: var(--c, #6786F9); }
.pm-cdl-plan--active,
.pm-cdl-plan--active:hover { background: var(--c, #6786F9); color: var(--tc, #fff); border-color: var(--c, #6786F9); }

.pm-cdl-grouptitle {
    font-family: var(--font-primary); font-weight: var(--fw-bold);
    font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase;
    color: #581845; margin: 1.6rem 0 0.9rem;
}
.pm-cdl-grouptitle:first-child { margin-top: 0; }

.pm-cdl-grid { list-style: none; margin: 0 0 0.5rem; padding: 0; display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
.pm-cdl-item {
    display: flex; align-items: center; gap: 0.8rem;
    background: #fff; border: 1px solid rgba(0,0,0,0.08); border-radius: 12px;
    padding: 0.95rem 1.15rem;
    font-family: var(--font-primary); font-weight: var(--fw-regular);
    font-size: 1rem; line-height: 1.35; color: #222;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.pm-cdl-item:hover { border-color: var(--tick, #6786F9); box-shadow: 0 3px 14px rgba(0,0,0,0.06); }
.pm-cdl-item i { color: var(--tick, #6786F9); font-size: 1.05rem; flex-shrink: 0; }
.pm-cdl-none { font-family: var(--font-primary); color: #666; margin-top: 1rem; }

@media (min-width: 700px)  { .pm-cdl-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pm-cdl-grid { grid-template-columns: repeat(3, 1fr); } }


/* ============================================================
   57. NETWORK HOSPITAL TOOL (page 34123) — hero + category links +
   store-locator plugin restyle to match the Profmed design.
   ============================================================ */
.pm-nht-hero {
    width: 100vw; position: relative; left: 50%; margin-left: -50vw;
    box-sizing: border-box;
    padding: 3rem 1.5rem 3.5rem;
    /* align hero content to the shared 1120 line (matches logo + breadcrumb) */
    padding-inline: max(1.5rem, (100vw - 1120px) / 2);
    background-color: #000;
    background-image: linear-gradient(rgba(0,0,0,0.62), rgba(0,0,0,0.62)), url('images/hero-black-2.jpg');
    background-size: cover; background-position: center;
}
.pm-nht-hero > * { max-width: 1120px; margin-inline: 0; }
.pm-nht-hero h1 {
    font-family: var(--font-primary); font-weight: var(--fw-bold);
    font-size: clamp(1.9rem, 6vw, 3rem); text-transform: uppercase;
    color: #fff; line-height: 1.05; letter-spacing: 0.02em; margin: 0 0 1rem;
}
.pm-nht-lead { font-family: var(--font-primary); font-weight: var(--fw-light); color: rgba(255,255,255,0.85); margin: 0 0 2.25rem; }
.pm-nht-cats { display: grid; grid-template-columns: 1fr; gap: 2rem; }
.pm-nht-cat h3 {
    font-family: var(--font-primary); font-weight: var(--fw-bold);
    font-size: 1.15rem; text-transform: uppercase; letter-spacing: 0.03em; margin: 0 0 0.5rem;
}
.pm-nht-cat p { font-family: var(--font-primary); font-weight: var(--fw-light); color: rgba(255,255,255,0.8); line-height: 1.55; margin: 0 0 1rem; }
.pm-nht-catlink {
    font-family: var(--font-primary); font-weight: var(--fw-semibold);
    font-size: 0.9rem; text-decoration: underline; text-underline-offset: 3px;
    display: inline-block;
}
.pm-nht-cat--day   h3, .pm-nht-cat--day   .pm-nht-catlink { color: var(--color-lime); }
.pm-nht-cat--select h3, .pm-nht-cat--select .pm-nht-catlink { color: #F79719; }
.pm-nht-cat--savvy h3, .pm-nht-cat--savvy .pm-nht-catlink { color: #6786F9; }
.pm-nht-catlink:hover { opacity: 0.8; }

/* Tool wrapper */
.pm-nht-tool { padding: 2.5rem 1.5rem 1rem; max-width: 1120px; margin-inline: auto; }

/* --- store-locator plugin restyle --- */
.pm-nht-tool .store_locator_address_field,
.pm-nht-tool .store_locator_filter_categories,
.pm-nht-tool select.select,
.pm-nht-tool input[type="text"] {
    border: 1px solid rgba(0,0,0,0.2) !important;
    border-radius: 50px !important;
    padding: 0.9rem 1.4rem !important;
    font-family: var(--font-primary) !important;
    font-size: 1rem !important;
    background: #fff !important;
    box-shadow: none !important;
}
.pm-nht-tool .store_locator_search_button,
.pm-nht-tool button[type="submit"] {
    background: var(--color-lime) !important;
    color: var(--color-black) !important;
    border: none !important;
    border-radius: 50px !important;
    font-family: var(--font-primary) !important;
    font-weight: var(--fw-bold) !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    padding: 1rem 2.5rem !important;
}

@media (min-width: 900px) {
    .pm-nht-cats { grid-template-columns: repeat(3, 1fr); gap: 2.5rem; }
}


/* ============================================================
   59. FAQ ACCORDION (reusable) — native <details>/<summary>, no JS
   ============================================================ */
.pm-accordion { max-width: 100%; margin: 0; }
.pm-acc {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.10);
    border-radius: 12px;
    margin: 0 0 0.85rem;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.pm-acc[open] { border-color: rgba(103,134,249,0.55); box-shadow: 0 4px 18px rgba(0,0,0,0.06); }
.pm-acc summary {
    list-style: none;
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    cursor: pointer;
    padding: 1.15rem 1.35rem;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 1.05rem; line-height: 1.35;
    color: var(--color-black);
}
.pm-acc summary::-webkit-details-marker { display: none; }   /* Safari */
.pm-acc summary:hover { color: #6786F9; }
.pm-acc summary:focus-visible { outline: 2px solid #6786F9; outline-offset: -2px; }
.pm-acc summary .pm-acc-ico {
    flex-shrink: 0; color: #6786F9; font-size: 0.95rem;
    transition: transform 0.22s ease;
}
.pm-acc[open] summary .pm-acc-ico { transform: rotate(180deg); }
.pm-acc-a {
    padding: 0 1.35rem 1.25rem;
    font-family: var(--font-primary);
    font-weight: var(--fw-regular);
    font-size: 1rem; line-height: 1.6; color: #333;
}
.pm-acc-a > *:first-child { margin-top: 0; }
.pm-acc-a > *:last-child { margin-bottom: 0; }
.pm-acc-a ul { margin: 0.6rem 0; padding-left: 1.2rem; }
.pm-acc-a li { margin: 0.35rem 0; }
.pm-acc-a a { color: #6786F9; font-weight: var(--fw-bold); }


/* ============================================================
   60. NETWORK OPTION LISTS — searchable hospital table (page 26894)
   ============================================================ */
.pm-nol-count { font-family: var(--font-primary); color: #666; font-size: 0.9rem; margin: 0 0 1rem; }
.pm-nol-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 12px; }
.pm-nol-table {
    width: 100%; border-collapse: collapse; background: #fff;
    font-family: var(--font-primary); font-size: 0.95rem; color: #222;
    border: 1px solid rgba(0,0,0,0.08); border-radius: 12px; overflow: hidden;
}
.pm-nol-table thead th {
    background: #581845; color: #fff; text-align: left;
    font-weight: var(--fw-bold); font-size: 0.78rem; letter-spacing: 0.05em; text-transform: uppercase;
    padding: 0.85rem 1rem; white-space: nowrap;
}
.pm-nol-table td { padding: 0.85rem 1rem; border-top: 1px solid rgba(0,0,0,0.07); vertical-align: top; }
.pm-nol-table tbody tr:hover { background: rgba(103,134,249,0.06); }
.pm-nol-badge {
    display: inline-block; margin: 0 0.3rem 0.3rem 0;
    padding: 0.25rem 0.6rem; border-radius: 50px;
    font-size: 0.72rem; font-weight: var(--fw-bold); letter-spacing: 0.03em; white-space: nowrap;
}

/* mobile: turn each row into a stacked card using the data-th labels */
@media (max-width: 767px) {
    .pm-nol-table, .pm-nol-table thead, .pm-nol-table tbody,
    .pm-nol-table th, .pm-nol-table td, .pm-nol-table tr { display: block; }
    .pm-nol-table thead { position: absolute; left: -9999px; }
    .pm-nol-table { border: none; }
    .pm-nol-table tr {
        background: #fff; border: 1px solid rgba(0,0,0,0.10); border-radius: 12px;
        margin: 0 0 0.85rem; padding: 0.4rem 0.9rem;
    }
    .pm-nol-table td { border: none; padding: 0.4rem 0; display: flex; gap: 0.8rem; }
    .pm-nol-table td::before {
        content: attr(data-th); flex: 0 0 6.5rem;
        font-weight: var(--fw-bold); font-size: 0.72rem; letter-spacing: 0.04em;
        text-transform: uppercase; color: #581845;
    }
    .pm-nol-table td[data-th="Hospital"] { font-size: 1.05rem; }
}


/* ============================================================
   61. PROFESSION PAGES — icon-circle feature list + CTA buttons
   ============================================================ */
/* "Why <profession> choose Profmed" — icon in a soft circle badge + title + copy */
.pm-prof-feats { display: flex; flex-direction: column; gap: 1.85rem; margin: 1.25rem 0 0; }
.pm-prof-feat { display: flex; align-items: flex-start; gap: 1.3rem; }
.pm-prof-feat-ic {
    flex-shrink: 0;
    width: 66px; height: 66px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: rgba(103,134,249,0.10);
    border: 2px solid rgba(103,134,249,0.45);
    color: #6786F9; font-size: 1.5rem;
}
.pm-prof-feat-body { flex: 1; }
.pm-prof-feat-body h3 {
    font-family: var(--font-primary); font-weight: var(--fw-bold);
    font-size: 1.15rem; line-height: 1.25; color: var(--color-black); margin: 0 0 0.4rem;
}
.pm-prof-feat-body p {
    font-family: var(--font-primary); font-weight: var(--fw-regular);
    font-size: 1rem; line-height: 1.6; color: #333; margin: 0;
}
@media (min-width: 600px) { .pm-prof-feat-ic { width: 72px; height: 72px; font-size: 1.65rem; } }

/* CTA buttons — same look as the who-qualifies "CONTACT ME" pill (.wq-cta-btn),
   laid out in a constrained column so they don't stretch full section width */
.pm-prof-btns { display: flex; flex-direction: column; gap: 0.9rem; max-width: 420px; margin: 1.75rem 0 0; }

/* Profession pages — swap the grey hero image for the Nanjing architecture photo
   (same dark overlay; scoped by page-id so nested/other pages are unaffected). */
body.page-id-42787 .pm-service-hero.pm-gov-hero,
body.page-id-43589 .pm-service-hero.pm-gov-hero,
body.page-id-43978 .pm-service-hero.pm-gov-hero,
body.page-id-45485 .pm-service-hero.pm-gov-hero,
body.page-id-42834 .pm-service-hero.pm-gov-hero,
body.page-id-43982 .pm-service-hero.pm-gov-hero,
body.page-id-42851 .pm-service-hero.pm-gov-hero,
body.page-id-45447 .pm-service-hero.pm-gov-hero,
body.page-id-45477 .pm-service-hero.pm-gov-hero,
body.page-id-55941 .pm-service-hero.pm-gov-hero,
body.page-id-45496 .pm-service-hero.pm-gov-hero,
body.page-id-45490 .pm-service-hero.pm-gov-hero,
body.page-id-45984 .pm-service-hero.pm-gov-hero,
body.page-id-43990 .pm-service-hero.pm-gov-hero,
body.page-id-45481 .pm-service-hero.pm-gov-hero,
body.page-id-43992 .pm-service-hero.pm-gov-hero,
body.page-id-45500 .pm-service-hero.pm-gov-hero,
body.page-id-18573 .pm-service-hero.pm-gov-hero,
body.page-id-19411 .pm-service-hero.pm-gov-hero {
    background-image:
        linear-gradient(rgba(28,28,28,0.52), rgba(28,28,28,0.52)),
        url('images/hero-prof.jpg') !important;
}

/* ============================================================
   63. PROFESSION PAGES — CTA row + centred testimonials +
       white centred final CTA band   (2026-07-27, ver 3.4.1)
   Class-based (NOT page-scoped) so it covers all 19 profession
   pages that share this layout. See [[project_profmed]].
   ============================================================ */

/* Final "Ready to get started?" band → white bg + fully centred.
   :has() isolates it from the testimonials band (also .htc-alt) and
   from the mid-page CTA group (plain .htc-section — stays left). */
.htc-section.htc-alt:has(.pm-prof-btns) {
    background: #fff;
    text-align: center;
}
.htc-section.htc-alt:has(.pm-prof-btns) .pm-prof-btns {
    justify-content: center;
    margin-inline: auto;      /* centre the button block on mobile too */
}

@media (min-width: 1024px) {
    /* CTAs sit next to each other on desktop (mid-page group + final band) */
    .pm-prof-btns {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        max-width: none;
    }
    .pm-prof-btns .wq-cta-btn { width: auto; flex: 0 0 auto; }

    /* Testimonials stay a single-row horizontal SLIDER on desktop (like mobile),
       instead of the rigid 3-up grid — so a 4th card never orphans on the left. */
    .htc-section .testimonials-scroll {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 1.5rem;
        overflow-x: auto;
        max-width: 1120px;
        margin-inline: auto;
        margin-top: 2.5rem;        /* padding between heading and cards */
        padding-bottom: 1rem;
    }
    .htc-section .testimonials-scroll .review-card {
        flex: 0 0 340px;
        max-width: 340px;
        width: 100%;
    }
    /* Centre the "What Our Members Say" heading on desktop */
    .htc-section.htc-alt:has(.testimonials-scroll) .htc-heading {
        text-align: center;
    }
}

/* Remove the inline icons before section headings on the profession pages
   (covers h2.htc-heading and the h3 "Why professionals?" sub-heads). Scoped by
   page-id so other page types keep their heading icons. */
body.page-id-42787 .htc-section :is(h2, h3, h4) > i,
body.page-id-43589 .htc-section :is(h2, h3, h4) > i,
body.page-id-43978 .htc-section :is(h2, h3, h4) > i,
body.page-id-45485 .htc-section :is(h2, h3, h4) > i,
body.page-id-42834 .htc-section :is(h2, h3, h4) > i,
body.page-id-43982 .htc-section :is(h2, h3, h4) > i,
body.page-id-42851 .htc-section :is(h2, h3, h4) > i,
body.page-id-45447 .htc-section :is(h2, h3, h4) > i,
body.page-id-45477 .htc-section :is(h2, h3, h4) > i,
body.page-id-55941 .htc-section :is(h2, h3, h4) > i,
body.page-id-45496 .htc-section :is(h2, h3, h4) > i,
body.page-id-45490 .htc-section :is(h2, h3, h4) > i,
body.page-id-45984 .htc-section :is(h2, h3, h4) > i,
body.page-id-43990 .htc-section :is(h2, h3, h4) > i,
body.page-id-45481 .htc-section :is(h2, h3, h4) > i,
body.page-id-43992 .htc-section :is(h2, h3, h4) > i,
body.page-id-45500 .htc-section :is(h2, h3, h4) > i,
body.page-id-18573 .htc-section :is(h2, h3, h4) > i,
body.page-id-19411 .htc-section :is(h2, h3, h4) > i {
    display: none;
}

/* Add breathing room between the lead heading and a following sub-heading
   (e.g. "Are you a professional…?" → "Why professionals?"). */
body.page-id-42787 .htc-heading + h3,
body.page-id-43589 .htc-heading + h3,
body.page-id-43978 .htc-heading + h3,
body.page-id-45485 .htc-heading + h3,
body.page-id-42834 .htc-heading + h3,
body.page-id-43982 .htc-heading + h3,
body.page-id-42851 .htc-heading + h3,
body.page-id-45447 .htc-heading + h3,
body.page-id-45477 .htc-heading + h3,
body.page-id-55941 .htc-heading + h3,
body.page-id-45496 .htc-heading + h3,
body.page-id-45490 .htc-heading + h3,
body.page-id-45984 .htc-heading + h3,
body.page-id-43990 .htc-heading + h3,
body.page-id-45481 .htc-heading + h3,
body.page-id-43992 .htc-heading + h3,
body.page-id-45500 .htc-heading + h3,
body.page-id-18573 .htc-heading + h3,
body.page-id-19411 .htc-heading + h3 {
    margin-top: 1.75rem;
}

/* ============================================================
   64. NETWORK HOSPITAL TOOL — category badges follow the header
       colours + black/lime buttons   (2026-07-27, ver 3.4.3)
   ============================================================ */

/* Category badges = capsule, colour-matched to the header category cards.
   badgeCSS = slugify(term name) → proselect-network / day-procedure-network /
   savvy-network. */
.pm-nht-tool .store-locator-badge {
    border-radius: 50px !important;          /* capsule */
    font-family: var(--font-primary) !important;
    font-weight: var(--fw-bold) !important;
    padding: 0.3em 0.9em !important;
    letter-spacing: 0.02em;
}
.pm-nht-tool .store-locator-badge.proselect-network     { background: #F79719 !important; color: #000 !important; }  /* ProSelect → yellow / black */
.pm-nht-tool .store-locator-badge.day-procedure-network { background: var(--color-lime) !important; color: #000 !important; }  /* Day Procedure → green / black */
.pm-nht-tool .store-locator-badge.savvy-network         { background: #6786F9 !important; color: #fff !important; }  /* Savvy → blue / white */

/* Search + Get Directions buttons → black background, lime text.
   The main search button is .store_locator_find_stores_button (Divi
   et_pb_button btn-primary = blue by default); include the older class names too. */
.pm-nht-tool .store_locator_find_stores_button,
.pm-nht-tool .store_locator_search_button,
.pm-nht-tool button[type="submit"],
.pm-nht-tool .store_locator_get_direction {
    background: var(--color-black) !important;
    background-image: none !important;
    color: var(--color-lime) !important;
    border: none !important;
}
.pm-nht-tool .store_locator_find_stores_button i,
.pm-nht-tool .store_locator_search_button i,
.pm-nht-tool .store_locator_get_direction i { color: var(--color-lime) !important; }

/* A little breathing room below the search button */
.pm-nht-tool .store_locator_find_stores_button,
.pm-nht-tool .store_locator_search_button,
.pm-nht-tool button[type="submit"] { margin-bottom: 1.5rem !important; }

/* Get Directions → full width pill */
.pm-nht-tool .store_locator_get_direction {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    border-radius: 50px !important;
    margin-top: 0.5rem;
}

/* ============================================================
   65. OPTION COMPARATOR TOOL (page-templates/pm-comparator.php)
       3-step: select 2 → dependants → sticky-tab results.
       (2026-07-27, ver 3.5.0)
   ============================================================ */
.pm-cmp { font-family: var(--font-primary); }
.pm-cmp-card {
    background:#fff; border-radius:26px; box-shadow:0 6px 30px rgba(0,0,0,.09);
    padding:1.9rem 1.5rem; max-width:640px; margin:0 auto;
}
.pm-cmp-h { font-family:var(--font-primary); font-weight:var(--fw-bold); text-transform:uppercase;
    letter-spacing:.03em; color:#000; font-size:clamp(1.25rem,5vw,1.6rem); line-height:1.15; margin:0 0 .8rem; }
.pm-cmp-em { color:var(--color-lime); }
.pm-cmp-sub { color:#333; font-size:.9rem; line-height:1.55; margin:0 0 1.5rem; }

/* option-capsule grid */
.pm-cmp-grid { display:grid; grid-template-columns:1fr; gap:.7rem; margin-bottom:1.5rem; }
/* single-column option capsules: SAVVY tag stacks BELOW the plan name */
.pm-cmp-grid .pm-cmp-cap { flex-direction:column; gap:.12rem; min-height:56px; }
.pm-cmp-grid .pm-cmp-savvy { margin-left:0; margin-top:.1rem; }
.pm-cmp-cap {
    position:relative; display:flex; align-items:center; justify-content:center; gap:.4rem;
    min-height:52px; padding:.55rem .7rem; border:none; cursor:pointer;
    border-radius:50px; background:var(--c); color:var(--tc);
    font-family:var(--font-primary); font-weight:var(--fw-bold); text-transform:uppercase;
    letter-spacing:.02em; font-size:.9rem; line-height:1.05; text-align:center;
    transition:box-shadow .15s, transform .1s;
}
.pm-cmp-cap:hover { transform:translateY(-1px); }
.pm-cmp-pro { font-weight:var(--fw-regular); opacity:.85; }
.pm-cmp-savvy {
    display:inline-block; font-size:.62rem; font-weight:var(--fw-bold); letter-spacing:.06em;
    background:rgba(0,0,0,.28); color:#fff; padding:.12em .5em; border-radius:50px; margin-left:.15rem;
}
.pm-cmp-cap.is-selected { box-shadow:0 0 0 3px #000, 0 0 0 6px var(--c); }
.pm-cmp-cap.is-selected::after {
    content:"\f00c"; font-family:"Font Awesome 5 Free"; font-weight:900; font-size:.7rem;
    position:absolute; top:-7px; right:-7px; width:20px; height:20px; border-radius:50%;
    background:#000; color:var(--color-lime); display:flex; align-items:center; justify-content:center;
}

/* dark pill button */
.pm-cmp-btn {
    display:block; width:100%; box-sizing:border-box; text-align:center; text-decoration:none;
    padding:1rem 1.5rem; border:none; cursor:pointer; border-radius:50px; margin-top:.75rem;
    font-family:var(--font-primary); font-weight:var(--fw-bold); text-transform:uppercase; letter-spacing:.12em;
    font-size:1rem; transition:opacity .2s;
}
.pm-cmp-btn--dark { background:#000; color:#fff; }
.pm-cmp-btn--lime { color:var(--color-lime) !important; }   /* Get a Quote + Contact Me = lime text (Back stays white) */
.pm-cmp-btn:hover { opacity:.85; }
.pm-cmp-btn:disabled { opacity:.35; cursor:not-allowed; }

/* steppers */
.pm-cmp-stepwrap { text-align:center; margin:1.5rem 0; }
.pm-cmp-steplabel { font-weight:var(--fw-bold); text-transform:uppercase; letter-spacing:.06em; color:#000; margin:0 0 .8rem; font-size:1rem; }
.pm-cmp-stepper { display:flex; align-items:stretch; justify-content:center; gap:.9rem; }
.pm-cmp-step {
    width:74px; height:60px; border:none; cursor:pointer; border-radius:16px; background:#000;
    color:var(--color-lime); font-size:1.3rem; display:flex; align-items:center; justify-content:center;
}
.pm-cmp-stepval {
    min-width:74px; height:60px; display:flex; align-items:center; justify-content:center;
    background:#000; color:#fff; border-radius:16px; font-weight:var(--fw-bold); font-size:1.5rem;
}

/* ---- STEP 3 results ---- */
.pm-cmp-results { max-width:640px; margin:0 auto; }
.pm-cmp-h--res { text-align:center; }
.pm-cmp-tabs {
    position:sticky; top:70px; z-index:30; display:grid; grid-template-columns:1fr 1fr; gap:.6rem;
    padding:.6rem 0 1.4rem; overflow:visible; background:var(--color-white);   /* top:70px clears the fixed nav; extra bottom padding so the active-tab arrow isn't cut off */
}
.pm-cmp-cap--tab { min-height:46px; opacity:.6; }
.pm-cmp-cap--tab.is-active { opacity:1; }
.pm-cmp-cap--tab.is-active::after {
    content:""; position:absolute; bottom:-11px; left:50%; transform:translateX(-50%);
    border-left:11px solid transparent; border-right:11px solid transparent; border-top:12px solid var(--c);
}
/* main card = light #F1F1F1; each inner section = plan colour */
.pm-cmp-rescard {
    background:#F1F1F1; color:#333; border-radius:22px; padding:.9rem; margin-top:.9rem;
}
.pm-cmp-sec { background:var(--c); color:var(--tc); border-radius:16px; padding:1.2rem 1.2rem; margin-bottom:.9rem; }
.pm-cmp-sec:last-child { margin-bottom:0; }
.pm-cmp-sec-h {
    text-align:left; text-transform:uppercase; letter-spacing:.03em; font-weight:var(--fw-bold);
    font-size:1.3rem; line-height:1.15; margin:0 0 1rem; color:var(--tc);
}
/* contributions rows: separators BETWEEN items + one thick line before the total;
   no thin line below the last item */
.pm-cmp-crow { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.55rem 0; border-top:1px solid rgba(255,255,255,.2); }
.pm-cmp-crow:first-child { border-top:none; }
.pm-cmp-crow.is-total { border-top:2px solid rgba(255,255,255,.55); margin-top:.3rem; padding-top:.75rem; font-weight:var(--fw-bold); }
.pm-cmp-clabel { font-size:.95rem; }
.pm-cmp-cval { font-weight:var(--fw-bold); white-space:nowrap; }
.pm-cmp-note { font-size:.72rem; color:#fff; margin:.8rem 0 0; }
.pm-cmp-brow { padding:.7rem 0; border-bottom:1px solid rgba(255,255,255,.18); }
.pm-cmp-brow:last-child { border-bottom:none; }
.pm-cmp-blabel { font-weight:var(--fw-bold); font-size:1.2rem; margin-bottom:.25rem; }
.pm-cmp-bval { font-size:.95rem; line-height:1.5; }
.pm-cmp-bval a { color:var(--tc); text-decoration:underline; }
/* bullet lists inside a benefit value: body-size, light weight, tighter spacing.
   Text + bullet marker follow the section text colour (--tc): white on purple/
   green sections, black on the orange/lime ProSelect section. !important beats
   the global .htc-section ul:not([class]) li { color:#fff }. */
.pm-cmp-bval ul { margin:.35rem 0 0; padding-left:1.15rem; }
.pm-cmp-bval li { font-size:1rem; font-weight:var(--fw-light); line-height:1.3; margin-bottom:.15rem; color:var(--tc) !important; }
.pm-cmp-bval li::marker { color:var(--tc); }
/* the visible bullet is a custom ::before dot (global rule hardcodes it aubergine
   #581845 → invisible on the coloured section). Match it to the text colour. */
.pm-cmp-bval ul li::before { background:var(--tc) !important; }
.pm-cmp-rescta { margin-top:1.1rem; }

@media (min-width:768px){
    .pm-cmp-card, .pm-cmp-results { max-width:720px; }
    .pm-cmp-grid { grid-template-columns:1fr 1fr; gap:.7rem .8rem; }   /* 2 columns on desktop (1 on mobile) */
    .pm-cmp-rescta { display:flex; gap:.8rem; }
    .pm-cmp-rescta .pm-cmp-btn { margin-top:0; }
}

/* Comparator Notes section (below the tool) */
.pm-cmp-notes { margin-top: .5rem; }
.pm-cmp-notes .htc-heading { font-size: clamp(1.2rem,4.5vw,1.5rem); margin-bottom: 1rem; }
.pm-cmp-notes ol { list-style: decimal; padding-left: 1.3rem; margin: 0 0 1.1rem; }
.pm-cmp-notes ol li { margin: 0 0 .8rem; color: #333; line-height: 1.7; font-size: .9rem; padding-left: .2rem; }
.pm-cmp-notes ol li::before { content: none !important; display: none !important; }
.pm-cmp-notes > p { font-size: .82rem; color: #555; margin: 0 0 .6rem; }

/* Header logo + actions align to the shared 1120 content line (matches the
   page title / breadcrumb). max() keeps the 1rem edge gap on smaller screens,
   so the logo only shifts inward on bigger screens. (Image #19) */
#pm-phase1-nav { padding-inline: max(1rem, (100vw - 1120px) / 2); }


/* ============================================================
   66. ICON-BEFORE-HEADING SECTIONS (Image #24)
   Icon rendered in a circle in a left gutter, heading beside it,
   following body content indented to align under the heading.
   ============================================================ */
.htc-section :is(h2, h3):has(> i[class*="fa"]) {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: nowrap;
    margin-top: 2.75rem;   /* breathing room from the paragraph before (Image #28) */
}
.htc-section :is(h2, h3) > i[class*="fa"] {
    flex: 0 0 auto;
    width: 3.25rem;
    height: 3.25rem;
    border: 2px solid #6786F9;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    color: #6786F9 !important;
}
.htc-section :is(h2, h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid) {
    padding-left: 4.25rem;
}

/* Profession pages removed their heading icons → don't indent their body. */
body.page-id-42787 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-43589 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-43978 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-45485 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-42834 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-43982 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-42851 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-45447 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-45477 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-55941 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-45496 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-45490 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-45984 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-43990 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-45481 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-43992 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-45500 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-18573 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid),
body.page-id-19411 .htc-section :is(h2,h3):has(> i[class*="fa"]) ~ :is(p, ul, ol, .pm-doc-grid) {
    padding-left: 0;
}

/* Comparator: tighten the vertical gap between intro and the tool card (Image #27) */
body.page-id-75779 .htc-section { padding-top: 1.75rem; padding-bottom: 1.75rem; }

/* Downloads LIBRARY grid only (#pm-dl-grid) → 2 columns on desktop. Other
   doc-grids (service-page PDF CTAs) stay 1 column so the button is full-width
   (same width as the paragraph above — Image #40). */
.pm-doc-grid { margin-top: 2rem; }
@media (min-width: 768px) {
    #pm-dl-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
/* <br> between doc buttons become grid items → hide them. */
.pm-doc-grid br { display: none; }

/* profmed-app (390) + PMB (321): FA icons as bullets in a blue outline circle
   (no aubergine dot); black text on the white section. The icon is absolutely
   positioned (NOT flex) so inline links inside the item flow normally rather
   than getting pushed to the right. */
:is(body.page-id-390, body.page-id-321) .htc-section ul:not([class]) li {
    display: block; position: relative;
    padding: 0.5rem 0 0.5rem 3.75rem; min-height: 2.75rem;
    color: var(--color-black);
}
:is(body.page-id-390, body.page-id-321) .htc-section ul:not([class]) li::before { display: none !important; }
:is(body.page-id-390, body.page-id-321) .htc-section ul:not([class]) li > i[class*="fa"] {
    position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    width: 2.75rem; height: 2.75rem;
    border: 2px solid #6786F9; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    color: #6786F9 !important; font-size: 1rem;
}

/* downloads (368): space above the "older reports" capsule below the buttons (Image #31) */
body.page-id-368 .htc-note { margin-top: 2.5rem; }

/* ============================================================
   67. DOWNLOADS LIBRARY (page-templates/pm-downloads.php)
       search + category filter pills + doc-card grid.
   ============================================================ */
.pm-dl-searchwrap { max-width: 560px; margin: 0 auto 1rem; }
.pm-dl-filters { justify-content: center; margin-bottom: 1.75rem; }
.pm-dl-none { text-align: center; color: #666; margin-top: 1.5rem; }
#pm-dl-grid .pm-doc-btn[style*="none"] { display: none !important; }

/* chronic-medication (2623): the long Chronic Conditions list → 2 columns on
   desktop only (:has(li:nth-child(12)) targets only the long list). */
@media (min-width: 768px) {
    body.page-id-2623 .htc-section ul:not([class]):has(li:nth-child(12)) {
        column-count: 2;
        column-gap: 3rem;
    }
    body.page-id-2623 .htc-section ul:not([class]):has(li:nth-child(12)) li {
        break-inside: avoid;
    }
}

/* Aubergine callout: full pill on desktop, but on MOBILE reduce to a slightly
   rounded rectangle (tall callouts on narrow screens became near-circles). */
@media (max-width: 767px) {
    .htc-note { border-radius: 28px; }
}

/* Green (#02AF79) phone icons in body copy → aubergine (green is a benefit colour,
   inappropriate for a "call us" icon). Image #44. */
.fas.fa-phone[style*="02AF79"] { color: #581845 !important; }

/* join-profmed: colour the contact-card icons (were default grey). */
.pm-join-card-icon, .pm-join-card-icon i { color: #581845; }

/* join-profmed: align hero + body + cards to the 1120 content line (were flush-left). */
.pm-join-hero, .pm-join-body, .pm-join-cards {
    padding-inline: max(1.5rem, (100vw - 1120px) / 2);
}
.pm-join-body { max-width: none; }
.pm-join-body > * { max-width: 760px; }

/* Blog-card grid via [pm_blog_cards] shortcode — responsive columns */
.pm-blog-grid--cols4, .pm-blog-grid--cols3, .pm-blog-grid--cols2 { display: grid; gap: 1.5rem; grid-template-columns: 1fr; margin: 1rem 0 0; }
@media (min-width: 600px) { .pm-blog-grid--cols4, .pm-blog-grid--cols3, .pm-blog-grid--cols2 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) {
    .pm-blog-grid--cols4 { grid-template-columns: repeat(4, 1fr); }
    .pm-blog-grid--cols3 { grid-template-columns: repeat(3, 1fr); }
}

/* === Digital Health Assessment (face scan) numbered steps === */
.pm-steps{display:flex;flex-direction:column;gap:1rem;margin:1rem 0}
.pm-step{display:flex;gap:1rem;align-items:flex-start}
.pm-step-num{flex:0 0 auto;width:2.5rem;height:2.5rem;border-radius:50%;background:#6786F9;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;line-height:1}
.pm-step-body{flex:1 1 auto}
.pm-step-body p{margin:0}

/* ============================================================
   53. WELLBEING / BENEFIT TILES — underline label so tiles read as links
   (client item #3, 2026-08-19)
   ============================================================ */
.benefits-icon-list li a.benefit-link span:not(.benefit-icon-circle) {
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
}

/* ============================================================
   54. PMBs HEADING — smaller trailing "s" so it reads "PMBs" not "PMBS"
   (client item #8, 2026-08-19)
   ============================================================ */
.htc-heading .pmb-s { text-transform: lowercase; font-size: 1em; }

/* ============================================================
   55. NETWORK HOSPITAL TOOL — disclaimer copy white on the black hero
   (client item #9, 2026-08-19)
   ============================================================ */
.pm-nht-disclaimer,
.pm-nht-disclaimer p,
.pm-nht-disclaimer strong { color: #fff !important; }
.pm-nht-disclaimer a,
.pm-nht-disclaimer a:link,
.pm-nht-disclaimer a:visited { color: #D3F12F !important; text-decoration: underline; }
.pm-nht-disclaimer a:hover { color: #fff !important; }

/* ============================================================
   56. MEMBERS HERO — no forced <br> line breaks from tablet-landscape up
   (client 2026-08-19: "remove line breaks in header on desktop").
   Existing shared rule only collapsed them at >=1024px, leaving the
   769-1023px range still stacked. Phones (<769px) keep the 3-line stack.
   ============================================================ */
@media (min-width: 769px) {
  .pm-members-hero h1 br { display: inline-block; width: 0.35em; }
}

/* ============================================================
   57. MEMBERS HERO SUB — widen intro paragraph on desktop so it isn't
   capped at 30rem (cramped 3-line column). ~48rem ≈ 2 comfortable lines.
   (client 2026-08-19). Phones (<769px) keep the narrower width.
   ============================================================ */
@media (min-width: 769px) {
  .pm-members-hero-sub { max-width: 48rem; }
}

/* Item — Network Hospital Tool: breathing room above the DSPN disclaimer
   (client 2026-08-19) */
.pm-nht-disclaimer { margin-top: 2rem; }

/* ============================================================
   58. MEMBERS LIST — kill the dangling divider under the bottom item of the
   LEFT column on the desktop 2-col grid. In a row-flow 2-col grid the two
   column-bottom items are always the last two children; :last-child is
   already borderless, so clear :nth-last-child(2) too. Desktop only.
   (client 2026-08-19) ============================================================ */
@media (min-width: 1024px) {
  .pm-members-list li:nth-last-child(2) { border-bottom: none; }
}

/* ============================================================
   59. PROSELECT (page 227) — wider hero intro paragraph on desktop for the
   longer supplied copy; gap between the two tagline paragraphs.
   (client 2026-08-19) ============================================================ */
.pm-plan-hero-tagline + .pm-plan-hero-tagline { margin-top: 1rem; }
@media (min-width: 1024px) {
  body.page-id-227 .pm-plan-hero-inner   { max-width: 940px; }
  body.page-id-227 .pm-plan-hero-tagline { max-width: 100%; }
}

/* ============================================================
   60. PLAN HERO — match jump-button size to the Benefit Options hero buttons
   (client: plan buttons looked smaller/thinner). Applies to all plan pages.
   + wider hero intro paragraph on desktop for every plan page.
   (client 2026-08-19) ============================================================ */
.pm-plan-jump-btn {
  font-size: 1.2rem;
  border-width: 2px;
  padding: 1.1rem 2rem;
}
@media (min-width: 1024px) {
  .pm-plan-hero-inner   { max-width: 940px; }
  .pm-plan-hero-tagline { max-width: 100%; }
}

/* 61. PLAN pages — small footnote under a benefits section (client 2026-08-19) */
.pm-plan-note { font-size: 0.85rem; opacity: 0.75; font-style: italic; margin: 1.25rem 0 0; }

/* ============================================================
   62. NETWORK OPTION LISTS — network applicability as colour-coded cards
   (client 2026-08-19: same colour language as the Hospital Tool)
   ============================================================ */
.pm-nol-cats { display: grid; grid-template-columns: 1fr; gap: 1rem; margin: 1.5rem 0 1.75rem; }
@media (min-width: 700px) { .pm-nol-cats { grid-template-columns: repeat(3, 1fr); } }
.pm-nol-cat { background: #f5f5f5; border-radius: 14px; padding: 1.3rem 1.4rem; border-top: 5px solid; }
.pm-nol-cat h3 { font-family: var(--font-primary); font-weight: var(--fw-bold); font-size: 1rem; text-transform: uppercase; letter-spacing: 0.03em; margin: 0 0 0.5rem; line-height: 1.2; }
.pm-nol-cat p { font-family: var(--font-primary); font-weight: var(--fw-light); font-size: 0.92rem; line-height: 1.5; margin: 0; color: #333; }
.pm-nol-cat--day { border-top-color: #D3F12F; } .pm-nol-cat--day h3 { color: #111; }
.pm-nol-cat--select { border-top-color: #F79719; } .pm-nol-cat--select h3 { color: #F79719; }
.pm-nol-cat--savvy { border-top-color: #6786F9; } .pm-nol-cat--savvy h3 { color: #6786F9; }

/* 63. Plan hero tagline weight light -> normal (client 2026-08-19) */
.pm-plan-hero-tagline { font-weight: var(--fw-regular); }

/* ============================================================
   64. PLAN HERO jump buttons — fit all 3 on ONE line on desktop
   (client 2026-08-19). Trim size slightly + no-wrap so they share the row.
   ============================================================ */
@media (min-width: 1024px) {
  .pm-plan-jump { flex-wrap: nowrap; gap: 0.85rem; }
  .pm-plan-jump-btn {
    min-width: 0;
    font-size: 1rem;
    padding: 0.85rem 1.15rem;
    letter-spacing: 0.06em;
    white-space: nowrap;
    flex: 0 1 auto;
  }
}

/* 65. Tighten benefit sub-bullets (client 2026-08-19) */
.pm-plan-sublist { margin-top: 0.35rem !important; }
.pm-plan-sublist li { padding-top: 0.1rem !important; padding-bottom: 0.1rem !important; line-height: 1.3 !important; }

/* ============================================================
   INTERMEDIARY HUB (page 31679) — black header, black+lime icons,
   Ruth welcome card, document Download / Send-in-Email cards
   ============================================================ */
body.page-id-31679 .pm-service-hero {
  background-image: linear-gradient(rgba(0,0,0,.45), rgba(0,0,0,.45)), url('images/ihub-hero.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
/* black-and-lime icon circles */
body.page-id-31679 .htc-inner h3 { display: flex; align-items: center; }
body.page-id-31679 .ihub-ic {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.6rem; height: 2.6rem; min-width: 2.6rem; border-radius: 50%;
  background: #111; color: #D3F12F; margin-right: .85rem; font-size: 1.05rem;
}
body.page-id-31679 .htc-note p { display: flex; align-items: flex-start; }
body.page-id-31679 .ihub-ic--sm {
  width: 1.9rem; height: 1.9rem; min-width: 1.9rem; font-size: .8rem;
  margin-right: .6rem; flex: 0 0 auto;
}

/* welcome: copy + photo + contact card */
body.page-id-31679 .ihub-welcome { display: flex; gap: 2.5rem; align-items: flex-start; flex-wrap: wrap; }
body.page-id-31679 .ihub-welcome-copy { flex: 1 1 340px; min-width: 0; }
body.page-id-31679 .ihub-welcome-img { flex: 0 1 320px; text-align: center; }
body.page-id-31679 .ihub-welcome-img img { width: 100%; max-width: 340px; height: auto; display: block; margin: 0 auto; }
body.page-id-31679 .ihub-welcome-contact { margin-top: 1rem; font-size: 1rem; line-height: 1.7; text-align: left; }
body.page-id-31679 .ihub-welcome-contact .ihub-role { color: #5a5a5a; }

/* CTA buttons (email / whatsapp) */
body.page-id-31679 .ihub-cta-row { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: 1.25rem; }
body.page-id-31679 .ihub-cta-btn {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .8rem 1.5rem; border-radius: 999px; background: #111; color: #fff !important;
  text-decoration: none; font-weight: 600; font-size: .95rem;
}
body.page-id-31679 .ihub-cta-btn i { color: #D3F12F; }
body.page-id-31679 .ihub-cta-btn:hover { background: #000; }

/* document cards */
body.page-id-31679 .ihub-doc-list { margin: 1rem 0 2rem; }
body.page-id-31679 .ihub-doc {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem 1.25rem; flex-wrap: wrap;
  padding: 1rem 1.35rem; border: 1px solid #e4e4e4; border-radius: 16px; background: #fff; margin-bottom: .9rem;
}
body.page-id-31679 .ihub-doc-title { font-weight: 600; flex: 1 1 260px; min-width: 0; }
body.page-id-31679 .ihub-doc-actions { display: flex; gap: .6rem; flex: 0 0 auto; }
body.page-id-31679 .ihub-doc-btn {
  display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap;
  padding: .55rem 1.1rem; border-radius: 999px; font-size: .85rem; font-weight: 600; text-decoration: none;
}
body.page-id-31679 .ihub-doc-dl { background: #111; color: #fff !important; }
body.page-id-31679 .ihub-doc-dl i { color: #D3F12F; }
body.page-id-31679 .ihub-doc-email { background: #D3F12F; color: #111 !important; }
body.page-id-31679 .ihub-doc-email i { color: #111; }

@media (max-width: 640px) {
  body.page-id-31679 .ihub-doc { flex-direction: column; align-items: stretch; }
  body.page-id-31679 .ihub-doc-actions { width: 100%; }
  body.page-id-31679 .ihub-doc-btn { flex: 1 1 0; justify-content: center; }
  body.page-id-31679 .ihub-welcome-img { flex-basis: 100%; }
}

body.page-id-31679 .ihub-contact-list { list-style: none; margin: .9rem 0 .5rem; padding: 0; }
body.page-id-31679 .ihub-contact-list li { display: flex; align-items: center; margin-bottom: .55rem; }
body.page-id-31679 .ihub-contact-list a { word-break: break-word; }

/* Intermediary Hub doc cards on mobile: name on top, each button full-width stacked (no big gap) */
@media (max-width: 640px) {
  body.page-id-31679 .ihub-doc { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .85rem; }
  body.page-id-31679 .ihub-doc-title { flex: 0 0 auto; }
  body.page-id-31679 .ihub-doc-actions { width: 100%; flex-direction: column; gap: .6rem; }
  body.page-id-31679 .ihub-doc-btn { width: 100%; flex: none; justify-content: center; }
}

/* FIX: htc-note flex broke text wrapping on mobile — keep the note a normal block, icon inline */
body.page-id-31679 .htc-note p { display: block; }
body.page-id-31679 .ihub-ic--sm { vertical-align: middle; position: relative; top: -1px; }

/* Intermediary Hub: smaller document name on mobile */
@media (max-width: 640px) {
  body.page-id-31679 .ihub-doc-title { font-size: 20px; line-height: 1.3; }
}

/* Intermediary Hub: breathing room between each section heading and its content */
body.page-id-31679 .htc-inner .htc-heading { margin-bottom: 1.9rem; }

/* "Become a Profmed Member" — black button, lime copy, rounded rectangle, below the main menu list */
.pm-menu-become {
  display: inline-block;
  margin: 1.4rem 0 0;
  padding: 0.9rem 1.9rem;
  background: #111;
  color: #D3F12F !important;
  border-radius: 12px;
  text-decoration: none !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 1.05rem;
  transition: background 0.2s;
}
.pm-menu-become:link,
.pm-menu-become:visited { color: #D3F12F !important; }
.pm-menu-become:hover { background: #000; color: #D3F12F !important; }

/* Intermediary Hub: icon section headings sentence-case; indent copy under each on desktop */
body.page-id-31679 .htc-inner h3 { text-transform: none !important; }
@media (min-width: 768px) {
  body.page-id-31679 .htc-inner h3 + p { padding-left: 3.45rem; }
}

/* Quote tool marketing-consent copy → 14px (matches the cf-marketing-consent fix; quote tool uses qt-marketing-consent) */
.qt-marketing-consent,
.qt-marketing-consent span { font-size: 14px !important; line-height: 1.5; }

/* Become-a-Member button: fully rounded pill + space below it */
.pm-menu-become { border-radius: 999px; margin-bottom: 2rem; }

/* FIX: reliable hover fill + colour change on the homepage benefit pills (desktop + mobile) */
.benefit-glance-section .benefit-pill { transition: background .35s ease, color .2s ease, border-color .2s ease; }
.benefit-glance-section .benefit-pill:hover,
.benefit-glance-section .benefit-pill:focus,
.benefit-glance-section .benefit-pill:active { background: var(--wipe) !important; }
.benefit-glance-section .benefit-pill:hover .pill-pre,
.benefit-glance-section .benefit-pill:hover .pill-name,
.benefit-glance-section .benefit-pill:focus .pill-pre,
.benefit-glance-section .benefit-pill:focus .pill-name,
.benefit-glance-section .benefit-pill:active .pill-pre,
.benefit-glance-section .benefit-pill:active .pill-name { color: #fff !important; }

/* Quote result capsule → filled (matches benefit-option capsules), bigger, black SAVVY badge, full-width on mobile */
.qt-result-plan { font-size: 1.05rem; padding: 0.72rem 1.5rem; color: #fff !important; }
.qt-result-plan .qt-pill-savvy { background: #111 !important; color: #fff !important; padding: 0.12rem 0.6rem; }
@media (max-width: 640px) {
  .qt-result-plan { display: flex; width: 100%; justify-content: center; }
}

/* PPS Gap Cover (page 22191): purple textured header + logo instead of text heading */
body.page-id-22191 .pm-service-hero {
  background-image: linear-gradient(rgba(20,6,28,.30), rgba(20,6,28,.30)), url('images/ppsgap-hero.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
body.page-id-22191 .pm-hero-logo { margin: 0; line-height: 0; }
body.page-id-22191 .pm-hero-logo img { display: block; width: 70%; max-width: 360px; height: auto; margin: 0 auto; }

/* PPS Gap Cover (22191): aubergine overlay over the purple image */
body.page-id-22191 .pm-service-hero {
  background-image: linear-gradient(rgba(88,24,69,.55), rgba(88,24,69,.55)), url('images/ppsgap-hero.jpg') !important;
}
/* PPS Wallet (12710): blue leaf header + logo */
body.page-id-12710 .pm-service-hero {
  background-image: linear-gradient(rgba(10,20,42,.30), rgba(10,20,42,.30)), url('images/ppswallet-hero.jpg') !important;
  background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important;
}
.pm-service-hero .pm-hero-logo { margin: 0; line-height: 0; }
.pm-service-hero .pm-hero-logo img { display: block; width: 70%; max-width: 360px; height: auto; margin: 0 auto; }

/* PPS Wallet (12710): overlay in PPS blue #091E35 (rgb 9,30,53) over the blue leaf image */
body.page-id-12710 .pm-service-hero {
  background-image: linear-gradient(rgba(9,30,53,.55), rgba(9,30,53,.55)), url('images/ppswallet-hero.jpg') !important;
}

/* PPS hero logos: larger + drop-shadow so they read clearly over the textured images */
.pm-service-hero .pm-hero-logo img { width: 78%; max-width: 440px; filter: drop-shadow(0 2px 14px rgba(0,0,0,.5)); }

/* Members: make "Additional Benefits" chips the same font size as the "Scheme Information" list above (0.9rem) */
.pm-members-chip { font-size: 0.9rem !important; }

/* Quote result capsule: make "PRO" the same size/height as the plan name (keep it lighter) */
.qt-result-plan .qt-pill-pro { font-size: 1em !important; }

/* ── Digital Health Journey (digital-health-consumer-journey-faqs) — orange hero + app mockups ── */
.pm-dhj-hero {
  background-image: linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.30)), url('images/dhj-hero-bg.jpg') !important;
  background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important;
  padding: 0 !important;
}
.pm-dhj-hero-inner { display: flex; align-items: center; gap: 2.5rem; max-width: 1120px; margin: 0 auto; padding: 4.5rem max(1.5rem, calc((100vw - 1120px)/2)); }
.pm-dhj-hero-copy { flex: 1 1 540px; text-align: left; }
.pm-dhj-eyebrow { color: #FF6E42; text-transform: uppercase; letter-spacing: .22em; font-weight: 700; font-size: .95rem; margin: 0 0 1rem; }
.pm-dhj-hero h1 { color: #fff !important; margin: 0 0 1.25rem; text-align: left; }
.pm-dhj-hero-copy p { color: #ececec !important; font-size: 1.05rem; line-height: 1.7; }
.pm-dhj-hero-img { flex: 0 1 360px; text-align: center; }
.pm-dhj-hero-img img { width: 100%; max-width: 380px; height: auto; display: block; margin: 0 auto; filter: drop-shadow(0 12px 30px rgba(0,0,0,.45)); }
.pm-dhj-faqs .pm-dhj-faq-h { color: #FF6E42; margin: 2.4rem 0 1rem; font-size: 1.3rem; font-weight: 700; }
@media (max-width: 900px) {
  .pm-dhj-hero-inner { flex-direction: column; padding-top: 3rem; padding-bottom: 3rem; }
  .pm-dhj-hero-img { order: 2; flex-basis: auto; margin-top: 1.75rem; }
  .pm-dhj-hero-img img { max-width: 260px; }
}

/* ===== CORPORATE GOVERNANCE LINKS (page-id-106) ===== */
@media (min-width: 1024px) {
  body.page-id-106 .pm-members-list { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 3rem; }
}

/* Corp Gov 'Important Links' anchor offset for fixed nav */
#important-links { scroll-margin-top: 90px; }

/* ===== Comparator side-by-side comparison (v2) ===== */
.pm-cmp-compare { margin-top: .9rem; }
.pm-cmp-chead {
  position: sticky; top: 70px; z-index: 30;
  display: grid; grid-template-columns: 1fr 1fr; gap: .6rem;
  padding: .6rem 0 .7rem; background: var(--color-white);
}
.pm-cmp-chead-cell { display: flex; }
.pm-cmp-chead-cell .pm-cmp-cap { width: 100%; }
.pm-cmp-cap--head { cursor: default; opacity: 1; }
.pm-cmp-chint { font-size: .75rem; color: #666; margin: 0 0 1rem; text-align: center; }

.pm-cmp-secblock { margin-bottom: 1.4rem; }
.pm-cmp-compare .pm-cmp-sec-h {
  color: var(--color-aubergine); font-size: 1.15rem; margin: 0 0 .7rem;
  border-bottom: 2.5px solid var(--color-lime); padding-bottom: .4rem; display: block; text-align: left;
}
.pm-cmp-crow2 { padding: .6rem 0; border-bottom: 1px solid rgba(0,0,0,.08); }
.pm-cmp-crow2:last-child { border-bottom: none; }
.pm-cmp-rowlabel { font-weight: var(--fw-bold); font-size: .9rem; color: #222; margin-bottom: .4rem; }
.pm-cmp-rowvals { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; align-items: stretch; }
.pm-cmp-rowvals--same { grid-template-columns: 1fr; }
.pm-cmp-cell {
  background: #fff; border: 1px solid rgba(0,0,0,.08); border-top: 3px solid var(--cc,#ccc);
  border-radius: 10px; padding: .6rem .7rem; font-size: .85rem; line-height: 1.45; color: #333;
}
.pm-cmp-cell a { color: var(--color-aubergine); text-decoration: underline; }
.pm-cmp-cell--same { border: 1px solid rgba(0,0,0,.08); background: #f4f4f4; color: #444; }
.pm-cmp-cell-empty { color: #bbb; }
.pm-cmp-crow2.is-total .pm-cmp-rowlabel { font-size: 1rem; }
.pm-cmp-crow2.is-total .pm-cmp-cell { font-weight: var(--fw-bold); font-size: 1.05rem; }

@media (min-width: 768px) {
  .pm-cmp-rowlabel { font-size: .95rem; }
  .pm-cmp-cell { font-size: .9rem; padding: .7rem .9rem; }
}

/* ===== Comparator side-by-side (v3) — boxed sections, no row dividers ===== */
.pm-cmp-secblock {
  background: #F1F1F1;
  border-radius: 18px;
  padding: 1.1rem 1.2rem 1.2rem;
  margin-bottom: 1rem;
}
.pm-cmp-secblock:last-child { margin-bottom: 0; }
.pm-cmp-compare .pm-cmp-sec-h { margin-bottom: 1rem; }
/* remove the light-grey lines between rows */
.pm-cmp-crow2 { border-bottom: none; padding: .5rem 0; }
.pm-cmp-crow2:first-of-type { padding-top: .2rem; }
/* merged 'same' cell reads as a white shared cell on the grey card */
.pm-cmp-cell--same { background: #fff; border: 1px solid rgba(0,0,0,.10); }

/* ===== Comparator contributions — single capsule breakdown (v4) ===== */
.pm-cmp-cline { display: flex; justify-content: space-between; gap: 1rem; padding: .18rem 0; font-size: .85rem; line-height: 1.4; }
.pm-cmp-cline span { font-weight: var(--fw-semibold); white-space: nowrap; }
.pm-cmp-cline--total { margin-top: .4rem; padding-top: .45rem; border-top: 1px solid rgba(0,0,0,.14); font-weight: var(--fw-bold); }
.pm-cmp-cline--total span { font-weight: var(--fw-bold); }
.pm-cmp-cnote { font-size: .72rem; color: #666; margin-top: .5rem; line-height: 1.4; }

/* ===== Comparator contributions — stack label above price (v5) ===== */
.pm-cmp-secblock--contrib .pm-cmp-cline { display: block; padding: .4rem 0; }
.pm-cmp-secblock--contrib .pm-cmp-cline span { display: block; margin-top: .1rem; font-weight: var(--fw-bold); white-space: normal; }
.pm-cmp-secblock--contrib .pm-cmp-cline--total { margin-top: .55rem; padding-top: .55rem; }

/* ===== Comparator contribution note (v6) ===== */
.pm-cmp-cnote {
  font-size: 0.7rem;
  color: #666;
  margin-top: .5rem;
  line-height: 1.2;
}

/* ===== Comparator contributions — larger price (v7) ===== */
.pm-cmp-secblock--contrib .pm-cmp-cline span { font-size: 1.1rem; }
.pm-cmp-secblock--contrib .pm-cmp-cline--total span { font-size: 1.25rem; }

/* ===== Comparator benefit cells — text size + bullet styling (v8) ===== */
.pm-cmp-secblock:not(.pm-cmp-secblock--contrib) .pm-cmp-cell {
  font-size: 0.8rem;
  line-height: 1rem;
}
.pm-cmp-cell ul { list-style: none; margin: .35rem 0 0; padding: 0; }
.pm-cmp-cell li {
  position: relative;
  padding-left: 1rem;
  margin: 0 0 .5rem;
  line-height: 1.15rem;
}
.pm-cmp-cell li:last-child { margin-bottom: 0; }
.pm-cmp-cell li::before {
  content: '' !important;
  position: absolute;
  left: 0; top: .4em;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--color-aubergine);
  font-size: inherit;
}

/* ===== Comparator section headings — black pill (v9) ===== */
.pm-cmp-compare .pm-cmp-sec-h {
  color: #000;
  font-size: 1.15rem;
  margin: 0 0 .7rem;
  border: 2.5px solid #000;
  padding: .2rem;
  display: block;
  text-align: center;
  border-radius: 50px;
}

/* ===== Comparator selected tick — robust lime SVG (v10) ===== */
.pm-cmp-cap.is-selected::after {
  content: "";
  position: absolute; top: -7px; right: -7px; width: 22px; height: 22px;
  border-radius: 50%; background: #000;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D3F12F' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'><path d='M5 13l4 4L19 7'/></svg>");
  background-repeat: no-repeat; background-position: center; background-size: 13px 13px;
  display: block;
}
/* rowlabel — centered uppercase (v11) */
.pm-cmp-rowlabel {
  font-weight: var(--fw-bold);
  font-size: .9rem;
  color: #222;
  margin-bottom: .4rem;
  text-transform: uppercase;
  text-align: center;
}

/* ===== Comparator floating options bar — visible when stuck (v12) ===== */
.pm-cmp-chead {
  padding: .75rem 0 .8rem;
  box-shadow: 0 8px 14px -8px rgba(0,0,0,.28);
}

/* ===== Comparator section card padding (v13) ===== */
.pm-cmp-secblock {
  background: #F1F1F1;
  border-radius: 18px;
  padding: 1rem 0.5rem 1rem;
}

/* ===== Plain content lists in htc sections (v14) ===== */
.htc-section ul:not([class]) li {
  font-family: var(--font-primary);
  font-weight: normal;
  font-size: 0.8rem;
  line-height: 1.1rem;
  color: #333;
  position: relative;
  padding-left: 1rem;
  margin-bottom: 0.35rem;
}

/* ===== Comparator — vertically centre cell content (v15) ===== */
.pm-cmp-cell { display: flex; flex-direction: column; justify-content: center; }

/* ===== Comparator — contributions cells align to top (v16) ===== */
.pm-cmp-secblock--contrib .pm-cmp-cell { justify-content: flex-start; }

/* ===== Comparator bullets — smaller + aligned (v17) ===== */
.pm-cmp-cell li::before { top: .55em; width: 4px; height: 4px; }
/* ===== Comparator header capsules — SAVVY stacked + centred like step 1 (v18) ===== */
.pm-cmp-cap--head { flex-direction: column; gap: .12rem; }
.pm-cmp-cap--head .pm-cmp-savvy { margin-left: 0; margin-top: .1rem; }

/* ── "& SAVVY" pill beneath plan name (added 2026-09-18) ── */
.bo-plan-header { flex-direction: column; gap: 0.6rem; }
.bo-plan-savvy {
    display: inline-block;
    background: rgba(0,0,0,0.22);
    color: #fff !important;
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    font-size: 0.72rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 0.32em 1.15em;
    border-radius: 999px;
    line-height: 1;
    text-decoration: none !important;
    white-space: nowrap;
}

/* ── "& SAVVY" pill centring fix (2026-09-18) ── */
.bo-plan-header, a.bo-plan-header { text-align: center; }
.bo-plan-savvy { margin-top: 0.6rem; }

.bo-plan-savvy { font-size: 1rem; }

.bo-plan-savvy { padding: 0.45em 1.15em 0.33em; line-height: 1; }

/* ── Join Profmed page updates (2026-09-18) ── */
/* 1. Light header background on desktop (was solid black) */
@media (min-width: 769px) {
    .pm-join-hero    { background: #F4F1F6; }
    .pm-join-hero h1 { color: #581845; }
    .pm-join-hero p  { color: #6B5B73; }
}
/* 2. Paragraph margin & padding fix */
.pm-join-body            { padding-top: 2.5rem; padding-bottom: 1.5rem; }
.pm-join-body p          { margin: 0 0 1.25rem; }
.pm-join-body p:last-child { margin-bottom: 0; }
/* 3. Primary action buttons (match live join actions) */
.pm-join-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    padding-inline: max(1.5rem, (100vw - 1120px) / 2);
    padding-bottom: 2.5rem;
}
.pm-join-btn {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.78rem;
    line-height: 1;
    padding: 0.95em 1.6em;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    border: 2px solid #581845;
    color: #581845 !important;
    background: transparent;
    text-decoration: none !important;
    transition: background 0.2s, color 0.2s;
}
.pm-join-btn:hover { background: #581845; color: #fff !important; }
.pm-join-btn--primary { background: #581845; color: #fff !important; }
.pm-join-btn--primary:hover { background: #3F0F33; color: #fff !important; }

/* ── Join page action buttons → full-width rounded capsules (2026-09-18) ── */
.pm-join-actions {
    flex-direction: column;
    align-items: stretch;
    max-width: 760px;
    gap: 0.85rem;
}
.pm-join-btn {
    width: 100%;
    border-radius: 999px;
    justify-content: center;
    text-align: center;
    box-sizing: border-box;
    font-size: 0.82rem;
    padding: 1.05em 1.6em;
}

/* ── Main-menu CTA group: 3 stacked full-width pill buttons (2026-09-18) ── */
.pm-menu-cta-group {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    margin: 1.4rem 0 2rem;
    align-items: stretch;
}
.pm-menu-become { box-sizing: border-box; }
.pm-menu-cta-group .pm-menu-become {
    margin: 0;
    display: block;
    width: 100%;
    text-align: center;
}
.pm-menu-become--alt {
    background: transparent;
    color: #111 !important;
    border: 2px solid #111;
}
.pm-menu-become--alt:link,
.pm-menu-become--alt:visited { color: #111 !important; }
.pm-menu-become--alt:hover { background: #111; color: #D3F12F !important; }

/* ── Menu CTA buttons: left-aligned + quarter-width on desktop only (2026-09-18) ── */
@media (min-width: 769px) {
    .pm-menu-cta-group { align-items: flex-start; }
    .pm-menu-cta-group .pm-menu-become { width: 25%; min-width: 200px; }
}

/* ================================================================
   NINJA FORMS — skinned to Phase-1 form design (.cf-* look) 2026-09-18
   Applies to every [ninja_form] on the site. Single-column, 480px,
   pill submit, soft-bordered inputs — matches the custom pm-contact-form.
================================================================ */
.nf-form-cont { font-family: var(--font-primary); }
.nf-form-content { max-width: 480px; margin: 0 auto; padding: 0 !important; }
.nf-form-content .nf-field-container { margin-bottom: 0.9rem !important; }

/* Labels */
.nf-form-content .nf-field-label label {
    font-family: var(--font-primary);
    font-size: 0.82rem !important;
    font-weight: var(--fw-bold) !important;
    letter-spacing: 0.03em;
    color: var(--color-black) !important;
    margin-bottom: 0.35rem !important;
    display: block;
    line-height: 1.35;
}
.nf-form-content .ninja-forms-req-symbol { color: #FF612F !important; }

/* Text-like inputs, textarea, select */
.nf-form-content input[type=text],
.nf-form-content input[type=email],
.nf-form-content input[type=tel],
.nf-form-content input[type=number],
.nf-form-content input[type=password],
.nf-form-content input[type=url],
.nf-form-content input[type=date],
.nf-form-content textarea,
.nf-form-content select {
    width: 100% !important;
    border: 1.5px solid rgba(0,0,0,0.18) !important;
    border-radius: 8px !important;
    padding: 0.9rem 1rem !important;
    font-family: var(--font-primary) !important;
    font-size: 0.9rem !important;
    color: var(--color-text) !important;
    background: #fff !important;
    box-sizing: border-box !important;
    -webkit-appearance: none; appearance: none;
    line-height: 1.3 !important;
    height: auto !important;
    box-shadow: none !important;
}
.nf-form-content textarea { min-height: 110px !important; resize: vertical; }
.nf-form-content input:focus,
.nf-form-content textarea:focus,
.nf-form-content select:focus { outline: none; border-color: var(--color-black) !important; }
.nf-form-content ::placeholder { color: #bbb !important; }

/* Select arrow */
.nf-form-content select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23333' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 1rem center !important;
    padding-right: 2.5rem !important;
    cursor: pointer;
}

/* Checkboxes / radios / lists */
.nf-form-content .checkbox-wrap .nf-field-label label,
.nf-form-content .listcheckbox-wrap label,
.nf-form-content .listradio-wrap label { font-weight: var(--fw-light) !important; text-transform: none; font-size: 0.85rem !important; }

/* Submit button → black pill */
.nf-form-content .submit-container input[type=button],
.nf-form-content input.ninja-forms-field[type=button],
.nf-form-content .nf-element[type=button] {
    display: block !important;
    width: 100% !important;
    text-align: center;
    padding: 1.05rem 2rem !important;
    font-size: 1.1rem !important;
    letter-spacing: 0.12em !important;
    border-radius: 100px !important;
    background: var(--color-black) !important;
    color: #fff !important;
    border: none !important;
    font-family: var(--font-primary) !important;
    font-weight: var(--fw-bold) !important;
    text-transform: uppercase !important;
    cursor: pointer;
    height: auto !important;
    transition: opacity 0.2s;
    margin-top: 0.5rem;
}
.nf-form-content .submit-container input[type=button]:hover { opacity: 0.85 !important; }

/* Errors */
.nf-form-content .nf-error-msg { color: #E02B2B !important; font-family: var(--font-primary); font-size: 0.78rem !important; margin-top: 0.25rem; }
.nf-form-content .nf-error.field-wrap input,
.nf-form-content .nf-error.field-wrap textarea,
.nf-form-content .nf-error.field-wrap select { border-color: #E02B2B !important; }

/* Field descriptions */
.nf-form-content .nf-field-description,
.nf-form-content .nf-field-description p { font-size: 0.78rem !important; color: #777 !important; line-height: 1.5; }

/* Success / response message */
.nf-response-msg,
.nf-form-content .nf-response-msg,
.ninja-forms-success-msg {
    padding: 1rem 1.2rem !important;
    border-radius: 10px !important;
    background: rgba(103,134,249,0.10) !important;
    border: 1.5px solid #6786F9 !important;
    color: var(--color-black) !important;
    font-family: var(--font-primary) !important;
    font-size: 0.95rem !important;
    line-height: 1.55;
}

/* Section/HTML heading fields inside NF → match cf-section-title */
.nf-form-content .html-container .nf-field-element h2,
.nf-form-content .html-container .nf-field-element h3 {
    font-family: var(--font-primary);
    font-weight: var(--fw-bold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-black);
    font-size: 1rem;
    margin: 1.5rem 0 0.75rem;
}

/* === v3.9.54 (2026-09-29) — skin Ninja text/email/tel/date inputs to match the qt- quote form
      (previously only <select> and <textarea> were skinned, so text inputs rendered unstyled) === */
.nf-form-content .nf-field-element input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.nf-form-content .nf-field-element textarea {
  width: 100% !important;
  background: #fff !important;
  border: 1.5px solid rgba(0,0,0,0.14) !important;
  border-radius: 10px !important;
  padding: 0.9rem 1rem !important;
  font-family: var(--font-primary) !important;
  font-size: 0.92rem !important;
  color: var(--color-black) !important;
  box-shadow: none !important;
  -webkit-appearance: none;
  appearance: none;
}
.nf-form-content .nf-field-element input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]):focus,
.nf-form-content .nf-field-element textarea:focus {
  outline: none !important;
  border-color: var(--color-black) !important;
}
.nf-form-content select { border-radius: 10px !important; border-color: rgba(0,0,0,0.14) !important; }
.nf-form-content .nf-field-element ::placeholder,
.nf-form-content .nf-field-element input::placeholder { color: #bbb !important; opacity: 1; }
/* === end v3.9.54 === */