/* =======================================================================
   FINDR – Full Compat CSS (scoped to the Findr page only)
   Matches the look/feel from https://profmed.co.za/findr/
   ======================================================================= */

/* 1) Fonts (TTF) -------------------------------------------------------- */
@font-face {
  font-family: 'Josefin Sans';
  src: url('/wp-content/themes/twentytwentyfive-child/fonts/JosefinSans-Regular.ttf') format('truetype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Josefin Sans';
  src: url('/wp-content/themes/twentytwentyfive-child/fonts/JosefinSans-SemiBold.ttf') format('truetype');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Josefin Sans';
  src: url('/wp-content/themes/twentytwentyfive-child/fonts/JosefinSans-Bold.ttf') format('truetype');
  font-weight: 700; font-style: normal; font-display: swap;
}

/* 2) Page scope + tokens ------------------------------------------------ */
body.findr-shell {
  --findr-teal: #12B3A9;
  --findr-teal-2: #4BAEA6;
  --findr-dark: #3B4148;

  margin: 0; padding: 0; background: #fff;
  font-family: 'Josefin Sans', Arial, sans-serif;
  color: #1d1d1f;
}

/* Remove TT5 outer padding on this page */
body.findr-shell .wp-site-blocks,
body.findr-shell main { margin: 0 !important; padding: 0 !important; }

/* 3) Base elements ------------------------------------------------------ */
body.findr-shell img { max-width: 100%; height: auto; display: block; }
body.findr-shell a { color: var(--findr-teal); text-decoration: none; }
body.findr-shell a:hover { text-decoration: underline; }

/* Typography */
body.findr-shell h1,
body.findr-shell h2,
body.findr-shell h3,
body.findr-shell .findr-nav a,
body.findr-shell .findr-btn {
  font-family: 'Josefin Sans', Arial, sans-serif;
}
body.findr-shell h1 {
  font-weight: 700; line-height: 1.15;
  font-size: clamp(28px, 4vw, 44px); margin: 24px 0 8px;
}
body.findr-shell h2 {
  font-weight: 600; line-height: 1.25;
  font-size: clamp(22px, 3vw, 28px); margin: 20px 0 8px;
}
body.findr-shell h3 {
  font-weight: 600; line-height: 1.3;
  font-size: 20px; margin: 16px 0 8px;
}
body.findr-shell p {
  margin: 0 0 14px; font-size: 16px; line-height: 1.55;
}

/* Lists – teal bullets, tighter rhythm (matches old page) */
body.findr-shell ul {
  list-style: disc;
  padding-left: 1.25rem;
  margin: 0 0 1rem 0;
  font-size: 16px;
}

/* Optional list variants */
body.findr-shell ul.findr-list--compact li { margin-bottom: .35rem; }
body.findr-shell ul.findr-list--check { list-style: none; padding-left: 0; }
body.findr-shell ul.findr-list--check li { position: relative; padding-left: 1.6rem; margin-bottom: .5rem; }
body.findr-shell ul.findr-list--check li::before {
  content: "✓"; position: absolute; left: 0; top: .1rem; line-height: 1;
  color: var(--findr-teal); font-weight: 700;
}

/* Section container width like Profmed page */
.findr-container { max-width: 1200px; margin: 0 auto; padding: 32px 20px; }

/* 4) Header / Nav / CTAs ------------------------------------------------ */
body.findr-shell .findr-header {
  position: sticky; top: 0; z-index: 999; background: #fff;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
body.findr-shell .findr-header__inner {
  max-width: 1200px; margin: 0 auto; padding: 16px 20px;
  display: flex; align-items: center; gap: 24px;
}
body.findr-shell .findr-logo img { height: 40px; width: auto; }

/* Desktop nav strip (uppercase teal links) */
body.findr-shell .findr-nav {
  display: flex !important; gap: 40px;
  margin-left: auto; margin-right: 24px;
}
body.findr-shell .findr-nav a {
  font-weight: 600; letter-spacing: .02em;
  text-transform: uppercase; font-size: 14px;
  text-decoration: none; color: var(--findr-teal); white-space: nowrap;
}
body.findr-shell .findr-nav a:hover { opacity: .85; }

/* CTAs */
body.findr-shell .findr-cta { display: flex; align-items: center; gap: 12px; }
body.findr-shell .findr-btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 44px; padding: 0 18px; border-radius: 999px;
  font-weight: 700; font-size: 14px; letter-spacing: .02em; color: #fff;
}
body.findr-shell .findr-btn--dark { background: var(--findr-dark); }
body.findr-shell .findr-btn--teal { background: var(--findr-teal-2); }

/* 5) Mobile nav drawer -------------------------------------------------- */
body.findr-shell .findr-burger {
  display: none; width: 44px; height: 44px; border: 0; background: transparent; padding: 0;
}
body.findr-shell .findr-burger span {
  display: block; height: 2px; margin: 7px 8px; background: var(--findr-dark);
}
body.findr-shell .findr-mobile {
  background: #fff; border-top: 1px solid rgba(0,0,0,.06); padding: 12px 20px;
}
body.findr-shell .findr-mobile__nav { display: grid; gap: 12px; padding: 8px 0; }
body.findr-shell .findr-mobile__nav a {
  color: var(--findr-teal); text-decoration: none; font-weight: 700;
  text-transform: uppercase; font-size: 14px;
}
body.findr-shell .findr-mobile__cta { display: flex; gap: 10px; padding: 12px 0 4px; }
body.findr-shell .findr-header--scrolled { box-shadow: 0 6px 18px rgba(0,0,0,.06); }
body.findr-shell.findr-menu-open { overflow: hidden; }

/* 6) WPBakery fixes seen on old page ----------------------------------- */
/* Tabs (outline style) */
body.findr-shell .vc_tta.vc_tta-style-outline .vc_tta-panel-body,
body.findr-shell .vc_tta.vc_tta-style-outline .vc_tta-panel-heading,
body.findr-shell .vc_tta.vc_tta-style-outline .vc_tta-tab > a {
  border-bottom: 2px solid #fff !important; border-top: 0 !important;
  border-left: 0 !important; border-right: 0 !important;
}
body.findr-shell .vc_tta-color-white.vc_tta-style-outline .vc_tta-panel .vc_tta-panel-title > a:hover {
  color: #50AF9F !important; background: #fff !important;
}

/* Video widgets – remove default padding */
body.findr-shell .wpb_video_widget .wpb_wrapper iframe { padding: 0 !important; }

/* CTA block alignment from old page */
body.findr-shell #cta_block .vc_column-inner { text-align: end !important; padding-right: 40px !important; }

/* 7) Ninja Forms – white-on-dark variant (if used) ---------------------- */
body.findr-shell #contact_form_white .nf-form-content select.ninja-forms-field {
  color: #fff !important; font-weight: 800 !important;
}
body.findr-shell #contact_form_white .nf-form-content .list-select-wrap .nf-field-element > div,
body.findr-shell #contact_form_white .nf-form-content input:not([type="button"]),
body.findr-shell #contact_form_white .nf-form-content textarea {
  background: transparent !important;
  border: 2px solid #fff !important;
  color: #fff !important;
}

/* 8) Responsive --------------------------------------------------------- */
@media (max-width: 1024px) {
  body.findr-shell .findr-nav { display: block !important; }
  body.findr-shell .findr-burger { display: inline-block; }

  /* Mobile spacing parity with old page */
  body.findr-shell .vc_row { padding-left: 10px; padding-right: 10px; }
  body.findr-shell .vc_column_container > .vc_column-inner { padding-left: 0px; padding-right: 0px; }
}

/* 9) WPBakery general spacing ------------------------------------------ */
body.findr-shell .vc_row { margin-left: 0; margin-right: 0; }
body.findr-shell .wpb_button,
body.findr-shell .wpb_content_element,
body.findr-shell ul.wpb_thumbnails-fluid > li { margin-bottom: 20px; }

/* 10) Utilities for content CTAs ---------------------------------------- */
body.findr-shell a.findr-btn { color: #fff !important; }

/* =========================================================
   Hover States (Findr page)
   ========================================================= */

/* Buttons */
body.findr-shell .findr-btn {
  transition: background-color .25s ease, opacity .25s ease, color .25s ease;
}

body.findr-shell .findr-btn--dark:hover {
  background-color: #2a2f34; /* darker than --findr-dark */
  opacity: .95;
}

body.findr-shell .findr-btn--teal:hover {
  background-color: #3b9f96; /* darker than --findr-teal-2 */
  opacity: .95;
}

/* Nav links */
body.findr-shell .findr-nav a {
  transition: color .25s ease, opacity .25s ease;
}
body.findr-shell .findr-nav a:hover {
  opacity: .85;
  text-decoration: none; /* old site suppressed underline */
}

/* Generic inline links */
body.findr-shell a {
  transition: color .25s ease, opacity .25s ease;
}
body.findr-shell a:hover {
  opacity: .85;
  text-decoration: underline;
}